solid-ui 2.4.22-be8b238b → 2.4.22-c7419dec

package/dist/main.js

@@ -2745,8 +2745,7 @@ function updatePromise(del, ins) {
     }); // callback
 
   }); // promise
-} // export findBookmarkDocument,
-
+}
 /*         Bookmarking
  */
 
@@ -7105,8 +7104,9 @@ var _debug = __webpack_require__(/*! ./debug */ "./lib/debug.js");
  */
 
 /* eslint-disable multiline-ternary */
-// Do not export. lways us this module to find the icons, as it varies
-var iconsOnGithub = 'https://solidos.github.io/solid-ui/src';
+// Do not export. Always us this module to find the icons, as they vary
+var iconsOnGithub = 'https://solidos.github.io/solid-ui/src'; // changed org 2022-05
+
 var icons = module.scriptURI // Firefox extension
 ? {
   iconBase: module.scriptURI.slice(0, module.scriptURI.lastIndexOf('/')) + '/icons/',
@@ -7754,7 +7754,9 @@ exports.loginStatusBox = loginStatusBox;
 exports.newAppInstance = newAppInstance;
 exports.registrationControl = registrationControl;
 exports.registrationList = registrationList;
+exports.renderScopeHeadingRow = renderScopeHeadingRow;
 exports.renderSignInPopup = renderSignInPopup;
+exports.scopeLabel = scopeLabel;
 exports.selectWorkspace = selectWorkspace;
 
 var _regenerator = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/@babel/runtime/regenerator/index.js"));
@@ -7775,7 +7777,7 @@ var _signup = __webpack_require__(/*! ../signup/signup.js */ "./lib/signup/signu
 
 var _style = __webpack_require__(/*! ../style */ "./lib/style.js");
 
-var _index = __webpack_require__(/*! ../utils/index */ "./lib/utils/index.js");
+var utils = _interopRequireWildcard(__webpack_require__(/*! ../utils */ "./lib/utils/index.js"));
 
 var widgets = _interopRequireWildcard(__webpack_require__(/*! ../widgets */ "./lib/widgets/index.js"));
 
@@ -7783,39 +7785,20 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-/* eslint-disable camelcase */
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 
-/**
- * Signing in, signing up, profile and preferences reloading
- * Type index management
- *
- * Many functions in this module take a context object which
- * holds various RDF symbols, add to it, and return a promise of it.
- *
- * * `me`                RDF symbol for the user's WebID
- * * `publicProfile`     The user's public profile, iff loaded
- * * `preferencesFile`   The user's personal preference file, iff loaded
- * * `index.public`      The user's public type index file
- * * `index.private`     The user's private type index file
- *
- * Not RDF symbols:
- * * `noun`            A string in english for the type of thing -- like "address book"
- * * `instance`        An array of nodes which are existing instances
- * * `containers`      An array of nodes of containers of instances
- * * `div`             A DOM element where UI can be displayed
- * * `statusArea`      A DOM element (opt) progress stuff can be displayed, or error messages
- * *
- * * Vocabulary:  "load" loads a file if it exists;
- * *  'Ensure" CREATES the file if it does not exist (if it can) and then loads it.
- * @packageDocumentation
- */
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
+var store = _solidLogic.solidLogicSingleton.store;
 /**
  * Resolves with the logged in user's WebID
  *
  * @param context
  */
 // used to be logIn
+
 function ensureLoggedIn(context) {
   var me = _solidLogic.authn.currentUser();
 
@@ -7857,7 +7840,7 @@ function ensureLoggedIn(context) {
 // used to be logInLoadPreferences
 
 
-function ensureLoadedPreferences(_x2) {
+function ensureLoadedPreferences(_x) {
   return _ensureLoadedPreferences.apply(this, arguments);
 }
 /**
@@ -8004,14 +7987,17 @@ function _ensureLoadedPreferences() {
   return _ensureLoadedPreferences.apply(this, arguments);
 }
 
-function ensureLoadedProfile(_x3) {
+function ensureLoadedProfile(_x2) {
   return _ensureLoadedProfile.apply(this, arguments);
 }
 /**
- * Returns promise of context with arrays of symbols
- *
- * 2016-12-11 change to include forClass arc a la
- * https://github.com/solid/solid/blob/main/proposals/data-discovery.md
+  * Returns promise of context with arrays of symbols
+  *
+  * leaving the `isPublic` param undefined will bring in community index things, too
+  */
+
+/**
+ * @deprecated Since version 2.4.17 Will be deleted in version 3.0. Use solid-logic getAppInstances instead.
  */
 
 
@@ -8076,210 +8062,141 @@ function _ensureLoadedProfile() {
   return _ensureLoadedProfile.apply(this, arguments);
 }
 
-function findAppInstances(_x4, _x5, _x6) {
+function findAppInstances(_x3, _x4, _x5) {
   return _findAppInstances.apply(this, arguments);
 }
-/**
- * UI to control registration of instance
- */
-
 
 function _findAppInstances() {
   _findAppInstances = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6(context, theClass, isPublic) {
-    var visibility, index, thisIndex, registrations, instances, containers, unique, e, i, cont;
+    var items;
     return _regenerator["default"].wrap(function _callee6$(_context6) {
       while (1) {
         switch (_context6.prev = _context6.next) {
           case 0:
-            unique = function _unique(arr) {
-              return Array.from(new Set(arr));
-            };
+            debug.warn('Calling deprecated function findAppInstances! Use solid-logic getAppInstances instead.');
 
-            if (!(isPublic === undefined)) {
+            if (!context.me) {
               _context6.next = 7;
               break;
             }
 
             _context6.next = 4;
-            return findAppInstances(context, theClass, true);
+            return (0, _solidLogic.getScopedAppInstances)(store, theClass, context.me);
 
           case 4:
-            _context6.next = 6;
-            return findAppInstances(context, theClass, false);
-
-          case 6:
-            return _context6.abrupt("return", context);
-
-          case 7:
-            _context6.prev = 7;
-            _context6.next = 10;
-            return isPublic ? ensureLoadedProfile(context) : ensureLoadedPreferences(context);
-
-          case 10:
-            _context6.next = 15;
+            _context6.t0 = _context6.sent;
+            _context6.next = 8;
             break;
 
-          case 12:
-            _context6.prev = 12;
-            _context6.t0 = _context6["catch"](7);
-            widgets.complain(context, "loadIndex: login and load problem ".concat(_context6.t0));
-
-          case 15:
-            // console.log('awaited LogInLoad!', context)
-            visibility = isPublic ? 'public' : 'private';
-            _context6.prev = 16;
-            _context6.next = 19;
-            return (0, _solidLogic.loadIndex)(context, isPublic);
-
-          case 19:
-            _context6.next = 24;
-            break;
-
-          case 21:
-            _context6.prev = 21;
-            _context6.t1 = _context6["catch"](16);
-            debug.error(_context6.t1);
-
-          case 24:
-            index = context.index;
-            thisIndex = index[visibility];
-            registrations = thisIndex.map(function (ix) {
-              return _solidLogic.solidLogicSingleton.store.each(undefined, ns.solid('forClass'), theClass, ix);
-            }).reduce(function (acc, curr) {
-              return acc.concat(curr);
-            }, []);
-            instances = registrations.map(function (reg) {
-              return _solidLogic.solidLogicSingleton.store.each(reg, ns.solid('instance'));
-            }).reduce(function (acc, curr) {
-              return acc.concat(curr);
-            }, []);
-            containers = registrations.map(function (reg) {
-              return _solidLogic.solidLogicSingleton.store.each(reg, ns.solid('instanceContainer'));
-            }).reduce(function (acc, curr) {
-              return acc.concat(curr);
-            }, []);
-            context.instances = context.instances || [];
-            context.instances = unique(context.instances.concat(instances));
-            context.containers = context.containers || [];
-            context.containers = unique(context.containers.concat(containers));
-
-            if (containers.length) {
-              _context6.next = 35;
-              break;
-            }
-
-            return _context6.abrupt("return", context);
-
-          case 35:
-            _context6.prev = 35;
-            _context6.next = 38;
-            return _solidLogic.solidLogicSingleton.load(containers);
-
-          case 38:
-            _context6.next = 45;
-            break;
-
-          case 40:
-            _context6.prev = 40;
-            _context6.t2 = _context6["catch"](35);
-            e = new Error("[FAI] Unable to load containers".concat(_context6.t2));
-            debug.log(e); // complain
-
-            widgets.complain(context, "Error looking for ".concat(_index.utils.label(theClass), ":  ").concat(_context6.t2)); // but then ignore it
-            // throw new Error(e)
+          case 7:
+            _context6.t0 = [];
 
-          case 45:
-            i = 0;
+          case 8:
+            items = _context6.t0;
 
-          case 46:
-            if (!(i < containers.length)) {
-              _context6.next = 56;
-              break;
+            if (isPublic === true) {
+              // old API - not recommended!
+              items = items.filter(function (item) {
+                return item.scope.label === 'public';
+              });
+            } else if (isPublic === false) {
+              items = items.filter(function (item) {
+                return item.scope.label === 'private';
+              });
             }
 
-            cont = containers[i];
-            _context6.t3 = context.instances;
-            _context6.next = 51;
-            return _solidLogic.solidLogicSingleton.getContainerMembers(cont.value);
-
-          case 51:
-            _context6.t4 = _context6.sent.map(function (uri) {
-              return _solidLogic.solidLogicSingleton.store.sym(uri);
+            context.instances = items.map(function (item) {
+              return item.instance;
             });
-            context.instances = _context6.t3.concat.call(_context6.t3, _context6.t4);
-
-          case 53:
-            i++;
-            _context6.next = 46;
-            break;
-
-          case 56:
             return _context6.abrupt("return", context);
 
-          case 57:
+          case 12:
           case "end":
             return _context6.stop();
         }
       }
-    }, _callee6, null, [[7, 12], [16, 21], [35, 40]]);
+    }, _callee6);
   }));
   return _findAppInstances.apply(this, arguments);
 }
 
-function registrationControl(_x7, _x8, _x9) {
-  return _registrationControl.apply(this, arguments);
+function scopeLabel(context, scope) {
+  var mine = context.me && context.me.sameTerm(scope.agent);
+  var name = mine ? '' : utils.label(scope.agent) + ' ';
+  return "".concat(name).concat(scope.label);
 }
 /**
- * UI to List at all registered things
+ * UI to control registration of instance
  */
 
 
+function registrationControl(_x6, _x7, _x8) {
+  return _registrationControl.apply(this, arguments);
+}
+
 function _registrationControl() {
   _registrationControl = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7(context, instance, theClass) {
-    var dom, box, context2, msg, tbody, form, registrationStatements, index, statements, _msg;
+    var registrationStatements, renderScopeCheckbox, dom, box, me, scopes, msg, tbody, form, _iterator, _step, scope, row;
 
     return _regenerator["default"].wrap(function _callee7$(_context7) {
       while (1) {
         switch (_context7.prev = _context7.next) {
           case 0:
+            renderScopeCheckbox = function _renderScopeCheckbox(scope) {
+              var statements = registrationStatements(scope.index);
+              var name = scopeLabel(context, scope);
+              var label = "".concat(name, " link to this ").concat(context.noun);
+              return widgets.buildCheckboxForm(context.dom, _solidLogic.solidLogicSingleton.store, label, null, statements, form, scope.index);
+            };
+
+            registrationStatements = function _registrationStatemen(index) {
+              var registrations = _solidLogic.solidLogicSingleton.getRegistrations(instance, theClass);
+
+              var reg = registrations.length ? registrations[0] : widgets.newThing(index);
+              return [(0, _rdflib.st)(reg, ns.solid('instance'), instance, index), (0, _rdflib.st)(reg, ns.solid('forClass'), theClass, index)];
+            };
+
+            /// / body of registrationControl
             dom = context.dom;
 
             if (!(!dom || !context.div)) {
-              _context7.next = 3;
+              _context7.next = 5;
               break;
             }
 
-            return _context7.abrupt("return", context);
+            throw new Error('registrationControl: need dom and div');
 
-          case 3:
+          case 5:
             box = dom.createElement('div');
             context.div.appendChild(box);
             context.me = _solidLogic.authn.currentUser(); // @@
 
-            if (context.me) {
-              _context7.next = 9;
+            me = context.me;
+
+            if (me) {
+              _context7.next = 12;
               break;
             }
 
             box.innerHTML = '<p style="margin:2em;">(Log in to save a link to this)</p>';
             return _context7.abrupt("return", context);
 
-          case 9:
-            _context7.prev = 9;
-            _context7.next = 12;
-            return (0, _solidLogic.ensureTypeIndexes)(context);
-
           case 12:
-            context2 = _context7.sent;
-            _context7.next = 19;
-            break;
+            _context7.prev = 12;
+            _context7.next = 15;
+            return (0, _solidLogic.loadAllTypeIndexes)(store, me);
 
           case 15:
-            _context7.prev = 15;
-            _context7.t0 = _context7["catch"](9);
+            scopes = _context7.sent;
+            _context7.next = 23;
+            break;
+
+          case 18:
+            _context7.prev = 18;
+            _context7.t0 = _context7["catch"](12);
 
             if (context.div && context.preferencesFileError) {
-              msg = '(Preferences not available)';
+              msg = '(Lists of stuff not available)';
               context.div.appendChild(dom.createElement('p')).textContent = msg;
             } else if (context.div) {
               msg = "registrationControl: Type indexes not available: ".concat(_context7.t0);
@@ -8287,168 +8204,201 @@ function _registrationControl() {
             }
 
             debug.log(msg);
+            return _context7.abrupt("return", context);
 
-          case 19:
-            box.innerHTML = '<table><tbody><tr></tr><tr></tr></tbody></table>'; // tbody will be inserted anyway
+          case 23:
+            box.innerHTML = '<table><tbody></tbody></table>'; // tbody will be inserted anyway
 
             box.setAttribute('style', 'font-size: 120%; text-align: right; padding: 1em; border: solid gray 0.05em;');
             tbody = box.children[0].children[0];
             form = new _rdflib.BlankNode(); // @@ say for now
 
-            registrationStatements = function registrationStatements(index) {
-              var registrations = _solidLogic.solidLogicSingleton.getRegistrations(instance, theClass);
-
-              var reg = registrations.length ? registrations[0] : widgets.newThing(index);
-              return [(0, _rdflib.st)(reg, ns.solid('instance'), instance, index), (0, _rdflib.st)(reg, ns.solid('forClass'), theClass, index)];
-            };
+            _iterator = _createForOfIteratorHelper(scopes);
 
             try {
-              if (context2.index && context2.index["public"] && context2.index["public"].length > 0) {
-                index = context2.index["public"][0];
-                statements = registrationStatements(index);
-                tbody.children[0].appendChild(widgets.buildCheckboxForm(context2.dom, _solidLogic.solidLogicSingleton.store, "Public link to this ".concat(context2.noun), null, statements, form, index));
+              for (_iterator.s(); !(_step = _iterator.n()).done;) {
+                scope = _step.value;
+                row = tbody.appendChild(dom.createElement('tr'));
+                row.appendChild(renderScopeCheckbox(scope)); // @@ index
               }
-
-              if (context2.index && context2.index["private"] && context2.index["private"].length > 0) {
-                index = context2.index["private"][0];
-                statements = registrationStatements(index);
-                tbody.children[1].appendChild(widgets.buildCheckboxForm(context2.dom, _solidLogic.solidLogicSingleton.store, "Personal note of this ".concat(context2.noun), null, statements, form, index));
-              }
-            } catch (e) {
-              _msg = "registrationControl: Error making panel: ".concat(e);
-
-              if (context.div) {
-                context.div.appendChild(widgets.errorMessageBlock(context.dom, e));
-              }
-
-              debug.log(_msg);
+            } catch (err) {
+              _iterator.e(err);
+            } finally {
+              _iterator.f();
             }
 
-            return _context7.abrupt("return", context2);
+            return _context7.abrupt("return", context);
 
-          case 26:
+          case 30:
           case "end":
             return _context7.stop();
         }
       }
-    }, _callee7, null, [[9, 15]]);
+    }, _callee7, null, [[12, 18]]);
   }));
   return _registrationControl.apply(this, arguments);
 }
 
-function registrationList(_x10, _x11) {
+function renderScopeHeadingRow(context, store, scope) {
+  var backgroundColor = {
+    "private": '#fee',
+    "public": '#efe'
+  };
+  var dom = context.dom;
+  var name = scopeLabel(context, scope);
+  var row = dom.createElement('tr');
+  var cell = row.appendChild(dom.createElement('td'));
+  cell.setAttribute('colspan', '3');
+  cell.style.backgoundColor = backgroundColor[scope.label] || 'white';
+  var header = cell.appendChild(dom.createElement('h3'));
+  header.textContent = name + ' links';
+  header.style.textAlign = 'left';
+  return row;
+}
+/**
+  * UI to List at all registered things
+  */
+
+
+function registrationList(_x9, _x10) {
   return _registrationList.apply(this, arguments);
-}
+} // registrationList
+
 
 function _registrationList() {
-  _registrationList = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8(context0, options) {
-    var dom, div, box;
-    return _regenerator["default"].wrap(function _callee8$(_context8) {
+  _registrationList = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9(context, options) {
+    var dom, div, box, scopes, table, tbody, _iterator2, _step2, scope, headingRow, items, _iterator3, _step3, _loop;
+
+    return _regenerator["default"].wrap(function _callee9$(_context9) {
       while (1) {
-        switch (_context8.prev = _context8.next) {
+        switch (_context9.prev = _context9.next) {
           case 0:
-            dom = context0.dom;
-            div = context0.div;
+            dom = context.dom;
+            div = context.div;
             box = dom.createElement('div');
             div.appendChild(box);
-            context0.me = _solidLogic.authn.currentUser(); // @@
+            context.me = _solidLogic.authn.currentUser(); // @@
 
-            if (context0.me) {
-              _context8.next = 8;
+            if (context.me) {
+              _context9.next = 8;
               break;
             }
 
             box.innerHTML = '<p style="margin:2em;">(Log in list your stuff)</p>';
-            return _context8.abrupt("return", context0);
+            return _context9.abrupt("return", context);
 
           case 8:
-            return _context8.abrupt("return", (0, _solidLogic.ensureTypeIndexes)(context0).then(function (context) {
-              box.innerHTML = '<table><tbody></tbody></table>'; // tbody will be inserted anyway
-
-              // tbody will be inserted anyway
-              box.setAttribute('style', 'font-size: 120%; text-align: right; padding: 1em; border: solid #eee 0.5em;');
-              var table = box.firstChild;
-              var ix = [];
-              var sts = [];
-              var vs = ['private', 'public'];
-              vs.forEach(function (visibility) {
-                if (context.index && context.index[visibility].length > 0 && options[visibility]) {
-                  ix = ix.concat(context.index[visibility][0]);
-                  sts = sts.concat(_solidLogic.solidLogicSingleton.store.statementsMatching(undefined, ns.solid('instance'), undefined, context.index[visibility][0]));
-                }
-              });
+            _context9.next = 10;
+            return (0, _solidLogic.loadAllTypeIndexes)(store, context.me);
+
+          case 10:
+            scopes = _context9.sent;
+            // includes community indexes
+            // console.log('@@ registrationList ', scopes)
+            box.innerHTML = '<table><tbody></tbody></table>'; // tbody will be inserted anyway
 
-              var _loop = function _loop(i) {
-                var statement = sts[i];
+            box.setAttribute('style', 'font-size: 120%; text-align: right; padding: 1em; border: solid #eee 0.5em;');
+            table = box.firstChild;
+            tbody = table.firstChild;
+            _iterator2 = _createForOfIteratorHelper(scopes);
+            _context9.prev = 16;
 
-                if (options.type) {
-                  // now check  terms:forClass
-                  if (!_solidLogic.solidLogicSingleton.store.holds(statement.subject, ns.solid('forClass'), options.type, statement.why)) {
-                    return "continue"; // skip irrelevant ones
-                  }
-                } // const cla = statement.subject
+            _iterator2.s();
+
+          case 18:
+            if ((_step2 = _iterator2.n()).done) {
+              _context9.next = 30;
+              break;
+            }
 
+            scope = _step2.value;
+            // need some predicate for listing/adding agents
+            headingRow = renderScopeHeadingRow(context, store, scope);
+            tbody.appendChild(headingRow);
+            _context9.next = 24;
+            return (0, _solidLogic.getScopedAppsFromIndex)(store, scope, options.type || null);
 
-                // const cla = statement.subject
-                var inst = statement.object;
-                table.appendChild(widgets.personTR(dom, ns.solid('instance'), inst, {
-                  deleteFunction: function deleteFunction(_x) {
-                    if (!_solidLogic.solidLogicSingleton.store.updater) {
-                      throw new Error('Cannot delete this, store has no updater');
+          case 24:
+            items = _context9.sent;
+            // any class
+            if (items.length === 0) headingRow.style.display = 'none'; // console.log(`registrationList: @@ instance items for class ${options.type || 'undefined' }:`, items)
+
+            _iterator3 = _createForOfIteratorHelper(items);
+
+            try {
+              _loop = function _loop() {
+                var item = _step3.value;
+                var row = widgets.personTR(dom, ns.solid('instance'), item.instance, {
+                  deleteFunction: function () {
+                    var _deleteFunction = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8() {
+                      return _regenerator["default"].wrap(function _callee8$(_context8) {
+                        while (1) {
+                          switch (_context8.prev = _context8.next) {
+                            case 0:
+                              _context8.next = 2;
+                              return (0, _solidLogic.deleteTypeIndexRegistration)(store, item);
+
+                            case 2:
+                              tbody.removeChild(row);
+
+                            case 3:
+                            case "end":
+                              return _context8.stop();
+                          }
+                        }
+                      }, _callee8);
+                    }));
+
+                    function deleteFunction() {
+                      return _deleteFunction.apply(this, arguments);
                     }
 
-                    _solidLogic.solidLogicSingleton.store.updater.update([statement], [], function (uri, ok, errorBody) {
-                      if (ok) {
-                        debug.log("Removed from index: ".concat(statement.subject));
-                      } else {
-                        debug.log("Error: Cannot delete ".concat(statement, ": ").concat(errorBody));
-                      }
-                    });
-                  }
-                }));
+                    return deleteFunction;
+                  }()
+                });
+                row.children[0].style.paddingLeft = '3em';
+                tbody.appendChild(row);
               };
 
-              for (var i = 0; i < sts.length; i++) {
-                var _ret = _loop(i);
+              for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+                _loop();
+              }
+            } catch (err) {
+              _iterator3.e(err);
+            } finally {
+              _iterator3.f();
+            }
 
-                if (_ret === "continue") continue;
-              } // registrationList
+          case 28:
+            _context9.next = 18;
+            break;
 
-              /*
-                  //const containers = solidLogicSingleton.store.each(theClass, ns.solid('instanceContainer'));
-                  if (containers.length) {
-                  fetcher.load(containers).then(function(xhrs){
-                  for (const i=0; i<containers.length; i++) {
-                  const cont = containers[i];
-                  instances = instances.concat(solidLogicSingleton.store.each(cont, ns.ldp('contains')));
-                  }
-                  });
-                  }
-                  */
+          case 30:
+            _context9.next = 35;
+            break;
 
+          case 32:
+            _context9.prev = 32;
+            _context9.t0 = _context9["catch"](16);
 
-              // registrationList
+            _iterator2.e(_context9.t0);
 
-              /*
-                  //const containers = solidLogicSingleton.store.each(theClass, ns.solid('instanceContainer'));
-                  if (containers.length) {
-                  fetcher.load(containers).then(function(xhrs){
-                  for (const i=0; i<containers.length; i++) {
-                  const cont = containers[i];
-                  instances = instances.concat(solidLogicSingleton.store.each(cont, ns.ldp('contains')));
-                  }
-                  });
-                  }
-                  */
-              return context;
-            }));
+          case 35:
+            _context9.prev = 35;
 
-          case 9:
+            _iterator2.f();
+
+            return _context9.finish(35);
+
+          case 38:
+            return _context9.abrupt("return", context);
+
+          case 39:
           case "end":
-            return _context8.stop();
+            return _context9.stop();
         }
       }
-    }, _callee8);
+    }, _callee9, null, [[16, 32, 35, 38]]);
   }));
   return _registrationList.apply(this, arguments);
 }
@@ -8605,7 +8555,7 @@ function renderSignInPopup(dom) {
       }, _callee, null, [[0, 8]]);
     }));
 
-    return function loginToIssuer(_x12) {
+    return function loginToIssuer(_x11) {
       return _ref.apply(this, arguments);
     };
   }();
@@ -8892,7 +8842,7 @@ function selectWorkspace(dom, appDetails, callbackWS) {
 
   function displayOptions(context) {
     // console.log('displayOptions!', context)
-    function makeNewWorkspace(_x13) {
+    function makeNewWorkspace(_x12) {
       return _makeNewWorkspace.apply(this, arguments);
     } // const status = ''
 
@@ -9161,77 +9111,77 @@ function getUserRoles() {
 
 
 function _getUserRoles() {
-  _getUserRoles = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
+  _getUserRoles = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10() {
     var _yield$ensureLoadedPr, me, preferencesFile, preferencesFileError;
 
-    return _regenerator["default"].wrap(function _callee9$(_context9) {
+    return _regenerator["default"].wrap(function _callee10$(_context10) {
       while (1) {
-        switch (_context9.prev = _context9.next) {
+        switch (_context10.prev = _context10.next) {
           case 0:
-            _context9.prev = 0;
-            _context9.next = 3;
+            _context10.prev = 0;
+            _context10.next = 3;
             return ensureLoadedPreferences({});
 
           case 3:
-            _yield$ensureLoadedPr = _context9.sent;
+            _yield$ensureLoadedPr = _context10.sent;
             me = _yield$ensureLoadedPr.me;
             preferencesFile = _yield$ensureLoadedPr.preferencesFile;
             preferencesFileError = _yield$ensureLoadedPr.preferencesFileError;
 
             if (!(!preferencesFile || preferencesFileError)) {
-              _context9.next = 9;
+              _context10.next = 9;
               break;
             }
 
             throw new Error(preferencesFileError);
 
           case 9:
-            return _context9.abrupt("return", _solidLogic.solidLogicSingleton.store.each(me, ns.rdf('type'), null, preferencesFile.doc()));
+            return _context10.abrupt("return", _solidLogic.solidLogicSingleton.store.each(me, ns.rdf('type'), null, preferencesFile.doc()));
 
           case 12:
-            _context9.prev = 12;
-            _context9.t0 = _context9["catch"](0);
-            debug.warn('Unable to fetch your preferences - this was the error: ', _context9.t0);
+            _context10.prev = 12;
+            _context10.t0 = _context10["catch"](0);
+            debug.warn('Unable to fetch your preferences - this was the error: ', _context10.t0);
 
           case 15:
-            return _context9.abrupt("return", []);
+            return _context10.abrupt("return", []);
 
           case 16:
           case "end":
-            return _context9.stop();
+            return _context10.stop();
         }
       }
-    }, _callee9, null, [[0, 12]]);
+    }, _callee10, null, [[0, 12]]);
   }));
   return _getUserRoles.apply(this, arguments);
 }
 
-function filterAvailablePanes(_x14) {
+function filterAvailablePanes(_x13) {
   return _filterAvailablePanes.apply(this, arguments);
 }
 
 function _filterAvailablePanes() {
-  _filterAvailablePanes = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10(panes) {
+  _filterAvailablePanes = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11(panes) {
     var userRoles;
-    return _regenerator["default"].wrap(function _callee10$(_context10) {
+    return _regenerator["default"].wrap(function _callee11$(_context11) {
       while (1) {
-        switch (_context10.prev = _context10.next) {
+        switch (_context11.prev = _context11.next) {
           case 0:
-            _context10.next = 2;
+            _context11.next = 2;
             return getUserRoles();
 
           case 2:
-            userRoles = _context10.sent;
-            return _context10.abrupt("return", panes.filter(function (pane) {
+            userRoles = _context11.sent;
+            return _context11.abrupt("return", panes.filter(function (pane) {
               return isMatchingAudience(pane, userRoles);
             }));
 
           case 4:
           case "end":
-            return _context10.stop();
+            return _context11.stop();
         }
       }
-    }, _callee10);
+    }, _callee11);
   }));
   return _filterAvailablePanes.apply(this, arguments);
 }
@@ -12026,6 +11976,83 @@ module.exports = style; // @@ No way to do this in ESM
 
 /***/ }),
 
+/***/ "./lib/style_multiSelect.js":
+/*!**********************************!*\
+  !*** ./lib/style_multiSelect.js ***!
+  \**********************************/
+/***/ ((module, exports) => {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", ({
+  value: true
+}));
+exports.style = void 0;
+
+/*
+ * BASED ON:
+ * IconicMultiSelect v0.7.0
+ * Licence:  MIT
+ * (c) 2021 Sidney Wimart.
+ * repo & configuration: https://github.com/sidneywm/iconic-multiselect
+ */
+
+/**
+ * @version IconicMultiSelect v0.7.0
+ * @licence  MIT
+ */
+var style = {
+  multiselect__container: "\n        -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n        background-color: #fff;\n        border-radius: 2px;\n        -webkit-box-shadow: 0 1px 3px 0 #d1d1d2, 0 0 0 1px #d1d1d2;\n                box-shadow: 0 1px 3px 0 #d1d1d2, 0 0 0 1px #d1d1d2;\n        -webkit-box-sizing: border-box;\n                box-sizing: border-box;\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        min-height: 36px;\n        padding: 4px 8px 0 8px;\n        position: relative;\n        width: 354px;\n        margin-bottom: 5px;\n        font-size: 100%\n    ",
+
+  /*
+    multiselect__container:after: `
+        content: '';
+        min-height:inherit;
+        font-size:0;
+    `,
+     multiselect__container > *: `
+    color: #656565;
+    font-size: 14px;
+    `,
+  */
+  multiselect__wrapper: "\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        -ms-flex-wrap: wrap;\n            flex-wrap: wrap;\n        height: 100%;\n        width: 100%;\n    ",
+  multiselect__clear_btn: "\n        cursor: pointer;\n        align-items: center;\n        margin-bottom: 4px;\n        margin-left: 4px;\n    ",
+  multiselect__options: "\n        background-color: #f6f6f6;\n        border-radius: 2px;\n        left: 0;\n        max-height: 0;\n        overflow: hidden;\n        position: absolute;\n        top: calc(100% + 3px);\n        z-index: 9999;\n        width: 100%;\n        opacity: 0;\n        transition: max-height 0.1s ease;\n    ",
+  multiselect__options_visible: "\n        background-color: #f6f6f6;\n        border-radius: 2px;\n        left: 0;\n        max-height: 0;\n        overflow: hidden;\n        position: absolute;\n        top: calc(100% + 3px);\n        z-index: 9999;\n        width: 100%;\n        opacity: 0;\n        transition: max-height 0.1s ease;\n        max-height: 200px;\n        -webkit-box-shadow: 0 1px 3px 0 #d1d1d2, 0 0 0 1px #d1d1d2;\n        box-shadow: 0 1px 3px 0 #d1d1d2, 0 0 0 1px #d1d1d2;\n        opacity: 1;\n        transition: max-height 0.2s ease;\n    ",
+  multiselect__options_ul: "\n        list-style: none;\n        margin: 0;\n        padding: 2px 0;\n        max-height: 200px;\n        overflow: auto;\n    ",
+  multiselect__options_ul_li: "\n        cursor: pointer;\n        padding: 4px 8px;\n    ",
+  // multiselect__options ul li:hover: `
+  multiselect__options_ul_li_hover: "\n        background-color: #dedede;\n    ",
+
+  /*
+    multiselect__options ul li *: `
+    pointer-events: none;
+    `,
+  */
+  multiselect__options_ul_p_multiselect__options_no_results: "\n        margin: 0;\n        padding: 8px;\n        text-align: center;\n    ",
+  multiselect__options_ul_p_multiselect__options_no_data: "\n        margin: 0;\n        padding: 8px;\n        text-align: center;\n    ",
+  // multiselect__options ul li.multiselect__options--selected: `
+  multiselect__options_ul_li_multiselect__options_selected: "\n        background-color: #656565;\n        color: #fff;\n    ",
+  // multiselect__options ul li.multiselect__options--selected:hover: `
+  multiselect__options_ul_li_multiselect__options_selected_hover: "\n    background-color: #656565;\n    ",
+  // multiselect__options ul li.arrow-selected: `
+  multiselect__options_ul_li_arrow_selected: "\n        border: 2px solid rgba(101, 101, 101, 0.5);\n    ",
+  multiselect__selected: "\n        background-color: #656565;\n        border-radius: 2px;\n        color: #fff;\n        margin-bottom: 4px;\n        margin-right: 4px;\n        padding: 4px 8px;\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        -webkit-box-align: center;\n        -ms-flex-align: center;\n        align-items: center;\n    ",
+  multiselect__selected_multiselect__remove_btn: "\n        cursor: pointer;\n        display: flex;\n        margin-left: 6px;\n    ",
+  multiselect__input: "\n        border: none;\n        -ms-flex-preferred-size: 40%;\n            flex-basis: 40%;\n        -webkit-box-flex: 1;\n            -ms-flex-positive: 1;\n                flex-grow: 1;\n        height: 5px;        \n        margin-bottom: 4px;\n        min-width: 40%;\n        outline: none;      \n    "
+};
+exports.style = style;
+
+style.setStyle = function setStyle(ele, styleName) {
+  ele.style = style[styleName];
+};
+
+module.exports = style;
+//# sourceMappingURL=style_multiSelect.js.map
+
+/***/ }),
+
 /***/ "./lib/table.js":
 /*!**********************!*\
   !*** ./lib/table.js ***!
@@ -13914,9 +13941,9 @@ function tabWidget(options) {
   var marginsPrepped = margins.concat(margins).slice(orientation, orientation + 4);
   var marginsStyle = "margin: ".concat(marginsPrepped.join(' '), ";");
   var paddingStyle = "padding: ".concat(marginsPrepped.join(' '), ";");
-  var tabStyle = cornersStyle + "padding: 0.7em; max-width: 20em; color: ".concat(color, ";");
-  var unselectedStyle = "".concat(tabStyle + marginsStyle, "opacity: 50%; background-color: ").concat(backgroundColor, ";");
-  var selectedStyle = "".concat(tabStyle + marginsStyle, "background-color: ").concat(selectedColor, ";");
+  var tabStyle = cornersStyle + "position: relative; padding: 0.7em; max-width: 20em; color: ".concat(color, ";");
+  var unselectedStyle = "".concat(tabStyle + marginsStyle, " opacity: 50%; background-color: ").concat(backgroundColor, ";");
+  var selectedStyle = "".concat(tabStyle + marginsStyle, " background-color: ").concat(selectedColor, ";");
   var shownStyle = 'height: 100%; width: 100%;';
   var hiddenStyle = shownStyle + 'display: none;';
   rootElement.refresh = orderedSync;
@@ -13976,35 +14003,50 @@ function tabWidget(options) {
 
   function makeNewSlot(item) {
     var ele = dom.createElement(tabElement);
+    ele.setAttribute('style', unselectedStyle);
     ele.subject = item;
-    var div = ele.appendChild(dom.createElement('div'));
-    div.setAttribute('style', unselectedStyle);
-    div.addEventListener('click', function (e) {
-      if (!e.metaKey) {
-        resetTabStyle();
-        resetBodyStyle();
+    var div = ele.appendChild(dom.createElement('button'));
+    div.setAttribute('style', 'background: none; border: none; font: inherit; cursor: pointer');
+    var ellipsis = dom.createElement('button');
+    ellipsis.textContent = '...';
+    ellipsis.setAttribute('style', 'position: absolute; right: 0; bottom: 0; width: 20%; background: none; color: inherit; border: none; padding: 0; font: inherit; cursor: pointer; outline: inherit;');
+
+    div.onclick = function () {
+      resetTabStyle();
+      resetBodyStyle();
+      ele.setAttribute('style', selectedStyle);
+      if (!ele.bodyTR) return;
+      ele.bodyTR.setAttribute('style', shownStyle);
+      var bodyMain = getOrCreateContainerElement(ele);
+
+      if (options.renderMain && ele.subject && bodyMain.asSettings !== false) {
+        bodyMain.innerHTML = 'loading item ...' + item;
+        options.renderMain(bodyMain, ele.subject);
+        bodyMain.asSettings = false;
       }
+    };
 
-      div.setAttribute('style', selectedStyle);
+    ellipsis.onclick = function () {
+      resetTabStyle();
+      resetBodyStyle();
+      ele.setAttribute('style', selectedStyle);
       if (!ele.bodyTR) return;
       ele.bodyTR.setAttribute('style', shownStyle);
       var bodyMain = getOrCreateContainerElement(ele);
 
-      if (options.renderTabSettings && e.altKey && ele.subject && bodyMain.asSettings !== true) {
+      if (options.renderTabSettings && ele.subject && bodyMain.asSettings !== true) {
         bodyMain.innerHTML = 'loading settings ...' + item;
         options.renderTabSettings(bodyMain, ele.subject);
         bodyMain.asSettings = true;
-      } else if (options.renderMain && ele.subject && bodyMain.asSettings !== false) {
-        bodyMain.innerHTML = 'loading item ...' + item;
-        options.renderMain(bodyMain, ele.subject);
-        bodyMain.asSettings = false;
       }
-    });
+    };
 
     if (options.renderTab) {
       options.renderTab(div, item);
+      ele.appendChild(ellipsis);
     } else {
-      div.textContent = (0, _utils.label)(item);
+      div.innerHTML = (0, _utils.label)(item);
+      ele.appendChild(ellipsis);
     }
 
     return ele;
@@ -14084,10 +14126,8 @@ function tabWidget(options) {
 
       if (_tab.classList.contains('unstyled')) {
         continue;
-      }
-
-      if (_tab.children[0]) {
-        _tab.children[0].setAttribute('style', unselectedStyle);
+      } else {
+        _tab.setAttribute('style', unselectedStyle);
       }
     }
   }
@@ -15172,7 +15212,7 @@ function slice(s, suffix) {
 
 function getWellKnownLabel(thing) {
   return _solidLogic.store.any(thing, UI.ns.ui('label')) || // Prioritize ui:label
-  _solidLogic.store.any(thing, UI.ns.link('message')) || _solidLogic.store.any(thing, UI.ns.vcard('fn')) || _solidLogic.store.any(thing, UI.ns.foaf('name')) || _solidLogic.store.any(thing, UI.ns.dct('title')) || _solidLogic.store.any(thing, UI.ns.dc('title')) || _solidLogic.store.any(thing, UI.ns.rss('title')) || _solidLogic.store.any(thing, UI.ns.contact('fullName')) || _solidLogic.store.any(thing, _solidLogic.store.sym('http://www.w3.org/2001/04/roadmap/org#name')) || _solidLogic.store.any(thing, UI.ns.cal('summary')) || _solidLogic.store.any(thing, UI.ns.foaf('nick')) || _solidLogic.store.any(thing, UI.ns.as('name')) || _solidLogic.store.any(thing, UI.ns.schema('name')) || _solidLogic.store.any(thing, UI.ns.rdfs('label'));
+  _solidLogic.store.any(thing, UI.ns.link('message')) || _solidLogic.store.any(thing, UI.ns.vcard('fn')) || _solidLogic.store.any(thing, UI.ns.foaf('name')) || _solidLogic.store.any(thing, UI.ns.dct('title')) || _solidLogic.store.any(thing, UI.ns.dc('title')) || _solidLogic.store.any(thing, UI.ns.rss('title')) || _solidLogic.store.any(thing, UI.ns.contact('fullName')) || _solidLogic.store.any(thing, _solidLogic.store.sym('http://www.w3.org/2001/04/roadmap/org#name')) || _solidLogic.store.any(thing, UI.ns.cal('summary')) || _solidLogic.store.any(thing, UI.ns.foaf('nick')) || _solidLogic.store.any(thing, UI.ns.as('name')) || _solidLogic.store.any(thing, UI.ns.schema('name')) || _solidLogic.store.any(thing, UI.ns.rdfs('label')) || _solidLogic.store.any(thing, _solidLogic.store.sym('http://www.w3.org/2004/02/skos/core#prefLabel'));
 }
 //# sourceMappingURL=label.js.map
 
@@ -15192,11 +15232,11 @@ Object.defineProperty(exports, "__esModule", ({
 }));
 exports.versionInfo = void 0;
 var versionInfo = {
-  buildTime: '2022-05-06T16:50:46Z',
-  commit: 'be8b238bb7ce1676f399ec08989b185cc15d37e7',
+  buildTime: '2022-06-14T10:03:16Z',
+  commit: 'c7419dece1f50b42cf9d14ee36b13cdbbf0b8ffd',
   npmInfo: {
     'solid-ui': '2.4.22',
-    npm: '6.14.16',
+    npm: '6.14.17',
     ares: '1.18.1',
     brotli: '1.0.9',
     cldr: '40.0',
@@ -15205,12 +15245,12 @@ var versionInfo = {
     modules: '83',
     napi: '8',
     nghttp2: '1.42.0',
-    node: '14.19.1',
-    openssl: '1.1.1n',
+    node: '14.19.3',
+    openssl: '1.1.1o',
     tz: '2021a3',
     unicode: '14.0',
     uv: '1.42.0',
-    v8: '8.4.371.23-node.85',
+    v8: '8.4.371.23-node.87',
     zlib: '1.2.11'
   }
 };
@@ -16280,6 +16320,7 @@ function openHrefInOutlineMode(e) {
 
   if (dom.outlineManager) {
     // @@ TODO Remove the use of document as a global object
+    // TODO fix dependency cycle to solid-panes by calling outlineManager
     ;
     dom.outlineManager.GotoSubject(_solidLogic.store.sym(uri), true, undefined, true, undefined);
   } else if (window && window.panes && window.panes.getOutliner) {
@@ -16407,6 +16448,7 @@ function linkButton(dom, object) {
   b.textContent = 'Goto ' + utils.label(object);
   b.addEventListener('click', function (_event) {
     // b.parentNode.removeChild(b)
+    // TODO fix dependency cycle to solid-panes by calling outlineManager
     ;
     dom.outlineManager.GotoSubject(object, true, undefined, true, undefined);
   }, true);
@@ -17047,7 +17089,7 @@ function uploadFiles(fetcher, files, fileBase, imageBase, successHandler) {
 /*!******************************!*\
   !*** ./lib/widgets/error.js ***!
   \******************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
 
 "use strict";
 
@@ -17057,6 +17099,8 @@ Object.defineProperty(exports, "__esModule", ({
 }));
 exports.errorMessageBlock = errorMessageBlock;
 
+var _widgets = __webpack_require__(/*! ../widgets */ "./lib/widgets/index.js");
+
 /**
  * Create an error message block
  * @param dom The DOM on which dom.createElement will be called
@@ -17087,6 +17131,9 @@ function errorMessageBlock(dom, err, backgroundColor, err2) {
     div.textContent = err;
   }
 
+  div.appendChild((0, _widgets.cancelButton)(dom, function () {
+    if (div.parentNode) div.parentNode.removeChild(div);
+  })).style = 'width: 2em; height: 2em; align: right;';
   div.setAttribute('style', 'margin: 0.1em; padding: 0.5em; border: 0.05em solid gray; background-color: ' + (backgroundColor || '#fee') + '; color:black;');
   return div;
 }
@@ -17125,6 +17172,12 @@ Object.defineProperty(exports, "field", ({
     return _fieldFunction.field;
   }
 }));
+Object.defineProperty(exports, "fieldFunction", ({
+  enumerable: true,
+  get: function get() {
+    return _fieldFunction.fieldFunction;
+  }
+}));
 Object.defineProperty(exports, "fieldLabel", ({
   enumerable: true,
   get: function get() {
@@ -17147,8 +17200,15 @@ exports.findClosest = findClosest;
 exports.formsFor = formsFor;
 exports.makeDescription = makeDescription;
 exports.makeSelectForCategory = makeSelectForCategory;
+exports.makeSelectForChoice = makeSelectForChoice;
 exports.makeSelectForNestedCategory = makeSelectForNestedCategory;
 exports.makeSelectForOptions = makeSelectForOptions;
+Object.defineProperty(exports, "mostSpecificClassURI", ({
+  enumerable: true,
+  get: function get() {
+    return _fieldFunction.mostSpecificClassURI;
+  }
+}));
 exports.newButton = newButton;
 exports.newThing = newThing;
 exports.promptForNew = promptForNew;
@@ -17196,6 +17256,8 @@ var _solidLogic = __webpack_require__(/*! solid-logic */ "./node_modules/solid-l
 
 var utils = _interopRequireWildcard(__webpack_require__(/*! ../utils */ "./lib/utils/index.js"));
 
+var _multiSelect = __webpack_require__(/*! ./multiSelect */ "./lib/widgets/multiSelect.js");
+
 var widgets = _interopRequireWildcard(__webpack_require__(/*! ../widgets */ "./lib/widgets/index.js"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -17258,14 +17320,16 @@ _fieldFunction.field[ns.ui('Form').uri] = _fieldFunction.field[ns.ui('Group').ur
   var ui = ns.ui;
   if (container) container.appendChild(box); // Prevent loops
 
+  if (!form) return;
   var key = subject.toNT() + '|' + form.toNT();
 
   if (already[key]) {
     // been there done that
-    box.appendChild(dom.createTextNode('Group: see above ' + key));
-    var plist = [$rdf.st(subject, ns.owl('sameAs'), subject)]; // @@ need prev subject
+    box.appendChild(dom.createTextNode('Group: see above ' + key)); // TODO fix dependency cycle to solid-panes by calling outlineManager
+    // const plist = [$rdf.st(subject, ns.owl('sameAs'), subject)] // @@ need prev subject
+    // dom.outlineManager.appendPropertyTRs(box, plist)
+    // dom.appendChild(plist)
 
-    dom.outlineManager.appendPropertyTRs(box, plist);
     return box;
   }
 
@@ -17366,47 +17430,43 @@ _fieldFunction.field[ns.ui('Options').uri] = function (dom, container, already,
     values = kb.each(subject, dependingOn);
   }
 
-  if (values.length === 0) {
-    box.appendChild((0, _error.errorMessageBlock)(dom, "Can't select subform as no value of: " + dependingOn));
-  } else {
-    for (var i = 0; i < cases.length; i++) {
-      var c = cases[i];
-      var tests = kb.each(c, ui('for'), null, formDoc); // There can be multiple 'for'
+  for (var i = 0; i < cases.length; i++) {
+    var c = cases[i];
+    var tests = kb.each(c, ui('for'), null, formDoc); // There can be multiple 'for'
 
-      var match = false;
+    var match = false;
 
-      for (var j = 0; j < tests.length; j++) {
-        var _iterator = _createForOfIteratorHelper(values),
-            _step;
+    for (var j = 0; j < tests.length; j++) {
+      var _iterator = _createForOfIteratorHelper(values),
+          _step;
 
-        try {
-          for (_iterator.s(); !(_step = _iterator.n()).done;) {
-            var value = _step.value;
-            var test = tests[j];
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var value = _step.value;
+          var test = tests[j];
 
-            if (value.sameTerm(tests) || value.termType === test.termType && value.value === test.value) {
-              match = true;
-            }
+          if (value.sameTerm(tests) || value.termType === test.termType && value.value === test.value) {
+            match = true;
           }
-        } catch (err) {
-          _iterator.e(err);
-        } finally {
-          _iterator.f();
         }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
       }
+    }
 
-      if (match) {
-        var _field3 = kb.the(c, ui('use'));
-
-        if (!_field3) {
-          box.appendChild((0, _error.errorMessageBlock)(dom, 'No "use" part for case in form ' + form));
-          return box;
-        } else {
-          appendForm(dom, box, already, subject, _field3, dataDoc, callbackFunction);
-        }
+    if (match) {
+      var _field3 = kb.the(c, ui('use'));
 
-        break;
+      if (!_field3) {
+        box.appendChild((0, _error.errorMessageBlock)(dom, 'No "use" part for case in form ' + form));
+        return box;
+      } else {
+        appendForm(dom, box, already, subject, _field3, dataDoc, callbackFunction);
       }
+
+      break;
     }
   } // @@ Add box.refresh() to sync fields with values
 
@@ -17694,7 +17754,7 @@ _fieldFunction.field[ns.ui('Multiple').uri] = function (dom, container, already,
     // delete button and move buttons
 
     if (kb.updater.editable(dataDoc.uri)) {
-      buttons.deleteButtonWithCheck(dom, subField, utils.label(property), deleteThisItem);
+      buttons.deleteButtonWithCheck(dom, subField, multipleUIlabel, deleteThisItem);
 
       if (ordered) {
         // Add controsl in a frame
@@ -17745,7 +17805,7 @@ _fieldFunction.field[ns.ui('Multiple').uri] = function (dom, container, already,
 
         var _shim = dom.createElement('div');
 
-        _shim.appendChild(subField); // Subfield has its own laytout
+        _shim.appendChild(subField); // Subfield has its own layout
 
 
         frame.appendChild(_shim);
@@ -17794,6 +17854,8 @@ _fieldFunction.field[ns.ui('Multiple').uri] = function (dom, container, already,
     return shim;
   }
 
+  var multipleUIlabel = kb.any(form, ui('label'));
+  if (!multipleUIlabel) multipleUIlabel = utils.label(property);
   var min = kb.any(form, ui('min')); // This is the minimum number -- default 0
 
   min = min ? 0 + min.value : 0;
@@ -17834,10 +17896,9 @@ _fieldFunction.field[ns.ui('Multiple').uri] = function (dom, container, already,
     img.setAttribute('src', plusIconURI); //  plus sign
 
     img.setAttribute('style', 'margin: 0.2em; width: 1.5em; height:1.5em');
-    img.title = 'Click to add one or more ' + utils.predicateLabel(property, reverse);
-    var prompt = tail.appendChild(dom.createElement('span'));
-    prompt.textContent = (values.length === 0 ? 'Add one or more ' : 'Add more ') + utils.predicateLabel(property, reverse); // utils.label(property)
-
+    img.title = 'Click to add another ' + multipleUIlabel;
+    var prompt = dom.createElement('span');
+    prompt.textContent = (values.length === 0 ? 'Add another ' : 'Add ') + multipleUIlabel;
     tail.addEventListener('click', /*#__PURE__*/function () {
       var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(_eventNotUsed) {
         return _regenerator["default"].wrap(function _callee5$(_context5) {
@@ -17859,6 +17920,7 @@ _fieldFunction.field[ns.ui('Multiple').uri] = function (dom, container, already,
         return _ref3.apply(this, arguments);
       };
     }(), true);
+    tail.appendChild(prompt);
   }
 
   function createListIfNecessary() {
@@ -18133,23 +18195,25 @@ _fieldFunction.field[ns.ui('Classifier').uri] = function (dom, container, alread
  ** -- radio buttons
  ** -- auto-complete typing
  **
- ** Todo: Deal with multiple.  Maybe merge with multiple code.
+ ** TODO: according to ontology ui:choice can also have ns.ui('default') - this is not implemented yet
  */
 
 
 _fieldFunction.field[ns.ui('Choice').uri] = function (dom, container, already, subject, form, dataDoc, callbackFunction) {
   var ui = ns.ui;
   var kb = _solidLogic.store;
-  var multiple = false;
   var formDoc = form.doc ? form.doc() : null; // @@ if blank no way to know
 
   var p;
-  var box = dom.createElement('div'); // Set flexDirection column?
+  var box = dom.createElement('div');
+  box.setAttribute('class', 'choiceBox'); // Set flexDirection column?
 
   if (container) container.appendChild(box);
   var lhs = dom.createElement('div');
+  lhs.setAttribute('class', 'formFieldName choiceBox-label');
   box.appendChild(lhs);
   var rhs = dom.createElement('div');
+  rhs.setAttribute('class', 'formFieldValue choiceBox-selectBox');
   box.appendChild(rhs);
   var property = kb.any(form, ui('property'));
 
@@ -18158,103 +18222,124 @@ _fieldFunction.field[ns.ui('Choice').uri] = function (dom, container, already, s
   }
 
   lhs.appendChild((0, _basic.fieldLabel)(dom, property, form));
-  var subForm = kb.any(form, ui('use')); // Optional
+  var uiFrom = kb.any(form, ui('from'));
 
-  var follow = kb.anyJS(form, ui('follow'), null, formDoc); // data doc moves to new subject?
+  if (!uiFrom) {
+    return (0, _error.errorMessageBlock)(dom, "No 'from' for Choice: " + form);
+  }
+
+  var subForm = kb.any(form, ui('use')); // Optional
+  // const follow = kb.anyJS(form, ui('follow'), null, formDoc) // data doc moves to new subject?
 
-  var possible = [];
-  var possibleProperties;
-  var firstSelectOptionText = '* Select from ' + utils.label(subject, true) + ' *';
   var opts = {
     form: form,
     subForm: subForm,
-    multiple: multiple,
-    firstSelectOptionText: firstSelectOptionText,
     disambiguate: false
   };
-  var uiFrom = kb.any(form, ui('from'));
 
-  if (!uiFrom) {
-    return (0, _error.errorMessageBlock)(dom, "No 'from' for Choice: " + form);
-  }
+  function getSelectorOptions() {
+    var possible = [];
+    var possibleProperties;
+    possible = kb.each(undefined, ns.rdf('type'), uiFrom, formDoc);
 
-  possible = kb.each(undefined, ns.rdf('type'), uiFrom, formDoc);
+    for (var x in kb.findMembersNT(uiFrom)) {
+      possible.push(kb.fromNT(x));
+    } // Use rdfs
 
-  for (var x in kb.findMembersNT(uiFrom)) {
-    possible.push(kb.fromNT(x));
-  } // Use rdfs
 
+    if (uiFrom.sameTerm(ns.rdfs('Class'))) {
+      for (p in buttons.allClassURIs()) {
+        possible.push(kb.sym(p));
+      } // log.debug("%%% Choice field: possible.length 2 = "+possible.length)
 
-  if (uiFrom.sameTerm(ns.rdfs('Class'))) {
-    for (p in buttons.allClassURIs()) {
-      possible.push(kb.sym(p));
-    } // log.debug("%%% Choice field: possible.length 2 = "+possible.length)
+    } else if (uiFrom.sameTerm(ns.rdf('Property'))) {
+      possibleProperties = buttons.propertyTriage(kb);
 
-  } else if (uiFrom.sameTerm(ns.rdf('Property'))) {
-    possibleProperties = buttons.propertyTriage(kb);
+      for (p in possibleProperties.op) {
+        possible.push(kb.fromNT(p));
+      }
 
-    for (p in possibleProperties.op) {
-      possible.push(kb.fromNT(p));
-    }
+      for (p in possibleProperties.dp) {
+        possible.push(kb.fromNT(p));
+      }
 
-    for (p in possibleProperties.dp) {
-      possible.push(kb.fromNT(p));
-    }
+      opts.disambiguate = true; // This is a big class, and the labels won't be enough.
+    } else if (uiFrom.sameTerm(ns.owl('ObjectProperty'))) {
+      possibleProperties = buttons.propertyTriage(kb);
 
-    opts.disambiguate = true; // This is a big class, and the labels won't be enough.
-  } else if (uiFrom.sameTerm(ns.owl('ObjectProperty'))) {
-    possibleProperties = buttons.propertyTriage(kb);
+      for (p in possibleProperties.op) {
+        possible.push(kb.fromNT(p));
+      }
 
-    for (p in possibleProperties.op) {
-      possible.push(kb.fromNT(p));
-    }
+      opts.disambiguate = true;
+    } else if (uiFrom.sameTerm(ns.owl('DatatypeProperty'))) {
+      possibleProperties = buttons.propertyTriage(kb);
 
-    opts.disambiguate = true;
-  } else if (uiFrom.sameTerm(ns.owl('DatatypeProperty'))) {
-    possibleProperties = buttons.propertyTriage(kb);
+      for (p in possibleProperties.dp) {
+        possible.push(kb.fromNT(p));
+      }
 
-    for (p in possibleProperties.dp) {
-      possible.push(kb.fromNT(p));
+      opts.disambiguate = true;
     }
 
-    opts.disambiguate = true;
-  }
+    return possible; // return sortByLabel(possible)
+  } // TODO: this checks for any occurrence, regardless of true or false setting
 
-  var sortedPossible = sortByLabel(possible); // TODO: this checks for any occurance regardles if it is set to true or false
 
   if (kb.any(form, ui('canMintNew'))) {
     opts.mint = '* Create new *'; // @@ could be better
   }
 
-  var selector = makeSelectForOptions(dom, kb, subject, property, sortedPossible, uiFrom, opts, dataDoc, callbackFunction);
-  rhs.appendChild(selector);
-  var object;
+  var multiSelect = kb.any(form, ui('multiselect')); // Optional
 
-  if (selector.currentURI) {
-    object = $rdf.sym(selector.currentURI);
-  } else {
-    object = kb.any(subject, property);
-  }
+  var selector;
 
-  if (object && subForm) {
-    removeNextSiblingsAfterElement(selector);
-    addSubFormChoice(dom, rhs, already, object, subForm, follow ? object.doc() : dataDoc, callbackFunction);
-  }
+  rhs.refresh = function () {
+    // from ui:property
+    var selectedOptions = kb.each(subject, property, null, dataDoc).map(function (object) {
+      return object.value;
+    }); // from ui:from + ui:property
 
-  return box;
-};
-/**
-     * Removes all sibling elements after specified
-     * @param {HTMLElement} currentElement
-     * @private
-  */
+    var possibleOptions = getSelectorOptions();
+    possibleOptions.push(selectedOptions);
+    possibleOptions = sortByLabel(possibleOptions);
+    selector = makeSelectForChoice(dom, rhs, kb, subject, property, possibleOptions, selectedOptions, uiFrom, opts, dataDoc, callbackFunction);
+    rhs.innerHTML = '';
+    rhs.appendChild(selector);
+
+    if (multiSelect) {
+      var multiSelectDiv = new _multiSelect.IconicMultiSelect({
+        placeholder: selector.selected,
+        select: selector,
+        container: rhs,
+        textField: 'textField',
+        valueField: 'valueField'
+      });
+      multiSelectDiv.init();
+      multiSelectDiv.subscribe(function (event) {
+        if (event.action === 'REMOVE_OPTION') {
+          selectedOptions = selectedOptions.filter(function (value) {
+            return value !== event.value;
+          });
+        }
 
+        if (event.action === 'CLEAR_ALL_OPTIONS') {
+          selectedOptions = [];
+        }
 
-function removeNextSiblingsAfterElement(currentElement) {
-  while (currentElement.nextElementSibling) {
-    currentElement.nextElementSibling.remove();
-  }
-}
+        if (event.action === 'ADD_OPTION') {
+          selectedOptions.push(event.value);
+        }
+
+        selector.update(selectedOptions);
+      });
+    }
+  };
+
+  rhs.refresh();
+  if (selector && selector.refresh) selector.refresh();
+  return box;
+};
 
 function addSubFormChoice(dom, selectDiv, already, subject, subForm, dataDoc, callbackFunction) {
   (0, _fieldFunction.fieldFunction)(dom, subForm)(dom, selectDiv, already, subject, subForm, dataDoc, callbackFunction);
@@ -18461,7 +18546,8 @@ function promptForNew(dom, kb, subject, predicate, theClass, form, dataDoc, call
       b.setAttribute('type', 'button');
       b.setAttribute('style', 'float: right;');
       b.innerHTML = 'Goto ' + utils.label(theClass);
-      b.addEventListener('click', function (_e) {
+      b.addEventListener('click', // TODO fix dependency cycle to solid-panes by calling outlineManager
+      function (_e) {
         dom.outlineManager.GotoSubject(theClass, true, undefined, true, undefined);
       }, false);
       return box;
@@ -18596,17 +18682,15 @@ function makeDescription(dom, kb, subject, predicate, dataDoc, callbackFunction)
 // @param subject - a term, the subject of the statement(s) being edited.
 // @param predicate - a term, the predicate of the statement(s) being edited
 // @param possible - a list of terms, the possible value the object can take
-// @param options.multiple - Boolean - Whether more than one at a time is allowed
-// @param options.firstSelectOptionText - a string to be displayed as the
+// @param options.nullLabel - a string to be displayed as the
 //                        option for none selected (for non multiple)
-// @param options.mint - User may create thing if this sent to the prompt string eg "New foo"
 // @param options.subForm - If mint, then the form to be used for minting the new thing
 // @param dataDoc - The web document being edited
 // @param callbackFunction - takes (boolean ok, string errorBody)
 */
 
 
-function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, options, dataDoc, callbackFunction) {
+function makeSelectForOptions(dom, kb, subject, predicate, possible, options, dataDoc, callbackFunction) {
   log.debug('Select list length now ' + possible.length);
   var n = 0;
   var uris = {}; // Count them
@@ -18623,7 +18707,7 @@ function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, opt
   } // uris is now the set of possible options
 
 
-  if (n === 0 && !options.mint) {
+  if (n === 0) {
     return (0, _error.errorMessageBlock)(dom, "Can't do selector with no options, subject= " + subject + ' property = ' + predicate + '.');
   }
 
@@ -18649,6 +18733,8 @@ function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, opt
   actual = getActual();
 
   var onChange = function onChange(_e) {
+    select.disabled = true; // until data written back - gives user feedback too
+
     var ds = [];
     var is = [];
 
@@ -18658,43 +18744,18 @@ function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, opt
       }
     };
 
-    var newObject;
-
     for (var _i = 0; _i < select.options.length; _i++) {
       var opt = select.options[_i];
-
-      if (opt.selected && opt.AJAR_mint) {
-        // not sure if this if is used because I cannot find mintClass
-        if (options.mintClass) {
-          var thisForm = promptForNew(dom, kb, subject, predicate, options.mintClass, null, dataDoc, function (ok, body) {
-            if (!ok) {
-              callbackFunction(ok, body, {
-                change: 'new'
-              }); // @@ if ok, need some form of refresh of the select for the new thing
-            }
-          });
-          select.parentNode.appendChild(thisForm);
-          newObject = thisForm.AJAR_subject;
-        } else {
-          newObject = newThing(dataDoc);
-        }
-
-        is.push($rdf.st(subject, predicate, kb.sym(newObject), dataDoc));
-        if (uiFrom) is.push($rdf.st(newObject, ns.rdf('type'), kb.sym(uiFrom), dataDoc)); // not sure if this if is used because I cannot find mintStatementsFun
-
-        if (options.mintStatementsFun) {
-          is = is.concat(options.mintStatementsFun(newObject));
-        }
-
-        select.currentURI = newObject;
-      }
-
       if (!opt.AJAR_uri) continue; // a prompt or mint
 
       if (opt.selected && !(opt.AJAR_uri in actual)) {
         // new class
         is.push($rdf.st(subject, predicate, kb.sym(opt.AJAR_uri), dataDoc));
-        select.currentURI = opt.AJAR_uri;
+      }
+
+      if (!opt.selected && opt.AJAR_uri in actual) {
+        // old class
+        removeValue(kb.sym(opt.AJAR_uri));
       }
 
       if (opt.selected) select.currentURI = opt.AJAR_uri;
@@ -18714,27 +18775,25 @@ function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, opt
       sel = sel.superSelect;
     }
 
-    log.info('selectForOptions: data doc = ' + dataDoc); // refresh subForm
+    log.info('selectForOptions: data doc = ' + dataDoc);
+    kb.updater.update(ds, is, function (uri, ok, body) {
+      actual = getActual(); // refresh
 
-    removeNextSiblingsAfterElement(select);
-    addSubFormChoice(dom, select.parentNode, {}, $rdf.sym(select.currentURI), options.subForm, dataDoc, function (ok, body) {
       if (ok) {
-        kb.updater.update(ds, is, function (uri, success, errorBody) {
-          actual = getActual(); // refresh
+        select.disabled = false; // data written back
+      } else {
+        return select.parentNode.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating data in select: ' + body));
+      }
 
-          if (!success) return select.parentNode.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating data in select: ' + errorBody));
-          if (callbackFunction) callbackFunction(success, {
-            widget: 'select',
-            event: 'new'
-          });
-        });
-      } else return select.parentNode.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating data in field of select: ' + body));
+      if (callbackFunction) callbackFunction(ok, {
+        widget: 'select',
+        event: 'change'
+      });
     });
   };
 
   var select = dom.createElement('select');
   select.setAttribute('style', style.formSelectSTyle);
-  if (options.multiple) select.setAttribute('multiple', 'true');
   select.currentURI = null;
 
   select.refresh = function () {
@@ -18777,22 +18836,11 @@ function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, opt
     select.appendChild(option);
   }
 
-  if (editable && options.mint) {
-    var mint = dom.createElement('option');
-    mint.appendChild(dom.createTextNode(options.mint));
-    mint.AJAR_mint = true; // Flag it
-
-    select.insertBefore(mint, select.firstChild);
-  }
-
-  if (!select.currentURI && !options.multiple) {
+  if (!select.currentURI) {
     var prompt = dom.createElement('option');
-    prompt.appendChild(dom.createTextNode(options.firstSelectOptionText));
-    prompt.selected = true;
-    prompt.disabled = true;
-    prompt.value = true;
-    prompt.hidden = true;
+    prompt.appendChild(dom.createTextNode(options.nullLabel));
     select.insertBefore(prompt, select.firstChild);
+    prompt.selected = true;
   }
 
   if (editable) {
@@ -18811,27 +18859,16 @@ function makeSelectForOptions(dom, kb, subject, predicate, possible, uiFrom, opt
 function makeSelectForCategory(dom, kb, subject, category, dataDoc, callbackFunction) {
   var du = kb.any(category, ns.owl('disjointUnionOf'));
   var subs;
-  var multiple = false;
 
   if (!du) {
     subs = kb.each(undefined, ns.rdfs('subClassOf'), category);
-    multiple = true;
   } else {
     subs = du.elements;
   }
 
   log.debug('Select list length ' + subs.length);
-
-  if (subs.length === 0) {
-    return (0, _error.errorMessageBlock)(dom, "Can't do " + (multiple ? 'multiple ' : '') + 'selector with no subclasses of category: ' + category);
-  }
-
-  if (subs.length === 1) {
-    return (0, _error.errorMessageBlock)(dom, "Can't do " + (multiple ? 'multiple ' : '') + 'selector with only 1 subclass of category: ' + category + ':' + subs[1]);
-  }
-
-  return makeSelectForOptions(dom, kb, subject, ns.rdf('type'), subs, null, {
-    multiple: multiple
+  return makeSelectForOptions(dom, kb, subject, ns.rdf('type'), subs, {
+    nullLabel: '* Select type *'
   }, dataDoc, callbackFunction);
 }
 /** Make SELECT element to select subclasses recurively
@@ -18865,8 +18902,7 @@ function makeSelectForNestedCategory(dom, kb, subject, category, dataDoc, callba
   function onChange(ok, body) {
     if (ok) update();
     callbackFunction(ok, body);
-  } // eslint-disable-next-line prefer-const
-
+  }
 
   var select = makeSelectForCategory(dom, kb, subject, category, dataDoc, onChange);
   container.appendChild(select);
@@ -19021,6 +19057,264 @@ function newThing(doc) {
   var now = new Date();
   return $rdf.sym(doc.uri + '#' + 'id' + ('' + now.getTime()));
 }
+/** Make SELECT element to select options
+//
+// @param subject - a term, the subject of the statement(s) being edited.
+// @param predicate - a term, the predicate of the statement(s) being edited
+// @param possible - a list of terms, the possible value the object can take
+// @param options.mint - User may create thing if this sent to the prompt string eg "New foo"
+// @param options.subForm - If mint, then the form to be used for minting the new thing
+// @param dataDoc - The web document being edited
+// @param callbackFunction - takes (boolean ok, string errorBody)
+*/
+
+
+function makeSelectForChoice(dom, container, kb, subject, predicate, inputPossibleOptions, selectedOptions, uiFrom, options, dataDoc, callbackFunction) {
+  var optionsFromClassUIfrom = {}; // Count them
+
+  var editable = kb.updater.editable(dataDoc.uri);
+
+  for (var i = 0; i < inputPossibleOptions.length; i++) {
+    var sub = inputPossibleOptions[i]; // @@ Maybe; make this so it works with blank nodes too
+    // if (!sub.uri) debug.warn(`makeSelectForChoice: option does not have an uri: ${sub}, with predicate: ${predicate}`)
+
+    if (!sub.uri || sub.uri in optionsFromClassUIfrom) continue;
+    optionsFromClassUIfrom[sub.uri] = true;
+  }
+
+  var isEmpty = Object.keys(optionsFromClassUIfrom).length === 0;
+
+  if (isEmpty && !options.mint) {
+    return (0, _error.errorMessageBlock)(dom, "Can't do selector with no options, subject= " + subject + ' property = ' + predicate + '.');
+  }
+
+  log.debug('makeSelectForChoice: dataDoc=' + dataDoc);
+
+  function createDefaultSelectOptionText() {
+    var firstSelectOptionText = '--- choice ---';
+
+    if (predicate && !(predicate.termType === 'BlankNode')) {
+      firstSelectOptionText = '* Select for property: ' + utils.label(predicate) + ' *';
+    }
+
+    if (subject && !(subject.termType === 'BlankNode')) {
+      firstSelectOptionText = '* Select for ' + utils.label(subject, true) + ' *';
+    }
+
+    return firstSelectOptionText;
+  }
+
+  function createDefaultSelectOption() {
+    var option = dom.createElement('option');
+    option.appendChild(dom.createTextNode(createDefaultSelectOptionText()));
+    option.disabled = true;
+    option.value = true;
+    option.hidden = true;
+    option.selected = true;
+    return option;
+  }
+
+  var onChange = function onChange(_e) {
+    container.removeChild(container.lastChild);
+    select.refresh();
+  };
+
+  var select = dom.createElement('select');
+  select.setAttribute('style', style.formSelectSTyle);
+  select.setAttribute('id', 'formSelect');
+  select.currentURI = null;
+
+  for (var uri in optionsFromClassUIfrom) {
+    select.appendChild(createOption(uri));
+  }
+
+  if (editable && options.mint) {
+    var mint = dom.createElement('option');
+    mint.appendChild(dom.createTextNode(options.mint));
+    mint.AJAR_mint = true; // Flag it
+
+    select.insertBefore(mint, select.firstChild);
+  }
+
+  if (select.children.length === 0) select.insertBefore(createDefaultSelectOption(), select.firstChild);
+
+  select.update = function (newSelectedOptions) {
+    selectedOptions = newSelectedOptions;
+    var ds = [];
+    var is = [];
+
+    var removeValue = function removeValue(t) {
+      if (kb.holds(subject, predicate, t, dataDoc)) {
+        ds.push($rdf.st(subject, predicate, t, dataDoc));
+      }
+    };
+
+    var addValue = function addValue(t) {
+      if (!kb.holds(subject, predicate, t, dataDoc)) {
+        is.push($rdf.st(subject, predicate, t, dataDoc)); // console.log("----value added " + t)
+      }
+
+      if (uiFrom && !kb.holds(t, ns.rdf('type'), kb.sym(uiFrom), dataDoc)) {
+        is.push($rdf.st(t, ns.rdf('type'), kb.sym(uiFrom), dataDoc)); // console.log("----added type to value " + uiFrom)
+      }
+    };
+
+    var existingValues = kb.each(subject, predicate, null, dataDoc).map(function (object) {
+      return object.value;
+    });
+
+    var _iterator2 = _createForOfIteratorHelper(existingValues),
+        _step2;
+
+    try {
+      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+        var value = _step2.value;
+        if (!containsObject(value, selectedOptions)) removeValue($rdf.sym(value));
+      }
+    } catch (err) {
+      _iterator2.e(err);
+    } finally {
+      _iterator2.f();
+    }
+
+    var _iterator3 = _createForOfIteratorHelper(selectedOptions),
+        _step3;
+
+    try {
+      for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+        var _value = _step3.value;
+        if (!(_value in existingValues)) addValue($rdf.sym(_value));
+      }
+    } catch (err) {
+      _iterator3.e(err);
+    } finally {
+      _iterator3.f();
+    }
+
+    kb.updater.update(ds, is, function (uri, ok, body) {
+      if (!ok) return select.parentNode.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating data in select: ' + body));
+      select.refresh();
+      if (callbackFunction) callbackFunction(ok, {
+        widget: 'select',
+        event: 'change'
+      });
+    });
+  };
+
+  select.refresh = function () {
+    select.disabled = true; // unlocked any conflict we had got into
+
+    var is = [];
+    var newObject;
+
+    for (var _i3 = 0; _i3 < select.options.length; _i3++) {
+      var opt = select.options[_i3];
+
+      if (opt.selected && opt.AJAR_mint) {
+        // not sure if this 'if' is used because I cannot find mintClass
+        if (options.mintClass) {
+          var thisForm = promptForNew(dom, kb, subject, predicate, options.mintClass, null, dataDoc, function (ok, body) {
+            if (!ok) {
+              callbackFunction(ok, body, {
+                change: 'new'
+              }); // @@ if ok, need some form of refresh of the select for the new thing
+            }
+          });
+          select.parentNode.appendChild(thisForm);
+          newObject = thisForm.AJAR_subject;
+        } else {
+          newObject = newThing(dataDoc);
+        }
+
+        is.push($rdf.st(subject, predicate, kb.sym(newObject), dataDoc));
+        if (uiFrom) is.push($rdf.st(newObject, ns.rdf('type'), kb.sym(uiFrom), dataDoc)); // not sure if this 'if' is used because I cannot find mintStatementsFun
+
+        if (options.mintStatementsFun) {
+          is = is.concat(options.mintStatementsFun(newObject));
+        }
+
+        select.currentURI = newObject;
+      }
+
+      if (!opt.AJAR_uri) continue; // a prompt or mint
+
+      if (opt.selected && containsObject(opt.AJAR_uri, selectedOptions)) {
+        select.currentURI = opt.AJAR_uri;
+      }
+
+      if (!containsObject(opt.AJAR_uri, selectedOptions)) opt.removeAttribute('selected');
+      if (containsObject(opt.AJAR_uri, selectedOptions)) opt.setAttribute('selected', 'true');
+    }
+
+    log.info('selectForOptions: data doc = ' + dataDoc);
+
+    if (select.currentURI && options.subForm) {
+      addSubFormChoice(dom, container, {}, $rdf.sym(select.currentURI), options.subForm, dataDoc, function (ok, body) {
+        if (ok) {
+          kb.updater.update([], is, function (uri, success, errorBody) {
+            if (!success) container.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating select: ' + errorBody));
+          });
+          if (callbackFunction) callbackFunction(ok, {
+            widget: 'select',
+            event: 'new'
+          });
+        } else {
+          container.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating data in field of select: ' + body));
+        }
+      });
+    }
+
+    select.disabled = false;
+  };
+
+  function createOption(uri) {
+    var option = dom.createElement('option');
+    var c = kb.sym(uri);
+    var label;
+
+    if (options.disambiguate) {
+      label = utils.labelWithOntology(c, true); // Init. cap
+    } else {
+      label = utils.label(c, true);
+    }
+
+    option.appendChild(dom.createTextNode(label)); // Init.
+
+    option.setAttribute('value', uri);
+    var backgroundColor = kb.any(c, kb.sym('http://www.w3.org/ns/ui#backgroundColor'));
+
+    if (backgroundColor) {
+      option.setAttribute('style', 'background-color: ' + backgroundColor.value + '; ');
+    }
+
+    option.AJAR_uri = uri;
+
+    if (containsObject(c.value, selectedOptions)) {
+      option.setAttribute('selected', 'true');
+    }
+
+    return option;
+  }
+
+  if (editable) {
+    select.addEventListener('change', onChange, false);
+  }
+
+  return select;
+} // makeSelectForChoice
+
+
+function containsObject(obj, list) {
+  var i;
+
+  for (i = 0; i < list.length; i++) {
+    if (list[i] === obj) {
+      return true;
+    }
+  }
+
+  return false;
+}
 //# sourceMappingURL=forms.js.map
 
 /***/ }),
@@ -21995,6 +22289,800 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 /***/ }),
 
+/***/ "./lib/widgets/multiSelect.js":
+/*!************************************!*\
+  !*** ./lib/widgets/multiSelect.js ***!
+  \************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");
+
+var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js");
+
+Object.defineProperty(exports, "__esModule", ({
+  value: true
+}));
+exports.IconicMultiSelect = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ "./node_modules/@babel/runtime/helpers/toConsumableArray.js"));
+
+var _classCallCheck2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/classCallCheck */ "./node_modules/@babel/runtime/helpers/classCallCheck.js"));
+
+var _createClass2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/createClass */ "./node_modules/@babel/runtime/helpers/createClass.js"));
+
+var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "./node_modules/@babel/runtime/helpers/defineProperty.js"));
+
+var style = _interopRequireWildcard(__webpack_require__(/*! ../style_multiSelect */ "./lib/style_multiSelect.js"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/*
+ * IconicMultiSelect v0.7.0
+ * Licence:  MIT
+ * (c) 2021 Sidney Wimart.
+ * repo & configuration: https://github.com/sidneywm/iconic-multiselect
+ */
+
+/**
+ * @version IconicMultiSelect v0.7.0
+ * @licence  MIT
+ */
+var IconicMultiSelect = /*#__PURE__*/function () {
+  /**
+   * Iconic Multiselect constructor.
+   * @param { Object[] } data - Array of objects.
+   * @param { string } noData - Defines the message when there is no data input.
+   * @param { string } noResults - Defines the message when there is no result if options are filtered.
+   * @param { string } placeholder -  Defines the placeholder's text.
+   * @param { string } select - DOM element to be selected. It must be a HTML Select tag - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select
+   * @param { string } textField - Field to select in the object for the text.
+   * @param { string } valueField - Field to select in the object for the value.
+   */
+  function IconicMultiSelect(_ref) {
+    var data = _ref.data,
+        itemTemplate = _ref.itemTemplate,
+        noData = _ref.noData,
+        noResults = _ref.noResults,
+        placeholder = _ref.placeholder,
+        select = _ref.select,
+        container = _ref.container,
+        tagTemplate = _ref.tagTemplate,
+        textField = _ref.textField,
+        valueField = _ref.valueField;
+    (0, _classCallCheck2["default"])(this, IconicMultiSelect);
+    (0, _defineProperty2["default"])(this, "_data", void 0);
+    (0, _defineProperty2["default"])(this, "_domElements", void 0);
+    (0, _defineProperty2["default"])(this, "_event", function () {});
+    (0, _defineProperty2["default"])(this, "_itemTemplate", void 0);
+    (0, _defineProperty2["default"])(this, "_multiselect", void 0);
+    (0, _defineProperty2["default"])(this, "_noData", void 0);
+    (0, _defineProperty2["default"])(this, "_noResults", void 0);
+    (0, _defineProperty2["default"])(this, "_options", []);
+    (0, _defineProperty2["default"])(this, "_placeholder", void 0);
+    (0, _defineProperty2["default"])(this, "_select", void 0);
+    (0, _defineProperty2["default"])(this, "_selectContainer", void 0);
+    (0, _defineProperty2["default"])(this, "_selectedOptions", []);
+    (0, _defineProperty2["default"])(this, "_tagTemplate", void 0);
+    (0, _defineProperty2["default"])(this, "_textField", void 0);
+    (0, _defineProperty2["default"])(this, "_valueField", void 0);
+    (0, _defineProperty2["default"])(this, "_cross", "\n    <svg\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M6.2253 4.81108C5.83477 4.42056 5.20161 4.42056 4.81108 4.81108C4.42056 5.20161 4.42056 5.83477 4.81108 6.2253L10.5858 12L4.81114 17.7747C4.42062 18.1652 4.42062 18.7984 4.81114 19.1889C5.20167 19.5794 5.83483 19.5794 6.22535 19.1889L12 13.4142L17.7747 19.1889C18.1652 19.5794 18.7984 19.5794 19.1889 19.1889C19.5794 18.7984 19.5794 18.1652 19.1889 17.7747L13.4142 12L19.189 6.2253C19.5795 5.83477 19.5795 5.20161 19.189 4.81108C18.7985 4.42056 18.1653 4.42056 17.7748 4.81108L12 10.5858L6.2253 4.81108Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n    ");
+    this._data = data !== null && data !== void 0 ? data : [];
+    this._itemTemplate = itemTemplate !== null && itemTemplate !== void 0 ? itemTemplate : null;
+    this._noData = noData !== null && noData !== void 0 ? noData : 'No data found.';
+    this._noResults = noResults !== null && noResults !== void 0 ? noResults : 'No results found.';
+    this._placeholder = placeholder !== null && placeholder !== void 0 ? placeholder : 'Select...';
+    this._select = select; // Timea added a container here
+
+    this._selectContainer = container;
+    this._tagTemplate = tagTemplate !== null && tagTemplate !== void 0 ? tagTemplate : null;
+    this._textField = textField !== null && textField !== void 0 ? textField : null;
+    this._valueField = valueField !== null && valueField !== void 0 ? valueField : null;
+  }
+  /**
+   * Initialize the Iconic Multiselect component.
+   * @public
+   */
+
+
+  (0, _createClass2["default"])(IconicMultiSelect, [{
+    key: "init",
+    value: function init() {
+      // Timea change to use this._select instead of this._selectContainer
+      if (this._select && this._select.nodeName === 'SELECT') {
+        if (this._itemTemplate && this._data.length === 0) {
+          throw new Error('itemTemplate must be initialized with data from the component settings');
+        }
+
+        if (this._tagTemplate && this._data.length === 0) {
+          throw new Error('tagTemplate must be initialized with data from the component settings');
+        }
+
+        this._options = this._data.length > 0 ? this._getDataFromSettings() : this._getDataFromSelectTag();
+
+        this._renderMultiselect();
+
+        this._renderOptionsList();
+
+        this._domElements = {
+          clear: this._multiselect.querySelector('.multiselect__clear-btn'),
+          input: this._multiselect.querySelector('.multiselect__input'),
+          optionsContainer: this._multiselect.querySelector('.multiselect__options'),
+          optionsContainerList: this._multiselect.querySelector('.multiselect__options > ul'),
+          options: {
+            list: this._multiselect.querySelectorAll('.multiselect__options > ul > li'),
+            find: function find(callbackFn) {
+              for (var i = 0; i < this.list.length; i++) {
+                var node = this.list[i];
+                if (callbackFn(node)) return node;
+              }
+
+              return undefined;
+            },
+            some: function some(callbackFn) {
+              for (var i = 0; i < this.list.length; i++) {
+                var node = this.list[i];
+                if (callbackFn(node, i)) return true;
+              }
+
+              return false;
+            }
+          }
+        };
+
+        this._enableEventListenners();
+
+        this._initSelectedList();
+      } else {
+        throw new Error("The selector '".concat(this._select, "' did not select any valid select tag."));
+      }
+    }
+    /**
+     * Subscribes to the emitted events.
+     * @param { Function } callback - Callback function which emits a custom event object.
+     * @public
+     */
+
+  }, {
+    key: "subscribe",
+    value: function subscribe(callback) {
+      if (typeof callback === 'function') {
+        this._event = callback;
+      } else {
+        throw new Error('parameter in the subscribe method is not a function');
+      }
+    }
+    /**
+     * Add an option to the selection list.
+     * @param { Object: { text: string; value: string; }} option
+     * @private
+     */
+
+  }, {
+    key: "_addOptionToList",
+    value: function _addOptionToList(option, index) {
+      var _this = this;
+
+      var html = "<span class=\"multiselect__selected\" style=\"".concat(style.multiselect__selected, "\" data-value=\"").concat(option.value, "\">").concat(this._tagTemplate ? this._processTemplate(this._tagTemplate, index) : option.text, "<span class=\"multiselect__remove-btn\" style=\"").concat(style.multiselect__remove_btn, "\">").concat(this._cross, "</span></span>");
+
+      this._domElements.input.insertAdjacentHTML('beforebegin', html);
+
+      var _this$_multiselect$qu = this._multiselect.querySelector("span[data-value=\"".concat(option.value, "\"]")),
+          removeBtn = _this$_multiselect$qu.lastElementChild;
+
+      removeBtn.addEventListener('click', function () {
+        var target = _this._domElements.options.find(function (el) {
+          return el.dataset.value === option.value;
+        });
+
+        _this._handleOption(target);
+      });
+    }
+    /**
+     * Clears all selected options.
+     * @private
+     */
+
+  }, {
+    key: "_clearSelection",
+    value: function _clearSelection() {
+      var _this2 = this;
+
+      var _loop = function _loop(i) {
+        var option = _this2._selectedOptions[i];
+
+        var target = _this2._domElements.options.find(function (el) {
+          return el.dataset.value === option.value;
+        });
+
+        target.classList.remove('multiselect__options--selected');
+        target.setAttribute('style', style.multiselect__options);
+
+        _this2._removeOptionFromList(target.dataset.value);
+      };
+
+      for (var i = 0; i < this._selectedOptions.length; i++) {
+        _loop(i);
+      }
+
+      this._selectedOptions = [];
+
+      this._handleClearSelectionBtn();
+
+      this._handlePlaceholder();
+
+      this._dispatchEvent({
+        action: 'CLEAR_ALL_OPTIONS',
+        selection: this._selectedOptions
+      });
+    }
+    /**
+     * Close the options container.
+     * @private
+     */
+
+  }, {
+    key: "_closeList",
+    value: function _closeList() {
+      this._domElements.input.value = '';
+
+      this._domElements.optionsContainer.classList.remove('visible');
+
+      this._domElements.optionsContainer.setAttribute('style', style.multiselect__options);
+
+      this._filterOptions('');
+
+      this._removeAllArrowSelected();
+    }
+    /**
+     * Dispatches new events.
+     * @param { object : { action: string; selection: { option: string; text: string; }[]; value?: string; } } event
+     * @private
+     */
+
+  }, {
+    key: "_dispatchEvent",
+    value: function _dispatchEvent(event) {
+      this._event(event);
+    }
+    /**
+     * Enables all main event listenners.
+     * @private
+     */
+
+  }, {
+    key: "_enableEventListenners",
+    value: function _enableEventListenners() {
+      var _this3 = this;
+
+      document.addEventListener('mouseup', function (_ref2) {
+        var target = _ref2.target;
+
+        if (!_this3._multiselect.contains(target)) {
+          _this3._filterOptions('');
+
+          _this3._closeList();
+
+          _this3._handlePlaceholder();
+        }
+      });
+
+      this._domElements.clear.addEventListener('click', function () {
+        _this3._clearSelection();
+      });
+
+      for (var i = 0; i < this._domElements.options.list.length; i++) {
+        var option = this._domElements.options.list[i];
+        option.addEventListener('click', function (_ref3) {
+          var target = _ref3.target;
+
+          _this3._handleOption(target);
+
+          _this3._closeList();
+        });
+      }
+
+      this._domElements.input.addEventListener('focus', function () {
+        _this3._domElements.optionsContainer.classList.add('visible');
+
+        _this3._domElements.optionsContainer.setAttribute('style', style.multiselect__options_visible);
+      });
+
+      this._domElements.input.addEventListener('input', function (_ref4) {
+        var value = _ref4.target.value;
+
+        if (_this3._domElements.options.list.length > 0) {
+          _this3._filterOptions(value);
+        }
+      });
+
+      this._domElements.input.addEventListener('keydown', function (e) {
+        _this3._handleArrows(e);
+
+        _this3._handleBackspace(e);
+
+        _this3._handleEnter(e);
+      });
+    }
+    /**
+     * Filters user input.
+     * @param { string } value
+     * @private
+     */
+
+  }, {
+    key: "_filterOptions",
+    value: function _filterOptions(value) {
+      var _this4 = this;
+
+      var isOpen = this._domElements.optionsContainer.classList.contains('visible');
+
+      var valueLowerCase = value.toLowerCase();
+
+      if (!isOpen && value.length > 0) {
+        this._domElements.optionsContainer.classList.add('visible');
+
+        this._domElements.optionsContainer.setAttribute('style', style.multiselect__options_visible);
+      }
+
+      if (this._domElements.options.list.length > 0) {
+        for (var i = 0; i < this._domElements.options.list.length; i++) {
+          var el = this._domElements.options.list[i];
+          var text = this._itemTemplate ? this._data[i][this._textField] : el.textContent;
+
+          if (text.toLowerCase().substring(0, valueLowerCase.length) === valueLowerCase) {
+            this._domElements.optionsContainerList.appendChild(el);
+          } else {
+            el.parentNode && el.parentNode.removeChild(el);
+          }
+        }
+
+        var hasResults = this._domElements.options.some(function (el, index) {
+          return (_this4._itemTemplate ? _this4._data[index][_this4._textField] : el.textContent).toLowerCase().substring(0, valueLowerCase.length) === valueLowerCase;
+        });
+
+        this._showNoResults(!hasResults);
+      }
+    }
+  }, {
+    key: "_generateId",
+    value: function _generateId(length) {
+      var result = '';
+      var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+      var charactersLength = characters.length;
+
+      for (var i = 0; i < length; i++) {
+        result += characters.charAt(Math.floor(Math.random() * charactersLength));
+      }
+
+      return result;
+    }
+    /**
+     * Gets data from select tag.
+     * @private
+     */
+
+  }, {
+    key: "_getDataFromSelectTag",
+    value: function _getDataFromSelectTag() {
+      var arr = [];
+      var options = this._select.options;
+
+      for (var i = 0; i < options.length; i++) {
+        var item = options[i];
+        arr.push({
+          text: item.text,
+          value: item.value,
+          selected: item.hasAttribute('selected')
+        });
+      }
+
+      return arr;
+    }
+    /**
+     * Gets data from settings.
+     * @private
+     */
+
+  }, {
+    key: "_getDataFromSettings",
+    value: function _getDataFromSettings() {
+      if (this._data.length > 0 && this._valueField && this._textField) {
+        var isValueFieldValid = typeof this._valueField === 'string';
+        var isTextFieldValid = typeof this._textField === 'string';
+        var arr = [];
+
+        if (!isValueFieldValid || !isTextFieldValid) {
+          throw new Error('textField and valueField must be of type string');
+        }
+
+        for (var i = 0; i < this._data.length; i++) {
+          var item = this._data[i];
+          arr.push({
+            value: item[this._valueField],
+            text: item[this._textField],
+            selected: typeof item.selected === 'boolean' ? item.selected : false
+          });
+        }
+
+        return arr;
+      } else {
+        return null;
+      }
+    }
+    /**
+     * Handles Arrow up & Down. Selection of an option is also possible with these keys.
+     * @param { Event } event
+     * @private
+     */
+
+  }, {
+    key: "_handleArrows",
+    value: function _handleArrows(event) {
+      if (event.keyCode === 40 || event.keyCode === 38) {
+        event.preventDefault();
+
+        var isOpen = this._domElements.optionsContainer.classList.contains('visible'); // An updated view of the container is needed because of the filtering option
+
+
+        var optionsContainerList = this._multiselect.querySelector('.multiselect__options > ul');
+
+        if (!isOpen) {
+          this._domElements.optionsContainer.classList.add('visible');
+
+          this._domElements.optionsContainer.setAttribute('style', style.multiselect__options_visible);
+
+          optionsContainerList.firstElementChild.classList.add('arrow-selected');
+          optionsContainerList.firstElementChild.setAttribute('style', style.multiselect__options_ul_li_arrow_selected);
+          optionsContainerList.firstElementChild.scrollIntoView(false);
+        } else {
+          var selected = this._multiselect.querySelector('.multiselect__options ul li.arrow-selected');
+
+          var action = {
+            ArrowUp: 'previous',
+            Up: 'previous',
+            ArrowDown: 'next',
+            Down: 'next'
+          };
+
+          if (!selected) {
+            optionsContainerList.firstElementChild.classList.add('arrow-selected');
+            optionsContainerList.firstElementChild.setAttribute('style', style.multiselect__options_ul_li_arrow_selected);
+            optionsContainerList.firstElementChild.scrollIntoView(false);
+            return;
+          }
+
+          selected.classList.remove('arrow-selected');
+          selected.setAttribute('style', style.multiselect__options_ul_li);
+          selected = selected[action[event.key] + 'ElementSibling']; // Go to start or end of the popup list
+
+          if (!selected) {
+            selected = optionsContainerList.children[action[event.key] === 'next' ? 0 : optionsContainerList.children.length - 1];
+            selected.classList.add('arrow-selected');
+            selected.setAttribute('style', style.multiselect__options_ul_li_arrow_selected);
+
+            this._scrollIntoView(optionsContainerList, selected);
+
+            return;
+          }
+
+          selected.classList.add('arrow-selected');
+          selected.setAttribute('style', style.multiselect__options_ul_li_arrow_selected);
+
+          this._scrollIntoView(optionsContainerList, selected);
+        }
+      }
+    }
+    /**
+     * Handles the backspace key event - Deletes the preceding option in the selection list.
+     * @param { Event } e
+     * @private
+     */
+
+  }, {
+    key: "_handleBackspace",
+    value: function _handleBackspace(e) {
+      if (e.keyCode === 8 && e.target.value === '') {
+        var lastSelectedOption = this._selectedOptions.length > 0 ? this._selectedOptions[this._selectedOptions.length - 1] : null;
+
+        if (lastSelectedOption) {
+          var targetLastSelectedOption = this._multiselect.querySelector("li[data-value=\"".concat(lastSelectedOption.value, "\"]"));
+
+          this._handleOption(targetLastSelectedOption);
+
+          if (this._selectedOptions.length === 0) {
+            this._domElements.optionsContainer.classList.remove('visible');
+
+            this._domElements.optionsContainer.setAttribute('style', style.multiselect__options);
+          }
+        }
+      }
+    }
+    /**
+     * Shows clear selection button if some options are selected.
+     * @private
+     */
+
+  }, {
+    key: "_handleClearSelectionBtn",
+    value: function _handleClearSelectionBtn() {
+      if (this._selectedOptions.length > 0) {
+        this._domElements.clear.style.display = 'flex';
+      } else {
+        this._domElements.clear.style.display = 'none';
+      }
+    }
+    /**
+     * Handles the enter key event.
+     * @param { Event } event
+     * @private
+     */
+
+  }, {
+    key: "_handleEnter",
+    value: function _handleEnter(event) {
+      if (event.keyCode === 13) {
+        var selected = this._multiselect.querySelector('.multiselect__options ul li.arrow-selected');
+
+        if (selected) {
+          this._handleOption(selected);
+
+          this._closeList();
+        }
+      }
+    }
+  }, {
+    key: "_handleOption",
+    value: function _handleOption(target) {
+      var dispatchEvent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+
+      // Remove
+      for (var i = 0; i < this._selectedOptions.length; i++) {
+        var el = this._selectedOptions[i];
+
+        if (el.value === target.dataset.value) {
+          target.classList.remove('multiselect__options--selected');
+          target.setAttribute('style', style.multiselect__options);
+
+          this._selectedOptions.splice(i, 1);
+
+          this._removeOptionFromList(target.dataset.value);
+
+          this._handleClearSelectionBtn();
+
+          this._handlePlaceholder();
+
+          return dispatchEvent && this._dispatchEvent({
+            action: 'REMOVE_OPTION',
+            value: target.dataset.value,
+            selection: this._selectedOptions
+          });
+        }
+      } // Add
+
+
+      for (var _i = 0; _i < this._options.length; _i++) {
+        var option = this._options[_i];
+
+        if (option.value === target.dataset.value) {
+          target.classList.add('multiselect__options--selected');
+          target.setAttribute('style', style.multiselect__options_selected);
+          this._selectedOptions = [].concat((0, _toConsumableArray2["default"])(this._selectedOptions), [option]);
+
+          this._addOptionToList(option, _i);
+
+          this._handleClearSelectionBtn();
+
+          this._handlePlaceholder();
+
+          return dispatchEvent && this._dispatchEvent({
+            action: 'ADD_OPTION',
+            value: target.dataset.value,
+            selection: this._selectedOptions
+          });
+        }
+      }
+    }
+    /**
+     * Shows the placeholder if no options are selected.
+     * @private
+     */
+
+  }, {
+    key: "_handlePlaceholder",
+    value: function _handlePlaceholder() {
+      this._domElements.input.placeholder = this._placeholder;
+    }
+  }, {
+    key: "_initSelectedList",
+    value: function _initSelectedList() {
+      var _this5 = this;
+
+      var hasItemsSelected = false;
+
+      var _loop2 = function _loop2(i) {
+        var option = _this5._options[i];
+
+        if (option.selected) {
+          hasItemsSelected = true;
+
+          var target = _this5._domElements.options.find(function (el) {
+            return el.dataset.value === option.value;
+          });
+
+          target.classList.add('multiselect__options--selected');
+          target.setAttribute('style', style.multiselect__options_selected);
+          _this5._selectedOptions = [].concat((0, _toConsumableArray2["default"])(_this5._selectedOptions), [option]);
+
+          _this5._addOptionToList(option, i);
+        }
+      };
+
+      for (var i = 0; i < this._options.length; i++) {
+        _loop2(i);
+      }
+
+      if (hasItemsSelected) {
+        this._handleClearSelectionBtn();
+      }
+
+      this._handlePlaceholder();
+    }
+    /**
+     * Process the custom template.
+     * @param { string } template
+     * @private
+     */
+
+  }, {
+    key: "_processTemplate",
+    value: function _processTemplate(template, index) {
+      var processedTemplate = template;
+      var objAttr = template.match(/\$\{(\w+)\}/g).map(function (e) {
+        return e.replace(/\$\{|\}/g, '');
+      });
+
+      for (var i = 0; i < objAttr.length; i++) {
+        var _this$_data$index$att;
+
+        var attr = objAttr[i]; // eslint-disable-next-line no-useless-escape
+
+        processedTemplate = processedTemplate.replace("${".concat(attr, "}"), (_this$_data$index$att = this._data[index][attr]) !== null && _this$_data$index$att !== void 0 ? _this$_data$index$att : '');
+      }
+
+      return processedTemplate;
+    }
+  }, {
+    key: "_removeAllArrowSelected",
+    value: function _removeAllArrowSelected() {
+      var className = 'arrow-selected';
+
+      var target = this._domElements.options.find(function (el) {
+        return el.classList.contains(className);
+      });
+
+      target && target.classList.remove(className) && target.setAttribute('style', style.multiselect__options_ul_li);
+    }
+    /**
+     * Removes an option from the list.
+     * @param { string } value
+     * @private
+     */
+
+  }, {
+    key: "_removeOptionFromList",
+    value: function _removeOptionFromList(value) {
+      var optionDom = this._multiselect.querySelector("span[data-value=\"".concat(value, "\"]"));
+
+      optionDom && optionDom.parentNode && optionDom.parentNode.removeChild(optionDom);
+    }
+    /**
+     * Renders the multiselect options list view.
+     * @private
+     */
+
+  }, {
+    key: "_renderOptionsList",
+    value: function _renderOptionsList() {
+      var _this6 = this;
+
+      var html = "\n        <div class=\"multiselect__options\" style=\"".concat(style.multiselect__options, "\">\n          <ul style=\"").concat(style.multiselect__options_ul, "\">\n          ").concat(this._options.length > 0 && !this._itemTemplate ? this._options.map(function (option) {
+        return "\n              <li data-value=\"".concat(option.value, "\" style=\"").concat(style.multiselect__options_ul_li, "\">").concat(option.text, "</li>\n            ");
+      }).join('') : '', "\n\n          ").concat(this._options.length > 0 && this._itemTemplate ? this._options.map(function (option, index) {
+        return "\n              <li data-value=\"".concat(option.value, "\" style=\"").concat(style.multiselect__options_ul_li, "\">").concat(_this6._processTemplate(_this6._itemTemplate, index), "</li>\n            ");
+      }).join('') : '', "\n          ").concat(this._showNoData(this._options.length === 0), "\n          </ul>\n        </div>\n      ");
+
+      this._multiselect.insertAdjacentHTML('beforeend', html);
+    }
+    /**
+     * Renders the multiselect view.
+     * @private
+     */
+
+  }, {
+    key: "_renderMultiselect",
+    value: function _renderMultiselect() {
+      this._select.style.display = 'none';
+
+      var id = 'iconic-' + this._generateId(20); // Timea created dedicated div element because previous code was not rendering
+
+
+      this._multiselect = document.createElement('div');
+
+      this._multiselect.setAttribute('id', id);
+
+      this._multiselect.setAttribute('class', 'multiselect__container');
+
+      this._multiselect.setAttribute('style', style.multiselect__container);
+
+      var html = "\n        <div class=\"multiselect__wrapper\" style=\"".concat(style.multiselect__wrapper, "\">\n          <input class=\"multiselect__input\" style=\"").concat(style.multiselect__input, "\" placeholder=\"").concat(this._placeholder, "\" />\n        </div>\n        <span style=\"display: none;\" class=\"multiselect__clear-btn\" style=\"").concat(style.multiselect__clear_btn, "\">").concat(this._cross, "</span>\n    ");
+      this._multiselect.innerHTML = html;
+
+      this._selectContainer.appendChild(this._multiselect);
+    }
+    /**
+     * ScrollIntoView - This small utility reproduces the behavior of .scrollIntoView({ block: "nearest", inline: "nearest" })
+     * This is for IE compatibility without a need of a polyfill
+     * @private
+     */
+
+  }, {
+    key: "_scrollIntoView",
+    value: function _scrollIntoView(parent, child) {
+      var rectParent = parent.getBoundingClientRect();
+      var rectChild = child.getBoundingClientRect(); // Detect if not visible at top and then scroll to the top
+
+      if (!(rectParent.top < rectChild.bottom - child.offsetHeight)) {
+        parent.scrollTop = child.clientHeight + (child.offsetTop - child.offsetHeight);
+      } // Detect if not visible at bottom and then scroll to the bottom
+
+
+      if (!(rectParent.bottom > rectChild.top + child.offsetHeight)) {
+        parent.scrollTop = child.clientHeight + (child.offsetTop - child.offsetHeight) - (parent.offsetHeight - (child.offsetHeight + (child.offsetHeight - child.clientHeight)));
+      }
+    }
+    /**
+     * Shows a no data message.
+     * @param { boolean } condition
+     * @private
+     */
+
+  }, {
+    key: "_showNoData",
+    value: function _showNoData(condition) {
+      return condition ? "<p class=\"multiselect__options--no-data\" style=\"".concat(style.multiselect__options_ul_p_multiselect__options_no_data, "\">").concat(this._noData, "</p>") : '';
+    }
+    /**
+     * Shows a no results message.
+     * @param { boolean } condition
+     * @private
+     */
+
+  }, {
+    key: "_showNoResults",
+    value: function _showNoResults(condition) {
+      var dom = this._multiselect.querySelector('.multiselect__options--no-results');
+
+      if (condition) {
+        var html = "<p class=\"multiselect__options--no-results\" style=\"".concat(style.multiselect__options_ul_p_multiselect__options_no_results, "\">").concat(this._noResults, "</p>");
+        !dom && this._domElements.optionsContainerList.insertAdjacentHTML('beforeend', html);
+      } else {
+        dom && dom.parentNode && dom.parentNode.removeChild(dom);
+      }
+    }
+  }]);
+  return IconicMultiSelect;
+}();
+
+exports.IconicMultiSelect = IconicMultiSelect;
+//# sourceMappingURL=multiSelect.js.map
+
+/***/ }),
+
 /***/ "./lib/widgets/peoplePicker.js":
 /*!*************************************!*\
   !*** ./lib/widgets/peoplePicker.js ***!
@@ -22666,6 +23754,22 @@ module.exports = _arrayWithHoles, module.exports.__esModule = true, module.expor
 
 /***/ }),
 
+/***/ "./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js":
+/*!******************************************************************!*\
+  !*** ./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js ***!
+  \******************************************************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+var arrayLikeToArray = __webpack_require__(/*! ./arrayLikeToArray.js */ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js");
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return arrayLikeToArray(arr);
+}
+
+module.exports = _arrayWithoutHoles, module.exports.__esModule = true, module.exports["default"] = module.exports;
+
+/***/ }),
+
 /***/ "./node_modules/@babel/runtime/helpers/assertThisInitialized.js":
 /*!**********************************************************************!*\
   !*** ./node_modules/@babel/runtime/helpers/assertThisInitialized.js ***!
@@ -22931,6 +24035,20 @@ module.exports = _isNativeReflectConstruct, module.exports.__esModule = true, mo
 
 /***/ }),
 
+/***/ "./node_modules/@babel/runtime/helpers/iterableToArray.js":
+/*!****************************************************************!*\
+  !*** ./node_modules/@babel/runtime/helpers/iterableToArray.js ***!
+  \****************************************************************/
+/***/ ((module) => {
+
+function _iterableToArray(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+
+module.exports = _iterableToArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
+
+/***/ }),
+
 /***/ "./node_modules/@babel/runtime/helpers/iterableToArrayLimit.js":
 /*!*********************************************************************!*\
   !*** ./node_modules/@babel/runtime/helpers/iterableToArrayLimit.js ***!
@@ -22985,6 +24103,20 @@ module.exports = _nonIterableRest, module.exports.__esModule = true, module.expo
 
 /***/ }),
 
+/***/ "./node_modules/@babel/runtime/helpers/nonIterableSpread.js":
+/*!******************************************************************!*\
+  !*** ./node_modules/@babel/runtime/helpers/nonIterableSpread.js ***!
+  \******************************************************************/
+/***/ ((module) => {
+
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+module.exports = _nonIterableSpread, module.exports.__esModule = true, module.exports["default"] = module.exports;
+
+/***/ }),
+
 /***/ "./node_modules/@babel/runtime/helpers/possibleConstructorReturn.js":
 /*!**************************************************************************!*\
   !*** ./node_modules/@babel/runtime/helpers/possibleConstructorReturn.js ***!
@@ -23071,6 +24203,28 @@ module.exports = _taggedTemplateLiteral, module.exports.__esModule = true, modul
 
 /***/ }),
 
+/***/ "./node_modules/@babel/runtime/helpers/toConsumableArray.js":
+/*!******************************************************************!*\
+  !*** ./node_modules/@babel/runtime/helpers/toConsumableArray.js ***!
+  \******************************************************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+var arrayWithoutHoles = __webpack_require__(/*! ./arrayWithoutHoles.js */ "./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js");
+
+var iterableToArray = __webpack_require__(/*! ./iterableToArray.js */ "./node_modules/@babel/runtime/helpers/iterableToArray.js");
+
+var unsupportedIterableToArray = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js");
+
+var nonIterableSpread = __webpack_require__(/*! ./nonIterableSpread.js */ "./node_modules/@babel/runtime/helpers/nonIterableSpread.js");
+
+function _toConsumableArray(arr) {
+  return arrayWithoutHoles(arr) || iterableToArray(arr) || unsupportedIterableToArray(arr) || nonIterableSpread();
+}
+
+module.exports = _toConsumableArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
+
+/***/ }),
+
 /***/ "./node_modules/@babel/runtime/helpers/typeof.js":
 /*!*******************************************************!*\
   !*** ./node_modules/@babel/runtime/helpers/typeof.js ***!
@@ -25768,31 +26922,6 @@ function freeze(object, oc) {
 	return oc && typeof oc.freeze === 'function' ? oc.freeze(object) : object
 }
 
-/**
- * Since we can not rely on `Object.assign` we provide a simplified version
- * that is sufficient for our needs.
- *
- * @param {Object} target
- * @param {Object | null | undefined} source
- *
- * @returns {Object} target
- * @throws TypeError if target is not an object
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
- * @see https://tc39.es/ecma262/multipage/fundamental-objects.html#sec-object.assign
- */
-function assign(target, source) {
-	if (target === null || typeof target !== 'object') {
-		throw new TypeError('target is not an object')
-	}
-	for (var key in source) {
-		if (Object.prototype.hasOwnProperty.call(source, key)) {
-			target[key] = source[key]
-		}
-	}
-	return target
-}
-
 /**
  * All mime types that are allowed as input to `DOMParser.parseFromString`
  *
@@ -25910,7 +27039,6 @@ var NAMESPACE = freeze({
 	XMLNS: 'http://www.w3.org/2000/xmlns/',
 })
 
-exports.assign = assign;
 exports.freeze = freeze;
 exports.MIME_TYPE = MIME_TYPE;
 exports.NAMESPACE = NAMESPACE;
@@ -27445,10 +28573,9 @@ function needNamespaceDefine(node, isHTML, visibleNamespaces) {
  * are serialized as their entity references, so they will be preserved.
  * (In contrast to whitespace literals in the input which are normalized to spaces)
  * @see https://www.w3.org/TR/xml11/#AVNormalize
- * @see https://w3c.github.io/DOM-Parsing/#serializing-an-element-s-attributes
  */
 function addSerializedAttribute(buf, qualifiedName, value) {
-	buf.push(' ', qualifiedName, '="', value.replace(/[<>&"\t\n\r]/g, _xmlEncoder), '"')
+	buf.push(' ', qualifiedName, '="', value.replace(/[<&"\t\n\r]/g, _xmlEncoder), '"')
 }
 
 function serializeToString(node,buf,isHTML,nodeFilter,visibleNamespaces){
@@ -27593,10 +28720,10 @@ function serializeToString(node,buf,isHTML,nodeFilter,visibleNamespaces){
 		 * and does not include the CDATA-section-close delimiter, `]]>`.
 		 *
 		 * @see https://www.w3.org/TR/xml/#NT-CharData
-		 * @see https://w3c.github.io/DOM-Parsing/#xml-serializing-a-text-node
 		 */
 		return buf.push(node.data
-			.replace(/[<&>]/g,_xmlEncoder)
+			.replace(/[<&]/g,_xmlEncoder)
+			.replace(/]]>/g, ']]&gt;')
 		);
 	case CDATA_SECTION_NODE:
 		return buf.push( '<![CDATA[',node.data,']]>');
@@ -44625,8 +45752,8 @@ class N3Parser {
   _saveContext(type, graph, subject, predicate, object) {
     const n3Mode = this._n3Mode;
     this._contextStack.push({
-      subject: subject, predicate: predicate, object: object,
-      graph: graph, type: type,
+      type,
+      subject, predicate, object, graph,
       inverse: n3Mode ? this._inversePredicate : false,
       blankPrefix: n3Mode ? this._prefixes._ : '',
       quantified: n3Mode ? this._quantified : null,
@@ -44645,14 +45772,20 @@ class N3Parser {
 
   // ### `_restoreContext` restores the parent context
   // when leaving a scope (list, blank node, formula)
-  _restoreContext() {
-    const context = this._contextStack.pop(), n3Mode = this._n3Mode;
+  _restoreContext(type, token) {
+    // Obtain the previous context
+    const context = this._contextStack.pop();
+    if (!context || context.type !== type)
+      return this._error(`Unexpected ${token.type}`, token);
+
+    // Restore the quad of the previous context
     this._subject   = context.subject;
     this._predicate = context.predicate;
     this._object    = context.object;
     this._graph     = context.graph;
-    // The settings below only apply to N3 streams
-    if (n3Mode) {
+
+    // Restore N3 context settings
+    if (this._n3Mode) {
       this._inversePredicate = context.inverse;
       this._prefixes._ = context.blankPrefix;
       this._quantified = context.quantified;
@@ -44925,7 +46058,7 @@ class N3Parser {
 
     // Restore the parent context containing this blank node
     const empty = this._predicate === null;
-    this._restoreContext();
+    this._restoreContext('blank', token);
     // If the blank node was the object, restore previous context and read punctuation
     if (this._object !== null)
       return this._getContextEndReader();
@@ -44976,7 +46109,7 @@ class N3Parser {
       break;
     case ')':
       // Closing the list; restore the parent context
-      this._restoreContext();
+      this._restoreContext('list', token);
       // If this list is contained within a parent list, return the membership quad here.
       // This will be `<parent list element> rdf:first <this list>.`.
       if (stack.length !== 0 && stack[stack.length - 1].type === 'list')
@@ -45127,7 +46260,7 @@ class N3Parser {
       this._emit(this._subject, this._predicate, this._object, this._graph);
 
     // Restore the parent context containing this formula
-    this._restoreContext();
+    this._restoreContext('formula', token);
     // If the formula was the subject, continue reading the predicate.
     // If the formula was the object, read punctuation.
     return this._object === null ? this._readPredicate : this._getContextEndReader();
@@ -45336,7 +46469,7 @@ class N3Parser {
         // The list item is the remaining subejct after reading the path
         const item = this._subject;
         // Switch back to the context of the list
-        this._restoreContext();
+        this._restoreContext('item', token);
         // Output the list item
         this._emit(this._subject, this.RDF_FIRST, item, this._graph);
       }
@@ -45398,7 +46531,7 @@ class N3Parser {
     // Read the quad and restore the previous context
     const quad = this._quad(this._subject, this._predicate, this._object,
       this._graph || this.DEFAULTGRAPH);
-    this._restoreContext();
+    this._restoreContext('<<', token);
     // If the triple was the subject, continue by reading the predicate.
     if (this._subject === null) {
       this._subject = quad;
@@ -65662,7 +66795,7 @@ var SolidAuthnLogic = /** @class */ (function () {
         if (app.viewingNoAuthPage) {
             return (0, rdflib_1.sym)(app.webId);
         }
-        if (this.session.info.webId && this.session.info.isLoggedIn) {
+        if (this && this.session && this.session.info && this.session.info.webId && this.session.info.isLoggedIn) {
             return (0, rdflib_1.sym)(this.session.info.webId);
         }
         return (0, authUtil_1.offlineTestID)(); // null unless testing
@@ -66189,6 +67322,29 @@ exports.determineChatContainer = determineChatContainer;
 
 "use strict";
 
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -66225,16 +67381,128 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.loadAllTypeIndexes = exports.loadCommunityTypeIndexes = exports.loadTypeIndexesFor = exports.loadPreferences = exports.loadProfile = void 0;
+exports.deleteTypeIndexRegistration = exports.registerInstanceInTypeIndex = exports.getAppInstances = exports.getScopedAppInstances = exports.getScopedAppsFromIndex = exports.uniqueNodes = exports.loadAllTypeIndexes = exports.loadCommunityTypeIndexes = exports.loadTypeIndexesFor = exports.loadPreferences = exports.loadProfile = exports.followOrCreateLink = exports.suggestPrivateTypeIndex = exports.suggestPublicTypeIndex = exports.suggestPreferencesFile = exports.loadOrCreateIfNotExists = void 0;
 var rdflib_1 = __webpack_require__(/*! rdflib */ "./node_modules/rdflib/esm/index.js");
-var ns = {
-    solid: (0, rdflib_1.Namespace)('http://www.w3.org/ns/solid/terms#'),
-    space: (0, rdflib_1.Namespace)('http://www.w3.org/ns/pim/space#')
-};
+var $rdf = __importStar(__webpack_require__(/*! rdflib */ "./node_modules/rdflib/esm/index.js"));
+var solidLogicSingleton_1 = __webpack_require__(/*! ../logic/solidLogicSingleton */ "./node_modules/solid-logic/lib/logic/solidLogicSingleton.js");
+var uri_1 = __webpack_require__(/*! ../util/uri */ "./node_modules/solid-logic/lib/util/uri.js");
+var solid_namespace_1 = __importDefault(__webpack_require__(/*! solid-namespace */ "./node_modules/solid-namespace/index.js"));
+var authn = solidLogicSingleton_1.solidLogicSingleton.authn;
+var currentUser = authn.currentUser;
+var ns = (0, solid_namespace_1.default)($rdf);
+/**
+ * Create a resource if it really does not exist
+ * Be absolutely sure something does not exist before creating a new empty file
+ * as otherwise existing could  be deleted.
+ * @param doc {NamedNode} - The resource
+ */
+function loadOrCreateIfNotExists(store, doc) {
+    return __awaiter(this, void 0, void 0, function () {
+        var response, err_1, msg, msg;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    return [4 /*yield*/, store.fetcher.load(doc)];
+                case 1:
+                    response = _a.sent();
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _a.sent();
+                    if (err_1.response.status === 404) {
+                        try {
+                            store.fetcher.webOperation('PUT', doc, { data: '', contentType: 'text/turtle' });
+                        }
+                        catch (err) {
+                            msg = 'createIfNotExists: PUT FAILED: ' + doc + ': ' + err;
+                            throw new Error(msg);
+                        }
+                        delete store.fetcher.requested[doc.uri]; // delete cached 404 error
+                    }
+                    else {
+                        msg = 'createIfNotExists doc load error NOT 404:  ' + doc + ': ' + err_1;
+                        throw new Error(msg); // @@ add nested errors
+                    }
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/, response];
+            }
+        });
+    });
+}
+exports.loadOrCreateIfNotExists = loadOrCreateIfNotExists;
+function suggestPreferencesFile(me) {
+    var stripped = me.uri.replace('/profile/', '/').replace('/public/', '/');
+    // const stripped = me.uri.replace(\/[p|P]rofile/\g, '/').replace(\/[p|P]ublic/\g, '/')
+    var folderURI = stripped.split('/').slice(0, -1).join('/') + '/Settings/';
+    var fileURI = folderURI + 'Preferences.ttl';
+    return (0, rdflib_1.sym)(fileURI);
+}
+exports.suggestPreferencesFile = suggestPreferencesFile;
+function suggestPublicTypeIndex(me) {
+    var _a;
+    return (0, rdflib_1.sym)(((_a = me.doc().dir()) === null || _a === void 0 ? void 0 : _a.uri) + 'publicTypeIndex.ttl');
+}
+exports.suggestPublicTypeIndex = suggestPublicTypeIndex;
+// Note this one is based off the pref file not the profile
+function suggestPrivateTypeIndex(preferencesFile) {
+    var _a;
+    return (0, rdflib_1.sym)(((_a = preferencesFile.doc().dir()) === null || _a === void 0 ? void 0 : _a.uri) + 'privateTypeIndex.ttl');
+}
+exports.suggestPrivateTypeIndex = suggestPrivateTypeIndex;
+/* Follow link from this doc to another thing, or else make a new link
+**
+** return: null no ld one and failed to make a new one
+*/
+function followOrCreateLink(store, subject, predicate, object, doc) {
+    return __awaiter(this, void 0, void 0, function () {
+        var result, err_2, err_3;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, store.fetcher.load(doc)];
+                case 1:
+                    _a.sent();
+                    result = store.any(subject, predicate, null, doc);
+                    if (result)
+                        return [2 /*return*/, result];
+                    if (!store.updater.editable(doc)) {
+                        return [2 /*return*/, null];
+                    }
+                    _a.label = 2;
+                case 2:
+                    _a.trys.push([2, 4, , 5]);
+                    return [4 /*yield*/, store.updater.update([], [(0, rdflib_1.st)(subject, predicate, object, doc)])];
+                case 3:
+                    _a.sent();
+                    return [3 /*break*/, 5];
+                case 4:
+                    err_2 = _a.sent();
+                    console.warn("followOrCreateLink: Error making link in ".concat(doc, " to ").concat(object, ": ").concat(err_2));
+                    return [2 /*return*/, null];
+                case 5:
+                    _a.trys.push([5, 7, , 8]);
+                    return [4 /*yield*/, loadOrCreateIfNotExists(store, object)
+                        // store.fetcher.webOperation('PUT', object, { data: '', contentType: 'text/turtle'})
+                    ];
+                case 6:
+                    _a.sent();
+                    return [3 /*break*/, 8];
+                case 7:
+                    err_3 = _a.sent();
+                    console.warn("followOrCreateLink: Error loading or saving new linked document: ".concat(object, ": ").concat(err_3));
+                    return [3 /*break*/, 8];
+                case 8: return [2 /*return*/, object];
+            }
+        });
+    });
+}
+exports.followOrCreateLink = followOrCreateLink;
 function loadProfile(store, user) {
     return __awaiter(this, void 0, void 0, function () {
-        var err_1;
+        var err_4;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
@@ -66249,8 +67517,8 @@ function loadProfile(store, user) {
                     _a.sent();
                     return [3 /*break*/, 4];
                 case 3:
-                    err_1 = _a.sent();
-                    throw new Error("Unable to load profile of user <".concat(user, ">: ").concat(err_1));
+                    err_4 = _a.sent();
+                    throw new Error("Unable to load profile of user ".concat(user, ": ").concat(err_4));
                 case 4: return [2 /*return*/, user.doc()];
             }
         });
@@ -66259,27 +67527,32 @@ function loadProfile(store, user) {
 exports.loadProfile = loadProfile;
 function loadPreferences(store, user) {
     return __awaiter(this, void 0, void 0, function () {
-        var profile, preferencesFile;
+        var possiblePreferencesFile, preferencesFile, message, err_5;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0: return [4 /*yield*/, loadProfile(store, user)];
                 case 1:
-                    profile = _a.sent();
-                    preferencesFile = store.any(user, ns.space('preferencesFile'), undefined, profile);
+                    _a.sent();
+                    possiblePreferencesFile = suggestPreferencesFile(user);
+                    return [4 /*yield*/, followOrCreateLink(store, user, ns.space('preferencesFile'), possiblePreferencesFile, user.doc())];
+                case 2:
+                    preferencesFile = _a.sent();
                     if (!preferencesFile) {
-                        // throw new Error(`USer ${user} has no pointer in profile to preferences file.`)
+                        message = "User ".concat(user, " has no pointer in profile to preferences file.");
+                        console.warn(message);
                         return [2 /*return*/, undefined];
                     }
-                    try {
-                        store.fetcher.load(preferencesFile);
-                    }
-                    catch (err) { // Mabeb a permission propblem or origin problem
-                        return [2 /*return*/, undefined
-                            // throw new Error(`Unable to load preferences file ${preferencesFile} of user <${user}>: ${err}`)
-                        ];
-                        // throw new Error(`Unable to load preferences file ${preferencesFile} of user <${user}>: ${err}`)
-                    }
-                    return [2 /*return*/, preferencesFile];
+                    _a.label = 3;
+                case 3:
+                    _a.trys.push([3, 5, , 6]);
+                    return [4 /*yield*/, store.fetcher.load(preferencesFile)];
+                case 4:
+                    _a.sent();
+                    return [3 /*break*/, 6];
+                case 5:
+                    err_5 = _a.sent();
+                    return [2 /*return*/, undefined];
+                case 6: return [2 /*return*/, preferencesFile];
             }
         });
     });
@@ -66287,7 +67560,7 @@ function loadPreferences(store, user) {
 exports.loadPreferences = loadPreferences;
 function loadTypeIndexesFor(store, user) {
     return __awaiter(this, void 0, void 0, function () {
-        var profile, publicTypeIndex, _a, pub, preferencesFile, privateTypeIndexes, priv;
+        var profile, suggestion, publicTypeIndex, publicScopes, preferencesFile, err_6, privateScopes, suggestedPrivateTypeIndex, privateTypeIndex, _a, scopes, files, err_7;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -66296,30 +67569,55 @@ function loadTypeIndexesFor(store, user) {
                     return [4 /*yield*/, loadProfile(store, user)];
                 case 1:
                     profile = _b.sent();
-                    publicTypeIndex = store.any(user, ns.solid('publicTypeIndex'), undefined, profile);
-                    if (!publicTypeIndex) return [3 /*break*/, 5];
-                    _b.label = 2;
+                    suggestion = suggestPublicTypeIndex(user);
+                    return [4 /*yield*/, followOrCreateLink(store, user, ns.solid('publicTypeIndex'), suggestion, profile)];
                 case 2:
-                    _b.trys.push([2, 4, , 5]);
-                    return [4 /*yield*/, store.fetcher.load(publicTypeIndex)];
+                    publicTypeIndex = _b.sent();
+                    publicScopes = publicTypeIndex ? [{ label: 'public', index: publicTypeIndex, agent: user }] : [];
+                    _b.label = 3;
                 case 3:
-                    _b.sent();
-                    return [3 /*break*/, 5];
+                    _b.trys.push([3, 5, , 6]);
+                    return [4 /*yield*/, loadPreferences(store, user)];
                 case 4:
-                    _a = _b.sent();
-                    return [3 /*break*/, 5];
+                    preferencesFile = _b.sent();
+                    return [3 /*break*/, 6];
                 case 5:
-                    pub = publicTypeIndex ? [{ label: 'public', index: publicTypeIndex, agent: user }] : [];
-                    return [4 /*yield*/, loadPreferences(store, user)];
+                    err_6 = _b.sent();
+                    preferencesFile = null;
+                    return [3 /*break*/, 6];
                 case 6:
-                    preferencesFile = _b.sent();
-                    if (preferencesFile) { // watch out - can be in either as spec was not clear
-                        privateTypeIndexes = store.each(user, ns.solid('privateTypeIndex'), undefined, preferencesFile)
-                            .concat(store.each(user, ns.solid('privateTypeIndex'), undefined, profile));
-                        priv = privateTypeIndexes.length > 0 ? [{ label: 'priSo @@@@@vate', index: privateTypeIndexes[0], agent: user }] : [];
-                        return [2 /*return*/, pub.concat(priv)];
-                    }
-                    return [2 /*return*/, pub];
+                    if (!preferencesFile) return [3 /*break*/, 9];
+                    suggestedPrivateTypeIndex = suggestPrivateTypeIndex(preferencesFile);
+                    _a = store.any(user, ns.solid('privateTypeIndex'), undefined, profile);
+                    if (_a) return [3 /*break*/, 8];
+                    return [4 /*yield*/, followOrCreateLink(store, user, ns.solid('privateTypeIndex'), suggestedPrivateTypeIndex, preferencesFile)];
+                case 7:
+                    _a = (_b.sent());
+                    _b.label = 8;
+                case 8:
+                    privateTypeIndex = _a;
+                    privateScopes = privateTypeIndex ? [{ label: 'private', index: privateTypeIndex, agent: user }] : [];
+                    return [3 /*break*/, 10];
+                case 9:
+                    privateScopes = [];
+                    _b.label = 10;
+                case 10:
+                    scopes = publicScopes.concat(privateScopes);
+                    if (scopes.length === 0)
+                        return [2 /*return*/, scopes];
+                    files = scopes.map(function (scope) { return scope.index; });
+                    _b.label = 11;
+                case 11:
+                    _b.trys.push([11, 13, , 14]);
+                    return [4 /*yield*/, store.fetcher.load(files)];
+                case 12:
+                    _b.sent();
+                    return [3 /*break*/, 14];
+                case 13:
+                    err_7 = _b.sent();
+                    console.warn('Problems loading type index: ', err_7);
+                    return [3 /*break*/, 14];
+                case 14: return [2 /*return*/, scopes];
             }
         });
     });
@@ -66327,44 +67625,30 @@ function loadTypeIndexesFor(store, user) {
 exports.loadTypeIndexesFor = loadTypeIndexesFor;
 function loadCommunityTypeIndexes(store, user) {
     return __awaiter(this, void 0, void 0, function () {
-        var preferencesFile, communities, communityTypeIndexesPromise, result1;
-        var _this = this;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
+        var preferencesFile, communities, result, _i, communities_1, org, _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
                 case 0: return [4 /*yield*/, loadPreferences(store, user)];
                 case 1:
-                    preferencesFile = _a.sent();
-                    if (preferencesFile) {
-                        communities = store.each(user, ns.solid('community'), undefined, preferencesFile);
-                        communityTypeIndexesPromise = communities.map(function (community) { return __awaiter(_this, void 0, void 0, function () { return __generator(this, function (_a) {
-                            switch (_a.label) {
-                                case 0: return [4 /*yield*/, loadTypeIndexesFor(store, community)];
-                                case 1: return [2 /*return*/, _a.sent()];
-                            }
-                        }); }); });
-                        result1 = Promise.all(communityTypeIndexesPromise);
-                        // const result2 = Promise.all(result1)
-                        // const flat = result2.flat()
-                        return [2 /*return*/, result1
-                            // const communityTypeIndexes = await Promise.all(communityTypeIndexesPromise)
-                            /*
-                          let result = [] as TypeIndex[]
-                          for(const community of communities) {
-                            result = result.concat(await loadTypeIndexesFor(store, community as NamedNode)) as TypeIndex[] // @@ how oto make functional with async?
-                          }
-                          */
-                            // return communityTypeIndexesPromise.resolve()
-                        ];
-                        // const communityTypeIndexes = await Promise.all(communityTypeIndexesPromise)
-                        /*
-                      let result = [] as TypeIndex[]
-                      for(const community of communities) {
-                        result = result.concat(await loadTypeIndexesFor(store, community as NamedNode)) as TypeIndex[] // @@ how oto make functional with async?
-                      }
-                      */
-                        // return communityTypeIndexesPromise.resolve()
-                    }
-                    return [2 /*return*/, []];
+                    preferencesFile = _c.sent();
+                    if (!preferencesFile) return [3 /*break*/, 6];
+                    communities = store.each(user, ns.solid('community'), undefined, preferencesFile).concat(store.each(user, ns.solid('community'), undefined, user.doc()));
+                    result = [];
+                    _i = 0, communities_1 = communities;
+                    _c.label = 2;
+                case 2:
+                    if (!(_i < communities_1.length)) return [3 /*break*/, 5];
+                    org = communities_1[_i];
+                    _b = (_a = result).concat;
+                    return [4 /*yield*/, loadTypeIndexesFor(store, org)];
+                case 3:
+                    result = _b.apply(_a, [_c.sent()]);
+                    _c.label = 4;
+                case 4:
+                    _i++;
+                    return [3 /*break*/, 2];
+                case 5: return [2 /*return*/, result];
+                case 6: return [2 /*return*/, []]; // No communities
             }
         });
     });
@@ -66385,11 +67669,159 @@ function loadAllTypeIndexes(store, user) {
     });
 }
 exports.loadAllTypeIndexes = loadAllTypeIndexes;
+// Utility: remove duplicates from Array of NamedNodes
+function uniqueNodes(arr) {
+    var uris = arr.map(function (x) { return x.uri; });
+    var set = new Set(uris);
+    var uris2 = Array.from(set);
+    var arr2 = uris2.map(function (u) { return new rdflib_1.NamedNode(u); });
+    return arr2; // Array.from(new Set(arr.map(x => x.uri))).map(u => sym(u))
+}
+exports.uniqueNodes = uniqueNodes;
+function getScopedAppsFromIndex(store, scope, theClass) {
+    return __awaiter(this, void 0, void 0, function () {
+        var index, registrations, relevant, directInstances, instances, instanceContainers, containers, i, cont, contents;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    index = scope.index;
+                    registrations = store.statementsMatching(null, ns.solid('instance'), null, index)
+                        .concat(store.statementsMatching(null, ns.solid('instanceContainer'), null, index))
+                        .map(function (st) { return st.subject; });
+                    relevant = theClass ? registrations.filter(function (reg) { return store.any(reg, ns.solid('forClass'), null, index).sameTerm(theClass); })
+                        : registrations;
+                    directInstances = relevant.map(function (reg) { return store.each(reg, ns.solid('instance'), null, index); }).flat();
+                    instances = uniqueNodes(directInstances);
+                    instanceContainers = relevant.map(function (reg) { return store.each(reg, ns.solid('instanceContainer'), null, index); }).flat();
+                    containers = uniqueNodes(instanceContainers);
+                    if (containers.length > 0) {
+                        console.log('@@ getScopedAppsFromIndex containers ', containers);
+                    }
+                    i = 0;
+                    _a.label = 1;
+                case 1:
+                    if (!(i < containers.length)) return [3 /*break*/, 4];
+                    cont = containers[i];
+                    return [4 /*yield*/, store.fetcher.load(cont)];
+                case 2:
+                    _a.sent();
+                    contents = store.each(cont, ns.ldp('contains'), null, cont);
+                    instances = instances.concat(contents);
+                    _a.label = 3;
+                case 3:
+                    i++;
+                    return [3 /*break*/, 1];
+                case 4: return [2 /*return*/, instances.map(function (instance) { return { instance: instance, scope: scope }; })];
+            }
+        });
+    });
+}
+exports.getScopedAppsFromIndex = getScopedAppsFromIndex;
+function getScopedAppInstances(store, klass, user) {
+    return __awaiter(this, void 0, void 0, function () {
+        var scopes, scopedApps, _i, scopes_1, scope, scopedApps0;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, loadAllTypeIndexes(store, user)];
+                case 1:
+                    scopes = _a.sent();
+                    scopedApps = [];
+                    _i = 0, scopes_1 = scopes;
+                    _a.label = 2;
+                case 2:
+                    if (!(_i < scopes_1.length)) return [3 /*break*/, 5];
+                    scope = scopes_1[_i];
+                    return [4 /*yield*/, getScopedAppsFromIndex(store, scope, klass)];
+                case 3:
+                    scopedApps0 = _a.sent();
+                    scopedApps = scopedApps.concat(scopedApps0);
+                    _a.label = 4;
+                case 4:
+                    _i++;
+                    return [3 /*break*/, 2];
+                case 5: return [2 /*return*/, scopedApps];
+            }
+        });
+    });
+}
+exports.getScopedAppInstances = getScopedAppInstances;
+// This is the function signature which used to be in solid-ui/logic
+// Recommended to use getScopedAppInstances instead as it provides more information.
+//
+function getAppInstances(store, klass) {
+    return __awaiter(this, void 0, void 0, function () {
+        var user, scopedAppInstances;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = currentUser();
+                    if (!user)
+                        throw new Error('getAppInstances: Must be logged in to find apps.');
+                    return [4 /*yield*/, getScopedAppInstances(store, klass, user)];
+                case 1:
+                    scopedAppInstances = _a.sent();
+                    return [2 /*return*/, scopedAppInstances.map(function (scoped) { return scoped.instance; })];
+            }
+        });
+    });
+}
+exports.getAppInstances = getAppInstances;
 /*
-export async function getAppInstances (store:LiveStore, klass: NamedNode) {
-
+ * Register a new app in a type index
+ * used in chat in bookmark.js (solid-ui)
+ * Returns the registration object if successful else null
+ */
+function registerInstanceInTypeIndex(store, instance, index, theClass) {
+    return __awaiter(this, void 0, void 0, function () {
+        var registration, ins, err_8, msg;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    registration = (0, uri_1.newThing)(index);
+                    ins = [
+                        // See https://github.com/solid/solid/blob/main/proposals/data-discovery.md
+                        (0, rdflib_1.st)(registration, ns.rdf('type'), ns.solid('TypeRegistration'), index),
+                        (0, rdflib_1.st)(registration, ns.solid('forClass'), theClass, index),
+                        (0, rdflib_1.st)(registration, ns.solid('instance'), instance, index)
+                    ];
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, store.updater.update([], ins)];
+                case 2:
+                    _a.sent();
+                    return [3 /*break*/, 4];
+                case 3:
+                    err_8 = _a.sent();
+                    msg = "Unable to register ".concat(instance, " in index ").concat(index, ": ").concat(err_8);
+                    console.warn(msg);
+                    return [2 /*return*/, null];
+                case 4: return [2 /*return*/, registration];
+            }
+        });
+    });
 }
-*/
+exports.registerInstanceInTypeIndex = registerInstanceInTypeIndex;
+function deleteTypeIndexRegistration(store, item) {
+    return __awaiter(this, void 0, void 0, function () {
+        var reg, statements;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    reg = store.the(null, ns.solid('instance'), item.instance, item.scope.index);
+                    if (!reg)
+                        throw new Error("deleteTypeIndexRegistration: No registration found for ".concat(item.instance));
+                    statements = store.statementsMatching(reg, null, null, item.scope.index);
+                    return [4 /*yield*/, store.updater.update(statements, [])];
+                case 1:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
+        });
+    });
+}
+exports.deleteTypeIndexRegistration = deleteTypeIndexRegistration;
+// ENDS
 //# sourceMappingURL=discoveryLogic.js.map
 
 /***/ }),
@@ -66403,7 +67835,7 @@ export async function getAppInstances (store:LiveStore, klass: NamedNode) {
 "use strict";
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.profile = exports.chat = exports.store = exports.authSession = exports.authn = exports.FetchError = exports.NotFoundError = exports.SameOriginForbiddenError = exports.CrossOriginForbiddenError = exports.UnauthorizedError = exports.solidLogicSingleton = exports.getSuggestedIssuers = exports.ACL_LINK = exports.appContext = exports.offlineTestID = exports.SolidLogic = exports.loadAllTypeIndexes = exports.loadCommunityTypeIndexes = exports.loadTypeIndexesFor = exports.loadPreferences = exports.loadProfile = exports.loadIndex = exports.registerInTypeIndex = exports.loadTypeIndexes = exports.ensureTypeIndexes = exports.genACLText = exports.setACLUserPublic = void 0;
+exports.profile = exports.chat = exports.store = exports.authSession = exports.authn = exports.FetchError = exports.NotFoundError = exports.SameOriginForbiddenError = exports.CrossOriginForbiddenError = exports.UnauthorizedError = exports.solidLogicSingleton = exports.getSuggestedIssuers = exports.ACL_LINK = exports.appContext = exports.offlineTestID = exports.SolidLogic = exports.uniqueNodes = exports.suggestPublicTypeIndex = exports.suggestPrivateTypeIndex = exports.suggestPreferencesFile = exports.registerInstanceInTypeIndex = exports.loadTypeIndexesFor = exports.loadProfile = exports.loadPreferences = exports.loadOrCreateIfNotExists = exports.loadCommunityTypeIndexes = exports.loadAllTypeIndexes = exports.getScopedAppsFromIndex = exports.getScopedAppInstances = exports.getAppInstances = exports.followOrCreateLink = exports.deleteTypeIndexRegistration = exports.loadIndex = exports.registerInTypeIndex = exports.loadTypeIndexes = exports.ensureTypeIndexes = exports.genACLText = exports.setACLUserPublic = void 0;
 // Make these variables directly accessible as it is what you need most of the time
 // This also makes these variable globaly accesible in mashlib
 var solidLogicSingleton_1 = __webpack_require__(/*! ./logic/solidLogicSingleton */ "./node_modules/solid-logic/lib/logic/solidLogicSingleton.js");
@@ -66425,12 +67857,25 @@ Object.defineProperty(exports, "ensureTypeIndexes", ({ enumerable: true, get: fu
 Object.defineProperty(exports, "loadTypeIndexes", ({ enumerable: true, get: function () { return typeIndexLogic_1.loadTypeIndexes; } }));
 Object.defineProperty(exports, "registerInTypeIndex", ({ enumerable: true, get: function () { return typeIndexLogic_1.registerInTypeIndex; } }));
 Object.defineProperty(exports, "loadIndex", ({ enumerable: true, get: function () { return typeIndexLogic_1.loadIndex; } }));
+// Generate by
+//  grep export src/discovery/discoveryLogic.ts | sed -e 's/export //g'  | sed -e 's/async //g'| sed -e 's/function //g' | sed -e 's/ .*/,/g' | sort
 var discoveryLogic_1 = __webpack_require__(/*! ./discovery/discoveryLogic */ "./node_modules/solid-logic/lib/discovery/discoveryLogic.js");
-Object.defineProperty(exports, "loadProfile", ({ enumerable: true, get: function () { return discoveryLogic_1.loadProfile; } }));
+Object.defineProperty(exports, "deleteTypeIndexRegistration", ({ enumerable: true, get: function () { return discoveryLogic_1.deleteTypeIndexRegistration; } }));
+Object.defineProperty(exports, "followOrCreateLink", ({ enumerable: true, get: function () { return discoveryLogic_1.followOrCreateLink; } }));
+Object.defineProperty(exports, "getAppInstances", ({ enumerable: true, get: function () { return discoveryLogic_1.getAppInstances; } }));
+Object.defineProperty(exports, "getScopedAppInstances", ({ enumerable: true, get: function () { return discoveryLogic_1.getScopedAppInstances; } }));
+Object.defineProperty(exports, "getScopedAppsFromIndex", ({ enumerable: true, get: function () { return discoveryLogic_1.getScopedAppsFromIndex; } }));
+Object.defineProperty(exports, "loadAllTypeIndexes", ({ enumerable: true, get: function () { return discoveryLogic_1.loadAllTypeIndexes; } }));
+Object.defineProperty(exports, "loadCommunityTypeIndexes", ({ enumerable: true, get: function () { return discoveryLogic_1.loadCommunityTypeIndexes; } }));
+Object.defineProperty(exports, "loadOrCreateIfNotExists", ({ enumerable: true, get: function () { return discoveryLogic_1.loadOrCreateIfNotExists; } }));
 Object.defineProperty(exports, "loadPreferences", ({ enumerable: true, get: function () { return discoveryLogic_1.loadPreferences; } }));
+Object.defineProperty(exports, "loadProfile", ({ enumerable: true, get: function () { return discoveryLogic_1.loadProfile; } }));
 Object.defineProperty(exports, "loadTypeIndexesFor", ({ enumerable: true, get: function () { return discoveryLogic_1.loadTypeIndexesFor; } }));
-Object.defineProperty(exports, "loadCommunityTypeIndexes", ({ enumerable: true, get: function () { return discoveryLogic_1.loadCommunityTypeIndexes; } }));
-Object.defineProperty(exports, "loadAllTypeIndexes", ({ enumerable: true, get: function () { return discoveryLogic_1.loadAllTypeIndexes; } }));
+Object.defineProperty(exports, "registerInstanceInTypeIndex", ({ enumerable: true, get: function () { return discoveryLogic_1.registerInstanceInTypeIndex; } }));
+Object.defineProperty(exports, "suggestPreferencesFile", ({ enumerable: true, get: function () { return discoveryLogic_1.suggestPreferencesFile; } }));
+Object.defineProperty(exports, "suggestPrivateTypeIndex", ({ enumerable: true, get: function () { return discoveryLogic_1.suggestPrivateTypeIndex; } }));
+Object.defineProperty(exports, "suggestPublicTypeIndex", ({ enumerable: true, get: function () { return discoveryLogic_1.suggestPublicTypeIndex; } }));
+Object.defineProperty(exports, "uniqueNodes", ({ enumerable: true, get: function () { return discoveryLogic_1.uniqueNodes; } }));
 var SolidLogic_1 = __webpack_require__(/*! ./logic/SolidLogic */ "./node_modules/solid-logic/lib/logic/SolidLogic.js");
 Object.defineProperty(exports, "SolidLogic", ({ enumerable: true, get: function () { return SolidLogic_1.SolidLogic; } }));
 var authUtil_1 = __webpack_require__(/*! ./authn/authUtil */ "./node_modules/solid-logic/lib/authn/authUtil.js");
@@ -76919,9 +78364,8 @@ class LocalJWKSet {
     }
     async getKey(protectedHeader, token) {
         const { alg, kid } = { ...protectedHeader, ...token.header };
-        const kty = getKtyFromAlg(alg);
         const candidates = this._jwks.keys.filter((jwk) => {
-            let candidate = kty === jwk.kty;
+            let candidate = jwk.kty === getKtyFromAlg(alg);
             if (candidate && typeof kid === 'string') {
                 candidate = kid === jwk.kid;
             }
@@ -78138,15 +79582,21 @@ function lengthAndInput(input) {
 }
 async function concatKdf(secret, bits, value) {
     const iterations = Math.ceil((bits >> 3) / 32);
-    const res = new Uint8Array(iterations * 32);
-    for (let iter = 0; iter < iterations; iter++) {
+    let res;
+    for (let iter = 1; iter <= iterations; iter++) {
         const buf = new Uint8Array(4 + secret.length + value.length);
-        buf.set(uint32be(iter + 1));
+        buf.set(uint32be(iter));
         buf.set(secret, 4);
         buf.set(value, 4 + secret.length);
-        res.set(await (0,_runtime_digest_js__WEBPACK_IMPORTED_MODULE_0__["default"])('sha256', buf), iter * 32);
+        if (!res) {
+            res = await (0,_runtime_digest_js__WEBPACK_IMPORTED_MODULE_0__["default"])('sha256', buf);
+        }
+        else {
+            res = concat(res, await (0,_runtime_digest_js__WEBPACK_IMPORTED_MODULE_0__["default"])('sha256', buf));
+        }
     }
-    return res.slice(0, bits >> 3);
+    res = res.slice(0, bits >> 3);
+    return res;
 }
 
 
@@ -79361,12 +80811,9 @@ const encode = (input) => {
     return encodeBase64(input).replace(/=/g, '').replace(/\+/g, '-').replace(/\//g, '_');
 };
 const decodeBase64 = (encoded) => {
-    const binary = atob(encoded);
-    const bytes = new Uint8Array(binary.length);
-    for (let i = 0; i < binary.length; i++) {
-        bytes[i] = binary.charCodeAt(i);
-    }
-    return bytes;
+    return new Uint8Array(atob(encoded)
+        .split('')
+        .map((c) => c.charCodeAt(0)));
 };
 const decode = (input) => {
     let encoded = input;