@entur/dropdown 6.0.11 → 6.0.13-RC.0

package/dist/dropdown.esm.js

@@ -1,1238 +1,360 @@
-import { mergeRefs, useDebounce, useRandomId, warnAboutMissingStyles } from '@entur/utils';
+import { useDebounce, useRandomId, warnAboutMissingStyles } from '@entur/utils';
 import React, { useState, useRef, useEffect, useCallback } from 'react';
-import Downshift, { useSelect, useCombobox, useMultipleSelection } from 'downshift';
+import { useCombobox, useMultipleSelection, useSelect } from 'downshift';
 import classNames from 'classnames';
-import { BaseFormControl, VariantProvider, FeedbackText, Checkbox } from '@entur/form';
-import { CheckIcon, DownArrowIcon, CloseSmallIcon, CloseIcon } from '@entur/icons';
-import { VisuallyHidden } from '@entur/a11y';
-import { LoadingDots } from '@entur/loader';
+import { useFloating, offset, flip, autoUpdate } from '@floating-ui/react-dom';
+import { Checkbox, BaseFormControl } from '@entur/form';
 import { space } from '@entur/tokens';
-import { useFloating, autoUpdate, offset, flip } from '@floating-ui/react-dom';
+import { VisuallyHidden } from '@entur/a11y';
 import { IconButton } from '@entur/button';
 import { TagChip } from '@entur/chip';
+import { CloseSmallIcon, DownArrowIcon } from '@entur/icons';
+import { LoadingDots } from '@entur/loader';
 import { Tooltip } from '@entur/tooltip';
 
+function asyncGeneratorStep(n, t, e, r, o, a, c) {
+  try {
+    var i = n[a](c),
+      u = i.value;
+  } catch (n) {
+    return void e(n);
+  }
+  i.done ? t(u) : Promise.resolve(u).then(r, o);
+}
+function _asyncToGenerator(n) {
+  return function () {
+    var t = this,
+      e = arguments;
+    return new Promise(function (r, o) {
+      var a = n.apply(t, e);
+      function _next(n) {
+        asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
+      }
+      function _throw(n) {
+        asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
+      }
+      _next(void 0);
+    });
+  };
+}
+function _extends() {
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, _extends.apply(null, arguments);
+}
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (e.includes(n)) continue;
+    t[n] = r[n];
+  }
+  return t;
+}
 function _regeneratorRuntime() {
   _regeneratorRuntime = function () {
-    return exports;
+    return e;
   };
-  var exports = {},
-    Op = Object.prototype,
-    hasOwn = Op.hasOwnProperty,
-    defineProperty = Object.defineProperty || function (obj, key, desc) {
-      obj[key] = desc.value;
+  var t,
+    e = {},
+    r = Object.prototype,
+    n = r.hasOwnProperty,
+    o = Object.defineProperty || function (t, e, r) {
+      t[e] = r.value;
     },
-    $Symbol = "function" == typeof Symbol ? Symbol : {},
-    iteratorSymbol = $Symbol.iterator || "@@iterator",
-    asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator",
-    toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag";
-  function define(obj, key, value) {
-    return Object.defineProperty(obj, key, {
-      value: value,
+    i = "function" == typeof Symbol ? Symbol : {},
+    a = i.iterator || "@@iterator",
+    c = i.asyncIterator || "@@asyncIterator",
+    u = i.toStringTag || "@@toStringTag";
+  function define(t, e, r) {
+    return Object.defineProperty(t, e, {
+      value: r,
       enumerable: !0,
       configurable: !0,
       writable: !0
-    }), obj[key];
+    }), t[e];
   }
   try {
     define({}, "");
-  } catch (err) {
-    define = function (obj, key, value) {
-      return obj[key] = value;
+  } catch (t) {
+    define = function (t, e, r) {
+      return t[e] = r;
     };
   }
-  function wrap(innerFn, outerFn, self, tryLocsList) {
-    var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator,
-      generator = Object.create(protoGenerator.prototype),
-      context = new Context(tryLocsList || []);
-    return defineProperty(generator, "_invoke", {
-      value: makeInvokeMethod(innerFn, self, context)
-    }), generator;
+  function wrap(t, e, r, n) {
+    var i = e && e.prototype instanceof Generator ? e : Generator,
+      a = Object.create(i.prototype),
+      c = new Context(n || []);
+    return o(a, "_invoke", {
+      value: makeInvokeMethod(t, r, c)
+    }), a;
   }
-  function tryCatch(fn, obj, arg) {
+  function tryCatch(t, e, r) {
     try {
       return {
         type: "normal",
-        arg: fn.call(obj, arg)
+        arg: t.call(e, r)
       };
-    } catch (err) {
+    } catch (t) {
       return {
         type: "throw",
-        arg: err
+        arg: t
       };
     }
   }
-  exports.wrap = wrap;
-  var ContinueSentinel = {};
+  e.wrap = wrap;
+  var h = "suspendedStart",
+    l = "suspendedYield",
+    f = "executing",
+    s = "completed",
+    y = {};
   function Generator() {}
   function GeneratorFunction() {}
   function GeneratorFunctionPrototype() {}
-  var IteratorPrototype = {};
-  define(IteratorPrototype, iteratorSymbol, function () {
+  var p = {};
+  define(p, a, function () {
     return this;
   });
-  var getProto = Object.getPrototypeOf,
-    NativeIteratorPrototype = getProto && getProto(getProto(values([])));
-  NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype);
-  var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype);
-  function defineIteratorMethods(prototype) {
-    ["next", "throw", "return"].forEach(function (method) {
-      define(prototype, method, function (arg) {
-        return this._invoke(method, arg);
+  var d = Object.getPrototypeOf,
+    v = d && d(d(values([])));
+  v && v !== r && n.call(v, a) && (p = v);
+  var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p);
+  function defineIteratorMethods(t) {
+    ["next", "throw", "return"].forEach(function (e) {
+      define(t, e, function (t) {
+        return this._invoke(e, t);
       });
     });
   }
-  function AsyncIterator(generator, PromiseImpl) {
-    function invoke(method, arg, resolve, reject) {
-      var record = tryCatch(generator[method], generator, arg);
-      if ("throw" !== record.type) {
-        var result = record.arg,
-          value = result.value;
-        return value && "object" == typeof value && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) {
-          invoke("next", value, resolve, reject);
-        }, function (err) {
-          invoke("throw", err, resolve, reject);
-        }) : PromiseImpl.resolve(value).then(function (unwrapped) {
-          result.value = unwrapped, resolve(result);
-        }, function (error) {
-          return invoke("throw", error, resolve, reject);
+  function AsyncIterator(t, e) {
+    function invoke(r, o, i, a) {
+      var c = tryCatch(t[r], t, o);
+      if ("throw" !== c.type) {
+        var u = c.arg,
+          h = u.value;
+        return h && "object" == typeof h && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) {
+          invoke("next", t, i, a);
+        }, function (t) {
+          invoke("throw", t, i, a);
+        }) : e.resolve(h).then(function (t) {
+          u.value = t, i(u);
+        }, function (t) {
+          return invoke("throw", t, i, a);
         });
       }
-      reject(record.arg);
+      a(c.arg);
     }
-    var previousPromise;
-    defineProperty(this, "_invoke", {
-      value: function (method, arg) {
+    var r;
+    o(this, "_invoke", {
+      value: function (t, n) {
         function callInvokeWithMethodAndArg() {
-          return new PromiseImpl(function (resolve, reject) {
-            invoke(method, arg, resolve, reject);
+          return new e(function (e, r) {
+            invoke(t, n, e, r);
           });
         }
-        return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
+        return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
       }
     });
   }
-  function makeInvokeMethod(innerFn, self, context) {
-    var state = "suspendedStart";
-    return function (method, arg) {
-      if ("executing" === state) throw new Error("Generator is already running");
-      if ("completed" === state) {
-        if ("throw" === method) throw arg;
-        return doneResult();
+  function makeInvokeMethod(e, r, n) {
+    var o = h;
+    return function (i, a) {
+      if (o === f) throw Error("Generator is already running");
+      if (o === s) {
+        if ("throw" === i) throw a;
+        return {
+          value: t,
+          done: !0
+        };
       }
-      for (context.method = method, context.arg = arg;;) {
-        var delegate = context.delegate;
-        if (delegate) {
-          var delegateResult = maybeInvokeDelegate(delegate, context);
-          if (delegateResult) {
-            if (delegateResult === ContinueSentinel) continue;
-            return delegateResult;
+      for (n.method = i, n.arg = a;;) {
+        var c = n.delegate;
+        if (c) {
+          var u = maybeInvokeDelegate(c, n);
+          if (u) {
+            if (u === y) continue;
+            return u;
           }
         }
-        if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) {
-          if ("suspendedStart" === state) throw state = "completed", context.arg;
-          context.dispatchException(context.arg);
-        } else "return" === context.method && context.abrupt("return", context.arg);
-        state = "executing";
-        var record = tryCatch(innerFn, self, context);
-        if ("normal" === record.type) {
-          if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue;
+        if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) {
+          if (o === h) throw o = s, n.arg;
+          n.dispatchException(n.arg);
+        } else "return" === n.method && n.abrupt("return", n.arg);
+        o = f;
+        var p = tryCatch(e, r, n);
+        if ("normal" === p.type) {
+          if (o = n.done ? s : l, p.arg === y) continue;
           return {
-            value: record.arg,
-            done: context.done
+            value: p.arg,
+            done: n.done
           };
         }
-        "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg);
+        "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg);
       }
     };
   }
-  function maybeInvokeDelegate(delegate, context) {
-    var methodName = context.method,
-      method = delegate.iterator[methodName];
-    if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel;
-    var record = tryCatch(method, delegate.iterator, context.arg);
-    if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel;
-    var info = record.arg;
-    return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel);
+  function maybeInvokeDelegate(e, r) {
+    var n = r.method,
+      o = e.iterator[n];
+    if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y;
+    var i = tryCatch(o, e.iterator, r.arg);
+    if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y;
+    var a = i.arg;
+    return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y);
   }
-  function pushTryEntry(locs) {
-    var entry = {
-      tryLoc: locs[0]
+  function pushTryEntry(t) {
+    var e = {
+      tryLoc: t[0]
     };
-    1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry);
+    1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e);
   }
-  function resetTryEntry(entry) {
-    var record = entry.completion || {};
-    record.type = "normal", delete record.arg, entry.completion = record;
+  function resetTryEntry(t) {
+    var e = t.completion || {};
+    e.type = "normal", delete e.arg, t.completion = e;
   }
-  function Context(tryLocsList) {
+  function Context(t) {
     this.tryEntries = [{
       tryLoc: "root"
-    }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0);
+    }], t.forEach(pushTryEntry, this), this.reset(!0);
   }
-  function values(iterable) {
-    if (iterable) {
-      var iteratorMethod = iterable[iteratorSymbol];
-      if (iteratorMethod) return iteratorMethod.call(iterable);
-      if ("function" == typeof iterable.next) return iterable;
-      if (!isNaN(iterable.length)) {
-        var i = -1,
-          next = function next() {
-            for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next;
-            return next.value = undefined, next.done = !0, next;
+  function values(e) {
+    if (e || "" === e) {
+      var r = e[a];
+      if (r) return r.call(e);
+      if ("function" == typeof e.next) return e;
+      if (!isNaN(e.length)) {
+        var o = -1,
+          i = function next() {
+            for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next;
+            return next.value = t, next.done = !0, next;
           };
-        return next.next = next;
+        return i.next = i;
       }
     }
-    return {
-      next: doneResult
-    };
+    throw new TypeError(typeof e + " is not iterable");
   }
-  function doneResult() {
-    return {
-      value: undefined,
-      done: !0
-    };
-  }
-  return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", {
+  return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", {
     value: GeneratorFunctionPrototype,
     configurable: !0
-  }), defineProperty(GeneratorFunctionPrototype, "constructor", {
+  }), o(GeneratorFunctionPrototype, "constructor", {
     value: GeneratorFunction,
     configurable: !0
-  }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) {
-    var ctor = "function" == typeof genFun && genFun.constructor;
-    return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name));
-  }, exports.mark = function (genFun) {
-    return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun;
-  }, exports.awrap = function (arg) {
+  }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) {
+    var e = "function" == typeof t && t.constructor;
+    return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name));
+  }, e.mark = function (t) {
+    return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t;
+  }, e.awrap = function (t) {
     return {
-      __await: arg
+      __await: t
     };
-  }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () {
+  }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () {
     return this;
-  }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) {
-    void 0 === PromiseImpl && (PromiseImpl = Promise);
-    var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl);
-    return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) {
-      return result.done ? result.value : iter.next();
+  }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) {
+    void 0 === i && (i = Promise);
+    var a = new AsyncIterator(wrap(t, r, n, o), i);
+    return e.isGeneratorFunction(r) ? a : a.next().then(function (t) {
+      return t.done ? t.value : a.next();
     });
-  }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () {
+  }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () {
     return this;
-  }), define(Gp, "toString", function () {
+  }), define(g, "toString", function () {
     return "[object Generator]";
-  }), exports.keys = function (val) {
-    var object = Object(val),
-      keys = [];
-    for (var key in object) keys.push(key);
-    return keys.reverse(), function next() {
-      for (; keys.length;) {
-        var key = keys.pop();
-        if (key in object) return next.value = key, next.done = !1, next;
+  }), e.keys = function (t) {
+    var e = Object(t),
+      r = [];
+    for (var n in e) r.push(n);
+    return r.reverse(), function next() {
+      for (; r.length;) {
+        var t = r.pop();
+        if (t in e) return next.value = t, next.done = !1, next;
       }
       return next.done = !0, next;
     };
-  }, exports.values = values, Context.prototype = {
+  }, e.values = values, Context.prototype = {
     constructor: Context,
-    reset: function (skipTempReset) {
-      if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined);
+    reset: function (e) {
+      if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t);
     },
     stop: function () {
       this.done = !0;
-      var rootRecord = this.tryEntries[0].completion;
-      if ("throw" === rootRecord.type) throw rootRecord.arg;
+      var t = this.tryEntries[0].completion;
+      if ("throw" === t.type) throw t.arg;
       return this.rval;
     },
-    dispatchException: function (exception) {
-      if (this.done) throw exception;
-      var context = this;
-      function handle(loc, caught) {
-        return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught;
+    dispatchException: function (e) {
+      if (this.done) throw e;
+      var r = this;
+      function handle(n, o) {
+        return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o;
       }
-      for (var i = this.tryEntries.length - 1; i >= 0; --i) {
-        var entry = this.tryEntries[i],
-          record = entry.completion;
-        if ("root" === entry.tryLoc) return handle("end");
-        if (entry.tryLoc <= this.prev) {
-          var hasCatch = hasOwn.call(entry, "catchLoc"),
-            hasFinally = hasOwn.call(entry, "finallyLoc");
-          if (hasCatch && hasFinally) {
-            if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
-            if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
-          } else if (hasCatch) {
-            if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
+      for (var o = this.tryEntries.length - 1; o >= 0; --o) {
+        var i = this.tryEntries[o],
+          a = i.completion;
+        if ("root" === i.tryLoc) return handle("end");
+        if (i.tryLoc <= this.prev) {
+          var c = n.call(i, "catchLoc"),
+            u = n.call(i, "finallyLoc");
+          if (c && u) {
+            if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
+            if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
+          } else if (c) {
+            if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
           } else {
-            if (!hasFinally) throw new Error("try statement without catch or finally");
-            if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
+            if (!u) throw Error("try statement without catch or finally");
+            if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
           }
         }
       }
     },
-    abrupt: function (type, arg) {
-      for (var i = this.tryEntries.length - 1; i >= 0; --i) {
-        var entry = this.tryEntries[i];
-        if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) {
-          var finallyEntry = entry;
+    abrupt: function (t, e) {
+      for (var r = this.tryEntries.length - 1; r >= 0; --r) {
+        var o = this.tryEntries[r];
+        if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) {
+          var i = o;
           break;
         }
       }
-      finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null);
-      var record = finallyEntry ? finallyEntry.completion : {};
-      return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record);
+      i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null);
+      var a = i ? i.completion : {};
+      return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a);
     },
-    complete: function (record, afterLoc) {
-      if ("throw" === record.type) throw record.arg;
-      return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel;
+    complete: function (t, e) {
+      if ("throw" === t.type) throw t.arg;
+      return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y;
     },
-    finish: function (finallyLoc) {
-      for (var i = this.tryEntries.length - 1; i >= 0; --i) {
-        var entry = this.tryEntries[i];
-        if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel;
+    finish: function (t) {
+      for (var e = this.tryEntries.length - 1; e >= 0; --e) {
+        var r = this.tryEntries[e];
+        if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y;
       }
     },
-    catch: function (tryLoc) {
-      for (var i = this.tryEntries.length - 1; i >= 0; --i) {
-        var entry = this.tryEntries[i];
-        if (entry.tryLoc === tryLoc) {
-          var record = entry.completion;
-          if ("throw" === record.type) {
-            var thrown = record.arg;
-            resetTryEntry(entry);
+    catch: function (t) {
+      for (var e = this.tryEntries.length - 1; e >= 0; --e) {
+        var r = this.tryEntries[e];
+        if (r.tryLoc === t) {
+          var n = r.completion;
+          if ("throw" === n.type) {
+            var o = n.arg;
+            resetTryEntry(r);
           }
-          return thrown;
+          return o;
         }
       }
-      throw new Error("illegal catch attempt");
+      throw Error("illegal catch attempt");
     },
-    delegateYield: function (iterable, resultName, nextLoc) {
+    delegateYield: function (e, r, n) {
       return this.delegate = {
-        iterator: values(iterable),
-        resultName: resultName,
-        nextLoc: nextLoc
-      }, "next" === this.method && (this.arg = undefined), ContinueSentinel;
-    }
-  }, exports;
-}
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
-  try {
-    var info = gen[key](arg);
-    var value = info.value;
-  } catch (error) {
-    reject(error);
-    return;
-  }
-  if (info.done) {
-    resolve(value);
-  } else {
-    Promise.resolve(value).then(_next, _throw);
-  }
-}
-function _asyncToGenerator(fn) {
-  return function () {
-    var self = this,
-      args = arguments;
-    return new Promise(function (resolve, reject) {
-      var gen = fn.apply(self, args);
-      function _next(value) {
-        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
-      }
-      function _throw(err) {
-        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
-      }
-      _next(undefined);
-    });
-  };
-}
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-function _objectDestructuringEmpty(obj) {
-  if (obj == null) throw new TypeError("Cannot destructure " + obj);
-}
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-
-var _excluded$d = ["children", "onChange", "onInputValueChange", "highlightFirstItemOnOpen", "className", "style", "searchable"];
-var DownshiftContext = /*#__PURE__*/React.createContext(null);
-var DownshiftProvider = function DownshiftProvider(_ref) {
-  var children = _ref.children,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? function () {
-      return undefined;
-    } : _ref$onChange,
-    _ref$onInputValueChan = _ref.onInputValueChange,
-    onInputValueChange = _ref$onInputValueChan === void 0 ? function () {
-      return undefined;
-    } : _ref$onInputValueChan,
-    _ref$highlightFirstIt = _ref.highlightFirstItemOnOpen,
-    highlightFirstItemOnOpen = _ref$highlightFirstIt === void 0 ? false : _ref$highlightFirstIt,
-    className = _ref.className,
-    style = _ref.style,
-    _ref$searchable = _ref.searchable,
-    searchable = _ref$searchable === void 0 ? false : _ref$searchable,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
-  var handleStateChange = function handleStateChange(changes, stateAndHelpers) {
-    if (changes.type === Downshift.stateChangeTypes.controlledPropUpdatedSelectedItem) {
-      return;
-    }
-    if ('selectedItem' in changes) {
-      onChange(changes.selectedItem, stateAndHelpers);
-    } else if ('inputValue' in changes) {
-      onInputValueChange(changes.inputValue);
-    }
-  };
-  var stateReducer = function stateReducer(_, changes) {
-    var highlightFirstOnOpen = highlightFirstItemOnOpen && 'isOpen' in changes && changes.isOpen;
-    var highlightFirstItemIndex = highlightFirstOnOpen ? {
-      highlightedIndex: 0
-    } : {};
-    if (searchable) {
-      var type = changes.type;
-      switch (type) {
-        case '__autocomplete_change_input__':
-          return _extends({}, changes, highlightFirstItemIndex);
-        case '__autocomplete_click_item__':
-        case '__autocomplete_keydown_enter__':
-        case '__autocomplete_blur_input__':
-        case '__autocomplete_mouseup__':
-          return _extends({}, changes, {
-            // if we had an item highlighted in the previous state.
-            // we will reset input field value to blank
-            inputValue: ''
-          }, highlightFirstItemIndex);
-        default:
-          return _extends({}, changes, highlightFirstItemIndex);
-      }
-    } else {
-      return _extends({}, changes, highlightFirstItemIndex);
-    }
-  };
-  return React.createElement(Downshift, _extends({
-    itemToString: function itemToString(item) {
-      return item ? item.label : '';
-    },
-    onStateChange: handleStateChange,
-    stateReducer: stateReducer
-  }, rest), function (args) {
-    return React.createElement("div", {
-      className: classNames('eds-input-group', className),
-      style: style
-    }, React.createElement(DownshiftContext.Provider, {
-      value: args
-    }, children));
-  });
-};
-var useDownshift = function useDownshift() {
-  var context = React.useContext(DownshiftContext);
-  if (!context) {
-    throw new Error('You need to wrap your component in a DownshiftProvider');
-  }
-  return context;
-};
-
-var _excluded$c = ["items"];
-var DropdownListDeprecated = function DropdownListDeprecated(_ref) {
-  var items = _ref.items,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
-  var _useDownshift = useDownshift(),
-    highlightedIndex = _useDownshift.highlightedIndex,
-    isOpen = _useDownshift.isOpen,
-    selectedItem = _useDownshift.selectedItem,
-    getItemProps = _useDownshift.getItemProps,
-    getMenuProps = _useDownshift.getMenuProps;
-  return React.createElement("ul", _extends({
-    className: classNames('eds-dropdown-list', {
-      'eds-dropdown-list--open': isOpen
-    })
-  }, getMenuProps(), rest), isOpen ? items.map(function (item, index) {
-    return (
-      // eslint-disable-next-line react/jsx-key
-      React.createElement("li", _extends({
-        className: classNames('eds-dropdown-list__item', {
-          'eds-dropdown-list__item--highlighted': highlightedIndex === index,
-          'eds-dropdown-list__item--selected': selectedItem === item
-        })
-      }, getItemProps({
-        key: "" + index + item.value,
-        item: item,
-        index: index
-      })), React.createElement("span", null, item.label), item.icons && React.createElement("span", null, item.icons.map(function (Icon, index) {
-        return React.createElement(Icon, {
-          key: index,
-          inline: true,
-          className: "eds-dropdown-list__item-icon"
-        });
-      })), selectedItem === item && React.createElement(CheckIcon, null))
-    );
-  }) : null);
-};
-
-var DropdownDeprecatedToggleButton = function DropdownDeprecatedToggleButton() {
-  var _useDownshift = useDownshift(),
-    getToggleButtonProps = _useDownshift.getToggleButtonProps,
-    isOpen = _useDownshift.isOpen;
-  return React.createElement("button", _extends({}, getToggleButtonProps({
-    className: classNames('eds-dropdown__toggle-button', {
-      'eds-dropdown__toggle-button--open': isOpen
-    })
-  }), {
-    tabIndex: -1,
-    type: "button"
-  }), React.createElement(DownArrowIcon, null));
-};
-
-var _excluded$b = ["className", "children"];
-var DropdownDeprecatedLoadingDots = function DropdownDeprecatedLoadingDots(_ref) {
-  var className = _ref.className,
-    children = _ref.children,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
-  return React.createElement("div", _extends({
-    className: classNames('eds-inline-spinner', className)
-  }, rest), React.createElement(LoadingDots, null), React.createElement(VisuallyHidden, null, children));
-};
-
-var _excluded$a = ["children", "className", "items", "loading", "loadingText", "placeholder", "style", "listStyle", "clearable", "label", "isFilled", "disableLabelAnimation"];
-var BaseDropdownDeprecated = function BaseDropdownDeprecated(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    items = _ref.items,
-    _ref$loading = _ref.loading,
-    loading = _ref$loading === void 0 ? false : _ref$loading,
-    _ref$loadingText = _ref.loadingText,
-    loadingText = _ref$loadingText === void 0 ? 'Loading...' : _ref$loadingText,
-    style = _ref.style,
-    listStyle = _ref.listStyle,
-    clearable = _ref.clearable,
-    label = _ref.label,
-    _ref$isFilled = _ref.isFilled,
-    isFilled = _ref$isFilled === void 0 ? false : _ref$isFilled,
-    disableLabelAnimation = _ref.disableLabelAnimation,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
-  var _useDownshift = useDownshift(),
-    getLabelProps = _useDownshift.getLabelProps;
-  return React.createElement("div", {
-    className: "eds-dropdown-wrapper",
-    style: style
-  }, React.createElement(BaseFormControl, _extends({
-    append: React.createElement(Appendix$1, {
-      clearable: clearable,
-      loading: loading,
-      loadingText: loadingText,
-      readOnly: rest.readOnly
-    }),
-    className: className,
-    label: label,
-    isFilled: isFilled,
-    labelProps: getLabelProps(),
-    disableLabelAnimation: disableLabelAnimation
-  }, rest), children), React.createElement(DropdownListDeprecated, _extends({
-    items: items,
-    style: _extends({
-      position: 'absolute',
-      top: space.extraLarge3 + space.extraSmall + "px"
-    }, listStyle)
-  }, rest)));
-};
-var ClearButton$1 = function ClearButton(_ref2) {
-  var props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
-  var _useDownshift2 = useDownshift(),
-    clearSelection = _useDownshift2.clearSelection,
-    selectedItem = _useDownshift2.selectedItem;
-  return React.createElement(React.Fragment, null, selectedItem && React.createElement("button", _extends({
-    className: "eds-dropdown__clear-button",
-    type: "button",
-    tabIndex: -1,
-    onClick: function onClick() {
-      return clearSelection();
-    },
-    "aria-label": "Trykk for \xE5 fjerne valg"
-  }, props), React.createElement(CloseSmallIcon, null)), selectedItem && React.createElement("div", {
-    className: "eds-dropdown__divider"
-  }));
-};
-var Appendix$1 = function Appendix(_ref3) {
-  var clearable = _ref3.clearable,
-    loading = _ref3.loading,
-    loadingText = _ref3.loadingText,
-    readOnly = _ref3.readOnly;
-  if (loading) {
-    return React.createElement(DropdownDeprecatedLoadingDots, null, loadingText);
-  }
-  if (readOnly) {
-    return null;
-  }
-  return clearable ? React.createElement(React.Fragment, null, React.createElement(ClearButton$1, null), " ", React.createElement(DropdownDeprecatedToggleButton, null)) : React.createElement(DropdownDeprecatedToggleButton, null);
-};
-
-var _excluded$9 = ["disabled", "placeholder", "selectOnTab", "openOnFocus", "listStyle", "items", "label", "disableLabelAnimation", "loading", "loadingText", "className", "clearable"];
-var RegularDropdownDeprecated = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var disabled = _ref.disabled,
-    _ref$placeholder = _ref.placeholder,
-    placeholder = _ref$placeholder === void 0 ? 'Vennligst velg' : _ref$placeholder,
-    _ref$selectOnTab = _ref.selectOnTab,
-    selectOnTab = _ref$selectOnTab === void 0 ? false : _ref$selectOnTab,
-    _ref$openOnFocus = _ref.openOnFocus,
-    openOnFocus = _ref$openOnFocus === void 0 ? false : _ref$openOnFocus,
-    listStyle = _ref.listStyle,
-    items = _ref.items,
-    label = _ref.label,
-    disableLabelAnimation = _ref.disableLabelAnimation,
-    loading = _ref.loading,
-    loadingText = _ref.loadingText,
-    className = _ref.className,
-    clearable = _ref.clearable,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
-  var _useDownshift = useDownshift(),
-    getToggleButtonProps = _useDownshift.getToggleButtonProps,
-    selectedItem = _useDownshift.selectedItem,
-    selectHighlightedItem = _useDownshift.selectHighlightedItem,
-    openMenu = _useDownshift.openMenu,
-    isOpen = _useDownshift.isOpen,
-    highlightedIndex = _useDownshift.highlightedIndex,
-    setHighlightedIndex = _useDownshift.setHighlightedIndex;
-  return React.createElement(BaseDropdownDeprecated, _extends({
-    disabled: disabled,
-    listStyle: listStyle,
-    items: items,
-    label: label,
-    isFilled: selectedItem ? true : placeholder.length !== 0,
-    disableLabelAnimation: disableLabelAnimation,
-    loading: loading,
-    loadingText: loadingText,
-    className: className,
-    clearable: clearable
-  }, rest), React.createElement("button", _extends({}, getToggleButtonProps(_extends({
-    className: 'eds-form-control eds-dropdown__selected-item',
-    style: {
-      textAlign: 'left'
-    },
-    disabled: disabled,
-    type: 'button',
-    onKeyDown: function onKeyDown(e) {
-      if (selectOnTab && e.key === 'Tab') {
-        selectHighlightedItem();
-      }
-      if (isOpen) {
-        var keyDownValue = e.key;
-        var matchedItems = items.map(function (item, index) {
-          return _extends({}, item, {
-            index: index
-          });
-        }).filter(function (item) {
-          var firstCharacter = item.label.trim().charAt(0).toLowerCase();
-          return firstCharacter === keyDownValue;
-        });
-        var nextHighlightItem = matchedItems.find(function (item) {
-          return item.index > (highlightedIndex != null ? highlightedIndex : 0);
-        });
-        if (nextHighlightItem) {
-          setHighlightedIndex(nextHighlightItem.index);
-        } else if (matchedItems.length > 0) {
-          setHighlightedIndex(matchedItems[0].index);
-        }
-      }
-    },
-    onFocus: function onFocus() {
-      if (openOnFocus) {
-        !isOpen && openMenu();
-      }
-    }
-  }, rest)), {
-    ref: ref
-  }), selectedItem ? selectedItem.label : placeholder));
-});
-
-var _excluded$8 = ["disabled", "className", "items", "loading", "loadingText", "readOnly", "prepend", "selectOnTab", "openOnFocus", "listStyle", "clearable", "itemFilter", "label", "disableLabelAnimation", "placeholder"];
-function LowerCaseFilterTest(item, input) {
-  if (!input) {
-    return true;
-  }
-  var sanitizeEscapeCharacters = input.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
-  var inputRegex = new RegExp(sanitizeEscapeCharacters, 'i');
-  return inputRegex.test(item.label);
-}
-/**
- * @deprecated
- * New SearchableDropdown available
- *
- * migration guide to new dropdown:
- * - change import from 'DropdownDeprecated' to 'Dropdown'
- * - change from 'value' to 'selectedItem'
- *  + type of 'selectedItem' is 'NormalizedDropdownType' and does not include 'string'
- * - 'onChange' must update value of 'selectedItem'
- */
-var SearchableDropdownDeprecated = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    className = _ref.className,
-    items = _ref.items,
-    loading = _ref.loading,
-    loadingText = _ref.loadingText,
-    _ref$readOnly = _ref.readOnly,
-    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    prepend = _ref.prepend,
-    _ref$selectOnTab = _ref.selectOnTab,
-    selectOnTab = _ref$selectOnTab === void 0 ? false : _ref$selectOnTab,
-    _ref$openOnFocus = _ref.openOnFocus,
-    openOnFocus = _ref$openOnFocus === void 0 ? false : _ref$openOnFocus,
-    listStyle = _ref.listStyle,
-    clearable = _ref.clearable,
-    _ref$itemFilter = _ref.itemFilter,
-    itemFilter = _ref$itemFilter === void 0 ? function (item, inputValue) {
-      return LowerCaseFilterTest(item, inputValue);
-    } : _ref$itemFilter,
-    label = _ref.label,
-    disableLabelAnimation = _ref.disableLabelAnimation,
-    placeholder = _ref.placeholder,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
-  var _useDownshift = useDownshift(),
-    getInputProps = _useDownshift.getInputProps,
-    inputValue = _useDownshift.inputValue,
-    selectHighlightedItem = _useDownshift.selectHighlightedItem,
-    isOpen = _useDownshift.isOpen,
-    openMenu = _useDownshift.openMenu,
-    closeMenu = _useDownshift.closeMenu,
-    selectedItem = _useDownshift.selectedItem;
-  var _useState = useState(false),
-    hideSelectedItem = _useState[0],
-    setHideSelectedItem = _useState[1];
-  var inputRef = useRef(null);
-  var filteredItems = React.useMemo(function () {
-    return items.filter(function (item) {
-      return itemFilter(item, inputValue);
-    });
-  }, [inputValue, items, itemFilter]);
-  return React.createElement(BaseDropdownDeprecated, {
-    items: filteredItems,
-    disabled: disabled,
-    readOnly: readOnly,
-    className: className,
-    loading: loading,
-    loadingText: loadingText,
-    prepend: prepend,
-    listStyle: listStyle,
-    clearable: clearable,
-    label: label,
-    isFilled: selectedItem ? true : false,
-    disableLabelAnimation: disableLabelAnimation
-  }, !hideSelectedItem && selectedItem && !inputValue && React.createElement("span", {
-    className: "eds-dropdown__searchable-selected-item__wrapper"
-  }, React.createElement("span", {
-    className: "eds-dropdown__searchable-selected-item",
-    onClick: function onClick() {
-      var _inputRef$current;
-      return (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
-    }
-  }, selectedItem.label)), React.createElement("input", _extends({}, getInputProps(_extends({
-    disabled: disabled,
-    readOnly: readOnly,
-    className: 'eds-form-control eds-dropdown__input',
-    onKeyDown: function onKeyDown(e) {
-      if (selectOnTab && e.key === 'Tab') selectHighlightedItem();
-    },
-    onFocus: function onFocus() {
-      if (!isOpen && openOnFocus) openMenu();
-      setHideSelectedItem(true);
-    },
-    placeholder: selectedItem ? selectedItem.label : placeholder
-  }, rest)), {
-    onBlur: function onBlur() {
-      setHideSelectedItem(false);
-      closeMenu();
-    },
-    ref: mergeRefs(ref, inputRef)
-  })));
-});
-
-var DropdownInputGroupDeprecated = function DropdownInputGroupDeprecated(_ref) {
-  var children = _ref.children,
-    feedback = _ref.feedback,
-    variant = _ref.variant,
-    className = _ref.className,
-    style = _ref.style;
-  return React.createElement(VariantProvider, {
-    variant: variant
-  }, React.createElement("div", {
-    className: className,
-    style: style
-  }, children, feedback && variant && React.createElement(FeedbackText, {
-    variant: variant
-  }, feedback)));
-};
-
-var useNormalizedItems = function useNormalizedItems(items) {
-  return React.useMemo(function () {
-    return items.map(function (item) {
-      if (typeof item == 'string') {
-        return {
-          value: item,
-          label: item
-        };
-      }
-      if ((item == null ? void 0 : item.value) === undefined) {
-        return _extends({}, item, {
-          value: item.label
-        });
-      }
-      return _extends({}, item, {
-        value: item.value
-      });
-    });
-  }, [items]);
-};
-
-var useResolvedItems = function useResolvedItems( /** The list of items, or an async function that resolves the list of items */
-itemsOrItemsResolver, /** The time to wait after the input changes to the fetchItems method is called */
-debounceTimeout) {
-  if (debounceTimeout === void 0) {
-    debounceTimeout = 250;
-  }
-  var itemsIsAFunction = typeof itemsOrItemsResolver === 'function';
-  var _React$useState = React.useState(itemsIsAFunction ? [] : itemsOrItemsResolver),
-    items = _React$useState[0],
-    setItems = _React$useState[1];
-  var _React$useState2 = React.useState(false),
-    loading = _React$useState2[0],
-    setLoading = _React$useState2[1];
-  var abortControllerRef = React.useRef(new AbortController());
-  // We normalize the itemsResolver argument to an async function, so we
-  // can use it without thinking about the differences later
-  var itemsResolver = React.useMemo(function () {
-    if (itemsIsAFunction) return itemsOrItemsResolver;
-    return function () {
-      return Promise.resolve(itemsOrItemsResolver);
-    };
-  }, [itemsOrItemsResolver, itemsIsAFunction]);
-  // This should be called whenever the input value changes
-  var updateItems = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(inputValue) {
-      var _abortControllerRef$c;
-      var abortController, _abortControllerRef$c2, _abortControllerRef$c3, resolvedItems;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              // The abortController handles cleanup of the previous request and unmounting
-              if (abortControllerRef != null && abortControllerRef.current) abortControllerRef == null ? void 0 : (_abortControllerRef$c = abortControllerRef.current) == null ? void 0 : _abortControllerRef$c.abort();
-              abortController = new AbortController();
-              abortControllerRef.current = abortController;
-              setLoading(true);
-              _context.prev = 4;
-              _context.next = 7;
-              return itemsResolver(inputValue != null ? inputValue : '', abortControllerRef);
-            case 7:
-              resolvedItems = _context.sent;
-              if (!(abortControllerRef != null && (_abortControllerRef$c2 = abortControllerRef.current) != null && (_abortControllerRef$c3 = _abortControllerRef$c2.signal) != null && _abortControllerRef$c3.aborted)) {
-                _context.next = 11;
-                break;
-              }
-              console.warn('Avbryt den asynkrone funksjonen din med signalet fra AbortController-en for å for å unngå minnelekkasje.', 'Funksjonen bør kaste en DOMException med navnet "AbortError" når den avbrytes.', '', '\n\nSe eksempel her: https://design.entur.no/komponenter/skjemaelementer/dropdown#s%C3%B8kbar-dropdown-med-valg-fra-nettverkskall-bassert-p%C3%A5-tekstinput', '\nLes mer om AbortController her: https://developer.mozilla.org/en-US/docs/Web/API/AbortController');
-              return _context.abrupt("return");
-            case 11:
-              setLoading(false);
-              setItems(resolvedItems);
-              _context.next = 21;
-              break;
-            case 15:
-              _context.prev = 15;
-              _context.t0 = _context["catch"](4);
-              if (!(_context.t0 && typeof _context.t0 === 'object' && 'name' in _context.t0 && _context.t0.name === 'AbortError')) {
-                _context.next = 19;
-                break;
-              }
-              return _context.abrupt("return");
-            case 19:
-              console.warn('The following error was received but not handled inside Entur Designsystems useResolvedItems hook:');
-              throw _context.t0;
-            case 21:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee, null, [[4, 15]]);
-    }));
-    return function updateItems(_x) {
-      return _ref.apply(this, arguments);
-    };
-  }();
-  var debouncedFetchItems = useDebounce(updateItems, debounceTimeout);
-  var normalizedItems = useNormalizedItems(items);
-  React.useEffect(function () {
-    // send abort signal to previous request on unmount for cleanup
-    return function () {
-      var _abortControllerRef$c4;
-      return abortControllerRef == null ? void 0 : (_abortControllerRef$c4 = abortControllerRef.current) == null ? void 0 : _abortControllerRef$c4.abort('Component unmounted');
-    };
-  }, []);
-  React.useEffect(function () {
-    // Let's fetch the list initially if it's specified
-    if (itemsIsAFunction) {
-      debouncedFetchItems('');
+        iterator: values(e),
+        resultName: r,
+        nextLoc: n
+      }, "next" === this.method && (this.arg = t), y;
     }
-  }, [itemsIsAFunction, itemsResolver]);
-  return {
-    items: normalizedItems,
-    loading: itemsIsAFunction ? loading : false,
-    fetchItems: debouncedFetchItems
-  };
-};
-
-var _excluded$7 = ["highlightFirstItemOnOpen", "debounceTimeout", "disabled", "feedback", "items", "label", "loadingText", "onChange", "placeholder", "prepend", "readOnly", "searchable", "selectOnTab", "openOnFocus", "variant", "value", "clearable", "className", "style", "listStyle", "itemFilter", "disableLabelAnimation"];
-/**
- * @deprecated
- * New Dropdown available
- *
- * migration guide to new dropdown:
- * - change import from 'DropdownDeprecated' to 'Dropdown'
- *  + if 'searchable', switch to 'SearchableDropdown'
- * - change from 'value' to 'selectedItem'
- *  + type of 'selectedItem' is 'NormalizedDropdownType' and does not include 'string'
- * - 'onChange' must update value of 'selectedItem'
- */
-var DropdownDeprecated = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var highlightFirstItemOnOpen = _ref.highlightFirstItemOnOpen,
-    debounceTimeout = _ref.debounceTimeout,
-    disabled = _ref.disabled,
-    feedback = _ref.feedback,
-    items = _ref.items,
-    label = _ref.label,
-    loadingText = _ref.loadingText,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? function () {
-      return undefined;
-    } : _ref$onChange,
-    placeholder = _ref.placeholder,
-    prepend = _ref.prepend,
-    readOnly = _ref.readOnly,
-    searchable = _ref.searchable,
-    selectOnTab = _ref.selectOnTab,
-    openOnFocus = _ref.openOnFocus,
-    variant = _ref.variant,
-    value = _ref.value,
-    _ref$clearable = _ref.clearable,
-    clearable = _ref$clearable === void 0 ? false : _ref$clearable,
-    className = _ref.className,
-    style = _ref.style,
-    listStyle = _ref.listStyle,
-    itemFilter = _ref.itemFilter,
-    disableLabelAnimation = _ref.disableLabelAnimation,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
-  var _useResolvedItems = useResolvedItems(items, debounceTimeout),
-    normalizedItems = _useResolvedItems.items,
-    loading = _useResolvedItems.loading,
-    fetchItems = _useResolvedItems.fetchItems;
-  var selectedItem = value === undefined ? undefined : normalizedItems.find(function (item) {
-    return value === item.value;
-  }) || null;
-  var RenderedDropdown = searchable ? SearchableDropdownDeprecated : RegularDropdownDeprecated;
-  var searchAbleProps = searchable ? {
-    itemFilter: itemFilter,
-    name: rest.name,
-    'data-cy': rest['data-cy']
-  } : {
-    name: rest.name,
-    'data-cy': rest['data-cy']
-  };
-  return React.createElement(DownshiftProvider, _extends({
-    selectedItem: selectedItem,
-    onInputValueChange: fetchItems,
-    onChange: onChange,
-    value: value,
-    highlightFirstItemOnOpen: highlightFirstItemOnOpen,
-    className: className,
-    style: style,
-    searchable: searchable
-  }, rest), React.createElement(DropdownInputGroupDeprecated, {
-    feedback: feedback,
-    variant: variant
-  }, React.createElement(RenderedDropdown, _extends({
-    label: label,
-    items: normalizedItems,
-    loading: loading,
-    loadingText: loadingText,
-    disabled: disabled,
-    readOnly: readOnly,
-    placeholder: placeholder,
-    prepend: prepend,
-    selectOnTab: selectOnTab,
-    openOnFocus: openOnFocus,
-    listStyle: listStyle,
-    clearable: clearable,
-    disableLabelAnimation: disableLabelAnimation,
-    ref: ref
-  }, searchAbleProps))));
-});
-
-var _excluded$6 = ["className", "clearable", "debounceTimeout", "disabled", "feedback", "initialSelectedItems", "items", "itemsSelectedLabel", "label", "listStyle", "loading", "loadingText", "onChange", "openOnFocus", "readOnly", "style", "variant"];
-var MultiSelectOldContext = /*#__PURE__*/React.createContext(null);
-var useMultiSelectOldContext = function useMultiSelectOldContext() {
-  var context = React.useContext(MultiSelectOldContext);
-  if (!context) {
-    throw new Error('You need to wrap your component in a DownshiftProvider');
-  }
-  return context;
-};
-function stateReducer(state,
-//StateChangeOptions<NormalizedDropdownItemDeprecatedType>,
-actionAndChanges) {
-  var changes = actionAndChanges.changes,
-    type = actionAndChanges.type;
-  switch (type) {
-    case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-    case useSelect.stateChangeTypes.ToggleButtonKeyDownSpaceButton:
-    case useSelect.stateChangeTypes.ItemClick:
-      return _extends({}, changes, {
-        isOpen: true,
-        highlightedIndex: state.highlightedIndex
-      });
-    default:
-      return changes;
-  }
-}
-/**
- * @deprecated
- * New MultiSelect available
- *
- * migration guide to new dropdown:
- * - change import from 'MultiSelectDeprecated' to 'MultiSelect'
- * - add state containing selected items to 'selectedItems' prop
- *  + type of 'selectedItems' is 'NormalizedDropdownType[]' and does not include 'string'
- * - 'onChange' must update value of 'selectedItem'
- */
-var MultiSelectDeprecated = function MultiSelectDeprecated(_ref) {
-  var className = _ref.className,
-    _ref$clearable = _ref.clearable,
-    clearable = _ref$clearable === void 0 ? false : _ref$clearable,
-    debounceTimeout = _ref.debounceTimeout,
-    disabled = _ref.disabled,
-    feedback = _ref.feedback,
-    _ref$initialSelectedI = _ref.initialSelectedItems,
-    initialSelectedItems = _ref$initialSelectedI === void 0 ? [] : _ref$initialSelectedI,
-    input = _ref.items,
-    _ref$itemsSelectedLab = _ref.itemsSelectedLabel,
-    itemsSelectedLabel = _ref$itemsSelectedLab === void 0 ? function (items) {
-      return SelectedItemsLabel(items);
-    } : _ref$itemsSelectedLab,
-    label = _ref.label,
-    listStyle = _ref.listStyle,
-    _ref$loading = _ref.loading,
-    loading = _ref$loading === void 0 ? false : _ref$loading,
-    _ref$loadingText = _ref.loadingText,
-    loadingText = _ref$loadingText === void 0 ? '' : _ref$loadingText,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? function () {
-      return undefined;
-    } : _ref$onChange,
-    _ref$openOnFocus = _ref.openOnFocus,
-    openOnFocus = _ref$openOnFocus === void 0 ? false : _ref$openOnFocus,
-    _ref$readOnly = _ref.readOnly,
-    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    style = _ref.style,
-    variant = _ref.variant,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
-  var _useResolvedItems = useResolvedItems(input, debounceTimeout),
-    items = _useResolvedItems.items;
-  var _useState = useState(initialSelectedItems),
-    selectedItems = _useState[0],
-    setSelectedItems = _useState[1];
-  var reset = React.useCallback(function () {
-    setSelectedItems([]);
-  }, []);
-  function isSelected(selectedCheckboxItem) {
-    return selectedItems.some(function (selected) {
-      return selected.value === selectedCheckboxItem.value;
-    });
-  }
-  var _useSelect = useSelect(_extends({
-      items: items,
-      stateReducer: stateReducer,
-      selectedItem: null,
-      onSelectedItemChange: function onSelectedItemChange(_ref2) {
-        var selectedItem = _ref2.selectedItem;
-        if (!selectedItem) {
-          return;
-        }
-        var itemIsFound = isSelected(selectedItem);
-        if (itemIsFound) {
-          var slicedItemList = selectedItems.filter(function (item) {
-            return item.value !== selectedItem.value;
-          });
-          setSelectedItems(slicedItemList);
-          onChange(slicedItemList);
-        } else {
-          var _slicedItemList = [].concat(selectedItems, [selectedItem]);
-          setSelectedItems(_slicedItemList);
-          onChange(_slicedItemList);
-        }
-      }
-    }, rest)),
-    isOpen = _useSelect.isOpen,
-    getToggleButtonProps = _useSelect.getToggleButtonProps,
-    getLabelProps = _useSelect.getLabelProps,
-    getMenuProps = _useSelect.getMenuProps,
-    highlightedIndex = _useSelect.highlightedIndex,
-    getItemProps = _useSelect.getItemProps,
-    openMenu = _useSelect.openMenu;
-  var buttonText = selectedItems.length ? itemsSelectedLabel(selectedItems) : '';
-  var multiSelectId = useRandomId('eds-multiselect');
-  return React.createElement(MultiSelectOldContext.Provider, {
-    value: {
-      isOpen: isOpen,
-      reset: reset,
-      getToggleButtonProps: getToggleButtonProps,
-      openMenu: openMenu,
-      openOnFocus: openOnFocus
-    }
-  }, React.createElement("div", {
-    className: classNames('eds-multiselect', 'eds-dropdown-wrapper', className),
-    style: style
-  }, React.createElement(BaseFormControl, {
-    label: label,
-    labelId: multiSelectId,
-    labelProps: getLabelProps,
-    feedback: feedback,
-    variant: variant,
-    isFilled: selectedItems.length > 0 || isOpen,
-    disabled: disabled,
-    readOnly: readOnly,
-    append: React.createElement(Appendix, {
-      hasSelected: clearable && selectedItems.length > 0,
-      loading: loading,
-      loadingText: loadingText,
-      readOnly: readOnly
-    })
-  }, React.createElement("button", _extends({}, getToggleButtonProps({
-    style: {
-      textAlign: 'left'
-    },
-    type: 'button',
-    className: 'eds-form-control eds-multiselect__button'
-  })), buttonText)), React.createElement("ul", _extends({
-    className: classNames('eds-dropdown-list', {
-      'eds-dropdown-list--open': isOpen
-    })
-  }, getMenuProps({
-    style: _extends({
-      position: 'absolute',
-      top: space.extraLarge3 + space.extraSmall + "px"
-    }, listStyle)
-  })), isOpen && items.map(function (item, index) {
-    return React.createElement("li", _extends({
-      className: classNames('eds-dropdown-list__item', {
-        'eds-dropdown-list__item--highlighted': highlightedIndex === index,
-        'eds-dropdown-list__item--selected': isSelected(item)
-      }),
-      key: "" + item.value + index
-    }, getItemProps({
-      item: item,
-      index: index
-    }), {
-      style: {
-        display: 'flex'
-      }
-    }), React.createElement("span", {
-      style: {
-        display: 'flex'
-      }
-    }, React.createElement("span", {
-      className: classNames('eds-multiselect-checkbox', {
-        'eds-multiselect-checkbox--checked': isSelected(item)
-      })
-    }, React.createElement(CheckboxIcon, null)), React.createElement("span", {
-      className: "eds-multiselect__item-label"
-    }, item.label)), item.icons && React.createElement("span", null, item.icons.map(function (Icon, index) {
-      return React.createElement(Icon, {
-        key: index,
-        inline: true,
-        className: "eds-dropdown-list__item-icon"
-      });
-    })));
-  }))));
-};
-var ClearButton = function ClearButton(_ref3) {
-  var props = _extends({}, (_objectDestructuringEmpty(_ref3), _ref3));
-  var _useMultiSelectOldCon = useMultiSelectOldContext(),
-    reset = _useMultiSelectOldCon.reset;
-  return React.createElement(React.Fragment, null, React.createElement("button", _extends({
-    className: "eds-dropdown__clear-button",
-    type: "button",
-    tabIndex: -1,
-    onClick: function onClick() {
-      return reset();
-    }
-  }, props), React.createElement(CloseIcon, null)), React.createElement("div", {
-    className: "eds-dropdown__divider"
-  }));
-};
-var Appendix = function Appendix(_ref4) {
-  var loading = _ref4.loading,
-    loadingText = _ref4.loadingText,
-    readOnly = _ref4.readOnly,
-    hasSelected = _ref4.hasSelected;
-  if (loading) {
-    return React.createElement(DropdownDeprecatedLoadingDots, null, loadingText);
-  }
-  if (readOnly) {
-    return null;
-  }
-  return hasSelected ? React.createElement(React.Fragment, null, React.createElement(ClearButton, null), React.createElement(DropdownToggleButton, null)) : React.createElement(DropdownToggleButton, null);
-};
-var DropdownToggleButton = function DropdownToggleButton() {
-  var _useMultiSelectOldCon2 = useMultiSelectOldContext(),
-    getToggleButtonProps = _useMultiSelectOldCon2.getToggleButtonProps,
-    isOpen = _useMultiSelectOldCon2.isOpen,
-    openMenu = _useMultiSelectOldCon2.openMenu,
-    openOnFocus = _useMultiSelectOldCon2.openOnFocus;
-  return React.createElement("button", _extends({}, getToggleButtonProps({
-    className: classNames('eds-dropdown__toggle-button', {
-      'eds-dropdown__toggle-button--open': isOpen
-    }),
-    onFocus: function onFocus() {
-      if (openOnFocus) {
-        openMenu();
-      }
-    }
-  }), {
-    type: "button"
-  }), React.createElement(DownArrowIcon, null));
-};
-var CheckboxIcon = function CheckboxIcon() {
-  return React.createElement("svg", {
-    className: "eds-checkbox-icon",
-    width: "11px",
-    height: "9px",
-    viewBox: "6 11 37 33"
-  }, React.createElement("path", {
-    className: "eds-checkbox-icon__path",
-    d: "M14.1 27.2l7.1 7.2 14.6-14.8",
-    fill: "none"
-  }));
-};
-function SelectedItemsLabel(items) {
-  return items.length < 3 ? items.map(function (item) {
-    return item.label;
-  }).toString() : items.length + " elementer valgt";
+  }, e;
 }
 
 var _excluded$5 = ["ariaLabelChosenSingular", "ariaLabelSelectedItem", "getItemProps", "getMenuProps", "inputValue", "isOpen", "highlightedIndex", "listItems", "floatingStyles", "setListRef", "loading", "loadingText", "noMatchesText", "selectAllCheckboxState", "selectAllItem", "selectedItems", "showSelectAllInList"];
@@ -1260,7 +382,7 @@ var DropdownList = function DropdownList(_ref) {
     selectedItems = _ref.selectedItems,
     rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
   var isMultiselect = selectAllItem !== undefined;
-  var isNoMatches = !loading && (listItems.length === 0 || (listItems == null ? void 0 : listItems.length) === 1 && (listItems == null ? void 0 : (_listItems$ = listItems[0]) == null ? void 0 : _listItems$.value) === (selectAllItem == null ? void 0 : selectAllItem.value));
+  var isNoMatches = !loading && (listItems.length === 0 || (listItems == null ? void 0 : listItems.length) === 1 && (listItems == null || (_listItems$ = listItems[0]) == null ? void 0 : _listItems$.value) === (selectAllItem == null ? void 0 : selectAllItem.value));
   var isItemSelected = function isItemSelected(item) {
     return selectedItems.some(function (selectedItem) {
       return (selectedItem == null ? void 0 : selectedItem.value) === (item == null ? void 0 : item.value) && (selectedItem == null ? void 0 : selectedItem.label) === (item == null ? void 0 : item.label);
@@ -1496,6 +618,121 @@ var ToggleButton = function ToggleButton(_ref5) {
   }));
 };
 
+var useNormalizedItems = function useNormalizedItems(items) {
+  return React.useMemo(function () {
+    return items.map(function (item) {
+      if (typeof item == 'string') {
+        return {
+          value: item,
+          label: item
+        };
+      }
+      if ((item == null ? void 0 : item.value) === undefined) {
+        return _extends({}, item, {
+          value: item.label
+        });
+      }
+      return _extends({}, item, {
+        value: item.value
+      });
+    });
+  }, [items]);
+};
+
+var useResolvedItems = function useResolvedItems(/** The list of items, or an async function that resolves the list of items */
+itemsOrItemsResolver, /** The time to wait after the input changes to the fetchItems method is called */
+debounceTimeout) {
+  if (debounceTimeout === void 0) {
+    debounceTimeout = 250;
+  }
+  var itemsIsAFunction = typeof itemsOrItemsResolver === 'function';
+  var _React$useState = React.useState(itemsIsAFunction ? [] : itemsOrItemsResolver),
+    items = _React$useState[0],
+    setItems = _React$useState[1];
+  var _React$useState2 = React.useState(false),
+    loading = _React$useState2[0],
+    setLoading = _React$useState2[1];
+  var abortControllerRef = React.useRef(new AbortController());
+  // We normalize the itemsResolver argument to an async function, so we
+  // can use it without thinking about the differences later
+  var itemsResolver = React.useMemo(function () {
+    if (itemsIsAFunction) return itemsOrItemsResolver;
+    return function () {
+      return Promise.resolve(itemsOrItemsResolver);
+    };
+  }, [itemsOrItemsResolver, itemsIsAFunction]);
+  // This should be called whenever the input value changes
+  var updateItems = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(inputValue) {
+      var _abortControllerRef$c;
+      var abortController, _abortControllerRef$c2, resolvedItems;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            // The abortController handles cleanup of the previous request and unmounting
+            if (abortControllerRef != null && abortControllerRef.current) abortControllerRef == null || (_abortControllerRef$c = abortControllerRef.current) == null || _abortControllerRef$c.abort();
+            abortController = new AbortController();
+            abortControllerRef.current = abortController;
+            setLoading(true);
+            _context.prev = 4;
+            _context.next = 7;
+            return itemsResolver(inputValue != null ? inputValue : '', abortControllerRef);
+          case 7:
+            resolvedItems = _context.sent;
+            if (!(abortControllerRef != null && (_abortControllerRef$c2 = abortControllerRef.current) != null && (_abortControllerRef$c2 = _abortControllerRef$c2.signal) != null && _abortControllerRef$c2.aborted)) {
+              _context.next = 11;
+              break;
+            }
+            console.warn('Avbryt den asynkrone funksjonen din med signalet fra AbortController-en for å for å unngå minnelekkasje.', 'Funksjonen bør kaste en DOMException med navnet "AbortError" når den avbrytes.', '', '\n\nSe eksempel her: https://design.entur.no/komponenter/skjemaelementer/dropdown#s%C3%B8kbar-dropdown-med-valg-fra-nettverkskall-bassert-p%C3%A5-tekstinput', '\nLes mer om AbortController her: https://developer.mozilla.org/en-US/docs/Web/API/AbortController');
+            return _context.abrupt("return");
+          case 11:
+            setLoading(false);
+            setItems(resolvedItems);
+            _context.next = 21;
+            break;
+          case 15:
+            _context.prev = 15;
+            _context.t0 = _context["catch"](4);
+            if (!(_context.t0 && typeof _context.t0 === 'object' && 'name' in _context.t0 && _context.t0.name === 'AbortError')) {
+              _context.next = 19;
+              break;
+            }
+            return _context.abrupt("return");
+          case 19:
+            console.warn('The following error was received but not handled inside Entur Designsystems useResolvedItems hook:');
+            throw _context.t0;
+          case 21:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[4, 15]]);
+    }));
+    return function updateItems(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var debouncedFetchItems = useDebounce(updateItems, debounceTimeout);
+  var normalizedItems = useNormalizedItems(items);
+  React.useEffect(function () {
+    // send abort signal to previous request on unmount for cleanup
+    return function () {
+      var _abortControllerRef$c3;
+      return abortControllerRef == null || (_abortControllerRef$c3 = abortControllerRef.current) == null ? void 0 : _abortControllerRef$c3.abort('Component unmounted');
+    };
+  }, []);
+  React.useEffect(function () {
+    // Let's fetch the list initially if it's specified
+    if (itemsIsAFunction) {
+      debouncedFetchItems('');
+    }
+  }, [itemsIsAFunction, itemsResolver]);
+  return {
+    items: normalizedItems,
+    loading: itemsIsAFunction ? loading : false,
+    fetchItems: debouncedFetchItems
+  };
+};
+
 /* start general utils */
 var EMPTY_INPUT = '';
 function lowerCaseFilterTest(item, input) {
@@ -1806,20 +1043,28 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
     inputValue = _useCombobox.inputValue,
     setInputValue = _useCombobox.setInputValue;
   var _useFloating = useFloating({
-      whileElementsMounted: function whileElementsMounted(ref, _float, update) {
-        return autoUpdate(ref, _float, update);
-      },
       placement: 'bottom-start',
       open: isOpen,
       middleware: [offset(space.extraSmall2), flip()]
     }),
     refs = _useFloating.refs,
-    floatingStyles = _useFloating.floatingStyles;
+    floatingStyles = _useFloating.floatingStyles,
+    elements = _useFloating.elements,
+    update = _useFloating.update;
+  // Since we use CSS instead of conditional rendering when hiding dropdownlist
+  // we can't use the whileElementsMounted option and need to handle
+  // cleanup ourselves. See https://floating-ui.com/docs/autoupdate
+  useEffect(function () {
+    if (isOpen && elements.reference && elements.floating) {
+      var cleanup = autoUpdate(elements.reference, elements.floating, update);
+      return cleanup;
+    }
+  }, [isOpen, elements, update]);
   var handleOnClear = function handleOnClear() {
     var _inputRef$current;
     onChange(null);
     setInputValue(EMPTY_INPUT);
-    (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
+    (_inputRef$current = inputRef.current) == null || _inputRef$current.focus();
     updateListItems({
       inputValue: inputValue
     });
@@ -1853,7 +1098,7 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
     labelTooltip: labelTooltip,
     onClick: function onClick(e) {
       var _inputRef$current2;
-      if (e.target === e.currentTarget) (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.focus();
+      if (e.target === e.currentTarget) (_inputRef$current2 = inputRef.current) == null || _inputRef$current2.focus();
     },
     prepend: prepend,
     readOnly: readOnly,
@@ -1867,7 +1112,7 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
     "aria-hidden": "true",
     onClick: function onClick() {
       var _inputRef$current3;
-      (_inputRef$current3 = inputRef.current) == null ? void 0 : _inputRef$current3.focus();
+      (_inputRef$current3 = inputRef.current) == null || _inputRef$current3.focus();
       openMenu();
     }
   }, showSelectedItem ? selectedItem == null ? void 0 : selectedItem.label : ''), React.createElement("input", _extends({
@@ -1884,7 +1129,7 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
       setShowSelectedItem(false);
     },
     onKeyDown: function onKeyDown(e) {
-      if (selectOnTab && isOpen && e.key === 'Tab') onChange == null ? void 0 : onChange(listItems[highlightedIndex]);
+      if (selectOnTab && isOpen && e.key === 'Tab') onChange == null || onChange(listItems[highlightedIndex]);
     },
     ref: inputRef
   }))), React.createElement(DropdownList, {
@@ -2060,7 +1305,7 @@ var MultiSelect = function MultiSelect(_ref) {
           }
           return _extends({}, changes, {
             isOpen: true,
-            inputValue: clearInputOnSelect ? EMPTY_INPUT : (_inputRef$current$val = inputRef == null ? void 0 : (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.value) != null ? _inputRef$current$val : EMPTY_INPUT
+            inputValue: clearInputOnSelect ? EMPTY_INPUT : (_inputRef$current$val = inputRef == null || (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.value) != null ? _inputRef$current$val : EMPTY_INPUT
           });
         }
       // edit input value when selected items is updated outside component
@@ -2068,7 +1313,7 @@ var MultiSelect = function MultiSelect(_ref) {
         {
           var _inputRef$current$val2, _inputRef$current2;
           return _extends({}, changes, {
-            inputValue: (_inputRef$current$val2 = inputRef == null ? void 0 : (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.value) != null ? _inputRef$current$val2 : EMPTY_INPUT
+            inputValue: (_inputRef$current$val2 = inputRef == null || (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.value) != null ? _inputRef$current$val2 : EMPTY_INPUT
           });
         }
       // remove leading whitespace, select item with spacebar if input is empty and filter list items
@@ -2116,6 +1361,7 @@ var MultiSelect = function MultiSelect(_ref) {
   }, [hideSelectAll, normalizedItems, filterListItems, initialItems]);
   var _useCombobox = useCombobox(_extends({
       defaultHighlightedIndex: lastHighlightedIndex,
+      // after selection, highlight previously selected item.
       items: listItems,
       itemToString: itemToString,
       selectedItem: null,
@@ -2158,20 +1404,28 @@ var MultiSelect = function MultiSelect(_ref) {
     openMenu = _useCombobox.openMenu,
     setInputValue = _useCombobox.setInputValue;
   var _useFloating = useFloating({
-      whileElementsMounted: function whileElementsMounted(ref, _float, update) {
-        return autoUpdate(ref, _float, update);
-      },
       placement: 'bottom-start',
       open: isOpen,
       middleware: [offset(space.extraSmall2), flip()]
     }),
     refs = _useFloating.refs,
-    floatingStyles = _useFloating.floatingStyles;
+    floatingStyles = _useFloating.floatingStyles,
+    elements = _useFloating.elements,
+    update = _useFloating.update;
+  // Since we use CSS instead of conditional rendering when hiding dropdownlist
+  // we can't use the whileElementsMounted option and need to handle
+  // cleanup ourselves. See https://floating-ui.com/docs/autoupdate
+  useEffect(function () {
+    if (isOpen && elements.reference && elements.floating) {
+      var cleanup = autoUpdate(elements.reference, elements.floating, update);
+      return cleanup;
+    }
+  }, [isOpen, elements, update]);
   var handleOnClear = function handleOnClear() {
     var _inputRef$current3;
     onChange([]);
     setInputValue(EMPTY_INPUT);
-    (_inputRef$current3 = inputRef.current) == null ? void 0 : _inputRef$current3.focus();
+    (_inputRef$current3 = inputRef.current) == null || _inputRef$current3.focus();
     updateListItems({
       inputValue: inputValue
     });
@@ -2204,7 +1458,7 @@ var MultiSelect = function MultiSelect(_ref) {
     labelTooltip: labelTooltip,
     onClick: function onClick(e) {
       var _inputRef$current4;
-      if (e.target === e.currentTarget) (_inputRef$current4 = inputRef.current) == null ? void 0 : _inputRef$current4.focus();
+      if (e.target === e.currentTarget) (_inputRef$current4 = inputRef.current) == null || _inputRef$current4.focus();
     },
     readOnly: readOnly,
     ref: refs.setReference,
@@ -2237,7 +1491,7 @@ var MultiSelect = function MultiSelect(_ref) {
           clickedItem: selectedItem,
           onChange: onChange
         });
-        inputRef == null ? void 0 : (_inputRef$current6 = inputRef.current) == null ? void 0 : _inputRef$current6.focus();
+        inputRef == null || (_inputRef$current6 = inputRef.current) == null || _inputRef$current6.focus();
       },
       selectedItem: selectedItem
     });
@@ -2348,7 +1602,7 @@ var Dropdown = function Dropdown(_ref) {
           case useSelect.stateChangeTypes.ItemClick:
             {
               if (newSelectedItem === undefined) return;
-              onChange == null ? void 0 : onChange(newSelectedItem != null ? newSelectedItem : null);
+              onChange == null || onChange(newSelectedItem != null ? newSelectedItem : null);
             }
         }
       },
@@ -2362,15 +1616,23 @@ var Dropdown = function Dropdown(_ref) {
     getToggleButtonProps = _useSelect.getToggleButtonProps,
     highlightedIndex = _useSelect.highlightedIndex;
   var _useFloating = useFloating({
-      whileElementsMounted: function whileElementsMounted(ref, _float, update) {
-        return autoUpdate(ref, _float, update);
-      },
       placement: 'bottom-start',
       open: isOpen,
       middleware: [offset(space.extraSmall2), flip()]
     }),
     refs = _useFloating.refs,
-    floatingStyles = _useFloating.floatingStyles;
+    floatingStyles = _useFloating.floatingStyles,
+    elements = _useFloating.elements,
+    update = _useFloating.update;
+  // Since we use CSS instead of conditional rendering when hiding dropdownlist
+  // we can't use the whileElementsMounted option and need to handle
+  // cleanup ourselves. See https://floating-ui.com/docs/autoupdate
+  useEffect(function () {
+    if (isOpen && elements.reference && elements.floating) {
+      var cleanup = autoUpdate(elements.reference, elements.floating, update);
+      return cleanup;
+    }
+  }, [isOpen, elements, update]);
   return React.createElement(BaseFormControl, _extends({
     append: React.createElement(FieldAppend$1, {
       ariaHiddenToggleButton: true,
@@ -2385,8 +1647,8 @@ var Dropdown = function Dropdown(_ref) {
       loadingText: loadingText,
       onClear: function onClear() {
         var _toggleButtonRef$curr;
-        onChange == null ? void 0 : onChange(null);
-        (_toggleButtonRef$curr = toggleButtonRef.current) == null ? void 0 : _toggleButtonRef$curr.focus();
+        onChange == null || onChange(null);
+        (_toggleButtonRef$curr = toggleButtonRef.current) == null || _toggleButtonRef$curr.focus();
       },
       disabled: readOnly || disabled,
       selectedItems: [selectedItem]
@@ -2419,7 +1681,7 @@ var Dropdown = function Dropdown(_ref) {
         // we don't want to clear selection with tab
         var highlitedItem = normalizedItems[highlightedIndex];
         if (highlitedItem) {
-          onChange == null ? void 0 : onChange(highlitedItem);
+          onChange == null || onChange(highlitedItem);
         }
       }
     },
@@ -2497,7 +1759,7 @@ var NativeDropdown = function NativeDropdown(_ref) {
     disabled: disabled || readOnly,
     onChange: function onChange(event) {
       var _normalizedItems$find;
-      _onChange == null ? void 0 : _onChange({
+      _onChange == null || _onChange({
         value: event.target.value,
         selectedItem: (_normalizedItems$find = normalizedItems.find(function (item) {
           return item.value === event.target.value;
@@ -2534,5 +1796,5 @@ var FieldAppend = function FieldAppend(_ref3) {
 
 warnAboutMissingStyles('dropdown', 'form', 'a11y', 'chip');
 
-export { Dropdown, DropdownDeprecated, MultiSelect, MultiSelectDeprecated, NativeDropdown, SearchableDropdown };
+export { Dropdown, MultiSelect, NativeDropdown, SearchableDropdown };
 //# sourceMappingURL=dropdown.esm.js.map