@stytch/react 18.1.0 → 18.2.0

package/dist/adminPortal/index.esm.js

@@ -260,13 +260,13 @@ var B2BOAuthProviders;
     B2BOAuthProviders["Google"] = "google";
     B2BOAuthProviders["Microsoft"] = "microsoft";
 })(B2BOAuthProviders || (B2BOAuthProviders = {}));
-function _slicedToArray$2(arr, i) {
-    return _arrayWithHoles$2(arr) || _iterableToArrayLimit$2(arr, i) || _unsupportedIterableToArray$3(arr, i) || _nonIterableRest$2();
+function _slicedToArray$3(arr, i) {
+    return _arrayWithHoles$3(arr) || _iterableToArrayLimit$3(arr, i) || _unsupportedIterableToArray$4(arr, i) || _nonIterableRest$3();
 }
-function _nonIterableRest$2() {
+function _nonIterableRest$3() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _iterableToArrayLimit$2(r, l) {
+function _iterableToArrayLimit$3(r, l) {
     var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
     if (null != t) {
         var e, n, i, u, a = [], f = !0, o = !1;
@@ -296,37 +296,37 @@ function _iterableToArrayLimit$2(r, l) {
         return a;
     }
 }
-function _arrayWithHoles$2(arr) {
+function _arrayWithHoles$3(arr) {
     if (Array.isArray(arr))
         return arr;
 }
-function _unsupportedIterableToArray$3(o, minLen) {
+function _unsupportedIterableToArray$4(o, minLen) {
     if (!o)
         return;
     if (typeof o === "string")
-        return _arrayLikeToArray$3(o, minLen);
+        return _arrayLikeToArray$4(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$3(o, minLen);
+        return _arrayLikeToArray$4(o, minLen);
 }
-function _arrayLikeToArray$3(arr, len) {
+function _arrayLikeToArray$4(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;
 }
-function _typeof$6(o) {
+function _typeof$7(o) {
     "@babel/helpers - typeof";
-    return _typeof$6 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
+    return _typeof$7 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
         return typeof o;
     } : function (o) {
         return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
-    }, _typeof$6(o);
+    }, _typeof$7(o);
 }
 typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
     var e = new Error(message);
@@ -361,20 +361,20 @@ Promise.resolve({
 var createDeepEqual = function createDeepEqual() {
     var _ref8 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, _ref8$KEYS_TO_EXCLUDE = _ref8.KEYS_TO_EXCLUDE, KEYS_TO_EXCLUDE = _ref8$KEYS_TO_EXCLUDE === void 0 ? [] : _ref8$KEYS_TO_EXCLUDE;
     var deepEqual = function deepEqual(a, b) {
-        if (_typeof$6(a) !== _typeof$6(b))
+        if (_typeof$7(a) !== _typeof$7(b))
             return false;
         if (a === null || b === null)
             return a === b;
-        if (_typeof$6(a) === 'object') {
+        if (_typeof$7(a) === 'object') {
             if (Object.keys(a).length !== Object.keys(b).length || Object.keys(a).some(function (k) {
                 return !(k in b);
             }))
                 return false;
             return Object.entries(a).filter(function (_ref9) {
-                var _ref10 = _slicedToArray$2(_ref9, 1), k = _ref10[0];
+                var _ref10 = _slicedToArray$3(_ref9, 1), k = _ref10[0];
                 return !KEYS_TO_EXCLUDE.includes(k);
             }).every(function (_ref11) {
-                var _ref12 = _slicedToArray$2(_ref11, 2), k = _ref12[0], v = _ref12[1];
+                var _ref12 = _slicedToArray$3(_ref11, 2), k = _ref12[0], v = _ref12[1];
                 return deepEqual(v, b[k]);
             });
         }
@@ -427,6 +427,11 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     var e = new Error(message);
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
+var LOCAL_STORAGE_KEY_PREFIX = 'stytch_sdk_state_';
+var getLocalStorageKey = function getLocalStorageKey(publicToken) {
+    var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+    return "".concat(LOCAL_STORAGE_KEY_PREFIX).concat(publicToken).concat(key ? "::".concat(key) : '');
+};
 var internalSymB2B = Symbol["for"]('stytch__internal_b2b');
 var readB2BInternals = function readB2BInternals(obj) {
     var casted = obj;
@@ -466,7 +471,7 @@ function _regeneratorRuntime$1() {
     function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); }
     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$5(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); });
+        return h && "object" == _typeof$6(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); });
     } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); }
     function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f)
         throw new Error("Generator is already running"); if (o === s) {
@@ -519,7 +524,7 @@ function _regeneratorRuntime$1() {
                     return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; };
             return i.next = i;
         }
-    } throw new TypeError(_typeof$5(e) + " is not iterable"); }
+    } throw new TypeError(_typeof$6(e) + " is not iterable"); }
     return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), 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: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), 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(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), 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();
@@ -576,7 +581,7 @@ function _regeneratorRuntime$1() {
         } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e;
 }
 function _createForOfIteratorHelper$1(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) {
-    if (Array.isArray(o) || (it = _unsupportedIterableToArray$2(o)) || allowArrayLike && o && typeof o.length === "number") {
+    if (Array.isArray(o) || (it = _unsupportedIterableToArray$3(o)) || allowArrayLike && o && typeof o.length === "number") {
         if (it)
             o = it;
         var i = 0;
@@ -607,18 +612,18 @@ 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 _slicedToArray$1(arr, i) { return _arrayWithHoles$1(arr) || _iterableToArrayLimit$1(arr, i) || _unsupportedIterableToArray$2(arr, i) || _nonIterableRest$1(); }
-function _nonIterableRest$1() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray$2(o, minLen) { if (!o)
+function _slicedToArray$2(arr, i) { return _arrayWithHoles$2(arr) || _iterableToArrayLimit$2(arr, i) || _unsupportedIterableToArray$3(arr, i) || _nonIterableRest$2(); }
+function _nonIterableRest$2() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray$3(o, minLen) { if (!o)
     return; if (typeof o === "string")
-    return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor)
+    return _arrayLikeToArray$3(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$2(o, minLen); }
-function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length)
+    return _arrayLikeToArray$3(o, minLen); }
+function _arrayLikeToArray$3(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; }
-function _iterableToArrayLimit$1(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) {
+function _iterableToArrayLimit$2(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) {
     var e, n, i, u, a = [], f = !0, o = !1;
     try {
         if (i = (t = t.call(r)).next, 0 === l) {
@@ -645,7 +650,7 @@ function _iterableToArrayLimit$1(r, l) { var t = null == r ? null : "undefined"
     }
     return a;
 } }
-function _arrayWithHoles$1(arr) { if (Array.isArray(arr))
+function _arrayWithHoles$2(arr) { if (Array.isArray(arr))
     return arr; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e);
@@ -653,9 +658,9 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) {
     var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); });
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); });
 } return e; }
-function _defineProperty$1(obj, key, value) { key = _toPropertyKey$1(key); if (key in obj) {
+function _defineProperty$2(obj, key, value) { key = _toPropertyKey$1(key); if (key in obj) {
     Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });
 }
 else {
@@ -675,16 +680,16 @@ function _defineProperties$2(target, props) { for (var i = 0; i < props.length;
 function _createClass$2(Constructor, protoProps, staticProps) { if (protoProps)
     _defineProperties$2(Constructor.prototype, protoProps); if (staticProps)
     _defineProperties$2(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$5(i) ? i : String(i); }
-function _toPrimitive$1(t, r) { if ("object" != _typeof$5(t) || !t)
+function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$6(i) ? i : String(i); }
+function _toPrimitive$1(t, r) { if ("object" != _typeof$6(t) || !t)
     return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) {
     var i = e.call(t, r || "default");
-    if ("object" != _typeof$5(i))
+    if ("object" != _typeof$6(i))
         return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
 } return ("string" === r ? String : Number)(t); }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _possibleConstructorReturn(self, call) { if (call && (_typeof$5(call) === "object" || typeof call === "function")) {
+function _possibleConstructorReturn(self, call) { if (call && (_typeof$6(call) === "object" || typeof call === "function")) {
     return call;
 }
 else if (call !== void 0) {
@@ -719,9 +724,9 @@ catch (e) {
 } }
 function _setPrototypeOf$1(o, p) { _setPrototypeOf$1 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$1(o, p); }
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-function _typeof$5(o) {
+function _typeof$6(o) {
     "@babel/helpers - typeof";
-    return _typeof$5 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$5(o);
+    return _typeof$6 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$6(o);
 }
 var n$3, l$4, u$3, i$1, o$1, r$4, f$3, e$4, c$3 = {}, s$1 = [], a$1 = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i, h$5 = Array.isArray;
 function v$4(n, l) {
@@ -1455,7 +1460,7 @@ function j$1(n, e) {
     });
 };
 var z$3 = "undefined" != typeof Symbol && Symbol["for"] && Symbol["for"]("react.element") || 60103, B$2 = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/, H$2 = /^on(Ani|Tra|Tou|BeforeInp|Compo)/, Z$1 = /[A-Z0-9]/g, Y$1 = "undefined" != typeof document, $$1 = function $$1(n) {
-    return ("undefined" != typeof Symbol && "symbol" == _typeof$5(Symbol()) ? /fil|che|rad/ : /fil|che|ra/).test(n);
+    return ("undefined" != typeof Symbol && "symbol" == _typeof$6(Symbol()) ? /fil|che|rad/ : /fil|che|ra/).test(n);
 };
 function q$4(n, t, e) {
     return null == t.__k && (t.textContent = ""), q$6(n, t), "function" == typeof e && e(), n ? n.__c : null;
@@ -1748,7 +1753,7 @@ if ("function" === typeof Symbol && Symbol["for"]) {
     w$2 = x$2("react.legacy_hidden");
 }
 function y$1(a) {
-    if ("object" === _typeof$5(a) && null !== a) {
+    if ("object" === _typeof$6(a) && null !== a) {
         var t = a.$$typeof;
         switch (t) {
             case b$2:
@@ -1801,7 +1806,7 @@ reactIs_production_min$1.isContextProvider = function (a) {
     return y$1(a) === g$2;
 };
 reactIs_production_min$1.isElement = function (a) {
-    return "object" === _typeof$5(a) && null !== a && a.$$typeof === b$2;
+    return "object" === _typeof$6(a) && null !== a && a.$$typeof === b$2;
 };
 reactIs_production_min$1.isForwardRef = function (a) {
     return y$1(a) === k$3;
@@ -1828,7 +1833,7 @@ reactIs_production_min$1.isSuspense = function (a) {
     return y$1(a) === l$2;
 };
 reactIs_production_min$1.isValidElementType = function (a) {
-    return "string" === typeof a || "function" === typeof a || a === d$1 || a === f$1 || a === v$2 || a === e$2 || a === l$2 || a === m$2 || a === w$2 || "object" === _typeof$5(a) && null !== a && (a.$$typeof === p$2 || a.$$typeof === n$2 || a.$$typeof === g$2 || a.$$typeof === h$3 || a.$$typeof === k$3 || a.$$typeof === u$1 || a.$$typeof === q$3 || a[0] === r$2) ? !0 : !1;
+    return "string" === typeof a || "function" === typeof a || a === d$1 || a === f$1 || a === v$2 || a === e$2 || a === l$2 || a === m$2 || a === w$2 || "object" === _typeof$6(a) && null !== a && (a.$$typeof === p$2 || a.$$typeof === n$2 || a.$$typeof === g$2 || a.$$typeof === h$3 || a.$$typeof === k$3 || a.$$typeof === u$1 || a.$$typeof === q$3 || a[0] === r$2) ? !0 : !1;
 };
 reactIs_production_min$1.typeOf = y$1;
 {
@@ -1843,7 +1848,7 @@ var shallowequal = function shallowEqual(objA, objB, compare, compareContext) {
     if (objA === objB) {
         return true;
     }
-    if (_typeof$5(objA) !== "object" || !objA || _typeof$5(objB) !== "object" || !objB) {
+    if (_typeof$6(objA) !== "object" || !objA || _typeof$6(objB) !== "object" || !objB) {
         return false;
     }
     var keysA = Object.keys(objA);
@@ -2316,7 +2321,7 @@ function stylis_min(W) {
             default:
                 if ('function' === typeof d)
                     S[A++] = d;
-                else if ('object' === _typeof$5(d))
+                else if ('object' === _typeof$6(d))
                     for (var c = 0, e = d.length; c < e; ++c) {
                         T(d[c]);
                     }
@@ -2417,7 +2422,7 @@ var reactIs$1 = {
 var reactIs_production_min = {};
 var b$1 = "function" === typeof Symbol && Symbol["for"], c = b$1 ? Symbol["for"]("react.element") : 60103, d = b$1 ? Symbol["for"]("react.portal") : 60106, e$1 = b$1 ? Symbol["for"]("react.fragment") : 60107, f = b$1 ? Symbol["for"]("react.strict_mode") : 60108, g$1 = b$1 ? Symbol["for"]("react.profiler") : 60114, h$1 = b$1 ? Symbol["for"]("react.provider") : 60109, k$2 = b$1 ? Symbol["for"]("react.context") : 60110, l$1 = b$1 ? Symbol["for"]("react.async_mode") : 60111, m$1 = b$1 ? Symbol["for"]("react.concurrent_mode") : 60111, n$1 = b$1 ? Symbol["for"]("react.forward_ref") : 60112, p$1 = b$1 ? Symbol["for"]("react.suspense") : 60113, q$2 = b$1 ? Symbol["for"]("react.suspense_list") : 60120, r$1 = b$1 ? Symbol["for"]("react.memo") : 60115, t$1 = b$1 ? Symbol["for"]("react.lazy") : 60116, v$1 = b$1 ? Symbol["for"]("react.block") : 60121, w$1 = b$1 ? Symbol["for"]("react.fundamental") : 60117, x$1 = b$1 ? Symbol["for"]("react.responder") : 60118, y = b$1 ? Symbol["for"]("react.scope") : 60119;
 function z$1(a) {
-    if ("object" === _typeof$5(a) && null !== a) {
+    if ("object" === _typeof$6(a) && null !== a) {
         var u = a.$$typeof;
         switch (u) {
             case c:
@@ -2473,7 +2478,7 @@ reactIs_production_min.isContextProvider = function (a) {
     return z$1(a) === h$1;
 };
 reactIs_production_min.isElement = function (a) {
-    return "object" === _typeof$5(a) && null !== a && a.$$typeof === c;
+    return "object" === _typeof$6(a) && null !== a && a.$$typeof === c;
 };
 reactIs_production_min.isForwardRef = function (a) {
     return z$1(a) === n$1;
@@ -2500,7 +2505,7 @@ reactIs_production_min.isSuspense = function (a) {
     return z$1(a) === p$1;
 };
 reactIs_production_min.isValidElementType = function (a) {
-    return "string" === typeof a || "function" === typeof a || a === e$1 || a === m$1 || a === g$1 || a === f || a === p$1 || a === q$2 || "object" === _typeof$5(a) && null !== a && (a.$$typeof === t$1 || a.$$typeof === r$1 || a.$$typeof === h$1 || a.$$typeof === k$2 || a.$$typeof === n$1 || a.$$typeof === w$1 || a.$$typeof === x$1 || a.$$typeof === y || a.$$typeof === v$1);
+    return "string" === typeof a || "function" === typeof a || a === e$1 || a === m$1 || a === g$1 || a === f || a === p$1 || a === q$2 || "object" === _typeof$6(a) && null !== a && (a.$$typeof === t$1 || a.$$typeof === r$1 || a.$$typeof === h$1 || a.$$typeof === k$2 || a.$$typeof === n$1 || a.$$typeof === w$1 || a.$$typeof === x$1 || a.$$typeof === y || a.$$typeof === v$1);
 };
 reactIs_production_min.typeOf = z$1;
 {
@@ -2604,7 +2609,7 @@ var g = function g(e, t) {
         n.push(t[r], e[r + 1]);
     return n;
 }, S = function S(t) {
-    return null !== t && "object" == _typeof$5(t) && "[object Object]" === (t.toString ? t.toString() : Object.prototype.toString.call(t)) && !reactIsExports$1.typeOf(t);
+    return null !== t && "object" == _typeof$6(t) && "[object Object]" === (t.toString ? t.toString() : Object.prototype.toString.call(t)) && !reactIsExports$1.typeOf(t);
 }, w = Object.freeze([]), E = Object.freeze({});
 function b(e) {
     return "function" == typeof e;
@@ -3026,7 +3031,7 @@ function ke(e) {
     return "string" == typeof e && "production" === "production";
 }
 var Ve = function Ve(e) {
-    return "function" == typeof e || "object" == _typeof$5(e) && null !== e && !Array.isArray(e);
+    return "function" == typeof e || "object" == _typeof$6(e) && null !== e && !Array.isArray(e);
 }, Be = function Be(e) {
     return "__proto__" !== e && "constructor" !== e && "prototype" !== e;
 };
@@ -3277,6 +3282,9 @@ function CreateSSRSafeWebComponent(ReactComponent, webComponentName) {
         }
     };
 }
+var isTruthy = function isTruthy(value) {
+    return Boolean(value);
+};
 var lodash_merge = {
     exports: {}
 };
@@ -3294,8 +3302,8 @@ lodash_merge.exports;
     var typedArrayTags = {};
     typedArrayTags[float32Tag] = typedArrayTags[float64Tag] = typedArrayTags[int8Tag] = typedArrayTags[int16Tag] = typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] = typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] = typedArrayTags[uint32Tag] = true;
     typedArrayTags[argsTag] = typedArrayTags[arrayTag] = typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] = typedArrayTags[dataViewTag] = typedArrayTags[dateTag] = typedArrayTags[errorTag] = typedArrayTags[funcTag] = typedArrayTags[mapTag] = typedArrayTags[numberTag] = typedArrayTags[objectTag] = typedArrayTags[regexpTag] = typedArrayTags[setTag] = typedArrayTags[stringTag] = typedArrayTags[weakMapTag] = false;
-    var freeGlobal = _typeof$5(commonjsGlobal) == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
-    var freeSelf = (typeof self === "undefined" ? "undefined" : _typeof$5(self)) == 'object' && self && self.Object === Object && self;
+    var freeGlobal = _typeof$6(commonjsGlobal) == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
+    var freeSelf = (typeof self === "undefined" ? "undefined" : _typeof$6(self)) == 'object' && self && self.Object === Object && self;
     var root = freeGlobal || freeSelf || Function('return this')();
     var freeExports = exports && !exports.nodeType && exports;
     var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module;
@@ -3805,7 +3813,7 @@ lodash_merge.exports;
         return typeof object.constructor == 'function' && !isPrototype(object) ? baseCreate(getPrototype(object)) : {};
     }
     function isIndex(value, length) {
-        var type = _typeof$5(value);
+        var type = _typeof$6(value);
         length = length == null ? MAX_SAFE_INTEGER : length;
         return !!length && (type == 'number' || type != 'symbol' && reIsUint.test(value)) && value > -1 && value % 1 == 0 && value < length;
     }
@@ -3813,14 +3821,14 @@ lodash_merge.exports;
         if (!isObject(object)) {
             return false;
         }
-        var type = _typeof$5(index);
+        var type = _typeof$6(index);
         if (type == 'number' ? isArrayLike(object) && isIndex(index, object.length) : type == 'string' && index in object) {
             return eq(object[index], value);
         }
         return false;
     }
     function isKeyable(value) {
-        var type = _typeof$5(value);
+        var type = _typeof$6(value);
         return type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean' ? value !== '__proto__' : value === null;
     }
     function isMasked(func) {
@@ -3924,11 +3932,11 @@ lodash_merge.exports;
         return typeof value == 'number' && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
     }
     function isObject(value) {
-        var type = _typeof$5(value);
+        var type = _typeof$6(value);
         return value != null && (type == 'object' || type == 'function');
     }
     function isObjectLike(value) {
-        return value != null && _typeof$5(value) == 'object';
+        return value != null && _typeof$6(value) == 'object';
     }
     function isPlainObject(value) {
         if (!isObjectLike(value) || baseGetTag(value) != objectTag) {
@@ -4039,10 +4047,10 @@ var mergeObjects = function mergeObjects(a, b) {
     return _objectSpread(_objectSpread({}, a), b);
 };
 var STR_UNDEFINED = 'undefined';
-var isWindowDefined = (typeof window === "undefined" ? "undefined" : _typeof$5(window)) != STR_UNDEFINED;
-var isDocumentDefined = (typeof document === "undefined" ? "undefined" : _typeof$5(document)) != STR_UNDEFINED;
+var isWindowDefined = (typeof window === "undefined" ? "undefined" : _typeof$6(window)) != STR_UNDEFINED;
+var isDocumentDefined = (typeof document === "undefined" ? "undefined" : _typeof$6(document)) != STR_UNDEFINED;
 var hasRequestAnimationFrame = function hasRequestAnimationFrame() {
-    return isWindowDefined && _typeof$5(window['requestAnimationFrame']) != STR_UNDEFINED;
+    return isWindowDefined && _typeof$6(window['requestAnimationFrame']) != STR_UNDEFINED;
 };
 var createCacheHelper = function createCacheHelper(cache, key) {
     var state = SWRGlobalState.get(cache);
@@ -4067,7 +4075,7 @@ var createCacheHelper = function createCacheHelper(cache, key) {
 var table = new WeakMap();
 var counter = 0;
 var stableHash = function stableHash(arg) {
-    var type = _typeof$5(arg);
+    var type = _typeof$6(arg);
     var constructor = arg && arg.constructor;
     var isDate = constructor == Date;
     var result;
@@ -4105,7 +4113,7 @@ var online = true;
 var isOnline = function isOnline() {
     return online;
 };
-var _ref$3 = isWindowDefined && window.addEventListener ? [window.addEventListener.bind(window), window.removeEventListener.bind(window)] : [noop$2, noop$2], _ref2$2 = _slicedToArray$1(_ref$3, 2), onWindowEvent = _ref2$2[0], offWindowEvent = _ref2$2[1];
+var _ref$4 = isWindowDefined && window.addEventListener ? [window.addEventListener.bind(window), window.removeEventListener.bind(window)] : [noop$2, noop$2], _ref2$3 = _slicedToArray$2(_ref$4, 2), onWindowEvent = _ref2$3[0], offWindowEvent = _ref2$3[1];
 var isVisible = function isVisible() {
     var visibilityState = isDocumentDefined && document.visibilityState;
     return isUndefined(visibilityState) || visibilityState !== 'hidden';
@@ -4198,15 +4206,15 @@ function _internalMutate() {
                                     while (1)
                                         switch (_context2.prev = _context2.next) {
                                             case 0:
-                                                _serialize3 = serialize(_k), _serialize4 = _slicedToArray$1(_serialize3, 1), key = _serialize4[0];
+                                                _serialize3 = serialize(_k), _serialize4 = _slicedToArray$2(_serialize3, 1), key = _serialize4[0];
                                                 if (key) {
                                                     _context2.next = 3;
                                                     break;
                                                 }
                                                 return _context2.abrupt("return");
                                             case 3:
-                                                _createCacheHelper3 = createCacheHelper(cache, key), _createCacheHelper4 = _slicedToArray$1(_createCacheHelper3, 2), get = _createCacheHelper4[0], set = _createCacheHelper4[1];
-                                                _SWRGlobalState$get5 = SWRGlobalState.get(cache), _SWRGlobalState$get6 = _slicedToArray$1(_SWRGlobalState$get5, 3), EVENT_REVALIDATORS = _SWRGlobalState$get6[0], MUTATION = _SWRGlobalState$get6[1], FETCH = _SWRGlobalState$get6[2];
+                                                _createCacheHelper3 = createCacheHelper(cache, key), _createCacheHelper4 = _slicedToArray$2(_createCacheHelper3, 2), get = _createCacheHelper4[0], set = _createCacheHelper4[1];
+                                                _SWRGlobalState$get5 = SWRGlobalState.get(cache), _SWRGlobalState$get6 = _slicedToArray$2(_SWRGlobalState$get5, 3), EVENT_REVALIDATORS = _SWRGlobalState$get6[0], MUTATION = _SWRGlobalState$get6[1], FETCH = _SWRGlobalState$get6[2];
                                                 revalidators = EVENT_REVALIDATORS[key];
                                                 startRevalidate = function startRevalidate() {
                                                     if (revalidate) {
@@ -4435,7 +4443,7 @@ var onErrorRetry = function onErrorRetry(_, __, config, revalidate, opts) {
 var compare = function compare(currentData, newData) {
     return stableHash(currentData) == stableHash(newData);
 };
-var _initCache = initCache(new Map()), _initCache2 = _slicedToArray$1(_initCache, 2), cache$3 = _initCache2[0], mutate = _initCache2[1];
+var _initCache = initCache(new Map()), _initCache2 = _slicedToArray$2(_initCache, 2), cache$3 = _initCache2[0], mutate = _initCache2[1];
 var defaultConfig = mergeObjects({
     onLoadingSlow: noop$2,
     onSuccess: noop$2,
@@ -4490,7 +4498,7 @@ var middleware = function middleware(useSWRNext) {
     return function (key_, fetcher_, config) {
         var fetcher = fetcher_ && function () {
             var key = serialize(key_)[0];
-            var _SWRGlobalState$get = SWRGlobalState.get(cache$3), _SWRGlobalState$get2 = _slicedToArray$1(_SWRGlobalState$get, 4), PRELOAD = _SWRGlobalState$get2[3];
+            var _SWRGlobalState$get = SWRGlobalState.get(cache$3), _SWRGlobalState$get2 = _slicedToArray$2(_SWRGlobalState$get, 4), PRELOAD = _SWRGlobalState$get2[3];
             var req = PRELOAD[key];
             if (req) {
                 delete PRELOAD[key];
@@ -4508,7 +4516,7 @@ var withArgs = function withArgs(hook) {
         for (var _len2 = arguments.length, args = new Array(_len2), _key3 = 0; _key3 < _len2; _key3++) {
             args[_key3] = arguments[_key3];
         }
-        var _normalize = normalize(args), _normalize2 = _slicedToArray$1(_normalize, 3), key = _normalize2[0], fn = _normalize2[1], _config = _normalize2[2];
+        var _normalize = normalize(args), _normalize2 = _slicedToArray$2(_normalize, 3), key = _normalize2[0], fn = _normalize2[1], _config = _normalize2[2];
         var config = mergeConfigs(fallbackConfig, _config);
         var next = hook;
         var use = config.use;
@@ -4536,8 +4544,8 @@ var WITH_DEDUPE = {
 };
 var useSWRHandler = function useSWRHandler(_key, fetcher, config) {
     var cache = config.cache, compare = config.compare, suspense = config.suspense, fallbackData = config.fallbackData, revalidateOnMount = config.revalidateOnMount, revalidateIfStale = config.revalidateIfStale, refreshInterval = config.refreshInterval, refreshWhenHidden = config.refreshWhenHidden, refreshWhenOffline = config.refreshWhenOffline, keepPreviousData = config.keepPreviousData;
-    var _SWRGlobalState$get3 = SWRGlobalState.get(cache), _SWRGlobalState$get4 = _slicedToArray$1(_SWRGlobalState$get3, 3), EVENT_REVALIDATORS = _SWRGlobalState$get4[0], MUTATION = _SWRGlobalState$get4[1], FETCH = _SWRGlobalState$get4[2];
-    var _serialize = serialize(_key), _serialize2 = _slicedToArray$1(_serialize, 2), key = _serialize2[0], fnArg = _serialize2[1];
+    var _SWRGlobalState$get3 = SWRGlobalState.get(cache), _SWRGlobalState$get4 = _slicedToArray$2(_SWRGlobalState$get3, 3), EVENT_REVALIDATORS = _SWRGlobalState$get4[0], MUTATION = _SWRGlobalState$get4[1], FETCH = _SWRGlobalState$get4[2];
+    var _serialize = serialize(_key), _serialize2 = _slicedToArray$2(_serialize, 2), key = _serialize2[0], fnArg = _serialize2[1];
     var initialMountedRef = _$1(false);
     var unmountedRef = _$1(false);
     var keyRef = _$1(key);
@@ -4549,7 +4557,7 @@ var useSWRHandler = function useSWRHandler(_key, fetcher, config) {
     var isActive = function isActive() {
         return getConfig().isVisible() && getConfig().isOnline();
     };
-    var _createCacheHelper = createCacheHelper(cache, key), _createCacheHelper2 = _slicedToArray$1(_createCacheHelper, 4), getCache = _createCacheHelper2[0], setCache = _createCacheHelper2[1], subscribeCache = _createCacheHelper2[2], getInitialCache = _createCacheHelper2[3];
+    var _createCacheHelper = createCacheHelper(cache, key), _createCacheHelper2 = _slicedToArray$2(_createCacheHelper, 4), getCache = _createCacheHelper2[0], setCache = _createCacheHelper2[1], subscribeCache = _createCacheHelper2[2], getInitialCache = _createCacheHelper2[3];
     var stateDependencies = _$1({}).current;
     var fallback = isUndefined(fallbackData) ? config.fallback[key] : fallbackData;
     var isEqual = function isEqual(prev, current) {
@@ -4696,7 +4704,7 @@ var useSWRHandler = function useSWRHandler(_key, fetcher, config) {
                                 }
                                 FETCH[key] = [currentFetcher(fnArg), getTimestamp()];
                             }
-                            _FETCH$key = _slicedToArray$1(FETCH[key], 2);
+                            _FETCH$key = _slicedToArray$2(FETCH[key], 2);
                             newData = _FETCH$key[0];
                             startAt = _FETCH$key[1];
                             _context.next = 19;
@@ -4895,7 +4903,7 @@ var useSWRHandler = function useSWRHandler(_key, fetcher, config) {
 };
 var useSWR = withArgs(useSWRHandler);
 var extractErrorMessage = function extractErrorMessage(error) {
-    if (error && _typeof$5(error) === 'object') {
+    if (error && _typeof$6(error) === 'object') {
         if ('error_message' in error && typeof error.error_message === 'string') {
             return error.error_message;
         }
@@ -4905,6 +4913,10 @@ var extractErrorMessage = function extractErrorMessage(error) {
     }
 };
 
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) {
+    raw = strings.slice(0);
+} return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) {
     if (Array.isArray(o) || (it = _unsupportedIterableToArray2(o)) || allowArrayLike && o && typeof o.length === "number") {
         if (it)
@@ -5154,11 +5166,11 @@ function _extends$5() { _extends$5 = Object.assign ? Object.assign.bind() : func
         }
     }
 } return target; }; return _extends$5.apply(this, arguments); }
-function _typeof$4(o) {
+function _typeof$5(o) {
     "@babel/helpers - typeof";
-    return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$4(o);
+    return _typeof$5 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$5(o);
 }
-function isPlainObject(item) { return item && _typeof$4(item) === 'object' && item.constructor === Object; }
+function isPlainObject(item) { return item && _typeof$5(item) === 'object' && item.constructor === Object; }
 function deepmerge(target, source) { var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : { clone: true }; var output = options.clone ? _extends$5({}, target) : target; if (isPlainObject(target) && isPlainObject(source)) {
     Object.keys(source).forEach(function (key) { if (key === '__proto__') {
         return;
@@ -5216,19 +5228,19 @@ else if (color.type.indexOf('rgb') !== -1) {
         color.values[i] += (255 - color.values[i]) * coefficient;
     }
 } return recomposeColor(color); }
-function _typeof$3(o) {
+function _typeof$4(o) {
     "@babel/helpers - typeof";
-    return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$3(o);
+    return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$4(o);
 }
-function toPrimitive$1(t, r) { if ("object" != _typeof$3(t) || !t)
+function toPrimitive$2(t, r) { if ("object" != _typeof$4(t) || !t)
     return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) {
     var i = e.call(t, r || "default");
-    if ("object" != _typeof$3(i))
+    if ("object" != _typeof$4(i))
         return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
 } return ("string" === r ? String : Number)(t); }
-function toPropertyKey$1(t) { var i = toPrimitive$1(t, "string"); return "symbol" == _typeof$3(i) ? i : i + ""; }
-function _defineProperty(obj, key, value) { key = toPropertyKey$1(key); if (key in obj) {
+function toPropertyKey$2(t) { var i = toPrimitive$2(t, "string"); return "symbol" == _typeof$4(i) ? i : i + ""; }
+function _defineProperty$1(obj, key, value) { key = toPropertyKey$2(key); if (key in obj) {
     Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });
 }
 else {
@@ -5267,7 +5279,7 @@ function createBreakpoints(breakpoints) { var _breakpoints$values = breakpoints.
 } var value = typeof upperbound === 'number' && endIndex > 0 ? upperbound : key; return "@media (max-width:".concat(value - step / 100).concat(unit, ")"); } function between(start, end) { var endIndex = keys.indexOf(end); if (endIndex === keys.length - 1) {
     return up(start);
 } return "@media (min-width:".concat(typeof values[start] === 'number' ? values[start] : start).concat(unit, ") and ") + "(max-width:".concat((endIndex !== -1 && typeof values[keys[endIndex + 1]] === 'number' ? values[keys[endIndex + 1]] : end) - step / 100).concat(unit, ")"); } function only(key) { return between(key, key); } function width(key) { return values[key]; } return _extends$4({ keys: keys, values: values, up: up, down: down, between: between, only: only, width: width }, other); }
-function createMixins(breakpoints, spacing, mixins) { var _toolbar; return _extends$4({ gutters: function gutters() { var styles = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; console.warn(['Material-UI: theme.mixins.gutters() is deprecated.', 'You can use the source of the mixin directly:', "\n      paddingLeft: theme.spacing(2),\n      paddingRight: theme.spacing(2),\n      [theme.breakpoints.up('sm')]: {\n        paddingLeft: theme.spacing(3),\n        paddingRight: theme.spacing(3),\n      },\n      "].join('\n')); return _extends$4({ paddingLeft: spacing(2), paddingRight: spacing(2) }, styles, _defineProperty({}, breakpoints.up('sm'), _extends$4({ paddingLeft: spacing(3), paddingRight: spacing(3) }, styles[breakpoints.up('sm')]))); }, toolbar: (_toolbar = { minHeight: 56 }, _defineProperty(_toolbar, "".concat(breakpoints.up('xs'), " and (orientation: landscape)"), { minHeight: 48 }), _defineProperty(_toolbar, breakpoints.up('sm'), { minHeight: 64 }), _toolbar) }, mixins); }
+function createMixins(breakpoints, spacing, mixins) { var _toolbar; return _extends$4({ gutters: function gutters() { var styles = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; console.warn(['Material-UI: theme.mixins.gutters() is deprecated.', 'You can use the source of the mixin directly:', "\n      paddingLeft: theme.spacing(2),\n      paddingRight: theme.spacing(2),\n      [theme.breakpoints.up('sm')]: {\n        paddingLeft: theme.spacing(3),\n        paddingRight: theme.spacing(3),\n      },\n      "].join('\n')); return _extends$4({ paddingLeft: spacing(2), paddingRight: spacing(2) }, styles, _defineProperty$1({}, breakpoints.up('sm'), _extends$4({ paddingLeft: spacing(3), paddingRight: spacing(3) }, styles[breakpoints.up('sm')]))); }, toolbar: (_toolbar = { minHeight: 56 }, _defineProperty$1(_toolbar, "".concat(breakpoints.up('xs'), " and (orientation: landscape)"), { minHeight: 48 }), _defineProperty$1(_toolbar, breakpoints.up('sm'), { minHeight: 64 }), _toolbar) }, mixins); }
 var light = { text: { primary: 'rgba(0, 0, 0, 0.87)', secondary: 'rgba(0, 0, 0, 0.54)', disabled: 'rgba(0, 0, 0, 0.38)', hint: 'rgba(0, 0, 0, 0.38)' }, divider: 'rgba(0, 0, 0, 0.12)', background: { paper: common.white, "default": grey[50] }, action: { active: 'rgba(0, 0, 0, 0.54)', hover: 'rgba(0, 0, 0, 0.04)', hoverOpacity: 0.04, selected: 'rgba(0, 0, 0, 0.08)', selectedOpacity: 0.08, disabled: 'rgba(0, 0, 0, 0.26)', disabledBackground: 'rgba(0, 0, 0, 0.12)', disabledOpacity: 0.38, focus: 'rgba(0, 0, 0, 0.12)', focusOpacity: 0.12, activatedOpacity: 0.12 } };
 var dark = { text: { primary: common.white, secondary: 'rgba(255, 255, 255, 0.7)', disabled: 'rgba(255, 255, 255, 0.5)', hint: 'rgba(255, 255, 255, 0.5)', icon: 'rgba(255, 255, 255, 0.5)' }, divider: 'rgba(255, 255, 255, 0.12)', background: { paper: grey[800], "default": '#303030' }, action: { active: common.white, hover: 'rgba(255, 255, 255, 0.08)', hoverOpacity: 0.08, selected: 'rgba(255, 255, 255, 0.16)', selectedOpacity: 0.16, disabled: 'rgba(255, 255, 255, 0.3)', disabledBackground: 'rgba(255, 255, 255, 0.12)', disabledOpacity: 0.38, focus: 'rgba(255, 255, 255, 0.12)', focusOpacity: 0.12, activatedOpacity: 0.24 } };
 function addLightOrDark(intent, direction, shade, tonalOffset) { var tonalOffsetLight = tonalOffset.light || tonalOffset; var tonalOffsetDark = tonalOffset.dark || tonalOffset * 1.5; if (!intent[direction]) {
@@ -5359,27 +5371,27 @@ function _extends$3() { _extends$3 = Object.assign ? Object.assign.bind() : func
         }
     }
 } return target; }; return _extends$3.apply(this, arguments); }
-var _typeof$2 = typeof Symbol === "function" && _typeof2(Symbol.iterator) === "symbol" ? function (obj) { return _typeof2(obj); } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : _typeof2(obj); };
-var isBrowser$1 = (typeof window === "undefined" ? "undefined" : _typeof$2(window)) === "object" && (typeof document === "undefined" ? "undefined" : _typeof$2(document)) === 'object' && document.nodeType === 9;
-function _typeof$1(o) {
+var _typeof$3 = typeof Symbol === "function" && _typeof2(Symbol.iterator) === "symbol" ? function (obj) { return _typeof2(obj); } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : _typeof2(obj); };
+var isBrowser$1 = (typeof window === "undefined" ? "undefined" : _typeof$3(window)) === "object" && (typeof document === "undefined" ? "undefined" : _typeof$3(document)) === 'object' && document.nodeType === 9;
+function _typeof$2(o) {
     "@babel/helpers - typeof";
-    return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$1(o);
+    return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$2(o);
 }
-function toPrimitive(t, r) { if ("object" != _typeof$1(t) || !t)
+function toPrimitive$1(t, r) { if ("object" != _typeof$2(t) || !t)
     return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) {
     var i = e.call(t, r);
-    if ("object" != _typeof$1(i))
+    if ("object" != _typeof$2(i))
         return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
 } return String(t); }
-function toPropertyKey(t) { var i = toPrimitive(t, "string"); return "symbol" == _typeof$1(i) ? i : String(i); }
+function toPropertyKey$1(t) { var i = toPrimitive$1(t, "string"); return "symbol" == _typeof$2(i) ? i : String(i); }
 function _defineProperties$1(target, props) { for (var i = 0; i < props.length; i++) {
     var descriptor = props[i];
     descriptor.enumerable = descriptor.enumerable || false;
     descriptor.configurable = true;
     if ("value" in descriptor)
         descriptor.writable = true;
-    Object.defineProperty(target, toPropertyKey(descriptor.key), descriptor);
+    Object.defineProperty(target, toPropertyKey$1(descriptor.key), descriptor);
 } }
 function _createClass$1(Constructor, protoProps, staticProps) { if (protoProps)
     _defineProperties$1(Constructor.prototype, protoProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
@@ -6136,21 +6148,21 @@ function defaultUnit(options) { if (options === void 0) {
     return style; for (var prop in style) {
     style[prop] = iterate(prop, style[prop], camelCasedOptions);
 } return style; } function onChangeValue(value, prop) { return iterate(prop, value, camelCasedOptions); } return { onProcessStyle: onProcessStyle, onChangeValue: onChangeValue }; }
-function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length)
+function _arrayLikeToArray$2(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; }
 function _arrayWithoutHoles$1(arr) { if (Array.isArray(arr))
-    return _arrayLikeToArray$1(arr); }
+    return _arrayLikeToArray$2(arr); }
 function _iterableToArray$1(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null)
     return Array.from(iter); }
-function _unsupportedIterableToArray$1(o, minLen) { if (!o)
+function _unsupportedIterableToArray$2(o, minLen) { if (!o)
     return; if (typeof o === "string")
-    return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor)
+    return _arrayLikeToArray$2(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$1(o, minLen); }
+    return _arrayLikeToArray$2(o, minLen); }
 function _nonIterableSpread$1() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _toConsumableArray$1(arr) { return _arrayWithoutHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread$1(); }
+function _toConsumableArray$1(arr) { return _arrayWithoutHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$2(arr) || _nonIterableSpread$1(); }
 var js = '';
 var css = '';
 var vendor = '';
@@ -6532,10 +6544,10 @@ function createChainedFunction() { for (var _len = arguments.length, funcs = new
 } return function chainedFunction() { for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
     args[_key2] = arguments[_key2];
 } acc.apply(this, args); func.apply(this, args); }; }, function () { }); }
-var styles$J = function styles(theme) { return { root: { userSelect: 'none', width: '1em', height: '1em', display: 'inline-block', fill: 'currentColor', flexShrink: 0, fontSize: theme.typography.pxToRem(24), transition: theme.transitions.create('fill', { duration: theme.transitions.duration.shorter }) }, colorPrimary: { color: theme.palette.primary.main }, colorSecondary: { color: theme.palette.secondary.main }, colorAction: { color: theme.palette.action.active }, colorError: { color: theme.palette.error.main }, colorDisabled: { color: theme.palette.action.disabled }, fontSizeInherit: { fontSize: 'inherit' }, fontSizeSmall: { fontSize: theme.typography.pxToRem(20) }, fontSizeLarge: { fontSize: theme.typography.pxToRem(35) } }; };
+var styles$Z = function styles(theme) { return { root: { userSelect: 'none', width: '1em', height: '1em', display: 'inline-block', fill: 'currentColor', flexShrink: 0, fontSize: theme.typography.pxToRem(24), transition: theme.transitions.create('fill', { duration: theme.transitions.duration.shorter }) }, colorPrimary: { color: theme.palette.primary.main }, colorSecondary: { color: theme.palette.secondary.main }, colorAction: { color: theme.palette.action.active }, colorError: { color: theme.palette.error.main }, colorDisabled: { color: theme.palette.action.disabled }, fontSizeInherit: { fontSize: 'inherit' }, fontSizeSmall: { fontSize: theme.typography.pxToRem(20) }, fontSizeLarge: { fontSize: theme.typography.pxToRem(35) } }; };
 var SvgIcon = /*#__PURE__*/ N$1(function SvgIcon(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'inherit' : _props$color, _props$component = props.component, Component = _props$component === void 0 ? 'svg' : _props$component, _props$fontSize = props.fontSize, fontSize = _props$fontSize === void 0 ? 'medium' : _props$fontSize, htmlColor = props.htmlColor, titleAccess = props.titleAccess, _props$viewBox = props.viewBox, viewBox = _props$viewBox === void 0 ? '0 0 24 24' : _props$viewBox, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "color", "component", "fontSize", "htmlColor", "titleAccess", "viewBox"]); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, color !== 'inherit' && classes["color".concat(capitalize(color))], fontSize !== 'default' && fontSize !== 'medium' && classes["fontSize".concat(capitalize(fontSize))]), focusable: "false", viewBox: viewBox, color: htmlColor, "aria-hidden": titleAccess ? undefined : true, role: titleAccess ? 'img' : undefined, ref: ref }, other), children, titleAccess ? /*#__PURE__*/ y$3("title", null, titleAccess) : null); });
 SvgIcon.muiName = 'SvgIcon';
-var SvgIcon$1 = withStyles(styles$J, { name: 'MuiSvgIcon' })(SvgIcon);
+var SvgIcon$1 = withStyles(styles$Z, { name: 'MuiSvgIcon' })(SvgIcon);
 function createSvgIcon$1(path, displayName) { var Component = function Component(props, ref) { return /*#__PURE__*/ wn.createElement(SvgIcon$1, _extends$4({ ref: ref }, props), path); }; Component.muiName = SvgIcon$1.muiName; return /*#__PURE__*/ wn.memo(/*#__PURE__*/ wn.forwardRef(Component)); }
 function debounce$1(func) { var wait = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 166; var timeout; function debounced() { for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
@@ -6599,22 +6611,22 @@ function useIsFocusVisible() { var ref = T$2(function (instance) { var node = vn
     prepare(node.ownerDocument);
 } }, []); return { isFocusVisible: isFocusVisible, onBlurVisible: handleBlurVisible, ref: ref }; }
 var utils = /*#__PURE__*/ Object.freeze({ __proto__: null, capitalize: capitalize, createChainedFunction: createChainedFunction, createSvgIcon: createSvgIcon$1, debounce: debounce$1, deprecatedPropType: deprecatedPropType, isMuiElement: isMuiElement, ownerDocument: ownerDocument, ownerWindow: ownerWindow, requirePropFactory: requirePropFactory, setRef: setRef, unstable_useId: useId, unsupportedProp: unsupportedProp, useControlled: useControlled, useEventCallback: useEventCallback, useForkRef: useForkRef, useIsFocusVisible: useIsFocusVisible });
-function _arrayWithHoles(arr) { if (Array.isArray(arr))
+function _arrayWithHoles$1(arr) { if (Array.isArray(arr))
     return arr; }
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null)
     return Array.from(iter); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length)
+function _arrayLikeToArray$1(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; }
-function _unsupportedIterableToArray(o, minLen) { if (!o)
+function _unsupportedIterableToArray$1(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)
+    return _arrayLikeToArray$1(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 _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _toArray(arr) { return _arrayWithHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableRest(); }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) {
+    return _arrayLikeToArray$1(o, minLen); }
+function _nonIterableRest$1() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _toArray(arr) { return _arrayWithHoles$1(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableRest$1(); }
+function _iterableToArrayLimit$1(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) {
     var e, n, i, u, a = [], f = !0, o = !1;
     try {
         if (i = (t = t.call(r)).next, 0 === l)
@@ -6638,7 +6650,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
     }
     return a;
 } }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _slicedToArray$1(arr, i) { return _arrayWithHoles$1(arr) || _iterableToArrayLimit$1(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest$1(); }
 var config = { disabled: false };
 var TransitionGroupContext = /*#__PURE__*/ wn.createContext(null);
 var forceReflow = function forceReflow(node) { return node.scrollTop; };
@@ -6781,9 +6793,9 @@ TransitionGroup.propTypes = {};
 TransitionGroup.defaultProps = defaultProps;
 var reflow = function reflow(node) { return node.scrollTop; };
 function getTransitionProps(props, options) { var timeout = props.timeout, _props$style = props.style, style = _props$style === void 0 ? {} : _props$style; return { duration: style.transitionDuration || typeof timeout === 'number' ? timeout : timeout[options.mode] || 0, delay: style.transitionDelay }; }
-var styles$I = function styles(theme) { return { root: { height: 0, overflow: 'hidden', transition: theme.transitions.create('height') }, entered: { height: 'auto', overflow: 'visible' }, hidden: { visibility: 'hidden' }, wrapper: { display: 'flex' }, wrapperInner: { width: '100%' } }; };
+var styles$Y = function styles(theme) { return { root: { height: 0, overflow: 'hidden', transition: theme.transitions.create('height') }, entered: { height: 'auto', overflow: 'visible' }, hidden: { visibility: 'hidden' }, wrapper: { display: 'flex' }, wrapperInner: { width: '100%' } }; };
 var Collapse = /*#__PURE__*/ N$1(function Collapse(props, ref) { var children = props.children, classes = props.classes, className = props.className, collapsedHeight = props.collapsedHeight, _props$collapsedSize = props.collapsedSize, collapsedSizeProp = _props$collapsedSize === void 0 ? '0px' : _props$collapsedSize, _props$component = props.component, Component = _props$component === void 0 ? 'div' : _props$component, _props$disableStrictM = props.disableStrictModeCompat, disableStrictModeCompat = _props$disableStrictM === void 0 ? false : _props$disableStrictM, inProp = props["in"], onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, style = props.style, _props$timeout = props.timeout, timeout = _props$timeout === void 0 ? duration.standard : _props$timeout, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Transition : _props$TransitionComp, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "collapsedHeight", "collapsedSize", "component", "disableStrictModeCompat", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"]); var theme = useTheme(); var timer = _$1(); var wrapperRef = _$1(null); var autoTransitionDuration = _$1(); var collapsedSize = typeof (collapsedHeight || collapsedSizeProp) === 'number' ? "".concat(collapsedHeight || collapsedSizeProp, "px") : collapsedHeight || collapsedSizeProp; p$3(function () { return function () { clearTimeout(timer.current); }; }, []); var enableStrictModeCompat = theme.unstable_strictMode && !disableStrictModeCompat; var nodeRef = _$1(null); var handleRef = useForkRef(ref, enableStrictModeCompat ? nodeRef : undefined); var normalizedTransitionCallback = function normalizedTransitionCallback(callback) { return function (nodeOrAppearing, maybeAppearing) { if (callback) {
-    var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], _ref2 = _slicedToArray(_ref, 2), node = _ref2[0], isAppearing = _ref2[1];
+    var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], _ref2 = _slicedToArray$1(_ref, 2), node = _ref2[0], isAppearing = _ref2[1];
     if (isAppearing === undefined) {
         callback(node);
     }
@@ -6818,23 +6830,23 @@ else {
     timer.current = setTimeout(next, autoTransitionDuration.current || 0);
 } }; return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ "in": inProp, onEnter: handleEnter, onEntered: handleEntered, onEntering: handleEntering, onExit: handleExit, onExited: handleExited, onExiting: handleExiting, addEndListener: addEndListener, nodeRef: enableStrictModeCompat ? nodeRef : undefined, timeout: timeout === 'auto' ? null : timeout }, other), function (state, childProps) { return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, classes.container, className, { 'entered': classes.entered, 'exited': !inProp && collapsedSize === '0px' && classes.hidden }[state]), style: _extends$4({ minHeight: collapsedSize }, style), ref: handleRef }, childProps), /*#__PURE__*/ y$3("div", { className: classes.wrapper, ref: wrapperRef }, /*#__PURE__*/ y$3("div", { className: classes.wrapperInner }, children))); }); });
 Collapse.muiSupportAuto = true;
-var Collapse$1 = withStyles(styles$I, { name: 'MuiCollapse' })(Collapse);
-var styles$H = function styles(theme) { var elevations = {}; theme.shadows.forEach(function (shadow, index) { elevations["elevation".concat(index)] = { boxShadow: shadow }; }); return _extends$4({ root: { backgroundColor: theme.palette.background.paper, color: theme.palette.text.primary, transition: theme.transitions.create('box-shadow') }, rounded: { borderRadius: theme.shape.borderRadius }, outlined: { border: "1px solid ".concat(theme.palette.divider) } }, elevations); };
+var Collapse$1 = withStyles(styles$Y, { name: 'MuiCollapse' })(Collapse);
+var styles$X = function styles(theme) { var elevations = {}; theme.shadows.forEach(function (shadow, index) { elevations["elevation".concat(index)] = { boxShadow: shadow }; }); return _extends$4({ root: { backgroundColor: theme.palette.background.paper, color: theme.palette.text.primary, transition: theme.transitions.create('box-shadow') }, rounded: { borderRadius: theme.shape.borderRadius }, outlined: { border: "1px solid ".concat(theme.palette.divider) } }, elevations); };
 var Paper = /*#__PURE__*/ N$1(function Paper(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? 'div' : _props$component, _props$square = props.square, square = _props$square === void 0 ? false : _props$square, _props$elevation = props.elevation, elevation = _props$elevation === void 0 ? 1 : _props$elevation, _props$variant = props.variant, variant = _props$variant === void 0 ? 'elevation' : _props$variant, other = _objectWithoutProperties$2(props, ["classes", "className", "component", "square", "elevation", "variant"]); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, variant === 'outlined' ? classes.outlined : classes["elevation".concat(elevation)], !square && classes.rounded), ref: ref }, other)); });
-var Paper$1 = withStyles(styles$H, { name: 'MuiPaper' })(Paper);
+var Paper$1 = withStyles(styles$X, { name: 'MuiPaper' })(Paper);
 var AccordionContext = /*#__PURE__*/ F$4({});
-var styles$G = function styles(theme) { var transition = { duration: theme.transitions.duration.shortest }; return { root: { position: 'relative', transition: theme.transitions.create(['margin'], transition), '&:before': { position: 'absolute', left: 0, top: -1, right: 0, height: 1, content: '""', opacity: 1, backgroundColor: theme.palette.divider, transition: theme.transitions.create(['opacity', 'background-color'], transition) }, '&:first-child': { '&:before': { display: 'none' } }, '&$expanded': { margin: '16px 0', '&:first-child': { marginTop: 0 }, '&:last-child': { marginBottom: 0 }, '&:before': { opacity: 0 } }, '&$expanded + &': { '&:before': { display: 'none' } }, '&$disabled': { backgroundColor: theme.palette.action.disabledBackground } }, rounded: { borderRadius: 0, '&:first-child': { borderTopLeftRadius: theme.shape.borderRadius, borderTopRightRadius: theme.shape.borderRadius }, '&:last-child': { borderBottomLeftRadius: theme.shape.borderRadius, borderBottomRightRadius: theme.shape.borderRadius, '@supports (-ms-ime-align: auto)': { borderBottomLeftRadius: 0, borderBottomRightRadius: 0 } } }, expanded: {}, disabled: {} }; };
-var Accordion$1 = /*#__PURE__*/ N$1(function Accordion(props, ref) { var childrenProp = props.children, classes = props.classes, className = props.className, _props$defaultExpande = props.defaultExpanded, defaultExpanded = _props$defaultExpande === void 0 ? false : _props$defaultExpande, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, expandedProp = props.expanded, onChange = props.onChange, _props$square = props.square, square = _props$square === void 0 ? false : _props$square, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Collapse$1 : _props$TransitionComp, TransitionProps = props.TransitionProps, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "defaultExpanded", "disabled", "expanded", "onChange", "square", "TransitionComponent", "TransitionProps"]); var _useControlled = useControlled({ controlled: expandedProp, "default": defaultExpanded, name: 'Accordion', state: 'expanded' }), _useControlled2 = _slicedToArray(_useControlled, 2), expanded = _useControlled2[0], setExpandedState = _useControlled2[1]; var handleChange = T$2(function (event) { setExpandedState(!expanded); if (onChange) {
+var styles$W = function styles(theme) { var transition = { duration: theme.transitions.duration.shortest }; return { root: { position: 'relative', transition: theme.transitions.create(['margin'], transition), '&:before': { position: 'absolute', left: 0, top: -1, right: 0, height: 1, content: '""', opacity: 1, backgroundColor: theme.palette.divider, transition: theme.transitions.create(['opacity', 'background-color'], transition) }, '&:first-child': { '&:before': { display: 'none' } }, '&$expanded': { margin: '16px 0', '&:first-child': { marginTop: 0 }, '&:last-child': { marginBottom: 0 }, '&:before': { opacity: 0 } }, '&$expanded + &': { '&:before': { display: 'none' } }, '&$disabled': { backgroundColor: theme.palette.action.disabledBackground } }, rounded: { borderRadius: 0, '&:first-child': { borderTopLeftRadius: theme.shape.borderRadius, borderTopRightRadius: theme.shape.borderRadius }, '&:last-child': { borderBottomLeftRadius: theme.shape.borderRadius, borderBottomRightRadius: theme.shape.borderRadius, '@supports (-ms-ime-align: auto)': { borderBottomLeftRadius: 0, borderBottomRightRadius: 0 } } }, expanded: {}, disabled: {} }; };
+var Accordion$1 = /*#__PURE__*/ N$1(function Accordion(props, ref) { var childrenProp = props.children, classes = props.classes, className = props.className, _props$defaultExpande = props.defaultExpanded, defaultExpanded = _props$defaultExpande === void 0 ? false : _props$defaultExpande, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, expandedProp = props.expanded, onChange = props.onChange, _props$square = props.square, square = _props$square === void 0 ? false : _props$square, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Collapse$1 : _props$TransitionComp, TransitionProps = props.TransitionProps, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "defaultExpanded", "disabled", "expanded", "onChange", "square", "TransitionComponent", "TransitionProps"]); var _useControlled = useControlled({ controlled: expandedProp, "default": defaultExpanded, name: 'Accordion', state: 'expanded' }), _useControlled2 = _slicedToArray$1(_useControlled, 2), expanded = _useControlled2[0], setExpandedState = _useControlled2[1]; var handleChange = T$2(function (event) { setExpandedState(!expanded); if (onChange) {
     onChange(event, !expanded);
 } }, [expanded, onChange, setExpandedState]); var _React$Children$toArr = A$3.toArray(childrenProp), _React$Children$toArr2 = _toArray(_React$Children$toArr), summary = _React$Children$toArr2[0], children = _React$Children$toArr2.slice(1); var contextValue = F$3(function () { return { expanded: expanded, disabled: disabled, toggle: handleChange }; }, [expanded, disabled, handleChange]); return /*#__PURE__*/ y$3(Paper$1, _extends$4({ className: clsx(classes.root, className, expanded && classes.expanded, disabled && classes.disabled, !square && classes.rounded), ref: ref, square: square }, other), /*#__PURE__*/ y$3(AccordionContext.Provider, { value: contextValue }, summary), /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ "in": expanded, timeout: "auto" }, TransitionProps), /*#__PURE__*/ y$3("div", { "aria-labelledby": summary.props.id, id: summary.props['aria-controls'], role: "region" }, children))); });
-var MUIAccordion = withStyles(styles$G, { name: 'MuiAccordion' })(Accordion$1);
-var styles$F = function styles(theme) { return { root: { display: 'flex', padding: theme.spacing(1, 2, 2) } }; };
+var MUIAccordion = withStyles(styles$W, { name: 'MuiAccordion' })(Accordion$1);
+var styles$V = function styles(theme) { return { root: { display: 'flex', padding: theme.spacing(1, 2, 2) } }; };
 var AccordionDetails$1 = /*#__PURE__*/ N$1(function AccordionDetails(props, ref) { var classes = props.classes, className = props.className, other = _objectWithoutProperties$2(props, ["classes", "className"]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className), ref: ref }, other)); });
-var MUIAccordionDetails = withStyles(styles$F, { name: 'MuiAccordionDetails' })(AccordionDetails$1);
+var MUIAccordionDetails = withStyles(styles$V, { name: 'MuiAccordionDetails' })(AccordionDetails$1);
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr))
-    return _arrayLikeToArray(arr); }
+    return _arrayLikeToArray$1(arr); }
 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."); }
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread(); }
 var useEnhancedEffect$6 = typeof window === 'undefined' ? p$3 : y$2;
 function Ripple(props) { var classes = props.classes, _props$pulsate = props.pulsate, pulsate = _props$pulsate === void 0 ? false : _props$pulsate, rippleX = props.rippleX, rippleY = props.rippleY, rippleSize = props.rippleSize, inProp = props["in"], _props$onExited = props.onExited, onExited = _props$onExited === void 0 ? function () { } : _props$onExited, timeout = props.timeout; var _React$useState = h$4(false), leaving = _React$useState[0], setLeaving = _React$useState[1]; var rippleClassName = clsx(classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate); var rippleStyles = { width: rippleSize, height: rippleSize, top: -(rippleSize / 2) + rippleY, left: -(rippleSize / 2) + rippleX }; var childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate); var handleExited = useEventCallback(onExited); useEnhancedEffect$6(function () { if (!inProp) {
     setLeaving(true);
@@ -6843,7 +6855,7 @@ function Ripple(props) { var classes = props.classes, _props$pulsate = props.pul
 } return undefined; }, [handleExited, inProp, timeout]); return /*#__PURE__*/ y$3("span", { className: rippleClassName, style: rippleStyles }, /*#__PURE__*/ y$3("span", { className: childClassName })); }
 var DURATION = 550;
 var DELAY_RIPPLE = 80;
-var styles$E = function styles(theme) { return { root: { overflow: 'hidden', pointerEvents: 'none', position: 'absolute', zIndex: 0, top: 0, right: 0, bottom: 0, left: 0, borderRadius: 'inherit' }, ripple: { opacity: 0, position: 'absolute' }, rippleVisible: { opacity: 0.3, transform: 'scale(1)', animation: "$enter ".concat(DURATION, "ms ").concat(theme.transitions.easing.easeInOut) }, ripplePulsate: { animationDuration: "".concat(theme.transitions.duration.shorter, "ms") }, child: { opacity: 1, display: 'block', width: '100%', height: '100%', borderRadius: '50%', backgroundColor: 'currentColor' }, childLeaving: { opacity: 0, animation: "$exit ".concat(DURATION, "ms ").concat(theme.transitions.easing.easeInOut) }, childPulsate: { position: 'absolute', left: 0, top: 0, animation: "$pulsate 2500ms ".concat(theme.transitions.easing.easeInOut, " 200ms infinite") }, '@keyframes enter': { '0%': { transform: 'scale(0)', opacity: 0.1 }, '100%': { transform: 'scale(1)', opacity: 0.3 } }, '@keyframes exit': { '0%': { opacity: 1 }, '100%': { opacity: 0 } }, '@keyframes pulsate': { '0%': { transform: 'scale(1)' }, '50%': { transform: 'scale(0.92)' }, '100%': { transform: 'scale(1)' } } }; };
+var styles$U = function styles(theme) { return { root: { overflow: 'hidden', pointerEvents: 'none', position: 'absolute', zIndex: 0, top: 0, right: 0, bottom: 0, left: 0, borderRadius: 'inherit' }, ripple: { opacity: 0, position: 'absolute' }, rippleVisible: { opacity: 0.3, transform: 'scale(1)', animation: "$enter ".concat(DURATION, "ms ").concat(theme.transitions.easing.easeInOut) }, ripplePulsate: { animationDuration: "".concat(theme.transitions.duration.shorter, "ms") }, child: { opacity: 1, display: 'block', width: '100%', height: '100%', borderRadius: '50%', backgroundColor: 'currentColor' }, childLeaving: { opacity: 0, animation: "$exit ".concat(DURATION, "ms ").concat(theme.transitions.easing.easeInOut) }, childPulsate: { position: 'absolute', left: 0, top: 0, animation: "$pulsate 2500ms ".concat(theme.transitions.easing.easeInOut, " 200ms infinite") }, '@keyframes enter': { '0%': { transform: 'scale(0)', opacity: 0.1 }, '100%': { transform: 'scale(1)', opacity: 0.3 } }, '@keyframes exit': { '0%': { opacity: 1 }, '100%': { opacity: 0 } }, '@keyframes pulsate': { '0%': { transform: 'scale(1)' }, '50%': { transform: 'scale(0.92)' }, '100%': { transform: 'scale(1)' } } }; };
 var TouchRipple = /*#__PURE__*/ N$1(function TouchRipple(props, ref) { var _props$center = props.center, centerProp = _props$center === void 0 ? false : _props$center, classes = props.classes, className = props.className, other = _objectWithoutProperties$2(props, ["center", "classes", "className"]); var _React$useState = h$4([]), ripples = _React$useState[0], setRipples = _React$useState[1]; var nextKey = _$1(0); var rippleCallback = _$1(null); p$3(function () { if (rippleCallback.current) {
     rippleCallback.current();
     rippleCallback.current = null;
@@ -6890,8 +6902,8 @@ else {
 } startTimerCommit.current = null; setRipples(function (oldRipples) { if (oldRipples.length > 0) {
     return oldRipples.slice(1);
 } return oldRipples; }); rippleCallback.current = cb; }, []); A$4(ref, function () { return { pulsate: pulsate, start: start, stop: stop }; }, [pulsate, start, stop]); return /*#__PURE__*/ y$3("span", _extends$4({ className: clsx(classes.root, className), ref: container }, other), /*#__PURE__*/ y$3(TransitionGroup, { component: null, exit: true }, ripples)); });
-var TouchRipple$1 = withStyles(styles$E, { flip: false, name: 'MuiTouchRipple' })(/*#__PURE__*/ w$3(TouchRipple));
-var styles$D = { root: { display: 'inline-flex', alignItems: 'center', justifyContent: 'center', position: 'relative', WebkitTapHighlightColor: 'transparent', backgroundColor: 'transparent', outline: 0, border: 0, margin: 0, borderRadius: 0, padding: 0, cursor: 'pointer', userSelect: 'none', verticalAlign: 'middle', '-moz-appearance': 'none', '-webkit-appearance': 'none', textDecoration: 'none', color: 'inherit', '&::-moz-focus-inner': { borderStyle: 'none' }, '&$disabled': { pointerEvents: 'none', cursor: 'default' }, '@media print': { colorAdjust: 'exact' } }, disabled: {}, focusVisible: {} };
+var TouchRipple$1 = withStyles(styles$U, { flip: false, name: 'MuiTouchRipple' })(/*#__PURE__*/ w$3(TouchRipple));
+var styles$T = { root: { display: 'inline-flex', alignItems: 'center', justifyContent: 'center', position: 'relative', WebkitTapHighlightColor: 'transparent', backgroundColor: 'transparent', outline: 0, border: 0, margin: 0, borderRadius: 0, padding: 0, cursor: 'pointer', userSelect: 'none', verticalAlign: 'middle', '-moz-appearance': 'none', '-webkit-appearance': 'none', textDecoration: 'none', color: 'inherit', '&::-moz-focus-inner': { borderStyle: 'none' }, '&$disabled': { pointerEvents: 'none', cursor: 'default' }, '@media print': { colorAdjust: 'exact' } }, disabled: {}, focusVisible: {} };
 var ButtonBase = /*#__PURE__*/ N$1(function ButtonBase(props, ref) { var action = props.action, buttonRefProp = props.buttonRef, _props$centerRipple = props.centerRipple, centerRipple = _props$centerRipple === void 0 ? false : _props$centerRipple, children = props.children, classes = props.classes, className = props.className, _props$component = props.component, component = _props$component === void 0 ? 'button' : _props$component, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, _props$disableRipple = props.disableRipple, disableRipple = _props$disableRipple === void 0 ? false : _props$disableRipple, _props$disableTouchRi = props.disableTouchRipple, disableTouchRipple = _props$disableTouchRi === void 0 ? false : _props$disableTouchRi, _props$focusRipple = props.focusRipple, focusRipple = _props$focusRipple === void 0 ? false : _props$focusRipple, focusVisibleClassName = props.focusVisibleClassName, onBlur = props.onBlur, onClick = props.onClick, onFocus = props.onFocus, onFocusVisible = props.onFocusVisible, onKeyDown = props.onKeyDown, onKeyUp = props.onKeyUp, onMouseDown = props.onMouseDown, onMouseLeave = props.onMouseLeave, onMouseUp = props.onMouseUp, onTouchEnd = props.onTouchEnd, onTouchMove = props.onTouchMove, onTouchStart = props.onTouchStart, onDragLeave = props.onDragLeave, _props$tabIndex = props.tabIndex, tabIndex = _props$tabIndex === void 0 ? 0 : _props$tabIndex, TouchRippleProps = props.TouchRippleProps, _props$type = props.type, type = _props$type === void 0 ? 'button' : _props$type, other = _objectWithoutProperties$2(props, ["action", "buttonRef", "centerRipple", "children", "classes", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "onBlur", "onClick", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "onDragLeave", "tabIndex", "TouchRippleProps", "type"]); var buttonRef = _$1(null); function getButtonNode() { return vn(buttonRef.current); } var rippleRef = _$1(null); var _React$useState = h$4(false), focusVisible = _React$useState[0], setFocusVisible = _React$useState[1]; if (disabled && focusVisible) {
     setFocusVisible(false);
 } var _useIsFocusVisible = useIsFocusVisible(), isFocusVisible = _useIsFocusVisible.isFocusVisible, onBlurVisible = _useIsFocusVisible.onBlurVisible, focusVisibleRef = _useIsFocusVisible.ref; A$4(action, function () { return { focusVisible: function focusVisible() { setFocusVisible(true); buttonRef.current.focus(); } }; }, []); p$3(function () { if (focusVisible && focusRipple && !disableRipple) {
@@ -6951,21 +6963,21 @@ else {
     }
     buttonProps['aria-disabled'] = disabled;
 } var handleUserRef = useForkRef(buttonRefProp, ref); var handleOwnRef = useForkRef(focusVisibleRef, buttonRef); var handleRef = useForkRef(handleUserRef, handleOwnRef); var _React$useState2 = h$4(false), mountedState = _React$useState2[0], setMountedState = _React$useState2[1]; p$3(function () { setMountedState(true); }, []); var enableTouchRipple = mountedState && !disableRipple && !disabled; return /*#__PURE__*/ y$3(ComponentProp, _extends$4({ className: clsx(classes.root, className, focusVisible && [classes.focusVisible, focusVisibleClassName], disabled && classes.disabled), onBlur: handleBlur, onClick: onClick, onFocus: handleFocus, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onMouseDown: handleMouseDown, onMouseLeave: handleMouseLeave, onMouseUp: handleMouseUp, onDragLeave: handleDragLeave, onTouchEnd: handleTouchEnd, onTouchMove: handleTouchMove, onTouchStart: handleTouchStart, ref: handleRef, tabIndex: disabled ? -1 : tabIndex }, buttonProps, other), children, enableTouchRipple ? /*#__PURE__*/ y$3(TouchRipple$1, _extends$4({ ref: rippleRef, center: centerRipple }, TouchRippleProps)) : null); });
-var ButtonBase$1 = withStyles(styles$D, { name: 'MuiButtonBase' })(ButtonBase);
-var styles$C = function styles(theme) { return { root: { textAlign: 'center', flex: '0 0 auto', fontSize: theme.typography.pxToRem(24), padding: 12, borderRadius: '50%', overflow: 'visible', color: theme.palette.action.active, transition: theme.transitions.create('background-color', { duration: theme.transitions.duration.shortest }), '&:hover': { backgroundColor: alpha(theme.palette.action.active, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } }, '&$disabled': { backgroundColor: 'transparent', color: theme.palette.action.disabled } }, edgeStart: { marginLeft: -12, '$sizeSmall&': { marginLeft: -3 } }, edgeEnd: { marginRight: -12, '$sizeSmall&': { marginRight: -3 } }, colorInherit: { color: 'inherit' }, colorPrimary: { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, colorSecondary: { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, disabled: {}, sizeSmall: { padding: 3, fontSize: theme.typography.pxToRem(18) }, label: { width: '100%', display: 'flex', alignItems: 'inherit', justifyContent: 'inherit' } }; };
+var ButtonBase$1 = withStyles(styles$T, { name: 'MuiButtonBase' })(ButtonBase);
+var styles$S = function styles(theme) { return { root: { textAlign: 'center', flex: '0 0 auto', fontSize: theme.typography.pxToRem(24), padding: 12, borderRadius: '50%', overflow: 'visible', color: theme.palette.action.active, transition: theme.transitions.create('background-color', { duration: theme.transitions.duration.shortest }), '&:hover': { backgroundColor: alpha(theme.palette.action.active, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } }, '&$disabled': { backgroundColor: 'transparent', color: theme.palette.action.disabled } }, edgeStart: { marginLeft: -12, '$sizeSmall&': { marginLeft: -3 } }, edgeEnd: { marginRight: -12, '$sizeSmall&': { marginRight: -3 } }, colorInherit: { color: 'inherit' }, colorPrimary: { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, colorSecondary: { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, disabled: {}, sizeSmall: { padding: 3, fontSize: theme.typography.pxToRem(18) }, label: { width: '100%', display: 'flex', alignItems: 'inherit', justifyContent: 'inherit' } }; };
 var IconButton = /*#__PURE__*/ N$1(function IconButton(props, ref) { var _props$edge = props.edge, edge = _props$edge === void 0 ? false : _props$edge, children = props.children, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'default' : _props$color, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, _props$disableFocusRi = props.disableFocusRipple, disableFocusRipple = _props$disableFocusRi === void 0 ? false : _props$disableFocusRi, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, other = _objectWithoutProperties$2(props, ["edge", "children", "classes", "className", "color", "disabled", "disableFocusRipple", "size"]); return /*#__PURE__*/ y$3(ButtonBase$1, _extends$4({ className: clsx(classes.root, className, color !== 'default' && classes["color".concat(capitalize(color))], disabled && classes.disabled, size === "small" && classes["size".concat(capitalize(size))], { 'start': classes.edgeStart, 'end': classes.edgeEnd }[edge]), centerRipple: true, focusRipple: !disableFocusRipple, disabled: disabled, ref: ref }, other), /*#__PURE__*/ y$3("span", { className: classes.label }, children)); });
-var IconButton$1 = withStyles(styles$C, { name: 'MuiIconButton' })(IconButton);
-var styles$B = function styles(theme) { var transition = { duration: theme.transitions.duration.shortest }; return { root: { display: 'flex', minHeight: 8 * 6, transition: theme.transitions.create(['min-height', 'background-color'], transition), padding: theme.spacing(0, 2), '&:hover:not($disabled)': { cursor: 'pointer' }, '&$expanded': { minHeight: 64 }, '&$focused, &$focusVisible': { backgroundColor: theme.palette.action.focus }, '&$disabled': { opacity: theme.palette.action.disabledOpacity } }, expanded: {}, focused: {}, focusVisible: {}, disabled: {}, content: { display: 'flex', flexGrow: 1, transition: theme.transitions.create(['margin'], transition), margin: '12px 0', '&$expanded': { margin: '20px 0' } }, expandIcon: { transform: 'rotate(0deg)', transition: theme.transitions.create('transform', transition), '&:hover': { backgroundColor: 'transparent' }, '&$expanded': { transform: 'rotate(180deg)' } } }; };
+var IconButton$1 = withStyles(styles$S, { name: 'MuiIconButton' })(IconButton);
+var styles$R = function styles(theme) { var transition = { duration: theme.transitions.duration.shortest }; return { root: { display: 'flex', minHeight: 8 * 6, transition: theme.transitions.create(['min-height', 'background-color'], transition), padding: theme.spacing(0, 2), '&:hover:not($disabled)': { cursor: 'pointer' }, '&$expanded': { minHeight: 64 }, '&$focused, &$focusVisible': { backgroundColor: theme.palette.action.focus }, '&$disabled': { opacity: theme.palette.action.disabledOpacity } }, expanded: {}, focused: {}, focusVisible: {}, disabled: {}, content: { display: 'flex', flexGrow: 1, transition: theme.transitions.create(['margin'], transition), margin: '12px 0', '&$expanded': { margin: '20px 0' } }, expandIcon: { transform: 'rotate(0deg)', transition: theme.transitions.create('transform', transition), '&:hover': { backgroundColor: 'transparent' }, '&$expanded': { transform: 'rotate(180deg)' } } }; };
 var AccordionSummary$1 = /*#__PURE__*/ N$1(function AccordionSummary(props, ref) { var children = props.children, classes = props.classes, className = props.className, expandIcon = props.expandIcon, focusVisibleClassName = props.focusVisibleClassName, _props$IconButtonProp = props.IconButtonProps, IconButtonProps = _props$IconButtonProp === void 0 ? {} : _props$IconButtonProp, onClick = props.onClick, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "expandIcon", "focusVisibleClassName", "IconButtonProps", "onClick"]); var _React$useContext = q$5(AccordionContext), _React$useContext$dis = _React$useContext.disabled, disabled = _React$useContext$dis === void 0 ? false : _React$useContext$dis, expanded = _React$useContext.expanded, toggle = _React$useContext.toggle; var handleChange = function handleChange(event) { if (toggle) {
     toggle(event);
 } if (onClick) {
     onClick(event);
 } }; return /*#__PURE__*/ y$3(ButtonBase$1, _extends$4({ focusRipple: false, disableRipple: true, disabled: disabled, component: "div", "aria-expanded": expanded, className: clsx(classes.root, className, disabled && classes.disabled, expanded && classes.expanded), focusVisibleClassName: clsx(classes.focusVisible, classes.focused, focusVisibleClassName), onClick: handleChange, ref: ref }, other), /*#__PURE__*/ y$3("div", { className: clsx(classes.content, expanded && classes.expanded) }, children), expandIcon && /*#__PURE__*/ y$3(IconButton$1, _extends$4({ className: clsx(classes.expandIcon, expanded && classes.expanded), edge: "end", component: "div", tabIndex: null, role: null, "aria-hidden": true }, IconButtonProps), expandIcon)); });
-var MUIAccordionSummary = withStyles(styles$B, { name: 'MuiAccordionSummary' })(AccordionSummary$1);
-var styles$A = { entering: { opacity: 1 }, entered: { opacity: 1 } };
+var MUIAccordionSummary = withStyles(styles$R, { name: 'MuiAccordionSummary' })(AccordionSummary$1);
+var styles$Q = { entering: { opacity: 1 }, entered: { opacity: 1 } };
 var defaultTimeout = { enter: duration.enteringScreen, exit: duration.leavingScreen };
 var Fade = /*#__PURE__*/ N$1(function Fade(props, ref) { var children = props.children, _props$disableStrictM = props.disableStrictModeCompat, disableStrictModeCompat = _props$disableStrictM === void 0 ? false : _props$disableStrictM, inProp = props["in"], onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, style = props.style, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Transition : _props$TransitionComp, _props$timeout = props.timeout, timeout = _props$timeout === void 0 ? defaultTimeout : _props$timeout, other = _objectWithoutProperties$2(props, ["children", "disableStrictModeCompat", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "TransitionComponent", "timeout"]); var theme = useTheme(); var enableStrictModeCompat = theme.unstable_strictMode && !disableStrictModeCompat; var nodeRef = _$1(null); var foreignRef = useForkRef(children.ref, ref); var handleRef = useForkRef(enableStrictModeCompat ? nodeRef : undefined, foreignRef); var normalizedTransitionCallback = function normalizedTransitionCallback(callback) { return function (nodeOrAppearing, maybeAppearing) { if (callback) {
-    var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], _ref2 = _slicedToArray(_ref, 2), node = _ref2[0], isAppearing = _ref2[1];
+    var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], _ref2 = _slicedToArray$1(_ref, 2), node = _ref2[0], isAppearing = _ref2[1];
     if (isAppearing === undefined) {
         callback(node);
     }
@@ -6976,22 +6988,75 @@ var Fade = /*#__PURE__*/ N$1(function Fade(props, ref) { var children = props.ch
     onEnter(node, isAppearing);
 } }); var handleEntered = normalizedTransitionCallback(onEntered); var handleExiting = normalizedTransitionCallback(onExiting); var handleExit = normalizedTransitionCallback(function (node) { var transitionProps = getTransitionProps({ style: style, timeout: timeout }, { mode: 'exit' }); node.style.webkitTransition = theme.transitions.create('opacity', transitionProps); node.style.transition = theme.transitions.create('opacity', transitionProps); if (onExit) {
     onExit(node);
-} }); var handleExited = normalizedTransitionCallback(onExited); return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": inProp, nodeRef: enableStrictModeCompat ? nodeRef : undefined, onEnter: handleEnter, onEntered: handleEntered, onEntering: handleEntering, onExit: handleExit, onExited: handleExited, onExiting: handleExiting, timeout: timeout }, other), function (state, childProps) { return /*#__PURE__*/ sn(children, _extends$4({ style: _extends$4({ opacity: 0, visibility: state === 'exited' && !inProp ? 'hidden' : undefined }, styles$A[state], style, children.props.style), ref: handleRef }, childProps)); }); });
-var styles$z = { root: { zIndex: -1, position: 'fixed', display: 'flex', alignItems: 'center', justifyContent: 'center', right: 0, bottom: 0, top: 0, left: 0, backgroundColor: 'rgba(0, 0, 0, 0.5)', WebkitTapHighlightColor: 'transparent' }, invisible: { backgroundColor: 'transparent' } };
+} }); var handleExited = normalizedTransitionCallback(onExited); return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": inProp, nodeRef: enableStrictModeCompat ? nodeRef : undefined, onEnter: handleEnter, onEntered: handleEntered, onEntering: handleEntering, onExit: handleExit, onExited: handleExited, onExiting: handleExiting, timeout: timeout }, other), function (state, childProps) { return /*#__PURE__*/ sn(children, _extends$4({ style: _extends$4({ opacity: 0, visibility: state === 'exited' && !inProp ? 'hidden' : undefined }, styles$Q[state], style, children.props.style), ref: handleRef }, childProps)); }); });
+var styles$P = { root: { zIndex: -1, position: 'fixed', display: 'flex', alignItems: 'center', justifyContent: 'center', right: 0, bottom: 0, top: 0, left: 0, backgroundColor: 'rgba(0, 0, 0, 0.5)', WebkitTapHighlightColor: 'transparent' }, invisible: { backgroundColor: 'transparent' } };
 var Backdrop = /*#__PURE__*/ N$1(function Backdrop(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$invisible = props.invisible, invisible = _props$invisible === void 0 ? false : _props$invisible, open = props.open, transitionDuration = props.transitionDuration, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Fade : _props$TransitionComp, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "invisible", "open", "transitionDuration", "TransitionComponent"]); return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ "in": open, timeout: transitionDuration }, other), /*#__PURE__*/ y$3("div", { className: clsx(classes.root, className, invisible && classes.invisible), "aria-hidden": true, ref: ref }, children)); });
-var Backdrop$1 = withStyles(styles$z, { name: 'MuiBackdrop' })(Backdrop);
-var styles$y = function styles(theme) { return { root: { margin: 0 }, body2: theme.typography.body2, body1: theme.typography.body1, caption: theme.typography.caption, button: theme.typography.button, h1: theme.typography.h1, h2: theme.typography.h2, h3: theme.typography.h3, h4: theme.typography.h4, h5: theme.typography.h5, h6: theme.typography.h6, subtitle1: theme.typography.subtitle1, subtitle2: theme.typography.subtitle2, overline: theme.typography.overline, srOnly: { position: 'absolute', height: 1, width: 1, overflow: 'hidden' }, alignLeft: { textAlign: 'left' }, alignCenter: { textAlign: 'center' }, alignRight: { textAlign: 'right' }, alignJustify: { textAlign: 'justify' }, noWrap: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, gutterBottom: { marginBottom: '0.35em' }, paragraph: { marginBottom: 16 }, colorInherit: { color: 'inherit' }, colorPrimary: { color: theme.palette.primary.main }, colorSecondary: { color: theme.palette.secondary.main }, colorTextPrimary: { color: theme.palette.text.primary }, colorTextSecondary: { color: theme.palette.text.secondary }, colorError: { color: theme.palette.error.main }, displayInline: { display: 'inline' }, displayBlock: { display: 'block' } }; };
+var Backdrop$1 = withStyles(styles$P, { name: 'MuiBackdrop' })(Backdrop);
+var styles$O = function styles(theme) { return { root: { margin: 0 }, body2: theme.typography.body2, body1: theme.typography.body1, caption: theme.typography.caption, button: theme.typography.button, h1: theme.typography.h1, h2: theme.typography.h2, h3: theme.typography.h3, h4: theme.typography.h4, h5: theme.typography.h5, h6: theme.typography.h6, subtitle1: theme.typography.subtitle1, subtitle2: theme.typography.subtitle2, overline: theme.typography.overline, srOnly: { position: 'absolute', height: 1, width: 1, overflow: 'hidden' }, alignLeft: { textAlign: 'left' }, alignCenter: { textAlign: 'center' }, alignRight: { textAlign: 'right' }, alignJustify: { textAlign: 'justify' }, noWrap: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, gutterBottom: { marginBottom: '0.35em' }, paragraph: { marginBottom: 16 }, colorInherit: { color: 'inherit' }, colorPrimary: { color: theme.palette.primary.main }, colorSecondary: { color: theme.palette.secondary.main }, colorTextPrimary: { color: theme.palette.text.primary }, colorTextSecondary: { color: theme.palette.text.secondary }, colorError: { color: theme.palette.error.main }, displayInline: { display: 'inline' }, displayBlock: { display: 'block' } }; };
 var defaultVariantMapping = { h1: 'h1', h2: 'h2', h3: 'h3', h4: 'h4', h5: 'h5', h6: 'h6', subtitle1: 'h6', subtitle2: 'h6', body1: 'p', body2: 'p' };
 var Typography$1 = /*#__PURE__*/ N$1(function Typography(props, ref) { var _props$align = props.align, align = _props$align === void 0 ? 'inherit' : _props$align, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'initial' : _props$color, component = props.component, _props$display = props.display, display = _props$display === void 0 ? 'initial' : _props$display, _props$gutterBottom = props.gutterBottom, gutterBottom = _props$gutterBottom === void 0 ? false : _props$gutterBottom, _props$noWrap = props.noWrap, noWrap = _props$noWrap === void 0 ? false : _props$noWrap, _props$paragraph = props.paragraph, paragraph = _props$paragraph === void 0 ? false : _props$paragraph, _props$variant = props.variant, variant = _props$variant === void 0 ? 'body1' : _props$variant, _props$variantMapping = props.variantMapping, variantMapping = _props$variantMapping === void 0 ? defaultVariantMapping : _props$variantMapping, other = _objectWithoutProperties$2(props, ["align", "classes", "className", "color", "component", "display", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"]); var Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span'; return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, variant !== 'inherit' && classes[variant], color !== 'initial' && classes["color".concat(capitalize(color))], noWrap && classes.noWrap, gutterBottom && classes.gutterBottom, paragraph && classes.paragraph, align !== 'inherit' && classes["align".concat(capitalize(align))], display !== 'initial' && classes["display".concat(capitalize(display))]), ref: ref }, other)); });
-var MUITypography = withStyles(styles$y, { name: 'MuiTypography' })(Typography$1);
-var styles$x = function styles(theme) { return { root: _extends$4({}, theme.typography.button, { boxSizing: 'border-box', minWidth: 64, padding: '6px 16px', borderRadius: theme.shape.borderRadius, color: theme.palette.text.primary, transition: theme.transitions.create(['background-color', 'box-shadow', 'border'], { duration: theme.transitions.duration["short"] }), '&:hover': { textDecoration: 'none', backgroundColor: alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' }, '&$disabled': { backgroundColor: 'transparent' } }, '&$disabled': { color: theme.palette.action.disabled } }), label: { width: '100%', display: 'inherit', alignItems: 'inherit', justifyContent: 'inherit' }, text: { padding: '6px 8px' }, textPrimary: { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, textSecondary: { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, outlined: { padding: '5px 15px', border: "1px solid ".concat(theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'), '&$disabled': { border: "1px solid ".concat(theme.palette.action.disabledBackground) } }, outlinedPrimary: { color: theme.palette.primary.main, border: "1px solid ".concat(alpha(theme.palette.primary.main, 0.5)), '&:hover': { border: "1px solid ".concat(theme.palette.primary.main), backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, outlinedSecondary: { color: theme.palette.secondary.main, border: "1px solid ".concat(alpha(theme.palette.secondary.main, 0.5)), '&:hover': { border: "1px solid ".concat(theme.palette.secondary.main), backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } }, '&$disabled': { border: "1px solid ".concat(theme.palette.action.disabled) } }, contained: { color: theme.palette.getContrastText(theme.palette.grey[300]), backgroundColor: theme.palette.grey[300], boxShadow: theme.shadows[2], '&:hover': { backgroundColor: theme.palette.grey.A100, boxShadow: theme.shadows[4], '@media (hover: none)': { boxShadow: theme.shadows[2], backgroundColor: theme.palette.grey[300] }, '&$disabled': { backgroundColor: theme.palette.action.disabledBackground } }, '&$focusVisible': { boxShadow: theme.shadows[6] }, '&:active': { boxShadow: theme.shadows[8] }, '&$disabled': { color: theme.palette.action.disabled, boxShadow: theme.shadows[0], backgroundColor: theme.palette.action.disabledBackground } }, containedPrimary: { color: theme.palette.primary.contrastText, backgroundColor: theme.palette.primary.main, '&:hover': { backgroundColor: theme.palette.primary.dark, '@media (hover: none)': { backgroundColor: theme.palette.primary.main } } }, containedSecondary: { color: theme.palette.secondary.contrastText, backgroundColor: theme.palette.secondary.main, '&:hover': { backgroundColor: theme.palette.secondary.dark, '@media (hover: none)': { backgroundColor: theme.palette.secondary.main } } }, disableElevation: { boxShadow: 'none', '&:hover': { boxShadow: 'none' }, '&$focusVisible': { boxShadow: 'none' }, '&:active': { boxShadow: 'none' }, '&$disabled': { boxShadow: 'none' } }, focusVisible: {}, disabled: {}, colorInherit: { color: 'inherit', borderColor: 'currentColor' }, textSizeSmall: { padding: '4px 5px', fontSize: theme.typography.pxToRem(13) }, textSizeLarge: { padding: '8px 11px', fontSize: theme.typography.pxToRem(15) }, outlinedSizeSmall: { padding: '3px 9px', fontSize: theme.typography.pxToRem(13) }, outlinedSizeLarge: { padding: '7px 21px', fontSize: theme.typography.pxToRem(15) }, containedSizeSmall: { padding: '4px 10px', fontSize: theme.typography.pxToRem(13) }, containedSizeLarge: { padding: '8px 22px', fontSize: theme.typography.pxToRem(15) }, sizeSmall: {}, sizeLarge: {}, fullWidth: { width: '100%' }, startIcon: { display: 'inherit', marginRight: 8, marginLeft: -4, '&$iconSizeSmall': { marginLeft: -2 } }, endIcon: { display: 'inherit', marginRight: -4, marginLeft: 8, '&$iconSizeSmall': { marginRight: -2 } }, iconSizeSmall: { '& > *:first-child': { fontSize: 18 } }, iconSizeMedium: { '& > *:first-child': { fontSize: 20 } }, iconSizeLarge: { '& > *:first-child': { fontSize: 22 } } }; };
+var Typography$2 = withStyles(styles$O, { name: 'MuiTypography' })(Typography$1);
+var styles$N = function styles(theme) { return { root: _extends$4({}, theme.typography.button, { boxSizing: 'border-box', minWidth: 64, padding: '6px 16px', borderRadius: theme.shape.borderRadius, color: theme.palette.text.primary, transition: theme.transitions.create(['background-color', 'box-shadow', 'border'], { duration: theme.transitions.duration["short"] }), '&:hover': { textDecoration: 'none', backgroundColor: alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' }, '&$disabled': { backgroundColor: 'transparent' } }, '&$disabled': { color: theme.palette.action.disabled } }), label: { width: '100%', display: 'inherit', alignItems: 'inherit', justifyContent: 'inherit' }, text: { padding: '6px 8px' }, textPrimary: { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, textSecondary: { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, outlined: { padding: '5px 15px', border: "1px solid ".concat(theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'), '&$disabled': { border: "1px solid ".concat(theme.palette.action.disabledBackground) } }, outlinedPrimary: { color: theme.palette.primary.main, border: "1px solid ".concat(alpha(theme.palette.primary.main, 0.5)), '&:hover': { border: "1px solid ".concat(theme.palette.primary.main), backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, outlinedSecondary: { color: theme.palette.secondary.main, border: "1px solid ".concat(alpha(theme.palette.secondary.main, 0.5)), '&:hover': { border: "1px solid ".concat(theme.palette.secondary.main), backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } }, '&$disabled': { border: "1px solid ".concat(theme.palette.action.disabled) } }, contained: { color: theme.palette.getContrastText(theme.palette.grey[300]), backgroundColor: theme.palette.grey[300], boxShadow: theme.shadows[2], '&:hover': { backgroundColor: theme.palette.grey.A100, boxShadow: theme.shadows[4], '@media (hover: none)': { boxShadow: theme.shadows[2], backgroundColor: theme.palette.grey[300] }, '&$disabled': { backgroundColor: theme.palette.action.disabledBackground } }, '&$focusVisible': { boxShadow: theme.shadows[6] }, '&:active': { boxShadow: theme.shadows[8] }, '&$disabled': { color: theme.palette.action.disabled, boxShadow: theme.shadows[0], backgroundColor: theme.palette.action.disabledBackground } }, containedPrimary: { color: theme.palette.primary.contrastText, backgroundColor: theme.palette.primary.main, '&:hover': { backgroundColor: theme.palette.primary.dark, '@media (hover: none)': { backgroundColor: theme.palette.primary.main } } }, containedSecondary: { color: theme.palette.secondary.contrastText, backgroundColor: theme.palette.secondary.main, '&:hover': { backgroundColor: theme.palette.secondary.dark, '@media (hover: none)': { backgroundColor: theme.palette.secondary.main } } }, disableElevation: { boxShadow: 'none', '&:hover': { boxShadow: 'none' }, '&$focusVisible': { boxShadow: 'none' }, '&:active': { boxShadow: 'none' }, '&$disabled': { boxShadow: 'none' } }, focusVisible: {}, disabled: {}, colorInherit: { color: 'inherit', borderColor: 'currentColor' }, textSizeSmall: { padding: '4px 5px', fontSize: theme.typography.pxToRem(13) }, textSizeLarge: { padding: '8px 11px', fontSize: theme.typography.pxToRem(15) }, outlinedSizeSmall: { padding: '3px 9px', fontSize: theme.typography.pxToRem(13) }, outlinedSizeLarge: { padding: '7px 21px', fontSize: theme.typography.pxToRem(15) }, containedSizeSmall: { padding: '4px 10px', fontSize: theme.typography.pxToRem(13) }, containedSizeLarge: { padding: '8px 22px', fontSize: theme.typography.pxToRem(15) }, sizeSmall: {}, sizeLarge: {}, fullWidth: { width: '100%' }, startIcon: { display: 'inherit', marginRight: 8, marginLeft: -4, '&$iconSizeSmall': { marginLeft: -2 } }, endIcon: { display: 'inherit', marginRight: -4, marginLeft: 8, '&$iconSizeSmall': { marginRight: -2 } }, iconSizeSmall: { '& > *:first-child': { fontSize: 18 } }, iconSizeMedium: { '& > *:first-child': { fontSize: 20 } }, iconSizeLarge: { '& > *:first-child': { fontSize: 22 } } }; };
 var Button$1 = /*#__PURE__*/ N$1(function Button(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'default' : _props$color, _props$component = props.component, component = _props$component === void 0 ? 'button' : _props$component, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, _props$disableElevati = props.disableElevation, disableElevation = _props$disableElevati === void 0 ? false : _props$disableElevati, _props$disableFocusRi = props.disableFocusRipple, disableFocusRipple = _props$disableFocusRi === void 0 ? false : _props$disableFocusRi, endIconProp = props.endIcon, focusVisibleClassName = props.focusVisibleClassName, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, startIconProp = props.startIcon, _props$type = props.type, type = _props$type === void 0 ? 'button' : _props$type, _props$variant = props.variant, variant = _props$variant === void 0 ? 'text' : _props$variant, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "color", "component", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"]); var startIcon = startIconProp && /*#__PURE__*/ y$3("span", { className: clsx(classes.startIcon, classes["iconSize".concat(capitalize(size))]) }, startIconProp); var endIcon = endIconProp && /*#__PURE__*/ y$3("span", { className: clsx(classes.endIcon, classes["iconSize".concat(capitalize(size))]) }, endIconProp); return /*#__PURE__*/ y$3(ButtonBase$1, _extends$4({ className: clsx(classes.root, classes[variant], className, color === 'inherit' ? classes.colorInherit : color !== 'default' && classes["".concat(variant).concat(capitalize(color))], size !== 'medium' && [classes["".concat(variant, "Size").concat(capitalize(size))], classes["size".concat(capitalize(size))]], disableElevation && classes.disableElevation, disabled && classes.disabled, fullWidth && classes.fullWidth), component: component, disabled: disabled, focusRipple: !disableFocusRipple, focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName), ref: ref, type: type }, other), /*#__PURE__*/ y$3("span", { className: classes.label }, startIcon, children, endIcon)); });
-var MUIButton = withStyles(styles$x, { name: 'MuiButton' })(Button$1);
+var MUIButton = withStyles(styles$N, { name: 'MuiButton' })(Button$1);
 var FormControlContext = /*#__PURE__*/ F$4();
 function useFormControl$1() { return q$5(FormControlContext); }
 function useFormControl() { return q$5(FormControlContext); }
+var styles$M = { root: { padding: 9 }, checked: {}, disabled: {}, input: { cursor: 'inherit', position: 'absolute', opacity: 0, width: '100%', height: '100%', top: 0, left: 0, margin: 0, padding: 0, zIndex: 1 } };
+var SwitchBase = /*#__PURE__*/ N$1(function SwitchBase(props, ref) { var autoFocus = props.autoFocus, checkedProp = props.checked, checkedIcon = props.checkedIcon, classes = props.classes, className = props.className, defaultChecked = props.defaultChecked, disabledProp = props.disabled, icon = props.icon, id = props.id, inputProps = props.inputProps, inputRef = props.inputRef, name = props.name, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, readOnly = props.readOnly, required = props.required, tabIndex = props.tabIndex, type = props.type, value = props.value, other = _objectWithoutProperties$2(props, ["autoFocus", "checked", "checkedIcon", "classes", "className", "defaultChecked", "disabled", "icon", "id", "inputProps", "inputRef", "name", "onBlur", "onChange", "onFocus", "readOnly", "required", "tabIndex", "type", "value"]); var _useControlled = useControlled({ controlled: checkedProp, "default": Boolean(defaultChecked), name: 'SwitchBase', state: 'checked' }), _useControlled2 = _slicedToArray$1(_useControlled, 2), checked = _useControlled2[0], setCheckedState = _useControlled2[1]; var muiFormControl = useFormControl(); var handleFocus = function handleFocus(event) { if (onFocus) {
+    onFocus(event);
+} if (muiFormControl && muiFormControl.onFocus) {
+    muiFormControl.onFocus(event);
+} }; var handleBlur = function handleBlur(event) { if (onBlur) {
+    onBlur(event);
+} if (muiFormControl && muiFormControl.onBlur) {
+    muiFormControl.onBlur(event);
+} }; var handleInputChange = function handleInputChange(event) { var newChecked = event.target.checked; setCheckedState(newChecked); if (onChange) {
+    onChange(event, newChecked);
+} }; var disabled = disabledProp; if (muiFormControl) {
+    if (typeof disabled === 'undefined') {
+        disabled = muiFormControl.disabled;
+    }
+} var hasLabelFor = type === 'checkbox' || type === 'radio'; return /*#__PURE__*/ y$3(IconButton$1, _extends$4({ component: "span", className: clsx(classes.root, className, checked && classes.checked, disabled && classes.disabled), disabled: disabled, tabIndex: null, role: undefined, onFocus: handleFocus, onBlur: handleBlur, ref: ref }, other), /*#__PURE__*/ y$3("input", _extends$4({ autoFocus: autoFocus, checked: checkedProp, defaultChecked: defaultChecked, className: classes.input, disabled: disabled, id: hasLabelFor && id, name: name, onChange: handleInputChange, readOnly: readOnly, ref: inputRef, required: required, tabIndex: tabIndex, type: type, value: value }, inputProps)), checked ? checkedIcon : icon); });
+var SwitchBase$1 = withStyles(styles$M, { name: 'PrivateSwitchBase' })(SwitchBase);
+var CheckBoxOutlineBlankIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z" }));
+var CheckBoxIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" }));
+var IndeterminateCheckBoxIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z" }));
+var styles$L = function styles(theme) { return { root: { color: theme.palette.text.secondary }, checked: {}, disabled: {}, indeterminate: {}, colorPrimary: { '&$checked': { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, '&$disabled': { color: theme.palette.action.disabled } }, colorSecondary: { '&$checked': { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, '&$disabled': { color: theme.palette.action.disabled } } }; };
+var defaultCheckedIcon$1 = /*#__PURE__*/ y$3(CheckBoxIcon, null);
+var defaultIcon$1 = /*#__PURE__*/ y$3(CheckBoxOutlineBlankIcon, null);
+var defaultIndeterminateIcon = /*#__PURE__*/ y$3(IndeterminateCheckBoxIcon, null);
+var Checkbox$1 = /*#__PURE__*/ N$1(function Checkbox(props, ref) { var _props$checkedIcon = props.checkedIcon, checkedIcon = _props$checkedIcon === void 0 ? defaultCheckedIcon$1 : _props$checkedIcon, classes = props.classes, _props$color = props.color, color = _props$color === void 0 ? 'secondary' : _props$color, _props$icon = props.icon, iconProp = _props$icon === void 0 ? defaultIcon$1 : _props$icon, _props$indeterminate = props.indeterminate, indeterminate = _props$indeterminate === void 0 ? false : _props$indeterminate, _props$indeterminateI = props.indeterminateIcon, indeterminateIconProp = _props$indeterminateI === void 0 ? defaultIndeterminateIcon : _props$indeterminateI, inputProps = props.inputProps, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, other = _objectWithoutProperties$2(props, ["checkedIcon", "classes", "color", "icon", "indeterminate", "indeterminateIcon", "inputProps", "size"]); var icon = indeterminate ? indeterminateIconProp : iconProp; var indeterminateIcon = indeterminate ? indeterminateIconProp : checkedIcon; return /*#__PURE__*/ y$3(SwitchBase$1, _extends$4({ type: "checkbox", classes: { root: clsx(classes.root, classes["color".concat(capitalize(color))], indeterminate && classes.indeterminate), checked: classes.checked, disabled: classes.disabled }, color: color, inputProps: _extends$4({ 'data-indeterminate': indeterminate }, inputProps), icon: /*#__PURE__*/ sn(icon, { fontSize: icon.props.fontSize === undefined && size === "small" ? size : icon.props.fontSize }), checkedIcon: /*#__PURE__*/ sn(indeterminateIcon, { fontSize: indeterminateIcon.props.fontSize === undefined && size === "small" ? size : indeterminateIcon.props.fontSize }), ref: ref }, other)); });
+var MUICheckbox = withStyles(styles$L, { name: 'MuiCheckbox' })(Checkbox$1);
+var CancelIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z" }));
+var styles$K = function styles(theme) { var backgroundColor = theme.palette.type === 'light' ? theme.palette.grey[300] : theme.palette.grey[700]; var deleteIconColor = alpha(theme.palette.text.primary, 0.26); return { root: { fontFamily: theme.typography.fontFamily, fontSize: theme.typography.pxToRem(13), display: 'inline-flex', alignItems: 'center', justifyContent: 'center', height: 32, color: theme.palette.getContrastText(backgroundColor), backgroundColor: backgroundColor, borderRadius: 32 / 2, whiteSpace: 'nowrap', transition: theme.transitions.create(['background-color', 'box-shadow']), cursor: 'default', outline: 0, textDecoration: 'none', border: 'none', padding: 0, verticalAlign: 'middle', boxSizing: 'border-box', '&$disabled': { opacity: 0.5, pointerEvents: 'none' }, '& $avatar': { marginLeft: 5, marginRight: -6, width: 24, height: 24, color: theme.palette.type === 'light' ? theme.palette.grey[700] : theme.palette.grey[300], fontSize: theme.typography.pxToRem(12) }, '& $avatarColorPrimary': { color: theme.palette.primary.contrastText, backgroundColor: theme.palette.primary.dark }, '& $avatarColorSecondary': { color: theme.palette.secondary.contrastText, backgroundColor: theme.palette.secondary.dark }, '& $avatarSmall': { marginLeft: 4, marginRight: -4, width: 18, height: 18, fontSize: theme.typography.pxToRem(10) } }, sizeSmall: { height: 24 }, colorPrimary: { backgroundColor: theme.palette.primary.main, color: theme.palette.primary.contrastText }, colorSecondary: { backgroundColor: theme.palette.secondary.main, color: theme.palette.secondary.contrastText }, disabled: {}, clickable: { userSelect: 'none', WebkitTapHighlightColor: 'transparent', cursor: 'pointer', '&:hover, &:focus': { backgroundColor: emphasize(backgroundColor, 0.08) }, '&:active': { boxShadow: theme.shadows[1] } }, clickableColorPrimary: { '&:hover, &:focus': { backgroundColor: emphasize(theme.palette.primary.main, 0.08) } }, clickableColorSecondary: { '&:hover, &:focus': { backgroundColor: emphasize(theme.palette.secondary.main, 0.08) } }, deletable: { '&:focus': { backgroundColor: emphasize(backgroundColor, 0.08) } }, deletableColorPrimary: { '&:focus': { backgroundColor: emphasize(theme.palette.primary.main, 0.2) } }, deletableColorSecondary: { '&:focus': { backgroundColor: emphasize(theme.palette.secondary.main, 0.2) } }, outlined: { backgroundColor: 'transparent', border: "1px solid ".concat(theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'), '$clickable&:hover, $clickable&:focus, $deletable&:focus': { backgroundColor: alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity) }, '& $avatar': { marginLeft: 4 }, '& $avatarSmall': { marginLeft: 2 }, '& $icon': { marginLeft: 4 }, '& $iconSmall': { marginLeft: 2 }, '& $deleteIcon': { marginRight: 5 }, '& $deleteIconSmall': { marginRight: 3 } }, outlinedPrimary: { color: theme.palette.primary.main, border: "1px solid ".concat(theme.palette.primary.main), '$clickable&:hover, $clickable&:focus, $deletable&:focus': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity) } }, outlinedSecondary: { color: theme.palette.secondary.main, border: "1px solid ".concat(theme.palette.secondary.main), '$clickable&:hover, $clickable&:focus, $deletable&:focus': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity) } }, avatar: {}, avatarSmall: {}, avatarColorPrimary: {}, avatarColorSecondary: {}, icon: { color: theme.palette.type === 'light' ? theme.palette.grey[700] : theme.palette.grey[300], marginLeft: 5, marginRight: -6 }, iconSmall: { width: 18, height: 18, marginLeft: 4, marginRight: -4 }, iconColorPrimary: { color: 'inherit' }, iconColorSecondary: { color: 'inherit' }, label: { overflow: 'hidden', textOverflow: 'ellipsis', paddingLeft: 12, paddingRight: 12, whiteSpace: 'nowrap' }, labelSmall: { paddingLeft: 8, paddingRight: 8 }, deleteIcon: { WebkitTapHighlightColor: 'transparent', color: deleteIconColor, height: 22, width: 22, cursor: 'pointer', margin: '0 5px 0 -6px', '&:hover': { color: alpha(deleteIconColor, 0.4) } }, deleteIconSmall: { height: 16, width: 16, marginRight: 4, marginLeft: -4 }, deleteIconColorPrimary: { color: alpha(theme.palette.primary.contrastText, 0.7), '&:hover, &:active': { color: theme.palette.primary.contrastText } }, deleteIconColorSecondary: { color: alpha(theme.palette.secondary.contrastText, 0.7), '&:hover, &:active': { color: theme.palette.secondary.contrastText } }, deleteIconOutlinedColorPrimary: { color: alpha(theme.palette.primary.main, 0.7), '&:hover, &:active': { color: theme.palette.primary.main } }, deleteIconOutlinedColorSecondary: { color: alpha(theme.palette.secondary.main, 0.7), '&:hover, &:active': { color: theme.palette.secondary.main } } }; };
+function isDeleteKeyboardEvent(keyboardEvent) { return keyboardEvent.key === 'Backspace' || keyboardEvent.key === 'Delete'; }
+var Chip = /*#__PURE__*/ N$1(function Chip(props, ref) { var avatarProp = props.avatar, classes = props.classes, className = props.className, clickableProp = props.clickable, _props$color = props.color, color = _props$color === void 0 ? 'default' : _props$color, ComponentProp = props.component, deleteIconProp = props.deleteIcon, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, iconProp = props.icon, label = props.label, onClick = props.onClick, onDelete = props.onDelete, onKeyDown = props.onKeyDown, onKeyUp = props.onKeyUp, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, _props$variant = props.variant, variant = _props$variant === void 0 ? 'default' : _props$variant, other = _objectWithoutProperties$2(props, ["avatar", "classes", "className", "clickable", "color", "component", "deleteIcon", "disabled", "icon", "label", "onClick", "onDelete", "onKeyDown", "onKeyUp", "size", "variant"]); var chipRef = _$1(null); var handleRef = useForkRef(chipRef, ref); var handleDeleteIconClick = function handleDeleteIconClick(event) { event.stopPropagation(); if (onDelete) {
+    onDelete(event);
+} }; var handleKeyDown = function handleKeyDown(event) { if (event.currentTarget === event.target && isDeleteKeyboardEvent(event)) {
+    event.preventDefault();
+} if (onKeyDown) {
+    onKeyDown(event);
+} }; var handleKeyUp = function handleKeyUp(event) { if (event.currentTarget === event.target) {
+    if (onDelete && isDeleteKeyboardEvent(event)) {
+        onDelete(event);
+    }
+    else if (event.key === 'Escape' && chipRef.current) {
+        chipRef.current.blur();
+    }
+} if (onKeyUp) {
+    onKeyUp(event);
+} }; var clickable = clickableProp !== false && onClick ? true : clickableProp; var small = size === 'small'; var Component = ComponentProp || (clickable ? ButtonBase$1 : 'div'); var moreProps = Component === ButtonBase$1 ? { component: 'div' } : {}; var deleteIcon = null; if (onDelete) {
+    var customClasses = clsx(color !== 'default' && (variant === "default" ? classes["deleteIconColor".concat(capitalize(color))] : classes["deleteIconOutlinedColor".concat(capitalize(color))]), small && classes.deleteIconSmall);
+    deleteIcon = deleteIconProp && /*#__PURE__*/ fn(deleteIconProp) ? /*#__PURE__*/ sn(deleteIconProp, { className: clsx(deleteIconProp.props.className, classes.deleteIcon, customClasses), onClick: handleDeleteIconClick }) : /*#__PURE__*/ y$3(CancelIcon, { className: clsx(classes.deleteIcon, customClasses), onClick: handleDeleteIconClick });
+} var avatar = null; if (avatarProp && /*#__PURE__*/ fn(avatarProp)) {
+    avatar = /*#__PURE__*/ sn(avatarProp, { className: clsx(classes.avatar, avatarProp.props.className, small && classes.avatarSmall, color !== 'default' && classes["avatarColor".concat(capitalize(color))]) });
+} var icon = null; if (iconProp && /*#__PURE__*/ fn(iconProp)) {
+    icon = /*#__PURE__*/ sn(iconProp, { className: clsx(classes.icon, iconProp.props.className, small && classes.iconSmall, color !== 'default' && classes["iconColor".concat(capitalize(color))]) });
+} return /*#__PURE__*/ y$3(Component, _extends$4({ role: clickable || onDelete ? 'button' : undefined, className: clsx(classes.root, className, color !== 'default' && [classes["color".concat(capitalize(color))], clickable && classes["clickableColor".concat(capitalize(color))], onDelete && classes["deletableColor".concat(capitalize(color))]], variant !== "default" && [classes.outlined, { 'primary': classes.outlinedPrimary, 'secondary': classes.outlinedSecondary }[color]], disabled && classes.disabled, small && classes.sizeSmall, clickable && classes.clickable, onDelete && classes.deletable), "aria-disabled": disabled ? true : undefined, tabIndex: clickable || onDelete ? 0 : undefined, onClick: onClick, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: handleRef }, moreProps, other), avatar || icon, /*#__PURE__*/ y$3("span", { className: clsx(classes.label, small && classes.labelSmall) }, label), deleteIcon); });
+var Chip$1 = withStyles(styles$K, { name: 'MuiChip' })(Chip);
 var SIZE = 44;
-var styles$w = function styles(theme) { return { root: { display: 'inline-block' }, "static": { transition: theme.transitions.create('transform') }, indeterminate: { animation: '$circular-rotate 1.4s linear infinite' }, determinate: { transition: theme.transitions.create('transform') }, colorPrimary: { color: theme.palette.primary.main }, colorSecondary: { color: theme.palette.secondary.main }, svg: { display: 'block' }, circle: { stroke: 'currentColor' }, circleStatic: { transition: theme.transitions.create('stroke-dashoffset') }, circleIndeterminate: { animation: '$circular-dash 1.4s ease-in-out infinite', strokeDasharray: '80px, 200px', strokeDashoffset: '0px' }, circleDeterminate: { transition: theme.transitions.create('stroke-dashoffset') }, '@keyframes circular-rotate': { '0%': { transformOrigin: '50% 50%' }, '100%': { transform: 'rotate(360deg)' } }, '@keyframes circular-dash': { '0%': { strokeDasharray: '1px, 200px', strokeDashoffset: '0px' }, '50%': { strokeDasharray: '100px, 200px', strokeDashoffset: '-15px' }, '100%': { strokeDasharray: '100px, 200px', strokeDashoffset: '-125px' } }, circleDisableShrink: { animation: 'none' } }; };
+var styles$J = function styles(theme) { return { root: { display: 'inline-block' }, "static": { transition: theme.transitions.create('transform') }, indeterminate: { animation: '$circular-rotate 1.4s linear infinite' }, determinate: { transition: theme.transitions.create('transform') }, colorPrimary: { color: theme.palette.primary.main }, colorSecondary: { color: theme.palette.secondary.main }, svg: { display: 'block' }, circle: { stroke: 'currentColor' }, circleStatic: { transition: theme.transitions.create('stroke-dashoffset') }, circleIndeterminate: { animation: '$circular-dash 1.4s ease-in-out infinite', strokeDasharray: '80px, 200px', strokeDashoffset: '0px' }, circleDeterminate: { transition: theme.transitions.create('stroke-dashoffset') }, '@keyframes circular-rotate': { '0%': { transformOrigin: '50% 50%' }, '100%': { transform: 'rotate(360deg)' } }, '@keyframes circular-dash': { '0%': { strokeDasharray: '1px, 200px', strokeDashoffset: '0px' }, '50%': { strokeDasharray: '100px, 200px', strokeDashoffset: '-15px' }, '100%': { strokeDasharray: '100px, 200px', strokeDashoffset: '-125px' } }, circleDisableShrink: { animation: 'none' } }; };
 var CircularProgress = /*#__PURE__*/ N$1(function CircularProgress(props, ref) { var classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'primary' : _props$color, _props$disableShrink = props.disableShrink, disableShrink = _props$disableShrink === void 0 ? false : _props$disableShrink, _props$size = props.size, size = _props$size === void 0 ? 40 : _props$size, style = props.style, _props$thickness = props.thickness, thickness = _props$thickness === void 0 ? 3.6 : _props$thickness, _props$value = props.value, value = _props$value === void 0 ? 0 : _props$value, _props$variant = props.variant, variant = _props$variant === void 0 ? 'indeterminate' : _props$variant, other = _objectWithoutProperties$2(props, ["classes", "className", "color", "disableShrink", "size", "style", "thickness", "value", "variant"]); var circleStyle = {}; var rootStyle = {}; var rootProps = {}; if (variant === 'determinate' || variant === 'static') {
     var circumference = 2 * Math.PI * ((SIZE - thickness) / 2);
     circleStyle.strokeDasharray = circumference.toFixed(3);
@@ -6999,7 +7064,7 @@ var CircularProgress = /*#__PURE__*/ N$1(function CircularProgress(props, ref) {
     circleStyle.strokeDashoffset = "".concat(((100 - value) / 100 * circumference).toFixed(3), "px");
     rootStyle.transform = 'rotate(-90deg)';
 } return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className, color !== 'inherit' && classes["color".concat(capitalize(color))], { 'determinate': classes.determinate, 'indeterminate': classes.indeterminate, 'static': classes["static"] }[variant]), style: _extends$4({ width: size, height: size }, rootStyle, style), ref: ref, role: "progressbar" }, rootProps, other), /*#__PURE__*/ y$3("svg", { className: classes.svg, viewBox: "".concat(SIZE / 2, " ").concat(SIZE / 2, " ").concat(SIZE, " ").concat(SIZE) }, /*#__PURE__*/ y$3("circle", { className: clsx(classes.circle, disableShrink && classes.circleDisableShrink, { 'determinate': classes.circleDeterminate, 'indeterminate': classes.circleIndeterminate, 'static': classes.circleStatic }[variant]), style: circleStyle, cx: SIZE, cy: SIZE, r: (SIZE - thickness) / 2, fill: "none", strokeWidth: thickness }))); });
-var CircularProgress$1 = withStyles(styles$w, { name: 'MuiCircularProgress', flip: false })(CircularProgress);
+var CircularProgress$1 = withStyles(styles$J, { name: 'MuiCircularProgress', flip: false })(CircularProgress);
 function mapEventPropToEvent(eventProp) { return eventProp.substring(2).toLowerCase(); }
 function clickedRootScrollbar(event) { return document.documentElement.clientWidth < event.clientX || document.documentElement.clientHeight < event.clientY; }
 function ClickAwayListener(props) { var children = props.children, _props$disableReactTr = props.disableReactTree, disableReactTree = _props$disableReactTr === void 0 ? false : _props$disableReactTr, _props$mouseEvent = props.mouseEvent, mouseEvent = _props$mouseEvent === void 0 ? 'onClick' : _props$mouseEvent, onClickAway = props.onClickAway, _props$touchEvent = props.touchEvent, touchEvent = _props$touchEvent === void 0 ? 'onTouchEnd' : _props$touchEvent; var movedRef = _$1(false); var nodeRef = _$1(null); var activatedRef = _$1(false); var syntheticEventRef = _$1(false); p$3(function () { setTimeout(function () { activatedRef.current = true; }, 0); return function () { activatedRef.current = false; }; }, []); var handleOwnRef = T$2(function (instance) { nodeRef.current = vn(instance); }, []); var handleRef = useForkRef(children.ref, handleOwnRef); var handleClickAway = useEventCallback(function (event) { var insideReactTree = syntheticEventRef.current; syntheticEventRef.current = false; if (!activatedRef.current || !nodeRef.current || clickedRootScrollbar(event)) {
@@ -7058,7 +7123,7 @@ function _defineProperties(target, props) { for (var i = 0; i < props.length; i+
     descriptor.configurable = true;
     if ("value" in descriptor)
         descriptor.writable = true;
-    Object.defineProperty(target, toPropertyKey$1(descriptor.key), descriptor);
+    Object.defineProperty(target, toPropertyKey$2(descriptor.key), descriptor);
 } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps)
     _defineProperties(Constructor.prototype, protoProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
@@ -7167,12 +7232,12 @@ function Unstable_TrapFocus(props) { var children = props.children, _props$disab
     }
     nodeToRestore.current = null;
 } }; }, [disableAutoFocus, disableEnforceFocus, disableRestoreFocus, isEnabled, open]); return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ y$3("div", { tabIndex: 0, ref: sentinelStart, "data-test": "sentinelStart" }), /*#__PURE__*/ sn(children, { ref: handleRef }), /*#__PURE__*/ y$3("div", { tabIndex: 0, ref: sentinelEnd, "data-test": "sentinelEnd" })); }
-var styles$v = { root: { zIndex: -1, position: 'fixed', right: 0, bottom: 0, top: 0, left: 0, backgroundColor: 'rgba(0, 0, 0, 0.5)', WebkitTapHighlightColor: 'transparent' }, invisible: { backgroundColor: 'transparent' } };
-var SimpleBackdrop = /*#__PURE__*/ N$1(function SimpleBackdrop(props, ref) { var _props$invisible = props.invisible, invisible = _props$invisible === void 0 ? false : _props$invisible, open = props.open, other = _objectWithoutProperties$2(props, ["invisible", "open"]); return open ? /*#__PURE__*/ y$3("div", _extends$4({ "aria-hidden": true, ref: ref }, other, { style: _extends$4({}, styles$v.root, invisible ? styles$v.invisible : {}, other.style) })) : null; });
+var styles$I = { root: { zIndex: -1, position: 'fixed', right: 0, bottom: 0, top: 0, left: 0, backgroundColor: 'rgba(0, 0, 0, 0.5)', WebkitTapHighlightColor: 'transparent' }, invisible: { backgroundColor: 'transparent' } };
+var SimpleBackdrop = /*#__PURE__*/ N$1(function SimpleBackdrop(props, ref) { var _props$invisible = props.invisible, invisible = _props$invisible === void 0 ? false : _props$invisible, open = props.open, other = _objectWithoutProperties$2(props, ["invisible", "open"]); return open ? /*#__PURE__*/ y$3("div", _extends$4({ "aria-hidden": true, ref: ref }, other, { style: _extends$4({}, styles$I.root, invisible ? styles$I.invisible : {}, other.style) })) : null; });
 function getContainer(container) { container = typeof container === 'function' ? container() : container; return vn(container); }
 function getHasTransition(props) { return props.children ? props.children.props.hasOwnProperty('in') : false; }
 var defaultManager = new ModalManager();
-var styles$u = function styles(theme) { return { root: { position: 'fixed', zIndex: theme.zIndex.modal, right: 0, bottom: 0, top: 0, left: 0 }, hidden: { visibility: 'hidden' } }; };
+var styles$H = function styles(theme) { return { root: { position: 'fixed', zIndex: theme.zIndex.modal, right: 0, bottom: 0, top: 0, left: 0 }, hidden: { visibility: 'hidden' } }; };
 var Modal$1 = /*#__PURE__*/ N$1(function Modal(inProps, ref) { var theme = useTheme$1(); var props = getThemeProps({ name: 'MuiModal', props: _extends$4({}, inProps), theme: theme }); var _props$BackdropCompon = props.BackdropComponent, BackdropComponent = _props$BackdropCompon === void 0 ? SimpleBackdrop : _props$BackdropCompon, BackdropProps = props.BackdropProps, children = props.children, _props$closeAfterTran = props.closeAfterTransition, closeAfterTransition = _props$closeAfterTran === void 0 ? false : _props$closeAfterTran, container = props.container, _props$disableAutoFoc = props.disableAutoFocus, disableAutoFocus = _props$disableAutoFoc === void 0 ? false : _props$disableAutoFoc, _props$disableBackdro = props.disableBackdropClick, disableBackdropClick = _props$disableBackdro === void 0 ? false : _props$disableBackdro, _props$disableEnforce = props.disableEnforceFocus, disableEnforceFocus = _props$disableEnforce === void 0 ? false : _props$disableEnforce, _props$disableEscapeK = props.disableEscapeKeyDown, disableEscapeKeyDown = _props$disableEscapeK === void 0 ? false : _props$disableEscapeK, _props$disablePortal = props.disablePortal, disablePortal = _props$disablePortal === void 0 ? false : _props$disablePortal, _props$disableRestore = props.disableRestoreFocus, disableRestoreFocus = _props$disableRestore === void 0 ? false : _props$disableRestore, _props$disableScrollL = props.disableScrollLock, disableScrollLock = _props$disableScrollL === void 0 ? false : _props$disableScrollL, _props$hideBackdrop = props.hideBackdrop, hideBackdrop = _props$hideBackdrop === void 0 ? false : _props$hideBackdrop, _props$keepMounted = props.keepMounted, keepMounted = _props$keepMounted === void 0 ? false : _props$keepMounted, _props$manager = props.manager, manager = _props$manager === void 0 ? defaultManager : _props$manager, onBackdropClick = props.onBackdropClick, onClose = props.onClose, onEscapeKeyDown = props.onEscapeKeyDown, onRendered = props.onRendered, open = props.open, other = _objectWithoutProperties$2(props, ["BackdropComponent", "BackdropProps", "children", "closeAfterTransition", "container", "disableAutoFocus", "disableBackdropClick", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "manager", "onBackdropClick", "onClose", "onEscapeKeyDown", "onRendered", "open"]); var _React$useState = h$4(true), exited = _React$useState[0], setExited = _React$useState[1]; var modal = _$1({}); var mountNodeRef = _$1(null); var modalRef = _$1(null); var handleRef = useForkRef(modalRef, ref); var hasTransition = getHasTransition(props); var getDoc = function getDoc() { return ownerDocument(mountNodeRef.current); }; var getModal = function getModal() { modal.current.modalRef = modalRef.current; modal.current.mountNode = mountNodeRef.current; return modal.current; }; var handleMounted = function handleMounted() { manager.mount(getModal(), { disableScrollLock: disableScrollLock }); modalRef.current.scrollTop = 0; }; var handleOpen = useEventCallback(function () { var resolvedContainer = getContainer(container) || getDoc().body; manager.add(getModal(), resolvedContainer); if (modalRef.current) {
     handleMounted();
 } }); var isTopModal = T$2(function () { return manager.isTopModal(getModal()); }, [manager]); var handlePortalRef = useEventCallback(function (node) { mountNodeRef.current = node; if (!node) {
@@ -7208,13 +7273,13 @@ else if (!hasTransition || !closeAfterTransition) {
     if (onClose) {
         onClose(event, 'escapeKeyDown');
     }
-} }; var inlineStyle = styles$u(theme || { zIndex: zIndex }); var childProps = {}; if (children.props.tabIndex === undefined) {
+} }; var inlineStyle = styles$H(theme || { zIndex: zIndex }); var childProps = {}; if (children.props.tabIndex === undefined) {
     childProps.tabIndex = children.props.tabIndex || '-1';
 } if (hasTransition) {
     childProps.onEnter = createChainedFunction(handleEnter, children.props.onEnter);
     childProps.onExited = createChainedFunction(handleExited, children.props.onExited);
 } return /*#__PURE__*/ y$3(Portal, { ref: handlePortalRef, container: container, disablePortal: disablePortal }, /*#__PURE__*/ y$3("div", _extends$4({ ref: handleRef, onKeyDown: handleKeyDown, role: "presentation" }, other, { style: _extends$4({}, inlineStyle.root, !open && exited ? inlineStyle.hidden : {}, other.style) }), hideBackdrop ? null : /*#__PURE__*/ y$3(BackdropComponent, _extends$4({ open: open, onClick: handleBackdropClick }, BackdropProps)), /*#__PURE__*/ y$3(Unstable_TrapFocus, { disableEnforceFocus: disableEnforceFocus, disableAutoFocus: disableAutoFocus, disableRestoreFocus: disableRestoreFocus, getDoc: getDoc, isEnabled: isTopModal, open: open }, /*#__PURE__*/ sn(children, childProps)))); });
-var styles$t = function styles(theme) { return { root: { '@media print': { position: 'absolute !important' } }, scrollPaper: { display: 'flex', justifyContent: 'center', alignItems: 'center' }, scrollBody: { overflowY: 'auto', overflowX: 'hidden', textAlign: 'center', '&:after': { content: '""', display: 'inline-block', verticalAlign: 'middle', height: '100%', width: '0' } }, container: { height: '100%', '@media print': { height: 'auto' }, outline: 0 }, paper: { margin: 32, position: 'relative', overflowY: 'auto', '@media print': { overflowY: 'visible', boxShadow: 'none' } }, paperScrollPaper: { display: 'flex', flexDirection: 'column', maxHeight: 'calc(100% - 64px)' }, paperScrollBody: { display: 'inline-block', verticalAlign: 'middle', textAlign: 'left' }, paperWidthFalse: { maxWidth: 'calc(100% - 64px)' }, paperWidthXs: { maxWidth: Math.max(theme.breakpoints.values.xs, 444), '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(Math.max(theme.breakpoints.values.xs, 444) + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthSm: { maxWidth: theme.breakpoints.values.sm, '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.sm + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthMd: { maxWidth: theme.breakpoints.values.md, '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.md + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthLg: { maxWidth: theme.breakpoints.values.lg, '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.lg + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthXl: { maxWidth: theme.breakpoints.values.xl, '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.xl + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperFullWidth: { width: 'calc(100% - 64px)' }, paperFullScreen: { margin: 0, width: '100%', maxWidth: '100%', height: '100%', maxHeight: 'none', borderRadius: 0, '&$paperScrollBody': { margin: 0, maxWidth: '100%' } } }; };
+var styles$G = function styles(theme) { return { root: { '@media print': { position: 'absolute !important' } }, scrollPaper: { display: 'flex', justifyContent: 'center', alignItems: 'center' }, scrollBody: { overflowY: 'auto', overflowX: 'hidden', textAlign: 'center', '&:after': { content: '""', display: 'inline-block', verticalAlign: 'middle', height: '100%', width: '0' } }, container: { height: '100%', '@media print': { height: 'auto' }, outline: 0 }, paper: { margin: 32, position: 'relative', overflowY: 'auto', '@media print': { overflowY: 'visible', boxShadow: 'none' } }, paperScrollPaper: { display: 'flex', flexDirection: 'column', maxHeight: 'calc(100% - 64px)' }, paperScrollBody: { display: 'inline-block', verticalAlign: 'middle', textAlign: 'left' }, paperWidthFalse: { maxWidth: 'calc(100% - 64px)' }, paperWidthXs: { maxWidth: Math.max(theme.breakpoints.values.xs, 444), '&$paperScrollBody': _defineProperty$1({}, theme.breakpoints.down(Math.max(theme.breakpoints.values.xs, 444) + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthSm: { maxWidth: theme.breakpoints.values.sm, '&$paperScrollBody': _defineProperty$1({}, theme.breakpoints.down(theme.breakpoints.values.sm + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthMd: { maxWidth: theme.breakpoints.values.md, '&$paperScrollBody': _defineProperty$1({}, theme.breakpoints.down(theme.breakpoints.values.md + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthLg: { maxWidth: theme.breakpoints.values.lg, '&$paperScrollBody': _defineProperty$1({}, theme.breakpoints.down(theme.breakpoints.values.lg + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperWidthXl: { maxWidth: theme.breakpoints.values.xl, '&$paperScrollBody': _defineProperty$1({}, theme.breakpoints.down(theme.breakpoints.values.xl + 32 * 2), { maxWidth: 'calc(100% - 64px)' }) }, paperFullWidth: { width: 'calc(100% - 64px)' }, paperFullScreen: { margin: 0, width: '100%', maxWidth: '100%', height: '100%', maxHeight: 'none', borderRadius: 0, '&$paperScrollBody': { margin: 0, maxWidth: '100%' } } }; };
 var defaultTransitionDuration = { enter: duration.enteringScreen, exit: duration.leavingScreen };
 var Dialog = /*#__PURE__*/ N$1(function Dialog(props, ref) { var BackdropProps = props.BackdropProps, children = props.children, classes = props.classes, className = props.className, _props$disableBackdro = props.disableBackdropClick, disableBackdropClick = _props$disableBackdro === void 0 ? false : _props$disableBackdro, _props$disableEscapeK = props.disableEscapeKeyDown, disableEscapeKeyDown = _props$disableEscapeK === void 0 ? false : _props$disableEscapeK, _props$fullScreen = props.fullScreen, fullScreen = _props$fullScreen === void 0 ? false : _props$fullScreen, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$maxWidth = props.maxWidth, maxWidth = _props$maxWidth === void 0 ? 'sm' : _props$maxWidth, onBackdropClick = props.onBackdropClick, onClose = props.onClose, onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onEscapeKeyDown = props.onEscapeKeyDown, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, open = props.open, _props$PaperComponent = props.PaperComponent, PaperComponent = _props$PaperComponent === void 0 ? Paper$1 : _props$PaperComponent, _props$PaperProps = props.PaperProps, PaperProps = _props$PaperProps === void 0 ? {} : _props$PaperProps, _props$scroll = props.scroll, scroll = _props$scroll === void 0 ? 'paper' : _props$scroll, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Fade : _props$TransitionComp, _props$transitionDura = props.transitionDuration, transitionDuration = _props$transitionDura === void 0 ? defaultTransitionDuration : _props$transitionDura, TransitionProps = props.TransitionProps, ariaDescribedby = props['aria-describedby'], ariaLabelledby = props['aria-labelledby'], other = _objectWithoutProperties$2(props, ["BackdropProps", "children", "classes", "className", "disableBackdropClick", "disableEscapeKeyDown", "fullScreen", "fullWidth", "maxWidth", "onBackdropClick", "onClose", "onEnter", "onEntered", "onEntering", "onEscapeKeyDown", "onExit", "onExited", "onExiting", "open", "PaperComponent", "PaperProps", "scroll", "TransitionComponent", "transitionDuration", "TransitionProps", "aria-describedby", "aria-labelledby"]); var mouseDownTarget = _$1(); var handleMouseDown = function handleMouseDown(event) { mouseDownTarget.current = event.target; }; var handleBackdropClick = function handleBackdropClick(event) { if (event.target !== event.currentTarget) {
     return;
@@ -7225,16 +7290,19 @@ var Dialog = /*#__PURE__*/ N$1(function Dialog(props, ref) { var BackdropProps =
 } if (!disableBackdropClick && onClose) {
     onClose(event, 'backdropClick');
 } }; return /*#__PURE__*/ y$3(Modal$1, _extends$4({ className: clsx(classes.root, className), BackdropComponent: Backdrop$1, BackdropProps: _extends$4({ transitionDuration: transitionDuration }, BackdropProps), closeAfterTransition: true }, disableBackdropClick ? { disableBackdropClick: disableBackdropClick } : {}, { disableEscapeKeyDown: disableEscapeKeyDown, onEscapeKeyDown: onEscapeKeyDown, onClose: onClose, open: open, ref: ref }, other), /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": open, timeout: transitionDuration, onEnter: onEnter, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited, role: "none presentation" }, TransitionProps), /*#__PURE__*/ y$3("div", { className: clsx(classes.container, classes["scroll".concat(capitalize(scroll))]), onMouseUp: handleBackdropClick, onMouseDown: handleMouseDown }, /*#__PURE__*/ y$3(PaperComponent, _extends$4({ elevation: 24, role: "dialog", "aria-describedby": ariaDescribedby, "aria-labelledby": ariaLabelledby }, PaperProps, { className: clsx(classes.paper, classes["paperScroll".concat(capitalize(scroll))], classes["paperWidth".concat(capitalize(String(maxWidth)))], PaperProps.className, fullScreen && classes.paperFullScreen, fullWidth && classes.paperFullWidth) }), children)))); });
-var Dialog$1 = withStyles(styles$t, { name: 'MuiDialog' })(Dialog);
-var styles$s = { root: { display: 'flex', alignItems: 'center', padding: 8, justifyContent: 'flex-end', flex: '0 0 auto' }, spacing: { '& > :not(:first-child)': { marginLeft: 8 } } };
+var Dialog$1 = withStyles(styles$G, { name: 'MuiDialog' })(Dialog);
+var styles$F = { root: { display: 'flex', alignItems: 'center', padding: 8, justifyContent: 'flex-end', flex: '0 0 auto' }, spacing: { '& > :not(:first-child)': { marginLeft: 8 } } };
 var DialogActions = /*#__PURE__*/ N$1(function DialogActions(props, ref) { var _props$disableSpacing = props.disableSpacing, disableSpacing = _props$disableSpacing === void 0 ? false : _props$disableSpacing, classes = props.classes, className = props.className, other = _objectWithoutProperties$2(props, ["disableSpacing", "classes", "className"]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className, !disableSpacing && classes.spacing), ref: ref }, other)); });
-var DialogActions$1 = withStyles(styles$s, { name: 'MuiDialogActions' })(DialogActions);
-var styles$r = function styles(theme) { return { root: { flex: '1 1 auto', WebkitOverflowScrolling: 'touch', overflowY: 'auto', padding: '8px 24px', '&:first-child': { paddingTop: 20 } }, dividers: { padding: '16px 24px', borderTop: "1px solid ".concat(theme.palette.divider), borderBottom: "1px solid ".concat(theme.palette.divider) } }; };
+var DialogActions$1 = withStyles(styles$F, { name: 'MuiDialogActions' })(DialogActions);
+var styles$E = function styles(theme) { return { root: { flex: '1 1 auto', WebkitOverflowScrolling: 'touch', overflowY: 'auto', padding: '8px 24px', '&:first-child': { paddingTop: 20 } }, dividers: { padding: '16px 24px', borderTop: "1px solid ".concat(theme.palette.divider), borderBottom: "1px solid ".concat(theme.palette.divider) } }; };
 var DialogContent = /*#__PURE__*/ N$1(function DialogContent(props, ref) { var classes = props.classes, className = props.className, _props$dividers = props.dividers, dividers = _props$dividers === void 0 ? false : _props$dividers, other = _objectWithoutProperties$2(props, ["classes", "className", "dividers"]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className, dividers && classes.dividers), ref: ref }, other)); });
-var DialogContent$1 = withStyles(styles$r, { name: 'MuiDialogContent' })(DialogContent);
-var styles$q = { root: { margin: 0, padding: '16px 24px', flex: '0 0 auto' } };
-var DialogTitle = /*#__PURE__*/ N$1(function DialogTitle(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$disableTypogra = props.disableTypography, disableTypography = _props$disableTypogra === void 0 ? false : _props$disableTypogra, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "disableTypography"]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className), ref: ref }, other), disableTypography ? children : /*#__PURE__*/ y$3(MUITypography, { component: "h2", variant: "h6" }, children)); });
-var DialogTitle$1 = withStyles(styles$q, { name: 'MuiDialogTitle' })(DialogTitle);
+var DialogContent$1 = withStyles(styles$E, { name: 'MuiDialogContent' })(DialogContent);
+var styles$D = { root: { margin: 0, padding: '16px 24px', flex: '0 0 auto' } };
+var DialogTitle = /*#__PURE__*/ N$1(function DialogTitle(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$disableTypogra = props.disableTypography, disableTypography = _props$disableTypogra === void 0 ? false : _props$disableTypogra, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "disableTypography"]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className), ref: ref }, other), disableTypography ? children : /*#__PURE__*/ y$3(Typography$2, { component: "h2", variant: "h6" }, children)); });
+var DialogTitle$1 = withStyles(styles$D, { name: 'MuiDialogTitle' })(DialogTitle);
+var styles$C = function styles(theme) { return { root: { height: 1, margin: 0, border: 'none', flexShrink: 0, backgroundColor: theme.palette.divider }, absolute: { position: 'absolute', bottom: 0, left: 0, width: '100%' }, inset: { marginLeft: 72 }, light: { backgroundColor: alpha(theme.palette.divider, 0.08) }, middle: { marginLeft: theme.spacing(2), marginRight: theme.spacing(2) }, vertical: { height: '100%', width: 1 }, flexItem: { alignSelf: 'stretch', height: 'auto' } }; };
+var Divider = /*#__PURE__*/ N$1(function Divider(props, ref) { var _props$absolute = props.absolute, absolute = _props$absolute === void 0 ? false : _props$absolute, classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? 'hr' : _props$component, _props$flexItem = props.flexItem, flexItem = _props$flexItem === void 0 ? false : _props$flexItem, _props$light = props.light, light = _props$light === void 0 ? false : _props$light, _props$orientation = props.orientation, orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation, _props$role = props.role, role = _props$role === void 0 ? Component !== 'hr' ? 'separator' : undefined : _props$role, _props$variant = props.variant, variant = _props$variant === void 0 ? 'fullWidth' : _props$variant, other = _objectWithoutProperties$2(props, ["absolute", "classes", "className", "component", "flexItem", "light", "orientation", "role", "variant"]); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, variant !== 'fullWidth' && classes[variant], absolute && classes.absolute, flexItem && classes.flexItem, light && classes.light, orientation === 'vertical' && classes.vertical), role: role, ref: ref }, other)); });
+var Divider$1 = withStyles(styles$C, { name: 'MuiDivider' })(Divider);
 function formControlState(_ref) { var props = _ref.props, states = _ref.states, muiFormControl = _ref.muiFormControl; return states.reduce(function (acc, state) { acc[state] = props[state]; if (muiFormControl) {
     if (typeof props[state] === 'undefined') {
         acc[state] = muiFormControl[state];
@@ -7242,7 +7310,7 @@ function formControlState(_ref) { var props = _ref.props, states = _ref.states,
 } return acc; }, {}); }
 function getStyleValue(computedStyle, property) { return parseInt(computedStyle[property], 10) || 0; }
 var useEnhancedEffect$4 = typeof window !== 'undefined' ? y$2 : p$3;
-var styles$p = { shadow: { visibility: 'hidden', position: 'absolute', overflow: 'hidden', height: 0, top: 0, left: 0, transform: 'translateZ(0)' } };
+var styles$B = { shadow: { visibility: 'hidden', position: 'absolute', overflow: 'hidden', height: 0, top: 0, left: 0, transform: 'translateZ(0)' } };
 var TextareaAutosize = /*#__PURE__*/ N$1(function TextareaAutosize(props, ref) { var onChange = props.onChange, rows = props.rows, rowsMax = props.rowsMax, rowsMinProp = props.rowsMin, maxRowsProp = props.maxRows, _props$minRows = props.minRows, minRowsProp = _props$minRows === void 0 ? 1 : _props$minRows, style = props.style, value = props.value, other = _objectWithoutProperties$2(props, ["onChange", "rows", "rowsMax", "rowsMin", "maxRows", "minRows", "style", "value"]); var maxRows = maxRowsProp || rowsMax; var minRows = rows || rowsMinProp || minRowsProp; var _React$useRef = _$1(value != null), isControlled = _React$useRef.current; var inputRef = _$1(null); var handleRef = useForkRef(ref, inputRef); var shadowRef = _$1(null); var renders = _$1(0); var _React$useState = h$4({}), state = _React$useState[0], setState = _React$useState[1]; var syncHeight = T$2(function () { var input = inputRef.current; var computedStyle = window.getComputedStyle(input); var inputShallow = shadowRef.current; inputShallow.style.width = computedStyle.width; inputShallow.value = input.value || props.placeholder || 'x'; if (inputShallow.value.slice(-1) === '\n') {
     inputShallow.value += ' ';
 } var boxSizing = computedStyle['box-sizing']; var padding = getStyleValue(computedStyle, 'padding-bottom') + getStyleValue(computedStyle, 'padding-top'); var border = getStyleValue(computedStyle, 'border-bottom-width') + getStyleValue(computedStyle, 'border-top-width'); var innerHeight = inputShallow.scrollHeight - padding; inputShallow.value = 'x'; var singleRowHeight = inputShallow.scrollHeight - padding; var outerHeight = innerHeight; if (minRows) {
@@ -7256,10 +7324,11 @@ var TextareaAutosize = /*#__PURE__*/ N$1(function TextareaAutosize(props, ref) {
     syncHeight();
 } if (onChange) {
     onChange(event);
-} }; return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ y$3("textarea", _extends$4({ value: value, onChange: handleChange, ref: handleRef, rows: minRows, style: _extends$4({ height: state.outerHeightStyle, overflow: state.overflow ? 'hidden' : null }, style) }, other)), /*#__PURE__*/ y$3("textarea", { "aria-hidden": true, className: props.className, readOnly: true, ref: shadowRef, tabIndex: -1, style: _extends$4({}, styles$p.shadow, style) })); });
+} }; return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ y$3("textarea", _extends$4({ value: value, onChange: handleChange, ref: handleRef, rows: minRows, style: _extends$4({ height: state.outerHeightStyle, overflow: state.overflow ? 'hidden' : null }, style) }, other)), /*#__PURE__*/ y$3("textarea", { "aria-hidden": true, className: props.className, readOnly: true, ref: shadowRef, tabIndex: -1, style: _extends$4({}, styles$B.shadow, style) })); });
 function hasValue(value) { return value != null && !(Array.isArray(value) && value.length === 0); }
 function isFilled(obj) { var SSR = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== ''); }
-var styles$o = function styles(theme) { var light = theme.palette.type === 'light'; var placeholder = { color: 'currentColor', opacity: light ? 0.42 : 0.5, transition: theme.transitions.create('opacity', { duration: theme.transitions.duration.shorter }) }; var placeholderHidden = { opacity: '0 !important' }; var placeholderVisible = { opacity: light ? 0.42 : 0.5 }; return { '@global': { '@keyframes mui-auto-fill': {}, '@keyframes mui-auto-fill-cancel': {} }, root: _extends$4({}, theme.typography.body1, { color: theme.palette.text.primary, lineHeight: '1.1876em', boxSizing: 'border-box', position: 'relative', cursor: 'text', display: 'inline-flex', alignItems: 'center', '&$disabled': { color: theme.palette.text.disabled, cursor: 'default' } }), formControl: {}, focused: {}, disabled: {}, adornedStart: {}, adornedEnd: {}, error: {}, marginDense: {}, multiline: { padding: "".concat(8 - 2, "px 0 ").concat(8 - 1, "px"), '&$marginDense': { paddingTop: 4 - 1 } }, colorSecondary: {}, fullWidth: { width: '100%' }, input: { font: 'inherit', letterSpacing: 'inherit', color: 'currentColor', padding: "".concat(8 - 2, "px 0 ").concat(8 - 1, "px"), border: 0, boxSizing: 'content-box', background: 'none', height: '1.1876em', margin: 0, WebkitTapHighlightColor: 'transparent', display: 'block', minWidth: 0, width: '100%', animationName: 'mui-auto-fill-cancel', animationDuration: '10ms', '&::-webkit-input-placeholder': placeholder, '&::-moz-placeholder': placeholder, '&:-ms-input-placeholder': placeholder, '&::-ms-input-placeholder': placeholder, '&:focus': { outline: 0 }, '&:invalid': { boxShadow: 'none' }, '&::-webkit-search-decoration': { '-webkit-appearance': 'none' }, 'label[data-shrink=false] + $formControl &': { '&::-webkit-input-placeholder': placeholderHidden, '&::-moz-placeholder': placeholderHidden, '&:-ms-input-placeholder': placeholderHidden, '&::-ms-input-placeholder': placeholderHidden, '&:focus::-webkit-input-placeholder': placeholderVisible, '&:focus::-moz-placeholder': placeholderVisible, '&:focus:-ms-input-placeholder': placeholderVisible, '&:focus::-ms-input-placeholder': placeholderVisible }, '&$disabled': { opacity: 1 }, '&:-webkit-autofill': { animationDuration: '5000s', animationName: 'mui-auto-fill' } }, inputMarginDense: { paddingTop: 4 - 1 }, inputMultiline: { height: 'auto', resize: 'none', padding: 0 }, inputTypeSearch: { '-moz-appearance': 'textfield', '-webkit-appearance': 'textfield' }, inputAdornedStart: {}, inputAdornedEnd: {}, inputHiddenLabel: {} }; };
+function isAdornedStart(obj) { return obj.startAdornment; }
+var styles$A = function styles(theme) { var light = theme.palette.type === 'light'; var placeholder = { color: 'currentColor', opacity: light ? 0.42 : 0.5, transition: theme.transitions.create('opacity', { duration: theme.transitions.duration.shorter }) }; var placeholderHidden = { opacity: '0 !important' }; var placeholderVisible = { opacity: light ? 0.42 : 0.5 }; return { '@global': { '@keyframes mui-auto-fill': {}, '@keyframes mui-auto-fill-cancel': {} }, root: _extends$4({}, theme.typography.body1, { color: theme.palette.text.primary, lineHeight: '1.1876em', boxSizing: 'border-box', position: 'relative', cursor: 'text', display: 'inline-flex', alignItems: 'center', '&$disabled': { color: theme.palette.text.disabled, cursor: 'default' } }), formControl: {}, focused: {}, disabled: {}, adornedStart: {}, adornedEnd: {}, error: {}, marginDense: {}, multiline: { padding: "".concat(8 - 2, "px 0 ").concat(8 - 1, "px"), '&$marginDense': { paddingTop: 4 - 1 } }, colorSecondary: {}, fullWidth: { width: '100%' }, input: { font: 'inherit', letterSpacing: 'inherit', color: 'currentColor', padding: "".concat(8 - 2, "px 0 ").concat(8 - 1, "px"), border: 0, boxSizing: 'content-box', background: 'none', height: '1.1876em', margin: 0, WebkitTapHighlightColor: 'transparent', display: 'block', minWidth: 0, width: '100%', animationName: 'mui-auto-fill-cancel', animationDuration: '10ms', '&::-webkit-input-placeholder': placeholder, '&::-moz-placeholder': placeholder, '&:-ms-input-placeholder': placeholder, '&::-ms-input-placeholder': placeholder, '&:focus': { outline: 0 }, '&:invalid': { boxShadow: 'none' }, '&::-webkit-search-decoration': { '-webkit-appearance': 'none' }, 'label[data-shrink=false] + $formControl &': { '&::-webkit-input-placeholder': placeholderHidden, '&::-moz-placeholder': placeholderHidden, '&:-ms-input-placeholder': placeholderHidden, '&::-ms-input-placeholder': placeholderHidden, '&:focus::-webkit-input-placeholder': placeholderVisible, '&:focus::-moz-placeholder': placeholderVisible, '&:focus:-ms-input-placeholder': placeholderVisible, '&:focus::-ms-input-placeholder': placeholderVisible }, '&$disabled': { opacity: 1 }, '&:-webkit-autofill': { animationDuration: '5000s', animationName: 'mui-auto-fill' } }, inputMarginDense: { paddingTop: 4 - 1 }, inputMultiline: { height: 'auto', resize: 'none', padding: 0 }, inputTypeSearch: { '-moz-appearance': 'textfield', '-webkit-appearance': 'textfield' }, inputAdornedStart: {}, inputAdornedEnd: {}, inputHiddenLabel: {} }; };
 var useEnhancedEffect$3 = typeof window === 'undefined' ? p$3 : y$2;
 var InputBase = /*#__PURE__*/ N$1(function InputBase(props, ref) { var ariaDescribedby = props['aria-describedby'], autoComplete = props.autoComplete, autoFocus = props.autoFocus, classes = props.classes, className = props.className; props.color; var defaultValue = props.defaultValue, disabled = props.disabled, endAdornment = props.endAdornment; props.error; var _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, id = props.id, _props$inputComponent = props.inputComponent, inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent, _props$inputProps = props.inputProps, inputPropsProp = _props$inputProps === void 0 ? {} : _props$inputProps, inputRefProp = props.inputRef; props.margin; var _props$multiline = props.multiline, multiline = _props$multiline === void 0 ? false : _props$multiline, name = props.name, onBlur = props.onBlur, onChange = props.onChange, onClick = props.onClick, onFocus = props.onFocus, onKeyDown = props.onKeyDown, onKeyUp = props.onKeyUp, placeholder = props.placeholder, readOnly = props.readOnly, renderSuffix = props.renderSuffix, rows = props.rows, rowsMax = props.rowsMax, rowsMin = props.rowsMin, maxRows = props.maxRows, minRows = props.minRows, startAdornment = props.startAdornment, _props$type = props.type, type = _props$type === void 0 ? 'text' : _props$type, valueProp = props.value, other = _objectWithoutProperties$2(props, ["aria-describedby", "autoComplete", "autoFocus", "classes", "className", "color", "defaultValue", "disabled", "endAdornment", "error", "fullWidth", "id", "inputComponent", "inputProps", "inputRef", "margin", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "onKeyUp", "placeholder", "readOnly", "renderSuffix", "rows", "rowsMax", "rowsMin", "maxRows", "minRows", "startAdornment", "type", "value"]); var value = inputPropsProp.value != null ? inputPropsProp.value : valueProp; var _React$useRef = _$1(value != null), isControlled = _React$useRef.current; var inputRef = _$1(); var handleInputRefWarning = T$2(function (instance) { }, []); var handleInputPropsRefProp = useForkRef(inputPropsProp.ref, handleInputRefWarning); var handleInputRefProp = useForkRef(inputRefProp, handleInputPropsRefProp); var handleInputRef = useForkRef(inputRef, handleInputRefProp); var _React$useState = h$4(false), focused = _React$useState[0], setFocused = _React$useState[1]; var muiFormControl = useFormControl$1(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['color', 'disabled', 'error', 'hiddenLabel', 'margin', 'required', 'filled'] }); fcs.focused = muiFormControl ? muiFormControl.focused : focused; p$3(function () { if (!muiFormControl && disabled && focused) {
     setFocused(false);
@@ -7329,15 +7398,50 @@ else {
 } var handleAutoFill = function handleAutoFill(event) { checkDirty(event.animationName === 'mui-auto-fill-cancel' ? inputRef.current : { value: 'x' }); }; p$3(function () { if (muiFormControl) {
     muiFormControl.setAdornedStart(Boolean(startAdornment));
 } }, [muiFormControl, startAdornment]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, classes["color".concat(capitalize(fcs.color || 'primary'))], className, fcs.disabled && classes.disabled, fcs.error && classes.error, fullWidth && classes.fullWidth, fcs.focused && classes.focused, muiFormControl && classes.formControl, multiline && classes.multiline, startAdornment && classes.adornedStart, endAdornment && classes.adornedEnd, fcs.margin === 'dense' && classes.marginDense), onClick: handleClick, ref: ref }, other), startAdornment, /*#__PURE__*/ y$3(FormControlContext.Provider, { value: null }, /*#__PURE__*/ y$3(InputComponent, _extends$4({ "aria-invalid": fcs.error, "aria-describedby": ariaDescribedby, autoComplete: autoComplete, autoFocus: autoFocus, defaultValue: defaultValue, disabled: fcs.disabled, id: id, onAnimationStart: handleAutoFill, name: name, placeholder: placeholder, readOnly: readOnly, required: fcs.required, rows: rows, value: value, onKeyDown: onKeyDown, onKeyUp: onKeyUp }, inputProps, { className: clsx(classes.input, inputPropsProp.className, fcs.disabled && classes.disabled, multiline && classes.inputMultiline, fcs.hiddenLabel && classes.inputHiddenLabel, startAdornment && classes.inputAdornedStart, endAdornment && classes.inputAdornedEnd, type === 'search' && classes.inputTypeSearch, fcs.margin === 'dense' && classes.inputMarginDense), onBlur: handleBlur, onChange: handleChange, onFocus: handleFocus }))), endAdornment, renderSuffix ? renderSuffix(_extends$4({}, fcs, { startAdornment: startAdornment })) : null); });
-var InputBase$1 = withStyles(styles$o, { name: 'MuiInputBase' })(InputBase);
-var styles$n = function styles(theme) { var light = theme.palette.type === 'light'; var bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)'; var backgroundColor = light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.09)'; return { root: { position: 'relative', backgroundColor: backgroundColor, borderTopLeftRadius: theme.shape.borderRadius, borderTopRightRadius: theme.shape.borderRadius, transition: theme.transitions.create('background-color', { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }), '&:hover': { backgroundColor: light ? 'rgba(0, 0, 0, 0.13)' : 'rgba(255, 255, 255, 0.13)', '@media (hover: none)': { backgroundColor: backgroundColor } }, '&$focused': { backgroundColor: light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.09)' }, '&$disabled': { backgroundColor: light ? 'rgba(0, 0, 0, 0.12)' : 'rgba(255, 255, 255, 0.12)' } }, colorSecondary: { '&$underline:after': { borderBottomColor: theme.palette.secondary.main } }, underline: { '&:after': { borderBottom: "2px solid ".concat(theme.palette.primary.main), left: 0, bottom: 0, content: '""', position: 'absolute', right: 0, transform: 'scaleX(0)', transition: theme.transitions.create('transform', { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }), pointerEvents: 'none' }, '&$focused:after': { transform: 'scaleX(1)' }, '&$error:after': { borderBottomColor: theme.palette.error.main, transform: 'scaleX(1)' }, '&:before': { borderBottom: "1px solid ".concat(bottomLineColor), left: 0, bottom: 0, content: '"\\00a0"', position: 'absolute', right: 0, transition: theme.transitions.create('border-bottom-color', { duration: theme.transitions.duration.shorter }), pointerEvents: 'none' }, '&:hover:before': { borderBottom: "1px solid ".concat(theme.palette.text.primary) }, '&$disabled:before': { borderBottomStyle: 'dotted' } }, focused: {}, disabled: {}, adornedStart: { paddingLeft: 12 }, adornedEnd: { paddingRight: 12 }, error: {}, marginDense: {}, multiline: { padding: '27px 12px 10px', '&$marginDense': { paddingTop: 23, paddingBottom: 6 } }, input: { padding: '27px 12px 10px', '&:-webkit-autofill': { WebkitBoxShadow: theme.palette.type === 'light' ? null : '0 0 0 100px #266798 inset', WebkitTextFillColor: theme.palette.type === 'light' ? null : '#fff', caretColor: theme.palette.type === 'light' ? null : '#fff', borderTopLeftRadius: 'inherit', borderTopRightRadius: 'inherit' } }, inputMarginDense: { paddingTop: 23, paddingBottom: 6 }, inputHiddenLabel: { paddingTop: 18, paddingBottom: 19, '&$inputMarginDense': { paddingTop: 10, paddingBottom: 11 } }, inputMultiline: { padding: 0 }, inputAdornedStart: { paddingLeft: 0 }, inputAdornedEnd: { paddingRight: 0 } }; };
+var InputBase$1 = withStyles(styles$A, { name: 'MuiInputBase' })(InputBase);
+var styles$z = function styles(theme) { var light = theme.palette.type === 'light'; var bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)'; var backgroundColor = light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.09)'; return { root: { position: 'relative', backgroundColor: backgroundColor, borderTopLeftRadius: theme.shape.borderRadius, borderTopRightRadius: theme.shape.borderRadius, transition: theme.transitions.create('background-color', { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }), '&:hover': { backgroundColor: light ? 'rgba(0, 0, 0, 0.13)' : 'rgba(255, 255, 255, 0.13)', '@media (hover: none)': { backgroundColor: backgroundColor } }, '&$focused': { backgroundColor: light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.09)' }, '&$disabled': { backgroundColor: light ? 'rgba(0, 0, 0, 0.12)' : 'rgba(255, 255, 255, 0.12)' } }, colorSecondary: { '&$underline:after': { borderBottomColor: theme.palette.secondary.main } }, underline: { '&:after': { borderBottom: "2px solid ".concat(theme.palette.primary.main), left: 0, bottom: 0, content: '""', position: 'absolute', right: 0, transform: 'scaleX(0)', transition: theme.transitions.create('transform', { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }), pointerEvents: 'none' }, '&$focused:after': { transform: 'scaleX(1)' }, '&$error:after': { borderBottomColor: theme.palette.error.main, transform: 'scaleX(1)' }, '&:before': { borderBottom: "1px solid ".concat(bottomLineColor), left: 0, bottom: 0, content: '"\\00a0"', position: 'absolute', right: 0, transition: theme.transitions.create('border-bottom-color', { duration: theme.transitions.duration.shorter }), pointerEvents: 'none' }, '&:hover:before': { borderBottom: "1px solid ".concat(theme.palette.text.primary) }, '&$disabled:before': { borderBottomStyle: 'dotted' } }, focused: {}, disabled: {}, adornedStart: { paddingLeft: 12 }, adornedEnd: { paddingRight: 12 }, error: {}, marginDense: {}, multiline: { padding: '27px 12px 10px', '&$marginDense': { paddingTop: 23, paddingBottom: 6 } }, input: { padding: '27px 12px 10px', '&:-webkit-autofill': { WebkitBoxShadow: theme.palette.type === 'light' ? null : '0 0 0 100px #266798 inset', WebkitTextFillColor: theme.palette.type === 'light' ? null : '#fff', caretColor: theme.palette.type === 'light' ? null : '#fff', borderTopLeftRadius: 'inherit', borderTopRightRadius: 'inherit' } }, inputMarginDense: { paddingTop: 23, paddingBottom: 6 }, inputHiddenLabel: { paddingTop: 18, paddingBottom: 19, '&$inputMarginDense': { paddingTop: 10, paddingBottom: 11 } }, inputMultiline: { padding: 0 }, inputAdornedStart: { paddingLeft: 0 }, inputAdornedEnd: { paddingRight: 0 } }; };
 var FilledInput = /*#__PURE__*/ N$1(function FilledInput(props, ref) { var disableUnderline = props.disableUnderline, classes = props.classes, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$inputComponent = props.inputComponent, inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent, _props$multiline = props.multiline, multiline = _props$multiline === void 0 ? false : _props$multiline, _props$type = props.type, type = _props$type === void 0 ? 'text' : _props$type, other = _objectWithoutProperties$2(props, ["disableUnderline", "classes", "fullWidth", "inputComponent", "multiline", "type"]); return /*#__PURE__*/ y$3(InputBase$1, _extends$4({ classes: _extends$4({}, classes, { root: clsx(classes.root, !disableUnderline && classes.underline), underline: null }), fullWidth: fullWidth, inputComponent: inputComponent, multiline: multiline, ref: ref, type: type }, other)); });
 FilledInput.muiName = 'Input';
-var FilledInput$1 = withStyles(styles$n, { name: 'MuiFilledInput' })(FilledInput);
+var FilledInput$1 = withStyles(styles$z, { name: 'MuiFilledInput' })(FilledInput);
+var styles$y = { root: { display: 'inline-flex', flexDirection: 'column', position: 'relative', minWidth: 0, padding: 0, margin: 0, border: 0, verticalAlign: 'top' }, marginNormal: { marginTop: 16, marginBottom: 8 }, marginDense: { marginTop: 8, marginBottom: 4 }, fullWidth: { width: '100%' } };
+var FormControl = /*#__PURE__*/ N$1(function FormControl(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'primary' : _props$color, _props$component = props.component, Component = _props$component === void 0 ? 'div' : _props$component, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, _props$error = props.error, error = _props$error === void 0 ? false : _props$error, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, visuallyFocused = props.focused, _props$hiddenLabel = props.hiddenLabel, hiddenLabel = _props$hiddenLabel === void 0 ? false : _props$hiddenLabel, _props$margin = props.margin, margin = _props$margin === void 0 ? 'none' : _props$margin, _props$required = props.required, required = _props$required === void 0 ? false : _props$required, size = props.size, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "color", "component", "disabled", "error", "fullWidth", "focused", "hiddenLabel", "margin", "required", "size", "variant"]); var _React$useState = h$4(function () { var initialAdornedStart = false; if (children) {
+    A$3.forEach(children, function (child) { if (!isMuiElement(child, ['Input', 'Select'])) {
+        return;
+    } var input = isMuiElement(child, ['Select']) ? child.props.input : child; if (input && isAdornedStart(input.props)) {
+        initialAdornedStart = true;
+    } });
+} return initialAdornedStart; }), adornedStart = _React$useState[0], setAdornedStart = _React$useState[1]; var _React$useState2 = h$4(function () { var initialFilled = false; if (children) {
+    A$3.forEach(children, function (child) { if (!isMuiElement(child, ['Input', 'Select'])) {
+        return;
+    } if (isFilled(child.props, true)) {
+        initialFilled = true;
+    } });
+} return initialFilled; }), filled = _React$useState2[0], setFilled = _React$useState2[1]; var _React$useState3 = h$4(false), _focused = _React$useState3[0], setFocused = _React$useState3[1]; var focused = visuallyFocused !== undefined ? visuallyFocused : _focused; if (disabled && focused) {
+    setFocused(false);
+} var registerEffect; var onFilled = T$2(function () { setFilled(true); }, []); var onEmpty = T$2(function () { setFilled(false); }, []); var childContext = { adornedStart: adornedStart, setAdornedStart: setAdornedStart, color: color, disabled: disabled, error: error, filled: filled, focused: focused, fullWidth: fullWidth, hiddenLabel: hiddenLabel, margin: (size === 'small' ? 'dense' : undefined) || margin, onBlur: function onBlur() { setFocused(false); }, onEmpty: onEmpty, onFilled: onFilled, onFocus: function onFocus() { setFocused(true); }, registerEffect: registerEffect, required: required, variant: variant }; return /*#__PURE__*/ y$3(FormControlContext.Provider, { value: childContext }, /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, margin !== 'none' && classes["margin".concat(capitalize(margin))], fullWidth && classes.fullWidth), ref: ref }, other), children)); });
+var FormControl$1 = withStyles(styles$y, { name: 'MuiFormControl' })(FormControl);
+var styles$x = function styles(theme) { return { root: { display: 'inline-flex', alignItems: 'center', cursor: 'pointer', verticalAlign: 'middle', WebkitTapHighlightColor: 'transparent', marginLeft: -11, marginRight: 16, '&$disabled': { cursor: 'default' } }, labelPlacementStart: { flexDirection: 'row-reverse', marginLeft: 16, marginRight: -11 }, labelPlacementTop: { flexDirection: 'column-reverse', marginLeft: 16 }, labelPlacementBottom: { flexDirection: 'column', marginLeft: 16 }, disabled: {}, label: { '&$disabled': { color: theme.palette.text.disabled } } }; };
+var FormControlLabel = /*#__PURE__*/ N$1(function FormControlLabel(props, ref) { props.checked; var classes = props.classes, className = props.className, control = props.control, disabledProp = props.disabled; props.inputRef; var label = props.label, _props$labelPlacement = props.labelPlacement, labelPlacement = _props$labelPlacement === void 0 ? 'end' : _props$labelPlacement; props.name; props.onChange; props.value; var other = _objectWithoutProperties$2(props, ["checked", "classes", "className", "control", "disabled", "inputRef", "label", "labelPlacement", "name", "onChange", "value"]); var muiFormControl = useFormControl(); var disabled = disabledProp; if (typeof disabled === 'undefined' && typeof control.props.disabled !== 'undefined') {
+    disabled = control.props.disabled;
+} if (typeof disabled === 'undefined' && muiFormControl) {
+    disabled = muiFormControl.disabled;
+} var controlProps = { disabled: disabled }; ['checked', 'name', 'onChange', 'value', 'inputRef'].forEach(function (key) { if (typeof control.props[key] === 'undefined' && typeof props[key] !== 'undefined') {
+    controlProps[key] = props[key];
+} }); return /*#__PURE__*/ y$3("label", _extends$4({ className: clsx(classes.root, className, labelPlacement !== 'end' && classes["labelPlacement".concat(capitalize(labelPlacement))], disabled && classes.disabled), ref: ref }, other), /*#__PURE__*/ sn(control, controlProps), /*#__PURE__*/ y$3(Typography$2, { component: "span", className: clsx(classes.label, disabled && classes.disabled) }, label)); });
+var FormControlLabel$1 = withStyles(styles$x, { name: 'MuiFormControlLabel' })(FormControlLabel);
+var styles$w = { root: { display: 'flex', flexDirection: 'column', flexWrap: 'wrap' }, row: { flexDirection: 'row' } };
+var FormGroup = /*#__PURE__*/ N$1(function FormGroup(props, ref) { var classes = props.classes, className = props.className, _props$row = props.row, row = _props$row === void 0 ? false : _props$row, other = _objectWithoutProperties$2(props, ["classes", "className", "row"]); return /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, className, row && classes.row), ref: ref }, other)); });
+var FormGroup$1 = withStyles(styles$w, { name: 'MuiFormGroup' })(FormGroup);
+var styles$v = function styles(theme) { return { root: _extends$4({ color: theme.palette.text.secondary }, theme.typography.caption, { textAlign: 'left', marginTop: 3, margin: 0, '&$disabled': { color: theme.palette.text.disabled }, '&$error': { color: theme.palette.error.main } }), error: {}, disabled: {}, marginDense: { marginTop: 4 }, contained: { marginLeft: 14, marginRight: 14 }, focused: {}, filled: {}, required: {} }; };
+var FormHelperText = /*#__PURE__*/ N$1(function FormHelperText(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? 'p' : _props$component; props.disabled; props.error; props.filled; props.focused; props.margin; props.required; props.variant; var other = _objectWithoutProperties$2(props, ["children", "classes", "className", "component", "disabled", "error", "filled", "focused", "margin", "required", "variant"]); var muiFormControl = useFormControl(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['variant', 'margin', 'disabled', 'error', 'filled', 'focused', 'required'] }); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, (fcs.variant === 'filled' || fcs.variant === 'outlined') && classes.contained, className, fcs.disabled && classes.disabled, fcs.error && classes.error, fcs.filled && classes.filled, fcs.focused && classes.focused, fcs.required && classes.required, fcs.margin === 'dense' && classes.marginDense), ref: ref }, other), children === ' ' ? /*#__PURE__*/ y$3("span", { dangerouslySetInnerHTML: { __html: '&#8203;' } }) : children); });
+var FormHelperText$1 = withStyles(styles$v, { name: 'MuiFormHelperText' })(FormHelperText);
+var styles$u = function styles(theme) { return { root: _extends$4({ color: theme.palette.text.secondary }, theme.typography.body1, { lineHeight: 1, padding: 0, '&$focused': { color: theme.palette.primary.main }, '&$disabled': { color: theme.palette.text.disabled }, '&$error': { color: theme.palette.error.main } }), colorSecondary: { '&$focused': { color: theme.palette.secondary.main } }, focused: {}, disabled: {}, error: {}, filled: {}, required: {}, asterisk: { '&$error': { color: theme.palette.error.main } } }; };
+var FormLabel = /*#__PURE__*/ N$1(function FormLabel(props, ref) { var children = props.children, classes = props.classes, className = props.className; props.color; var _props$component = props.component, Component = _props$component === void 0 ? 'label' : _props$component; props.disabled; props.error; props.filled; props.focused; props.required; var other = _objectWithoutProperties$2(props, ["children", "classes", "className", "color", "component", "disabled", "error", "filled", "focused", "required"]); var muiFormControl = useFormControl(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['color', 'required', 'focused', 'disabled', 'error', 'filled'] }); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, classes["color".concat(capitalize(fcs.color || 'primary'))], className, fcs.disabled && classes.disabled, fcs.error && classes.error, fcs.filled && classes.filled, fcs.focused && classes.focused, fcs.required && classes.required), ref: ref }, other), children, fcs.required && /*#__PURE__*/ y$3("span", { "aria-hidden": true, className: clsx(classes.asterisk, fcs.error && classes.error) }, "\u2009", '*')); });
+var FormLabel$1 = withStyles(styles$u, { name: 'MuiFormLabel' })(FormLabel);
 function getScale(value) { return "scale(".concat(value, ", ").concat(Math.pow(value, 2), ")"); }
-var styles$m = { entering: { opacity: 1, transform: getScale(1) }, entered: { opacity: 1, transform: 'none' } };
+var styles$t = { entering: { opacity: 1, transform: getScale(1) }, entered: { opacity: 1, transform: 'none' } };
 var Grow = /*#__PURE__*/ N$1(function Grow(props, ref) { var children = props.children, _props$disableStrictM = props.disableStrictModeCompat, disableStrictModeCompat = _props$disableStrictM === void 0 ? false : _props$disableStrictM, inProp = props["in"], onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, style = props.style, _props$timeout = props.timeout, timeout = _props$timeout === void 0 ? 'auto' : _props$timeout, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Transition : _props$TransitionComp, other = _objectWithoutProperties$2(props, ["children", "disableStrictModeCompat", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"]); var timer = _$1(); var autoTimeout = _$1(); var theme = useTheme(); var enableStrictModeCompat = theme.unstable_strictMode && !disableStrictModeCompat; var nodeRef = _$1(null); var foreignRef = useForkRef(children.ref, ref); var handleRef = useForkRef(enableStrictModeCompat ? nodeRef : undefined, foreignRef); var normalizedTransitionCallback = function normalizedTransitionCallback(callback) { return function (nodeOrAppearing, maybeAppearing) { if (callback) {
-    var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], _ref2 = _slicedToArray(_ref, 2), node = _ref2[0], isAppearing = _ref2[1];
+    var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], _ref2 = _slicedToArray$1(_ref, 2), node = _ref2[0], isAppearing = _ref2[1];
     if (isAppearing === undefined) {
         callback(node);
     }
@@ -7362,7 +7466,7 @@ else {
     onExit(node);
 } }); var handleExited = normalizedTransitionCallback(onExited); var addEndListener = function addEndListener(nodeOrNext, maybeNext) { var next = enableStrictModeCompat ? nodeOrNext : maybeNext; if (timeout === 'auto') {
     timer.current = setTimeout(next, autoTimeout.current || 0);
-} }; p$3(function () { return function () { clearTimeout(timer.current); }; }, []); return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": inProp, nodeRef: enableStrictModeCompat ? nodeRef : undefined, onEnter: handleEnter, onEntered: handleEntered, onEntering: handleEntering, onExit: handleExit, onExited: handleExited, onExiting: handleExiting, addEndListener: addEndListener, timeout: timeout === 'auto' ? null : timeout }, other), function (state, childProps) { return /*#__PURE__*/ sn(children, _extends$4({ style: _extends$4({ opacity: 0, transform: getScale(0.75), visibility: state === 'exited' && !inProp ? 'hidden' : undefined }, styles$m[state], style, children.props.style), ref: handleRef }, childProps)); }); });
+} }; p$3(function () { return function () { clearTimeout(timer.current); }; }, []); return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": inProp, nodeRef: enableStrictModeCompat ? nodeRef : undefined, onEnter: handleEnter, onEntered: handleEntered, onEntering: handleEntering, onExit: handleExit, onExited: handleExited, onExiting: handleExiting, addEndListener: addEndListener, timeout: timeout === 'auto' ? null : timeout }, other), function (state, childProps) { return /*#__PURE__*/ sn(children, _extends$4({ style: _extends$4({ opacity: 0, transform: getScale(0.75), visibility: state === 'exited' && !inProp ? 'hidden' : undefined }, styles$t[state], style, children.props.style), ref: handleRef }, childProps)); }); });
 Grow.muiSupportAuto = true;
 function useMediaQuery(queryInput) { var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; var theme = useTheme$1(); var props = getThemeProps({ theme: theme, name: 'MuiUseMediaQuery', props: {} }); var query = typeof queryInput === 'function' ? queryInput(theme) : queryInput; query = query.replace(/^@media( ?)/m, ''); var supportMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia !== 'undefined'; var _props$options = _extends$4({}, props, options), _props$options$defaul = _props$options.defaultMatches, defaultMatches = _props$options$defaul === void 0 ? false : _props$options$defaul, _props$options$matchM = _props$options.matchMedia, matchMedia = _props$options$matchM === void 0 ? supportMatchMedia ? window.matchMedia : null : _props$options$matchM, _props$options$noSsr = _props$options.noSsr, noSsr = _props$options$noSsr === void 0 ? false : _props$options$noSsr, _props$options$ssrMat = _props$options.ssrMatchMedia, ssrMatchMedia = _props$options$ssrMat === void 0 ? null : _props$options$ssrMat; var _React$useState = h$4(function () { if (noSsr && supportMatchMedia) {
     return matchMedia(query).matches;
@@ -7373,15 +7477,20 @@ function useMediaQuery(queryInput) { var options = arguments.length > 1 && argum
 } var queryList = matchMedia(query); var updateMatch = function updateMatch() { if (active) {
     setMatch(queryList.matches);
 } }; updateMatch(); queryList.addListener(updateMatch); return function () { active = false; queryList.removeListener(updateMatch); }; }, [query, matchMedia, supportMatchMedia]); return match; }
-var styles$l = function styles(theme) { var light = theme.palette.type === 'light'; var bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)'; return { root: { position: 'relative' }, formControl: { 'label + &': { marginTop: 16 } }, focused: {}, disabled: {}, colorSecondary: { '&$underline:after': { borderBottomColor: theme.palette.secondary.main } }, underline: { '&:after': { borderBottom: "2px solid ".concat(theme.palette.primary.main), left: 0, bottom: 0, content: '""', position: 'absolute', right: 0, transform: 'scaleX(0)', transition: theme.transitions.create('transform', { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }), pointerEvents: 'none' }, '&$focused:after': { transform: 'scaleX(1)' }, '&$error:after': { borderBottomColor: theme.palette.error.main, transform: 'scaleX(1)' }, '&:before': { borderBottom: "1px solid ".concat(bottomLineColor), left: 0, bottom: 0, content: '"\\00a0"', position: 'absolute', right: 0, transition: theme.transitions.create('border-bottom-color', { duration: theme.transitions.duration.shorter }), pointerEvents: 'none' }, '&:hover:not($disabled):before': { borderBottom: "2px solid ".concat(theme.palette.text.primary), '@media (hover: none)': { borderBottom: "1px solid ".concat(bottomLineColor) } }, '&$disabled:before': { borderBottomStyle: 'dotted' } }, error: {}, marginDense: {}, multiline: {}, fullWidth: {}, input: {}, inputMarginDense: {}, inputMultiline: {}, inputTypeSearch: {} }; };
-var Input$1 = /*#__PURE__*/ N$1(function Input(props, ref) { var disableUnderline = props.disableUnderline, classes = props.classes, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$inputComponent = props.inputComponent, inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent, _props$multiline = props.multiline, multiline = _props$multiline === void 0 ? false : _props$multiline, _props$type = props.type, type = _props$type === void 0 ? 'text' : _props$type, other = _objectWithoutProperties$2(props, ["disableUnderline", "classes", "fullWidth", "inputComponent", "multiline", "type"]); return /*#__PURE__*/ y$3(InputBase$1, _extends$4({ classes: _extends$4({}, classes, { root: clsx(classes.root, !disableUnderline && classes.underline), underline: null }), fullWidth: fullWidth, inputComponent: inputComponent, multiline: multiline, ref: ref, type: type }, other)); });
-Input$1.muiName = 'Input';
-var Input$2 = withStyles(styles$l, { name: 'MuiInput' })(Input$1);
+var styles$s = function styles(theme) { var light = theme.palette.type === 'light'; var bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)'; return { root: { position: 'relative' }, formControl: { 'label + &': { marginTop: 16 } }, focused: {}, disabled: {}, colorSecondary: { '&$underline:after': { borderBottomColor: theme.palette.secondary.main } }, underline: { '&:after': { borderBottom: "2px solid ".concat(theme.palette.primary.main), left: 0, bottom: 0, content: '""', position: 'absolute', right: 0, transform: 'scaleX(0)', transition: theme.transitions.create('transform', { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }), pointerEvents: 'none' }, '&$focused:after': { transform: 'scaleX(1)' }, '&$error:after': { borderBottomColor: theme.palette.error.main, transform: 'scaleX(1)' }, '&:before': { borderBottom: "1px solid ".concat(bottomLineColor), left: 0, bottom: 0, content: '"\\00a0"', position: 'absolute', right: 0, transition: theme.transitions.create('border-bottom-color', { duration: theme.transitions.duration.shorter }), pointerEvents: 'none' }, '&:hover:not($disabled):before': { borderBottom: "2px solid ".concat(theme.palette.text.primary), '@media (hover: none)': { borderBottom: "1px solid ".concat(bottomLineColor) } }, '&$disabled:before': { borderBottomStyle: 'dotted' } }, error: {}, marginDense: {}, multiline: {}, fullWidth: {}, input: {}, inputMarginDense: {}, inputMultiline: {}, inputTypeSearch: {} }; };
+var Input$2 = /*#__PURE__*/ N$1(function Input(props, ref) { var disableUnderline = props.disableUnderline, classes = props.classes, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$inputComponent = props.inputComponent, inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent, _props$multiline = props.multiline, multiline = _props$multiline === void 0 ? false : _props$multiline, _props$type = props.type, type = _props$type === void 0 ? 'text' : _props$type, other = _objectWithoutProperties$2(props, ["disableUnderline", "classes", "fullWidth", "inputComponent", "multiline", "type"]); return /*#__PURE__*/ y$3(InputBase$1, _extends$4({ classes: _extends$4({}, classes, { root: clsx(classes.root, !disableUnderline && classes.underline), underline: null }), fullWidth: fullWidth, inputComponent: inputComponent, multiline: multiline, ref: ref, type: type }, other)); });
+Input$2.muiName = 'Input';
+var Input$3 = withStyles(styles$s, { name: 'MuiInput' })(Input$2);
+var styles$r = function styles(theme) { return { root: { display: 'block', transformOrigin: 'top left' }, focused: {}, disabled: {}, error: {}, required: {}, asterisk: {}, formControl: { position: 'absolute', left: 0, top: 0, transform: 'translate(0, 24px) scale(1)' }, marginDense: { transform: 'translate(0, 21px) scale(1)' }, shrink: { transform: 'translate(0, 1.5px) scale(0.75)', transformOrigin: 'top left' }, animated: { transition: theme.transitions.create(['color', 'transform'], { duration: theme.transitions.duration.shorter, easing: theme.transitions.easing.easeOut }) }, filled: { zIndex: 1, pointerEvents: 'none', transform: 'translate(12px, 20px) scale(1)', '&$marginDense': { transform: 'translate(12px, 17px) scale(1)' }, '&$shrink': { transform: 'translate(12px, 10px) scale(0.75)', '&$marginDense': { transform: 'translate(12px, 7px) scale(0.75)' } } }, outlined: { zIndex: 1, pointerEvents: 'none', transform: 'translate(14px, 20px) scale(1)', '&$marginDense': { transform: 'translate(14px, 12px) scale(1)' }, '&$shrink': { transform: 'translate(14px, -6px) scale(0.75)' } } }; };
+var InputLabel = /*#__PURE__*/ N$1(function InputLabel(props, ref) { var classes = props.classes, className = props.className, _props$disableAnimati = props.disableAnimation, disableAnimation = _props$disableAnimati === void 0 ? false : _props$disableAnimati; props.margin; var shrinkProp = props.shrink; props.variant; var other = _objectWithoutProperties$2(props, ["classes", "className", "disableAnimation", "margin", "shrink", "variant"]); var muiFormControl = useFormControl(); var shrink = shrinkProp; if (typeof shrink === 'undefined' && muiFormControl) {
+    shrink = muiFormControl.filled || muiFormControl.focused || muiFormControl.adornedStart;
+} var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['margin', 'variant'] }); return /*#__PURE__*/ y$3(FormLabel$1, _extends$4({ "data-shrink": shrink, className: clsx(classes.root, className, muiFormControl && classes.formControl, !disableAnimation && classes.animated, shrink && classes.shrink, fcs.margin === 'dense' && classes.marginDense, { 'filled': classes.filled, 'outlined': classes.outlined }[fcs.variant]), classes: { focused: classes.focused, disabled: classes.disabled, error: classes.error, required: classes.required, asterisk: classes.asterisk }, ref: ref }, other)); });
+var InputLabel$1 = withStyles(styles$r, { name: 'MuiInputLabel' })(InputLabel);
 var ListContext = /*#__PURE__*/ F$4({});
-var styles$k = { root: { listStyle: 'none', margin: 0, padding: 0, position: 'relative' }, padding: { paddingTop: 8, paddingBottom: 8 }, dense: {}, subheader: { paddingTop: 0 } };
+var styles$q = { root: { listStyle: 'none', margin: 0, padding: 0, position: 'relative' }, padding: { paddingTop: 8, paddingBottom: 8 }, dense: {}, subheader: { paddingTop: 0 } };
 var List = /*#__PURE__*/ N$1(function List(props, ref) { var children = props.children, classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? 'ul' : _props$component, _props$dense = props.dense, dense = _props$dense === void 0 ? false : _props$dense, _props$disablePadding = props.disablePadding, disablePadding = _props$disablePadding === void 0 ? false : _props$disablePadding, subheader = props.subheader, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "component", "dense", "disablePadding", "subheader"]); var context = F$3(function () { return { dense: dense }; }, [dense]); return /*#__PURE__*/ y$3(ListContext.Provider, { value: context }, /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, dense && classes.dense, !disablePadding && classes.padding, subheader && classes.subheader), ref: ref }, other), subheader, children)); });
-var List$1 = withStyles(styles$k, { name: 'MuiList' })(List);
-var styles$j = function styles(theme) { return { root: { display: 'flex', justifyContent: 'flex-start', alignItems: 'center', position: 'relative', textDecoration: 'none', width: '100%', boxSizing: 'border-box', textAlign: 'left', paddingTop: 8, paddingBottom: 8, '&$focusVisible': { backgroundColor: theme.palette.action.selected }, '&$selected, &$selected:hover': { backgroundColor: theme.palette.action.selected }, '&$disabled': { opacity: 0.5 } }, container: { position: 'relative' }, focusVisible: {}, dense: { paddingTop: 4, paddingBottom: 4 }, alignItemsFlexStart: { alignItems: 'flex-start' }, disabled: {}, divider: { borderBottom: "1px solid ".concat(theme.palette.divider), backgroundClip: 'padding-box' }, gutters: { paddingLeft: 16, paddingRight: 16 }, button: { transition: theme.transitions.create('background-color', { duration: theme.transitions.duration.shortest }), '&:hover': { textDecoration: 'none', backgroundColor: theme.palette.action.hover, '@media (hover: none)': { backgroundColor: 'transparent' } } }, secondaryAction: { paddingRight: 48 }, selected: {} }; };
+var List$1 = withStyles(styles$q, { name: 'MuiList' })(List);
+var styles$p = function styles(theme) { return { root: { display: 'flex', justifyContent: 'flex-start', alignItems: 'center', position: 'relative', textDecoration: 'none', width: '100%', boxSizing: 'border-box', textAlign: 'left', paddingTop: 8, paddingBottom: 8, '&$focusVisible': { backgroundColor: theme.palette.action.selected }, '&$selected, &$selected:hover': { backgroundColor: theme.palette.action.selected }, '&$disabled': { opacity: 0.5 } }, container: { position: 'relative' }, focusVisible: {}, dense: { paddingTop: 4, paddingBottom: 4 }, alignItemsFlexStart: { alignItems: 'flex-start' }, disabled: {}, divider: { borderBottom: "1px solid ".concat(theme.palette.divider), backgroundClip: 'padding-box' }, gutters: { paddingLeft: 16, paddingRight: 16 }, button: { transition: theme.transitions.create('background-color', { duration: theme.transitions.duration.shortest }), '&:hover': { textDecoration: 'none', backgroundColor: theme.palette.action.hover, '@media (hover: none)': { backgroundColor: 'transparent' } } }, secondaryAction: { paddingRight: 48 }, selected: {} }; };
 var useEnhancedEffect$2 = typeof window === 'undefined' ? p$3 : y$2;
 var ListItem = /*#__PURE__*/ N$1(function ListItem(props, ref) { var _props$alignItems = props.alignItems, alignItems = _props$alignItems === void 0 ? 'center' : _props$alignItems, _props$autoFocus = props.autoFocus, autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus, _props$button = props.button, button = _props$button === void 0 ? false : _props$button, childrenProp = props.children, classes = props.classes, className = props.className, componentProp = props.component, _props$ContainerCompo = props.ContainerComponent, ContainerComponent = _props$ContainerCompo === void 0 ? 'li' : _props$ContainerCompo, _props$ContainerProps = props.ContainerProps; _props$ContainerProps = _props$ContainerProps === void 0 ? {} : _props$ContainerProps; var ContainerClassName = _props$ContainerProps.className, ContainerProps = _objectWithoutProperties$2(_props$ContainerProps, ["className"]), _props$dense = props.dense, dense = _props$dense === void 0 ? false : _props$dense, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, _props$disableGutters = props.disableGutters, disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters, _props$divider = props.divider, divider = _props$divider === void 0 ? false : _props$divider, focusVisibleClassName = props.focusVisibleClassName, _props$selected = props.selected, selected = _props$selected === void 0 ? false : _props$selected, other = _objectWithoutProperties$2(props, ["alignItems", "autoFocus", "button", "children", "classes", "className", "component", "ContainerComponent", "ContainerProps", "dense", "disabled", "disableGutters", "divider", "focusVisibleClassName", "selected"]); var context = q$5(ListContext); var childContext = { dense: dense || context.dense || false, alignItems: alignItems }; var listItemRef = _$1(null); useEnhancedEffect$2(function () { if (autoFocus) {
     if (listItemRef.current) {
@@ -7403,7 +7512,10 @@ var ListItem = /*#__PURE__*/ N$1(function ListItem(props, ref) { var _props$alig
     }
     return /*#__PURE__*/ y$3(ListContext.Provider, { value: childContext }, /*#__PURE__*/ y$3(ContainerComponent, _extends$4({ className: clsx(classes.container, ContainerClassName), ref: handleRef }, ContainerProps), /*#__PURE__*/ y$3(Component, componentProps, children), children.pop()));
 } return /*#__PURE__*/ y$3(ListContext.Provider, { value: childContext }, /*#__PURE__*/ y$3(Component, _extends$4({ ref: handleRef }, componentProps), children)); });
-var ListItem$1 = withStyles(styles$j, { name: 'MuiListItem' })(ListItem);
+var ListItem$1 = withStyles(styles$p, { name: 'MuiListItem' })(ListItem);
+var styles$o = function styles(theme) { return { root: { boxSizing: 'border-box', lineHeight: '48px', listStyle: 'none', color: theme.palette.text.secondary, fontFamily: theme.typography.fontFamily, fontWeight: theme.typography.fontWeightMedium, fontSize: theme.typography.pxToRem(14) }, colorPrimary: { color: theme.palette.primary.main }, colorInherit: { color: 'inherit' }, gutters: { paddingLeft: 16, paddingRight: 16 }, inset: { paddingLeft: 72 }, sticky: { position: 'sticky', top: 0, zIndex: 1, backgroundColor: 'inherit' } }; };
+var ListSubheader = /*#__PURE__*/ N$1(function ListSubheader(props, ref) { var classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'default' : _props$color, _props$component = props.component, Component = _props$component === void 0 ? 'li' : _props$component, _props$disableGutters = props.disableGutters, disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters, _props$disableSticky = props.disableSticky, disableSticky = _props$disableSticky === void 0 ? false : _props$disableSticky, _props$inset = props.inset, inset = _props$inset === void 0 ? false : _props$inset, other = _objectWithoutProperties$2(props, ["classes", "className", "color", "component", "disableGutters", "disableSticky", "inset"]); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className, color !== 'default' && classes["color".concat(capitalize(color))], inset && classes.inset, !disableSticky && classes.sticky, !disableGutters && classes.gutters), ref: ref }, other)); });
+var ListSubheader$1 = withStyles(styles$o, { name: 'MuiListSubheader' })(ListSubheader);
 function getOffsetTop(rect, vertical) { var offset = 0; if (typeof vertical === 'number') {
     offset = vertical;
 }
@@ -7428,7 +7540,7 @@ function getScrollParent$1(parent, child) { var element = child; var scrollTop =
     scrollTop += element.scrollTop;
 } return scrollTop; }
 function getAnchorEl$1(anchorEl) { return typeof anchorEl === 'function' ? anchorEl() : anchorEl; }
-var styles$i = { root: {}, paper: { position: 'absolute', overflowY: 'auto', overflowX: 'hidden', minWidth: 16, minHeight: 16, maxWidth: 'calc(100% - 32px)', maxHeight: 'calc(100% - 32px)', outline: 0 } };
+var styles$n = { root: {}, paper: { position: 'absolute', overflowY: 'auto', overflowX: 'hidden', minWidth: 16, minHeight: 16, maxWidth: 'calc(100% - 32px)', maxHeight: 'calc(100% - 32px)', outline: 0 } };
 var Popover = /*#__PURE__*/ N$1(function Popover(props, ref) { var action = props.action, anchorEl = props.anchorEl, _props$anchorOrigin = props.anchorOrigin, anchorOrigin = _props$anchorOrigin === void 0 ? { vertical: 'top', horizontal: 'left' } : _props$anchorOrigin, anchorPosition = props.anchorPosition, _props$anchorReferenc = props.anchorReference, anchorReference = _props$anchorReferenc === void 0 ? 'anchorEl' : _props$anchorReferenc, children = props.children, classes = props.classes, className = props.className, containerProp = props.container, _props$elevation = props.elevation, elevation = _props$elevation === void 0 ? 8 : _props$elevation, getContentAnchorEl = props.getContentAnchorEl, _props$marginThreshol = props.marginThreshold, marginThreshold = _props$marginThreshol === void 0 ? 16 : _props$marginThreshol, onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, open = props.open, _props$PaperProps = props.PaperProps, PaperProps = _props$PaperProps === void 0 ? {} : _props$PaperProps, _props$transformOrigi = props.transformOrigin, transformOrigin = _props$transformOrigi === void 0 ? { vertical: 'top', horizontal: 'left' } : _props$transformOrigi, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp, _props$transitionDura = props.transitionDuration, transitionDurationProp = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura, _props$TransitionProp = props.TransitionProps, TransitionProps = _props$TransitionProp === void 0 ? {} : _props$TransitionProp, other = _objectWithoutProperties$2(props, ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "classes", "className", "container", "elevation", "getContentAnchorEl", "marginThreshold", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "open", "PaperProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"]); var paperRef = _$1(); var getAnchorOffset = T$2(function (contentAnchorOffset) { if (anchorReference === 'anchorPosition') {
     return anchorPosition;
 } var resolvedAnchorEl = getAnchorEl$1(anchorEl); var anchorElement = resolvedAnchorEl && resolvedAnchorEl.nodeType === 1 ? resolvedAnchorEl : ownerDocument(paperRef.current).body; var anchorRect = anchorElement.getBoundingClientRect(); var anchorVertical = contentAnchorOffset === 0 ? anchorOrigin.vertical : 'center'; return { top: anchorRect.top + getOffsetTop(anchorRect, anchorVertical), left: anchorRect.left + getOffsetLeft(anchorRect, anchorOrigin.horizontal) }; }, [anchorEl, anchorOrigin.horizontal, anchorOrigin.vertical, anchorPosition, anchorReference]); var getContentAnchorOffset = T$2(function (element) { var contentAnchorOffset = 0; if (getContentAnchorEl && anchorReference === 'anchorEl') {
@@ -7472,7 +7584,7 @@ else if (right > widthThreshold) {
 } var handleResize = debounce$1(function () { setPositioningStyles(); }); window.addEventListener('resize', handleResize); return function () { handleResize.clear(); window.removeEventListener('resize', handleResize); }; }, [open, setPositioningStyles]); var transitionDuration = transitionDurationProp; if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
     transitionDuration = undefined;
 } var container = containerProp || (anchorEl ? ownerDocument(getAnchorEl$1(anchorEl)).body : undefined); return /*#__PURE__*/ y$3(Modal$1, _extends$4({ container: container, open: open, ref: ref, BackdropProps: { invisible: true }, className: clsx(classes.root, className) }, other), /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": open, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExited: onExited, onExiting: onExiting, timeout: transitionDuration }, TransitionProps, { onEntering: createChainedFunction(handleEntering, TransitionProps.onEntering) }), /*#__PURE__*/ y$3(Paper$1, _extends$4({ elevation: elevation, ref: handlePaperRef }, PaperProps, { className: clsx(classes.paper, PaperProps.className) }), children))); });
-var Popover$1 = withStyles(styles$i, { name: 'MuiPopover' })(Popover);
+var Popover$1 = withStyles(styles$n, { name: 'MuiPopover' })(Popover);
 function nextItem(list, item, disableListWrap) { if (list === item) {
     return list.firstChild;
 } if (item && item.nextElementSibling) {
@@ -7577,7 +7689,7 @@ else if (key.length === 1) {
 } return child; }); return /*#__PURE__*/ y$3(List$1, _extends$4({ role: "menu", ref: handleRef, className: className, onKeyDown: handleKeyDown, tabIndex: autoFocus ? 0 : -1 }, other), items); });
 var RTL_ORIGIN = { vertical: 'top', horizontal: 'right' };
 var LTR_ORIGIN = { vertical: 'top', horizontal: 'left' };
-var styles$h = { paper: { maxHeight: 'calc(100% - 96px)', WebkitOverflowScrolling: 'touch' }, list: { outline: 0 } };
+var styles$m = { paper: { maxHeight: 'calc(100% - 96px)', WebkitOverflowScrolling: 'touch' }, list: { outline: 0 } };
 var Menu = /*#__PURE__*/ N$1(function Menu(props, ref) { var _props$autoFocus = props.autoFocus, autoFocus = _props$autoFocus === void 0 ? true : _props$autoFocus, children = props.children, classes = props.classes, _props$disableAutoFoc = props.disableAutoFocusItem, disableAutoFocusItem = _props$disableAutoFoc === void 0 ? false : _props$disableAutoFoc, _props$MenuListProps = props.MenuListProps, MenuListProps = _props$MenuListProps === void 0 ? {} : _props$MenuListProps, onClose = props.onClose, onEnteringProp = props.onEntering, open = props.open, _props$PaperProps = props.PaperProps, PaperProps = _props$PaperProps === void 0 ? {} : _props$PaperProps, PopoverClasses = props.PopoverClasses, _props$transitionDura = props.transitionDuration, transitionDuration = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura, _props$TransitionProp = props.TransitionProps; _props$TransitionProp = _props$TransitionProp === void 0 ? {} : _props$TransitionProp; var onEntering = _props$TransitionProp.onEntering, TransitionProps = _objectWithoutProperties$2(_props$TransitionProp, ["onEntering"]), _props$variant = props.variant, variant = _props$variant === void 0 ? 'selectedMenu' : _props$variant, other = _objectWithoutProperties$2(props, ["autoFocus", "children", "classes", "disableAutoFocusItem", "MenuListProps", "onClose", "onEntering", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant"]); var theme = useTheme(); var autoFocusItem = autoFocus && !disableAutoFocusItem && open; var menuListActionsRef = _$1(null); var contentAnchorRef = _$1(null); var getContentAnchorEl = function getContentAnchorEl() { return contentAnchorRef.current; }; var handleEntering = function handleEntering(element, isAppearing) { if (menuListActionsRef.current) {
     menuListActionsRef.current.adjustStyleForScrollbar(element, theme);
 } if (onEnteringProp) {
@@ -7601,28 +7713,28 @@ var Menu = /*#__PURE__*/ N$1(function Menu(props, ref) { var _props$autoFocus =
 } }); var items = A$3.map(children, function (child, index) { if (index === activeItemIndex) {
     return /*#__PURE__*/ sn(child, { ref: function ref(instance) { contentAnchorRef.current = vn(instance); setRef(child.ref, instance); } });
 } return child; }); return /*#__PURE__*/ y$3(Popover$1, _extends$4({ getContentAnchorEl: getContentAnchorEl, classes: PopoverClasses, onClose: onClose, TransitionProps: _extends$4({ onEntering: handleEntering }, TransitionProps), anchorOrigin: theme.direction === 'rtl' ? RTL_ORIGIN : LTR_ORIGIN, transformOrigin: theme.direction === 'rtl' ? RTL_ORIGIN : LTR_ORIGIN, PaperProps: _extends$4({}, PaperProps, { classes: _extends$4({}, PaperProps.classes, { root: classes.paper }) }), open: open, ref: ref, transitionDuration: transitionDuration }, other), /*#__PURE__*/ y$3(MenuList, _extends$4({ onKeyDown: handleListKeyDown, actions: menuListActionsRef, autoFocus: autoFocus && (activeItemIndex === -1 || disableAutoFocusItem), autoFocusItem: autoFocusItem, variant: variant }, MenuListProps, { className: clsx(classes.list, MenuListProps.className) }), items)); });
-var Menu$1 = withStyles(styles$h, { name: 'MuiMenu' })(Menu);
-var styles$g = function styles(theme) { return { root: _extends$4({}, theme.typography.body1, _defineProperty({ minHeight: 48, paddingTop: 6, paddingBottom: 6, boxSizing: 'border-box', width: 'auto', overflow: 'hidden', whiteSpace: 'nowrap' }, theme.breakpoints.up('sm'), { minHeight: 'auto' })), gutters: {}, selected: {}, dense: _extends$4({}, theme.typography.body2, { minHeight: 'auto' }) }; };
+var Menu$1 = withStyles(styles$m, { name: 'MuiMenu' })(Menu);
+var styles$l = function styles(theme) { return { root: _extends$4({}, theme.typography.body1, _defineProperty$1({ minHeight: 48, paddingTop: 6, paddingBottom: 6, boxSizing: 'border-box', width: 'auto', overflow: 'hidden', whiteSpace: 'nowrap' }, theme.breakpoints.up('sm'), { minHeight: 'auto' })), gutters: {}, selected: {}, dense: _extends$4({}, theme.typography.body2, { minHeight: 'auto' }) }; };
 var MenuItem$1 = /*#__PURE__*/ N$1(function MenuItem(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, component = _props$component === void 0 ? 'li' : _props$component, _props$disableGutters = props.disableGutters, disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters, ListItemClasses = props.ListItemClasses, _props$role = props.role, role = _props$role === void 0 ? 'menuitem' : _props$role, selected = props.selected, tabIndexProp = props.tabIndex, other = _objectWithoutProperties$2(props, ["classes", "className", "component", "disableGutters", "ListItemClasses", "role", "selected", "tabIndex"]); var tabIndex; if (!props.disabled) {
     tabIndex = tabIndexProp !== undefined ? tabIndexProp : -1;
 } return /*#__PURE__*/ y$3(ListItem$1, _extends$4({ button: true, role: role, tabIndex: tabIndex, component: component, selected: selected, disableGutters: disableGutters, classes: _extends$4({ dense: classes.dense }, ListItemClasses), className: clsx(classes.root, className, selected && classes.selected, !disableGutters && classes.gutters), ref: ref }, other)); });
-var MenuItem$2 = withStyles(styles$g, { name: 'MuiMenuItem' })(MenuItem$1);
+var MenuItem$2 = withStyles(styles$l, { name: 'MuiMenuItem' })(MenuItem$1);
 var NativeSelectInput = /*#__PURE__*/ N$1(function NativeSelectInput(props, ref) { var classes = props.classes, className = props.className, disabled = props.disabled, IconComponent = props.IconComponent, inputRef = props.inputRef, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["classes", "className", "disabled", "IconComponent", "inputRef", "variant"]); return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ y$3("select", _extends$4({ className: clsx(classes.root, classes.select, classes[variant], className, disabled && classes.disabled), disabled: disabled, ref: inputRef || ref }, other)), props.multiple ? null : /*#__PURE__*/ y$3(IconComponent, { className: clsx(classes.icon, classes["icon".concat(capitalize(variant))], disabled && classes.disabled) })); });
-var ArrowDropDownIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M7 10l5 5 5-5z" }));
-var styles$f = function styles(theme) { return { root: {}, select: { '-moz-appearance': 'none', '-webkit-appearance': 'none', userSelect: 'none', borderRadius: 0, minWidth: 16, cursor: 'pointer', '&:focus': { backgroundColor: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.05)', borderRadius: 0 }, '&::-ms-expand': { display: 'none' }, '&$disabled': { cursor: 'default' }, '&[multiple]': { height: 'auto' }, '&:not([multiple]) option, &:not([multiple]) optgroup': { backgroundColor: theme.palette.background.paper }, '&&': { paddingRight: 24 } }, filled: { '&&': { paddingRight: 32 } }, outlined: { borderRadius: theme.shape.borderRadius, '&&': { paddingRight: 32 } }, selectMenu: { height: 'auto', minHeight: '1.1876em', textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden' }, disabled: {}, icon: { position: 'absolute', right: 0, top: 'calc(50% - 12px)', pointerEvents: 'none', color: theme.palette.action.active, '&$disabled': { color: theme.palette.action.disabled } }, iconOpen: { transform: 'rotate(180deg)' }, iconFilled: { right: 7 }, iconOutlined: { right: 7 }, nativeInput: { bottom: 0, left: 0, position: 'absolute', opacity: 0, pointerEvents: 'none', width: '100%' } }; };
-var defaultInput = /*#__PURE__*/ y$3(Input$2, null);
-var NativeSelect = /*#__PURE__*/ N$1(function NativeSelect(props, ref) { var children = props.children, classes = props.classes, _props$IconComponent = props.IconComponent, IconComponent = _props$IconComponent === void 0 ? ArrowDropDownIcon : _props$IconComponent, _props$input = props.input, input = _props$input === void 0 ? defaultInput : _props$input, inputProps = props.inputProps; props.variant; var other = _objectWithoutProperties$2(props, ["children", "classes", "IconComponent", "input", "inputProps", "variant"]); var muiFormControl = useFormControl(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['variant'] }); return /*#__PURE__*/ sn(input, _extends$4({ inputComponent: NativeSelectInput, inputProps: _extends$4({ children: children, classes: classes, IconComponent: IconComponent, variant: fcs.variant, type: undefined }, inputProps, input ? input.props.inputProps : {}), ref: ref }, other)); });
+var ArrowDropDownIcon$1 = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M7 10l5 5 5-5z" }));
+var styles$k = function styles(theme) { return { root: {}, select: { '-moz-appearance': 'none', '-webkit-appearance': 'none', userSelect: 'none', borderRadius: 0, minWidth: 16, cursor: 'pointer', '&:focus': { backgroundColor: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.05)', borderRadius: 0 }, '&::-ms-expand': { display: 'none' }, '&$disabled': { cursor: 'default' }, '&[multiple]': { height: 'auto' }, '&:not([multiple]) option, &:not([multiple]) optgroup': { backgroundColor: theme.palette.background.paper }, '&&': { paddingRight: 24 } }, filled: { '&&': { paddingRight: 32 } }, outlined: { borderRadius: theme.shape.borderRadius, '&&': { paddingRight: 32 } }, selectMenu: { height: 'auto', minHeight: '1.1876em', textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden' }, disabled: {}, icon: { position: 'absolute', right: 0, top: 'calc(50% - 12px)', pointerEvents: 'none', color: theme.palette.action.active, '&$disabled': { color: theme.palette.action.disabled } }, iconOpen: { transform: 'rotate(180deg)' }, iconFilled: { right: 7 }, iconOutlined: { right: 7 }, nativeInput: { bottom: 0, left: 0, position: 'absolute', opacity: 0, pointerEvents: 'none', width: '100%' } }; };
+var defaultInput = /*#__PURE__*/ y$3(Input$3, null);
+var NativeSelect = /*#__PURE__*/ N$1(function NativeSelect(props, ref) { var children = props.children, classes = props.classes, _props$IconComponent = props.IconComponent, IconComponent = _props$IconComponent === void 0 ? ArrowDropDownIcon$1 : _props$IconComponent, _props$input = props.input, input = _props$input === void 0 ? defaultInput : _props$input, inputProps = props.inputProps; props.variant; var other = _objectWithoutProperties$2(props, ["children", "classes", "IconComponent", "input", "inputProps", "variant"]); var muiFormControl = useFormControl(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['variant'] }); return /*#__PURE__*/ sn(input, _extends$4({ inputComponent: NativeSelectInput, inputProps: _extends$4({ children: children, classes: classes, IconComponent: IconComponent, variant: fcs.variant, type: undefined }, inputProps, input ? input.props.inputProps : {}), ref: ref }, other)); });
 NativeSelect.muiName = 'Select';
-withStyles(styles$f, { name: 'MuiNativeSelect' })(NativeSelect);
-var styles$e = function styles(theme) { return { root: { position: 'absolute', bottom: 0, right: 0, top: -5, left: 0, margin: 0, padding: '0 8px', pointerEvents: 'none', borderRadius: 'inherit', borderStyle: 'solid', borderWidth: 1, overflow: 'hidden' }, legend: { textAlign: 'left', padding: 0, lineHeight: '11px', transition: theme.transitions.create('width', { duration: 150, easing: theme.transitions.easing.easeOut }) }, legendLabelled: { display: 'block', width: 'auto', textAlign: 'left', padding: 0, height: 11, fontSize: '0.75em', visibility: 'hidden', maxWidth: 0.01, transition: theme.transitions.create('max-width', { duration: 50, easing: theme.transitions.easing.easeOut }), '& > span': { paddingLeft: 5, paddingRight: 5, display: 'inline-block' } }, legendNotched: { maxWidth: 1000, transition: theme.transitions.create('max-width', { duration: 100, easing: theme.transitions.easing.easeOut, delay: 50 }) } }; };
+withStyles(styles$k, { name: 'MuiNativeSelect' })(NativeSelect);
+var styles$j = function styles(theme) { return { root: { position: 'absolute', bottom: 0, right: 0, top: -5, left: 0, margin: 0, padding: '0 8px', pointerEvents: 'none', borderRadius: 'inherit', borderStyle: 'solid', borderWidth: 1, overflow: 'hidden' }, legend: { textAlign: 'left', padding: 0, lineHeight: '11px', transition: theme.transitions.create('width', { duration: 150, easing: theme.transitions.easing.easeOut }) }, legendLabelled: { display: 'block', width: 'auto', textAlign: 'left', padding: 0, height: 11, fontSize: '0.75em', visibility: 'hidden', maxWidth: 0.01, transition: theme.transitions.create('max-width', { duration: 50, easing: theme.transitions.easing.easeOut }), '& > span': { paddingLeft: 5, paddingRight: 5, display: 'inline-block' } }, legendNotched: { maxWidth: 1000, transition: theme.transitions.create('max-width', { duration: 100, easing: theme.transitions.easing.easeOut, delay: 50 }) } }; };
 var NotchedOutline = /*#__PURE__*/ N$1(function NotchedOutline(props, ref) { props.children; var classes = props.classes, className = props.className, label = props.label, labelWidthProp = props.labelWidth, notched = props.notched, style = props.style, other = _objectWithoutProperties$2(props, ["children", "classes", "className", "label", "labelWidth", "notched", "style"]); var theme = useTheme(); var align = theme.direction === 'rtl' ? 'right' : 'left'; if (label !== undefined) {
     return /*#__PURE__*/ y$3("fieldset", _extends$4({ "aria-hidden": true, className: clsx(classes.root, className), ref: ref, style: style }, other), /*#__PURE__*/ y$3("legend", { className: clsx(classes.legendLabelled, notched && classes.legendNotched) }, label ? /*#__PURE__*/ y$3("span", null, label) : /*#__PURE__*/ y$3("span", { dangerouslySetInnerHTML: { __html: '&#8203;' } })));
-} var labelWidth = labelWidthProp > 0 ? labelWidthProp * 0.75 + 8 : 0.01; return /*#__PURE__*/ y$3("fieldset", _extends$4({ "aria-hidden": true, style: _extends$4(_defineProperty({}, "padding".concat(capitalize(align)), 8), style), className: clsx(classes.root, className), ref: ref }, other), /*#__PURE__*/ y$3("legend", { className: classes.legend, style: { width: notched ? labelWidth : 0.01 } }, /*#__PURE__*/ y$3("span", { dangerouslySetInnerHTML: { __html: '&#8203;' } }))); });
-var NotchedOutline$1 = withStyles(styles$e, { name: 'PrivateNotchedOutline' })(NotchedOutline);
-var styles$d = function styles(theme) { var borderColor = theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'; return { root: { position: 'relative', borderRadius: theme.shape.borderRadius, '&:hover $notchedOutline': { borderColor: theme.palette.text.primary }, '@media (hover: none)': { '&:hover $notchedOutline': { borderColor: borderColor } }, '&$focused $notchedOutline': { borderColor: theme.palette.primary.main, borderWidth: 2 }, '&$error $notchedOutline': { borderColor: theme.palette.error.main }, '&$disabled $notchedOutline': { borderColor: theme.palette.action.disabled } }, colorSecondary: { '&$focused $notchedOutline': { borderColor: theme.palette.secondary.main } }, focused: {}, disabled: {}, adornedStart: { paddingLeft: 14 }, adornedEnd: { paddingRight: 14 }, error: {}, marginDense: {}, multiline: { padding: '18.5px 14px', '&$marginDense': { paddingTop: 10.5, paddingBottom: 10.5 } }, notchedOutline: { borderColor: borderColor }, input: { padding: '18.5px 14px', '&:-webkit-autofill': { WebkitBoxShadow: theme.palette.type === 'light' ? null : '0 0 0 100px #266798 inset', WebkitTextFillColor: theme.palette.type === 'light' ? null : '#fff', caretColor: theme.palette.type === 'light' ? null : '#fff', borderRadius: 'inherit' } }, inputMarginDense: { paddingTop: 10.5, paddingBottom: 10.5 }, inputMultiline: { padding: 0 }, inputAdornedStart: { paddingLeft: 0 }, inputAdornedEnd: { paddingRight: 0 } }; };
+} var labelWidth = labelWidthProp > 0 ? labelWidthProp * 0.75 + 8 : 0.01; return /*#__PURE__*/ y$3("fieldset", _extends$4({ "aria-hidden": true, style: _extends$4(_defineProperty$1({}, "padding".concat(capitalize(align)), 8), style), className: clsx(classes.root, className), ref: ref }, other), /*#__PURE__*/ y$3("legend", { className: classes.legend, style: { width: notched ? labelWidth : 0.01 } }, /*#__PURE__*/ y$3("span", { dangerouslySetInnerHTML: { __html: '&#8203;' } }))); });
+var NotchedOutline$1 = withStyles(styles$j, { name: 'PrivateNotchedOutline' })(NotchedOutline);
+var styles$i = function styles(theme) { var borderColor = theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'; return { root: { position: 'relative', borderRadius: theme.shape.borderRadius, '&:hover $notchedOutline': { borderColor: theme.palette.text.primary }, '@media (hover: none)': { '&:hover $notchedOutline': { borderColor: borderColor } }, '&$focused $notchedOutline': { borderColor: theme.palette.primary.main, borderWidth: 2 }, '&$error $notchedOutline': { borderColor: theme.palette.error.main }, '&$disabled $notchedOutline': { borderColor: theme.palette.action.disabled } }, colorSecondary: { '&$focused $notchedOutline': { borderColor: theme.palette.secondary.main } }, focused: {}, disabled: {}, adornedStart: { paddingLeft: 14 }, adornedEnd: { paddingRight: 14 }, error: {}, marginDense: {}, multiline: { padding: '18.5px 14px', '&$marginDense': { paddingTop: 10.5, paddingBottom: 10.5 } }, notchedOutline: { borderColor: borderColor }, input: { padding: '18.5px 14px', '&:-webkit-autofill': { WebkitBoxShadow: theme.palette.type === 'light' ? null : '0 0 0 100px #266798 inset', WebkitTextFillColor: theme.palette.type === 'light' ? null : '#fff', caretColor: theme.palette.type === 'light' ? null : '#fff', borderRadius: 'inherit' } }, inputMarginDense: { paddingTop: 10.5, paddingBottom: 10.5 }, inputMultiline: { padding: 0 }, inputAdornedStart: { paddingLeft: 0 }, inputAdornedEnd: { paddingRight: 0 } }; };
 var OutlinedInput = /*#__PURE__*/ N$1(function OutlinedInput(props, ref) { var classes = props.classes, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$inputComponent = props.inputComponent, inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent, label = props.label, _props$labelWidth = props.labelWidth, labelWidth = _props$labelWidth === void 0 ? 0 : _props$labelWidth, _props$multiline = props.multiline, multiline = _props$multiline === void 0 ? false : _props$multiline, notched = props.notched, _props$type = props.type, type = _props$type === void 0 ? 'text' : _props$type, other = _objectWithoutProperties$2(props, ["classes", "fullWidth", "inputComponent", "label", "labelWidth", "multiline", "notched", "type"]); return /*#__PURE__*/ y$3(InputBase$1, _extends$4({ renderSuffix: function renderSuffix(state) { return /*#__PURE__*/ y$3(NotchedOutline$1, { className: classes.notchedOutline, label: label, labelWidth: labelWidth, notched: typeof notched !== 'undefined' ? notched : Boolean(state.startAdornment || state.filled || state.focused) }); }, classes: _extends$4({}, classes, { root: clsx(classes.root, classes.underline), notchedOutline: null }), fullWidth: fullWidth, inputComponent: inputComponent, multiline: multiline, ref: ref, type: type }, other)); });
 OutlinedInput.muiName = 'Input';
-var OutlinedInput$1 = withStyles(styles$d, { name: 'MuiOutlinedInput' })(OutlinedInput);
+var OutlinedInput$1 = withStyles(styles$i, { name: 'MuiOutlinedInput' })(OutlinedInput);
 var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined' && typeof navigator !== 'undefined';
 var timeoutDuration = function () { var longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox']; for (var i = 0; i < longerTimeoutBrowsers.length; i += 1) {
     if (isBrowser && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) {
@@ -7821,10 +7933,10 @@ else {
 function find(arr, check) { if (Array.prototype.find) {
     return arr.find(check);
 } return arr.filter(check)[0]; }
-function findIndex(arr, prop, value) { if (Array.prototype.findIndex) {
+function findIndex$1(arr, prop, value) { if (Array.prototype.findIndex) {
     return arr.findIndex(function (cur) { return cur[prop] === value; });
 } var match = find(arr, function (obj) { return obj[prop] === value; }); return arr.indexOf(match); }
-function runModifiers(modifiers, data, ends) { var modifiersToRun = ends === undefined ? modifiers : modifiers.slice(0, findIndex(modifiers, 'name', ends)); modifiersToRun.forEach(function (modifier) { if (modifier['function']) {
+function runModifiers(modifiers, data, ends) { var modifiersToRun = ends === undefined ? modifiers : modifiers.slice(0, findIndex$1(modifiers, 'name', ends)); modifiersToRun.forEach(function (modifier) { if (modifier['function']) {
     console.warn('`modifier.function` is deprecated, use `modifier.fn`!');
 } var fn = modifier['function'] || modifier.fn; if (modifier.enabled && isFunction(fn)) {
     data.offsets.popper = getClientRect(data.offsets.popper);
@@ -8127,11 +8239,30 @@ var Popper = /*#__PURE__*/ N$1(function Popper(props, ref) { var anchorEl = prop
 } var childProps = { placement: placement }; if (transition) {
     childProps.TransitionProps = { "in": open, onEnter: handleEnter, onExited: handleExited };
 } return /*#__PURE__*/ y$3(Portal, { disablePortal: disablePortal, container: container }, /*#__PURE__*/ y$3("div", _extends$4({ ref: handleRef, role: "tooltip" }, other, { style: _extends$4({ position: 'fixed', top: 0, left: 0, display: !open && keepMounted && !transition ? 'none' : null }, style) }), typeof children === 'function' ? children(childProps) : children)); });
-function areEqualValues(a, b) { if (_typeof$3(b) === 'object' && b !== null) {
+var RadioButtonUncheckedIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" }));
+var RadioButtonCheckedIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z" }));
+var styles$h = function styles(theme) { return { root: { position: 'relative', display: 'flex', '&$checked $layer': { transform: 'scale(1)', transition: theme.transitions.create('transform', { easing: theme.transitions.easing.easeOut, duration: theme.transitions.duration.shortest }) } }, layer: { left: 0, position: 'absolute', transform: 'scale(0)', transition: theme.transitions.create('transform', { easing: theme.transitions.easing.easeIn, duration: theme.transitions.duration.shortest }) }, checked: {} }; };
+function RadioButtonIcon(props) { var checked = props.checked, classes = props.classes, fontSize = props.fontSize; return /*#__PURE__*/ y$3("div", { className: clsx(classes.root, checked && classes.checked) }, /*#__PURE__*/ y$3(RadioButtonUncheckedIcon, { fontSize: fontSize }), /*#__PURE__*/ y$3(RadioButtonCheckedIcon, { fontSize: fontSize, className: classes.layer })); }
+var RadioButtonIcon$1 = withStyles(styles$h, { name: 'PrivateRadioButtonIcon' })(RadioButtonIcon);
+var RadioGroupContext = /*#__PURE__*/ F$4();
+function useRadioGroup() { return q$5(RadioGroupContext); }
+var styles$g = function styles(theme) { return { root: { color: theme.palette.text.secondary }, checked: {}, disabled: {}, colorPrimary: { '&$checked': { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, '&$disabled': { color: theme.palette.action.disabled } }, colorSecondary: { '&$checked': { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, '&$disabled': { color: theme.palette.action.disabled } } }; };
+var defaultCheckedIcon = /*#__PURE__*/ y$3(RadioButtonIcon$1, { checked: true });
+var defaultIcon = /*#__PURE__*/ y$3(RadioButtonIcon$1, null);
+var Radio = /*#__PURE__*/ N$1(function Radio(props, ref) { var checkedProp = props.checked, classes = props.classes, _props$color = props.color, color = _props$color === void 0 ? 'secondary' : _props$color, nameProp = props.name, onChangeProp = props.onChange, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, other = _objectWithoutProperties$2(props, ["checked", "classes", "color", "name", "onChange", "size"]); var radioGroup = useRadioGroup(); var checked = checkedProp; var onChange = createChainedFunction(onChangeProp, radioGroup && radioGroup.onChange); var name = nameProp; if (radioGroup) {
+    if (typeof checked === 'undefined') {
+        checked = radioGroup.value === props.value;
+    }
+    if (typeof name === 'undefined') {
+        name = radioGroup.name;
+    }
+} return /*#__PURE__*/ y$3(SwitchBase$1, _extends$4({ color: color, type: "radio", icon: /*#__PURE__*/ sn(defaultIcon, { fontSize: size === 'small' ? 'small' : 'medium' }), checkedIcon: /*#__PURE__*/ sn(defaultCheckedIcon, { fontSize: size === 'small' ? 'small' : 'medium' }), classes: { root: clsx(classes.root, classes["color".concat(capitalize(color))]), checked: classes.checked, disabled: classes.disabled }, name: name, checked: checked, onChange: onChange, ref: ref }, other)); });
+var MUIRadio = withStyles(styles$g, { name: 'MuiRadio' })(Radio);
+function areEqualValues(a, b) { if (_typeof$4(b) === 'object' && b !== null) {
     return a === b;
 } return String(a) === String(b); }
 function isEmpty(display) { return display == null || typeof display === 'string' && !display.trim(); }
-var SelectInput = /*#__PURE__*/ N$1(function SelectInput(props, ref) { var ariaLabel = props['aria-label'], autoFocus = props.autoFocus, autoWidth = props.autoWidth, children = props.children, classes = props.classes, className = props.className, defaultValue = props.defaultValue, disabled = props.disabled, displayEmpty = props.displayEmpty, IconComponent = props.IconComponent, inputRefProp = props.inputRef, labelId = props.labelId, _props$MenuProps = props.MenuProps, MenuProps = _props$MenuProps === void 0 ? {} : _props$MenuProps, multiple = props.multiple, name = props.name, onBlur = props.onBlur, onChange = props.onChange, onClose = props.onClose, onFocus = props.onFocus, onOpen = props.onOpen, openProp = props.open, readOnly = props.readOnly, renderValue = props.renderValue, _props$SelectDisplayP = props.SelectDisplayProps, SelectDisplayProps = _props$SelectDisplayP === void 0 ? {} : _props$SelectDisplayP, tabIndexProp = props.tabIndex; props.type; var valueProp = props.value, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["aria-label", "autoFocus", "autoWidth", "children", "classes", "className", "defaultValue", "disabled", "displayEmpty", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"]); var _useControlled = useControlled({ controlled: valueProp, "default": defaultValue, name: 'Select' }), _useControlled2 = _slicedToArray(_useControlled, 2), value = _useControlled2[0], setValue = _useControlled2[1]; var inputRef = _$1(null); var _React$useState = h$4(null), displayNode = _React$useState[0], setDisplayNode = _React$useState[1]; var _React$useRef = _$1(openProp != null), isOpenControlled = _React$useRef.current; var _React$useState2 = h$4(), menuMinWidthState = _React$useState2[0], setMenuMinWidthState = _React$useState2[1]; var _React$useState3 = h$4(false), openState = _React$useState3[0], setOpenState = _React$useState3[1]; var handleRef = useForkRef(ref, inputRefProp); A$4(handleRef, function () { return { focus: function focus() { displayNode.focus(); }, node: inputRef.current, value: value }; }, [displayNode, value]); p$3(function () { if (autoFocus && displayNode) {
+var SelectInput = /*#__PURE__*/ N$1(function SelectInput(props, ref) { var ariaLabel = props['aria-label'], autoFocus = props.autoFocus, autoWidth = props.autoWidth, children = props.children, classes = props.classes, className = props.className, defaultValue = props.defaultValue, disabled = props.disabled, displayEmpty = props.displayEmpty, IconComponent = props.IconComponent, inputRefProp = props.inputRef, labelId = props.labelId, _props$MenuProps = props.MenuProps, MenuProps = _props$MenuProps === void 0 ? {} : _props$MenuProps, multiple = props.multiple, name = props.name, onBlur = props.onBlur, onChange = props.onChange, onClose = props.onClose, onFocus = props.onFocus, onOpen = props.onOpen, openProp = props.open, readOnly = props.readOnly, renderValue = props.renderValue, _props$SelectDisplayP = props.SelectDisplayProps, SelectDisplayProps = _props$SelectDisplayP === void 0 ? {} : _props$SelectDisplayP, tabIndexProp = props.tabIndex; props.type; var valueProp = props.value, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["aria-label", "autoFocus", "autoWidth", "children", "classes", "className", "defaultValue", "disabled", "displayEmpty", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"]); var _useControlled = useControlled({ controlled: valueProp, "default": defaultValue, name: 'Select' }), _useControlled2 = _slicedToArray$1(_useControlled, 2), value = _useControlled2[0], setValue = _useControlled2[1]; var inputRef = _$1(null); var _React$useState = h$4(null), displayNode = _React$useState[0], setDisplayNode = _React$useState[1]; var _React$useRef = _$1(openProp != null), isOpenControlled = _React$useRef.current; var _React$useState2 = h$4(), menuMinWidthState = _React$useState2[0], setMenuMinWidthState = _React$useState2[1]; var _React$useState3 = h$4(false), openState = _React$useState3[0], setOpenState = _React$useState3[1]; var handleRef = useForkRef(ref, inputRefProp); A$4(handleRef, function () { return { focus: function focus() { displayNode.focus(); }, node: inputRef.current, value: value }; }, [displayNode, value]); p$3(function () { if (autoFocus && displayNode) {
     displayNode.focus();
 } }, [autoFocus, displayNode]); p$3(function () { if (displayNode) {
     var label = ownerDocument(displayNode).getElementById(labelId);
@@ -8227,16 +8358,16 @@ else {
 else {
     tabIndex = disabled ? null : 0;
 } var buttonId = SelectDisplayProps.id || (name ? "mui-component-select-".concat(name) : undefined); return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, classes.select, classes.selectMenu, classes[variant], className, disabled && classes.disabled), ref: setDisplayNode, tabIndex: tabIndex, role: "button", "aria-disabled": disabled ? 'true' : undefined, "aria-expanded": open ? 'true' : undefined, "aria-haspopup": "listbox", "aria-label": ariaLabel, "aria-labelledby": [labelId, buttonId].filter(Boolean).join(' ') || undefined, onKeyDown: handleKeyDown, onMouseDown: disabled || readOnly ? null : handleMouseDown, onBlur: handleBlur, onFocus: onFocus }, SelectDisplayProps, { id: buttonId }), isEmpty(display) ? /*#__PURE__*/ y$3("span", { dangerouslySetInnerHTML: { __html: '&#8203;' } }) : display), /*#__PURE__*/ y$3("input", _extends$4({ value: Array.isArray(value) ? value.join(',') : value, name: name, ref: inputRef, "aria-hidden": true, onChange: handleChange, tabIndex: -1, className: classes.nativeInput, autoFocus: autoFocus }, other)), /*#__PURE__*/ y$3(IconComponent, { className: clsx(classes.icon, classes["icon".concat(capitalize(variant))], open && classes.iconOpen, disabled && classes.disabled) }), /*#__PURE__*/ y$3(Menu$1, _extends$4({ id: "menu-".concat(name || ''), anchorEl: displayNode, open: open, onClose: handleClose }, MenuProps, { MenuListProps: _extends$4({ 'aria-labelledby': labelId, role: 'listbox', disableListWrap: true }, MenuProps.MenuListProps), PaperProps: _extends$4({}, MenuProps.PaperProps, { style: _extends$4({ minWidth: menuMinWidth }, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null) }) }), items)); });
-var styles$c = styles$f;
-var _ref$2 = /*#__PURE__*/ y$3(Input$2, null);
-var _ref2$1 = /*#__PURE__*/ y$3(FilledInput$1, null);
-var Select$1 = /*#__PURE__*/ N$1(function Select(props, ref) { var _props$autoWidth = props.autoWidth, autoWidth = _props$autoWidth === void 0 ? false : _props$autoWidth, children = props.children, classes = props.classes, _props$displayEmpty = props.displayEmpty, displayEmpty = _props$displayEmpty === void 0 ? false : _props$displayEmpty, _props$IconComponent = props.IconComponent, IconComponent = _props$IconComponent === void 0 ? ArrowDropDownIcon : _props$IconComponent, id = props.id, input = props.input, inputProps = props.inputProps, label = props.label, labelId = props.labelId, _props$labelWidth = props.labelWidth, labelWidth = _props$labelWidth === void 0 ? 0 : _props$labelWidth, MenuProps = props.MenuProps, _props$multiple = props.multiple, multiple = _props$multiple === void 0 ? false : _props$multiple, _props$native = props["native"], _native = _props$native === void 0 ? false : _props$native, onClose = props.onClose, onOpen = props.onOpen, open = props.open, renderValue = props.renderValue, SelectDisplayProps = props.SelectDisplayProps, _props$variant = props.variant, variantProps = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["autoWidth", "children", "classes", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "labelWidth", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"]); var inputComponent = _native ? NativeSelectInput : SelectInput; var muiFormControl = useFormControl(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['variant'] }); var variant = fcs.variant || variantProps; var InputComponent = input || { standard: _ref$2, outlined: /*#__PURE__*/ y$3(OutlinedInput$1, { label: label, labelWidth: labelWidth }), filled: _ref2$1 }[variant]; return /*#__PURE__*/ sn(InputComponent, _extends$4({ inputComponent: inputComponent, inputProps: _extends$4({ children: children, IconComponent: IconComponent, variant: variant, type: undefined, multiple: multiple }, _native ? { id: id } : { autoWidth: autoWidth, displayEmpty: displayEmpty, labelId: labelId, MenuProps: MenuProps, onClose: onClose, onOpen: onOpen, open: open, renderValue: renderValue, SelectDisplayProps: _extends$4({ id: id }, SelectDisplayProps) }, inputProps, { classes: inputProps ? mergeClasses({ baseClasses: classes, newClasses: inputProps.classes, Component: Select }) : classes }, input ? input.props.inputProps : {}), ref: ref }, other)); });
+var styles$f = styles$k;
+var _ref$3 = /*#__PURE__*/ y$3(Input$3, null);
+var _ref2$2 = /*#__PURE__*/ y$3(FilledInput$1, null);
+var Select$1 = /*#__PURE__*/ N$1(function Select(props, ref) { var _props$autoWidth = props.autoWidth, autoWidth = _props$autoWidth === void 0 ? false : _props$autoWidth, children = props.children, classes = props.classes, _props$displayEmpty = props.displayEmpty, displayEmpty = _props$displayEmpty === void 0 ? false : _props$displayEmpty, _props$IconComponent = props.IconComponent, IconComponent = _props$IconComponent === void 0 ? ArrowDropDownIcon$1 : _props$IconComponent, id = props.id, input = props.input, inputProps = props.inputProps, label = props.label, labelId = props.labelId, _props$labelWidth = props.labelWidth, labelWidth = _props$labelWidth === void 0 ? 0 : _props$labelWidth, MenuProps = props.MenuProps, _props$multiple = props.multiple, multiple = _props$multiple === void 0 ? false : _props$multiple, _props$native = props["native"], _native = _props$native === void 0 ? false : _props$native, onClose = props.onClose, onOpen = props.onOpen, open = props.open, renderValue = props.renderValue, SelectDisplayProps = props.SelectDisplayProps, _props$variant = props.variant, variantProps = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["autoWidth", "children", "classes", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "labelWidth", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"]); var inputComponent = _native ? NativeSelectInput : SelectInput; var muiFormControl = useFormControl(); var fcs = formControlState({ props: props, muiFormControl: muiFormControl, states: ['variant'] }); var variant = fcs.variant || variantProps; var InputComponent = input || { standard: _ref$3, outlined: /*#__PURE__*/ y$3(OutlinedInput$1, { label: label, labelWidth: labelWidth }), filled: _ref2$2 }[variant]; return /*#__PURE__*/ sn(InputComponent, _extends$4({ inputComponent: inputComponent, inputProps: _extends$4({ children: children, IconComponent: IconComponent, variant: variant, type: undefined, multiple: multiple }, _native ? { id: id } : { autoWidth: autoWidth, displayEmpty: displayEmpty, labelId: labelId, MenuProps: MenuProps, onClose: onClose, onOpen: onOpen, open: open, renderValue: renderValue, SelectDisplayProps: _extends$4({ id: id }, SelectDisplayProps) }, inputProps, { classes: inputProps ? mergeClasses({ baseClasses: classes, newClasses: inputProps.classes, Component: Select }) : classes }, input ? input.props.inputProps : {}), ref: ref }, other)); });
 Select$1.muiName = 'Select';
-var MuiSelect = withStyles(styles$c, { name: 'MuiSelect' })(Select$1);
-var styles$b = function styles(theme) { var emphasis = theme.palette.type === 'light' ? 0.8 : 0.98; var backgroundColor = emphasize(theme.palette.background["default"], emphasis); return { root: _extends$4({}, theme.typography.body2, _defineProperty({ color: theme.palette.getContrastText(backgroundColor), backgroundColor: backgroundColor, display: 'flex', alignItems: 'center', flexWrap: 'wrap', padding: '6px 16px', borderRadius: theme.shape.borderRadius, flexGrow: 1 }, theme.breakpoints.up('sm'), { flexGrow: 'initial', minWidth: 288 })), message: { padding: '8px 0' }, action: { display: 'flex', alignItems: 'center', marginLeft: 'auto', paddingLeft: 16, marginRight: -8 } }; };
+var MuiSelect = withStyles(styles$f, { name: 'MuiSelect' })(Select$1);
+var styles$e = function styles(theme) { var emphasis = theme.palette.type === 'light' ? 0.8 : 0.98; var backgroundColor = emphasize(theme.palette.background["default"], emphasis); return { root: _extends$4({}, theme.typography.body2, _defineProperty$1({ color: theme.palette.getContrastText(backgroundColor), backgroundColor: backgroundColor, display: 'flex', alignItems: 'center', flexWrap: 'wrap', padding: '6px 16px', borderRadius: theme.shape.borderRadius, flexGrow: 1 }, theme.breakpoints.up('sm'), { flexGrow: 'initial', minWidth: 288 })), message: { padding: '8px 0' }, action: { display: 'flex', alignItems: 'center', marginLeft: 'auto', paddingLeft: 16, marginRight: -8 } }; };
 var SnackbarContent = /*#__PURE__*/ N$1(function SnackbarContent(props, ref) { var action = props.action, classes = props.classes, className = props.className, message = props.message, _props$role = props.role, role = _props$role === void 0 ? 'alert' : _props$role, other = _objectWithoutProperties$2(props, ["action", "classes", "className", "message", "role"]); return /*#__PURE__*/ y$3(Paper$1, _extends$4({ role: role, square: true, elevation: 6, className: clsx(classes.root, className), ref: ref }, other), /*#__PURE__*/ y$3("div", { className: classes.message }, message), action ? /*#__PURE__*/ y$3("div", { className: classes.action }, action) : null); });
-var SnackbarContent$1 = withStyles(styles$b, { name: 'MuiSnackbarContent' })(SnackbarContent);
-var styles$a = function styles(theme) { var top1 = { top: 8 }; var bottom1 = { bottom: 8 }; var right = { justifyContent: 'flex-end' }; var left = { justifyContent: 'flex-start' }; var top3 = { top: 24 }; var bottom3 = { bottom: 24 }; var right3 = { right: 24 }; var left3 = { left: 24 }; var center = { left: '50%', right: 'auto', transform: 'translateX(-50%)' }; return { root: { zIndex: theme.zIndex.snackbar, position: 'fixed', display: 'flex', left: 8, right: 8, justifyContent: 'center', alignItems: 'center' }, anchorOriginTopCenter: _extends$4({}, top1, _defineProperty({}, theme.breakpoints.up('sm'), _extends$4({}, top3, center))), anchorOriginBottomCenter: _extends$4({}, bottom1, _defineProperty({}, theme.breakpoints.up('sm'), _extends$4({}, bottom3, center))), anchorOriginTopRight: _extends$4({}, top1, right, _defineProperty({}, theme.breakpoints.up('sm'), _extends$4({ left: 'auto' }, top3, right3))), anchorOriginBottomRight: _extends$4({}, bottom1, right, _defineProperty({}, theme.breakpoints.up('sm'), _extends$4({ left: 'auto' }, bottom3, right3))), anchorOriginTopLeft: _extends$4({}, top1, left, _defineProperty({}, theme.breakpoints.up('sm'), _extends$4({ right: 'auto' }, top3, left3))), anchorOriginBottomLeft: _extends$4({}, bottom1, left, _defineProperty({}, theme.breakpoints.up('sm'), _extends$4({ right: 'auto' }, bottom3, left3))) }; };
+var SnackbarContent$1 = withStyles(styles$e, { name: 'MuiSnackbarContent' })(SnackbarContent);
+var styles$d = function styles(theme) { var top1 = { top: 8 }; var bottom1 = { bottom: 8 }; var right = { justifyContent: 'flex-end' }; var left = { justifyContent: 'flex-start' }; var top3 = { top: 24 }; var bottom3 = { bottom: 24 }; var right3 = { right: 24 }; var left3 = { left: 24 }; var center = { left: '50%', right: 'auto', transform: 'translateX(-50%)' }; return { root: { zIndex: theme.zIndex.snackbar, position: 'fixed', display: 'flex', left: 8, right: 8, justifyContent: 'center', alignItems: 'center' }, anchorOriginTopCenter: _extends$4({}, top1, _defineProperty$1({}, theme.breakpoints.up('sm'), _extends$4({}, top3, center))), anchorOriginBottomCenter: _extends$4({}, bottom1, _defineProperty$1({}, theme.breakpoints.up('sm'), _extends$4({}, bottom3, center))), anchorOriginTopRight: _extends$4({}, top1, right, _defineProperty$1({}, theme.breakpoints.up('sm'), _extends$4({ left: 'auto' }, top3, right3))), anchorOriginBottomRight: _extends$4({}, bottom1, right, _defineProperty$1({}, theme.breakpoints.up('sm'), _extends$4({ left: 'auto' }, bottom3, right3))), anchorOriginTopLeft: _extends$4({}, top1, left, _defineProperty$1({}, theme.breakpoints.up('sm'), _extends$4({ right: 'auto' }, top3, left3))), anchorOriginBottomLeft: _extends$4({}, bottom1, left, _defineProperty$1({}, theme.breakpoints.up('sm'), _extends$4({ right: 'auto' }, bottom3, left3))) }; };
 var Snackbar = /*#__PURE__*/ N$1(function Snackbar(props, ref) { var action = props.action, _props$anchorOrigin = props.anchorOrigin; _props$anchorOrigin = _props$anchorOrigin === void 0 ? { vertical: 'bottom', horizontal: 'center' } : _props$anchorOrigin; var vertical = _props$anchorOrigin.vertical, horizontal = _props$anchorOrigin.horizontal, _props$autoHideDurati = props.autoHideDuration, autoHideDuration = _props$autoHideDurati === void 0 ? null : _props$autoHideDurati, children = props.children, classes = props.classes, className = props.className, ClickAwayListenerProps = props.ClickAwayListenerProps, ContentProps = props.ContentProps, _props$disableWindowB = props.disableWindowBlurListener, disableWindowBlurListener = _props$disableWindowB === void 0 ? false : _props$disableWindowB, message = props.message, onClose = props.onClose, onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, onMouseEnter = props.onMouseEnter, onMouseLeave = props.onMouseLeave, open = props.open, resumeHideDuration = props.resumeHideDuration, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp, _props$transitionDura = props.transitionDuration, transitionDuration = _props$transitionDura === void 0 ? { enter: duration.enteringScreen, exit: duration.leavingScreen } : _props$transitionDura, TransitionProps = props.TransitionProps, other = _objectWithoutProperties$2(props, ["action", "anchorOrigin", "autoHideDuration", "children", "classes", "className", "ClickAwayListenerProps", "ContentProps", "disableWindowBlurListener", "message", "onClose", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "onMouseEnter", "onMouseLeave", "open", "resumeHideDuration", "TransitionComponent", "transitionDuration", "TransitionProps"]); var timerAutoHide = _$1(); var _React$useState = h$4(true), exited = _React$useState[0], setExited = _React$useState[1]; var handleClose = useEventCallback(function () { if (onClose) {
     onClose.apply(void 0, arguments);
 } }); var setAutoHideTimer = useEventCallback(function (autoHideDurationParam) { if (!onClose || autoHideDurationParam == null) {
@@ -8258,19 +8389,22 @@ var Snackbar = /*#__PURE__*/ N$1(function Snackbar(props, ref) { var action = pr
 } return undefined; }, [disableWindowBlurListener, handleResume, open]); if (!open && exited) {
     return null;
 } return /*#__PURE__*/ y$3(ClickAwayListener, _extends$4({ onClickAway: handleClickAway }, ClickAwayListenerProps), /*#__PURE__*/ y$3("div", _extends$4({ className: clsx(classes.root, classes["anchorOrigin".concat(capitalize(vertical)).concat(capitalize(horizontal))], className), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, ref: ref }, other), /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ appear: true, "in": open, onEnter: createChainedFunction(handleEnter, onEnter), onEntered: onEntered, onEntering: onEntering, onExit: onExit, onExited: createChainedFunction(handleExited, onExited), onExiting: onExiting, timeout: transitionDuration, direction: vertical === 'top' ? 'down' : 'up' }, TransitionProps), children || /*#__PURE__*/ y$3(SnackbarContent$1, _extends$4({ message: message, action: action }, ContentProps))))); });
-var Snackbar$1 = withStyles(styles$a, { flip: false, name: 'MuiSnackbar' })(Snackbar);
+var Snackbar$1 = withStyles(styles$d, { flip: false, name: 'MuiSnackbar' })(Snackbar);
+var styles$c = function styles(theme) { return { root: { display: 'inline-flex', width: 34 + 12 * 2, height: 14 + 12 * 2, overflow: 'hidden', padding: 12, boxSizing: 'border-box', position: 'relative', flexShrink: 0, zIndex: 0, verticalAlign: 'middle', '@media print': { colorAdjust: 'exact' } }, edgeStart: { marginLeft: -8 }, edgeEnd: { marginRight: -8 }, switchBase: { position: 'absolute', top: 0, left: 0, zIndex: 1, color: theme.palette.type === 'light' ? theme.palette.grey[50] : theme.palette.grey[400], transition: theme.transitions.create(['left', 'transform'], { duration: theme.transitions.duration.shortest }), '&$checked': { transform: 'translateX(20px)' }, '&$disabled': { color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800] }, '&$checked + $track': { opacity: 0.5 }, '&$disabled + $track': { opacity: theme.palette.type === 'light' ? 0.12 : 0.1 } }, colorPrimary: { '&$checked': { color: theme.palette.primary.main, '&:hover': { backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, '&$disabled': { color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800] }, '&$checked + $track': { backgroundColor: theme.palette.primary.main }, '&$disabled + $track': { backgroundColor: theme.palette.type === 'light' ? theme.palette.common.black : theme.palette.common.white } }, colorSecondary: { '&$checked': { color: theme.palette.secondary.main, '&:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity), '@media (hover: none)': { backgroundColor: 'transparent' } } }, '&$disabled': { color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800] }, '&$checked + $track': { backgroundColor: theme.palette.secondary.main }, '&$disabled + $track': { backgroundColor: theme.palette.type === 'light' ? theme.palette.common.black : theme.palette.common.white } }, sizeSmall: { width: 40, height: 24, padding: 7, '& $thumb': { width: 16, height: 16 }, '& $switchBase': { padding: 4, '&$checked': { transform: 'translateX(16px)' } } }, checked: {}, disabled: {}, input: { left: '-100%', width: '300%' }, thumb: { boxShadow: theme.shadows[1], backgroundColor: 'currentColor', width: 20, height: 20, borderRadius: '50%' }, track: { height: '100%', width: '100%', borderRadius: 14 / 2, zIndex: -1, transition: theme.transitions.create(['opacity', 'background-color'], { duration: theme.transitions.duration.shortest }), backgroundColor: theme.palette.type === 'light' ? theme.palette.common.black : theme.palette.common.white, opacity: theme.palette.type === 'light' ? 0.38 : 0.3 } }; };
+var Switch$1 = /*#__PURE__*/ N$1(function Switch(props, ref) { var classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'secondary' : _props$color, _props$edge = props.edge, edge = _props$edge === void 0 ? false : _props$edge, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, other = _objectWithoutProperties$2(props, ["classes", "className", "color", "edge", "size"]); var icon = /*#__PURE__*/ y$3("span", { className: classes.thumb }); return /*#__PURE__*/ y$3("span", { className: clsx(classes.root, className, { 'start': classes.edgeStart, 'end': classes.edgeEnd }[edge], size === "small" && classes["size".concat(capitalize(size))]) }, /*#__PURE__*/ y$3(SwitchBase$1, _extends$4({ type: "checkbox", icon: icon, checkedIcon: icon, classes: { root: clsx(classes.switchBase, classes["color".concat(capitalize(color))]), input: classes.input, checked: classes.checked, disabled: classes.disabled }, ref: ref }, other)), /*#__PURE__*/ y$3("span", { className: classes.track })); });
+var MUISwitch = withStyles(styles$c, { name: 'MuiSwitch' })(Switch$1);
 var TableContext = /*#__PURE__*/ F$4();
-var styles$9 = function styles(theme) { return { root: { display: 'table', width: '100%', borderCollapse: 'collapse', borderSpacing: 0, '& caption': _extends$4({}, theme.typography.body2, { padding: theme.spacing(2), color: theme.palette.text.secondary, textAlign: 'left', captionSide: 'bottom' }) }, stickyHeader: { borderCollapse: 'separate' } }; };
+var styles$b = function styles(theme) { return { root: { display: 'table', width: '100%', borderCollapse: 'collapse', borderSpacing: 0, '& caption': _extends$4({}, theme.typography.body2, { padding: theme.spacing(2), color: theme.palette.text.secondary, textAlign: 'left', captionSide: 'bottom' }) }, stickyHeader: { borderCollapse: 'separate' } }; };
 var defaultComponent$3 = 'table';
 var Table$1 = /*#__PURE__*/ N$1(function Table(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? defaultComponent$3 : _props$component, _props$padding = props.padding, padding = _props$padding === void 0 ? 'normal' : _props$padding, _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size, _props$stickyHeader = props.stickyHeader, stickyHeader = _props$stickyHeader === void 0 ? false : _props$stickyHeader, other = _objectWithoutProperties$2(props, ["classes", "className", "component", "padding", "size", "stickyHeader"]); var table = F$3(function () { return { padding: padding, size: size, stickyHeader: stickyHeader }; }, [padding, size, stickyHeader]); return /*#__PURE__*/ y$3(TableContext.Provider, { value: table }, /*#__PURE__*/ y$3(Component, _extends$4({ role: Component === defaultComponent$3 ? null : 'table', ref: ref, className: clsx(classes.root, className, stickyHeader && classes.stickyHeader) }, other))); });
-var MUITable = withStyles(styles$9, { name: 'MuiTable' })(Table$1);
+var MUITable = withStyles(styles$b, { name: 'MuiTable' })(Table$1);
 var Tablelvl2Context = /*#__PURE__*/ F$4();
-var styles$8 = { root: { display: 'table-row-group' } };
+var styles$a = { root: { display: 'table-row-group' } };
 var tablelvl2$1 = { variant: 'body' };
 var defaultComponent$2 = 'tbody';
 var TableBody = /*#__PURE__*/ N$1(function TableBody(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? defaultComponent$2 : _props$component, other = _objectWithoutProperties$2(props, ["classes", "className", "component"]); return /*#__PURE__*/ y$3(Tablelvl2Context.Provider, { value: tablelvl2$1 }, /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className), ref: ref, role: Component === defaultComponent$2 ? null : 'rowgroup' }, other))); });
-var TableBody$1 = withStyles(styles$8, { name: 'MuiTableBody' })(TableBody);
-var styles$7 = function styles(theme) { return { root: _extends$4({}, theme.typography.body2, { display: 'table-cell', verticalAlign: 'inherit', borderBottom: "1px solid\n    ".concat(theme.palette.type === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68)), textAlign: 'left', padding: 16 }), head: { color: theme.palette.text.primary, lineHeight: theme.typography.pxToRem(24), fontWeight: theme.typography.fontWeightMedium }, body: { color: theme.palette.text.primary }, footer: { color: theme.palette.text.secondary, lineHeight: theme.typography.pxToRem(21), fontSize: theme.typography.pxToRem(12) }, sizeSmall: { padding: '6px 24px 6px 16px', '&:last-child': { paddingRight: 16 }, '&$paddingCheckbox': { width: 24, padding: '0 12px 0 16px', '&:last-child': { paddingLeft: 12, paddingRight: 16 }, '& > *': { padding: 0 } } }, paddingCheckbox: { width: 48, padding: '0 0 0 4px', '&:last-child': { paddingLeft: 0, paddingRight: 4 } }, paddingNone: { padding: 0, '&:last-child': { padding: 0 } }, alignLeft: { textAlign: 'left' }, alignCenter: { textAlign: 'center' }, alignRight: { textAlign: 'right', flexDirection: 'row-reverse' }, alignJustify: { textAlign: 'justify' }, stickyHeader: { position: 'sticky', top: 0, left: 0, zIndex: 2, backgroundColor: theme.palette.background["default"] } }; };
+var TableBody$1 = withStyles(styles$a, { name: 'MuiTableBody' })(TableBody);
+var styles$9 = function styles(theme) { return { root: _extends$4({}, theme.typography.body2, { display: 'table-cell', verticalAlign: 'inherit', borderBottom: "1px solid\n    ".concat(theme.palette.type === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68)), textAlign: 'left', padding: 16 }), head: { color: theme.palette.text.primary, lineHeight: theme.typography.pxToRem(24), fontWeight: theme.typography.fontWeightMedium }, body: { color: theme.palette.text.primary }, footer: { color: theme.palette.text.secondary, lineHeight: theme.typography.pxToRem(21), fontSize: theme.typography.pxToRem(12) }, sizeSmall: { padding: '6px 24px 6px 16px', '&:last-child': { paddingRight: 16 }, '&$paddingCheckbox': { width: 24, padding: '0 12px 0 16px', '&:last-child': { paddingLeft: 12, paddingRight: 16 }, '& > *': { padding: 0 } } }, paddingCheckbox: { width: 48, padding: '0 0 0 4px', '&:last-child': { paddingLeft: 0, paddingRight: 4 } }, paddingNone: { padding: 0, '&:last-child': { padding: 0 } }, alignLeft: { textAlign: 'left' }, alignCenter: { textAlign: 'center' }, alignRight: { textAlign: 'right', flexDirection: 'row-reverse' }, alignJustify: { textAlign: 'justify' }, stickyHeader: { position: 'sticky', top: 0, left: 0, zIndex: 2, backgroundColor: theme.palette.background["default"] } }; };
 var TableCell$1 = /*#__PURE__*/ N$1(function TableCell(props, ref) { var _props$align = props.align, align = _props$align === void 0 ? 'inherit' : _props$align, classes = props.classes, className = props.className, component = props.component, paddingProp = props.padding, scopeProp = props.scope, sizeProp = props.size, sortDirection = props.sortDirection, variantProp = props.variant, other = _objectWithoutProperties$2(props, ["align", "classes", "className", "component", "padding", "scope", "size", "sortDirection", "variant"]); var table = q$5(TableContext); var tablelvl2 = q$5(Tablelvl2Context); var isHeadCell = tablelvl2 && tablelvl2.variant === 'head'; var role; var Component; if (component) {
     Component = component;
     role = isHeadCell ? 'columnheader' : 'cell';
@@ -8282,42 +8416,60 @@ else {
 } var padding = paddingProp || (table && table.padding ? table.padding : 'normal'); var size = sizeProp || (table && table.size ? table.size : 'medium'); var variant = variantProp || tablelvl2 && tablelvl2.variant; var ariaSort = null; if (sortDirection) {
     ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
 } return /*#__PURE__*/ y$3(Component, _extends$4({ ref: ref, className: clsx(classes.root, classes[variant], className, align !== 'inherit' && classes["align".concat(capitalize(align))], padding !== 'normal' && classes["padding".concat(capitalize(padding))], size !== 'medium' && classes["size".concat(capitalize(size))], variant === 'head' && table && table.stickyHeader && classes.stickyHeader), "aria-sort": ariaSort, role: role, scope: scope }, other)); });
-var MUITableCell = withStyles(styles$7, { name: 'MuiTableCell' })(TableCell$1);
-var styles$6 = { root: { width: '100%', overflowX: 'auto' } };
+var MUITableCell = withStyles(styles$9, { name: 'MuiTableCell' })(TableCell$1);
+var styles$8 = { root: { width: '100%', overflowX: 'auto' } };
 var TableContainer = /*#__PURE__*/ N$1(function TableContainer(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? 'div' : _props$component, other = _objectWithoutProperties$2(props, ["classes", "className", "component"]); return /*#__PURE__*/ y$3(Component, _extends$4({ ref: ref, className: clsx(classes.root, className) }, other)); });
-var TableContainer$1 = withStyles(styles$6, { name: 'MuiTableContainer' })(TableContainer);
-var styles$5 = { root: { display: 'table-header-group' } };
+var TableContainer$1 = withStyles(styles$8, { name: 'MuiTableContainer' })(TableContainer);
+var styles$7 = { root: { display: 'table-header-group' } };
 var tablelvl2 = { variant: 'head' };
 var defaultComponent$1 = 'thead';
 var TableHead = /*#__PURE__*/ N$1(function TableHead(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? defaultComponent$1 : _props$component, other = _objectWithoutProperties$2(props, ["classes", "className", "component"]); return /*#__PURE__*/ y$3(Tablelvl2Context.Provider, { value: tablelvl2 }, /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className), ref: ref, role: Component === defaultComponent$1 ? null : 'rowgroup' }, other))); });
-var TableHead$1 = withStyles(styles$5, { name: 'MuiTableHead' })(TableHead);
-var styles$4 = function styles(theme) { return { root: { position: 'relative', display: 'flex', alignItems: 'center' }, gutters: _defineProperty({ paddingLeft: theme.spacing(2), paddingRight: theme.spacing(2) }, theme.breakpoints.up('sm'), { paddingLeft: theme.spacing(3), paddingRight: theme.spacing(3) }), regular: theme.mixins.toolbar, dense: { minHeight: 48 } }; };
+var TableHead$1 = withStyles(styles$7, { name: 'MuiTableHead' })(TableHead);
+var styles$6 = function styles(theme) { return { root: { position: 'relative', display: 'flex', alignItems: 'center' }, gutters: _defineProperty$1({ paddingLeft: theme.spacing(2), paddingRight: theme.spacing(2) }, theme.breakpoints.up('sm'), { paddingLeft: theme.spacing(3), paddingRight: theme.spacing(3) }), regular: theme.mixins.toolbar, dense: { minHeight: 48 } }; };
 var Toolbar = /*#__PURE__*/ N$1(function Toolbar(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? 'div' : _props$component, _props$disableGutters = props.disableGutters, disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters, _props$variant = props.variant, variant = _props$variant === void 0 ? 'regular' : _props$variant, other = _objectWithoutProperties$2(props, ["classes", "className", "component", "disableGutters", "variant"]); return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, classes[variant], className, !disableGutters && classes.gutters), ref: ref }, other)); });
-var Toolbar$1 = withStyles(styles$4, { name: 'MuiToolbar' })(Toolbar);
+var Toolbar$1 = withStyles(styles$6, { name: 'MuiToolbar' })(Toolbar);
 var KeyboardArrowLeft = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z" }));
 var KeyboardArrowRight = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" }));
-var _ref$1 = /*#__PURE__*/ y$3(KeyboardArrowRight, null);
-var _ref2 = /*#__PURE__*/ y$3(KeyboardArrowLeft, null);
+var _ref$2 = /*#__PURE__*/ y$3(KeyboardArrowRight, null);
+var _ref2$1 = /*#__PURE__*/ y$3(KeyboardArrowLeft, null);
 var _ref3 = /*#__PURE__*/ y$3(KeyboardArrowLeft, null);
 var _ref4 = /*#__PURE__*/ y$3(KeyboardArrowRight, null);
-var TablePaginationActions = /*#__PURE__*/ N$1(function TablePaginationActions(props, ref) { var backIconButtonProps = props.backIconButtonProps, count = props.count, nextIconButtonProps = props.nextIconButtonProps, _props$onChangePage = props.onChangePage, onChangePage = _props$onChangePage === void 0 ? function () { } : _props$onChangePage, _props$onPageChange = props.onPageChange, onPageChange = _props$onPageChange === void 0 ? function () { } : _props$onPageChange, page = props.page, rowsPerPage = props.rowsPerPage, other = _objectWithoutProperties$2(props, ["backIconButtonProps", "count", "nextIconButtonProps", "onChangePage", "onPageChange", "page", "rowsPerPage"]); var theme = useTheme(); var handleBackButtonClick = function handleBackButtonClick(event) { onChangePage(event, page - 1); onPageChange(event, page - 1); }; var handleNextButtonClick = function handleNextButtonClick(event) { onChangePage(event, page + 1); onPageChange(event, page + 1); }; return /*#__PURE__*/ y$3("div", _extends$4({ ref: ref }, other), /*#__PURE__*/ y$3(IconButton$1, _extends$4({ onClick: handleBackButtonClick, disabled: page === 0, color: "inherit" }, backIconButtonProps), theme.direction === 'rtl' ? _ref$1 : _ref2), /*#__PURE__*/ y$3(IconButton$1, _extends$4({ onClick: handleNextButtonClick, disabled: count !== -1 ? page >= Math.ceil(count / rowsPerPage) - 1 : false, color: "inherit" }, nextIconButtonProps), theme.direction === 'rtl' ? _ref3 : _ref4)); });
-var styles$3 = function styles(theme) { return { root: { color: theme.palette.text.primary, fontSize: theme.typography.pxToRem(14), overflow: 'auto', '&:last-child': { padding: 0 } }, toolbar: { minHeight: 52, paddingRight: 2 }, spacer: { flex: '1 1 100%' }, caption: { flexShrink: 0 }, selectRoot: { marginRight: 32, marginLeft: 8 }, select: { paddingLeft: 8, paddingRight: 24, textAlign: 'right', textAlignLast: 'right' }, selectIcon: {}, input: { color: 'inherit', fontSize: 'inherit', flexShrink: 0 }, menuItem: {}, actions: { flexShrink: 0, marginLeft: 20 } }; };
+var TablePaginationActions = /*#__PURE__*/ N$1(function TablePaginationActions(props, ref) { var backIconButtonProps = props.backIconButtonProps, count = props.count, nextIconButtonProps = props.nextIconButtonProps, _props$onChangePage = props.onChangePage, onChangePage = _props$onChangePage === void 0 ? function () { } : _props$onChangePage, _props$onPageChange = props.onPageChange, onPageChange = _props$onPageChange === void 0 ? function () { } : _props$onPageChange, page = props.page, rowsPerPage = props.rowsPerPage, other = _objectWithoutProperties$2(props, ["backIconButtonProps", "count", "nextIconButtonProps", "onChangePage", "onPageChange", "page", "rowsPerPage"]); var theme = useTheme(); var handleBackButtonClick = function handleBackButtonClick(event) { onChangePage(event, page - 1); onPageChange(event, page - 1); }; var handleNextButtonClick = function handleNextButtonClick(event) { onChangePage(event, page + 1); onPageChange(event, page + 1); }; return /*#__PURE__*/ y$3("div", _extends$4({ ref: ref }, other), /*#__PURE__*/ y$3(IconButton$1, _extends$4({ onClick: handleBackButtonClick, disabled: page === 0, color: "inherit" }, backIconButtonProps), theme.direction === 'rtl' ? _ref$2 : _ref2$1), /*#__PURE__*/ y$3(IconButton$1, _extends$4({ onClick: handleNextButtonClick, disabled: count !== -1 ? page >= Math.ceil(count / rowsPerPage) - 1 : false, color: "inherit" }, nextIconButtonProps), theme.direction === 'rtl' ? _ref3 : _ref4)); });
+var styles$5 = function styles(theme) { return { root: { color: theme.palette.text.primary, fontSize: theme.typography.pxToRem(14), overflow: 'auto', '&:last-child': { padding: 0 } }, toolbar: { minHeight: 52, paddingRight: 2 }, spacer: { flex: '1 1 100%' }, caption: { flexShrink: 0 }, selectRoot: { marginRight: 32, marginLeft: 8 }, select: { paddingLeft: 8, paddingRight: 24, textAlign: 'right', textAlignLast: 'right' }, selectIcon: {}, input: { color: 'inherit', fontSize: 'inherit', flexShrink: 0 }, menuItem: {}, actions: { flexShrink: 0, marginLeft: 20 } }; };
 var defaultLabelDisplayedRows = function defaultLabelDisplayedRows(_ref) { var from = _ref.from, to = _ref.to, count = _ref.count; return "".concat(from, "-").concat(to, " of ").concat(count !== -1 ? count : "more than ".concat(to)); };
-var defaultRowsPerPageOptions = [10, 25, 50, 100];
-var TablePagination = /*#__PURE__*/ N$1(function TablePagination(props, ref) { var _props$ActionsCompone = props.ActionsComponent, ActionsComponent = _props$ActionsCompone === void 0 ? TablePaginationActions : _props$ActionsCompone, backIconButtonProps = props.backIconButtonProps, _props$backIconButton = props.backIconButtonText, backIconButtonText = _props$backIconButton === void 0 ? 'Previous page' : _props$backIconButton, classes = props.classes, className = props.className, colSpanProp = props.colSpan, _props$component = props.component, Component = _props$component === void 0 ? MUITableCell : _props$component, count = props.count, _props$labelDisplayed = props.labelDisplayedRows, labelDisplayedRows = _props$labelDisplayed === void 0 ? defaultLabelDisplayedRows : _props$labelDisplayed, _props$labelRowsPerPa = props.labelRowsPerPage, labelRowsPerPage = _props$labelRowsPerPa === void 0 ? 'Rows per page:' : _props$labelRowsPerPa, nextIconButtonProps = props.nextIconButtonProps, _props$nextIconButton = props.nextIconButtonText, nextIconButtonText = _props$nextIconButton === void 0 ? 'Next page' : _props$nextIconButton, onChangePage = props.onChangePage, onPageChange = props.onPageChange, onChangeRowsPerPageProp = props.onChangeRowsPerPage, onRowsPerPageChangeProp = props.onRowsPerPageChange, page = props.page, rowsPerPage = props.rowsPerPage, _props$rowsPerPageOpt = props.rowsPerPageOptions, rowsPerPageOptions = _props$rowsPerPageOpt === void 0 ? defaultRowsPerPageOptions : _props$rowsPerPageOpt, _props$SelectProps = props.SelectProps, SelectProps = _props$SelectProps === void 0 ? {} : _props$SelectProps, other = _objectWithoutProperties$2(props, ["ActionsComponent", "backIconButtonProps", "backIconButtonText", "classes", "className", "colSpan", "component", "count", "labelDisplayedRows", "labelRowsPerPage", "nextIconButtonProps", "nextIconButtonText", "onChangePage", "onPageChange", "onChangeRowsPerPage", "onRowsPerPageChange", "page", "rowsPerPage", "rowsPerPageOptions", "SelectProps"]); var onChangeRowsPerPage = onChangeRowsPerPageProp || onRowsPerPageChangeProp; var colSpan; if (Component === MUITableCell || Component === 'td') {
+var defaultRowsPerPageOptions$1 = [10, 25, 50, 100];
+var TablePagination = /*#__PURE__*/ N$1(function TablePagination(props, ref) { var _props$ActionsCompone = props.ActionsComponent, ActionsComponent = _props$ActionsCompone === void 0 ? TablePaginationActions : _props$ActionsCompone, backIconButtonProps = props.backIconButtonProps, _props$backIconButton = props.backIconButtonText, backIconButtonText = _props$backIconButton === void 0 ? 'Previous page' : _props$backIconButton, classes = props.classes, className = props.className, colSpanProp = props.colSpan, _props$component = props.component, Component = _props$component === void 0 ? MUITableCell : _props$component, count = props.count, _props$labelDisplayed = props.labelDisplayedRows, labelDisplayedRows = _props$labelDisplayed === void 0 ? defaultLabelDisplayedRows : _props$labelDisplayed, _props$labelRowsPerPa = props.labelRowsPerPage, labelRowsPerPage = _props$labelRowsPerPa === void 0 ? 'Rows per page:' : _props$labelRowsPerPa, nextIconButtonProps = props.nextIconButtonProps, _props$nextIconButton = props.nextIconButtonText, nextIconButtonText = _props$nextIconButton === void 0 ? 'Next page' : _props$nextIconButton, onChangePage = props.onChangePage, onPageChange = props.onPageChange, onChangeRowsPerPageProp = props.onChangeRowsPerPage, onRowsPerPageChangeProp = props.onRowsPerPageChange, page = props.page, rowsPerPage = props.rowsPerPage, _props$rowsPerPageOpt = props.rowsPerPageOptions, rowsPerPageOptions = _props$rowsPerPageOpt === void 0 ? defaultRowsPerPageOptions$1 : _props$rowsPerPageOpt, _props$SelectProps = props.SelectProps, SelectProps = _props$SelectProps === void 0 ? {} : _props$SelectProps, other = _objectWithoutProperties$2(props, ["ActionsComponent", "backIconButtonProps", "backIconButtonText", "classes", "className", "colSpan", "component", "count", "labelDisplayedRows", "labelRowsPerPage", "nextIconButtonProps", "nextIconButtonText", "onChangePage", "onPageChange", "onChangeRowsPerPage", "onRowsPerPageChange", "page", "rowsPerPage", "rowsPerPageOptions", "SelectProps"]); var onChangeRowsPerPage = onChangeRowsPerPageProp || onRowsPerPageChangeProp; var colSpan; if (Component === MUITableCell || Component === 'td') {
     colSpan = colSpanProp || 1000;
-} var selectId = useId(); var labelId = useId(); var MenuItemComponent = SelectProps["native"] ? 'option' : MenuItem$2; return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className), colSpan: colSpan, ref: ref }, other), /*#__PURE__*/ y$3(Toolbar$1, { className: classes.toolbar }, /*#__PURE__*/ y$3("div", { className: classes.spacer }), rowsPerPageOptions.length > 1 && /*#__PURE__*/ y$3(MUITypography, { color: "inherit", variant: "body2", className: classes.caption, id: labelId }, labelRowsPerPage), rowsPerPageOptions.length > 1 && /*#__PURE__*/ y$3(MuiSelect, _extends$4({ classes: { select: classes.select, icon: classes.selectIcon }, input: /*#__PURE__*/ y$3(InputBase$1, { className: clsx(classes.input, classes.selectRoot) }), value: rowsPerPage, onChange: onChangeRowsPerPage, id: selectId, labelId: labelId }, SelectProps), rowsPerPageOptions.map(function (rowsPerPageOption) { return /*#__PURE__*/ y$3(MenuItemComponent, { className: classes.menuItem, key: rowsPerPageOption.value ? rowsPerPageOption.value : rowsPerPageOption, value: rowsPerPageOption.value ? rowsPerPageOption.value : rowsPerPageOption }, rowsPerPageOption.label ? rowsPerPageOption.label : rowsPerPageOption); })), /*#__PURE__*/ y$3(MUITypography, { color: "inherit", variant: "body2", className: classes.caption }, labelDisplayedRows({ from: count === 0 ? 0 : page * rowsPerPage + 1, to: count !== -1 ? Math.min(count, (page + 1) * rowsPerPage) : (page + 1) * rowsPerPage, count: count === -1 ? -1 : count, page: page })), /*#__PURE__*/ y$3(ActionsComponent, { className: classes.actions, backIconButtonProps: _extends$4({ title: backIconButtonText, 'aria-label': backIconButtonText }, backIconButtonProps), count: count, nextIconButtonProps: _extends$4({ title: nextIconButtonText, 'aria-label': nextIconButtonText }, nextIconButtonProps), onChangePage: onChangePage, onPageChange: onPageChange, page: page, rowsPerPage: rowsPerPage }))); });
-var TablePagination$1 = withStyles(styles$3, { name: 'MuiTablePagination' })(TablePagination);
-var styles$2 = function styles(theme) { return { root: { color: 'inherit', display: 'table-row', verticalAlign: 'middle', outline: 0, '&$hover:hover': { backgroundColor: theme.palette.action.hover }, '&$selected, &$selected:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.selectedOpacity) } }, selected: {}, hover: {}, head: {}, footer: {} }; };
+} var selectId = useId(); var labelId = useId(); var MenuItemComponent = SelectProps["native"] ? 'option' : MenuItem$2; return /*#__PURE__*/ y$3(Component, _extends$4({ className: clsx(classes.root, className), colSpan: colSpan, ref: ref }, other), /*#__PURE__*/ y$3(Toolbar$1, { className: classes.toolbar }, /*#__PURE__*/ y$3("div", { className: classes.spacer }), rowsPerPageOptions.length > 1 && /*#__PURE__*/ y$3(Typography$2, { color: "inherit", variant: "body2", className: classes.caption, id: labelId }, labelRowsPerPage), rowsPerPageOptions.length > 1 && /*#__PURE__*/ y$3(MuiSelect, _extends$4({ classes: { select: classes.select, icon: classes.selectIcon }, input: /*#__PURE__*/ y$3(InputBase$1, { className: clsx(classes.input, classes.selectRoot) }), value: rowsPerPage, onChange: onChangeRowsPerPage, id: selectId, labelId: labelId }, SelectProps), rowsPerPageOptions.map(function (rowsPerPageOption) { return /*#__PURE__*/ y$3(MenuItemComponent, { className: classes.menuItem, key: rowsPerPageOption.value ? rowsPerPageOption.value : rowsPerPageOption, value: rowsPerPageOption.value ? rowsPerPageOption.value : rowsPerPageOption }, rowsPerPageOption.label ? rowsPerPageOption.label : rowsPerPageOption); })), /*#__PURE__*/ y$3(Typography$2, { color: "inherit", variant: "body2", className: classes.caption }, labelDisplayedRows({ from: count === 0 ? 0 : page * rowsPerPage + 1, to: count !== -1 ? Math.min(count, (page + 1) * rowsPerPage) : (page + 1) * rowsPerPage, count: count === -1 ? -1 : count, page: page })), /*#__PURE__*/ y$3(ActionsComponent, { className: classes.actions, backIconButtonProps: _extends$4({ title: backIconButtonText, 'aria-label': backIconButtonText }, backIconButtonProps), count: count, nextIconButtonProps: _extends$4({ title: nextIconButtonText, 'aria-label': nextIconButtonText }, nextIconButtonProps), onChangePage: onChangePage, onPageChange: onPageChange, page: page, rowsPerPage: rowsPerPage }))); });
+var TablePagination$1 = withStyles(styles$5, { name: 'MuiTablePagination' })(TablePagination);
+var styles$4 = function styles(theme) { return { root: { color: 'inherit', display: 'table-row', verticalAlign: 'middle', outline: 0, '&$hover:hover': { backgroundColor: theme.palette.action.hover }, '&$selected, &$selected:hover': { backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.selectedOpacity) } }, selected: {}, hover: {}, head: {}, footer: {} }; };
 var defaultComponent = 'tr';
 var TableRow$1 = /*#__PURE__*/ N$1(function TableRow(props, ref) { var classes = props.classes, className = props.className, _props$component = props.component, Component = _props$component === void 0 ? defaultComponent : _props$component, _props$hover = props.hover, hover = _props$hover === void 0 ? false : _props$hover, _props$selected = props.selected, selected = _props$selected === void 0 ? false : _props$selected, other = _objectWithoutProperties$2(props, ["classes", "className", "component", "hover", "selected"]); var tablelvl2 = q$5(Tablelvl2Context); return /*#__PURE__*/ y$3(Component, _extends$4({ ref: ref, className: clsx(classes.root, className, tablelvl2 && { 'head': classes.head, 'footer': classes.footer }[tablelvl2.variant], hover && classes.hover, selected && classes.selected), role: Component === defaultComponent ? null : 'row' }, other)); });
-var MUITableRow = withStyles(styles$2, { name: 'MuiTableRow' })(TableRow$1);
+var MUITableRow = withStyles(styles$4, { name: 'MuiTableRow' })(TableRow$1);
+var variantComponent = { standard: Input$3, filled: FilledInput$1, outlined: OutlinedInput$1 };
+var styles$3 = { root: {} };
+var TextField = /*#__PURE__*/ N$1(function TextField(props, ref) { var autoComplete = props.autoComplete, _props$autoFocus = props.autoFocus, autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus, children = props.children, classes = props.classes, className = props.className, _props$color = props.color, color = _props$color === void 0 ? 'primary' : _props$color, defaultValue = props.defaultValue, _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled, _props$error = props.error, error = _props$error === void 0 ? false : _props$error, FormHelperTextProps = props.FormHelperTextProps, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, helperText = props.helperText, hiddenLabel = props.hiddenLabel, id = props.id, InputLabelProps = props.InputLabelProps, inputProps = props.inputProps, InputProps = props.InputProps, inputRef = props.inputRef, label = props.label, _props$multiline = props.multiline, multiline = _props$multiline === void 0 ? false : _props$multiline, name = props.name, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, placeholder = props.placeholder, _props$required = props.required, required = _props$required === void 0 ? false : _props$required, rows = props.rows, rowsMax = props.rowsMax, maxRows = props.maxRows, minRows = props.minRows, _props$select = props.select, select = _props$select === void 0 ? false : _props$select, SelectProps = props.SelectProps, type = props.type, value = props.value, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties$2(props, ["autoComplete", "autoFocus", "children", "classes", "className", "color", "defaultValue", "disabled", "error", "FormHelperTextProps", "fullWidth", "helperText", "hiddenLabel", "id", "InputLabelProps", "inputProps", "InputProps", "inputRef", "label", "multiline", "name", "onBlur", "onChange", "onFocus", "placeholder", "required", "rows", "rowsMax", "maxRows", "minRows", "select", "SelectProps", "type", "value", "variant"]); var InputMore = {}; if (variant === 'outlined') {
+    if (InputLabelProps && typeof InputLabelProps.shrink !== 'undefined') {
+        InputMore.notched = InputLabelProps.shrink;
+    }
+    if (label) {
+        var _InputLabelProps$requ;
+        var displayRequired = (_InputLabelProps$requ = InputLabelProps === null || InputLabelProps === void 0 ? void 0 : InputLabelProps.required) !== null && _InputLabelProps$requ !== void 0 ? _InputLabelProps$requ : required;
+        InputMore.label = /*#__PURE__*/ y$3(g$5, null, label, displayRequired && "\xA0*");
+    }
+} if (select) {
+    if (!SelectProps || !SelectProps["native"]) {
+        InputMore.id = undefined;
+    }
+    InputMore['aria-describedby'] = undefined;
+} var helperTextId = helperText && id ? "".concat(id, "-helper-text") : undefined; var inputLabelId = label && id ? "".concat(id, "-label") : undefined; var InputComponent = variantComponent[variant]; var InputElement = /*#__PURE__*/ y$3(InputComponent, _extends$4({ "aria-describedby": helperTextId, autoComplete: autoComplete, autoFocus: autoFocus, defaultValue: defaultValue, fullWidth: fullWidth, multiline: multiline, name: name, rows: rows, rowsMax: rowsMax, maxRows: maxRows, minRows: minRows, type: type, value: value, id: id, inputRef: inputRef, onBlur: onBlur, onChange: onChange, onFocus: onFocus, placeholder: placeholder, inputProps: inputProps }, InputMore, InputProps)); return /*#__PURE__*/ y$3(FormControl$1, _extends$4({ className: clsx(classes.root, className), disabled: disabled, error: error, fullWidth: fullWidth, hiddenLabel: hiddenLabel, ref: ref, required: required, color: color, variant: variant }, other), label && /*#__PURE__*/ y$3(InputLabel$1, _extends$4({ htmlFor: id, id: inputLabelId }, InputLabelProps), label), select ? /*#__PURE__*/ y$3(MuiSelect, _extends$4({ "aria-describedby": helperTextId, id: id, labelId: inputLabelId, value: value, input: InputElement }, SelectProps), children) : InputElement, helperText && /*#__PURE__*/ y$3(FormHelperText$1, _extends$4({ id: helperTextId }, FormHelperTextProps), helperText)); });
+var TextField$1 = withStyles(styles$3, { name: 'MuiTextField' })(TextField);
 function round(value) { return Math.round(value * 1e5) / 1e5; }
 function arrowGenerator() { return { '&[x-placement*="bottom"] $arrow': { top: 0, left: 0, marginTop: '-0.71em', marginLeft: 4, marginRight: 4, '&::before': { transformOrigin: '0 100%' } }, '&[x-placement*="top"] $arrow': { bottom: 0, left: 0, marginBottom: '-0.71em', marginLeft: 4, marginRight: 4, '&::before': { transformOrigin: '100% 0' } }, '&[x-placement*="right"] $arrow': { left: 0, marginLeft: '-0.71em', height: '1em', width: '0.71em', marginTop: 4, marginBottom: 4, '&::before': { transformOrigin: '100% 100%' } }, '&[x-placement*="left"] $arrow': { right: 0, marginRight: '-0.71em', height: '1em', width: '0.71em', marginTop: 4, marginBottom: 4, '&::before': { transformOrigin: '0 0' } } }; }
-var styles$1 = function styles(theme) { return { popper: { zIndex: theme.zIndex.tooltip, pointerEvents: 'none' }, popperInteractive: { pointerEvents: 'auto' }, popperArrow: arrowGenerator(), tooltip: { backgroundColor: alpha(theme.palette.grey[700], 0.9), borderRadius: theme.shape.borderRadius, color: theme.palette.common.white, fontFamily: theme.typography.fontFamily, padding: '4px 8px', fontSize: theme.typography.pxToRem(10), lineHeight: "".concat(round(14 / 10), "em"), maxWidth: 300, wordWrap: 'break-word', fontWeight: theme.typography.fontWeightMedium }, tooltipArrow: { position: 'relative', margin: '0' }, arrow: { overflow: 'hidden', position: 'absolute', width: '1em', height: '0.71em', boxSizing: 'border-box', color: alpha(theme.palette.grey[700], 0.9), '&::before': { content: '""', margin: 'auto', display: 'block', width: '100%', height: '100%', backgroundColor: 'currentColor', transform: 'rotate(45deg)' } }, touch: { padding: '8px 16px', fontSize: theme.typography.pxToRem(14), lineHeight: "".concat(round(16 / 14), "em"), fontWeight: theme.typography.fontWeightRegular }, tooltipPlacementLeft: _defineProperty({ transformOrigin: 'right center', margin: '0 24px ' }, theme.breakpoints.up('sm'), { margin: '0 14px' }), tooltipPlacementRight: _defineProperty({ transformOrigin: 'left center', margin: '0 24px' }, theme.breakpoints.up('sm'), { margin: '0 14px' }), tooltipPlacementTop: _defineProperty({ transformOrigin: 'center bottom', margin: '24px 0' }, theme.breakpoints.up('sm'), { margin: '14px 0' }), tooltipPlacementBottom: _defineProperty({ transformOrigin: 'center top', margin: '24px 0' }, theme.breakpoints.up('sm'), { margin: '14px 0' }) }; };
+var styles$2 = function styles(theme) { return { popper: { zIndex: theme.zIndex.tooltip, pointerEvents: 'none' }, popperInteractive: { pointerEvents: 'auto' }, popperArrow: arrowGenerator(), tooltip: { backgroundColor: alpha(theme.palette.grey[700], 0.9), borderRadius: theme.shape.borderRadius, color: theme.palette.common.white, fontFamily: theme.typography.fontFamily, padding: '4px 8px', fontSize: theme.typography.pxToRem(10), lineHeight: "".concat(round(14 / 10), "em"), maxWidth: 300, wordWrap: 'break-word', fontWeight: theme.typography.fontWeightMedium }, tooltipArrow: { position: 'relative', margin: '0' }, arrow: { overflow: 'hidden', position: 'absolute', width: '1em', height: '0.71em', boxSizing: 'border-box', color: alpha(theme.palette.grey[700], 0.9), '&::before': { content: '""', margin: 'auto', display: 'block', width: '100%', height: '100%', backgroundColor: 'currentColor', transform: 'rotate(45deg)' } }, touch: { padding: '8px 16px', fontSize: theme.typography.pxToRem(14), lineHeight: "".concat(round(16 / 14), "em"), fontWeight: theme.typography.fontWeightRegular }, tooltipPlacementLeft: _defineProperty$1({ transformOrigin: 'right center', margin: '0 24px ' }, theme.breakpoints.up('sm'), { margin: '0 14px' }), tooltipPlacementRight: _defineProperty$1({ transformOrigin: 'left center', margin: '0 24px' }, theme.breakpoints.up('sm'), { margin: '0 14px' }), tooltipPlacementTop: _defineProperty$1({ transformOrigin: 'center bottom', margin: '24px 0' }, theme.breakpoints.up('sm'), { margin: '14px 0' }), tooltipPlacementBottom: _defineProperty$1({ transformOrigin: 'center top', margin: '24px 0' }, theme.breakpoints.up('sm'), { margin: '14px 0' }) }; };
 var hystersisOpen = false;
 var hystersisTimer = null;
-var Tooltip$1 = /*#__PURE__*/ N$1(function Tooltip(props, ref) { var _props$arrow = props.arrow, arrow = _props$arrow === void 0 ? false : _props$arrow, children = props.children, classes = props.classes, _props$disableFocusLi = props.disableFocusListener, disableFocusListener = _props$disableFocusLi === void 0 ? false : _props$disableFocusLi, _props$disableHoverLi = props.disableHoverListener, disableHoverListener = _props$disableHoverLi === void 0 ? false : _props$disableHoverLi, _props$disableTouchLi = props.disableTouchListener, disableTouchListener = _props$disableTouchLi === void 0 ? false : _props$disableTouchLi, _props$enterDelay = props.enterDelay, enterDelay = _props$enterDelay === void 0 ? 100 : _props$enterDelay, _props$enterNextDelay = props.enterNextDelay, enterNextDelay = _props$enterNextDelay === void 0 ? 0 : _props$enterNextDelay, _props$enterTouchDela = props.enterTouchDelay, enterTouchDelay = _props$enterTouchDela === void 0 ? 700 : _props$enterTouchDela, idProp = props.id, _props$interactive = props.interactive, interactive = _props$interactive === void 0 ? false : _props$interactive, _props$leaveDelay = props.leaveDelay, leaveDelay = _props$leaveDelay === void 0 ? 0 : _props$leaveDelay, _props$leaveTouchDela = props.leaveTouchDelay, leaveTouchDelay = _props$leaveTouchDela === void 0 ? 1500 : _props$leaveTouchDela, onClose = props.onClose, onOpen = props.onOpen, openProp = props.open, _props$placement = props.placement, placement = _props$placement === void 0 ? 'bottom' : _props$placement, _props$PopperComponen = props.PopperComponent, PopperComponent = _props$PopperComponen === void 0 ? Popper : _props$PopperComponen, PopperProps = props.PopperProps, title = props.title, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp, TransitionProps = props.TransitionProps, other = _objectWithoutProperties$2(props, ["arrow", "children", "classes", "disableFocusListener", "disableHoverListener", "disableTouchListener", "enterDelay", "enterNextDelay", "enterTouchDelay", "id", "interactive", "leaveDelay", "leaveTouchDelay", "onClose", "onOpen", "open", "placement", "PopperComponent", "PopperProps", "title", "TransitionComponent", "TransitionProps"]); var theme = useTheme(); var _React$useState = h$4(), childNode = _React$useState[0], setChildNode = _React$useState[1]; var _React$useState2 = h$4(null), arrowRef = _React$useState2[0], setArrowRef = _React$useState2[1]; var ignoreNonTouchEvents = _$1(false); var closeTimer = _$1(); var enterTimer = _$1(); var leaveTimer = _$1(); var touchTimer = _$1(); var _useControlled = useControlled({ controlled: openProp, "default": false, name: 'Tooltip', state: 'open' }), _useControlled2 = _slicedToArray(_useControlled, 2), openState = _useControlled2[0], setOpenState = _useControlled2[1]; var open = openState; var id = useId(idProp); p$3(function () { return function () { clearTimeout(closeTimer.current); clearTimeout(enterTimer.current); clearTimeout(leaveTimer.current); clearTimeout(touchTimer.current); }; }, []); var handleOpen = function handleOpen(event) { clearTimeout(hystersisTimer); hystersisOpen = true; setOpenState(true); if (onOpen) {
+var Tooltip$1 = /*#__PURE__*/ N$1(function Tooltip(props, ref) { var _props$arrow = props.arrow, arrow = _props$arrow === void 0 ? false : _props$arrow, children = props.children, classes = props.classes, _props$disableFocusLi = props.disableFocusListener, disableFocusListener = _props$disableFocusLi === void 0 ? false : _props$disableFocusLi, _props$disableHoverLi = props.disableHoverListener, disableHoverListener = _props$disableHoverLi === void 0 ? false : _props$disableHoverLi, _props$disableTouchLi = props.disableTouchListener, disableTouchListener = _props$disableTouchLi === void 0 ? false : _props$disableTouchLi, _props$enterDelay = props.enterDelay, enterDelay = _props$enterDelay === void 0 ? 100 : _props$enterDelay, _props$enterNextDelay = props.enterNextDelay, enterNextDelay = _props$enterNextDelay === void 0 ? 0 : _props$enterNextDelay, _props$enterTouchDela = props.enterTouchDelay, enterTouchDelay = _props$enterTouchDela === void 0 ? 700 : _props$enterTouchDela, idProp = props.id, _props$interactive = props.interactive, interactive = _props$interactive === void 0 ? false : _props$interactive, _props$leaveDelay = props.leaveDelay, leaveDelay = _props$leaveDelay === void 0 ? 0 : _props$leaveDelay, _props$leaveTouchDela = props.leaveTouchDelay, leaveTouchDelay = _props$leaveTouchDela === void 0 ? 1500 : _props$leaveTouchDela, onClose = props.onClose, onOpen = props.onOpen, openProp = props.open, _props$placement = props.placement, placement = _props$placement === void 0 ? 'bottom' : _props$placement, _props$PopperComponen = props.PopperComponent, PopperComponent = _props$PopperComponen === void 0 ? Popper : _props$PopperComponen, PopperProps = props.PopperProps, title = props.title, _props$TransitionComp = props.TransitionComponent, TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp, TransitionProps = props.TransitionProps, other = _objectWithoutProperties$2(props, ["arrow", "children", "classes", "disableFocusListener", "disableHoverListener", "disableTouchListener", "enterDelay", "enterNextDelay", "enterTouchDelay", "id", "interactive", "leaveDelay", "leaveTouchDelay", "onClose", "onOpen", "open", "placement", "PopperComponent", "PopperProps", "title", "TransitionComponent", "TransitionProps"]); var theme = useTheme(); var _React$useState = h$4(), childNode = _React$useState[0], setChildNode = _React$useState[1]; var _React$useState2 = h$4(null), arrowRef = _React$useState2[0], setArrowRef = _React$useState2[1]; var ignoreNonTouchEvents = _$1(false); var closeTimer = _$1(); var enterTimer = _$1(); var leaveTimer = _$1(); var touchTimer = _$1(); var _useControlled = useControlled({ controlled: openProp, "default": false, name: 'Tooltip', state: 'open' }), _useControlled2 = _slicedToArray$1(_useControlled, 2), openState = _useControlled2[0], setOpenState = _useControlled2[1]; var open = openState; var id = useId(idProp); p$3(function () { return function () { clearTimeout(closeTimer.current); clearTimeout(enterTimer.current); clearTimeout(leaveTimer.current); clearTimeout(touchTimer.current); }; }, []); var handleOpen = function handleOpen(event) { clearTimeout(hystersisTimer); hystersisOpen = true; setOpenState(true); if (onOpen) {
     onOpen(event);
 } }; var handleEnter = function handleEnter() { var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true; return function (event) { var childrenProps = children.props; if (event.type === 'mouseover' && childrenProps.onMouseOver && forward) {
     childrenProps.onMouseOver(event);
@@ -8374,21 +8526,23 @@ else {
         interactiveWrapperListeners.onBlur = handleLeave(false);
     }
 } var mergedPopperProps = F$3(function () { return deepmerge({ popperOptions: { modifiers: { arrow: { enabled: Boolean(arrowRef), element: arrowRef } } } }, PopperProps); }, [arrowRef, PopperProps]); return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ sn(children, childrenProps), /*#__PURE__*/ y$3(PopperComponent, _extends$4({ className: clsx(classes.popper, interactive && classes.popperInteractive, arrow && classes.popperArrow), placement: placement, anchorEl: childNode, open: childNode ? open : false, id: childrenProps['aria-describedby'], transition: true }, interactiveWrapperListeners, mergedPopperProps), function (_ref) { var placementInner = _ref.placement, TransitionPropsInner = _ref.TransitionProps; return /*#__PURE__*/ y$3(TransitionComponent, _extends$4({ timeout: theme.transitions.duration.shorter }, TransitionPropsInner, TransitionProps), /*#__PURE__*/ y$3("div", { className: clsx(classes.tooltip, classes["tooltipPlacement".concat(capitalize(placementInner.split('-')[0]))], ignoreNonTouchEvents.current && classes.touch, arrow && classes.tooltipArrow) }, title, arrow ? /*#__PURE__*/ y$3("span", { className: classes.arrow, ref: setArrowRef }) : null)); })); });
-var MUITooltip = withStyles(styles$1, { name: 'MuiTooltip', flip: false })(Tooltip$1);
-var useStyles$l = makeStyles(function (theme) { return { root: { background: theme.styleConfig.container.backgroundColor, border: '1px solid', borderColor: theme.styleConfig.container.borderColor, borderRadius: theme.styleConfig.container.borderRadius, color: theme.styleConfig.colors.primary, width: theme.styleConfig.container.width, padding: theme.spacing(6), boxSizing: 'border-box' } }; });
-var MainContainer = function MainContainer(_ref5) { var children = _ref5.children; var classes = useStyles$l(); return /*#__PURE__*/ wn.createElement("div", { className: classes.root }, children); };
-var StytchClientContext = /*#__PURE__*/ wn.createContext(null);
+var Tooltip$2 = withStyles(styles$2, { name: 'MuiTooltip', flip: false })(Tooltip$1);
+var useStyles$p = makeStyles(function (theme) { return { root: { background: theme.styleConfig.container.backgroundColor, border: '1px solid', borderColor: theme.styleConfig.container.borderColor, borderRadius: theme.styleConfig.container.borderRadius, color: theme.styleConfig.colors.primary, width: theme.styleConfig.container.width, padding: theme.spacing(6), boxSizing: 'border-box' } }; });
+var MainContainer = function MainContainer(_ref6) { var children = _ref6.children; var classes = useStyles$p(); return /*#__PURE__*/ wn.createElement("div", { className: classes.root }, children); };
+var StytchClientContext = /*#__PURE__*/ wn.createContext({ client: null });
+var useAdminPortalContext = function useAdminPortalContext() { return q$5(StytchClientContext); };
+var useAdminPortalOrgUIConfig = function useAdminPortalOrgUIConfig() { return useAdminPortalContext().config; };
 var CheckCircle = {};
 var interopRequireDefault = { exports: {} };
 (function (module) { function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } module.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports["default"] = module.exports; })(interopRequireDefault);
 var interopRequireDefaultExports = interopRequireDefault.exports;
 var interopRequireWildcard = { exports: {} };
-var _typeof = { exports: {} };
+var _typeof$1 = { exports: {} };
 (function (module) { function _typeof(o) {
     "@babel/helpers - typeof";
     return (module.exports = _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, module.exports.__esModule = true, module.exports["default"] = module.exports), _typeof(o);
-} module.exports = _typeof, module.exports.__esModule = true, module.exports["default"] = module.exports; })(_typeof);
-var _typeofExports = _typeof.exports;
+} module.exports = _typeof, module.exports.__esModule = true, module.exports["default"] = module.exports; })(_typeof$1);
+var _typeofExports = _typeof$1.exports;
 (function (module) { var _typeof = _typeofExports["default"]; function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap)
     return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule)
     return e; if (null === e || "object" != _typeof(e) && "function" != typeof e)
@@ -8462,11 +8616,11 @@ var ReportProblemOutlinedIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "
 var ErrorOutlineIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" }));
 var InfoOutlinedIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 12,2M11,17H13V11H11V17Z" }));
 var CloseIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }));
-var styles = function styles(theme) { var getColor = theme.palette.type === 'light' ? darken : lighten; var getBackgroundColor = theme.palette.type === 'light' ? lighten : darken; return { root: _extends({}, theme.typography.body2, { borderRadius: theme.shape.borderRadius, backgroundColor: 'transparent', display: 'flex', padding: '6px 16px' }), standardSuccess: { color: getColor(theme.palette.success.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.success.main, 0.9), '& $icon': { color: theme.palette.success.main } }, standardInfo: { color: getColor(theme.palette.info.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.info.main, 0.9), '& $icon': { color: theme.palette.info.main } }, standardWarning: { color: getColor(theme.palette.warning.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.warning.main, 0.9), '& $icon': { color: theme.palette.warning.main } }, standardError: { color: getColor(theme.palette.error.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.error.main, 0.9), '& $icon': { color: theme.palette.error.main } }, outlinedSuccess: { color: getColor(theme.palette.success.main, 0.6), border: "1px solid ".concat(theme.palette.success.main), '& $icon': { color: theme.palette.success.main } }, outlinedInfo: { color: getColor(theme.palette.info.main, 0.6), border: "1px solid ".concat(theme.palette.info.main), '& $icon': { color: theme.palette.info.main } }, outlinedWarning: { color: getColor(theme.palette.warning.main, 0.6), border: "1px solid ".concat(theme.palette.warning.main), '& $icon': { color: theme.palette.warning.main } }, outlinedError: { color: getColor(theme.palette.error.main, 0.6), border: "1px solid ".concat(theme.palette.error.main), '& $icon': { color: theme.palette.error.main } }, filledSuccess: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.success.main }, filledInfo: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.info.main }, filledWarning: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.warning.main }, filledError: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.error.main }, icon: { marginRight: 12, padding: '7px 0', display: 'flex', fontSize: 22, opacity: 0.9 }, message: { padding: '8px 0' }, action: { display: 'flex', alignItems: 'center', marginLeft: 'auto', paddingLeft: 16, marginRight: -8 } }; };
+var styles$1 = function styles(theme) { var getColor = theme.palette.type === 'light' ? darken : lighten; var getBackgroundColor = theme.palette.type === 'light' ? lighten : darken; return { root: _extends({}, theme.typography.body2, { borderRadius: theme.shape.borderRadius, backgroundColor: 'transparent', display: 'flex', padding: '6px 16px' }), standardSuccess: { color: getColor(theme.palette.success.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.success.main, 0.9), '& $icon': { color: theme.palette.success.main } }, standardInfo: { color: getColor(theme.palette.info.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.info.main, 0.9), '& $icon': { color: theme.palette.info.main } }, standardWarning: { color: getColor(theme.palette.warning.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.warning.main, 0.9), '& $icon': { color: theme.palette.warning.main } }, standardError: { color: getColor(theme.palette.error.main, 0.6), backgroundColor: getBackgroundColor(theme.palette.error.main, 0.9), '& $icon': { color: theme.palette.error.main } }, outlinedSuccess: { color: getColor(theme.palette.success.main, 0.6), border: "1px solid ".concat(theme.palette.success.main), '& $icon': { color: theme.palette.success.main } }, outlinedInfo: { color: getColor(theme.palette.info.main, 0.6), border: "1px solid ".concat(theme.palette.info.main), '& $icon': { color: theme.palette.info.main } }, outlinedWarning: { color: getColor(theme.palette.warning.main, 0.6), border: "1px solid ".concat(theme.palette.warning.main), '& $icon': { color: theme.palette.warning.main } }, outlinedError: { color: getColor(theme.palette.error.main, 0.6), border: "1px solid ".concat(theme.palette.error.main), '& $icon': { color: theme.palette.error.main } }, filledSuccess: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.success.main }, filledInfo: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.info.main }, filledWarning: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.warning.main }, filledError: { color: '#fff', fontWeight: theme.typography.fontWeightMedium, backgroundColor: theme.palette.error.main }, icon: { marginRight: 12, padding: '7px 0', display: 'flex', fontSize: 22, opacity: 0.9 }, message: { padding: '8px 0' }, action: { display: 'flex', alignItems: 'center', marginLeft: 'auto', paddingLeft: 16, marginRight: -8 } }; };
 var defaultIconMapping = { success: /*#__PURE__*/ y$3(SuccessOutlinedIcon, { fontSize: "inherit" }), warning: /*#__PURE__*/ y$3(ReportProblemOutlinedIcon, { fontSize: "inherit" }), error: /*#__PURE__*/ y$3(ErrorOutlineIcon, { fontSize: "inherit" }), info: /*#__PURE__*/ y$3(InfoOutlinedIcon, { fontSize: "inherit" }) };
-var _ref = /*#__PURE__*/ y$3(CloseIcon, { fontSize: "small" });
-var Alert$1 = /*#__PURE__*/ N$1(function Alert(props, ref) { var action = props.action, children = props.children, classes = props.classes, className = props.className, _props$closeText = props.closeText, closeText = _props$closeText === void 0 ? 'Close' : _props$closeText, color = props.color, icon = props.icon, _props$iconMapping = props.iconMapping, iconMapping = _props$iconMapping === void 0 ? defaultIconMapping : _props$iconMapping, onClose = props.onClose, _props$role = props.role, role = _props$role === void 0 ? 'alert' : _props$role, _props$severity = props.severity, severity = _props$severity === void 0 ? 'success' : _props$severity, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties(props, ["action", "children", "classes", "className", "closeText", "color", "icon", "iconMapping", "onClose", "role", "severity", "variant"]); return /*#__PURE__*/ y$3(Paper$1, _extends({ role: role, square: true, elevation: 0, className: clsx(classes.root, classes["".concat(variant).concat(capitalize(color || severity))], className), ref: ref }, other), icon !== false ? /*#__PURE__*/ y$3("div", { className: classes.icon }, icon || iconMapping[severity] || defaultIconMapping[severity]) : null, /*#__PURE__*/ y$3("div", { className: classes.message }, children), action != null ? /*#__PURE__*/ y$3("div", { className: classes.action }, action) : null, action == null && onClose ? /*#__PURE__*/ y$3("div", { className: classes.action }, /*#__PURE__*/ y$3(IconButton$1, { size: "small", "aria-label": closeText, title: closeText, color: "inherit", onClick: onClose }, _ref)) : null); });
-var MUIAlert = withStyles(styles, { name: 'MuiAlert' })(Alert$1);
+var _ref$1 = /*#__PURE__*/ y$3(CloseIcon, { fontSize: "small" });
+var Alert$1 = /*#__PURE__*/ N$1(function Alert(props, ref) { var action = props.action, children = props.children, classes = props.classes, className = props.className, _props$closeText = props.closeText, closeText = _props$closeText === void 0 ? 'Close' : _props$closeText, color = props.color, icon = props.icon, _props$iconMapping = props.iconMapping, iconMapping = _props$iconMapping === void 0 ? defaultIconMapping : _props$iconMapping, onClose = props.onClose, _props$role = props.role, role = _props$role === void 0 ? 'alert' : _props$role, _props$severity = props.severity, severity = _props$severity === void 0 ? 'success' : _props$severity, _props$variant = props.variant, variant = _props$variant === void 0 ? 'standard' : _props$variant, other = _objectWithoutProperties(props, ["action", "children", "classes", "className", "closeText", "color", "icon", "iconMapping", "onClose", "role", "severity", "variant"]); return /*#__PURE__*/ y$3(Paper$1, _extends({ role: role, square: true, elevation: 0, className: clsx(classes.root, classes["".concat(variant).concat(capitalize(color || severity))], className), ref: ref }, other), icon !== false ? /*#__PURE__*/ y$3("div", { className: classes.icon }, icon || iconMapping[severity] || defaultIconMapping[severity]) : null, /*#__PURE__*/ y$3("div", { className: classes.message }, children), action != null ? /*#__PURE__*/ y$3("div", { className: classes.action }, action) : null, action == null && onClose ? /*#__PURE__*/ y$3("div", { className: classes.action }, /*#__PURE__*/ y$3(IconButton$1, { size: "small", "aria-label": closeText, title: closeText, color: "inherit", onClick: onClose }, _ref$1)) : null); });
+var MUIAlert = withStyles(styles$1, { name: 'MuiAlert' })(Alert$1);
 var classnames = { exports: {} }; /*!
     Copyright (c) 2018 Jed Watson.
     Licensed under the MIT License (MIT), see
@@ -8516,24 +8670,24 @@ var getToastIcon = function getToastIcon(type) { switch (type) {
     case 'error': return default_1$a;
     default: return default_1$c;
 } };
-var Toast = function Toast(_ref6) { var children = _ref6.children, _ref6$type = _ref6.type, type = _ref6$type === void 0 ? 'success' : _ref6$type, onClose = _ref6.onClose, classes = _ref6.classes, Typography = _ref6.TypographyComponent; var Icon = getToastIcon(type); return /*#__PURE__*/ wn.createElement(MUIAlert, { action: /*#__PURE__*/ wn.createElement(IconButton$1, { className: classes.closeButton, disableRipple: true, onClick: onClose }, /*#__PURE__*/ wn.createElement(default_1$b, { className: C(classes.closeIcon, _defineProperty2(_defineProperty2({}, classes.errorIcon, type === 'error'), classes.successIcon, type === 'success')) })), className: C(classes.toast, _defineProperty2(_defineProperty2({}, classes.error, type === 'error'), classes.success, type === 'success')), elevation: 6, icon: /*#__PURE__*/ wn.createElement(Icon, { className: C(_defineProperty2(_defineProperty2({}, classes.errorIcon, type === 'error'), classes.successIcon, type === 'success')), fontSize: "small" }), variant: "filled" }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, children)); };
+var Toast = function Toast(_ref7) { var children = _ref7.children, _ref7$type = _ref7.type, type = _ref7$type === void 0 ? 'success' : _ref7$type, onClose = _ref7.onClose, classes = _ref7.classes, Typography = _ref7.TypographyComponent; var Icon = getToastIcon(type); return /*#__PURE__*/ wn.createElement(MUIAlert, { action: /*#__PURE__*/ wn.createElement(IconButton$1, { className: classes.closeButton, disableRipple: true, onClick: onClose }, /*#__PURE__*/ wn.createElement(default_1$b, { className: C(classes.closeIcon, _defineProperty2(_defineProperty2({}, classes.errorIcon, type === 'error'), classes.successIcon, type === 'success')) })), className: C(classes.toast, _defineProperty2(_defineProperty2({}, classes.error, type === 'error'), classes.success, type === 'success')), elevation: 6, icon: /*#__PURE__*/ wn.createElement(Icon, { className: C(_defineProperty2(_defineProperty2({}, classes.errorIcon, type === 'error'), classes.successIcon, type === 'success')), fontSize: "small" }), variant: "filled" }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, children)); };
 var DEFAULT_STATE$1 = { openToast: noop, closeToast: noop };
 var ToastContext = /*#__PURE__*/ F$4(DEFAULT_STATE$1);
 var useToast = function useToast() { return q$5(ToastContext); };
-var ToastContextProviderCore = function ToastContextProviderCore(_ref7) { var children = _ref7.children, classes = _ref7.classes, TypographyComponent = _ref7.TypographyComponent; var _h = h$4(false), _h2 = _slicedToArray2(_h, 2), open = _h2[0], setOpen = _h2[1]; var _h3 = h$4(''), _h4 = _slicedToArray2(_h3, 2), toastText = _h4[0], setToastText = _h4[1]; var _h5 = h$4('success'), _h6 = _slicedToArray2(_h5, 2), toastType = _h6[0], setToastType = _h6[1]; var timeoutRef = _$1(null); var closeToast = function closeToast() { return setOpen(false); }; var triggerOpen = T$2(function (openDurationMS) { setOpen(true); if (timeoutRef.current) {
+var ToastContextProviderCore = function ToastContextProviderCore(_ref8) { var children = _ref8.children, classes = _ref8.classes, TypographyComponent = _ref8.TypographyComponent; var _h = h$4(false), _h2 = _slicedToArray2(_h, 2), open = _h2[0], setOpen = _h2[1]; var _h3 = h$4(''), _h4 = _slicedToArray2(_h3, 2), toastText = _h4[0], setToastText = _h4[1]; var _h5 = h$4('success'), _h6 = _slicedToArray2(_h5, 2), toastType = _h6[0], setToastType = _h6[1]; var timeoutRef = _$1(null); var closeToast = function closeToast() { return setOpen(false); }; var triggerOpen = T$2(function (openDurationMS) { setOpen(true); if (timeoutRef.current) {
     clearTimeout(timeoutRef.current);
-} timeoutRef.current = setTimeout(function () { setOpen(false); }, openDurationMS); }, []); var openToast = T$2(function (_ref8) { var type = _ref8.type, text = _ref8.text, _ref8$openDurationMS = _ref8.openDurationMS, openDurationMS = _ref8$openDurationMS === void 0 ? 5000 : _ref8$openDurationMS; setToastType(type); setToastText(text); triggerOpen(openDurationMS); }, [triggerOpen]); return /*#__PURE__*/ wn.createElement(ToastContext.Provider, { value: { openToast: openToast, closeToast: closeToast } }, /*#__PURE__*/ wn.createElement(Snackbar$1, { anchorOrigin: { horizontal: 'center', vertical: 'bottom' }, className: classes.snackbar, open: open }, /*#__PURE__*/ wn.createElement(Toast, { TypographyComponent: TypographyComponent, classes: classes, onClose: closeToast, type: toastType }, toastText)), children); };
+} timeoutRef.current = setTimeout(function () { setOpen(false); }, openDurationMS); }, []); var openToast = T$2(function (_ref9) { var type = _ref9.type, text = _ref9.text, _ref9$openDurationMS = _ref9.openDurationMS, openDurationMS = _ref9$openDurationMS === void 0 ? 5000 : _ref9$openDurationMS; setToastType(type); setToastText(text); triggerOpen(openDurationMS); }, [triggerOpen]); return /*#__PURE__*/ wn.createElement(ToastContext.Provider, { value: { openToast: openToast, closeToast: closeToast } }, /*#__PURE__*/ wn.createElement(Snackbar$1, { anchorOrigin: { horizontal: 'center', vertical: 'bottom' }, className: classes.snackbar, open: open }, /*#__PURE__*/ wn.createElement(Toast, { TypographyComponent: TypographyComponent, classes: classes, onClose: closeToast, type: toastType }, toastText)), children); };
 var makeTypographyStyles = makeStylesFactory(function (theme) { return { typography: { '& ul': { margin: theme.spacing(1, 0, 0) } }, disabled: {} }; });
 var colorToMUIColor = { primary: 'primary', secondary: 'textSecondary', error: 'error' };
-var TypographyCore = function TypographyCore(_ref9) { var align = _ref9.align, children = _ref9.children, color = _ref9.color, component = _ref9.component, disabled = _ref9.disabled, _ref9$variant = _ref9.variant, variant = _ref9$variant === void 0 ? 'body1' : _ref9$variant, classes = _ref9.classes; return /*#__PURE__*/ wn.createElement(MUITypography, { align: align, className: C(classes.typography, _defineProperty2({}, classes.disabled, disabled)), color: color ? colorToMUIColor[color] : undefined, component: component, variant: variant }, children); };
-var useStyles$k = makeTypographyStyles();
-var Typography = function Typography(props) { var classes = useStyles$k(); return /*#__PURE__*/ wn.createElement(TypographyCore, Object.assign({}, props, { classes: classes })); };
-var useStyles$j = makeToastStyles(function (theme) { return { toast: { backgroundColor: theme.styleConfig.container.backgroundColor, boxShadow: '0px 5px 10px 0px rgba(0, 0, 0, 0.20)', border: '1px solid', borderColor: theme.styleConfig.container.borderColor, borderRadius: theme.styleConfig.borderRadius }, error: { '& p': { color: theme.styleConfig.colors.error }, backgroundColor: theme.styleConfig.container.backgroundColor, color: theme.styleConfig.colors.error }, errorIcon: { color: theme.styleConfig.colors.error }, success: { '& p': { color: theme.styleConfig.colors.success }, backgroundColor: theme.styleConfig.container.backgroundColor, color: theme.styleConfig.colors.success }, successIcon: { color: theme.styleConfig.colors.success } }; });
-var ToastContextProvider = function ToastContextProvider(props) { var classes = useStyles$j(); return /*#__PURE__*/ wn.createElement(ToastContextProviderCore, Object.assign({ TypographyComponent: Typography, classes: classes }, props)); };
+var TypographyCore = function TypographyCore(_ref10) { var align = _ref10.align, children = _ref10.children, color = _ref10.color, component = _ref10.component, disabled = _ref10.disabled, _ref10$variant = _ref10.variant, variant = _ref10$variant === void 0 ? 'body1' : _ref10$variant, classes = _ref10.classes; return /*#__PURE__*/ wn.createElement(Typography$2, { align: align, className: C(classes.typography, _defineProperty2({}, classes.disabled, disabled)), color: color ? colorToMUIColor[color] : disabled ? 'textSecondary' : undefined, component: component, variant: variant }, children); };
+var useStyles$o = makeTypographyStyles();
+var Typography = function Typography(props) { var classes = useStyles$o(); return /*#__PURE__*/ wn.createElement(TypographyCore, Object.assign({}, props, { classes: classes })); };
+var useStyles$n = makeToastStyles(function (theme) { return { toast: { backgroundColor: theme.styleConfig.container.backgroundColor, boxShadow: '0px 5px 10px 0px rgba(0, 0, 0, 0.20)', border: '1px solid', borderColor: theme.styleConfig.container.borderColor, borderRadius: theme.styleConfig.borderRadius }, error: { '& p': { color: theme.styleConfig.colors.error }, backgroundColor: theme.styleConfig.container.backgroundColor, color: theme.styleConfig.colors.error }, errorIcon: { color: theme.styleConfig.colors.error }, success: { '& p': { color: theme.styleConfig.colors.success }, backgroundColor: theme.styleConfig.container.backgroundColor, color: theme.styleConfig.colors.success }, successIcon: { color: theme.styleConfig.colors.success } }; });
+var ToastContextProvider = function ToastContextProvider(props) { var classes = useStyles$n(); return /*#__PURE__*/ wn.createElement(ToastContextProviderCore, Object.assign({ TypographyComponent: Typography, classes: classes }, props)); };
 var DEFAULT_ADMIN_PORTAL_STYLE_CONFIG = { container: { backgroundColor: '#FFFFFF', borderColor: '#FFFFFF', width: '100%' }, colors: { primary: '#000000', secondary: '#5C727D', success: '#005D26', error: '#BB0003', accent: '#ECFAFF', accentText: '#000000', subtle: '#EFEFEF' }, buttons: { primary: { backgroundColor: '#000000', textColor: '#FFFFFF', borderColor: '#000000' }, secondary: { backgroundColor: '#FFFFFF', textColor: '#000000', borderColor: '#000000' }, disabled: { backgroundColor: '#EFEFEF', textColor: '#B4B4B4', borderColor: '#EFEFEF' } }, inputs: { backgroundColor: '#FFFFFF', borderColor: '#D9D9D9', placeholderColor: '#5C727D', textColor: '#000000' }, borderRadius: '4px', fontFamily: 'Arial, Helvetica, sans-serif' };
-var getTheme = function getTheme(styles) { var _a, _b, _c, _d, _e, _f; var styleConfig = merge({}, DEFAULT_ADMIN_PORTAL_STYLE_CONFIG, styles); var resolvedConfig = Object.assign(Object.assign({}, styleConfig), { buttons: { primary: Object.assign(Object.assign({}, styleConfig.buttons.primary), { borderRadius: (_a = styleConfig.buttons.primary.borderRadius) !== null && _a !== void 0 ? _a : styleConfig.borderRadius }), secondary: Object.assign(Object.assign({}, styleConfig.buttons.secondary), { borderRadius: (_b = styleConfig.buttons.secondary.borderRadius) !== null && _b !== void 0 ? _b : styleConfig.borderRadius }), disabled: Object.assign(Object.assign({}, styleConfig.buttons.disabled), { borderRadius: (_d = (_c = styleConfig.buttons.disabled) === null || _c === void 0 ? void 0 : _c.borderRadius) !== null && _d !== void 0 ? _d : styleConfig.borderRadius }) }, container: Object.assign(Object.assign({}, styleConfig.container), { borderRadius: (_e = styleConfig.container.borderRadius) !== null && _e !== void 0 ? _e : styleConfig.borderRadius }), inputs: Object.assign(Object.assign({}, styleConfig.inputs), { borderRadius: (_f = styleConfig.inputs.borderRadius) !== null && _f !== void 0 ? _f : styleConfig.borderRadius }) }); var theme = createTheme({ typography: { allVariants: { color: resolvedConfig.colors.primary }, button: { textTransform: 'none' }, fontFamily: styleConfig.fontFamily, h1: { fontSize: 30, fontWeight: 600, lineHeight: '125%' }, h2: { fontSize: 24, fontWeight: 600, lineHeight: '125%' }, h3: { fontSize: 20, fontWeight: 600, lineHeight: '125%' }, h4: { fontSize: 18, fontWeight: 600, lineHeight: '125%' }, body1: { fontSize: 18, fontWeight: 400, lineHeight: '150%' }, body2: { fontSize: 14, fontWeight: 400, lineHeight: '150%' } }, overrides: { MuiIconButton: { root: { color: resolvedConfig.colors.primary } }, MuiPaper: { root: { backgroundColor: resolvedConfig.container.backgroundColor, border: '1px solid', borderColor: resolvedConfig.colors.subtle, borderRadius: resolvedConfig.container.borderRadius } }, MuiTypography: { colorTextSecondary: { color: resolvedConfig.colors.secondary }, colorError: { color: resolvedConfig.colors.error } } }, styleConfig: resolvedConfig }); return theme; };
-var ContextProvider = function ContextProvider(_ref10) { var client = _ref10.client, theme = _ref10.theme, children = _ref10.children; return /*#__PURE__*/ wn.createElement(ThemeProvider, { theme: theme }, /*#__PURE__*/ wn.createElement(StytchClientContext.Provider, { value: client }, children)); };
-var AdminPortalWrapper = function AdminPortalWrapper(_ref11) { var children = _ref11.children, options = _ref11.options; var theme = getTheme(options.styles); return /*#__PURE__*/ wn.createElement(ContextProvider, { client: options.client, theme: theme }, /*#__PURE__*/ wn.createElement(MainContainer, null, /*#__PURE__*/ wn.createElement(ToastContextProvider, null, children))); };
+var getTheme = function getTheme(styles) { var _a, _b, _c, _d, _e, _f; var styleConfig = merge({}, DEFAULT_ADMIN_PORTAL_STYLE_CONFIG, styles); var resolvedConfig = Object.assign(Object.assign({}, styleConfig), { buttons: { primary: Object.assign(Object.assign({}, styleConfig.buttons.primary), { borderRadius: (_a = styleConfig.buttons.primary.borderRadius) !== null && _a !== void 0 ? _a : styleConfig.borderRadius }), secondary: Object.assign(Object.assign({}, styleConfig.buttons.secondary), { borderRadius: (_b = styleConfig.buttons.secondary.borderRadius) !== null && _b !== void 0 ? _b : styleConfig.borderRadius }), disabled: Object.assign(Object.assign({}, styleConfig.buttons.disabled), { borderRadius: (_d = (_c = styleConfig.buttons.disabled) === null || _c === void 0 ? void 0 : _c.borderRadius) !== null && _d !== void 0 ? _d : styleConfig.borderRadius }) }, container: Object.assign(Object.assign({}, styleConfig.container), { borderRadius: (_e = styleConfig.container.borderRadius) !== null && _e !== void 0 ? _e : styleConfig.borderRadius }), inputs: Object.assign(Object.assign({}, styleConfig.inputs), { borderRadius: (_f = styleConfig.inputs.borderRadius) !== null && _f !== void 0 ? _f : styleConfig.borderRadius }) }); var theme = createTheme({ typography: { allVariants: { color: resolvedConfig.colors.primary }, button: { textTransform: 'none' }, fontFamily: styleConfig.fontFamily, h1: { fontSize: 30, fontWeight: 600, lineHeight: '125%' }, h2: { fontSize: 24, fontWeight: 600, lineHeight: '125%' }, h3: { fontSize: 20, fontWeight: 600, lineHeight: '125%' }, h4: { fontSize: 18, fontWeight: 600, lineHeight: '125%' }, body1: { fontSize: 18, fontWeight: 400, lineHeight: '150%' }, body2: { fontSize: 14, fontWeight: 400, lineHeight: '150%' } }, overrides: { MuiRadio: { root: { color: resolvedConfig.colors.primary }, colorPrimary: { '&$checked': { color: resolvedConfig.colors.primary }, '&.Mui-disabled': { color: resolvedConfig.colors.secondary } } }, MuiIconButton: { root: { color: resolvedConfig.colors.primary } }, MuiPaper: { root: { backgroundColor: resolvedConfig.container.backgroundColor, border: '1px solid', borderColor: resolvedConfig.colors.subtle, borderRadius: resolvedConfig.container.borderRadius } }, MuiTypography: { colorTextSecondary: { color: resolvedConfig.colors.secondary }, colorError: { color: resolvedConfig.colors.error } } }, styleConfig: resolvedConfig }); return theme; };
+var ContextProvider = function ContextProvider(_ref11) { var theme = _ref11.theme, options = _ref11.options, children = _ref11.children; var clientAndConfig = F$3(function () { return { client: options.client, config: options.config }; }, [options]); return /*#__PURE__*/ wn.createElement(ThemeProvider, { theme: theme }, /*#__PURE__*/ wn.createElement(StytchClientContext.Provider, { value: clientAndConfig }, children)); };
+var AdminPortalWrapper = function AdminPortalWrapper(_ref12) { var children = _ref12.children, options = _ref12.options; var theme = getTheme(options.styles); return /*#__PURE__*/ wn.createElement(ContextProvider, { options: options, theme: theme }, /*#__PURE__*/ wn.createElement(MainContainer, null, /*#__PURE__*/ wn.createElement(ToastContextProvider, null, children))); };
 var ReportProblemOutlined = {};
 var _interopRequireDefault$9 = interopRequireDefaultExports;
 var _interopRequireWildcard$9 = interopRequireWildcardExports;
@@ -8543,10 +8697,10 @@ var React$9 = _interopRequireWildcard$9(require$$2);
 var _createSvgIcon$9 = _interopRequireDefault$9(requireCreateSvgIcon());
 var _default$9 = (0, _createSvgIcon$9["default"])(/*#__PURE__*/ React$9.createElement("path", { d: "M12 5.99L19.53 19H4.47L12 5.99M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z" }), 'ReportProblemOutlined');
 default_1$9 = ReportProblemOutlined["default"] = _default$9;
-var useStyles$i = makeStyles(function (theme) { return { alert: { color: theme.styleConfig.colors.primary, padding: theme.spacing(3), backgroundColor: theme.styleConfig.colors.accent, display: 'flex', gap: theme.spacing(1) } }; });
-var Alert = function Alert(_ref12) { var children = _ref12.children; var classes = useStyles$i(); return /*#__PURE__*/ wn.createElement("div", { className: classes.alert }, /*#__PURE__*/ wn.createElement(default_1$9, null), /*#__PURE__*/ wn.createElement(Typography, null, children)); };
+var useStyles$m = makeStyles(function (theme) { return { alert: { color: theme.styleConfig.colors.primary, padding: theme.spacing(3), backgroundColor: theme.styleConfig.colors.accent, display: 'flex', gap: theme.spacing(1) } }; });
+var Alert = function Alert(_ref13) { var children = _ref13.children; var classes = useStyles$m(); return /*#__PURE__*/ wn.createElement("div", { className: classes.alert }, /*#__PURE__*/ wn.createElement(default_1$9, null), /*#__PURE__*/ wn.createElement(Typography, null, children)); };
 var PageLoadingIndicator = function PageLoadingIndicator() { return /*#__PURE__*/ wn.createElement("div", { style: { height: '100%', minHeight: 400, display: 'flex', alignItems: 'center', justifyContent: 'center' } }, /*#__PURE__*/ wn.createElement(CircularProgress$1, { color: "inherit" })); };
-var useStytchClient = function useStytchClient() { var client = wn.useContext(StytchClientContext); if (!client) {
+var useStytchClient = function useStytchClient() { var client = wn.useContext(StytchClientContext).client; if (!client) {
     throw new Error('A Stytch client could not be found');
 } return client; };
 var useB2BInternals = function useB2BInternals() { var client = useStytchClient(); return readB2BInternals(client); };
@@ -8566,14 +8720,14 @@ var makeButtonStyles = makeStylesFactory(function (theme) { return { button: _de
 var variantToMUIVariant = { ghost: 'outlined', primary: 'contained', secondary: 'contained', text: 'text' };
 var ButtonCore = function ButtonCore(_a) { var children = _a.children, className = _a.className, compact = _a.compact, component = _a.component, variant = _a.variant, warning = _a.warning, classes = _a.classes, props = __rest(_a, ["children", "className", "compact", "component", "variant", "warning", "classes"]); var variantStyles = { ghost: classes.ghost, primary: classes.primary, secondary: classes.secondary, text: classes.text }; var buttonWarningStyles = { ghost: classes.warningGhost, primary: classes.warningPrimary, secondary: classes.warningPrimary, text: classes.warningText }; var buttonVariant = variant !== null && variant !== void 0 ? variant : 'primary'; var buttonStyles = warning ? buttonWarningStyles[buttonVariant] : variantStyles[buttonVariant]; return /*#__PURE__*/ wn.createElement(MUIButton, Object.assign({}, props, { className: C(classes.button, buttonStyles, _defineProperty2({}, classes.compact, compact), _defineProperty2({}, classes.iconOnly, !children), className), component: component !== null && component !== void 0 ? component : 'button', disableRipple: true, variant: variantToMUIVariant[buttonVariant] }), children); };
 var mixed = function mixed(color) { return "color-mix(in srgb, ".concat(color, " 80%, #333)"); };
-var useStyles$h = makeButtonStyles(function (theme) { var disabledStyle = { backgroundColor: theme.styleConfig.buttons.disabled.backgroundColor, borderColor: theme.styleConfig.buttons.disabled.borderColor, borderRadius: theme.styleConfig.buttons.disabled.borderRadius, color: theme.styleConfig.buttons.disabled.textColor }; return { button: { borderRadius: theme.styleConfig.borderRadius, fontWeight: 700 }, ghost: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.secondary.backgroundColor) }, backgroundColor: theme.styleConfig.buttons.secondary.backgroundColor, color: theme.styleConfig.buttons.secondary.textColor }, primary: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.primary.backgroundColor) }, backgroundColor: theme.styleConfig.buttons.primary.backgroundColor, color: theme.styleConfig.buttons.primary.textColor, borderRadius: theme.styleConfig.buttons.primary.borderRadius }, secondary: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.secondary.backgroundColor) }, backgroundColor: theme.styleConfig.buttons.secondary.backgroundColor, color: theme.styleConfig.buttons.secondary.textColor, borderRadius: theme.styleConfig.buttons.secondary.borderRadius }, text: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: 'rgba(0, 0, 0, 0.1)' }, backgroundColor: 'transparent', color: theme.styleConfig.colors.primary }, warningGhost: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.secondary.backgroundColor), borderColor: theme.styleConfig.colors.error, color: theme.styleConfig.colors.error }, backgroundColor: theme.styleConfig.buttons.secondary.backgroundColor, borderColor: theme.styleConfig.colors.error, color: theme.styleConfig.colors.error }, warningPrimary: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.colors.error), color: theme.styleConfig.buttons.primary.textColor }, backgroundColor: theme.styleConfig.colors.error, color: theme.styleConfig.buttons.primary.textColor }, warningText: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: 'rgba(0, 0, 0, 0.1)', color: theme.styleConfig.colors.error }, backgroundColor: 'transparent', color: theme.styleConfig.colors.error } }; });
-var Button = function Button(_a) { var props = __rest(_a, []); var classes = useStyles$h(); return /*#__PURE__*/ wn.createElement(ButtonCore, Object.assign({}, props, { classes: classes })); };
+var useStyles$l = makeButtonStyles(function (theme) { var disabledStyle = { backgroundColor: theme.styleConfig.buttons.disabled.backgroundColor, borderColor: theme.styleConfig.buttons.disabled.borderColor, borderRadius: theme.styleConfig.buttons.disabled.borderRadius, color: theme.styleConfig.buttons.disabled.textColor }; return { button: { borderRadius: theme.styleConfig.borderRadius, fontWeight: 700 }, ghost: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.secondary.backgroundColor) }, backgroundColor: theme.styleConfig.buttons.secondary.backgroundColor, color: theme.styleConfig.buttons.secondary.textColor }, primary: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.primary.backgroundColor) }, backgroundColor: theme.styleConfig.buttons.primary.backgroundColor, color: theme.styleConfig.buttons.primary.textColor, borderRadius: theme.styleConfig.buttons.primary.borderRadius }, secondary: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.secondary.backgroundColor) }, backgroundColor: theme.styleConfig.buttons.secondary.backgroundColor, color: theme.styleConfig.buttons.secondary.textColor, borderRadius: theme.styleConfig.buttons.secondary.borderRadius }, text: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: 'rgba(0, 0, 0, 0.1)' }, backgroundColor: 'transparent', color: theme.styleConfig.colors.primary }, warningGhost: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.buttons.secondary.backgroundColor), borderColor: theme.styleConfig.colors.error, color: theme.styleConfig.colors.error }, backgroundColor: theme.styleConfig.buttons.secondary.backgroundColor, borderColor: theme.styleConfig.colors.error, color: theme.styleConfig.colors.error }, warningPrimary: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: mixed(theme.styleConfig.colors.error), color: theme.styleConfig.buttons.primary.textColor }, backgroundColor: theme.styleConfig.colors.error, color: theme.styleConfig.buttons.primary.textColor }, warningText: { '&:disabled': disabledStyle, '&:hover': { backgroundColor: 'rgba(0, 0, 0, 0.1)', color: theme.styleConfig.colors.error }, backgroundColor: 'transparent', color: theme.styleConfig.colors.error } }; });
+var Button = function Button(_a) { var props = __rest(_a, []); var classes = useStyles$l(); return /*#__PURE__*/ wn.createElement(ButtonCore, Object.assign({}, props, { classes: classes })); };
 var getShortId = function getShortId(prefix) { return "".concat(prefix !== null && prefix !== void 0 ? prefix : '').concat(Math.random().toString(36).slice(-6)); };
 var useShortId = function useShortId(prefix) { return F$3(function () { return getShortId(prefix); }, [prefix]); };
 var DEFAULT_GAP = 1;
 var DEFAULT_GRID_COLUMN_WIDTH = 360;
 var DEFAULT_MAX_ITEM_WIDTH = 720 + DEFAULT_GAP;
-var FlexBox = function FlexBox(_ref13) { var children = _ref13.children, gap = _ref13.gap, alignItems = _ref13.alignItems, flexDirection = _ref13.flexDirection, justifyContent = _ref13.justifyContent, flexWrap = _ref13.flexWrap; var theme = useTheme(); return /*#__PURE__*/ wn.createElement("div", { style: { display: 'flex', gap: theme.spacing(gap !== null && gap !== void 0 ? gap : DEFAULT_GAP), alignItems: alignItems, justifyContent: justifyContent, flexDirection: flexDirection, flexWrap: flexWrap } }, children); };
+var FlexBox = function FlexBox(_ref14) { var children = _ref14.children, gap = _ref14.gap, alignItems = _ref14.alignItems, flexDirection = _ref14.flexDirection, justifyContent = _ref14.justifyContent, flexWrap = _ref14.flexWrap; var theme = useTheme(); return /*#__PURE__*/ wn.createElement("div", { style: { display: 'flex', gap: theme.spacing(gap !== null && gap !== void 0 ? gap : DEFAULT_GAP), alignItems: alignItems, justifyContent: justifyContent, flexDirection: flexDirection, flexWrap: flexWrap } }, children); };
 var useToggleState = function useToggleState(initialState) { var _h7 = h$4(false), _h8 = _slicedToArray2(_h7, 2), isOpen = _h8[0], setIsOpen = _h8[1]; var toggle = function toggle() { return setIsOpen(function (prev) { return !prev; }); }; var open = function open() { return setIsOpen(true); }; var close = function close() { return setIsOpen(false); }; return { close: close, isOpen: isOpen, open: open, toggle: toggle }; };
 var promiseNoop = function promiseNoop() { return Promise.resolve(); };
 var useModalState = function useModalState() { var confirmAction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : promiseNoop; var _useToggleState = useToggleState(), isOpen = _useToggleState.isOpen, open = _useToggleState.open, close = _useToggleState.close; var _useToast = useToast(), openToast = _useToast.openToast; var confirm = function confirm() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee() { return _regeneratorRuntime().wrap(function _callee$(_context) { while (1)
@@ -8596,8 +8750,8 @@ var useModalState = function useModalState() { var confirmAction = arguments.len
     } }, _callee, null, [[0, 5]]); })); }; return { isOpen: isOpen, open: open, close: close, confirm: confirm }; };
 var useAsyncState = h$4;
 var MODAL_WIDTH = 800;
-var useStyles$g = makeStyles(function (theme) { return { closeButton: { position: 'absolute', right: theme.spacing(1), top: theme.spacing(1) }, contentText: { whiteSpace: 'pre-line' }, dialog: { '& .MuiDialogTitle-root': { padding: theme.spacing(4, 4, 0, 4) }, '& .MuiDialogContent-root': { padding: theme.spacing(2, 4) }, '& .MuiDialogActions-root': { justifyContent: 'flex-start', padding: theme.spacing(2, 4, 4, 4) }, '& .MuiDialogActions-spacing > :not(:first-child)': { marginLeft: theme.spacing(2) }, '& .MuiDialog-paper': _defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2({}, theme.breakpoints.down('xs'), { width: '100%', margin: 0, borderRadius: 0 }), "backgroundColor", theme.styleConfig.container.backgroundColor), "borderRadius", theme.styleConfig.container.borderRadius), "width", MODAL_WIDTH), "maxWidth", MODAL_WIDTH), "margin", theme.spacing(6)) }, content: { display: 'flex', flexDirection: 'column', gap: theme.spacing(1.5) } }; });
-var Modal = function Modal(_ref14) { var cancelButtonText = _ref14.cancelButtonText, children = _ref14.children, description = _ref14.description, confirmButtonText = _ref14.confirmButtonText, disableConfirm = _ref14.disableConfirm, warning = _ref14.warning, close = _ref14.close, confirm = _ref14.confirm, title = _ref14.title, showLoadingOnConfirm = _ref14.showLoadingOnConfirm, noCancelButton = _ref14.noCancelButton, isOpen = _ref14.isOpen, keepOpenOnConfirm = _ref14.keepOpenOnConfirm; var classes = useStyles$g(); var _useAsyncState = useAsyncState(false), _useAsyncState2 = _slicedToArray2(_useAsyncState, 2), confirming = _useAsyncState2[0], setConfirming = _useAsyncState2[1]; var isXsScreen = useMediaQuery(function (theme) { return theme.breakpoints.down('xs'); }); var descriptionId = useShortId('confirmation-modal-description'); var titleId = useShortId('confirmation-modal-title'); var handleConfirm = function handleConfirm(e) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee2() { return _regeneratorRuntime().wrap(function _callee2$(_context2) { while (1)
+var useStyles$k = makeStyles(function (theme) { return { closeButton: { position: 'absolute', right: theme.spacing(1), top: theme.spacing(1) }, contentText: { whiteSpace: 'pre-line' }, dialog: { '& .MuiDialogTitle-root': { padding: theme.spacing(4, 4, 0, 4) }, '& .MuiDialogContent-root': { padding: theme.spacing(2, 4) }, '& .MuiDialogActions-root': { justifyContent: 'flex-start', padding: theme.spacing(2, 4, 4, 4) }, '& .MuiDialogActions-spacing > :not(:first-child)': { marginLeft: theme.spacing(2) }, '& .MuiDialog-paper': _defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2({}, theme.breakpoints.down('xs'), { width: '100%', margin: 0, borderRadius: 0 }), "backgroundColor", theme.styleConfig.container.backgroundColor), "borderRadius", theme.styleConfig.container.borderRadius), "width", MODAL_WIDTH), "maxWidth", MODAL_WIDTH), "margin", theme.spacing(6)) }, content: { display: 'flex', flexDirection: 'column', gap: theme.spacing(1.5) } }; });
+var Modal = function Modal(_ref15) { var cancelButtonText = _ref15.cancelButtonText, children = _ref15.children, description = _ref15.description, confirmButtonText = _ref15.confirmButtonText, disableConfirm = _ref15.disableConfirm, warning = _ref15.warning, close = _ref15.close, confirm = _ref15.confirm, title = _ref15.title, showLoadingOnConfirm = _ref15.showLoadingOnConfirm, noCancelButton = _ref15.noCancelButton, isOpen = _ref15.isOpen, keepOpenOnConfirm = _ref15.keepOpenOnConfirm; var classes = useStyles$k(); var _useAsyncState = useAsyncState(false), _useAsyncState2 = _slicedToArray2(_useAsyncState, 2), confirming = _useAsyncState2[0], setConfirming = _useAsyncState2[1]; var isXsScreen = useMediaQuery(function (theme) { return theme.breakpoints.down('xs'); }); var descriptionId = useShortId('confirmation-modal-description'); var titleId = useShortId('confirmation-modal-title'); var handleConfirm = function handleConfirm(e) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee2() { return _regeneratorRuntime().wrap(function _callee2$(_context2) { while (1)
     switch (_context2.prev = _context2.next) {
         case 0:
             e.preventDefault();
@@ -8616,7 +8770,7 @@ var Modal = function Modal(_ref14) { var cancelButtonText = _ref14.cancelButtonT
         case 10:
         case "end": return _context2.stop();
     } }, _callee2, null, [[2, , 6, 10]]); })); }; var onClose = function onClose() { close(); }; var confirmDisabled = confirming || disableConfirm; return /*#__PURE__*/ wn.createElement(Dialog$1, { "aria-describedby": descriptionId, "aria-labelledby": titleId, className: classes.dialog, fullScreen: isXsScreen, onClose: onClose, open: isOpen }, isXsScreen && ( /*#__PURE__*/wn.createElement(IconButton$1, { className: classes.closeButton, disableRipple: true, onClick: onClose }, /*#__PURE__*/ wn.createElement(default_1$b, { fontSize: "small" }))), /*#__PURE__*/ wn.createElement(DialogTitle$1, { id: titleId }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, title)), /*#__PURE__*/ wn.createElement("form", { onSubmit: handleConfirm }, /*#__PURE__*/ wn.createElement(DialogContent$1, { className: classes.content }, description && /*#__PURE__*/ wn.createElement(Typography, null, description), children && /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column" }, children)), /*#__PURE__*/ wn.createElement(DialogActions$1, null, !noCancelButton && ( /*#__PURE__*/wn.createElement(Button, { autoFocus: warning, disabled: confirming, onClick: onClose, variant: "ghost" }, cancelButtonText !== null && cancelButtonText !== void 0 ? cancelButtonText : "Cancel")), /*#__PURE__*/ wn.createElement(Button, { autoFocus: !warning, disabled: confirmDisabled, type: "submit", variant: "primary", warning: warning }, confirming && showLoadingOnConfirm ? /*#__PURE__*/ wn.createElement(CircularProgress$1, { size: 18 }) : confirmButtonText !== null && confirmButtonText !== void 0 ? confirmButtonText : 'Ok')))); };
-var useMutateWithToast = function useMutateWithToast(callback) { var _useToast2 = useToast(), openToast = _useToast2.openToast; var mutate = T$2(function (properties) { var _ref15 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, errorMessage = _ref15.errorMessage; return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee3() { return _regeneratorRuntime().wrap(function _callee3$(_context3) { while (1)
+var useMutateWithToast = function useMutateWithToast(callback) { var _useToast2 = useToast(), openToast = _useToast2.openToast; var mutate = T$2(function (properties) { var _ref16 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, errorMessage = _ref16.errorMessage; return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee3() { return _regeneratorRuntime().wrap(function _callee3$(_context3) { while (1)
     switch (_context3.prev = _context3.next) {
         case 0:
             _context3.prev = 0;
@@ -8634,14 +8788,14 @@ var useMutateWithToast = function useMutateWithToast(callback) { var _useToast2
         case "end": return _context3.stop();
     } }, _callee3, null, [[0, 6]]); })); }, [callback, openToast]); return { mutate: mutate }; };
 var ssoGetConnectionsKey = function ssoGetConnectionsKey(orgId) { return ['sso.getConnections', orgId]; };
-var useSsoConnections = function useSsoConnections() { var _a; var client = useStytchClient(); var orgId = (_a = client.organization.getSync()) === null || _a === void 0 ? void 0 : _a.organization_id; return useSWR(ssoGetConnectionsKey(orgId), function () { return client.sso.getConnections(); }); };
+var useSsoConnections = function useSsoConnections(canGetSso) { var _a; var client = useStytchClient(); var orgId = (_a = client.organization.getSync()) === null || _a === void 0 ? void 0 : _a.organization_id; return useSWR(canGetSso ? ssoGetConnectionsKey(orgId) : null, function () { return client.sso.getConnections(); }); };
 var useRevalidateConnectionList = function useRevalidateConnectionList() { var _useSWRConfig = useSWRConfig(), mutate = _useSWRConfig.mutate; var client = useStytchClient(); return T$2(function () { var _a; var orgId = (_a = client.organization.getSync()) === null || _a === void 0 ? void 0 : _a.organization_id; if (orgId) {
     return mutate(ssoGetConnectionsKey(orgId));
 } }, [client.organization, mutate]); };
 var mutateSamlConnection = function mutateSamlConnection(client) { return function (options) { return client.sso.saml.updateConnection(options); }; };
 var mutateOidcConnection = function mutateOidcConnection(client) { return function (options) { return client.sso.oidc.updateConnection(options); }; };
 var updateConnectionByURL = function updateConnectionByURL(client) { return function (options) { return client.sso.saml.updateConnectionByURL(options); }; };
-var deleteConnection = function deleteConnection(client) { return function (_ref16) { var connection_id = _ref16.connection_id; return client.sso.deleteConnection(connection_id); }; };
+var deleteConnection = function deleteConnection(client) { return function (_ref17) { var connection_id = _ref17.connection_id; return client.sso.deleteConnection(connection_id); }; };
 var deleteVerificationCertificate = function deleteVerificationCertificate(client) { return function (options) { return client.sso.saml.deleteVerificationCertificate(options); }; };
 var useMutateFnSsoConnection = function useMutateFnSsoConnection(mutateFn) { var _useSWRConfig2 = useSWRConfig(), mutateSWR = _useSWRConfig2.mutate; var client = useStytchClient(); var revalidateConnectionList = useRevalidateConnectionList(); return useMutateWithToast(T$2(function (options) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee4() { return _regeneratorRuntime().wrap(function _callee4$(_context4) { while (1)
     switch (_context4.prev = _context4.next) {
@@ -8658,8 +8812,8 @@ var useDeleteSsoConnectionCert = function useDeleteSsoConnectionCert() { return
 var useMutateSsoConnection = function useMutateSsoConnection(connectionType) { return useMutateFnSsoConnection(connectionType === 'saml' ? mutateSamlConnection : mutateOidcConnection); };
 var useMutateSamlConnection = function useMutateSamlConnection() { return useMutateSsoConnection('saml'); };
 var DeleteConfirmModal = function DeleteConfirmModal(_a) { var connectionName = _a.connectionName, modalProps = __rest(_a, ["connectionName"]); return /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, modalProps, { title: "Delete ".concat(connectionName || 'connection', "?"), confirmButtonText: "Delete", warning: true }), /*#__PURE__*/ wn.createElement(Typography, null, "Once deleted, the connection cannot be restored. Any members assigned implicit roles via this connection, as well as members allowed to JIT provision via this SSO connection, will lose access immediately.")); };
-var useMutateDeleteConnection = function useMutateDeleteConnection() { var _useDeleteSsoConnecti = useDeleteSsoConnection(), mutate = _useDeleteSsoConnecti.mutate; var deleteConnection = function deleteConnection(_ref17) { var connectionId = _ref17.connectionId; return mutate({ connection_id: connectionId }); }; return { deleteConnection: deleteConnection }; };
-var useDeleteConnection = function useDeleteConnection() { var _ref18 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, onConfirm = _ref18.onConfirm; var _h9 = h$4(), _h10 = _slicedToArray2(_h9, 2), connection = _h10[0], setConnection = _h10[1]; var _useMutateDeleteConne = useMutateDeleteConnection(), deleteConnection = _useMutateDeleteConne.deleteConnection; var handleConfirm = function handleConfirm() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee5() { return _regeneratorRuntime().wrap(function _callee5$(_context5) { while (1)
+var useMutateDeleteConnection = function useMutateDeleteConnection() { var _useDeleteSsoConnecti = useDeleteSsoConnection(), mutate = _useDeleteSsoConnecti.mutate; var deleteConnection = function deleteConnection(_ref18) { var connectionId = _ref18.connectionId; return mutate({ connection_id: connectionId }); }; return { deleteConnection: deleteConnection }; };
+var useDeleteConnection = function useDeleteConnection() { var _ref19 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, onConfirm = _ref19.onConfirm; var _h9 = h$4(), _h10 = _slicedToArray2(_h9, 2), connection = _h10[0], setConnection = _h10[1]; var _useMutateDeleteConne = useMutateDeleteConnection(), deleteConnection = _useMutateDeleteConne.deleteConnection; var handleConfirm = function handleConfirm() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee5() { return _regeneratorRuntime().wrap(function _callee5$(_context5) { while (1)
     switch (_context5.prev = _context5.next) {
         case 0:
             if (!connection) {
@@ -8681,24 +8835,24 @@ var useDeleteConnection = function useDeleteConnection() { var _ref18 = argument
         case "end": return _context5.stop();
     } }, _callee5, null, [[1, 6]]); })); }; var _useModalState = useModalState(handleConfirm), close = _useModalState.close, confirm = _useModalState.confirm, isOpen = _useModalState.isOpen, open = _useModalState.open; var handleRequestDelete = T$2(function (connection) { setConnection(connection); open(); }, [open]); return { handleRequestDelete: handleRequestDelete, modalProps: { connectionName: connection === null || connection === void 0 ? void 0 : connection.displayName, isOpen: isOpen, close: close, confirm: confirm } }; };
 var makeTagStyles = makeStylesFactory(function (theme) { return { tag: { fontFamily: 'IBM Plex Mono, monospace', fontSize: 18, fontWeight: 400, lineHeight: '150%', padding: theme.spacing(0, 1), borderRadius: 4, width: 'fit-content' } }; });
-var TagCore = function TagCore(_ref19) { var children = _ref19.children, classes = _ref19.classes; return /*#__PURE__*/ wn.createElement("span", { className: classes.tag }, children); };
-var useStyles$f = makeTagStyles(function (theme) { return { tag: { fontFamily: theme.styleConfig.fontFamily, fontSize: function fontSize(_ref20) { var size = _ref20.size; return size === 'sm' ? 14 : 18; }, backgroundColor: theme.styleConfig.colors.accent, color: theme.styleConfig.colors.accentText } }; });
-var Tag = function Tag(props) { var classes = useStyles$f(props); return /*#__PURE__*/ wn.createElement(TagCore, Object.assign({}, props, { classes: classes })); };
+var TagCore = function TagCore(_ref20) { var children = _ref20.children, classes = _ref20.classes; return /*#__PURE__*/ wn.createElement("span", { className: classes.tag }, children); };
+var useStyles$j = makeTagStyles(function (theme) { return { tag: { fontFamily: theme.styleConfig.fontFamily, fontSize: function fontSize(_ref21) { var size = _ref21.size; return size === 'sm' ? 14 : 18; }, backgroundColor: theme.styleConfig.colors.accent, color: theme.styleConfig.colors.accentText } }; });
+var Tag = function Tag(props) { var classes = useStyles$j(props); return /*#__PURE__*/ wn.createElement(TagCore, Object.assign({}, props, { classes: classes })); };
 var organizationGetKey = function organizationGetKey(orgId) { return ['organization.get', orgId]; };
 var useOrgInfo = function useOrgInfo() { var _a; var client = useStytchClient(); var orgId = (_a = client.organization.getSync()) === null || _a === void 0 ? void 0 : _a.organization_id; return useSWR(organizationGetKey(orgId), function () { return client.organization.get(); }); };
 var deepEqual = createDeepEqual();
 var CODE_HORIZONTAL_PADDING = 1;
 var commonCodeStyles$1 = { code: { borderRadius: 4, width: 'fit-content' } };
 var makeCodeStyles = makeStylesFactory(commonCodeStyles$1, function (theme) { return { code: { fontFamily: 'IBM Plex Mono, monospace', fontSize: 16, fontWeight: 400, lineHeight: '150%', padding: theme.spacing(0.5, CODE_HORIZONTAL_PADDING), wordBreak: 'break-word' } }; });
-var CodeCore = function CodeCore(_ref21) { var children = _ref21.children, classes = _ref21.classes; return /*#__PURE__*/ wn.createElement("span", { className: C(classes.code) }, children); };
+var CodeCore = function CodeCore(_ref22) { var children = _ref22.children, classes = _ref22.classes; return /*#__PURE__*/ wn.createElement("span", { className: C(classes.code) }, children); };
 var commonCodeStyles = function commonCodeStyles(theme) { return { code: { color: theme.styleConfig.colors.accentText, backgroundColor: theme.styleConfig.colors.accent } }; };
-var useStyles$e = makeCodeStyles(commonCodeStyles);
-var Code = function Code(props) { var classes = useStyles$e(); return /*#__PURE__*/ wn.createElement(CodeCore, Object.assign({}, props, { classes: classes })); };
-var useStyles$d = makeStyles(function () { return { labelContainer: { display: 'flex', alignItems: 'center' } }; });
-var LabelCore = function LabelCore(_ref22) { var children = _ref22.children, disabled = _ref22.disabled, htmlFor = _ref22.htmlFor, required = _ref22.required, _ref22$variant = _ref22.variant, variant = _ref22$variant === void 0 ? 'body2' : _ref22$variant, Typography = _ref22.TypographyComponent; var classes = useStyles$d(); return /*#__PURE__*/ wn.createElement("span", { className: classes.labelContainer }, /*#__PURE__*/ wn.createElement("label", { "aria-required": required, htmlFor: htmlFor }, /*#__PURE__*/ wn.createElement(Typography, { disabled: disabled, variant: variant }, children)), required && ( /*#__PURE__*/wn.createElement(Typography, { color: "error", disabled: disabled, variant: "body2" }, "*"))); };
+var useStyles$i = makeCodeStyles(commonCodeStyles);
+var Code = function Code(props) { var classes = useStyles$i(); return /*#__PURE__*/ wn.createElement(CodeCore, Object.assign({}, props, { classes: classes })); };
+var useStyles$h = makeStyles(function () { return { labelContainer: { display: 'flex', alignItems: 'center' } }; });
+var LabelCore = function LabelCore(_ref23) { var children = _ref23.children, disabled = _ref23.disabled, htmlFor = _ref23.htmlFor, required = _ref23.required, _ref23$variant = _ref23.variant, variant = _ref23$variant === void 0 ? 'body2' : _ref23$variant, Typography = _ref23.TypographyComponent; var classes = useStyles$h(); return /*#__PURE__*/ wn.createElement("span", { className: classes.labelContainer }, /*#__PURE__*/ wn.createElement("label", { "aria-required": required, htmlFor: htmlFor }, /*#__PURE__*/ wn.createElement(Typography, { disabled: disabled, variant: variant }, children)), required && ( /*#__PURE__*/wn.createElement(Typography, { color: "error", disabled: disabled, variant: "body2" }, "*"))); };
 var Label = function Label(props) { return /*#__PURE__*/ wn.createElement(LabelCore, Object.assign({}, props, { TypographyComponent: Typography })); };
 var makeCopyableTextStyles = makeStylesFactory(commonCodeStyles$1, function (theme) { return { copyableText: { '&:hover': { marginRight: 0 }, '& svg': { marginRight: theme.spacing(CODE_HORIZONTAL_PADDING) }, borderRadius: 4, display: 'flex', alignItems: 'center', height: 'fit-content', width: 'fit-content', marginRight: theme.spacing(3.5) }, copyIcon: { '& svg': { marginRight: theme.spacing(CODE_HORIZONTAL_PADDING) } }, hasCopiedIcon: { marginRight: 0 }, noWrap: { '& span': { wordBreak: 'unset', whiteSpace: 'nowrap' } } }; });
-var CopyableTextCore = function CopyableTextCore(_ref23) { var children = _ref23.children, textToCopy = _ref23.textToCopy, noWrap = _ref23.noWrap, id = _ref23.id, label = _ref23.label, classes = _ref23.classes, Code = _ref23.CodeComponent, Label = _ref23.LabelComponent, Typography = _ref23.TypographyComponent, useClickToCopy = _ref23.useClickToCopy; var _a; var inputId = useShortId(id); if (children && typeof children !== 'string') {
+var CopyableTextCore = function CopyableTextCore(_ref24) { var children = _ref24.children, textToCopy = _ref24.textToCopy, noWrap = _ref24.noWrap, id = _ref24.id, label = _ref24.label, classes = _ref24.classes, Code = _ref24.CodeComponent, Label = _ref24.LabelComponent, Typography = _ref24.TypographyComponent, useClickToCopy = _ref24.useClickToCopy; var _a; var inputId = useShortId(id); if (children && typeof children !== 'string') {
     throw new Error('CopyableText children must be a string');
 } var _useClickToCopy = useClickToCopy({ text: (_a = textToCopy !== null && textToCopy !== void 0 ? textToCopy : children) !== null && _a !== void 0 ? _a : '' }), copied = _useClickToCopy.copied, copyToClipboard = _useClickToCopy.copyToClipboard, CopyIcon = _useClickToCopy.CopyIcon, containerHoverClass = _useClickToCopy.containerHoverClass; return /*#__PURE__*/ wn.createElement("div", { className: C(_defineProperty2({}, classes.noWrap, noWrap)) }, label && /*#__PURE__*/ wn.createElement(Label, { htmlFor: inputId }, label), !children && /*#__PURE__*/ wn.createElement(Typography, null, "\u2013"), children && ( /*#__PURE__*/wn.createElement("span", { className: C(containerHoverClass, classes.copyableText, classes.code, _defineProperty2({}, classes.hasCopiedIcon, copied)), onClick: copyToClipboard }, /*#__PURE__*/ wn.createElement(Code, null, children), /*#__PURE__*/ wn.createElement("div", { className: classes.copyIcon }, CopyIcon)))); };
 var CheckCircleOutlined = {};
@@ -8720,26 +8874,26 @@ var _createSvgIcon$7 = _interopRequireDefault$7(requireCreateSvgIcon());
 var _default$7 = (0, _createSvgIcon$7["default"])(/*#__PURE__*/ React$7.createElement("path", { d: "M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-1 4H8c-1.1 0-1.99.9-1.99 2L6 21c0 1.1.89 2 1.99 2H19c1.1 0 2-.9 2-2V11l-6-6zM8 21V7h6v5h5v9H8z" }), 'FileCopyOutlined');
 default_1$7 = FileCopyOutlined["default"] = _default$7;
 var makeClickToCopyStyles = makeStylesFactory({ checkCircle: { display: 'block !important' }, darkBackground: {}, containerHover: { '&:hover': { '& svg': { display: 'block' }, cursor: 'pointer' }, '& svg': { display: 'none' } } });
-var useClickToCopyCore = function useClickToCopyCore(_ref24) { var classes = _ref24.classes, darkBackground = _ref24.darkBackground, _ref24$iconSize = _ref24.iconSize, iconSize = _ref24$iconSize === void 0 ? 'small' : _ref24$iconSize, text = _ref24.text; var _h11 = h$4(false), _h12 = _slicedToArray2(_h11, 2), copied = _h12[0], setCopied = _h12[1]; var copyToClipboard = function copyToClipboard(e) { e.stopPropagation(); setCopied(true); navigator.clipboard.writeText(text); setTimeout(function () { return setCopied(false); }, 1000); }; var CopyIcon = copied ? ( /*#__PURE__*/wn.createElement(default_1$8, { className: C(classes.checkCircle, _defineProperty2({}, classes.darkBackground, darkBackground)), fontSize: iconSize })) : ( /*#__PURE__*/wn.createElement(default_1$7, { fontSize: iconSize })); return { copied: copied, copyToClipboard: copyToClipboard, CopyIcon: CopyIcon, containerHoverClass: classes.containerHover }; };
-var useStyles$c = makeClickToCopyStyles();
-var useClickToCopy = function useClickToCopy(params) { var classes = useStyles$c(); return useClickToCopyCore(Object.assign(Object.assign({}, params), { classes: classes })); };
-var useStyles$b = makeCopyableTextStyles(commonCodeStyles, { copyableText: { whiteSpace: function whiteSpace(_ref25) { var _whiteSpace = _ref25.whiteSpace; return _whiteSpace; } } });
-var CopyableText = function CopyableText(props) { var classes = useStyles$b(props); return /*#__PURE__*/ wn.createElement(CopyableTextCore, Object.assign({}, props, { CodeComponent: Code, LabelComponent: Label, TypographyComponent: Typography, classes: classes, useClickToCopy: useClickToCopy })); };
+var useClickToCopyCore = function useClickToCopyCore(_ref25) { var classes = _ref25.classes, darkBackground = _ref25.darkBackground, _ref25$iconSize = _ref25.iconSize, iconSize = _ref25$iconSize === void 0 ? 'small' : _ref25$iconSize, text = _ref25.text; var _h11 = h$4(false), _h12 = _slicedToArray2(_h11, 2), copied = _h12[0], setCopied = _h12[1]; var copyToClipboard = function copyToClipboard(e) { e.stopPropagation(); setCopied(true); navigator.clipboard.writeText(text); setTimeout(function () { return setCopied(false); }, 1000); }; var CopyIcon = copied ? ( /*#__PURE__*/wn.createElement(default_1$8, { className: C(classes.checkCircle, _defineProperty2({}, classes.darkBackground, darkBackground)), fontSize: iconSize })) : ( /*#__PURE__*/wn.createElement(default_1$7, { fontSize: iconSize })); return { copied: copied, copyToClipboard: copyToClipboard, CopyIcon: CopyIcon, containerHoverClass: classes.containerHover }; };
+var useStyles$g = makeClickToCopyStyles();
+var useClickToCopy = function useClickToCopy(params) { var classes = useStyles$g(); return useClickToCopyCore(Object.assign(Object.assign({}, params), { classes: classes })); };
+var useStyles$f = makeCopyableTextStyles(commonCodeStyles, { copyableText: { whiteSpace: function whiteSpace(_ref26) { var _whiteSpace = _ref26.whiteSpace; return _whiteSpace; } } });
+var CopyableText = function CopyableText(props) { var classes = useStyles$f(props); return /*#__PURE__*/ wn.createElement(CopyableTextCore, Object.assign({}, props, { CodeComponent: Code, LabelComponent: Label, TypographyComponent: Typography, classes: classes, useClickToCopy: useClickToCopy })); };
 var makeInputStyles = makeStylesFactory(function (theme) { return { inputContainer: _defineProperty2(_defineProperty2(_defineProperty2({}, theme.breakpoints.down('sm'), { width: '100%', minWidth: 'unset', flex: 1 }), "width", DEFAULT_GRID_COLUMN_WIDTH), "minWidth", DEFAULT_GRID_COLUMN_WIDTH), multilineContainer: { width: '100%', maxWidth: DEFAULT_MAX_ITEM_WIDTH }, readOnlyContainer: { display: '-webkit-box', '-webkit-line-clamp': 2, '-webkit-box-orient': 'vertical', overflow: 'hidden', overflowWrap: 'break-word' }, input: { '& .MuiOutlinedInput-notchedOutline': { border: '1px solid', borderRadius: 4 }, '&.MuiOutlinedInput-multiline': { padding: 0 }, '& [class*="MuiOutlinedInput-input"]': { '&::placeholder': { opacity: 1 }, padding: theme.spacing(1) }, '&:hover .MuiOutlinedInput-notchedOutline, &.Mui-focused .MuiOutlinedInput-notchedOutline': { borderWidth: 1 } }, fullWidth: { width: '100%' }, fileUploadContainer: { alignItems: 'center', display: 'flex', marginBottom: theme.spacing(0.5), gap: theme.spacing(0.5) }, fileUploadHidden: { display: 'none' } }; });
 var FILE_UPLOAD_ID = 'file-upload';
-var FileUpload = function FileUpload(_ref26) { var onChange = _ref26.onChange, readOnly = _ref26.readOnly, filename = _ref26.filename, setFilename = _ref26.setFilename, classes = _ref26.classes, Button = _ref26.ButtonComponent, Typography = _ref26.TypographyComponent; var _h13 = h$4(new FileReader()), _h14 = _slicedToArray2(_h13, 1), fileReader = _h14[0]; var fileInputKey = Math.floor(Math.random() * 10000); p$3(function () { var onLoad = function onLoad() { if (typeof fileReader.result === 'string') {
+var FileUpload = function FileUpload(_ref27) { var onChange = _ref27.onChange, readOnly = _ref27.readOnly, filename = _ref27.filename, setFilename = _ref27.setFilename, classes = _ref27.classes, Button = _ref27.ButtonComponent, Typography = _ref27.TypographyComponent; var _h13 = h$4(new FileReader()), _h14 = _slicedToArray2(_h13, 1), fileReader = _h14[0]; var fileInputKey = Math.floor(Math.random() * 10000); p$3(function () { var onLoad = function onLoad() { if (typeof fileReader.result === 'string') {
     onChange === null || onChange === void 0 ? void 0 : onChange(fileReader.result);
 } }; fileReader.addEventListener('load', onLoad); return function () { return fileReader.removeEventListener('load', onLoad); }; }, [fileReader, onChange]); p$3(function () { setFilename(null); }, [readOnly, setFilename]); var onFileUpload = function onFileUpload(event) { var file = event.target.files ? event.target.files[0] : null; var filename = (file === null || file === void 0 ? void 0 : file.name) ? file.name.replace('C:\\fakepath\\', '') : null; setFilename(filename); if (file) {
     fileReader.readAsText(file);
 } }; var resetFileUpload = function resetFileUpload() { var inputElement = document.querySelector('input[type=file]'); if (inputElement) {
     inputElement.value = '';
 } }; var uploadedFilename = filename !== null && filename !== void 0 ? filename : 'No file chosen'; var fileInputId = "".concat(FILE_UPLOAD_ID, "-").concat(fileInputKey); return /*#__PURE__*/ wn.createElement("label", { className: classes.fileUploadContainer, htmlFor: fileInputId }, /*#__PURE__*/ wn.createElement("input", { className: classes.fileUploadHidden, id: fileInputId, onChange: onFileUpload, onClick: resetFileUpload, type: "file" }), /*#__PURE__*/ wn.createElement(Button, { compact: true, component: "span", variant: "secondary" }, "Choose file"), /*#__PURE__*/ wn.createElement(Typography, null, uploadedFilename)); };
-var InputCore = function InputCore(_ref27) { var caption = _ref27.caption, copyable = _ref27.copyable, disabled = _ref27.disabled, error = _ref27.error, fileUpload = _ref27.fileUpload, fullWidth = _ref27.fullWidth, id = _ref27.id, inputProps = _ref27.inputProps, inputRef = _ref27.inputRef, label = _ref27.label, multiline = _ref27.multiline, onBlur = _ref27.onBlur, onChange = _ref27.onChange, onFocus = _ref27.onFocus, onKeyDown = _ref27.onKeyDown, placeholder = _ref27.placeholder, readOnly = _ref27.readOnly, readOnlyConcealed = _ref27.readOnlyConcealed, required = _ref27.required, type = _ref27.type, value = _ref27.value, classes = _ref27.classes, ButtonComponent = _ref27.ButtonComponent, CopyableText = _ref27.CopyableTextComponent, Label = _ref27.LabelComponent, Typography = _ref27.TypographyComponent; var inputId = useShortId(id); var _h15 = h$4(null), _h16 = _slicedToArray2(_h15, 2), filename = _h16[0], setFilename = _h16[1]; var handleOnChange = function handleOnChange(e) { onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value); if (fileUpload && filename) {
+var InputCore = function InputCore(_ref28) { var caption = _ref28.caption, copyable = _ref28.copyable, disabled = _ref28.disabled, error = _ref28.error, fileUpload = _ref28.fileUpload, fullWidth = _ref28.fullWidth, id = _ref28.id, inputProps = _ref28.inputProps, inputRef = _ref28.inputRef, label = _ref28.label, multiline = _ref28.multiline, onBlur = _ref28.onBlur, onChange = _ref28.onChange, onFocus = _ref28.onFocus, onKeyDown = _ref28.onKeyDown, placeholder = _ref28.placeholder, readOnly = _ref28.readOnly, readOnlyConcealed = _ref28.readOnlyConcealed, required = _ref28.required, type = _ref28.type, value = _ref28.value, classes = _ref28.classes, ButtonComponent = _ref28.ButtonComponent, CopyableText = _ref28.CopyableTextComponent, Label = _ref28.LabelComponent, Typography = _ref28.TypographyComponent; var inputId = useShortId(id); var _h15 = h$4(null), _h16 = _slicedToArray2(_h15, 2), filename = _h16[0], setFilename = _h16[1]; var handleOnChange = function handleOnChange(e) { onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value); if (fileUpload && filename) {
     setFilename(null);
 } }; var showCaption = !!caption && !error; var concealedValue = (value === null || value === void 0 ? void 0 : value.length) ? '•'.repeat(Math.min(25, value.length)) : ''; var visibleValue = readOnlyConcealed ? concealedValue : value; var shouldDisable = disabled && !readOnly; var showCopyableText = readOnly && copyable && !!visibleValue; var showPlainText = readOnly && (!copyable || !visibleValue); return /*#__PURE__*/ wn.createElement("div", { className: C(classes.inputContainer, _defineProperty2(_defineProperty2(_defineProperty2({}, classes.multilineContainer, multiline), classes.readOnlyContainer, readOnly), classes.fullWidth, fullWidth)) }, label && ( /*#__PURE__*/wn.createElement(Label, { disabled: shouldDisable, htmlFor: inputId, required: required }, label)), showPlainText && /*#__PURE__*/ wn.createElement(Typography, null, visibleValue || '–'), showCopyableText && /*#__PURE__*/ wn.createElement(CopyableText, { textToCopy: value }, visibleValue), !readOnly && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, fileUpload && ( /*#__PURE__*/wn.createElement(FileUpload, { ButtonComponent: ButtonComponent, TypographyComponent: Typography, classes: classes, filename: filename, onChange: onChange, readOnly: shouldDisable, setFilename: setFilename })), /*#__PURE__*/ wn.createElement(OutlinedInput$1, { className: classes.input, disabled: shouldDisable, error: !!error, fullWidth: true, id: inputId, inputProps: inputProps, inputRef: inputRef, multiline: multiline, onBlur: onBlur, onChange: handleOnChange, onFocus: onFocus, onKeyDown: onKeyDown, placeholder: placeholder, required: required, rows: 3, type: type, value: value }), showCaption && ( /*#__PURE__*/wn.createElement(Typography, { disabled: shouldDisable, variant: "body2" }, caption)), error && ( /*#__PURE__*/wn.createElement(Typography, { color: "error", variant: "body2" }, error))))); };
-var useStyles$a = makeInputStyles(function (theme) { return { input: { color: theme.styleConfig.inputs.textColor, '& .MuiOutlinedInput-notchedOutline': { borderColor: theme.styleConfig.inputs.borderColor }, '& [class*="MuiOutlinedInput-input"]': { '&::placeholder': { color: theme.styleConfig.inputs.placeholderColor } }, '&.Mui-disabled .MuiOutlinedInput-notchedOutline': { borderColor: theme.styleConfig.inputs.borderColor }, '&:hover .MuiOutlinedInput-notchedOutline, &.Mui-focused .MuiOutlinedInput-notchedOutline': { borderColor: theme.styleConfig.inputs.borderColor }, '&.Mui-error': { color: theme.styleConfig.colors.error } } }; });
+var useStyles$e = makeInputStyles(function (theme) { return { input: { color: theme.styleConfig.inputs.textColor, '& .MuiOutlinedInput-notchedOutline': { borderColor: theme.styleConfig.inputs.borderColor }, '& [class*="MuiOutlinedInput-input"]': { '&::placeholder': { color: theme.styleConfig.inputs.placeholderColor } }, '&.Mui-disabled .MuiOutlinedInput-notchedOutline': { borderColor: theme.styleConfig.inputs.borderColor }, '&:hover .MuiOutlinedInput-notchedOutline, &.Mui-focused .MuiOutlinedInput-notchedOutline': { borderColor: theme.styleConfig.inputs.borderColor }, '&.Mui-error': { color: theme.styleConfig.colors.error } } }; });
 var LabelBody1 = function LabelBody1(props) { return /*#__PURE__*/ wn.createElement(Label, Object.assign({ variant: "body1" }, props)); };
-var Input = function Input(_a) { var labelVariant = _a.labelVariant, props = __rest(_a, ["labelVariant"]); var classes = useStyles$a(props); return /*#__PURE__*/ wn.createElement(InputCore, Object.assign({}, props, { classes: classes, ButtonComponent: Button, CopyableTextComponent: CopyableText, LabelComponent: labelVariant === 'body1' ? LabelBody1 : Label, TypographyComponent: Typography })); };
+var Input$1 = function Input$1(_a) { var labelVariant = _a.labelVariant, props = __rest(_a, ["labelVariant"]); var classes = useStyles$e(props); return /*#__PURE__*/ wn.createElement(InputCore, Object.assign({}, props, { classes: classes, ButtonComponent: Button, CopyableTextComponent: CopyableText, LabelComponent: labelVariant === 'body1' ? LabelBody1 : Label, TypographyComponent: Typography })); };
 var AddRounded = {};
 var _interopRequireDefault$6 = interopRequireDefaultExports;
 var _interopRequireWildcard$6 = interopRequireWildcardExports;
@@ -8749,11 +8903,11 @@ var React$6 = _interopRequireWildcard$6(require$$2);
 var _createSvgIcon$6 = _interopRequireDefault$6(requireCreateSvgIcon());
 var _default$6 = (0, _createSvgIcon$6["default"])(/*#__PURE__*/ React$6.createElement("path", { d: "M18 13h-5v5c0 .55-.45 1-1 1s-1-.45-1-1v-5H6c-.55 0-1-.45-1-1s.45-1 1-1h5V6c0-.55.45-1 1-1s1 .45 1 1v5h5c.55 0 1 .45 1 1s-.45 1-1 1z" }), 'AddRounded');
 default_1$6 = AddRounded["default"] = _default$6;
-var ContentSpacingCore = function ContentSpacingCore(_ref28) { var children = _ref28.children, gap = _ref28.gap; var theme = useTheme(); return /*#__PURE__*/ wn.createElement("div", { style: { display: 'flex', flexDirection: 'column', gap: theme.spacing(gap !== null && gap !== void 0 ? gap : DEFAULT_GAP) } }, children); };
+var ContentSpacingCore = function ContentSpacingCore(_ref29) { var children = _ref29.children, gap = _ref29.gap; var theme = useTheme(); return /*#__PURE__*/ wn.createElement("div", { style: { display: 'flex', flexDirection: 'column', gap: theme.spacing(gap !== null && gap !== void 0 ? gap : DEFAULT_GAP) } }, children); };
 var ADD_NEW_BUTTON_TEXT = 'Add new';
-var ListEditorCore = function ListEditorCore(_a) { var title = _a.title, description = _a.description, limit = _a.limit, addModalProps = _a.addModalProps, hideAddButton = _a.hideAddButton, onAdd = _a.onAdd, Button = _a.ButtonComponent, EmbeddedTable = _a.EmbeddedTableComponent, Modal = _a.ModalComponent, Typography = _a.TypographyComponent, embeddedTableProps = __rest(_a, ["title", "description", "limit", "addModalProps", "hideAddButton", "onAdd", "ButtonComponent", "EmbeddedTableComponent", "ModalComponent", "TypographyComponent"]); if (!addModalProps && !onAdd) {
+var ListEditorCore = function ListEditorCore(_a) { var title = _a.title, description = _a.description, limit = _a.limit, addModalProps = _a.addModalProps, hideAddButton = _a.hideAddButton, onAdd = _a.onAdd, addButtonText = _a.addButtonText, Button = _a.ButtonComponent, EmbeddedTable = _a.EmbeddedTableComponent, Modal = _a.ModalComponent, Typography = _a.TypographyComponent, embeddedTableProps = __rest(_a, ["title", "description", "limit", "addModalProps", "hideAddButton", "onAdd", "addButtonText", "ButtonComponent", "EmbeddedTableComponent", "ModalComponent", "TypographyComponent"]); if (!addModalProps && !onAdd) {
     throw new Error('Either addModalProps or onAdd prop must be provided');
-} var modalState = useModalState(addModalProps === null || addModalProps === void 0 ? void 0 : addModalProps.confirm); var items = embeddedTableProps.items, readOnly = embeddedTableProps.readOnly; var onClose = function onClose() { var _a; (_a = addModalProps === null || addModalProps === void 0 ? void 0 : addModalProps.close) === null || _a === void 0 ? void 0 : _a.call(addModalProps); modalState.close(); }; var addNew = addModalProps ? modalState.open : onAdd; return /*#__PURE__*/ wn.createElement(ContentSpacingCore, null, addModalProps && ( /*#__PURE__*/wn.createElement(Modal, Object.assign({}, addModalProps, modalState, { close: onClose }), addModalProps.content)), /*#__PURE__*/ wn.createElement("div", null, title && /*#__PURE__*/ wn.createElement(Typography, { variant: "h4" }, title), description && /*#__PURE__*/ wn.createElement(Typography, null, description)), items && items.length > 0 && ( /*#__PURE__*/wn.createElement(EmbeddedTable, Object.assign({}, embeddedTableProps, { bottomAction: !hideAddButton && (!limit || items.length < limit) && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: addNew, startIcon: /*#__PURE__*/ wn.createElement(default_1$6, null), variant: "text" }, ADD_NEW_BUTTON_TEXT)) }))), !hideAddButton && !readOnly && !items.length && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: addNew, startIcon: /*#__PURE__*/ wn.createElement(default_1$6, null), variant: "ghost" }, ADD_NEW_BUTTON_TEXT))); };
+} addButtonText = addButtonText || ADD_NEW_BUTTON_TEXT; var modalState = useModalState(addModalProps === null || addModalProps === void 0 ? void 0 : addModalProps.confirm); var items = embeddedTableProps.items, readOnly = embeddedTableProps.readOnly; var onClose = function onClose() { var _a; (_a = addModalProps === null || addModalProps === void 0 ? void 0 : addModalProps.close) === null || _a === void 0 ? void 0 : _a.call(addModalProps); modalState.close(); }; var addNew = addModalProps ? modalState.open : onAdd; return /*#__PURE__*/ wn.createElement(ContentSpacingCore, null, addModalProps && ( /*#__PURE__*/wn.createElement(Modal, Object.assign({}, addModalProps, modalState, { close: onClose }), addModalProps.content)), /*#__PURE__*/ wn.createElement("div", null, title && /*#__PURE__*/ wn.createElement(Typography, { variant: "h4" }, title), description && /*#__PURE__*/ wn.createElement(Typography, null, description)), items && items.length > 0 && ( /*#__PURE__*/wn.createElement(EmbeddedTable, Object.assign({}, embeddedTableProps, { bottomAction: !hideAddButton && (!limit || items.length < limit) && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: addNew, startIcon: /*#__PURE__*/ wn.createElement(default_1$6, null), variant: "text" }, addButtonText)) }))), !hideAddButton && !readOnly && !items.length && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: addNew, startIcon: /*#__PURE__*/ wn.createElement(default_1$6, null), variant: "ghost" }, addButtonText))); };
 var validateRowKey = function validateRowKey(items, rowKeyExtractor) { var _a; if (items.length > 0 && typeof items[0] !== 'string' && (!((_a = items[0]) === null || _a === void 0 ? void 0 : _a.id) || typeof items[0].id !== 'string') && !rowKeyExtractor) {
     throw new Error('rowKeyExtractor is required if items are not strings or do not have an id property');
 } };
@@ -8764,13 +8918,13 @@ var getTableCellValue = function getTableCellValue(children) { var value = child
 } return value; };
 var useTableActionStyles = makeStyles(function (theme) { return { tableActions: { display: 'flex', gap: theme.spacing(1), margin: theme.spacing(0, -1.25) } }; });
 var TABLE_ACTIONS_HEADER = 'Actions';
-var TableActionsCore = function TableActionsCore(_ref29) { var warningAction = _ref29.warningAction, action = _ref29.action, customAction = _ref29.customAction, Button = _ref29.ButtonComponent; var classes = useTableActionStyles(); return /*#__PURE__*/ wn.createElement("div", { className: classes.tableActions }, action && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: action.onClick, variant: "text" }, action.text)), warningAction && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: warningAction.onClick, variant: "text", warning: true }, warningAction.text)), customAction); };
+var TableActionsCore = function TableActionsCore(_ref30) { var warningAction = _ref30.warningAction, action = _ref30.action, customAction = _ref30.customAction, Button = _ref30.ButtonComponent; var classes = useTableActionStyles(); return /*#__PURE__*/ wn.createElement("div", { className: classes.tableActions }, action && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: action.onClick, variant: "text" }, action.text)), warningAction && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: warningAction.onClick, variant: "text", warning: true }, warningAction.text)), customAction); };
 var makeEmbeddedTableStyles = makeStylesFactory(function (theme) { return { embeddedTableWithActions: { width: 'calc(100% - 2px)' }, tableCell: { padding: theme.spacing(0.5, 1), minWidth: 80 }, tableActionsCell: { position: 'sticky', right: 0, width: '1%' }, tableHeader: {}, bottomAction: { borderBottom: 'none' } }; });
-var EmbeddedTableCore = function EmbeddedTableCore(_ref30) { var itemRenderer = _ref30.itemRenderer, items = _ref30.items, rowKeyExtractor = _ref30.rowKeyExtractor, getItemActionProps = _ref30.getItemActionProps, readOnly = _ref30.readOnly, bottomAction = _ref30.bottomAction, initialItemState = _ref30.initialItemState, classes = _ref30.classes, TableActions = _ref30.TableActionsComponent, Typography = _ref30.TypographyComponent; var tableActionClasses = useTableActionStyles(); validateRowKey(items, rowKeyExtractor); var getId = T$2(function (item) { return rowKeyExtractor ? rowKeyExtractor(item) : typeof item === 'string' ? item : item.id; }, [rowKeyExtractor]); var itemState = initialItemState !== null && initialItemState !== void 0 ? initialItemState : {}; var _h17 = h$4(items.reduce(function (acc, item) { return Object.assign(Object.assign({}, acc), _defineProperty2({}, getId(item), itemState)); }, {})), _h18 = _slicedToArray2(_h17, 2), itemsState = _h18[0], setItemsState = _h18[1]; var setItemState = function setItemState(item, state) { var id = getId(item); setItemsState(function (prevState) { return Object.assign(Object.assign({}, prevState), _defineProperty2({}, id, state)); }); }; p$3(function () { setItemsState(items.reduce(function (acc, item) { var _a; return Object.assign(Object.assign({}, acc), _defineProperty2({}, getId(item), (_a = itemsState[getId(item)]) !== null && _a !== void 0 ? _a : itemState)); }, {})); }, [items, getId]); return /*#__PURE__*/ wn.createElement(TableContainer$1, null, /*#__PURE__*/ wn.createElement(MUITable, { className: C(_defineProperty2({}, classes.embeddedTableWithActions, getItemActionProps)) }, /*#__PURE__*/ wn.createElement(TableHead$1, null, /*#__PURE__*/ wn.createElement(MUITableRow, null, itemRenderer.map(function (column) { return /*#__PURE__*/ wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableHeader), key: "col-header-".concat(column.title) }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, column.title)); }), !readOnly && getItemActionProps && ( /*#__PURE__*/wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableActionsCell, classes.tableHeader) }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, TABLE_ACTIONS_HEADER))))), /*#__PURE__*/ wn.createElement(TableBody$1, null, items.map(function (item) { var id = getId(item); return /*#__PURE__*/ wn.createElement(MUITableRow, { key: id }, itemRenderer.map(function (column, i) { var children = column.getValue(item, itemsState[id]); var value = getTableCellValue(children); return /*#__PURE__*/ wn.createElement(MUITableCell, { className: classes.tableCell, key: "col-".concat(column.title, "-").concat(i) }, typeof value === 'string' ? /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, value) : value); }), !readOnly && getItemActionProps && ( /*#__PURE__*/wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableActionsCell) }, /*#__PURE__*/ wn.createElement(TableActions, Object.assign({}, getItemActionProps(item, function (state) { return state && setItemState(item, state); }, itemsState[id])))))); }), !readOnly && bottomAction && ( /*#__PURE__*/wn.createElement(MUITableRow, null, /*#__PURE__*/ wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.bottomAction), colSpan: getItemActionProps ? itemRenderer.length : itemRenderer.length - 1 }), /*#__PURE__*/ wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableActionsCell, classes.bottomAction) }, /*#__PURE__*/ wn.createElement("div", { className: tableActionClasses.tableActions }, bottomAction))))))); };
+var EmbeddedTableCore = function EmbeddedTableCore(_ref31) { var itemRenderer = _ref31.itemRenderer, items = _ref31.items, rowKeyExtractor = _ref31.rowKeyExtractor, getItemActionProps = _ref31.getItemActionProps, readOnly = _ref31.readOnly, bottomAction = _ref31.bottomAction, initialItemState = _ref31.initialItemState, classes = _ref31.classes, TableActions = _ref31.TableActionsComponent, Typography = _ref31.TypographyComponent; var tableActionClasses = useTableActionStyles(); validateRowKey(items, rowKeyExtractor); var getId = T$2(function (item) { return rowKeyExtractor ? rowKeyExtractor(item) : typeof item === 'string' ? item : item.id; }, [rowKeyExtractor]); var itemState = initialItemState !== null && initialItemState !== void 0 ? initialItemState : {}; var _h17 = h$4(items.reduce(function (acc, item) { return Object.assign(Object.assign({}, acc), _defineProperty2({}, getId(item), itemState)); }, {})), _h18 = _slicedToArray2(_h17, 2), itemsState = _h18[0], setItemsState = _h18[1]; var setItemState = function setItemState(item, state) { var id = getId(item); setItemsState(function (prevState) { return Object.assign(Object.assign({}, prevState), _defineProperty2({}, id, state)); }); }; p$3(function () { setItemsState(items.reduce(function (acc, item) { var _a; return Object.assign(Object.assign({}, acc), _defineProperty2({}, getId(item), (_a = itemsState[getId(item)]) !== null && _a !== void 0 ? _a : itemState)); }, {})); }, [items, getId]); return /*#__PURE__*/ wn.createElement(TableContainer$1, null, /*#__PURE__*/ wn.createElement(MUITable, { className: C(_defineProperty2({}, classes.embeddedTableWithActions, getItemActionProps)) }, /*#__PURE__*/ wn.createElement(TableHead$1, null, /*#__PURE__*/ wn.createElement(MUITableRow, null, itemRenderer.map(function (column) { return /*#__PURE__*/ wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableHeader), key: "col-header-".concat(column.title) }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, column.title)); }), !readOnly && getItemActionProps && ( /*#__PURE__*/wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableActionsCell, classes.tableHeader) }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, TABLE_ACTIONS_HEADER))))), /*#__PURE__*/ wn.createElement(TableBody$1, null, items.map(function (item) { var id = getId(item); return /*#__PURE__*/ wn.createElement(MUITableRow, { key: id }, itemRenderer.map(function (column, i) { var children = column.getValue(item, itemsState[id]); var value = getTableCellValue(children); return /*#__PURE__*/ wn.createElement(MUITableCell, { className: classes.tableCell, key: "col-".concat(column.title, "-").concat(i) }, typeof value === 'string' ? /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, value) : value); }), !readOnly && getItemActionProps && ( /*#__PURE__*/wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableActionsCell) }, /*#__PURE__*/ wn.createElement(TableActions, Object.assign({}, getItemActionProps(item, function (state) { return state && setItemState(item, state); }, itemsState[id])))))); }), !readOnly && bottomAction && ( /*#__PURE__*/wn.createElement(MUITableRow, null, /*#__PURE__*/ wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.bottomAction), colSpan: getItemActionProps ? itemRenderer.length : itemRenderer.length - 1 }), /*#__PURE__*/ wn.createElement(MUITableCell, { className: C(classes.tableCell, classes.tableActionsCell, classes.bottomAction) }, /*#__PURE__*/ wn.createElement("div", { className: tableActionClasses.tableActions }, bottomAction))))))); };
 makeStyles(function (theme) { return { tableActions: { display: 'flex', gap: theme.spacing(1), margin: theme.spacing(0, -1.25) } }; });
 var TableActions = function TableActions(props) { return /*#__PURE__*/ wn.createElement(TableActionsCore, Object.assign({}, props, { ButtonComponent: Button })); };
-var useStyles$9 = makeEmbeddedTableStyles(function (theme) { return { tableHeader: { borderBottomColor: theme.styleConfig.colors.subtle } }; });
-var EmbeddedTable = function EmbeddedTable(props) { var classes = useStyles$9(); return /*#__PURE__*/ wn.createElement(EmbeddedTableCore, Object.assign({}, props, { TableActionsComponent: TableActions, TypographyComponent: Typography, classes: classes })); };
+var useStyles$d = makeEmbeddedTableStyles(function (theme) { return { tableHeader: { borderBottomColor: theme.styleConfig.colors.subtle } }; });
+var EmbeddedTable = function EmbeddedTable(props) { var classes = useStyles$d(); return /*#__PURE__*/ wn.createElement(EmbeddedTableCore, Object.assign({}, props, { TableActionsComponent: TableActions, TypographyComponent: Typography, classes: classes })); };
 var ListEditor = function ListEditor(props) { return /*#__PURE__*/ wn.createElement(ListEditorCore, Object.assign({}, props, { ButtonComponent: Button, EmbeddedTableComponent: EmbeddedTable, ModalComponent: Modal, TypographyComponent: Typography })); };
 var CheckRounded = {};
 var _interopRequireDefault$5 = interopRequireDefaultExports;
@@ -8810,7 +8964,7 @@ var _default$2 = (0, _createSvgIcon$2["default"])(/*#__PURE__*/ React$2.createEl
 default_1$2 = RemoveRounded["default"] = _default$2;
 var MULTISELECT_VALUE = 'all_values';
 var makeSelectStyles = makeStylesFactory(function (theme) { return { checkIcon: {}, menuPaper: { marginTop: theme.spacing(0.5), maxHeight: 280, maxWidth: DEFAULT_GRID_COLUMN_WIDTH }, readOnlyContainer: { display: '-webkit-box', '-webkit-line-clamp': 2, '-webkit-box-orient': 'vertical', overflow: 'hidden' }, select: { '& .MuiInputBase-root': { padding: 0 }, '& .MuiInputBase-input': { padding: theme.spacing(1, 3, 1, 1) }, '& .MuiSelect-icon': { fontSize: 20, marginRight: theme.spacing(0.5), marginTop: theme.spacing(0.25) }, '& .MuiSelect-select': { '&:focus': { backgroundColor: 'transparent' } }, '&:hover': {}, border: '1px solid', borderRadius: 4 }, selectContainer: _defineProperty2(_defineProperty2(_defineProperty2({}, theme.breakpoints.down('sm'), { width: '100%', minWidth: 'unset', flex: 1 }), "width", DEFAULT_GRID_COLUMN_WIDTH), "minWidth", DEFAULT_GRID_COLUMN_WIDTH), selectContainerOpen: {}, disabled: {}, fullWidth: { width: '100%' } }; });
-var SelectCore = function SelectCore(_ref31) { var caption = _ref31.caption, disabled = _ref31.disabled, fullWidth = _ref31.fullWidth, id = _ref31.id, label = _ref31.label, menuAnchorHorizontal = _ref31.menuAnchorHorizontal, selectItems = _ref31.selectItems, multiple = _ref31.multiple, onChange = _ref31.onChange, placeholder = _ref31.placeholder, readOnly = _ref31.readOnly, required = _ref31.required, value = _ref31.value, classes = _ref31.classes, Label = _ref31.LabelComponent, MenuItem = _ref31.MenuItemComponent, Typography = _ref31.TypographyComponent; var _a; var selectId = useShortId(id); var _h19 = h$4(false), _h20 = _slicedToArray2(_h19, 2), isOpen = _h20[0], setIsOpen = _h20[1]; var totalOptions = selectItems.filter(function (item) { return !item.disabled; }).length; var isMultiSelect = multiple && Array.isArray(value); var hasMoreThanOneChild = totalOptions > 1; var MultiSelectIcon; var canSelectAll; if (isMultiSelect && hasMoreThanOneChild) {
+var SelectCore = function SelectCore(_ref32) { var caption = _ref32.caption, disabled = _ref32.disabled, fullWidth = _ref32.fullWidth, id = _ref32.id, label = _ref32.label, menuAnchorHorizontal = _ref32.menuAnchorHorizontal, selectItems = _ref32.selectItems, multiple = _ref32.multiple, onChange = _ref32.onChange, placeholder = _ref32.placeholder, readOnly = _ref32.readOnly, required = _ref32.required, value = _ref32.value, classes = _ref32.classes, Label = _ref32.LabelComponent, MenuItem = _ref32.MenuItemComponent, Typography = _ref32.TypographyComponent; var _a; var selectId = useShortId(id); var _h19 = h$4(false), _h20 = _slicedToArray2(_h19, 2), isOpen = _h20[0], setIsOpen = _h20[1]; var totalOptions = selectItems.filter(function (item) { return !item.disabled; }).length; var isMultiSelect = multiple && Array.isArray(value); var hasMoreThanOneChild = totalOptions > 1; var MultiSelectIcon; var canSelectAll; if (isMultiSelect && hasMoreThanOneChild) {
     if (value.length > 0) {
         MultiSelectIcon = default_1$2;
         canSelectAll = false;
@@ -8836,16 +8990,16 @@ var SelectCore = function SelectCore(_ref31) { var caption = _ref31.caption, dis
 else if (Array.isArray(val) && val.length === totalOptions && hasMoreThanOneChild) {
     return 'All';
 } return renderText; }; var shouldDisable = disabled && !readOnly; return /*#__PURE__*/ wn.createElement("div", { className: C(classes.selectContainer, _defineProperty2(_defineProperty2(_defineProperty2({}, classes.selectContainerOpen, isOpen), classes.readOnlyContainer, readOnly), classes.fullWidth, fullWidth)) }, label && ( /*#__PURE__*/wn.createElement(Label, { disabled: shouldDisable, htmlFor: selectId, required: required }, label)), readOnly && /*#__PURE__*/ wn.createElement(Typography, null, (_a = getRenderValue(value)) !== null && _a !== void 0 ? _a : 'None selected'), !readOnly && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(MuiSelect, { IconComponent: default_1$3, MenuProps: { anchorOrigin: { horizontal: menuAnchorHorizontal !== null && menuAnchorHorizontal !== void 0 ? menuAnchorHorizontal : 'center', vertical: 'bottom' }, getContentAnchorEl: null, transformOrigin: { horizontal: 'center', vertical: 'top' }, PopoverClasses: { paper: classes.menuPaper } }, className: C(classes.select, _defineProperty2({}, classes.disabled, disabled)), disableUnderline: true, disabled: shouldDisable, displayEmpty: true, fullWidth: true, id: selectId, multiple: multiple, onChange: handleChange, onClose: function onClose() { return setIsOpen(false); }, onOpen: function onOpen() { return setIsOpen(true); }, renderValue: renderValue, value: value !== null && value !== void 0 ? value : '' }, isMultiSelect && hasMoreThanOneChild && ( /*#__PURE__*/wn.createElement(MenuItem, { Icon: MultiSelectIcon ? /*#__PURE__*/ wn.createElement(MultiSelectIcon, { className: classes.checkIcon, fontSize: "small" }) : /*#__PURE__*/ wn.createElement("div", null), forceSelected: !!MultiSelectIcon, label: canSelectAll ? 'Select all' : 'Unselect', onClick: canSelectAll ? selectAll : deselectAll, value: MULTISELECT_VALUE })), selectItems.map(function (menuItem) { return /*#__PURE__*/ wn.createElement(MenuItem, Object.assign({ Icon: /*#__PURE__*/ wn.createElement(default_1$5, { className: classes.checkIcon, fontSize: "small" }), key: menuItem.value }, menuItem)); })), caption && ( /*#__PURE__*/wn.createElement(Typography, { disabled: shouldDisable, variant: "body2" }, caption))))); };
-var useStyles$8 = makeStyles(function (theme) { return { container: { display: 'flex', alignItems: 'center', justifyContent: 'space-between' }, icon: { '& .MuiSvgIcon-root': { marginTop: theme.spacing(0.5) }, display: 'flex', marginRight: theme.spacing(1), visibility: 'hidden' }, iconVisible: { visibility: 'visible' }, text: { display: 'flex', flexDirection: 'column', textWrap: 'wrap' }, menuItem: { display: 'flex', alignItems: 'flex-start', padding: theme.spacing(1), flex: 1 }, premiumButton: { marginRight: theme.spacing(1) } }; });
-var MenuItemCore = function MenuItemCore(_ref32) { var Icon = _ref32.Icon, disabled = _ref32.disabled, footer = _ref32.footer, forceSelected = _ref32.forceSelected, label = _ref32.label, onClick = _ref32.onClick, selected = _ref32.selected, subtext = _ref32.subtext, Typography = _ref32.TypographyComponent; var classes = useStyles$8(); return /*#__PURE__*/ wn.createElement("div", { className: classes.container }, /*#__PURE__*/ wn.createElement(MenuItem$2, { button: !!onClick || undefined, className: classes.menuItem, "data-value": label, disableRipple: true, disabled: disabled, onClick: onClick }, Icon && /*#__PURE__*/ wn.createElement("div", { className: C(classes.icon, _defineProperty2({}, classes.iconVisible, selected || forceSelected)) }, Icon), /*#__PURE__*/ wn.createElement("div", { className: classes.text }, /*#__PURE__*/ wn.createElement(Typography, null, label), /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, subtext))), footer); };
+var useStyles$c = makeStyles(function (theme) { return { container: { display: 'flex', alignItems: 'center', justifyContent: 'space-between' }, icon: { '& .MuiSvgIcon-root': { marginTop: theme.spacing(0.5) }, display: 'flex', marginRight: theme.spacing(1), visibility: 'hidden' }, iconVisible: { visibility: 'visible' }, text: { display: 'flex', flexDirection: 'column', textWrap: 'wrap' }, menuItem: { display: 'flex', alignItems: 'flex-start', padding: theme.spacing(1), flex: 1 }, premiumButton: { marginRight: theme.spacing(1) } }; });
+var MenuItemCore = function MenuItemCore(_ref33) { var Icon = _ref33.Icon, disabled = _ref33.disabled, footer = _ref33.footer, forceSelected = _ref33.forceSelected, label = _ref33.label, onClick = _ref33.onClick, selected = _ref33.selected, subtext = _ref33.subtext, Typography = _ref33.TypographyComponent; var classes = useStyles$c(); return /*#__PURE__*/ wn.createElement("div", { className: classes.container }, /*#__PURE__*/ wn.createElement(MenuItem$2, { button: !!onClick || undefined, className: classes.menuItem, "data-value": label, disableRipple: true, disabled: disabled, onClick: onClick }, Icon && /*#__PURE__*/ wn.createElement("div", { className: C(classes.icon, _defineProperty2({}, classes.iconVisible, selected || forceSelected)) }, Icon), /*#__PURE__*/ wn.createElement("div", { className: classes.text }, /*#__PURE__*/ wn.createElement(Typography, null, label), /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, subtext))), footer); };
 var MenuItem = function MenuItem(props) { return /*#__PURE__*/ wn.createElement(MenuItemCore, Object.assign({}, props, { TypographyComponent: Typography })); };
-var useStyles$7 = makeSelectStyles(function (theme) { return { checkIcon: { color: theme.styleConfig.colors.primary }, menuPaper: { backgroundColor: theme.styleConfig.container.backgroundColor, color: theme.styleConfig.colors.primary }, select: { color: theme.styleConfig.colors.primary, '& .MuiSelect-icon': { color: theme.styleConfig.colors.primary }, borderColor: theme.styleConfig.inputs.borderColor } }; });
-var Select = function Select(props) { var classes = useStyles$7(); return /*#__PURE__*/ wn.createElement(SelectCore, Object.assign({}, props, { LabelComponent: Label, MenuItemComponent: MenuItem, TypographyComponent: Typography, classes: classes })); };
-var useStyles$6 = makeStyles(function (theme) { return { settingsContainer: { border: '1px solid', borderColor: theme.styleConfig.colors.subtle, borderRadius: theme.styleConfig.borderRadius, backgroundColor: theme.styleConfig.container.backgroundColor }, titleContainer: _defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2({}, theme.breakpoints.down('xs'), { flexDirection: 'column', alignItems: 'flex-start', gap: theme.spacing(1) }), "padding", theme.spacing(1.5, 2)), "borderBottom", '1px solid'), "borderBottomColor", theme.styleConfig.colors.subtle), "display", 'flex'), "justifyContent", 'space-between'), "alignItems", 'center'), content: { padding: theme.spacing(2) }, actions: { display: 'flex', gap: theme.spacing(1), alignItems: 'center' } }; });
+var useStyles$b = makeSelectStyles(function (theme) { return { checkIcon: { color: theme.styleConfig.colors.primary }, menuPaper: { backgroundColor: theme.styleConfig.container.backgroundColor, color: theme.styleConfig.colors.primary }, select: { color: theme.styleConfig.colors.primary, '& .MuiSelect-icon': { color: theme.styleConfig.colors.primary }, borderColor: theme.styleConfig.inputs.borderColor }, selectContainer: { width: function width(props) { return props === null || props === void 0 ? void 0 : props.width; } } }; });
+var Select = function Select(props) { var classes = useStyles$b(props); return /*#__PURE__*/ wn.createElement(SelectCore, Object.assign({}, props, { LabelComponent: Label, MenuItemComponent: MenuItem, TypographyComponent: Typography, classes: classes })); };
+var useStyles$a = makeStyles(function (theme) { return { settingsContainer: { border: '1px solid', borderColor: theme.styleConfig.colors.subtle, borderRadius: theme.styleConfig.borderRadius, backgroundColor: theme.styleConfig.container.backgroundColor }, titleContainer: _defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2(_defineProperty2({}, theme.breakpoints.down('xs'), { flexDirection: 'column', alignItems: 'flex-start', gap: theme.spacing(1) }), "padding", theme.spacing(1.5, 2)), "borderBottom", '1px solid'), "borderBottomColor", theme.styleConfig.colors.subtle), "display", 'flex'), "justifyContent", 'space-between'), "alignItems", 'center'), content: { padding: theme.spacing(2) }, actions: { display: 'flex', gap: theme.spacing(1), alignItems: 'center' } }; });
 var DEFAULT_STATE = { editing: false, setEditing: noop };
 var SettingsContext = /*#__PURE__*/ F$4(DEFAULT_STATE);
 var useSettingsContainer = function useSettingsContainer() { return q$5(SettingsContext); };
-var SettingsContainer = function SettingsContainer(_ref33) { var _ref33$canEdit = _ref33.canEdit, canEdit = _ref33$canEdit === void 0 ? true : _ref33$canEdit, disableSave = _ref33.disableSave, children = _ref33.children, hasCTA = _ref33.hasCTA, onCancel = _ref33.onCancel, onSave = _ref33.onSave, title = _ref33.title, customCTA = _ref33.customCTA, creating = _ref33.creating, externalEditing = _ref33.editing, externalSetEditing = _ref33.setEditing, modalDescription = _ref33.modalDescription, useBlockNavigation = _ref33.useBlockNavigation; var classes = useStyles$6(); var _h21 = h$4(creating !== null && creating !== void 0 ? creating : false), _h22 = _slicedToArray2(_h21, 2), internalEditing = _h22[0], internalSetEditing = _h22[1]; var _h23 = h$4(false), _h24 = _slicedToArray2(_h23, 2), isSaving = _h24[0], setIsSaving = _h24[1]; var _useToast3 = useToast(), openToast = _useToast3.openToast, closeToast = _useToast3.closeToast; var shouldUseExternalEditing = externalEditing !== undefined && !!externalSetEditing; var editing = shouldUseExternalEditing ? externalEditing : internalEditing; var setEditing = shouldUseExternalEditing ? externalSetEditing : internalSetEditing; var _useBlockNavigation = useBlockNavigation(editing && !isSaving), allowNavigation = _useBlockNavigation.allowNavigation, blocked = _useBlockNavigation.blocked, cancelNavigation = _useBlockNavigation.cancelNavigation; var edit = function edit() { setEditing(true); }; var cancel = function cancel() { onCancel === null || onCancel === void 0 ? void 0 : onCancel(); closeToast(); setEditing(false); }; var save = function save() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee6() { var message; return _regeneratorRuntime().wrap(function _callee6$(_context6) { while (1)
+var SettingsContainer = function SettingsContainer(_ref34) { var _ref34$canEdit = _ref34.canEdit, canEdit = _ref34$canEdit === void 0 ? true : _ref34$canEdit, disableSave = _ref34.disableSave, children = _ref34.children, hasCTA = _ref34.hasCTA, onCancel = _ref34.onCancel, onSave = _ref34.onSave, title = _ref34.title, customCTA = _ref34.customCTA, creating = _ref34.creating, externalEditing = _ref34.editing, externalSetEditing = _ref34.setEditing, modalDescription = _ref34.modalDescription, useBlockNavigation = _ref34.useBlockNavigation; var classes = useStyles$a(); var _h21 = h$4(creating !== null && creating !== void 0 ? creating : false), _h22 = _slicedToArray2(_h21, 2), internalEditing = _h22[0], internalSetEditing = _h22[1]; var _h23 = h$4(false), _h24 = _slicedToArray2(_h23, 2), isSaving = _h24[0], setIsSaving = _h24[1]; var _useToast3 = useToast(), openToast = _useToast3.openToast, closeToast = _useToast3.closeToast; var shouldUseExternalEditing = externalEditing !== undefined && !!externalSetEditing; var editing = shouldUseExternalEditing ? externalEditing : internalEditing; var setEditing = shouldUseExternalEditing ? externalSetEditing : internalSetEditing; var _useBlockNavigation = useBlockNavigation(editing && !isSaving), allowNavigation = _useBlockNavigation.allowNavigation, blocked = _useBlockNavigation.blocked, cancelNavigation = _useBlockNavigation.cancelNavigation; var edit = function edit() { setEditing(true); }; var cancel = function cancel() { onCancel === null || onCancel === void 0 ? void 0 : onCancel(); closeToast(); setEditing(false); }; var save = function save() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee6() { var message; return _regeneratorRuntime().wrap(function _callee6$(_context6) { while (1)
     switch (_context6.prev = _context6.next) {
         case 0:
             setIsSaving(true);
@@ -8872,20 +9026,20 @@ var SettingsContainer = function SettingsContainer(_ref33) { var _ref33$canEdit
     } }, _callee6, null, [[1, 7, 11, 14]]); })); }; var modalState = useModalState(save); if (!modalDescription) {
     modalDescription = 'Double check before saving your changes.';
 } return /*#__PURE__*/ wn.createElement(SettingsContext.Provider, { value: { editing: editing, setEditing: setEditing } }, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, modalState, { confirmButtonText: "Save changes", description: modalDescription, title: "Save changes?", warning: true })), /*#__PURE__*/ wn.createElement(Modal, { isOpen: blocked, close: cancelNavigation, confirm: function confirm() { allowNavigation(); return Promise.resolve(); }, confirmButtonText: "Navigate without saving", cancelButtonText: "Keep editing", description: 'Your changes are unsaved – are you sure you want to navigate away?', title: "Save changes?", warning: true }), /*#__PURE__*/ wn.createElement("div", { className: classes.settingsContainer }, /*#__PURE__*/ wn.createElement("div", { className: classes.titleContainer }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h3" }, title), /*#__PURE__*/ wn.createElement("div", { className: classes.actions }, hasCTA && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, editing ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Button, { compact: true, onClick: cancel, variant: "ghost" }, "Cancel"), /*#__PURE__*/ wn.createElement(Button, { compact: true, disabled: disableSave, onClick: modalState.open }, "Save"))) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, customCTA ? customCTA : canEdit && ( /*#__PURE__*/wn.createElement(Button, { compact: true, onClick: edit, variant: "ghost" }, "Edit")))))))), /*#__PURE__*/ wn.createElement("div", { className: classes.content }, children))); };
-var SettingsList = function SettingsList(_ref34) { var children = _ref34.children; return /*#__PURE__*/ wn.createElement("dl", { style: { margin: 0 } }, children); };
-var SettingsListItem = function SettingsListItem(_ref35) { var children = _ref35.children, title = _ref35.title; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Typography, { component: "dt" }, title), /*#__PURE__*/ wn.createElement("dd", { style: { margin: '0 0 8px' } }, children)); };
+var SettingsList = function SettingsList(_ref35) { var children = _ref35.children; return /*#__PURE__*/ wn.createElement("dl", { style: { margin: 0 } }, children); };
+var SettingsListItem = function SettingsListItem(_ref36) { var children = _ref36.children, title = _ref36.title; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Typography, { component: "dt" }, title), /*#__PURE__*/ wn.createElement("dd", { style: { margin: '0 0 8px' } }, children)); };
 var makeInfoIconStyles = makeStylesFactory(function () { return { infoIconContainer: { width: 'fit-content' } }; });
-var InfoIconCore = function InfoIconCore(_ref36) { var tooltipText = _ref36.tooltipText, classes = _ref36.classes, Tooltip = _ref36.TooltipComponent; return /*#__PURE__*/ wn.createElement("div", { className: classes.infoIconContainer }, /*#__PURE__*/ wn.createElement(Tooltip, { text: tooltipText }, /*#__PURE__*/ wn.createElement(InfoOutlined, null))); };
+var InfoIconCore = function InfoIconCore(_ref37) { var tooltipText = _ref37.tooltipText, classes = _ref37.classes, Tooltip = _ref37.TooltipComponent; return /*#__PURE__*/ wn.createElement("div", { className: classes.infoIconContainer }, /*#__PURE__*/ wn.createElement(Tooltip, { text: tooltipText }, /*#__PURE__*/ wn.createElement(InfoOutlined, null))); };
 var makeTooltipStyles = makeStylesFactory(function (theme) { return { targetWrapper: { display: 'flex', width: 'fit-content' }, tooltip: { '& .MuiTooltip-tooltip': { maxWidth: 240, padding: theme.spacing(1), borderRadius: 4 }, '& .MuiTooltip-tooltipPlacementRight': { margin: theme.spacing(0, 1) }, '& .MuiTooltip-tooltipPlacementLeft': { margin: theme.spacing(0, 1) }, zIndex: 2000 } }; });
-var TooltipCore = function TooltipCore(_ref37) { var text = _ref37.text, children = _ref37.children, disabled = _ref37.disabled, _ref37$placement = _ref37.placement, placement = _ref37$placement === void 0 ? 'right' : _ref37$placement, classes = _ref37.classes, Typography = _ref37.TypographyComponent; if (disabled) {
+var TooltipCore = function TooltipCore(_ref38) { var text = _ref38.text, children = _ref38.children, disabled = _ref38.disabled, _ref38$placement = _ref38.placement, placement = _ref38$placement === void 0 ? 'right' : _ref38$placement, classes = _ref38.classes, Typography = _ref38.TypographyComponent; if (disabled) {
     return children;
-} return /*#__PURE__*/ wn.createElement(MUITooltip, { PopperProps: { className: classes.tooltip }, interactive: true, placement: placement, title: /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, text) }, /*#__PURE__*/ wn.createElement("span", { className: classes.targetWrapper }, children)); };
-var useStyles$5 = makeTooltipStyles(function (theme) { return { tooltip: { '& .MuiTooltip-tooltip': { '& p': { color: theme.styleConfig.buttons.primary.textColor }, backgroundColor: theme.styleConfig.buttons.primary.backgroundColor } } }; });
-var Tooltip = function Tooltip(props) { var classes = useStyles$5(); return /*#__PURE__*/ wn.createElement(TooltipCore, Object.assign({}, props, { TypographyComponent: Typography, classes: classes })); };
-var useStyles$4 = makeInfoIconStyles(function (theme) { return { infoIconContainer: { color: theme.styleConfig.colors.primary } }; });
-var InfoIcon = function InfoIcon(props) { var classes = useStyles$4(); return /*#__PURE__*/ wn.createElement(InfoIconCore, Object.assign({}, props, { classes: classes, TooltipComponent: Tooltip })); };
-var SettingsSection = function SettingsSection(_ref38) { var children = _ref38.children, title = _ref38.title, tooltipText = _ref38.tooltipText; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 0.5 }, /*#__PURE__*/ wn.createElement(FlexBox, { alignItems: "center", flexDirection: "row", gap: 1 }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h4" }, title), tooltipText && /*#__PURE__*/ wn.createElement(InfoIcon, { tooltipText: tooltipText })), children); };
-var useFormState = function useFormState(_ref39) { var remoteState = _ref39.remoteState; var _h25 = h$4(remoteState), _h26 = _slicedToArray2(_h25, 2), localState = _h26[0], setLocalState = _h26[1]; var resetLocalState = T$2(function () { setLocalState(remoteState); }, [remoteState]); var _h27 = h$4(false), _h28 = _slicedToArray2(_h27, 2), editing = _h28[0], setEditing = _h28[1]; var handleSetEditing = T$2(function (newEditing) { if (newEditing) {
+} return /*#__PURE__*/ wn.createElement(Tooltip$2, { PopperProps: { className: classes.tooltip }, interactive: true, placement: placement, title: /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, text) }, /*#__PURE__*/ wn.createElement("span", { className: classes.targetWrapper }, children)); };
+var useStyles$9 = makeTooltipStyles(function (theme) { return { tooltip: { '& .MuiTooltip-tooltip': { '& p': { color: theme.styleConfig.buttons.primary.textColor }, backgroundColor: theme.styleConfig.buttons.primary.backgroundColor } } }; });
+var Tooltip = function Tooltip(props) { var classes = useStyles$9(); return /*#__PURE__*/ wn.createElement(TooltipCore, Object.assign({}, props, { TypographyComponent: Typography, classes: classes })); };
+var useStyles$8 = makeInfoIconStyles(function (theme) { return { infoIconContainer: { color: theme.styleConfig.colors.primary } }; });
+var InfoIcon = function InfoIcon(props) { var classes = useStyles$8(); return /*#__PURE__*/ wn.createElement(InfoIconCore, Object.assign({}, props, { classes: classes, TooltipComponent: Tooltip })); };
+var SettingsSection = function SettingsSection(_ref39) { var children = _ref39.children, title = _ref39.title, tooltipText = _ref39.tooltipText; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 0.5 }, /*#__PURE__*/ wn.createElement(FlexBox, { alignItems: "center", flexDirection: "row", gap: 1 }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h4" }, title), tooltipText && /*#__PURE__*/ wn.createElement(InfoIcon, { tooltipText: tooltipText })), children); };
+var useFormState = function useFormState(_ref40) { var remoteState = _ref40.remoteState; var _h25 = h$4(remoteState), _h26 = _slicedToArray2(_h25, 2), localState = _h26[0], setLocalState = _h26[1]; var resetLocalState = T$2(function () { setLocalState(remoteState); }, [remoteState]); var _h27 = h$4(false), _h28 = _slicedToArray2(_h27, 2), editing = _h28[0], setEditing = _h28[1]; var handleSetEditing = T$2(function (newEditing) { if (newEditing) {
     resetLocalState();
 } setEditing(newEditing); }, [resetLocalState]); return { localState: localState, setLocalState: setLocalState, editing: editing, handleSetEditing: handleSetEditing }; };
 var useStateSliceSetter = function useStateSliceSetter(setState, key) { return T$2(function (value) { setState(function (state) { return Object.assign(Object.assign({}, state), _defineProperty2({}, key, value)); }); }, [key, setState]); };
@@ -8900,13 +9054,13 @@ else {
     return { idp: oidcIdpMap[_idpKey], type: type };
 } };
 var getIdpAndConnectionInfo = function getIdpAndConnectionInfo(connection) { return Object.assign(Object.assign({}, getIdpInfo(connection.identity_provider, connection.connectionType)), { connection: connection }); };
-var AppDetails = function AppDetails(_ref40) { var connectionProp = _ref40.connection; var _getIdpAndConnectionI = getIdpAndConnectionInfo(connectionProp), connection = _getIdpAndConnectionI.connection, idp = _getIdpAndConnectionI.idp, type = _getIdpAndConnectionI.type; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, type === 'saml' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.acsUrlLabel }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.acs_url)), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.audienceUriLabel }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.audience_uri)))), type === 'oidc' && ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.redirectUrlLabel }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.redirect_url))), type === 'saml' && ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.nameIdFormatLabel }, /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, idp.nameIdFormatValue)))); };
+var AppDetails = function AppDetails(_ref41) { var connectionProp = _ref41.connection; var _getIdpAndConnectionI = getIdpAndConnectionInfo(connectionProp), connection = _getIdpAndConnectionI.connection, idp = _getIdpAndConnectionI.idp, type = _getIdpAndConnectionI.type; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, type === 'saml' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.acsUrlLabel }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.acs_url)), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.audienceUriLabel }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.audience_uri)))), type === 'oidc' && ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.redirectUrlLabel }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.redirect_url))), type === 'saml' && ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.nameIdFormatLabel }, /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, idp.nameIdFormatValue)))); };
 var collator = Intl.Collator();
 var nameKeys = new Set(['full_name', 'first_name', 'last_name']);
 var requiredKeys = new Set([].concat(_toConsumableArray2(nameKeys), ['email']));
-var attributeMappingItemRenderer = [{ title: 'Key', getValue: function getValue(_ref41) { var key = _ref41.key; var isRequiredKey = requiredKeys.has(key); var label = key; return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, label, isRequiredKey && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, ' ', /*#__PURE__*/ wn.createElement(Typography, { component: "span", color: "error" }, "*")))); } }, { title: 'Value', getValue: function getValue(_ref42) { var value = _ref42.value; return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, value); } }];
-var attributeMappingKeyExtractor = function attributeMappingKeyExtractor(_ref43) { var key = _ref43.key; return key; };
-var AttributeMappingTable = function AttributeMappingTable(_ref44) { var editing = _ref44.editing, localState = _ref44.localState, remoteState = _ref44.remoteState, setLocalState = _ref44.setLocalState; var _ref45 = editing ? localState : remoteState, attributeMapping = _ref45.attributeMapping; var attributeMappingItems = F$3(function () { return Object.entries(attributeMapping).map(function (_ref46) { var _ref47 = _slicedToArray2(_ref46, 2), key = _ref47[0], value = _ref47[1]; return { key: key, value: value }; }).sort(function (a, b) { return collator.compare(a.key, b.key); }); }, [attributeMapping]); var _h29 = h$4([['', '']]), _h30 = _slicedToArray2(_h29, 2), pendingAttributeMapping = _h30[0], setPendingAttributeMapping = _h30[1]; var _h31 = h$4('key'), _h32 = _slicedToArray2(_h31, 2), editMode = _h32[0], setEditMode = _h32[1]; var _h33 = h$4(''), _h34 = _slicedToArray2(_h33, 2), editedAttributeMappingKey = _h34[0], setEditedAttributeMappingKey = _h34[1]; var _h35 = h$4(''), _h36 = _slicedToArray2(_h35, 2), editedAttributeMappingValue = _h36[0], setEditedAttributeMappingValue = _h36[1]; var _h37 = h$4(''), _h38 = _slicedToArray2(_h37, 2), editedAttributeMappingLastNameValue = _h38[0], setEditedAttributeMappingLastNameValue = _h38[1]; var editAttributeMappingModalProps = useModalState(function () { var editedMapping = editMode === 'name' && editedAttributeMappingKey === 'first_name' ? { first_name: editedAttributeMappingValue, last_name: editedAttributeMappingLastNameValue } : _defineProperty2({}, editedAttributeMappingKey, editedAttributeMappingValue); setLocalState(function (state) { var mergedMapping = Object.assign(Object.assign({}, state.attributeMapping), editedMapping); if (editMode === 'name') {
+var attributeMappingItemRenderer = [{ title: 'Key', getValue: function getValue(_ref42) { var key = _ref42.key; var isRequiredKey = requiredKeys.has(key); var label = key; return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, label, isRequiredKey && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, ' ', /*#__PURE__*/ wn.createElement(Typography, { component: "span", color: "error" }, "*")))); } }, { title: 'Value', getValue: function getValue(_ref43) { var value = _ref43.value; return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, value); } }];
+var attributeMappingKeyExtractor = function attributeMappingKeyExtractor(_ref44) { var key = _ref44.key; return key; };
+var AttributeMappingTable = function AttributeMappingTable(_ref45) { var editing = _ref45.editing, localState = _ref45.localState, remoteState = _ref45.remoteState, setLocalState = _ref45.setLocalState; var _ref46 = editing ? localState : remoteState, attributeMapping = _ref46.attributeMapping; var attributeMappingItems = F$3(function () { return Object.entries(attributeMapping).map(function (_ref47) { var _ref48 = _slicedToArray2(_ref47, 2), key = _ref48[0], value = _ref48[1]; return { key: key, value: value }; }).sort(function (a, b) { return collator.compare(a.key, b.key); }); }, [attributeMapping]); var _h29 = h$4([['', '']]), _h30 = _slicedToArray2(_h29, 2), pendingAttributeMapping = _h30[0], setPendingAttributeMapping = _h30[1]; var _h31 = h$4('key'), _h32 = _slicedToArray2(_h31, 2), editMode = _h32[0], setEditMode = _h32[1]; var _h33 = h$4(''), _h34 = _slicedToArray2(_h33, 2), editedAttributeMappingKey = _h34[0], setEditedAttributeMappingKey = _h34[1]; var _h35 = h$4(''), _h36 = _slicedToArray2(_h35, 2), editedAttributeMappingValue = _h36[0], setEditedAttributeMappingValue = _h36[1]; var _h37 = h$4(''), _h38 = _slicedToArray2(_h37, 2), editedAttributeMappingLastNameValue = _h38[0], setEditedAttributeMappingLastNameValue = _h38[1]; var editAttributeMappingModalProps = useModalState(function () { var editedMapping = editMode === 'name' && editedAttributeMappingKey === 'first_name' ? { first_name: editedAttributeMappingValue, last_name: editedAttributeMappingLastNameValue } : _defineProperty2({}, editedAttributeMappingKey, editedAttributeMappingValue); setLocalState(function (state) { var mergedMapping = Object.assign(Object.assign({}, state.attributeMapping), editedMapping); if (editMode === 'name') {
     if (editedAttributeMappingKey === 'full_name') {
         delete mergedMapping.first_name;
         delete mergedMapping.last_name;
@@ -8933,11 +9087,11 @@ else {
 else {
     setPendingDeleteAttributeMappingKey(key);
     deleteAttributeMappingModalProps.open();
-} }, [deleteAttributeMapping, deleteAttributeMappingModalProps]); return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, editAttributeMappingModalProps, { title: "Edit custom mapping", confirmButtonText: "Save" }), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, editMode === 'name' ? ( /*#__PURE__*/wn.createElement(Select, { selectItems: [{ label: 'Full Name', value: 'full_name' }, { label: 'First Name, Last Name', value: 'first_last_name' }], fullWidth: true, caption: "You can change the format of the key.", value: editedAttributeMappingKey === 'full_name' ? 'full_name' : 'first_last_name', onChange: function onChange(value) { setEditedAttributeMappingKey(value === 'full_name' ? 'full_name' : 'first_name'); } })) : ( /*#__PURE__*/wn.createElement(Input, { label: "Key", fullWidth: true, value: editedAttributeMappingKey, onChange: setEditedAttributeMappingKey })), editMode === 'name' && (editedAttributeMappingKey === 'first_name' || editedAttributeMappingKey === 'last_name') ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(FlexBox, { gap: 2 }, /*#__PURE__*/ wn.createElement(Input, { label: "First Name", fullWidth: true, value: editedAttributeMappingValue, onChange: setEditedAttributeMappingValue }), /*#__PURE__*/ wn.createElement(Input, { label: "Last Name", fullWidth: true, value: editedAttributeMappingLastNameValue, onChange: setEditedAttributeMappingLastNameValue })))) : ( /*#__PURE__*/wn.createElement(Input, { label: "Value", fullWidth: true, value: editedAttributeMappingValue, onChange: setEditedAttributeMappingValue })))), /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, deleteAttributeMappingModalProps, { title: "Delete mapping?", confirmButtonText: "Delete", warning: true }), /*#__PURE__*/ wn.createElement(Typography, null, "Deleting the Groups attribute mapping will also disable any Group Role assignments you have added above. They will not be deleted, but you must add a Groups mapping to make edits.")), /*#__PURE__*/ wn.createElement(ListEditor, { items: attributeMappingItems, itemRenderer: attributeMappingItemRenderer, rowKeyExtractor: attributeMappingKeyExtractor, addModalProps: { confirm: function confirm() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { attributeMapping: Object.assign(Object.assign({}, state.attributeMapping), Object.fromEntries(pendingAttributeMapping.filter(function (_ref49) { var _ref50 = _slicedToArray2(_ref49, 2), key = _ref50[0], value = _ref50[1]; return key && value && !state.attributeMapping[key]; }))) }); }); return Promise.resolve(); }, title: 'Add custom mapping', content: ( /*#__PURE__*/wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, pendingAttributeMapping.map(function (_ref51, i) { var _ref52 = _slicedToArray2(_ref51, 2), key = _ref52[0], value = _ref52[1]; return /*#__PURE__*/ wn.createElement(FlexBox, { gap: 1, key: i }, /*#__PURE__*/ wn.createElement(Input, { label: "Key", fullWidth: true, value: key, onChange: function onChange(value) { setPendingAttributeMapping(function (state) { return state.map(function (item, index) { return index === i ? [value, item[1]] : item; }); }); } }), /*#__PURE__*/ wn.createElement(Input, { label: "Value", fullWidth: true, value: value, onChange: function onChange(value) { setPendingAttributeMapping(function (state) { return state.map(function (item, index) { return index === i ? [item[0], value] : item; }); }); } })); }), /*#__PURE__*/ wn.createElement(Button, { variant: "text", startIcon: /*#__PURE__*/ wn.createElement(Add, null), fullWidth: true, onClick: function onClick() { setPendingAttributeMapping(function (state) { return [].concat(_toConsumableArray2(state), [['', '']]); }); } }, "Add custom mapping"))) }, hideAddButton: !editing, getItemActionProps: editing ? function (item) { return { action: item.key === 'email' && item.value === 'NameID' ? undefined : { text: 'Edit', onClick: function onClick() { handleEditAttributeMapping(item.key); } }, warningAction: item.key === 'email' || nameKeys.has(item.key) && !(hasFirstAndLastNameKeys && hasFullNameKey) ? undefined : { text: 'Delete', onClick: function onClick() { handleRequestDeleteAttributeMapping(item.key); } } }; } : undefined })); };
+} }, [deleteAttributeMapping, deleteAttributeMappingModalProps]); return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, editAttributeMappingModalProps, { title: "Edit custom mapping", confirmButtonText: "Save" }), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, editMode === 'name' ? ( /*#__PURE__*/wn.createElement(Select, { selectItems: [{ label: 'Full Name', value: 'full_name' }, { label: 'First Name, Last Name', value: 'first_last_name' }], fullWidth: true, caption: "You can change the format of the key.", value: editedAttributeMappingKey === 'full_name' ? 'full_name' : 'first_last_name', onChange: function onChange(value) { setEditedAttributeMappingKey(value === 'full_name' ? 'full_name' : 'first_name'); } })) : ( /*#__PURE__*/wn.createElement(Input$1, { label: "Key", fullWidth: true, value: editedAttributeMappingKey, onChange: setEditedAttributeMappingKey })), editMode === 'name' && (editedAttributeMappingKey === 'first_name' || editedAttributeMappingKey === 'last_name') ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(FlexBox, { gap: 2 }, /*#__PURE__*/ wn.createElement(Input$1, { label: "First Name", fullWidth: true, value: editedAttributeMappingValue, onChange: setEditedAttributeMappingValue }), /*#__PURE__*/ wn.createElement(Input$1, { label: "Last Name", fullWidth: true, value: editedAttributeMappingLastNameValue, onChange: setEditedAttributeMappingLastNameValue })))) : ( /*#__PURE__*/wn.createElement(Input$1, { label: "Value", fullWidth: true, value: editedAttributeMappingValue, onChange: setEditedAttributeMappingValue })))), /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, deleteAttributeMappingModalProps, { title: "Delete mapping?", confirmButtonText: "Delete", warning: true }), /*#__PURE__*/ wn.createElement(Typography, null, "Deleting the Groups attribute mapping will also disable any Group Role assignments you have added above. They will not be deleted, but you must add a Groups mapping to make edits.")), /*#__PURE__*/ wn.createElement(ListEditor, { items: attributeMappingItems, itemRenderer: attributeMappingItemRenderer, rowKeyExtractor: attributeMappingKeyExtractor, addModalProps: { confirm: function confirm() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { attributeMapping: Object.assign(Object.assign({}, state.attributeMapping), Object.fromEntries(pendingAttributeMapping.filter(function (_ref50) { var _ref51 = _slicedToArray2(_ref50, 2), key = _ref51[0], value = _ref51[1]; return key && value && !state.attributeMapping[key]; }))) }); }); return Promise.resolve(); }, title: 'Add custom mapping', content: ( /*#__PURE__*/wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, pendingAttributeMapping.map(function (_ref52, i) { var _ref53 = _slicedToArray2(_ref52, 2), key = _ref53[0], value = _ref53[1]; return /*#__PURE__*/ wn.createElement(FlexBox, { gap: 1, key: i }, /*#__PURE__*/ wn.createElement(Input$1, { label: "Key", fullWidth: true, value: key, onChange: function onChange(value) { setPendingAttributeMapping(function (state) { return state.map(function (item, index) { return index === i ? [value, item[1]] : item; }); }); } }), /*#__PURE__*/ wn.createElement(Input$1, { label: "Value", fullWidth: true, value: value, onChange: function onChange(value) { setPendingAttributeMapping(function (state) { return state.map(function (item, index) { return index === i ? [item[0], value] : item; }); }); } })); }), /*#__PURE__*/ wn.createElement(Button, { variant: "text", startIcon: /*#__PURE__*/ wn.createElement(Add, null), fullWidth: true, onClick: function onClick() { setPendingAttributeMapping(function (state) { return [].concat(_toConsumableArray2(state), [['', '']]); }); } }, "Add custom mapping"))) }, hideAddButton: !editing, getItemActionProps: editing ? function (item) { return { action: item.key === 'email' && item.value === 'NameID' ? undefined : { text: 'Edit', onClick: function onClick() { handleEditAttributeMapping(item.key); } }, warningAction: item.key === 'email' || nameKeys.has(item.key) && !(hasFirstAndLastNameKeys && hasFullNameKey) ? undefined : { text: 'Delete', onClick: function onClick() { handleRequestDeleteAttributeMapping(item.key); } } }; } : undefined })); };
 var makeSamlOption = function makeSamlOption(idpName) { return { idp: samlIdpMap[idpName], idpName: idpName, type: 'saml' }; };
 var makeOidcOption = function makeOidcOption(idpName) { return { idp: oidcIdpMap[idpName], idpName: idpName, type: 'oidc' }; };
 var idpOptions = { 'saml:google-workspace': makeSamlOption('google-workspace'), 'saml:okta': makeSamlOption('okta'), 'oidc:okta': makeOidcOption('okta'), 'saml:microsoft-entra': makeSamlOption('microsoft-entra'), 'oidc:microsoft-entra': makeOidcOption('microsoft-entra'), 'saml:generic': makeSamlOption('generic'), 'oidc:generic': makeOidcOption('generic') };
-var idpSelectItems = Object.entries(idpOptions).map(function (_ref53) { var _ref54 = _slicedToArray2(_ref53, 2), idpKey = _ref54[0], idp = _ref54[1].idp; return { label: idp.displayName, value: idpKey }; });
+var idpSelectItems = Object.entries(idpOptions).map(function (_ref54) { var _ref55 = _slicedToArray2(_ref54, 2), idpKey = _ref55[0], idp = _ref55[1].idp; return { label: idp.displayName, value: idpKey }; });
 var samlIdpSelectItems = Object.values(idpOptions).filter(function (item) { return item.type === 'saml'; }).map(function (item) { return { label: item.idp.displayName, value: item.idpName }; });
 var oidcIdpSelectItems = Object.values(idpOptions).filter(function (item) { return item.type === 'oidc'; }).map(function (item) { return { label: item.idp.displayName, value: item.idpName }; });
 var useBeforeUnloadNavigationBlock = function useBeforeUnloadNavigationBlock(shouldWarn) { p$3(function () { if (shouldWarn) {
@@ -8972,18 +9126,18 @@ var routerReducer = function routerReducer(state, action) { switch (action.type)
     case 'cancelNavigation': return Object.assign(Object.assign({}, state), { pendingRoute: undefined });
     default: return state;
 } };
-var createRouter = function createRouter() { var initialState = { blockersActive: new Set() }; var StateContext = /*#__PURE__*/ wn.createContext({}); var ControllerContext = /*#__PURE__*/ wn.createContext({ navigate: noop, useBlockNavigation: function useBlockNavigation() { return { blocked: false, allowNavigation: noop, cancelNavigation: noop }; } }); var useRouterState = function useRouterState() { return wn.useContext(StateContext); }; var useRouterController = function useRouterController() { return wn.useContext(ControllerContext); }; var Router = function Router(_ref55) { var routeMap = _ref55.routeMap; var _useRouterState = useRouterState(), currentRoute = _useRouterState.currentRoute; var ChildComponent = routeMap[currentRoute.screen]; var childComponentProps = currentRoute.params; return ChildComponent ? /*#__PURE__*/ wn.createElement(ChildComponent, Object.assign({}, childComponentProps)) : null; }; var RouterProvider = function RouterProvider(_ref56) { var children = _ref56.children, initialRoute = _ref56.initialRoute; var _wn$useReducer = wn.useReducer(routerReducer, Object.assign(Object.assign({}, initialState), { currentRoute: initialRoute })), _wn$useReducer2 = _slicedToArray2(_wn$useReducer, 2), state = _wn$useReducer2[0], dispatch = _wn$useReducer2[1]; var navigate = T$2(function (destination) { dispatch({ type: 'navigate', payload: destination }); }, []); var routerState = F$3(function () { return { currentRoute: state.currentRoute }; }, [state.currentRoute]); var isNavigationBlocked = !!state.pendingRoute; var useBlockNavigation = T$2(function (enableBlock) { var callback = F$3(function () { return typeof enableBlock === 'function' ? enableBlock : function () { return enableBlock; }; }, [enableBlock]); p$3(function () { var shouldEnableBlock = callback(); if (shouldEnableBlock) {
+var createRouter = function createRouter() { var initialState = { blockersActive: new Set() }; var StateContext = /*#__PURE__*/ wn.createContext({}); var ControllerContext = /*#__PURE__*/ wn.createContext({ navigate: noop, useBlockNavigation: function useBlockNavigation() { return { blocked: false, allowNavigation: noop, cancelNavigation: noop }; } }); var useRouterState = function useRouterState() { return wn.useContext(StateContext); }; var useRouterController = function useRouterController() { return wn.useContext(ControllerContext); }; var Router = function Router(_ref56) { var routeMap = _ref56.routeMap; var _useRouterState = useRouterState(), currentRoute = _useRouterState.currentRoute; var ChildComponent = routeMap[currentRoute.screen]; var childComponentProps = currentRoute.params; return ChildComponent ? /*#__PURE__*/ wn.createElement(ChildComponent, Object.assign({}, childComponentProps)) : null; }; var RouterProvider = function RouterProvider(_ref57) { var children = _ref57.children, initialRoute = _ref57.initialRoute; var _wn$useReducer = wn.useReducer(routerReducer, Object.assign(Object.assign({}, initialState), { currentRoute: initialRoute })), _wn$useReducer2 = _slicedToArray2(_wn$useReducer, 2), state = _wn$useReducer2[0], dispatch = _wn$useReducer2[1]; var navigate = T$2(function (destination) { dispatch({ type: 'navigate', payload: destination }); }, []); var routerState = F$3(function () { return { currentRoute: state.currentRoute }; }, [state.currentRoute]); var isNavigationBlocked = !!state.pendingRoute; var useBlockNavigation = T$2(function (enableBlock) { var callback = F$3(function () { return typeof enableBlock === 'function' ? enableBlock : function () { return enableBlock; }; }, [enableBlock]); p$3(function () { var shouldEnableBlock = callback(); if (shouldEnableBlock) {
     dispatch({ type: 'addBlocker', payload: { callback: callback } });
     return function () { dispatch({ type: 'removeBlocker', payload: { callback: callback } }); };
 } }, [callback, enableBlock]); return { blocked: isNavigationBlocked, allowNavigation: function allowNavigation() { dispatch({ type: 'approveNavigation' }); }, cancelNavigation: function cancelNavigation() { dispatch({ type: 'cancelNavigation' }); } }; }, [isNavigationBlocked]); useBeforeUnloadNavigationBlock(state.blockersActive.size > 0); var controller = F$3(function () { return { navigate: navigate, useBlockNavigation: useBlockNavigation }; }, [navigate, useBlockNavigation]); return /*#__PURE__*/ wn.createElement(ControllerContext.Provider, { value: controller }, /*#__PURE__*/ wn.createElement(StateContext.Provider, { value: routerState }, children)); }; return { RouterProvider: RouterProvider, Router: Router, useRouterController: useRouterController, useRouterState: useRouterState }; };
 var _createRouter = createRouter(), SsoRouterProvider = _createRouter.RouterProvider, SsoRouter = _createRouter.Router, useSsoRouterController = _createRouter.useRouterController;
 var certItemRenderer = [{ title: 'Issuer', getValue: function getValue(item) { return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, 'issuer' in item ? item.issuer : 'Pending'); } }, { title: 'Created', getValue: function getValue(item) { return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, 'created_at' in item ? new Date(item.created_at).toLocaleString() : 'Pending'); } }, { title: 'Expires', getValue: function getValue(item) { return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, 'expires_at' in item ? new Date(item.expires_at).toLocaleString() : 'Pending'); } }];
 var certKeyExtractor = function certKeyExtractor(item) { return 'certificate_id' in item ? item.certificate_id : 'new-certificate-id-pending'; };
-var CertificateTable = function CertificateTable(_ref48) { var editing = _ref48.editing, localState = _ref48.localState, manualConfiguration = _ref48.manualConfiguration, remoteState = _ref48.remoteState, setLocalState = _ref48.setLocalState; var _a, _b, _c; var certificates = F$3(function () { if (!remoteState) {
+var CertificateTable = function CertificateTable(_ref49) { var editing = _ref49.editing, localState = _ref49.localState, manualConfiguration = _ref49.manualConfiguration, remoteState = _ref49.remoteState, setLocalState = _ref49.setLocalState; var _a, _b, _c; var certificates = F$3(function () { if (!remoteState) {
     return undefined;
 } var remoteCertificates = remoteState; if (!editing) {
     return remoteCertificates;
-} return [].concat(_toConsumableArray2(remoteCertificates.filter(function (cert) { var _a; return !((_a = localState.deletedCertificateIds) === null || _a === void 0 ? void 0 : _a.includes(cert.certificate_id)); })), _toConsumableArray2(localState.certificate ? [{ certificate: localState.certificate, isPending: true }] : [])); }, [editing, localState, remoteState]); var viewCertModalProps = useModalState(); var _h41 = h$4(), _h42 = _slicedToArray2(_h41, 2), viewCertificateContents = _h42[0], setViewCertificateContents = _h42[1]; var persistPendingCertificate = useStateSliceSetter(setLocalState, 'certificate'); var addCertModalProps = useModalState(function () { persistPendingCertificate(pendingCert); }); var _h43 = h$4(''), _h44 = _slicedToArray2(_h43, 2), pendingCert = _h44[0], setPendingCert = _h44[1]; var remoteCertificateCount = (_a = remoteState === null || remoteState === void 0 ? void 0 : remoteState.length) !== null && _a !== void 0 ? _a : 0; var remoteCertificatePendingDeletionCount = (_c = (_b = localState.deletedCertificateIds) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0; var minimumRequiredCertificates = 1; var maximumAllowedCertificates = 5; var canDeleteCertificates = remoteCertificateCount - remoteCertificatePendingDeletionCount > minimumRequiredCertificates; var canAddCertificate = editing && manualConfiguration && !localState.certificate && remoteCertificateCount - remoteCertificatePendingDeletionCount < maximumAllowedCertificates; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, viewCertModalProps, { title: "View x509 Certificate", confirmButtonText: "Close", noCancelButton: true }), /*#__PURE__*/ wn.createElement(CopyableText, { whiteSpace: "pre-wrap" }, viewCertificateContents)), /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, addCertModalProps, { title: "Add Certificate" }), /*#__PURE__*/ wn.createElement(Input, { label: "x509 Certificate", multiline: true, onChange: function onChange(value) { setPendingCert(value); }, placeholder: "Enter certificate", value: pendingCert })), /*#__PURE__*/ wn.createElement(ListEditor, { items: certificates !== null && certificates !== void 0 ? certificates : [], itemRenderer: certItemRenderer, rowKeyExtractor: certKeyExtractor, onAdd: function onAdd() { setPendingCert(''); addCertModalProps.open(); }, getItemActionProps: function getItemActionProps(item) { return { action: { text: item.isPending ? 'Edit' : 'View', onClick: function onClick() { if (item.isPending) {
+} return [].concat(_toConsumableArray2(remoteCertificates.filter(function (cert) { var _a; return !((_a = localState.deletedCertificateIds) === null || _a === void 0 ? void 0 : _a.includes(cert.certificate_id)); })), _toConsumableArray2(localState.certificate ? [{ certificate: localState.certificate, isPending: true }] : [])); }, [editing, localState, remoteState]); var viewCertModalProps = useModalState(); var _h41 = h$4(), _h42 = _slicedToArray2(_h41, 2), viewCertificateContents = _h42[0], setViewCertificateContents = _h42[1]; var persistPendingCertificate = useStateSliceSetter(setLocalState, 'certificate'); var addCertModalProps = useModalState(function () { persistPendingCertificate(pendingCert); }); var _h43 = h$4(''), _h44 = _slicedToArray2(_h43, 2), pendingCert = _h44[0], setPendingCert = _h44[1]; var remoteCertificateCount = (_a = remoteState === null || remoteState === void 0 ? void 0 : remoteState.length) !== null && _a !== void 0 ? _a : 0; var remoteCertificatePendingDeletionCount = (_c = (_b = localState.deletedCertificateIds) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0; var minimumRequiredCertificates = 1; var maximumAllowedCertificates = 5; var canDeleteCertificates = remoteCertificateCount - remoteCertificatePendingDeletionCount > minimumRequiredCertificates; var canAddCertificate = editing && manualConfiguration && !localState.certificate && remoteCertificateCount - remoteCertificatePendingDeletionCount < maximumAllowedCertificates; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, viewCertModalProps, { title: "View x509 Certificate", confirmButtonText: "Close", noCancelButton: true }), /*#__PURE__*/ wn.createElement(CopyableText, { whiteSpace: "pre-wrap" }, viewCertificateContents)), /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, addCertModalProps, { title: "Add Certificate" }), /*#__PURE__*/ wn.createElement(Input$1, { label: "x509 Certificate", multiline: true, onChange: function onChange(value) { setPendingCert(value); }, placeholder: "Enter certificate", value: pendingCert })), /*#__PURE__*/ wn.createElement(ListEditor, { items: certificates !== null && certificates !== void 0 ? certificates : [], itemRenderer: certItemRenderer, rowKeyExtractor: certKeyExtractor, onAdd: function onAdd() { setPendingCert(''); addCertModalProps.open(); }, getItemActionProps: function getItemActionProps(item) { return { action: { text: item.isPending ? 'Edit' : 'View', onClick: function onClick() { if (item.isPending) {
                 setPendingCert(item.certificate);
                 addCertModalProps.open();
             }
@@ -8996,8 +9150,8 @@ var CertificateTable = function CertificateTable(_ref48) { var editing = _ref48.
             else if ('certificate_id' in item) {
                 setLocalState(function (state) { var _a; return Object.assign(Object.assign({}, state), { deletedCertificateIds: [].concat(_toConsumableArray2((_a = state.deletedCertificateIds) !== null && _a !== void 0 ? _a : []), [item.certificate_id]) }); });
             } } } : undefined }; }, hideAddButton: !canAddCertificate })); };
-var DetailsSectionBody = function DetailsSectionBody(_ref57) { var taggedConnection = _ref57.connection, localState = _ref57.localState, remoteState = _ref57.remoteState, setLocalState = _ref57.setLocalState; var _a, _b; var _useSettingsContainer = useSettingsContainer(), editing = _useSettingsContainer.editing; var _ref58 = editing ? localState : remoteState, displayName = _ref58.displayName, identityProvider = _ref58.identityProvider; var handleDisplayNameChange = useStateSliceSetter(setLocalState, 'displayName'); var handleIdentityProviderChange = useStateSliceSetter(setLocalState, 'identityProvider'); var handleMetadataUrlChange = useStateSliceSetter(setLocalState, 'metadataUrl'); var handleSsoUrlChange = useStateSliceSetter(setLocalState, 'ssoUrl'); var handleEntityIdChange = useStateSliceSetter(setLocalState, 'entityId'); var handleClientIdChange = useStateSliceSetter(setLocalState, 'clientId'); var handleClientSecretChange = useStateSliceSetter(setLocalState, 'clientSecret'); var handleIssuerChange = useStateSliceSetter(setLocalState, 'issuer'); var handleIssuerDerivedValueChange = useStateSliceSetter(setLocalState, 'issuerDerivedValue'); var handleAuthorizationUrlChange = useStateSliceSetter(setLocalState, 'authorizationUrl'); var handleTokenUrlChange = useStateSliceSetter(setLocalState, 'tokenUrl'); var handleUserInfoUrlChange = useStateSliceSetter(setLocalState, 'userInfoUrl'); var handleJwksUrlChange = useStateSliceSetter(setLocalState, 'jwksUrl'); var _getIdpAndConnectionI2 = getIdpAndConnectionInfo(taggedConnection), connection = _getIdpAndConnectionI2.connection, idp = _getIdpAndConnectionI2.idp, type = _getIdpAndConnectionI2.type; var idpRequiresManualConfig = type === 'saml' && idp.metadataUrlLabel === false; var manualConfiguration = localState.manualConfiguration || idpRequiresManualConfig; var setManualConfiguration = useStateSliceSetter(setLocalState, 'manualConfiguration'); return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Display Name" }, editing ? ( /*#__PURE__*/wn.createElement(Input, { value: displayName, onChange: handleDisplayNameChange })) : ( /*#__PURE__*/wn.createElement(Typography, null, displayName))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "IdP" }, editing ? ( /*#__PURE__*/wn.createElement(Select, { placeholder: "Select", selectItems: type === 'saml' ? samlIdpSelectItems : oidcIdpSelectItems, value: identityProvider, onChange: handleIdentityProviderChange })) : ( /*#__PURE__*/wn.createElement(Typography, null, idp.displayName))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "App Values", tooltipText: "Copy these App (Service Provider) Values into your IdP." }, /*#__PURE__*/ wn.createElement(SettingsList, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Connection ID" }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.connection_id)), /*#__PURE__*/ wn.createElement(AppDetails, { connection: connection }))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "IdP Values" }, /*#__PURE__*/ wn.createElement(SettingsList, null, type === 'saml' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, editing && !manualConfiguration ? ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.metadataUrlLabel }, /*#__PURE__*/ wn.createElement(Input, { placeholder: "Enter ".concat(idp.metadataUrlLabel), value: localState.metadataUrl || '', onChange: handleMetadataUrlChange }))) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.idpSsoUrlLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input, { placeholder: "Enter ".concat(idp.idpSsoUrlLabel), value: localState.ssoUrl || '', onChange: handleSsoUrlChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.idp_sso_url || '–'))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.idpEntityIdLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input, { placeholder: "Enter ".concat(idp.idpEntityIdLabel), value: localState.entityId || '', onChange: handleEntityIdChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.idp_entity_id || '–'))))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.x509CertificateLabel }, /*#__PURE__*/ wn.createElement(CertificateTable, { editing: editing, remoteState: connection.verification_certificates, localState: localState, setLocalState: setLocalState, manualConfiguration: manualConfiguration })), editing && !idpRequiresManualConfig && ( /*#__PURE__*/wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat(idp.metadataUrlLabel) : 'Configure manually')))), type === 'oidc' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.clientIdLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input, { placeholder: "Enter ".concat(idp.clientIdLabel), value: localState.clientId || '', onChange: handleClientIdChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.client_id || '–'))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.clientSecretLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input, { placeholder: "Enter ".concat(idp.clientSecretLabel), value: localState.clientSecret || '', onChange: handleClientSecretChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.client_secret || '–'))), idp.issuerDerivedLabel ? ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.issuerDerivedLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input, { placeholder: "Enter ".concat(idp.issuerDerivedLabel), value: localState.issuerDerivedValue || '', onChange: handleIssuerDerivedValueChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, ((_a = idp.extractIssuerFromInput) === null || _a === void 0 ? void 0 : _a.call(idp, connection.issuer)) || '–')))) : ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.issuerLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input, { placeholder: "URL", value: localState.issuer || '', onChange: handleIssuerChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.issuer || '–')))), editing && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, manualConfiguration && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Authorization URL" }, /*#__PURE__*/ wn.createElement(Input, { placeholder: "Enter Authorization URL", value: localState.authorizationUrl || '', onChange: handleAuthorizationUrlChange })), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Token URL" }, /*#__PURE__*/ wn.createElement(Input, { placeholder: "Enter Token URL", value: localState.tokenUrl || '', onChange: handleTokenUrlChange })), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "User info URL" }, /*#__PURE__*/ wn.createElement(Input, { placeholder: "Enter User info URL", value: localState.userInfoUrl || '', onChange: handleUserInfoUrlChange })), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "JWKS URL" }, /*#__PURE__*/ wn.createElement(Input, { placeholder: "Enter JWKS URL", value: localState.jwksUrl || '', onChange: handleJwksUrlChange })))), /*#__PURE__*/ wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat((_b = idp.issuerDerivedLabel) !== null && _b !== void 0 ? _b : idp.issuerLabel) : 'Configure manually'))))))), type === 'saml' && ( /*#__PURE__*/wn.createElement(SettingsSection, { title: idp.attributeMappingLabel }, /*#__PURE__*/ wn.createElement(AttributeMappingTable, { editing: editing, localState: localState, remoteState: remoteState, setLocalState: setLocalState })))); };
-var DetailsSection = function DetailsSection(_ref59) { var canUpdateConnection = _ref59.canUpdateConnection, connectionProp = _ref59.connection; var _getIdpAndConnectionI3 = getIdpAndConnectionInfo(connectionProp), idp = _getIdpAndConnectionI3.idp, connection = _getIdpAndConnectionI3.connection, type = _getIdpAndConnectionI3.type; var remoteState = F$3(function () { var _a; return { displayName: connection.display_name, identityProvider: connection.identity_provider, attributeMapping: 'attribute_mapping' in connection ? connection.attribute_mapping : {}, manualConfiguration: false, authorizationUrl: 'authorization_url' in connection ? connection.authorization_url : undefined, clientId: 'client_id' in connection ? connection.client_id : undefined, clientSecret: 'client_secret' in connection ? connection.client_secret : undefined, entityId: 'idp_entity_id' in connection ? connection.idp_entity_id : undefined, issuer: 'issuer' in connection ? connection.issuer : undefined, issuerDerivedValue: type === 'oidc' ? (_a = idp.extractIssuerFromInput) === null || _a === void 0 ? void 0 : _a.call(idp, connection.issuer) : undefined, jwksUrl: 'jwks_url' in connection ? connection.jwks_url : undefined, ssoUrl: 'idp_sso_url' in connection ? connection.idp_sso_url : undefined, tokenUrl: 'token_url' in connection ? connection.token_url : undefined, userInfoUrl: 'userinfo_url' in connection ? connection.userinfo_url : undefined }; }, [connection, idp, type]); var _useFormState = useFormState({ remoteState: remoteState }), localState = _useFormState.localState, setLocalState = _useFormState.setLocalState, editing = _useFormState.editing, handleSetEditing = _useFormState.handleSetEditing; var _useMutateSsoConnecti = useMutateSsoConnection(type), mutate = _useMutateSsoConnecti.mutate; var _useDeleteSsoConnecti2 = useDeleteSsoConnectionCert(), deleteCertificate = _useDeleteSsoConnecti2.mutate; var _useMutateSsoConnecti2 = useMutateSsoConnectionByUrl(), mutateByUrl = _useMutateSsoConnecti2.mutate; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee7() { var _a, baseOptions, mutatedProperties, idpRequiresManualConfig, isManualConfig, _iterator, _step, _loop, _ret, getIssuer, issuer; return _regeneratorRuntime().wrap(function _callee7$(_context8) { while (1)
+var DetailsSectionBody = function DetailsSectionBody(_ref58) { var taggedConnection = _ref58.connection, localState = _ref58.localState, remoteState = _ref58.remoteState, setLocalState = _ref58.setLocalState; var _a, _b; var _useSettingsContainer = useSettingsContainer(), editing = _useSettingsContainer.editing; var _ref59 = editing ? localState : remoteState, displayName = _ref59.displayName, identityProvider = _ref59.identityProvider; var handleDisplayNameChange = useStateSliceSetter(setLocalState, 'displayName'); var handleIdentityProviderChange = useStateSliceSetter(setLocalState, 'identityProvider'); var handleMetadataUrlChange = useStateSliceSetter(setLocalState, 'metadataUrl'); var handleSsoUrlChange = useStateSliceSetter(setLocalState, 'ssoUrl'); var handleEntityIdChange = useStateSliceSetter(setLocalState, 'entityId'); var handleClientIdChange = useStateSliceSetter(setLocalState, 'clientId'); var handleClientSecretChange = useStateSliceSetter(setLocalState, 'clientSecret'); var handleIssuerChange = useStateSliceSetter(setLocalState, 'issuer'); var handleIssuerDerivedValueChange = useStateSliceSetter(setLocalState, 'issuerDerivedValue'); var handleAuthorizationUrlChange = useStateSliceSetter(setLocalState, 'authorizationUrl'); var handleTokenUrlChange = useStateSliceSetter(setLocalState, 'tokenUrl'); var handleUserInfoUrlChange = useStateSliceSetter(setLocalState, 'userInfoUrl'); var handleJwksUrlChange = useStateSliceSetter(setLocalState, 'jwksUrl'); var _getIdpAndConnectionI2 = getIdpAndConnectionInfo(taggedConnection), connection = _getIdpAndConnectionI2.connection, idp = _getIdpAndConnectionI2.idp, type = _getIdpAndConnectionI2.type; var idpRequiresManualConfig = type === 'saml' && idp.metadataUrlLabel === false; var manualConfiguration = localState.manualConfiguration || idpRequiresManualConfig; var setManualConfiguration = useStateSliceSetter(setLocalState, 'manualConfiguration'); return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Display Name" }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { value: displayName, onChange: handleDisplayNameChange })) : ( /*#__PURE__*/wn.createElement(Typography, null, displayName))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "IdP" }, editing ? ( /*#__PURE__*/wn.createElement(Select, { placeholder: "Select", selectItems: type === 'saml' ? samlIdpSelectItems : oidcIdpSelectItems, value: identityProvider, onChange: handleIdentityProviderChange })) : ( /*#__PURE__*/wn.createElement(Typography, null, idp.displayName))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "App Values", tooltipText: "Copy these App (Service Provider) Values into your IdP." }, /*#__PURE__*/ wn.createElement(SettingsList, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Connection ID" }, /*#__PURE__*/ wn.createElement(CopyableText, null, connection.connection_id)), /*#__PURE__*/ wn.createElement(AppDetails, { connection: connection }))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "IdP Values" }, /*#__PURE__*/ wn.createElement(SettingsList, null, type === 'saml' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, editing && !manualConfiguration ? ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.metadataUrlLabel }, /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.metadataUrlLabel), value: localState.metadataUrl || '', onChange: handleMetadataUrlChange }))) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.idpSsoUrlLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.idpSsoUrlLabel), value: localState.ssoUrl || '', onChange: handleSsoUrlChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.idp_sso_url || '–'))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.idpEntityIdLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.idpEntityIdLabel), value: localState.entityId || '', onChange: handleEntityIdChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.idp_entity_id || '–'))))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.x509CertificateLabel }, /*#__PURE__*/ wn.createElement(CertificateTable, { editing: editing, remoteState: connection.verification_certificates, localState: localState, setLocalState: setLocalState, manualConfiguration: manualConfiguration })), editing && !idpRequiresManualConfig && ( /*#__PURE__*/wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat(idp.metadataUrlLabel) : 'Configure manually')))), type === 'oidc' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.clientIdLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.clientIdLabel), value: localState.clientId || '', onChange: handleClientIdChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.client_id || '–'))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: idp.clientSecretLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.clientSecretLabel), value: localState.clientSecret || '', onChange: handleClientSecretChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.client_secret || '–'))), idp.issuerDerivedLabel ? ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.issuerDerivedLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.issuerDerivedLabel), value: localState.issuerDerivedValue || '', onChange: handleIssuerDerivedValueChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, ((_a = idp.extractIssuerFromInput) === null || _a === void 0 ? void 0 : _a.call(idp, connection.issuer)) || '–')))) : ( /*#__PURE__*/wn.createElement(SettingsListItem, { title: idp.issuerLabel }, editing ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "URL", value: localState.issuer || '', onChange: handleIssuerChange })) : ( /*#__PURE__*/wn.createElement(Typography, { color: "secondary" }, connection.issuer || '–')))), editing && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, manualConfiguration && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Authorization URL" }, /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Enter Authorization URL", value: localState.authorizationUrl || '', onChange: handleAuthorizationUrlChange })), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Token URL" }, /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Enter Token URL", value: localState.tokenUrl || '', onChange: handleTokenUrlChange })), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "User info URL" }, /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Enter User info URL", value: localState.userInfoUrl || '', onChange: handleUserInfoUrlChange })), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "JWKS URL" }, /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Enter JWKS URL", value: localState.jwksUrl || '', onChange: handleJwksUrlChange })))), /*#__PURE__*/ wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat((_b = idp.issuerDerivedLabel) !== null && _b !== void 0 ? _b : idp.issuerLabel) : 'Configure manually'))))))), type === 'saml' && ( /*#__PURE__*/wn.createElement(SettingsSection, { title: idp.attributeMappingLabel }, /*#__PURE__*/ wn.createElement(AttributeMappingTable, { editing: editing, localState: localState, remoteState: remoteState, setLocalState: setLocalState })))); };
+var DetailsSection = function DetailsSection(_ref60) { var canUpdateConnection = _ref60.canUpdateConnection, connectionProp = _ref60.connection; var _getIdpAndConnectionI3 = getIdpAndConnectionInfo(connectionProp), idp = _getIdpAndConnectionI3.idp, connection = _getIdpAndConnectionI3.connection, type = _getIdpAndConnectionI3.type; var remoteState = F$3(function () { var _a; return { displayName: connection.display_name, identityProvider: connection.identity_provider, attributeMapping: 'attribute_mapping' in connection ? connection.attribute_mapping : {}, manualConfiguration: false, authorizationUrl: 'authorization_url' in connection ? connection.authorization_url : undefined, clientId: 'client_id' in connection ? connection.client_id : undefined, clientSecret: 'client_secret' in connection ? connection.client_secret : undefined, entityId: 'idp_entity_id' in connection ? connection.idp_entity_id : undefined, issuer: 'issuer' in connection ? connection.issuer : undefined, issuerDerivedValue: type === 'oidc' ? (_a = idp.extractIssuerFromInput) === null || _a === void 0 ? void 0 : _a.call(idp, connection.issuer) : undefined, jwksUrl: 'jwks_url' in connection ? connection.jwks_url : undefined, ssoUrl: 'idp_sso_url' in connection ? connection.idp_sso_url : undefined, tokenUrl: 'token_url' in connection ? connection.token_url : undefined, userInfoUrl: 'userinfo_url' in connection ? connection.userinfo_url : undefined }; }, [connection, idp, type]); var _useFormState = useFormState({ remoteState: remoteState }), localState = _useFormState.localState, setLocalState = _useFormState.setLocalState, editing = _useFormState.editing, handleSetEditing = _useFormState.handleSetEditing; var _useMutateSsoConnecti = useMutateSsoConnection(type), mutate = _useMutateSsoConnecti.mutate; var _useDeleteSsoConnecti2 = useDeleteSsoConnectionCert(), deleteCertificate = _useDeleteSsoConnecti2.mutate; var _useMutateSsoConnecti2 = useMutateSsoConnectionByUrl(), mutateByUrl = _useMutateSsoConnecti2.mutate; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee7() { var _a, baseOptions, mutatedProperties, idpRequiresManualConfig, isManualConfig, _iterator, _step, _loop, _ret, getIssuer, issuer; return _regeneratorRuntime().wrap(function _callee7$(_context8) { while (1)
     switch (_context8.prev = _context8.next) {
         case 0:
             baseOptions = { connection_id: connection.connection_id };
@@ -9162,8 +9316,8 @@ var useMutateOrganization = function useMutateOrganization() { var _useSWRConfig
         case "end": return _context10.stop();
     } }, _callee9); })); }, [client.organization, mutateSWR])); };
 var SetDefaultConfirmModal = function SetDefaultConfirmModal(_a) { var connectionName = _a.connectionName, defaultConnectionName = _a.defaultConnectionName, modalProps = __rest(_a, ["connectionName", "defaultConnectionName"]); return /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, modalProps, { title: "Set ".concat(connectionName || '', " as default?"), confirmButtonText: "Set as default" }), /*#__PURE__*/ wn.createElement(Typography, null, "This will be the default SSO connection for your entire organization. The default connection ID is used to initiate the SSO authentication flow if the connection ID is missing and you only specify the org ID or slug."), defaultConnectionName && ( /*#__PURE__*/wn.createElement(Typography, { color: "error" }, "This will replace ", defaultConnectionName, " as the default connection for your organization."))); };
-var useMutateDefaultConnection = function useMutateDefaultConnection() { var _useMutateOrganizatio = useMutateOrganization(), mutate = _useMutateOrganizatio.mutate; var setDefault = function setDefault(_ref60) { var connectionId = _ref60.connectionId, connectionName = _ref60.connectionName; return mutate({ sso_default_connection_id: connectionId }, { errorMessage: "Failed to set ".concat(connectionName, " as default connection") }); }; return { setDefault: setDefault }; };
-var useSetDefaultConnection = function useSetDefaultConnection(_ref61) { var defaultConnectionName = _ref61.defaultConnectionName; var _h45 = h$4(), _h46 = _slicedToArray2(_h45, 2), connection = _h46[0], setConnection = _h46[1]; var _h47 = h$4(defaultConnectionName), _h48 = _slicedToArray2(_h47, 2), cachedDefaultConnectionName = _h48[0], setCachedDefaultConnectionName = _h48[1]; var _useToggleState2 = useToggleState(), isOpen = _useToggleState2.isOpen, open = _useToggleState2.open, close = _useToggleState2.close; var handleRequestSetDefault = T$2(function (connection) { setConnection(connection); setCachedDefaultConnectionName(defaultConnectionName); open(); }, [defaultConnectionName, open]); var _useMutateDefaultConn = useMutateDefaultConnection(), setDefault = _useMutateDefaultConn.setDefault; var confirm = function confirm() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee10() { return _regeneratorRuntime().wrap(function _callee10$(_context11) { while (1)
+var useMutateDefaultConnection = function useMutateDefaultConnection() { var _useMutateOrganizatio = useMutateOrganization(), mutate = _useMutateOrganizatio.mutate; var setDefault = function setDefault(_ref61) { var connectionId = _ref61.connectionId, connectionName = _ref61.connectionName; return mutate({ sso_default_connection_id: connectionId }, { errorMessage: "Failed to set ".concat(connectionName, " as default connection") }); }; return { setDefault: setDefault }; };
+var useSetDefaultConnection = function useSetDefaultConnection(_ref62) { var defaultConnectionName = _ref62.defaultConnectionName; var _h45 = h$4(), _h46 = _slicedToArray2(_h45, 2), connection = _h46[0], setConnection = _h46[1]; var _h47 = h$4(defaultConnectionName), _h48 = _slicedToArray2(_h47, 2), cachedDefaultConnectionName = _h48[0], setCachedDefaultConnectionName = _h48[1]; var _useToggleState2 = useToggleState(), isOpen = _useToggleState2.isOpen, open = _useToggleState2.open, close = _useToggleState2.close; var handleRequestSetDefault = T$2(function (connection) { setConnection(connection); setCachedDefaultConnectionName(defaultConnectionName); open(); }, [defaultConnectionName, open]); var _useMutateDefaultConn = useMutateDefaultConnection(), setDefault = _useMutateDefaultConn.setDefault; var confirm = function confirm() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee10() { return _regeneratorRuntime().wrap(function _callee10$(_context11) { while (1)
     switch (_context11.prev = _context11.next) {
         case 0:
             if (!connection) {
@@ -9176,8 +9330,8 @@ var useSetDefaultConnection = function useSetDefaultConnection(_ref61) { var def
         case 4:
         case "end": return _context11.stop();
     } }, _callee10); })); }; return { handleRequestSetDefault: handleRequestSetDefault, modalProps: { connectionName: connection === null || connection === void 0 ? void 0 : connection.displayName, defaultConnectionName: cachedDefaultConnectionName, isOpen: isOpen, close: close, confirm: confirm } }; };
-var OrganizationUpdatesSectionBody = function OrganizationUpdatesSectionBody(_ref62) { var connection = _ref62.connection, defaultConnectionName = _ref62.defaultConnectionName, orgJitProvisioningPolicy = _ref62.orgJitProvisioningPolicy, localState = _ref62.localState, setLocalState = _ref62.setLocalState, remoteState = _ref62.remoteState; var _useSettingsContainer2 = useSettingsContainer(), editing = _useSettingsContainer2.editing; var _useSetDefaultConnect = useSetDefaultConnection({ defaultConnectionName: defaultConnectionName }), handleRequestSetDefault = _useSetDefaultConnect.handleRequestSetDefault, modalProps = _useSetDefaultConnect.modalProps; var _ref63 = editing ? localState : remoteState, isDefaultConnection = _ref63.isDefaultConnection, jitProvisioningEnabled = _ref63.jitProvisioningEnabled; var _useRbac = useRbac('stytch.organization', 'update.settings.default-sso-connection'), canSetDefaultConnection = _useRbac.data; var _useRbac2 = useRbac('stytch.organization', 'update.settings.sso-jit-provisioning'), canSetSsoJitProvisioning = _useRbac2.data; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, editing && ( /*#__PURE__*/wn.createElement(SetDefaultConfirmModal, Object.assign({}, modalProps, { confirm: function confirm() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { isDefaultConnection: true }); }); return Promise.resolve(); } }))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Set as default SSO Connection", tooltipText: "The default connection ID is used to initiate the SSO authentication flow if the connection ID is missing and you only specify the org ID or slug. You can only have one default connection. " }, editing && !remoteState.isDefaultConnection && canSetDefaultConnection ? isDefaultConnection ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Typography, null, "This connection will be set as the default upon saving."), /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { isDefaultConnection: false }); }); } }, "Cancel"))) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Typography, null, "This will replace your existing default SSO connection."), /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { handleRequestSetDefault({ displayName: connection.display_name, id: connection.connection_id }); } }, "Set as default"))) : isDefaultConnection ? ( /*#__PURE__*/wn.createElement(Typography, null, "This connection is already set as the default.")) : ( /*#__PURE__*/wn.createElement(Typography, null, "This connection is not set as the default."))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "JIT provisioning via this connection", tooltipText: "If enabled, users who successfully authenticate through this SSO Connection will be automatically granted an account if they do not already exist within your organization." }, editing && canSetSsoJitProvisioning && (orgJitProvisioningPolicy === 'RESTRICTED' || orgJitProvisioningPolicy === 'NOT_ALLOWED') ? jitProvisioningEnabled ? ( /*#__PURE__*/wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { jitProvisioningEnabled: false }); }); }, warning: true }, "Disable")) : ( /*#__PURE__*/wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { jitProvisioningEnabled: true }); }); } }, "Enable")) : ( /*#__PURE__*/wn.createElement(Typography, null, orgJitProvisioningPolicy === 'ALL_ALLOWED' ? 'Enabled at the organization level for all SSO connections.' : !jitProvisioningEnabled || orgJitProvisioningPolicy === 'NOT_ALLOWED' ? 'Disabled' : 'Enabled')))); };
-var OrganizationUpdatesSection = function OrganizationUpdatesSection(_ref64) { var connection = _ref64.connection, defaultConnectionName = _ref64.defaultConnectionName, isDefaultConnection = _ref64.isDefaultConnection; var _useRbac3 = useRbac('stytch.organization', 'update.settings.default-sso-connection'), canSetDefaultConnection = _useRbac3.data; var _useRbac4 = useRbac('stytch.organization', 'update.settings.sso-jit-provisioning'), canSetSsoJitProvisioning = _useRbac4.data; var _useOrgInfo = useOrgInfo(), organization = _useOrgInfo.data; var orgJitProvisioningPolicy = organization === null || organization === void 0 ? void 0 : organization.sso_jit_provisioning; var remoteState = F$3(function () { return { isDefaultConnection: isDefaultConnection, jitProvisioningEnabled: !!(orgJitProvisioningPolicy === 'ALL_ALLOWED' || orgJitProvisioningPolicy === 'RESTRICTED' && (organization === null || organization === void 0 ? void 0 : organization.sso_jit_provisioning_allowed_connections.includes(connection.connection_id))) }; }, [connection.connection_id, isDefaultConnection, orgJitProvisioningPolicy, organization === null || organization === void 0 ? void 0 : organization.sso_jit_provisioning_allowed_connections]); var _useFormState2 = useFormState({ remoteState: remoteState }), localState = _useFormState2.localState, setLocalState = _useFormState2.setLocalState, editing = _useFormState2.editing, handleSetEditing = _useFormState2.handleSetEditing; var _useMutateDefaultConn2 = useMutateDefaultConnection(), setDefault = _useMutateDefaultConn2.setDefault; var _useMutateOrganizatio2 = useMutateOrganization(), mutate = _useMutateOrganizatio2.mutate; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee11() { var _a, _b, promises, allowedConnections, _allowedConnections; return _regeneratorRuntime().wrap(function _callee11$(_context12) { while (1)
+var OrganizationUpdatesSectionBody = function OrganizationUpdatesSectionBody(_ref63) { var connection = _ref63.connection, defaultConnectionName = _ref63.defaultConnectionName, orgJitProvisioningPolicy = _ref63.orgJitProvisioningPolicy, localState = _ref63.localState, setLocalState = _ref63.setLocalState, remoteState = _ref63.remoteState; var _useSettingsContainer2 = useSettingsContainer(), editing = _useSettingsContainer2.editing; var _useSetDefaultConnect = useSetDefaultConnection({ defaultConnectionName: defaultConnectionName }), handleRequestSetDefault = _useSetDefaultConnect.handleRequestSetDefault, modalProps = _useSetDefaultConnect.modalProps; var _ref64 = editing ? localState : remoteState, isDefaultConnection = _ref64.isDefaultConnection, jitProvisioningEnabled = _ref64.jitProvisioningEnabled; var _useRbac = useRbac('stytch.organization', 'update.settings.default-sso-connection'), canSetDefaultConnection = _useRbac.data; var _useRbac2 = useRbac('stytch.organization', 'update.settings.sso-jit-provisioning'), canSetSsoJitProvisioning = _useRbac2.data; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, editing && ( /*#__PURE__*/wn.createElement(SetDefaultConfirmModal, Object.assign({}, modalProps, { confirm: function confirm() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { isDefaultConnection: true }); }); return Promise.resolve(); } }))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Set as default SSO Connection", tooltipText: "The default connection ID is used to initiate the SSO authentication flow if the connection ID is missing and you only specify the org ID or slug. You can only have one default connection. " }, editing && !remoteState.isDefaultConnection && canSetDefaultConnection ? isDefaultConnection ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Typography, null, "This connection will be set as the default upon saving."), /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { isDefaultConnection: false }); }); } }, "Cancel"))) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Typography, null, "This will replace your existing default SSO connection."), /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { handleRequestSetDefault({ displayName: connection.display_name, id: connection.connection_id }); } }, "Set as default"))) : isDefaultConnection ? ( /*#__PURE__*/wn.createElement(Typography, null, "This connection is already set as the default.")) : ( /*#__PURE__*/wn.createElement(Typography, null, "This connection is not set as the default."))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "JIT provisioning via this connection", tooltipText: "If enabled, users who successfully authenticate through this SSO Connection will be automatically granted an account if they do not already exist within your organization." }, editing && canSetSsoJitProvisioning && (orgJitProvisioningPolicy === 'RESTRICTED' || orgJitProvisioningPolicy === 'NOT_ALLOWED') ? jitProvisioningEnabled ? ( /*#__PURE__*/wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { jitProvisioningEnabled: false }); }); }, warning: true }, "Disable")) : ( /*#__PURE__*/wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { jitProvisioningEnabled: true }); }); } }, "Enable")) : ( /*#__PURE__*/wn.createElement(Typography, null, orgJitProvisioningPolicy === 'ALL_ALLOWED' ? 'Enabled at the organization level for all SSO connections.' : !jitProvisioningEnabled || orgJitProvisioningPolicy === 'NOT_ALLOWED' ? 'Disabled' : 'Enabled')))); };
+var OrganizationUpdatesSection = function OrganizationUpdatesSection(_ref65) { var connection = _ref65.connection, defaultConnectionName = _ref65.defaultConnectionName, isDefaultConnection = _ref65.isDefaultConnection; var _useRbac3 = useRbac('stytch.organization', 'update.settings.default-sso-connection'), canSetDefaultConnection = _useRbac3.data; var _useRbac4 = useRbac('stytch.organization', 'update.settings.sso-jit-provisioning'), canSetSsoJitProvisioning = _useRbac4.data; var _useOrgInfo = useOrgInfo(), organization = _useOrgInfo.data; var orgJitProvisioningPolicy = organization === null || organization === void 0 ? void 0 : organization.sso_jit_provisioning; var remoteState = F$3(function () { return { isDefaultConnection: isDefaultConnection, jitProvisioningEnabled: !!(orgJitProvisioningPolicy === 'ALL_ALLOWED' || orgJitProvisioningPolicy === 'RESTRICTED' && (organization === null || organization === void 0 ? void 0 : organization.sso_jit_provisioning_allowed_connections.includes(connection.connection_id))) }; }, [connection.connection_id, isDefaultConnection, orgJitProvisioningPolicy, organization === null || organization === void 0 ? void 0 : organization.sso_jit_provisioning_allowed_connections]); var _useFormState2 = useFormState({ remoteState: remoteState }), localState = _useFormState2.localState, setLocalState = _useFormState2.setLocalState, editing = _useFormState2.editing, handleSetEditing = _useFormState2.handleSetEditing; var _useMutateDefaultConn2 = useMutateDefaultConnection(), setDefault = _useMutateDefaultConn2.setDefault; var _useMutateOrganizatio2 = useMutateOrganization(), mutate = _useMutateOrganizatio2.mutate; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee11() { var _a, _b, promises, allowedConnections, _allowedConnections; return _regeneratorRuntime().wrap(function _callee11$(_context12) { while (1)
     switch (_context12.prev = _context12.next) {
         case 0:
             if (organization) {
@@ -9208,39 +9362,454 @@ var OrganizationUpdatesSection = function OrganizationUpdatesSection(_ref64) { v
         case 7:
         case "end": return _context12.stop();
     } }, _callee11); })); }, [connection.connection_id, connection.display_name, localState.isDefaultConnection, localState.jitProvisioningEnabled, mutate, orgJitProvisioningPolicy, organization, remoteState.isDefaultConnection, remoteState.jitProvisioningEnabled, setDefault]); var _useSsoRouterControll2 = useSsoRouterController(), useBlockNavigation = _useSsoRouterControll2.useBlockNavigation; return /*#__PURE__*/ wn.createElement(SettingsContainer, { title: "Organization updates", hasCTA: canSetDefaultConnection || canSetSsoJitProvisioning, onSave: handleSave, useBlockNavigation: useBlockNavigation, editing: editing, setEditing: handleSetEditing }, /*#__PURE__*/ wn.createElement(OrganizationUpdatesSectionBody, { connection: connection, defaultConnectionName: defaultConnectionName, orgJitProvisioningPolicy: orgJitProvisioningPolicy, remoteState: remoteState, localState: localState, setLocalState: setLocalState })); };
-var ChevronRight = {};
+function _typeof(o) {
+    "@babel/helpers - typeof";
+    return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o);
+}
+function toPrimitive(t, r) { if ("object" != _typeof(t) || !t)
+    return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != _typeof(i))
+        return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+} return ("string" === r ? String : Number)(t); }
+function toPropertyKey(t) { var i = toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _defineProperty(obj, key, value) { key = toPropertyKey(key); if (key in obj) {
+    Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });
+}
+else {
+    obj[key] = value;
+} return obj; }
+var ArrowDropDownIcon = createSvgIcon$1(/*#__PURE__*/ y$3("path", { d: "M7 10l5 5 5-5z" }));
+function _arrayWithHoles(arr) { if (Array.isArray(arr))
+    return arr; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) {
+    var e, n, i, u, a = [], f = !0, o = !1;
+    try {
+        if (i = (t = t.call(r)).next, 0 === l)
+            ;
+        else
+            for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0)
+                ;
+    }
+    catch (r) {
+        o = !0, n = r;
+    }
+    finally {
+        try {
+            if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u))
+                return;
+        }
+        finally {
+            if (o)
+                throw n;
+        }
+    }
+    return a;
+} }
+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; }
+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 _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function stripDiacritics(string) { return typeof string.normalize !== 'undefined' ? string.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : string; }
+function createFilterOptions() { var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var _config$ignoreAccents = config.ignoreAccents, ignoreAccents = _config$ignoreAccents === void 0 ? true : _config$ignoreAccents, _config$ignoreCase = config.ignoreCase, ignoreCase = _config$ignoreCase === void 0 ? true : _config$ignoreCase, limit = config.limit, _config$matchFrom = config.matchFrom, matchFrom = _config$matchFrom === void 0 ? 'any' : _config$matchFrom, stringify = config.stringify, _config$trim = config.trim, trim = _config$trim === void 0 ? false : _config$trim; return function (options, _ref) { var inputValue = _ref.inputValue, getOptionLabel = _ref.getOptionLabel; var input = trim ? inputValue.trim() : inputValue; if (ignoreCase) {
+    input = input.toLowerCase();
+} if (ignoreAccents) {
+    input = stripDiacritics(input);
+} var filteredOptions = options.filter(function (option) { var candidate = (stringify || getOptionLabel)(option); if (ignoreCase) {
+    candidate = candidate.toLowerCase();
+} if (ignoreAccents) {
+    candidate = stripDiacritics(candidate);
+} return matchFrom === 'start' ? candidate.indexOf(input) === 0 : candidate.indexOf(input) > -1; }); return typeof limit === 'number' ? filteredOptions.slice(0, limit) : filteredOptions; }; }
+function findIndex(array, comp) { for (var i = 0; i < array.length; i += 1) {
+    if (comp(array[i])) {
+        return i;
+    }
+} return -1; }
+var defaultFilterOptions = createFilterOptions();
+var pageSize = 5;
+function useAutocomplete(props) { var _props$autoComplete = props.autoComplete, autoComplete = _props$autoComplete === void 0 ? false : _props$autoComplete, _props$autoHighlight = props.autoHighlight, autoHighlight = _props$autoHighlight === void 0 ? false : _props$autoHighlight, _props$autoSelect = props.autoSelect, autoSelect = _props$autoSelect === void 0 ? false : _props$autoSelect, _props$blurOnSelect = props.blurOnSelect, blurOnSelect = _props$blurOnSelect === void 0 ? false : _props$blurOnSelect, _props$clearOnBlur = props.clearOnBlur, clearOnBlur = _props$clearOnBlur === void 0 ? !props.freeSolo : _props$clearOnBlur, _props$clearOnEscape = props.clearOnEscape, clearOnEscape = _props$clearOnEscape === void 0 ? false : _props$clearOnEscape, _props$componentName = props.componentName, componentName = _props$componentName === void 0 ? 'useAutocomplete' : _props$componentName, _props$debug = props.debug, debug = _props$debug === void 0 ? false : _props$debug, _props$defaultValue = props.defaultValue, defaultValue = _props$defaultValue === void 0 ? props.multiple ? [] : null : _props$defaultValue, _props$disableClearab = props.disableClearable, disableClearable = _props$disableClearab === void 0 ? false : _props$disableClearab, _props$disableCloseOn = props.disableCloseOnSelect, disableCloseOnSelect = _props$disableCloseOn === void 0 ? false : _props$disableCloseOn, _props$disabledItemsF = props.disabledItemsFocusable, disabledItemsFocusable = _props$disabledItemsF === void 0 ? false : _props$disabledItemsF, _props$disableListWra = props.disableListWrap, disableListWrap = _props$disableListWra === void 0 ? false : _props$disableListWra, _props$filterOptions = props.filterOptions, filterOptions = _props$filterOptions === void 0 ? defaultFilterOptions : _props$filterOptions, _props$filterSelected = props.filterSelectedOptions, filterSelectedOptions = _props$filterSelected === void 0 ? false : _props$filterSelected, _props$freeSolo = props.freeSolo, freeSolo = _props$freeSolo === void 0 ? false : _props$freeSolo, getOptionDisabled = props.getOptionDisabled, _props$getOptionLabel = props.getOptionLabel, getOptionLabelProp = _props$getOptionLabel === void 0 ? function (option) { return option; } : _props$getOptionLabel, _props$getOptionSelec = props.getOptionSelected, getOptionSelected = _props$getOptionSelec === void 0 ? function (option, value) { return option === value; } : _props$getOptionSelec, groupBy = props.groupBy, _props$handleHomeEndK = props.handleHomeEndKeys, handleHomeEndKeys = _props$handleHomeEndK === void 0 ? !props.freeSolo : _props$handleHomeEndK, idProp = props.id, _props$includeInputIn = props.includeInputInList, includeInputInList = _props$includeInputIn === void 0 ? false : _props$includeInputIn, inputValueProp = props.inputValue, _props$multiple = props.multiple, multiple = _props$multiple === void 0 ? false : _props$multiple, onChange = props.onChange, onClose = props.onClose, onHighlightChange = props.onHighlightChange, onInputChange = props.onInputChange, onOpen = props.onOpen, openProp = props.open, _props$openOnFocus = props.openOnFocus, openOnFocus = _props$openOnFocus === void 0 ? false : _props$openOnFocus, options = props.options, _props$selectOnFocus = props.selectOnFocus, selectOnFocus = _props$selectOnFocus === void 0 ? !props.freeSolo : _props$selectOnFocus, valueProp = props.value; var id = useId(idProp); var getOptionLabel = getOptionLabelProp; var ignoreFocus = _$1(false); var firstFocus = _$1(true); var inputRef = _$1(null); var listboxRef = _$1(null); var _React$useState = h$4(null), anchorEl = _React$useState[0], setAnchorEl = _React$useState[1]; var _React$useState2 = h$4(-1), focusedTag = _React$useState2[0], setFocusedTag = _React$useState2[1]; var defaultHighlighted = autoHighlight ? 0 : -1; var highlightedIndexRef = _$1(defaultHighlighted); var _useControlled = useControlled({ controlled: valueProp, "default": defaultValue, name: componentName }), _useControlled2 = _slicedToArray(_useControlled, 2), value = _useControlled2[0], setValue = _useControlled2[1]; var _useControlled3 = useControlled({ controlled: inputValueProp, "default": '', name: componentName, state: 'inputValue' }), _useControlled4 = _slicedToArray(_useControlled3, 2), inputValue = _useControlled4[0], setInputValue = _useControlled4[1]; var _React$useState3 = h$4(false), focused = _React$useState3[0], setFocused = _React$useState3[1]; var resetInputValue = useEventCallback(function (event, newValue) { var newInputValue; if (multiple) {
+    newInputValue = '';
+}
+else if (newValue == null) {
+    newInputValue = '';
+}
+else {
+    var optionLabel = getOptionLabel(newValue);
+    newInputValue = typeof optionLabel === 'string' ? optionLabel : '';
+} if (inputValue === newInputValue) {
+    return;
+} setInputValue(newInputValue); if (onInputChange) {
+    onInputChange(event, newInputValue, 'reset');
+} }); p$3(function () { resetInputValue(null, value); }, [value, resetInputValue]); var _useControlled5 = useControlled({ controlled: openProp, "default": false, name: componentName, state: 'open' }), _useControlled6 = _slicedToArray(_useControlled5, 2), open = _useControlled6[0], setOpenState = _useControlled6[1]; var inputValueIsSelectedValue = !multiple && value != null && inputValue === getOptionLabel(value); var popupOpen = open; var filteredOptions = popupOpen ? filterOptions(options.filter(function (option) { if (filterSelectedOptions && (multiple ? value : [value]).some(function (value2) { return value2 !== null && getOptionSelected(option, value2); })) {
+    return false;
+} return true; }), { inputValue: inputValueIsSelectedValue ? '' : inputValue, getOptionLabel: getOptionLabel }) : []; var focusTag = useEventCallback(function (tagToFocus) { if (tagToFocus === -1) {
+    inputRef.current.focus();
+}
+else {
+    anchorEl.querySelector("[data-tag-index=\"".concat(tagToFocus, "\"]")).focus();
+} }); p$3(function () { if (multiple && focusedTag > value.length - 1) {
+    setFocusedTag(-1);
+    focusTag(-1);
+} }, [value, multiple, focusedTag, focusTag]); function validOptionIndex(index, direction) { if (!listboxRef.current || index === -1) {
+    return -1;
+} var nextFocus = index; while (true) {
+    if (direction === 'next' && nextFocus === filteredOptions.length || direction === 'previous' && nextFocus === -1) {
+        return -1;
+    }
+    var option = listboxRef.current.querySelector("[data-option-index=\"".concat(nextFocus, "\"]"));
+    var nextFocusDisabled = disabledItemsFocusable ? false : option && (option.disabled || option.getAttribute('aria-disabled') === 'true');
+    if (option && !option.hasAttribute('tabindex') || nextFocusDisabled) {
+        nextFocus += direction === 'next' ? 1 : -1;
+    }
+    else {
+        return nextFocus;
+    }
+} } var setHighlightedIndex = useEventCallback(function (_ref2) { var event = _ref2.event, index = _ref2.index, _ref2$reason = _ref2.reason, reason = _ref2$reason === void 0 ? 'auto' : _ref2$reason; highlightedIndexRef.current = index; if (index === -1) {
+    inputRef.current.removeAttribute('aria-activedescendant');
+}
+else {
+    inputRef.current.setAttribute('aria-activedescendant', "".concat(id, "-option-").concat(index));
+} if (onHighlightChange) {
+    onHighlightChange(event, index === -1 ? null : filteredOptions[index], reason);
+} if (!listboxRef.current) {
+    return;
+} var prev = listboxRef.current.querySelector('[data-focus]'); if (prev) {
+    prev.removeAttribute('data-focus');
+} var listboxNode = listboxRef.current.parentElement.querySelector('[role="listbox"]'); if (!listboxNode) {
+    return;
+} if (index === -1) {
+    listboxNode.scrollTop = 0;
+    return;
+} var option = listboxRef.current.querySelector("[data-option-index=\"".concat(index, "\"]")); if (!option) {
+    return;
+} option.setAttribute('data-focus', 'true'); if (listboxNode.scrollHeight > listboxNode.clientHeight && reason !== 'mouse') {
+    var element = option;
+    var scrollBottom = listboxNode.clientHeight + listboxNode.scrollTop;
+    var elementBottom = element.offsetTop + element.offsetHeight;
+    if (elementBottom > scrollBottom) {
+        listboxNode.scrollTop = elementBottom - listboxNode.clientHeight;
+    }
+    else if (element.offsetTop - element.offsetHeight * (groupBy ? 1.3 : 0) < listboxNode.scrollTop) {
+        listboxNode.scrollTop = element.offsetTop - element.offsetHeight * (groupBy ? 1.3 : 0);
+    }
+} }); var changeHighlightedIndex = useEventCallback(function (_ref3) { var event = _ref3.event, diff = _ref3.diff, _ref3$direction = _ref3.direction, direction = _ref3$direction === void 0 ? 'next' : _ref3$direction, _ref3$reason = _ref3.reason, reason = _ref3$reason === void 0 ? 'auto' : _ref3$reason; if (!popupOpen) {
+    return;
+} var getNextIndex = function getNextIndex() { var maxIndex = filteredOptions.length - 1; if (diff === 'reset') {
+    return defaultHighlighted;
+} if (diff === 'start') {
+    return 0;
+} if (diff === 'end') {
+    return maxIndex;
+} var newIndex = highlightedIndexRef.current + diff; if (newIndex < 0) {
+    if (newIndex === -1 && includeInputInList) {
+        return -1;
+    }
+    if (disableListWrap && highlightedIndexRef.current !== -1 || Math.abs(diff) > 1) {
+        return 0;
+    }
+    return maxIndex;
+} if (newIndex > maxIndex) {
+    if (newIndex === maxIndex + 1 && includeInputInList) {
+        return -1;
+    }
+    if (disableListWrap || Math.abs(diff) > 1) {
+        return maxIndex;
+    }
+    return 0;
+} return newIndex; }; var nextIndex = validOptionIndex(getNextIndex(), direction); setHighlightedIndex({ index: nextIndex, reason: reason, event: event }); if (autoComplete && diff !== 'reset') {
+    if (nextIndex === -1) {
+        inputRef.current.value = inputValue;
+    }
+    else {
+        var option = getOptionLabel(filteredOptions[nextIndex]);
+        inputRef.current.value = option;
+        var index = option.toLowerCase().indexOf(inputValue.toLowerCase());
+        if (index === 0 && inputValue.length > 0) {
+            inputRef.current.setSelectionRange(inputValue.length, option.length);
+        }
+    }
+} }); var syncHighlightedIndex = T$2(function () { if (!popupOpen) {
+    return;
+} var valueItem = multiple ? value[0] : value; if (filteredOptions.length === 0 || valueItem == null) {
+    changeHighlightedIndex({ diff: 'reset' });
+    return;
+} if (!listboxRef.current) {
+    return;
+} if (!filterSelectedOptions && valueItem != null) {
+    var currentOption = filteredOptions[highlightedIndexRef.current];
+    if (multiple && currentOption && findIndex(value, function (val) { return getOptionSelected(currentOption, val); }) !== -1) {
+        return;
+    }
+    var itemIndex = findIndex(filteredOptions, function (optionItem) { return getOptionSelected(optionItem, valueItem); });
+    if (itemIndex === -1) {
+        changeHighlightedIndex({ diff: 'reset' });
+    }
+    else {
+        setHighlightedIndex({ index: itemIndex });
+    }
+    return;
+} if (highlightedIndexRef.current >= filteredOptions.length - 1) {
+    setHighlightedIndex({ index: filteredOptions.length - 1 });
+    return;
+} setHighlightedIndex({ index: highlightedIndexRef.current }); }, [filteredOptions.length === 0, multiple ? false : value, filterSelectedOptions, changeHighlightedIndex, setHighlightedIndex, popupOpen, inputValue, multiple]); var handleListboxRef = useEventCallback(function (node) { setRef(listboxRef, node); if (!node) {
+    return;
+} syncHighlightedIndex(); }); p$3(function () { syncHighlightedIndex(); }, [syncHighlightedIndex]); var handleOpen = function handleOpen(event) { if (open) {
+    return;
+} setOpenState(true); if (onOpen) {
+    onOpen(event);
+} }; var handleClose = function handleClose(event, reason) { if (!open) {
+    return;
+} setOpenState(false); if (onClose) {
+    onClose(event, reason);
+} }; var handleValue = function handleValue(event, newValue, reason, details) { if (value === newValue) {
+    return;
+} if (onChange) {
+    onChange(event, newValue, reason, details);
+} setValue(newValue); }; var isTouch = _$1(false); var selectNewValue = function selectNewValue(event, option) { var reasonProp = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'select-option'; var origin = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'options'; var reason = reasonProp; var newValue = option; if (multiple) {
+    newValue = Array.isArray(value) ? value.slice() : [];
+    var itemIndex = findIndex(newValue, function (valueItem) { return getOptionSelected(option, valueItem); });
+    if (itemIndex === -1) {
+        newValue.push(option);
+    }
+    else if (origin !== 'freeSolo') {
+        newValue.splice(itemIndex, 1);
+        reason = 'remove-option';
+    }
+} resetInputValue(event, newValue); handleValue(event, newValue, reason, { option: option }); if (!disableCloseOnSelect) {
+    handleClose(event, reason);
+} if (blurOnSelect === true || blurOnSelect === 'touch' && isTouch.current || blurOnSelect === 'mouse' && !isTouch.current) {
+    inputRef.current.blur();
+} }; function validTagIndex(index, direction) { if (index === -1) {
+    return -1;
+} var nextFocus = index; while (true) {
+    if (direction === 'next' && nextFocus === value.length || direction === 'previous' && nextFocus === -1) {
+        return -1;
+    }
+    var option = anchorEl.querySelector("[data-tag-index=\"".concat(nextFocus, "\"]"));
+    if (option && (!option.hasAttribute('tabindex') || option.disabled || option.getAttribute('aria-disabled') === 'true')) {
+        nextFocus += direction === 'next' ? 1 : -1;
+    }
+    else {
+        return nextFocus;
+    }
+} } var handleFocusTag = function handleFocusTag(event, direction) { if (!multiple) {
+    return;
+} handleClose(event, 'toggleInput'); var nextTag = focusedTag; if (focusedTag === -1) {
+    if (inputValue === '' && direction === 'previous') {
+        nextTag = value.length - 1;
+    }
+}
+else {
+    nextTag += direction === 'next' ? 1 : -1;
+    if (nextTag < 0) {
+        nextTag = 0;
+    }
+    if (nextTag === value.length) {
+        nextTag = -1;
+    }
+} nextTag = validTagIndex(nextTag, direction); setFocusedTag(nextTag); focusTag(nextTag); }; var handleClear = function handleClear(event) { ignoreFocus.current = true; setInputValue(''); if (onInputChange) {
+    onInputChange(event, '', 'clear');
+} handleValue(event, multiple ? [] : null, 'clear'); }; var handleKeyDown = function handleKeyDown(other) { return function (event) { if (focusedTag !== -1 && ['ArrowLeft', 'ArrowRight'].indexOf(event.key) === -1) {
+    setFocusedTag(-1);
+    focusTag(-1);
+} switch (event.key) {
+    case 'Home':
+        if (popupOpen && handleHomeEndKeys) {
+            event.preventDefault();
+            changeHighlightedIndex({ diff: 'start', direction: 'next', reason: 'keyboard', event: event });
+        }
+        break;
+    case 'End':
+        if (popupOpen && handleHomeEndKeys) {
+            event.preventDefault();
+            changeHighlightedIndex({ diff: 'end', direction: 'previous', reason: 'keyboard', event: event });
+        }
+        break;
+    case 'PageUp':
+        event.preventDefault();
+        changeHighlightedIndex({ diff: -pageSize, direction: 'previous', reason: 'keyboard', event: event });
+        handleOpen(event);
+        break;
+    case 'PageDown':
+        event.preventDefault();
+        changeHighlightedIndex({ diff: pageSize, direction: 'next', reason: 'keyboard', event: event });
+        handleOpen(event);
+        break;
+    case 'ArrowDown':
+        event.preventDefault();
+        changeHighlightedIndex({ diff: 1, direction: 'next', reason: 'keyboard', event: event });
+        handleOpen(event);
+        break;
+    case 'ArrowUp':
+        event.preventDefault();
+        changeHighlightedIndex({ diff: -1, direction: 'previous', reason: 'keyboard', event: event });
+        handleOpen(event);
+        break;
+    case 'ArrowLeft':
+        handleFocusTag(event, 'previous');
+        break;
+    case 'ArrowRight':
+        handleFocusTag(event, 'next');
+        break;
+    case 'Enter':
+        if (event.which === 229) {
+            break;
+        }
+        if (highlightedIndexRef.current !== -1 && popupOpen) {
+            var option = filteredOptions[highlightedIndexRef.current];
+            var disabled = getOptionDisabled ? getOptionDisabled(option) : false;
+            event.preventDefault();
+            if (disabled) {
+                return;
+            }
+            selectNewValue(event, option, 'select-option');
+            if (autoComplete) {
+                inputRef.current.setSelectionRange(inputRef.current.value.length, inputRef.current.value.length);
+            }
+        }
+        else if (freeSolo && inputValue !== '' && inputValueIsSelectedValue === false) {
+            if (multiple) {
+                event.preventDefault();
+            }
+            selectNewValue(event, inputValue, 'create-option', 'freeSolo');
+        }
+        break;
+    case 'Escape':
+        if (popupOpen) {
+            event.preventDefault();
+            event.stopPropagation();
+            handleClose(event, 'escape');
+        }
+        else if (clearOnEscape && (inputValue !== '' || multiple && value.length > 0)) {
+            event.preventDefault();
+            event.stopPropagation();
+            handleClear(event);
+        }
+        break;
+    case 'Backspace':
+        if (multiple && inputValue === '' && value.length > 0) {
+            var index = focusedTag === -1 ? value.length - 1 : focusedTag;
+            var newValue = value.slice();
+            newValue.splice(index, 1);
+            handleValue(event, newValue, 'remove-option', { option: value[index] });
+        }
+        break;
+} if (other.onKeyDown) {
+    other.onKeyDown(event);
+} }; }; var handleFocus = function handleFocus(event) { setFocused(true); if (openOnFocus && !ignoreFocus.current) {
+    handleOpen(event);
+} }; var handleBlur = function handleBlur(event) { if (listboxRef.current !== null && document.activeElement === listboxRef.current.parentElement) {
+    inputRef.current.focus();
+    return;
+} setFocused(false); firstFocus.current = true; ignoreFocus.current = false; if (debug && inputValue !== '') {
+    return;
+} if (autoSelect && highlightedIndexRef.current !== -1 && popupOpen) {
+    selectNewValue(event, filteredOptions[highlightedIndexRef.current], 'blur');
+}
+else if (autoSelect && freeSolo && inputValue !== '') {
+    selectNewValue(event, inputValue, 'blur', 'freeSolo');
+}
+else if (clearOnBlur) {
+    resetInputValue(event, value);
+} handleClose(event, 'blur'); }; var handleInputChange = function handleInputChange(event) { var newValue = event.target.value; if (inputValue !== newValue) {
+    setInputValue(newValue);
+    if (onInputChange) {
+        onInputChange(event, newValue, 'input');
+    }
+} if (newValue === '') {
+    if (!disableClearable && !multiple) {
+        handleValue(event, null, 'clear');
+    }
+}
+else {
+    handleOpen(event);
+} }; var handleOptionMouseOver = function handleOptionMouseOver(event) { setHighlightedIndex({ event: event, index: Number(event.currentTarget.getAttribute('data-option-index')), reason: 'mouse' }); }; var handleOptionTouchStart = function handleOptionTouchStart() { isTouch.current = true; }; var handleOptionClick = function handleOptionClick(event) { var index = Number(event.currentTarget.getAttribute('data-option-index')); selectNewValue(event, filteredOptions[index], 'select-option'); isTouch.current = false; }; var handleTagDelete = function handleTagDelete(index) { return function (event) { var newValue = value.slice(); newValue.splice(index, 1); handleValue(event, newValue, 'remove-option', { option: value[index] }); }; }; var handlePopupIndicator = function handlePopupIndicator(event) { if (open) {
+    handleClose(event, 'toggleInput');
+}
+else {
+    handleOpen(event);
+} }; var handleMouseDown = function handleMouseDown(event) { if (event.target.getAttribute('id') !== id) {
+    event.preventDefault();
+} }; var handleClick = function handleClick() { inputRef.current.focus(); if (selectOnFocus && firstFocus.current && inputRef.current.selectionEnd - inputRef.current.selectionStart === 0) {
+    inputRef.current.select();
+} firstFocus.current = false; }; var handleInputMouseDown = function handleInputMouseDown(event) { if (inputValue === '' || !open) {
+    handlePopupIndicator(event);
+} }; var dirty = freeSolo && inputValue.length > 0; dirty = dirty || (multiple ? value.length > 0 : value !== null); var groupedOptions = filteredOptions; if (groupBy) {
+    groupedOptions = filteredOptions.reduce(function (acc, option, index) { var group = groupBy(option); if (acc.length > 0 && acc[acc.length - 1].group === group) {
+        acc[acc.length - 1].options.push(option);
+    }
+    else {
+        acc.push({ key: index, index: index, group: group, options: [option] });
+    } return acc; }, []);
+} return { getRootProps: function getRootProps() { var other = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; return _extends({ 'aria-owns': popupOpen ? "".concat(id, "-popup") : null, role: 'combobox', 'aria-expanded': popupOpen }, other, { onKeyDown: handleKeyDown(other), onMouseDown: handleMouseDown, onClick: handleClick }); }, getInputLabelProps: function getInputLabelProps() { return { id: "".concat(id, "-label"), htmlFor: id }; }, getInputProps: function getInputProps() { return { id: id, value: inputValue, onBlur: handleBlur, onFocus: handleFocus, onChange: handleInputChange, onMouseDown: handleInputMouseDown, 'aria-activedescendant': popupOpen ? '' : null, 'aria-autocomplete': autoComplete ? 'both' : 'list', 'aria-controls': popupOpen ? "".concat(id, "-popup") : null, autoComplete: 'off', ref: inputRef, autoCapitalize: 'none', spellCheck: 'false' }; }, getClearProps: function getClearProps() { return { tabIndex: -1, onClick: handleClear }; }, getPopupIndicatorProps: function getPopupIndicatorProps() { return { tabIndex: -1, onClick: handlePopupIndicator }; }, getTagProps: function getTagProps(_ref4) { var index = _ref4.index; return { key: index, 'data-tag-index': index, tabIndex: -1, onDelete: handleTagDelete(index) }; }, getListboxProps: function getListboxProps() { return { role: 'listbox', id: "".concat(id, "-popup"), 'aria-labelledby': "".concat(id, "-label"), ref: handleListboxRef, onMouseDown: function onMouseDown(event) { event.preventDefault(); } }; }, getOptionProps: function getOptionProps(_ref5) { var index = _ref5.index, option = _ref5.option; var selected = (multiple ? value : [value]).some(function (value2) { return value2 != null && getOptionSelected(option, value2); }); var disabled = getOptionDisabled ? getOptionDisabled(option) : false; return { key: index, tabIndex: -1, role: 'option', id: "".concat(id, "-option-").concat(index), onMouseOver: handleOptionMouseOver, onClick: handleOptionClick, onTouchStart: handleOptionTouchStart, 'data-option-index': index, 'aria-disabled': disabled, 'aria-selected': selected }; }, id: id, inputValue: inputValue, value: value, dirty: dirty, popupOpen: popupOpen, focused: focused || focusedTag !== -1, anchorEl: anchorEl, setAnchorEl: setAnchorEl, focusedTag: focusedTag, groupedOptions: groupedOptions }; }
+var styles = function styles(theme) { var _option; return { root: { '&$focused $clearIndicatorDirty': { visibility: 'visible' }, '@media (pointer: fine)': { '&:hover $clearIndicatorDirty': { visibility: 'visible' } } }, fullWidth: { width: '100%' }, focused: {}, tag: { margin: 3, maxWidth: 'calc(100% - 6px)' }, tagSizeSmall: { margin: 2, maxWidth: 'calc(100% - 4px)' }, hasPopupIcon: {}, hasClearIcon: {}, inputRoot: { flexWrap: 'wrap', '$hasPopupIcon &, $hasClearIcon &': { paddingRight: 26 + 4 }, '$hasPopupIcon$hasClearIcon &': { paddingRight: 52 + 4 }, '& $input': { width: 0, minWidth: 30 }, '&[class*="MuiInput-root"]': { paddingBottom: 1, '& $input': { padding: 4 }, '& $input:first-child': { padding: '6px 0' } }, '&[class*="MuiInput-root"][class*="MuiInput-marginDense"]': { '& $input': { padding: '4px 4px 5px' }, '& $input:first-child': { padding: '3px 0 6px' } }, '&[class*="MuiOutlinedInput-root"]': { padding: 9, '$hasPopupIcon &, $hasClearIcon &': { paddingRight: 26 + 4 + 9 }, '$hasPopupIcon$hasClearIcon &': { paddingRight: 52 + 4 + 9 }, '& $input': { padding: '9.5px 4px' }, '& $input:first-child': { paddingLeft: 6 }, '& $endAdornment': { right: 9 } }, '&[class*="MuiOutlinedInput-root"][class*="MuiOutlinedInput-marginDense"]': { padding: 6, '& $input': { padding: '4.5px 4px' } }, '&[class*="MuiFilledInput-root"]': { paddingTop: 19, paddingLeft: 8, '$hasPopupIcon &, $hasClearIcon &': { paddingRight: 26 + 4 + 9 }, '$hasPopupIcon$hasClearIcon &': { paddingRight: 52 + 4 + 9 }, '& $input': { padding: '9px 4px' }, '& $endAdornment': { right: 9 } }, '&[class*="MuiFilledInput-root"][class*="MuiFilledInput-marginDense"]': { paddingBottom: 1, '& $input': { padding: '4.5px 4px' } } }, input: { flexGrow: 1, textOverflow: 'ellipsis', opacity: 0 }, inputFocused: { opacity: 1 }, endAdornment: { position: 'absolute', right: 0, top: 'calc(50% - 14px)' }, clearIndicator: { marginRight: -2, padding: 4, visibility: 'hidden' }, clearIndicatorDirty: {}, popupIndicator: { padding: 2, marginRight: -2 }, popupIndicatorOpen: { transform: 'rotate(180deg)' }, popper: { zIndex: theme.zIndex.modal }, popperDisablePortal: { position: 'absolute' }, paper: _extends({}, theme.typography.body1, { overflow: 'hidden', margin: '4px 0' }), listbox: { listStyle: 'none', margin: 0, padding: '8px 0', maxHeight: '40vh', overflow: 'auto' }, loading: { color: theme.palette.text.secondary, padding: '14px 16px' }, noOptions: { color: theme.palette.text.secondary, padding: '14px 16px' }, option: (_option = { minHeight: 48, display: 'flex', justifyContent: 'flex-start', alignItems: 'center', cursor: 'pointer', paddingTop: 6, boxSizing: 'border-box', outline: '0', WebkitTapHighlightColor: 'transparent', paddingBottom: 6, paddingLeft: 16, paddingRight: 16 }, _defineProperty(_option, theme.breakpoints.up('sm'), { minHeight: 'auto' }), _defineProperty(_option, '&[aria-selected="true"]', { backgroundColor: theme.palette.action.selected }), _defineProperty(_option, '&[data-focus="true"]', { backgroundColor: theme.palette.action.hover }), _defineProperty(_option, '&:active', { backgroundColor: theme.palette.action.selected }), _defineProperty(_option, '&[aria-disabled="true"]', { opacity: theme.palette.action.disabledOpacity, pointerEvents: 'none' }), _option), groupLabel: { backgroundColor: theme.palette.background.paper, top: -8 }, groupUl: { padding: 0, '& $option': { paddingLeft: 24 } } }; };
+function DisablePortal(props) { props.anchorEl; props.open; var other = _objectWithoutProperties(props, ["anchorEl", "open"]); return /*#__PURE__*/ y$3("div", other); }
+var _ref = /*#__PURE__*/ y$3(CloseIcon, { fontSize: "small" });
+var _ref2 = /*#__PURE__*/ y$3(ArrowDropDownIcon, null);
+var Autocomplete$1 = /*#__PURE__*/ N$1(function Autocomplete(props, ref) { props.autoComplete; props.autoHighlight; props.autoSelect; props.blurOnSelect; var ChipProps = props.ChipProps, classes = props.classes, className = props.className, _props$clearOnBlur = props.clearOnBlur; _props$clearOnBlur === void 0 ? !props.freeSolo : _props$clearOnBlur; props.clearOnEscape; var _props$clearText = props.clearText, clearText = _props$clearText === void 0 ? 'Clear' : _props$clearText, _props$closeIcon = props.closeIcon, closeIcon = _props$closeIcon === void 0 ? _ref : _props$closeIcon, _props$closeText = props.closeText, closeText = _props$closeText === void 0 ? 'Close' : _props$closeText; props.debug; var _props$defaultValue = props.defaultValue; _props$defaultValue === void 0 ? props.multiple ? [] : null : _props$defaultValue; var _props$disableClearab = props.disableClearable, disableClearable = _props$disableClearab === void 0 ? false : _props$disableClearab; props.disableCloseOnSelect; var _props$disabled = props.disabled, disabled = _props$disabled === void 0 ? false : _props$disabled; props.disabledItemsFocusable; props.disableListWrap; var _props$disablePortal = props.disablePortal, disablePortal = _props$disablePortal === void 0 ? false : _props$disablePortal; props.filterOptions; props.filterSelectedOptions; var _props$forcePopupIcon = props.forcePopupIcon, forcePopupIcon = _props$forcePopupIcon === void 0 ? 'auto' : _props$forcePopupIcon, _props$freeSolo = props.freeSolo, freeSolo = _props$freeSolo === void 0 ? false : _props$freeSolo, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth, _props$getLimitTagsTe = props.getLimitTagsText, getLimitTagsText = _props$getLimitTagsTe === void 0 ? function (more) { return "+".concat(more); } : _props$getLimitTagsTe; props.getOptionDisabled; var _props$getOptionLabel = props.getOptionLabel, getOptionLabel = _props$getOptionLabel === void 0 ? function (x) { return x; } : _props$getOptionLabel; props.getOptionSelected; var groupBy = props.groupBy, _props$handleHomeEndK = props.handleHomeEndKeys; _props$handleHomeEndK === void 0 ? !props.freeSolo : _props$handleHomeEndK; props.id; props.includeInputInList; props.inputValue; var _props$limitTags = props.limitTags, limitTags = _props$limitTags === void 0 ? -1 : _props$limitTags, _props$ListboxCompone = props.ListboxComponent, ListboxComponent = _props$ListboxCompone === void 0 ? 'ul' : _props$ListboxCompone, ListboxProps = props.ListboxProps, _props$loading = props.loading, loading = _props$loading === void 0 ? false : _props$loading, _props$loadingText = props.loadingText, loadingText = _props$loadingText === void 0 ? 'Loading…' : _props$loadingText, _props$multiple = props.multiple, multiple = _props$multiple === void 0 ? false : _props$multiple, _props$noOptionsText = props.noOptionsText, noOptionsText = _props$noOptionsText === void 0 ? 'No options' : _props$noOptionsText; props.onChange; props.onClose; props.onHighlightChange; props.onInputChange; props.onOpen; props.open; props.openOnFocus; var _props$openText = props.openText, openText = _props$openText === void 0 ? 'Open' : _props$openText; props.options; var _props$PaperComponent = props.PaperComponent, PaperComponent = _props$PaperComponent === void 0 ? Paper$1 : _props$PaperComponent, _props$PopperComponen = props.PopperComponent, PopperComponentProp = _props$PopperComponen === void 0 ? Popper : _props$PopperComponen, _props$popupIcon = props.popupIcon, popupIcon = _props$popupIcon === void 0 ? _ref2 : _props$popupIcon, renderGroupProp = props.renderGroup, renderInput = props.renderInput, renderOptionProp = props.renderOption, renderTags = props.renderTags, _props$selectOnFocus = props.selectOnFocus; _props$selectOnFocus === void 0 ? !props.freeSolo : _props$selectOnFocus; var _props$size = props.size, size = _props$size === void 0 ? 'medium' : _props$size; props.value; var other = _objectWithoutProperties(props, ["autoComplete", "autoHighlight", "autoSelect", "blurOnSelect", "ChipProps", "classes", "className", "clearOnBlur", "clearOnEscape", "clearText", "closeIcon", "closeText", "debug", "defaultValue", "disableClearable", "disableCloseOnSelect", "disabled", "disabledItemsFocusable", "disableListWrap", "disablePortal", "filterOptions", "filterSelectedOptions", "forcePopupIcon", "freeSolo", "fullWidth", "getLimitTagsText", "getOptionDisabled", "getOptionLabel", "getOptionSelected", "groupBy", "handleHomeEndKeys", "id", "includeInputInList", "inputValue", "limitTags", "ListboxComponent", "ListboxProps", "loading", "loadingText", "multiple", "noOptionsText", "onChange", "onClose", "onHighlightChange", "onInputChange", "onOpen", "open", "openOnFocus", "openText", "options", "PaperComponent", "PopperComponent", "popupIcon", "renderGroup", "renderInput", "renderOption", "renderTags", "selectOnFocus", "size", "value"]); var PopperComponent = disablePortal ? DisablePortal : PopperComponentProp; var _useAutocomplete = useAutocomplete(_extends({}, props, { componentName: 'Autocomplete' })), getRootProps = _useAutocomplete.getRootProps, getInputProps = _useAutocomplete.getInputProps, getInputLabelProps = _useAutocomplete.getInputLabelProps, getPopupIndicatorProps = _useAutocomplete.getPopupIndicatorProps, getClearProps = _useAutocomplete.getClearProps, getTagProps = _useAutocomplete.getTagProps, getListboxProps = _useAutocomplete.getListboxProps, getOptionProps = _useAutocomplete.getOptionProps, value = _useAutocomplete.value, dirty = _useAutocomplete.dirty, id = _useAutocomplete.id, popupOpen = _useAutocomplete.popupOpen, focused = _useAutocomplete.focused, focusedTag = _useAutocomplete.focusedTag, anchorEl = _useAutocomplete.anchorEl, setAnchorEl = _useAutocomplete.setAnchorEl, inputValue = _useAutocomplete.inputValue, groupedOptions = _useAutocomplete.groupedOptions; var startAdornment; if (multiple && value.length > 0) {
+    var getCustomizedTagProps = function getCustomizedTagProps(params) { return _extends({ className: clsx(classes.tag, size === 'small' && classes.tagSizeSmall), disabled: disabled }, getTagProps(params)); };
+    if (renderTags) {
+        startAdornment = renderTags(value, getCustomizedTagProps);
+    }
+    else {
+        startAdornment = value.map(function (option, index) { return /*#__PURE__*/ y$3(Chip$1, _extends({ label: getOptionLabel(option), size: size }, getCustomizedTagProps({ index: index }), ChipProps)); });
+    }
+} if (limitTags > -1 && Array.isArray(startAdornment)) {
+    var more = startAdornment.length - limitTags;
+    if (!focused && more > 0) {
+        startAdornment = startAdornment.splice(0, limitTags);
+        startAdornment.push(/*#__PURE__*/ y$3("span", { className: classes.tag, key: startAdornment.length }, getLimitTagsText(more)));
+    }
+} var defaultRenderGroup = function defaultRenderGroup(params) { return /*#__PURE__*/ y$3("li", { key: params.key }, /*#__PURE__*/ y$3(ListSubheader$1, { className: classes.groupLabel, component: "div" }, params.group), /*#__PURE__*/ y$3("ul", { className: classes.groupUl }, params.children)); }; var renderGroup = renderGroupProp || defaultRenderGroup; var renderOption = renderOptionProp || getOptionLabel; var renderListOption = function renderListOption(option, index) { var optionProps = getOptionProps({ option: option, index: index }); return /*#__PURE__*/ y$3("li", _extends({}, optionProps, { className: classes.option }), renderOption(option, { selected: optionProps['aria-selected'], inputValue: inputValue })); }; var hasClearIcon = !disableClearable && !disabled; var hasPopupIcon = (!freeSolo || forcePopupIcon === true) && forcePopupIcon !== false; return /*#__PURE__*/ y$3(g$5, null, /*#__PURE__*/ y$3("div", _extends({ ref: ref, className: clsx(classes.root, className, focused && classes.focused, fullWidth && classes.fullWidth, hasClearIcon && classes.hasClearIcon, hasPopupIcon && classes.hasPopupIcon) }, getRootProps(other)), renderInput({ id: id, disabled: disabled, fullWidth: true, size: size === 'small' ? 'small' : undefined, InputLabelProps: getInputLabelProps(), InputProps: { ref: setAnchorEl, className: classes.inputRoot, startAdornment: startAdornment, endAdornment: /*#__PURE__*/ y$3("div", { className: classes.endAdornment }, hasClearIcon ? /*#__PURE__*/ y$3(IconButton$1, _extends({}, getClearProps(), { "aria-label": clearText, title: clearText, className: clsx(classes.clearIndicator, dirty && classes.clearIndicatorDirty) }), closeIcon) : null, hasPopupIcon ? /*#__PURE__*/ y$3(IconButton$1, _extends({}, getPopupIndicatorProps(), { disabled: disabled, "aria-label": popupOpen ? closeText : openText, title: popupOpen ? closeText : openText, className: clsx(classes.popupIndicator, popupOpen && classes.popupIndicatorOpen) }), popupIcon) : null) }, inputProps: _extends({ className: clsx(classes.input, focusedTag === -1 && classes.inputFocused), disabled: disabled }, getInputProps()) })), popupOpen && anchorEl ? /*#__PURE__*/ y$3(PopperComponent, { className: clsx(classes.popper, disablePortal && classes.popperDisablePortal), style: { width: anchorEl ? anchorEl.clientWidth : null }, role: "presentation", anchorEl: anchorEl, open: true }, /*#__PURE__*/ y$3(PaperComponent, { className: classes.paper }, loading && groupedOptions.length === 0 ? /*#__PURE__*/ y$3("div", { className: classes.loading }, loadingText) : null, groupedOptions.length === 0 && !freeSolo && !loading ? /*#__PURE__*/ y$3("div", { className: classes.noOptions }, noOptionsText) : null, groupedOptions.length > 0 ? /*#__PURE__*/ y$3(ListboxComponent, _extends({ className: classes.listbox }, getListboxProps(), ListboxProps), groupedOptions.map(function (option, index) { if (groupBy) {
+    return renderGroup({ key: option.key, group: option.group, children: option.options.map(function (option2, index2) { return renderListOption(option2, option.index + index2); }) });
+} return renderListOption(option, index); })) : null)) : null); });
+var MuiAutocomplete = withStyles(styles, { name: 'MuiAutocomplete' })(Autocomplete$1);
+var AutocompleteTag = function AutocompleteTag(_a) { var children = _a.children, onDelete = _a.onDelete, props = __rest(_a, ["children", "onDelete"]); return /*#__PURE__*/ wn.createElement(Tag, Object.assign({}, props, { size: "sm" }), /*#__PURE__*/ wn.createElement(FlexBox, { gap: 0.5, alignItems: "center" }, children, onDelete && ( /*#__PURE__*/wn.createElement(IconButton$1, { size: "small", onClick: onDelete }, /*#__PURE__*/ wn.createElement(default_1$b, { fontSize: "inherit" }))))); };
+var Input = function Input(props) { return /*#__PURE__*/ wn.createElement(TextField$1, Object.assign({}, props, { variant: "outlined" })); };
+var useStyles$7 = makeStyles(function (theme) { return { autocomplete: { '& .MuiInputBase-root': { padding: theme.spacing(1), gap: theme.spacing(0.5) }, '& .MuiOutlinedInput-input.MuiAutocomplete-input': { padding: 0, height: 24, '&::placeholder': { color: theme.styleConfig.inputs.placeholderColor, opacity: 1 } }, '& .MuiOutlinedInput-notchedOutline': { border: '1px solid', borderRadius: theme.styleConfig.inputs.borderRadius, borderColor: theme.styleConfig.inputs.borderColor }, '&:hover .MuiOutlinedInput-notchedOutline, &.Mui-focused .MuiOutlinedInput-notchedOutline': { borderWidth: 1, borderColor: theme.styleConfig.inputs.borderColor }, '& .MuiAutocomplete-endAdornment .MuiIconButton-root': { fontSize: 20 } } }; });
+var defaultGetOptionLabel = function defaultGetOptionLabel(item) { return item; };
+var Autocomplete = function Autocomplete(_ref66) { var caption = _ref66.caption, fullWidth = _ref66.fullWidth, _ref66$getOptionLabel = _ref66.getOptionLabel, getOptionLabel = _ref66$getOptionLabel === void 0 ? defaultGetOptionLabel : _ref66$getOptionLabel, id = _ref66.id, label = _ref66.label, _onChange = _ref66.onChange, placeholder = _ref66.placeholder, required = _ref66.required, selectItems = _ref66.selectItems, value = _ref66.value; var selectId = useShortId(id); var _h49 = h$4(false), _h50 = _slicedToArray2(_h49, 2), isOpen = _h50[0], setIsOpen = _h50[1]; var autocompleteClasses = useStyles$7(); var selectClasses = useStyles$b(); return /*#__PURE__*/ wn.createElement("div", { className: C(selectClasses.selectContainer, _defineProperty2({}, selectClasses.fullWidth, fullWidth)) }, label && ( /*#__PURE__*/wn.createElement(Label, { htmlFor: selectId, required: required }, label)), /*#__PURE__*/ wn.createElement(MuiAutocomplete, { popupIcon: /*#__PURE__*/ wn.createElement(default_1$3, null), className: autocompleteClasses.autocomplete, fullWidth: true, id: selectId, multiple: true, onChange: function onChange(_, value) { _onChange === null || _onChange === void 0 ? void 0 : _onChange(value); }, onClose: function onClose() { return setIsOpen(false); }, onOpen: function onOpen() { return setIsOpen(true); }, open: isOpen, value: value, options: selectItems, getOptionLabel: getOptionLabel, renderOption: function renderOption(option, state) { return /*#__PURE__*/ wn.createElement(FlexBox, { gap: 0.5, alignItems: "center" }, /*#__PURE__*/ wn.createElement(default_1$5, { fontSize: "small", style: { visibility: state.selected ? 'visible' : 'hidden' }, "aria-visibility": state.selected }), getOptionLabel(option)); }, renderInput: function renderInput(params) { return /*#__PURE__*/ wn.createElement(Input, Object.assign({}, params, { placeholder: placeholder })); }, renderTags: function renderTags(value, getTagProps) { return value.map(function (option, index) { return /*#__PURE__*/ wn.createElement(AutocompleteTag, Object.assign({}, getTagProps({ index: index })), getOptionLabel(option)); }); } }), caption && /*#__PURE__*/ wn.createElement(Typography$2, { variant: "body2" }, caption)); };
+var ArrowRight = {};
 var _interopRequireDefault$1 = interopRequireDefaultExports;
 var _interopRequireWildcard$1 = interopRequireWildcardExports;
-Object.defineProperty(ChevronRight, "__esModule", { value: true });
-var default_1$1 = ChevronRight["default"] = void 0;
+Object.defineProperty(ArrowRight, "__esModule", { value: true });
+var default_1$1 = ArrowRight["default"] = void 0;
 var React$1 = _interopRequireWildcard$1(require$$2);
 var _createSvgIcon$1 = _interopRequireDefault$1(requireCreateSvgIcon());
-var _default$1 = (0, _createSvgIcon$1["default"])(/*#__PURE__*/ React$1.createElement("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }), 'ChevronRight');
-default_1$1 = ChevronRight["default"] = _default$1;
+var _default$1 = (0, _createSvgIcon$1["default"])(/*#__PURE__*/ React$1.createElement("path", { d: "M10 17l5-5-5-5v10z" }), 'ArrowRight');
+default_1$1 = ArrowRight["default"] = _default$1;
 var TABLE_CONTAINER_ID = 'table-container';
 var EXPANDED_CONTENT_CLASSNAME = 'expanded-content';
 var leftAlignExpandedContent = function leftAlignExpandedContent(containerId) { var container = document.getElementById(containerId); var expandedContentDivs = document.querySelectorAll("#".concat(containerId, " .").concat(EXPANDED_CONTENT_CLASSNAME)); expandedContentDivs.forEach(function (expandedContent) { expandedContent.style.marginLeft = (container === null || container === void 0 ? void 0 : container.scrollLeft) + 'px'; }); };
-var makeTableStyles = makeStylesFactory(function (theme) { return { tableCell: { padding: theme.spacing(0.5, 1), minWidth: 80 }, tableHeader: {}, tableWithExpandedContent: { '& tr td:nth-child(2), & tr th:nth-child(2)': { paddingLeft: theme.spacing(0) } }, tableWithActions: { width: 'calc(100% - 2px)' }, tableActionsCell: { position: 'sticky', right: 0, width: '1%' }, tableHeaderActionsCell: {}, cellWithExpandedContent: { borderBottom: 'none' }, expandMoreCell: { padding: theme.spacing(0, 0, 0, 1), width: theme.spacing(4.5), minWidth: 'unset' }, openChevron: { transform: 'rotate(90deg)' }, expandedRow: {}, expandedContentCell: { padding: 0 }, expandedContentContainer: { padding: theme.spacing(0.5, 2, 1) }, clickable: { cursor: 'pointer' } }; });
+var makeTableStyles = makeStylesFactory(function (theme) { return { tableCell: { padding: theme.spacing(0.5, 1), minWidth: 80 }, tableHeader: {}, tableWithExpandedContent: { '& tr td:nth-child(2), & tr th:nth-child(2)': { paddingLeft: theme.spacing(0) } }, tableWithActions: { width: 'calc(100% - 2px)' }, tableActionsCell: { position: 'sticky', right: 0, width: '1%' }, tableHeaderActionsCell: {}, cellWithExpandedContent: { borderBottom: 'none' }, expandMoreCell: { padding: theme.spacing(0, 0, 0, 1), width: theme.spacing(4.5), minWidth: 'unset' }, openChevron: { transform: 'rotate(90deg)' }, expandedRow: {}, expandedContentCell: { padding: 0 }, expandedContentContainer: { padding: theme.spacing(0.5, 2, 1) }, clickable: { cursor: 'pointer' }, tableRow: {} }; });
 var TableCell = function TableCell(_a) { var children = _a.children, className = _a.className, classes = _a.classes, Typography = _a.TypographyComponent, props = __rest(_a, ["children", "className", "classes", "TypographyComponent"]); var value = getTableCellValue(children); return /*#__PURE__*/ wn.createElement(MUITableCell, Object.assign({ className: C(classes.tableCell, className) }, props), typeof value === 'string' ? /*#__PURE__*/ wn.createElement(Typography, null, value) : children); };
-var TableRow = function TableRow(_ref65) { var id = _ref65.id, ExpandedContent = _ref65.ExpandedContent, item = _ref65.item, itemRenderer = _ref65.itemRenderer, onRowClick = _ref65.onRowClick, tableWidth = _ref65.tableWidth, tableContainerId = _ref65.tableContainerId, getItemActionProps = _ref65.getItemActionProps, classes = _ref65.classes, TableActions = _ref65.TableActionsComponent, Typography = _ref65.TypographyComponent; var _h49 = h$4(false), _h50 = _slicedToArray2(_h49, 2), open = _h50[0], setOpen = _h50[1]; p$3(function () { if (open) {
+var TableRow = function TableRow(_ref67) { var id = _ref67.id, ExpandedContent = _ref67.ExpandedContent, item = _ref67.item, itemRenderer = _ref67.itemRenderer, onRowClick = _ref67.onRowClick, tableWidth = _ref67.tableWidth, tableContainerId = _ref67.tableContainerId, getItemActionProps = _ref67.getItemActionProps, classes = _ref67.classes, TableActions = _ref67.TableActionsComponent, Typography = _ref67.TypographyComponent; var _h51 = h$4(false), _h52 = _slicedToArray2(_h51, 2), open = _h52[0], setOpen = _h52[1]; p$3(function () { if (open) {
     leftAlignExpandedContent(tableContainerId);
 } }, [open, tableContainerId]); var toggleOpen = function toggleOpen(e) { e.stopPropagation(); setOpen(function (prev) { return !prev; }); }; var handleRowClick = function handleRowClick(e) { if (onRowClick) {
     onRowClick(id);
 }
 else if (ExpandedContent) {
     toggleOpen(e);
-} }; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(MUITableRow, { className: C(_defineProperty2(_defineProperty2({}, classes.expandedRow, open), classes.clickable, !!onRowClick)), onClick: handleRowClick, style: { width: 'fit-content' } }, ExpandedContent && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.expandMoreCell, _defineProperty2({}, classes.cellWithExpandedContent, !!ExpandedContent)), classes: classes }, /*#__PURE__*/ wn.createElement(IconButton$1, { "aria-label": "expand row", onClick: toggleOpen, size: "small" }, /*#__PURE__*/ wn.createElement(default_1$1, { className: open ? classes.openChevron : '' })))), itemRenderer.map(function (column) { return /*#__PURE__*/ wn.createElement(TableCell, { TypographyComponent: Typography, className: C(_defineProperty2({}, classes.cellWithExpandedContent, !!ExpandedContent)), classes: classes, key: "row-".concat(id, "-col-").concat(String(column.title)) }, column.getValue(item)); }), getItemActionProps && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.tableCell, classes.tableActionsCell), classes: classes }, /*#__PURE__*/ wn.createElement(TableActions, Object.assign({}, getItemActionProps(item)))))), ExpandedContent && ( /*#__PURE__*/wn.createElement(MUITableRow, null, /*#__PURE__*/ wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.expandedRow, classes.expandedContentCell), classes: classes, colSpan: itemRenderer.length + 1 }, /*#__PURE__*/ wn.createElement(Collapse$1, { "in": open, timeout: "auto", unmountOnExit: true }, /*#__PURE__*/ wn.createElement("div", { className: "".concat(EXPANDED_CONTENT_CLASSNAME, " ").concat(classes.expandedContentContainer), style: { width: tableWidth } }, /*#__PURE__*/ wn.createElement(ExpandedContent, { data: item }))))))); };
-var TableCore = function TableCore(_ref66) { var ExpandedContent = _ref66.ExpandedContent, itemRenderer = _ref66.itemRenderer, items = _ref66.items, rowKeyExtractor = _ref66.rowKeyExtractor, onRowClick = _ref66.onRowClick, getItemActionProps = _ref66.getItemActionProps, classes = _ref66.classes, TableActions = _ref66.TableActionsComponent, Typography = _ref66.TypographyComponent; var containerId = useShortId(TABLE_CONTAINER_ID); var _h51 = h$4(), _h52 = _slicedToArray2(_h51, 2), tableWidth = _h52[0], setTableWidth = _h52[1]; p$3(function () { var _a; var container = document.getElementById(containerId); var originalTableWidth = (_a = document.querySelector("#".concat(containerId, " thead"))) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width; function handleScroll() { if (!originalTableWidth || !container)
+} }; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(MUITableRow, { className: C(_defineProperty2(_defineProperty2({}, classes.expandedRow, open), classes.clickable, !!onRowClick), classes.tableRow), onClick: handleRowClick, style: { width: 'fit-content' } }, ExpandedContent && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.expandMoreCell, _defineProperty2({}, classes.cellWithExpandedContent, !!ExpandedContent)), classes: classes }, /*#__PURE__*/ wn.createElement(IconButton$1, { "aria-label": "expand row", onClick: toggleOpen, size: "small" }, ExpandedContent && /*#__PURE__*/ wn.createElement(default_1$1, { className: open ? classes.openChevron : undefined })))), itemRenderer.map(function (column) { return /*#__PURE__*/ wn.createElement(TableCell, { TypographyComponent: Typography, className: C(_defineProperty2({}, classes.cellWithExpandedContent, !!ExpandedContent)), classes: classes, key: "row-".concat(id, "-col-").concat(String(column.title)) }, column.getValue(item)); }), getItemActionProps && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.tableCell, classes.tableActionsCell), classes: classes }, /*#__PURE__*/ wn.createElement(TableActions, Object.assign({}, getItemActionProps(item)))))), ExpandedContent && ( /*#__PURE__*/wn.createElement(MUITableRow, null, /*#__PURE__*/ wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.expandedRow, classes.expandedContentCell), classes: classes, colSpan: itemRenderer.length + 1 }, /*#__PURE__*/ wn.createElement(Collapse$1, { "in": open, timeout: "auto", unmountOnExit: true }, /*#__PURE__*/ wn.createElement("div", { className: "".concat(EXPANDED_CONTENT_CLASSNAME, " ").concat(classes.expandedContentContainer), style: { width: tableWidth } }, /*#__PURE__*/ wn.createElement(ExpandedContent, { data: item }))))))); };
+var TableCore = function TableCore(_ref68) { var ExpandedContent = _ref68.ExpandedContent, itemRenderer = _ref68.itemRenderer, items = _ref68.items, rowKeyExtractor = _ref68.rowKeyExtractor, onRowClick = _ref68.onRowClick, getItemActionProps = _ref68.getItemActionProps, classes = _ref68.classes, TableActions = _ref68.TableActionsComponent, Typography = _ref68.TypographyComponent, disableBottomBorder = _ref68.disableBottomBorder; var containerId = useShortId(TABLE_CONTAINER_ID); var _h53 = h$4(), _h54 = _slicedToArray2(_h53, 2), setTableWidth = _h54[1]; p$3(function () { var _a; var container = document.getElementById(containerId); var originalTableWidth = (_a = document.querySelector("#".concat(containerId, " thead"))) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width; function handleScroll() { if (!originalTableWidth || !container)
     return; var tableWidth = container.getBoundingClientRect().width; if (originalTableWidth - container.scrollLeft + 16 >= tableWidth) {
     leftAlignExpandedContent(containerId);
-} } function handleResize() { var _a; setTableWidth((_a = container === null || container === void 0 ? void 0 : container.getBoundingClientRect().width) !== null && _a !== void 0 ? _a : 0); handleScroll(); } handleResize(); window.addEventListener('resize', handleResize); container === null || container === void 0 ? void 0 : container.addEventListener('scroll', handleScroll); return function () { container === null || container === void 0 ? void 0 : container.removeEventListener('scroll', handleScroll); window.removeEventListener('resize', handleResize); }; }, [containerId]); validateRowKey(items, rowKeyExtractor); return /*#__PURE__*/ wn.createElement(TableContainer$1, { id: containerId }, /*#__PURE__*/ wn.createElement(MUITable, { className: C(_defineProperty2(_defineProperty2({}, classes.tableWithExpandedContent, !!ExpandedContent), classes.tableWithActions, !!getItemActionProps)) }, /*#__PURE__*/ wn.createElement(TableHead$1, null, /*#__PURE__*/ wn.createElement(MUITableRow, null, ExpandedContent && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.expandMoreCell, classes.tableHeader), classes: classes }, /*#__PURE__*/ wn.createElement(wn.Fragment, null))), itemRenderer.map(function (column) { return /*#__PURE__*/ wn.createElement(TableCell, { TypographyComponent: Typography, className: classes.tableHeader, classes: classes, key: "col-header-".concat(String(column.title)) }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, column.title)); }), getItemActionProps && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.tableCell, classes.tableActionsCell, classes.tableHeader, classes.tableHeaderActionsCell), classes: classes }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, TABLE_ACTIONS_HEADER))))), /*#__PURE__*/ wn.createElement(TableBody$1, null, items.map(function (item) { var id = rowKeyExtractor ? rowKeyExtractor(item) : item.id; return /*#__PURE__*/ wn.createElement(TableRow, { ExpandedContent: ExpandedContent, TableActionsComponent: TableActions, TypographyComponent: Typography, classes: classes, getItemActionProps: getItemActionProps, id: id, item: item, itemRenderer: itemRenderer, key: id, onRowClick: onRowClick, tableContainerId: containerId, tableWidth: tableWidth }); })))); };
-var useStyles$3 = makeTableStyles(function (theme) { return { tableCell: { borderBottomColor: theme.styleConfig.colors.subtle, color: theme.styleConfig.colors.primary }, tableActionsCell: { minWidth: 0 }, tableHeaderActionsCell: { '& > *': { position: 'absolute', left: -10000, top: 'auto', width: 1, height: 1, overflow: 'hidden' } } }; });
-var Table = function Table(props) { var classes = useStyles$3(); return /*#__PURE__*/ wn.createElement(TableCore, Object.assign({}, props, { TableActionsComponent: TableActions, TypographyComponent: Typography, classes: classes })); };
-var TagList = function TagList(_ref67) { var tags = _ref67.tags; return /*#__PURE__*/ wn.createElement("ul", { style: { listStyle: 'none', padding: 0, margin: 0, display: 'flex', gap: 8 } }, tags.map(function (tag) { return /*#__PURE__*/ wn.createElement("li", { key: tag }, /*#__PURE__*/ wn.createElement(Tag, null, tag)); })); };
-var RoleAssignmentsSectionBody = function RoleAssignmentsSectionBody(_ref68) { var connection = _ref68.connection, localState = _ref68.localState, setLocalState = _ref68.setLocalState, remoteState = _ref68.remoteState; var _a, _b, _c; var _useSettingsContainer3 = useSettingsContainer(), editing = _useSettingsContainer3.editing; var _ref69 = editing ? localState : remoteState, connectionRoleIds = _ref69.connectionRoleIds, groupedRoles = _ref69.groupedRoles; var hasGroupAttributeMapping = !!((_a = connection.attribute_mapping) === null || _a === void 0 ? void 0 : _a.groups); var roles = (_b = useB2BInternals().bootstrap.getSync().rbacPolicy) === null || _b === void 0 ? void 0 : _b.roles; var rolesSelectItems = (_c = roles === null || roles === void 0 ? void 0 : roles.map(function (_ref70) { var role_id = _ref70.role_id; return { label: role_id, value: role_id }; })) !== null && _c !== void 0 ? _c : []; var handleAddGroupRole = T$2(function () { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { groupedRoles: [].concat(_toConsumableArray2(state.groupedRoles), [{ group: '', roleIds: [] }]) }); }); }, [setLocalState]); var handleConnectionRolesChange = T$2(function (value) { return setLocalState(function (state) { return Object.assign(Object.assign({}, state), { connectionRoleIds: value }); }); }, [setLocalState]); var _getIdpInfo = getIdpInfo(connection.identity_provider, 'saml'), idp = _getIdpInfo.idp; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Connection Roles", tooltipText: "Connection Roles are automatically assigned to all Members who authenticate via this SSO connection." }, editing ? ( /*#__PURE__*/wn.createElement(Select, { selectItems: rolesSelectItems, multiple: true, value: connectionRoleIds, onChange: handleConnectionRolesChange })) : connection.saml_connection_implicit_role_assignments.length > 0 ? ( /*#__PURE__*/wn.createElement(TagList, { tags: connection.saml_connection_implicit_role_assignments.map(function (_ref71) { var role_id = _ref71.role_id; return role_id; }) })) : ( /*#__PURE__*/wn.createElement(Typography, null, "No roles assigned."))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Group Roles", tooltipText: "If a Member is part of a group, they will be assigned both the Connection Role and their Group Role." }, hasGroupAttributeMapping ? editing ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, groupedRoles.map(function (_ref72, i) { var group = _ref72.group, roleIds = _ref72.roleIds; return /*#__PURE__*/ wn.createElement(FlexBox, { key: i, alignItems: "stretch", justifyContent: "space-between" }, /*#__PURE__*/ wn.createElement(Input, { label: "Group name", fullWidth: true, value: group, onChange: function onChange(value) { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { groupedRoles: state.groupedRoles.map(function (item, index) { return index === i ? Object.assign(Object.assign({}, item), { group: value }) : item; }) }); }); } }), /*#__PURE__*/ wn.createElement(Select, { label: "Group Role", multiple: true, selectItems: rolesSelectItems, value: roleIds, fullWidth: true, onChange: function onChange(values) { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { groupedRoles: state.groupedRoles.map(function (item, index) { return index === i ? Object.assign(Object.assign({}, item), { roleIds: values }) : item; }) }); }); } })); }), /*#__PURE__*/ wn.createElement(Button, { variant: "text", startIcon: /*#__PURE__*/ wn.createElement(Add, null), onClick: handleAddGroupRole }, "Add group roles"))) : groupedRoles.length > 0 ? ( /*#__PURE__*/wn.createElement(Table, { items: groupedRoles, rowKeyExtractor: roleAssignmentKeyExtractor, itemRenderer: roleAssignmentItemRenderer })) : ( /*#__PURE__*/wn.createElement(Typography, null, "No roles assigned.")) : ( /*#__PURE__*/wn.createElement(Typography, null, "Add a \"groups\" key in the ", idp.attributeMappingLabel, " first to assign group roles.")))); };
-var roleAssignmentKeyExtractor = function roleAssignmentKeyExtractor(_ref73) { var group = _ref73.group; return group; };
-var roleAssignmentItemRenderer = [{ title: 'Group', getValue: function getValue(_ref74) { var group = _ref74.group; return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, group); } }, { title: 'Role', getValue: function getValue(_ref75) { var roleIds = _ref75.roleIds; return /*#__PURE__*/ wn.createElement(TagList, { tags: roleIds }); } }];
-var RoleAssignmentsSection = function RoleAssignmentsSection(_ref76) { var canUpdateConnection = _ref76.canUpdateConnection, connection = _ref76.connection; var connectionRoleIds = F$3(function () { return connection.saml_connection_implicit_role_assignments.map(function (_ref77) { var role_id = _ref77.role_id; return role_id; }); }, [connection.saml_connection_implicit_role_assignments]); var groupedRoles = F$3(function () { return Object.values(connection.saml_group_implicit_role_assignments.reduce(function (acc, _ref78) { var group = _ref78.group, role_id = _ref78.role_id; if (!acc[group]) {
+} } function handleResize() { var _a; setTableWidth((_a = container === null || container === void 0 ? void 0 : container.getBoundingClientRect().width) !== null && _a !== void 0 ? _a : 0); handleScroll(); } handleResize(); window.addEventListener('resize', handleResize); container === null || container === void 0 ? void 0 : container.addEventListener('scroll', handleScroll); return function () { container === null || container === void 0 ? void 0 : container.removeEventListener('scroll', handleScroll); window.removeEventListener('resize', handleResize); }; }, [containerId]); validateRowKey(items, rowKeyExtractor); return /*#__PURE__*/ wn.createElement(TableContainer$1, { id: containerId }, /*#__PURE__*/ wn.createElement(MUITable, { className: C(_defineProperty2(_defineProperty2({}, classes.tableWithExpandedContent, !!ExpandedContent), classes.tableWithActions, !!getItemActionProps)) }, /*#__PURE__*/ wn.createElement(TableHead$1, null, /*#__PURE__*/ wn.createElement(MUITableRow, null, ExpandedContent && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.expandMoreCell, classes.tableHeader), classes: classes }, /*#__PURE__*/ wn.createElement(wn.Fragment, null))), itemRenderer.map(function (column) { return /*#__PURE__*/ wn.createElement(TableCell, { TypographyComponent: Typography, className: classes.tableHeader, classes: classes, key: "col-header-".concat(String(column.title)) }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, column.title)); }), getItemActionProps && ( /*#__PURE__*/wn.createElement(TableCell, { TypographyComponent: Typography, className: C(classes.tableCell, classes.tableActionsCell, classes.tableHeader, classes.tableHeaderActionsCell), classes: classes }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, TABLE_ACTIONS_HEADER))))), /*#__PURE__*/ wn.createElement(TableBody$1, null, items.map(function (item) { var id = rowKeyExtractor ? rowKeyExtractor(item) : item.id; return /*#__PURE__*/ wn.createElement(TableRow, { ExpandedContent: ExpandedContent, TableActionsComponent: TableActions, TypographyComponent: Typography, classes: classes, getItemActionProps: getItemActionProps, id: id, item: item, itemRenderer: itemRenderer, key: id, onRowClick: onRowClick, tableContainerId: containerId, disableBottomBorder: disableBottomBorder }); })))); };
+var useStyles$6 = makeTableStyles(function (theme) { return { tableCell: { borderBottomColor: theme.styleConfig.colors.subtle, color: theme.styleConfig.colors.primary }, tableActionsCell: { minWidth: 0 }, tableHeaderActionsCell: { '& > *': { position: 'absolute', left: -10000, top: 'auto', width: 1, height: 1, overflow: 'hidden' } }, tableRow: function tableRow(_ref69) { var disableBottomBorder = _ref69.disableBottomBorder; return disableBottomBorder ? { '&:last-child th, &:last-child td': { borderBottom: 0 } } : {}; }, expandMoreCell: { padding: 0, width: theme.spacing(2) }, expandedContentContainer: { padding: theme.spacing(1, 2, 1, 2) } }; });
+var Table = function Table(props) { var classes = useStyles$6(props); return /*#__PURE__*/ wn.createElement(TableCore, Object.assign({}, props, { TableActionsComponent: TableActions, TypographyComponent: Typography, classes: classes })); };
+var TagList = function TagList(_ref70) { var tags = _ref70.tags; return /*#__PURE__*/ wn.createElement("ul", { style: { listStyle: 'none', padding: 0, margin: 0, display: 'flex', gap: 8 } }, tags.map(function (tag) { return /*#__PURE__*/ wn.createElement("li", { key: tag }, /*#__PURE__*/ wn.createElement(Tag, null, tag)); })); };
+var RoleAssignmentsSectionBody = function RoleAssignmentsSectionBody(_ref71) { var connection = _ref71.connection, localState = _ref71.localState, setLocalState = _ref71.setLocalState, remoteState = _ref71.remoteState; var _a, _b; var _useSettingsContainer3 = useSettingsContainer(), editing = _useSettingsContainer3.editing; var _ref72 = editing ? localState : remoteState, connectionRoleIds = _ref72.connectionRoleIds, groupedRoles = _ref72.groupedRoles; var hasGroupAttributeMapping = !!((_a = connection.attribute_mapping) === null || _a === void 0 ? void 0 : _a.groups); var roles = (_b = useB2BInternals().bootstrap.getSync().rbacPolicy) === null || _b === void 0 ? void 0 : _b.roles; var rolesSelectItems = F$3(function () { var _a; return (_a = roles === null || roles === void 0 ? void 0 : roles.map(function (_ref73) { var role_id = _ref73.role_id; return role_id; })) !== null && _a !== void 0 ? _a : []; }, [roles]); var handleAddGroupRole = T$2(function () { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { groupedRoles: [].concat(_toConsumableArray2(state.groupedRoles), [{ group: '', roleIds: [] }]) }); }); }, [setLocalState]); var handleConnectionRolesChange = T$2(function (value) { return setLocalState(function (state) { return Object.assign(Object.assign({}, state), { connectionRoleIds: value }); }); }, [setLocalState]); var _getIdpInfo = getIdpInfo(connection.identity_provider, 'saml'), idp = _getIdpInfo.idp; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Connection Roles", tooltipText: "Connection Roles are automatically assigned to all Members who authenticate via this SSO connection." }, editing ? ( /*#__PURE__*/wn.createElement(Autocomplete, { selectItems: rolesSelectItems, value: connectionRoleIds, onChange: handleConnectionRolesChange })) : connection.saml_connection_implicit_role_assignments.length > 0 ? ( /*#__PURE__*/wn.createElement(TagList, { tags: connection.saml_connection_implicit_role_assignments.map(function (_ref74) { var role_id = _ref74.role_id; return role_id; }) })) : ( /*#__PURE__*/wn.createElement(Typography, null, "No roles assigned."))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Group Roles", tooltipText: "If a Member is part of a group, they will be assigned both the Connection Role and their Group Role." }, hasGroupAttributeMapping ? editing ? ( /*#__PURE__*/wn.createElement(wn.Fragment, null, groupedRoles.map(function (_ref75, i) { var group = _ref75.group, roleIds = _ref75.roleIds; return /*#__PURE__*/ wn.createElement(FlexBox, { key: i, alignItems: "stretch", justifyContent: "space-between" }, /*#__PURE__*/ wn.createElement(Input$1, { label: "Group name", fullWidth: true, value: group, onChange: function onChange(value) { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { groupedRoles: state.groupedRoles.map(function (item, index) { return index === i ? Object.assign(Object.assign({}, item), { group: value }) : item; }) }); }); } }), /*#__PURE__*/ wn.createElement(Autocomplete, { label: "Group Role", selectItems: rolesSelectItems, value: roleIds, fullWidth: true, onChange: function onChange(values) { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { groupedRoles: state.groupedRoles.map(function (item, index) { return index === i ? Object.assign(Object.assign({}, item), { roleIds: values }) : item; }) }); }); } })); }), /*#__PURE__*/ wn.createElement(Button, { variant: "text", startIcon: /*#__PURE__*/ wn.createElement(Add, null), onClick: handleAddGroupRole }, "Add group roles"))) : groupedRoles.length > 0 ? ( /*#__PURE__*/wn.createElement(Table, { items: groupedRoles, rowKeyExtractor: roleAssignmentKeyExtractor, itemRenderer: roleAssignmentItemRenderer })) : ( /*#__PURE__*/wn.createElement(Typography, null, "No roles assigned.")) : ( /*#__PURE__*/wn.createElement(Typography, null, "Add a \"groups\" key in the ", idp.attributeMappingLabel, " first to assign group roles.")))); };
+var roleAssignmentKeyExtractor = function roleAssignmentKeyExtractor(_ref76) { var group = _ref76.group; return group; };
+var roleAssignmentItemRenderer = [{ title: 'Group', getValue: function getValue(_ref77) { var group = _ref77.group; return /*#__PURE__*/ wn.createElement(Typography, { color: "secondary" }, group); } }, { title: 'Role', getValue: function getValue(_ref78) { var roleIds = _ref78.roleIds; return /*#__PURE__*/ wn.createElement(TagList, { tags: roleIds }); } }];
+var RoleAssignmentsSection = function RoleAssignmentsSection(_ref79) { var canUpdateConnection = _ref79.canUpdateConnection, connection = _ref79.connection; var connectionRoleIds = F$3(function () { return connection.saml_connection_implicit_role_assignments.map(function (_ref80) { var role_id = _ref80.role_id; return role_id; }); }, [connection.saml_connection_implicit_role_assignments]); var groupedRoles = F$3(function () { return Object.values(connection.saml_group_implicit_role_assignments.reduce(function (acc, _ref81) { var group = _ref81.group, role_id = _ref81.role_id; if (!acc[group]) {
     acc[group] = { group: group, roleIds: [] };
 } acc[group].roleIds.push(role_id); return acc; }, {})); }, [connection.saml_group_implicit_role_assignments]); var remoteState = F$3(function () { return { connectionRoleIds: connectionRoleIds, groupedRoles: groupedRoles }; }, [connectionRoleIds, groupedRoles]); var _useFormState3 = useFormState({ remoteState: remoteState }), localState = _useFormState3.localState, setLocalState = _useFormState3.setLocalState, editing = _useFormState3.editing, handleSetEditing = _useFormState3.handleSetEditing; var _useMutateSamlConnect = useMutateSamlConnection(), mutate = _useMutateSamlConnect.mutate; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee12() { var baseOptions, mutatedProperties, filteredGroupRoles; return _regeneratorRuntime().wrap(function _callee12$(_context13) { while (1)
     switch (_context13.prev = _context13.next) {
@@ -9250,9 +9819,9 @@ var RoleAssignmentsSection = function RoleAssignmentsSection(_ref76) { var canUp
             if (!deepEqual(remoteState.connectionRoleIds, localState.connectionRoleIds)) {
                 mutatedProperties.saml_connection_implicit_role_assignments = localState.connectionRoleIds.map(function (role_id) { return { role_id: role_id }; });
             }
-            filteredGroupRoles = localState.groupedRoles.filter(function (_ref79) { var group = _ref79.group, roleIds = _ref79.roleIds; return group && roleIds.length > 0; });
+            filteredGroupRoles = localState.groupedRoles.filter(function (_ref82) { var group = _ref82.group, roleIds = _ref82.roleIds; return group && roleIds.length > 0; });
             if (!deepEqual(remoteState.groupedRoles, filteredGroupRoles)) {
-                mutatedProperties.saml_group_implicit_role_assignments = filteredGroupRoles.flatMap(function (_ref80) { var group = _ref80.group, roleIds = _ref80.roleIds; return roleIds.map(function (role_id) { return { group: group, role_id: role_id }; }); });
+                mutatedProperties.saml_group_implicit_role_assignments = filteredGroupRoles.flatMap(function (_ref83) { var group = _ref83.group, roleIds = _ref83.roleIds; return roleIds.map(function (role_id) { return { group: group, role_id: role_id }; }); });
             }
             if (!(Object.keys(mutatedProperties).length > 0)) {
                 _context13.next = 7;
@@ -9263,9 +9832,9 @@ var RoleAssignmentsSection = function RoleAssignmentsSection(_ref76) { var canUp
         case 8:
         case "end": return _context13.stop();
     } }, _callee12); })); }, [connection.connection_id, localState.connectionRoleIds, localState.groupedRoles, mutate, remoteState.connectionRoleIds, remoteState.groupedRoles]); var _useSsoRouterControll3 = useSsoRouterController(), useBlockNavigation = _useSsoRouterControll3.useBlockNavigation; return /*#__PURE__*/ wn.createElement(SettingsContainer, { title: "Role assignments", hasCTA: canUpdateConnection, onSave: handleSave, useBlockNavigation: useBlockNavigation, editing: editing, setEditing: handleSetEditing }, /*#__PURE__*/ wn.createElement(RoleAssignmentsSectionBody, { connection: connection, localState: localState, remoteState: remoteState, setLocalState: setLocalState })); };
-var SSOConnectionDetailsScreen = function SSOConnectionDetailsScreen(_ref81) { var connectionId = _ref81.connectionId; var _a, _b; var _useSsoRouterControll4 = useSsoRouterController(), navigate = _useSsoRouterControll4.navigate; var _useRbac5 = useRbac('stytch.sso', 'delete'), canDeleteConnection = _useRbac5.data; var _useRbac6 = useRbac('stytch.sso', 'update'), canUpdateConnection = _useRbac6.data; var _useSsoConnections = useSsoConnections(), connections = _useSsoConnections.data, isLoading = _useSsoConnections.isLoading; var _useOrgInfo2 = useOrgInfo(), orgInfo = _useOrgInfo2.data; var defaultConnectionId = orgInfo === null || orgInfo === void 0 ? void 0 : orgInfo.sso_default_connection_id; var defaultConnectionName = F$3(function () { var _a; return connections ? (_a = [].concat(_toConsumableArray2(connections.oidc_connections), _toConsumableArray2(connections.saml_connections)).find(function (connection) { return connection.connection_id === defaultConnectionId; })) === null || _a === void 0 ? void 0 : _a.display_name : undefined; }, [connections, defaultConnectionId]); var connection = F$3(function () { var _a, _b; var oidcMatch = (_a = connections === null || connections === void 0 ? void 0 : connections.oidc_connections) === null || _a === void 0 ? void 0 : _a.find(function (_ref82) { var connection_id = _ref82.connection_id; return connection_id === connectionId; }); if (oidcMatch) {
+var SSOConnectionDetailsScreen = function SSOConnectionDetailsScreen(_ref84) { var connectionId = _ref84.connectionId; var _a, _b; var _useSsoRouterControll4 = useSsoRouterController(), navigate = _useSsoRouterControll4.navigate; var _useRbac5 = useRbac('stytch.sso', 'get'), canGetConnection = _useRbac5.data; var _useRbac6 = useRbac('stytch.sso', 'delete'), canDeleteConnection = _useRbac6.data; var _useRbac7 = useRbac('stytch.sso', 'update'), canUpdateConnection = _useRbac7.data; var _useSsoConnections = useSsoConnections(!!canGetConnection), connections = _useSsoConnections.data, isLoading = _useSsoConnections.isLoading; var _useOrgInfo2 = useOrgInfo(), orgInfo = _useOrgInfo2.data; var defaultConnectionId = orgInfo === null || orgInfo === void 0 ? void 0 : orgInfo.sso_default_connection_id; var defaultConnectionName = F$3(function () { var _a; return connections ? (_a = [].concat(_toConsumableArray2(connections.oidc_connections), _toConsumableArray2(connections.saml_connections)).find(function (connection) { return connection.connection_id === defaultConnectionId; })) === null || _a === void 0 ? void 0 : _a.display_name : undefined; }, [connections, defaultConnectionId]); var connection = F$3(function () { var _a, _b; var oidcMatch = (_a = connections === null || connections === void 0 ? void 0 : connections.oidc_connections) === null || _a === void 0 ? void 0 : _a.find(function (_ref85) { var connection_id = _ref85.connection_id; return connection_id === connectionId; }); if (oidcMatch) {
     return Object.assign(Object.assign({}, oidcMatch), { connectionType: 'oidc' });
-} var samlMatch = (_b = connections === null || connections === void 0 ? void 0 : connections.saml_connections) === null || _b === void 0 ? void 0 : _b.find(function (_ref83) { var connection_id = _ref83.connection_id; return connection_id === connectionId; }); if (samlMatch) {
+} var samlMatch = (_b = connections === null || connections === void 0 ? void 0 : connections.saml_connections) === null || _b === void 0 ? void 0 : _b.find(function (_ref86) { var connection_id = _ref86.connection_id; return connection_id === connectionId; }); if (samlMatch) {
     return Object.assign(Object.assign({}, samlMatch), { connectionType: 'saml' });
 } return null; }, [connectionId, connections === null || connections === void 0 ? void 0 : connections.oidc_connections, connections === null || connections === void 0 ? void 0 : connections.saml_connections]); var connectionType = connection === null || connection === void 0 ? void 0 : connection.connectionType; var connectionName = connection === null || connection === void 0 ? void 0 : connection.display_name; var isDefaultConnection = (connection === null || connection === void 0 ? void 0 : connection.connection_id) === defaultConnectionId; var isOnlyConnection = ((_a = connections === null || connections === void 0 ? void 0 : connections.oidc_connections.length) !== null && _a !== void 0 ? _a : 0) + ((_b = connections === null || connections === void 0 ? void 0 : connections.saml_connections.length) !== null && _b !== void 0 ? _b : 0) === 1; var _useDeleteConnection = useDeleteConnection({ onConfirm: function onConfirm() { navigate({ screen: 'connectionsList' }); } }), handleRequestDelete = _useDeleteConnection.handleRequestDelete, modalProps = _useDeleteConnection.modalProps; var handleDeleteClick = T$2(function () { if (connectionId && connectionName) {
     handleRequestDelete({ id: connectionId, displayName: connectionName });
@@ -9273,10 +9842,10 @@ var SSOConnectionDetailsScreen = function SSOConnectionDetailsScreen(_ref81) { v
 var ActionMenuItem = function ActionMenuItem(_a) { var children = _a.children, onClick = _a.onClick, onClose = _a.onClose, color = _a.color, icon = _a.icon, item = _a.item, rest = __rest(_a, ["children", "onClick", "onClose", "color", "icon", "item"]); var handleClick = T$2(function () { onClick(item); onClose(); }, [item, onClick, onClose]); return /*#__PURE__*/ wn.createElement(MenuItem$2, Object.assign({}, rest, { disableRipple: true, onClick: handleClick }), /*#__PURE__*/ wn.createElement(Typography, { color: color }, /*#__PURE__*/ wn.createElement(FlexBox, null, icon, children))); };
 var anchorOrigin = { horizontal: 'center', vertical: 'bottom' };
 var transformOrigin = { horizontal: 'right', vertical: 'top' };
-var ActionMenu = function ActionMenu(_ref84) { var actions = _ref84.actions, item = _ref84.item, idPrefix = _ref84.idPrefix; var _h53 = h$4(), _h54 = _slicedToArray2(_h53, 2), anchorEl = _h54[0], setAnchorEl = _h54[1]; var handleClose = T$2(function () { setAnchorEl(undefined); }, []); var handleOpen = T$2(function (e) { setAnchorEl(e.currentTarget); }, []); var id = useShortId(idPrefix); var children = F$3(function () { return actions.map(function (_ref85) { var key = _ref85.key, label = _ref85.label, onClick = _ref85.onClick, icon = _ref85.icon, isDangerous = _ref85.isDangerous, _ref85$isVisible = _ref85.isVisible, isVisible = _ref85$isVisible === void 0 ? true : _ref85$isVisible; if (!isVisible || typeof isVisible === 'function' && !isVisible(item)) {
+var ActionMenu = function ActionMenu(_ref87) { var actions = _ref87.actions, item = _ref87.item, idPrefix = _ref87.idPrefix; var _h55 = h$4(), _h56 = _slicedToArray2(_h55, 2), anchorEl = _h56[0], setAnchorEl = _h56[1]; var handleClose = T$2(function () { setAnchorEl(undefined); }, []); var handleOpen = T$2(function (e) { setAnchorEl(e.currentTarget); }, []); var id = useShortId(idPrefix); var children = F$3(function () { return actions.map(function (_ref88) { var key = _ref88.key, label = _ref88.label, onClick = _ref88.onClick, icon = _ref88.icon, isDangerous = _ref88.isDangerous, _ref88$isVisible = _ref88.isVisible, isVisible = _ref88$isVisible === void 0 ? true : _ref88$isVisible; if (!isVisible || typeof isVisible === 'function' && !isVisible(item)) {
     return null;
 } return /*#__PURE__*/ wn.createElement(ActionMenuItem, { key: key, item: item, onClick: onClick, onClose: handleClose, color: isDangerous ? 'error' : undefined, icon: icon }, label); }); }, [actions, handleClose, item]); var isOpen = !!anchorEl; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(IconButton$1, { disableTouchRipple: true, "aria-label": "actions", color: "inherit", onClick: handleOpen, "aria-controls": id, "aria-haspopup": true }, /*#__PURE__*/ wn.createElement(MoreVert, null)), /*#__PURE__*/ wn.createElement(Menu$1, { id: id, open: isOpen, anchorEl: anchorEl, getContentAnchorEl: null, variant: "menu", anchorOrigin: anchorOrigin, transformOrigin: transformOrigin, onClose: handleClose }, children)); };
-var useActionMenu = function useActionMenu(_ref86) { var actions = _ref86.actions, idPrefix = _ref86.idPrefix; var getItemActionProps = T$2(function (item) { var hasVisibleActions = actions.some(function (_ref87) { var _ref87$isVisible = _ref87.isVisible, isVisible = _ref87$isVisible === void 0 ? true : _ref87$isVisible; return typeof isVisible === 'function' ? isVisible(item) : isVisible; }); if (!hasVisibleActions) {
+var useActionMenu = function useActionMenu(_ref89) { var actions = _ref89.actions, idPrefix = _ref89.idPrefix; var getItemActionProps = T$2(function (item) { var hasVisibleActions = actions.some(function (_ref90) { var _ref90$isVisible = _ref90.isVisible, isVisible = _ref90$isVisible === void 0 ? true : _ref90$isVisible; return typeof isVisible === 'function' ? isVisible(item) : isVisible; }); if (!hasVisibleActions) {
     return {};
 } return { customAction: /*#__PURE__*/ wn.createElement(ActionMenu, { actions: actions, item: item, idPrefix: "".concat(idPrefix, "-action-menu-").concat(item.id) }) }; }, [actions, idPrefix]); return { getItemActionProps: getItemActionProps }; };
 var DEFAULT_TABLE_ROWS_PER_PAGE = 20;
@@ -9284,7 +9853,8 @@ var LOAD_NEXT_PAGE_ERROR = 'Failed to load the next page.';
 var ZERO_RESULTS_MESSAGE = 'No results found.';
 var PAGINATED_TABLE_ID = 'paginated-table';
 var makePaginatedTableStyles = makeStylesFactory(function (theme) { return { tablePagination: { '& .MuiTablePagination-actions .MuiIconButton-root': { padding: theme.spacing(1) }, alignItems: 'center', display: 'flex', justifyContent: 'flex-end', padding: 0 }, paginationBoder: { borderTopWidth: 1, borderTopStyle: 'solid' }, emptyTable: { alignItems: 'flex-start', display: 'flex', justifyContent: 'center', padding: theme.spacing(4) } }; });
-var PaginatedTableCore = function PaginatedTableCore(_a) { var _b, _c, _d; var currentPage = _a.currentPage, loadNext = _a.loadNext, isLoading = _a.isLoading, metadata = _a.metadata, setCurrentPage = _a.setCurrentPage, _a$rowsPerPage = _a.rowsPerPage, rowsPerPage = _a$rowsPerPage === void 0 ? DEFAULT_TABLE_ROWS_PER_PAGE : _a$rowsPerPage, classes = _a.classes, Table = _a.TableComponent, Typography = _a.TypographyComponent, tableProps = __rest(_a, ["currentPage", "loadNext", "isLoading", "metadata", "setCurrentPage", "rowsPerPage", "classes", "TableComponent", "TypographyComponent"]); var items = tableProps.items; var tableId = useShortId(PAGINATED_TABLE_ID); var _useToast4 = useToast(), openToast = _useToast4.openToast; var tableRowHeight = _$1(); var currFirstRowIndex = currentPage * rowsPerPage; var loadNextHandler = function loadNextHandler(newPage) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee13() { var _e, totalLoadedResults; return _regeneratorRuntime().wrap(function _callee13$(_context14) { while (1)
+var defaultRowsPerPageOptions = [];
+var PaginatedTableCore = function PaginatedTableCore(_a) { var _b, _c, _d; var currentPage = _a.currentPage, loadNext = _a.loadNext, isLoading = _a.isLoading, metadata = _a.metadata, setCurrentPage = _a.setCurrentPage, _a$rowsPerPage = _a.rowsPerPage, rowsPerPage = _a$rowsPerPage === void 0 ? DEFAULT_TABLE_ROWS_PER_PAGE : _a$rowsPerPage, _a$rowsPerPageOptions = _a.rowsPerPageOptions, rowsPerPageOptions = _a$rowsPerPageOptions === void 0 ? defaultRowsPerPageOptions : _a$rowsPerPageOptions, onRowsPerPageChange = _a.onRowsPerPageChange, _a$keepConsistentCont = _a.keepConsistentContentHeight, keepConsistentContentHeight = _a$keepConsistentCont === void 0 ? true : _a$keepConsistentCont, classes = _a.classes, Table = _a.TableComponent, Typography = _a.TypographyComponent, tableProps = __rest(_a, ["currentPage", "loadNext", "isLoading", "metadata", "setCurrentPage", "rowsPerPage", "rowsPerPageOptions", "onRowsPerPageChange", "keepConsistentContentHeight", "classes", "TableComponent", "TypographyComponent"]); var items = tableProps.items; var tableId = useShortId(PAGINATED_TABLE_ID); var _useToast4 = useToast(), openToast = _useToast4.openToast; var tableRowHeight = _$1(); var currFirstRowIndex = currentPage * rowsPerPage; var loadNextHandler = function loadNextHandler(newPage) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee13() { var _e, totalLoadedResults; return _regeneratorRuntime().wrap(function _callee13$(_context14) { while (1)
     switch (_context14.prev = _context14.next) {
         case 0:
             tableRowHeight.current = (_e = document.querySelector("#".concat(tableId, " tbody tr"))) === null || _e === void 0 ? void 0 : _e.clientHeight;
@@ -9320,9 +9890,9 @@ var PaginatedTableCore = function PaginatedTableCore(_a) { var _b, _c, _d; var c
 else {
     countForPagination = (_b = metadata === null || metadata === void 0 ? void 0 : metadata.total) !== null && _b !== void 0 ? _b : 0;
     moreRowsToShow = ((_c = metadata === null || metadata === void 0 ? void 0 : metadata.total) !== null && _c !== void 0 ? _c : 0) > rowsPerPage;
-} var showPagination = !showEmptyTable && moreRowsToShow; var paginationMarginTop = (rowsPerPage - pageResults.length) * ((_d = tableRowHeight.current) !== null && _d !== void 0 ? _d : 0) - 1; return /*#__PURE__*/ wn.createElement("div", { id: tableId }, /*#__PURE__*/ wn.createElement(Table, Object.assign({}, tableProps, { items: showEmptyTable ? [] : pageResults })), showEmptyTable && ( /*#__PURE__*/wn.createElement("div", { className: classes.emptyTable, style: tableRowHeight.current ? { height: Math.min(rowsPerPage, pageResults.length) * tableRowHeight.current } : undefined }, showLoading && /*#__PURE__*/ wn.createElement(CircularProgress$1, { color: "inherit" }), showNoResults && /*#__PURE__*/ wn.createElement(Typography, null, ZERO_RESULTS_MESSAGE))), showPagination && ( /*#__PURE__*/wn.createElement("div", { className: C(classes.tablePagination, _defineProperty2({}, classes.paginationBoder, paginationMarginTop)), style: { marginTop: paginationMarginTop } }, /*#__PURE__*/ wn.createElement(TablePagination$1, { component: "div", count: countForPagination, onPageChange: handleChangePage, page: currentPage, rowsPerPage: rowsPerPage, rowsPerPageOptions: [] })))); };
-var useStyles$2 = makePaginatedTableStyles(function (theme) { return { tablePagination: { '& .MuiTablePagination-root': { color: theme.styleConfig.colors.primary }, '& .MuiTablePagination-actions .MuiIconButton-root.Mui-disabled': { color: theme.styleConfig.colors.secondary } }, paginationBoder: { borderTopColor: theme.styleConfig.colors.subtle } }; });
-var PaginatedTable = function PaginatedTable(props) { var classes = useStyles$2(); return /*#__PURE__*/ wn.createElement(PaginatedTableCore, Object.assign({}, props, { TableComponent: Table, TypographyComponent: Typography, classes: classes })); };
+} var showPagination = !showEmptyTable && moreRowsToShow || rowsPerPageOptions.length > 1; var paginationMarginTop = (rowsPerPage - pageResults.length) * ((_d = tableRowHeight.current) !== null && _d !== void 0 ? _d : 0) - 1; return /*#__PURE__*/ wn.createElement("div", { id: tableId }, /*#__PURE__*/ wn.createElement(Table, Object.assign({}, tableProps, { items: showEmptyTable ? [] : pageResults })), showEmptyTable && ( /*#__PURE__*/wn.createElement("div", { className: classes.emptyTable, style: tableRowHeight.current ? { height: Math.min(rowsPerPage, pageResults.length) * tableRowHeight.current } : undefined }, showLoading && /*#__PURE__*/ wn.createElement(CircularProgress$1, { color: "inherit" }), showNoResults && /*#__PURE__*/ wn.createElement(Typography, null, ZERO_RESULTS_MESSAGE))), showPagination && ( /*#__PURE__*/wn.createElement("div", { className: C(classes.tablePagination, _defineProperty2({}, classes.paginationBoder, paginationMarginTop)), style: keepConsistentContentHeight ? { marginTop: paginationMarginTop } : undefined }, /*#__PURE__*/ wn.createElement(TablePagination$1, { component: "div", count: countForPagination, onPageChange: handleChangePage, page: currentPage, rowsPerPage: rowsPerPage, rowsPerPageOptions: rowsPerPageOptions, onRowsPerPageChange: onRowsPerPageChange })))); };
+var useStyles$5 = makePaginatedTableStyles(function (theme) { return { tablePagination: { '& .MuiTablePagination-root': { color: theme.styleConfig.colors.primary }, '& .MuiTablePagination-actions .MuiIconButton-root.Mui-disabled': { color: theme.styleConfig.colors.secondary } }, paginationBoder: { borderTopColor: theme.styleConfig.colors.subtle } }; });
+var PaginatedTable = function PaginatedTable(props) { var classes = useStyles$5(); return /*#__PURE__*/ wn.createElement(PaginatedTableCore, Object.assign({}, props, { keepConsistentContentHeight: false, TableComponent: Table, TypographyComponent: Typography, classes: classes })); };
 var Search = {};
 var _interopRequireDefault = interopRequireDefaultExports;
 var _interopRequireWildcard = interopRequireWildcardExports;
@@ -9335,7 +9905,7 @@ default_1 = Search["default"] = _default;
 var Keys;
 (function (Keys) { Keys["Backspace"] = "Backspace"; Keys["Tab"] = "Tab"; Keys["Enter"] = "Enter"; Keys["Space"] = " "; Keys["Shift"] = "Shift"; Keys["Control"] = "Control"; Keys["Alt"] = "Alt"; Keys["Command"] = "Meta"; Keys["Escape"] = "Escape"; Keys["PageUp"] = "PageUp"; Keys["PageDown"] = "PageDown"; Keys["ArrowLeft"] = "ArrowLeft"; Keys["ArrowUp"] = "ArrowUp"; Keys["ArrowRight"] = "ArrowRight"; Keys["ArrowDown"] = "ArrowDown"; Keys["Delete"] = "Delete"; Keys["Fn"] = "Fn"; Keys["End"] = "End"; Keys["Home"] = "Home"; Keys["Clear"] = "Clear"; Keys["Insert"] = "Insert"; Keys["A"] = "a"; Keys["B"] = "b"; Keys["C"] = "c"; Keys["D"] = "d"; Keys["E"] = "e"; Keys["F"] = "f"; Keys["G"] = "g"; Keys["H"] = "h"; Keys["I"] = "i"; Keys["J"] = "j"; Keys["K"] = "k"; Keys["L"] = "l"; Keys["M"] = "m"; Keys["N"] = "n"; Keys["O"] = "o"; Keys["P"] = "p"; Keys["Q"] = "q"; Keys["R"] = "r"; Keys["S"] = "s"; Keys["T"] = "t"; Keys["U"] = "u"; Keys["V"] = "v"; Keys["W"] = "w"; Keys["X"] = "x"; Keys["Y"] = "y"; Keys["Z"] = "z"; Keys["Zero"] = "0"; Keys["One"] = "1"; Keys["Two"] = "2"; Keys["Three"] = "3"; Keys["Four"] = "4"; Keys["Five"] = "5"; Keys["Six"] = "6"; Keys["Seven"] = "7"; Keys["Eight"] = "8"; Keys["Nine"] = "9"; Keys["F1"] = "F1"; Keys["F2"] = "F2"; Keys["F3"] = "F3"; Keys["F4"] = "F4"; Keys["F5"] = "F5"; Keys["F6"] = "F6"; Keys["F7"] = "F7"; Keys["F8"] = "F8"; Keys["F9"] = "F9"; Keys["F10"] = "F10"; Keys["F11"] = "F11"; Keys["F12"] = "F12"; Keys["Hyphen"] = "-"; Keys["ForwardSlash"] = "/"; Keys["BackSlash"] = "\\"; })(Keys || (Keys = {}));
 var makeSearchBarStyles = makeStylesFactory(function (theme) { return { searchBar: { position: 'relative', width: '100%' }, icon: { alignItems: 'center', display: 'flex', justifyContent: 'center', position: 'absolute', bottom: 0, marginBottom: theme.spacing(1) }, searchInput: { '& input': { paddingLeft: "".concat(theme.spacing(4), "px !important"), paddingRight: "".concat(theme.spacing(6), "px !important") }, '&:hover': { cursor: 'pointer' } }, searchIcon: { padding: theme.spacing(0.5, 1, 0, 1) }, slashIcon: { border: '1px solid', borderRadius: theme.shape.borderRadius, padding: theme.spacing(0, 1) }, slashIconContainer: { right: theme.spacing(1) } }; });
-var SearchBarCore = function SearchBarCore(_a) { var classes = _a.classes, Input = _a.InputComponent, inputProps = __rest(_a, ["classes", "InputComponent"]); var _h55 = h$4(null), _h56 = _slicedToArray2(_h55, 2), inputRef = _h56[0], setInputRef = _h56[1]; var _h57 = h$4(false), _h58 = _slicedToArray2(_h57, 2), focused = _h58[0], setFocused = _h58[1]; var onFocus = T$2(function () { return setFocused(true); }, []); var onBlur = T$2(function () { return setFocused(false); }, []); p$3(function () { var handleKey = function handleKey(e) { if (inputRef && !focused) {
+var SearchBarCore = function SearchBarCore(_a) { var classes = _a.classes, Input = _a.InputComponent, inputProps = __rest(_a, ["classes", "InputComponent"]); var _h57 = h$4(null), _h58 = _slicedToArray2(_h57, 2), inputRef = _h58[0], setInputRef = _h58[1]; var _h59 = h$4(false), _h60 = _slicedToArray2(_h59, 2), focused = _h60[0], setFocused = _h60[1]; var onFocus = T$2(function () { return setFocused(true); }, []); var onBlur = T$2(function () { return setFocused(false); }, []); p$3(function () { var handleKey = function handleKey(e) { if (inputRef && !focused) {
     if (e.metaKey && e.key === Keys.K || e.key === Keys.ForwardSlash) {
         e.stopPropagation();
         inputRef.focus();
@@ -9344,32 +9914,44 @@ var SearchBarCore = function SearchBarCore(_a) { var classes = _a.classes, Input
         }
     }
 } }; document.addEventListener('keydown', handleKey); return function () { return document.removeEventListener('keydown', handleKey); }; }, [inputRef, focused]); return /*#__PURE__*/ wn.createElement("div", { className: classes.searchBar }, /*#__PURE__*/ wn.createElement("div", { className: C(classes.icon, classes.searchIcon) }, /*#__PURE__*/ wn.createElement(default_1, { fontSize: "small" })), /*#__PURE__*/ wn.createElement("div", { className: C(classes.icon, classes.slashIconContainer) }, /*#__PURE__*/ wn.createElement("div", { className: classes.slashIcon }, "/")), /*#__PURE__*/ wn.createElement("div", { className: classes.searchInput }, /*#__PURE__*/ wn.createElement(Input, Object.assign({}, inputProps, { fullWidth: true, inputRef: setInputRef, onBlur: onBlur, onFocus: onFocus })))); };
-var useStyles$1 = makeSearchBarStyles(function (theme) { return { searchIcon: { color: theme.styleConfig.inputs.placeholderColor }, slashIcon: { borderColor: theme.styleConfig.inputs.placeholderColor, color: theme.styleConfig.inputs.placeholderColor, fontFamily: theme.styleConfig.fontFamily, fontSize: theme.typography.fontSize, lineHeight: 1, padding: theme.spacing(0.5, 1) } }; });
-var SearchBar = function SearchBar(props) { var classes = useStyles$1(props); return /*#__PURE__*/ wn.createElement(SearchBarCore, Object.assign({}, props, { classes: classes, InputComponent: Input })); };
-var useDisplayPagination = function useDisplayPagination(_ref88) { var items = _ref88.items, itemsPerPage = _ref88.itemsPerPage; var _h59 = h$4(0), _h60 = _slicedToArray2(_h59, 2), currentPage = _h60[0], setCurrentPage = _h60[1]; var metadata = F$3(function () { return { total: items.length, cursor: 'none' }; }, [items.length]); var pageCount = Math.ceil(items.length / itemsPerPage); var lastPageIndex = Math.max(0, pageCount - 1); if (currentPage > lastPageIndex) {
+var useStyles$4 = makeSearchBarStyles(function (theme) { return { searchIcon: { color: theme.styleConfig.inputs.placeholderColor }, slashIcon: { borderColor: theme.styleConfig.inputs.placeholderColor, color: theme.styleConfig.inputs.placeholderColor, fontFamily: theme.styleConfig.fontFamily, fontSize: theme.typography.fontSize, lineHeight: 1, padding: theme.spacing(0.5, 1) } }; });
+var SearchBar = function SearchBar(props) { var classes = useStyles$4(props); return /*#__PURE__*/ wn.createElement(SearchBarCore, Object.assign({}, props, { classes: classes, InputComponent: Input$1 })); };
+var tryParseJson = function tryParseJson(value) { try {
+    if (value) {
+        return JSON.parse(value);
+    }
+}
+catch (e) { } return undefined; };
+var useLocalStorage = function useLocalStorage(defaultValue, key) { var publicToken = useB2BInternals().publicToken; var fullKey = getLocalStorageKey(publicToken, key); var _h61 = h$4(function () { var storedValue = localStorage.getItem(fullKey); return storedValue ? tryParseJson(storedValue) : defaultValue; }), _h62 = _slicedToArray2(_h61, 2), cachedValue = _h62[0], setCachedValue = _h62[1]; var setValue = function setValue(value) { localStorage.setItem(fullKey, JSON.stringify(value)); setCachedValue(value); }; return [cachedValue, setValue]; };
+var itemsPerPageOptions = [10, 15, 25, 50, 100];
+var useItemsPerPage = function useItemsPerPage(_ref91) { var viewId = _ref91.viewId, defaultItemsPerPage = _ref91.defaultItemsPerPage; var _useLocalStorage = useLocalStorage(defaultItemsPerPage, "".concat(viewId, "_itemsPerPage")), _useLocalStorage2 = _slicedToArray2(_useLocalStorage, 2), itemsPerPage = _useLocalStorage2[0], setItemsPerPage = _useLocalStorage2[1]; var handleItemsPerPageChange = function handleItemsPerPageChange(e) { var value = parseInt(e.target.value, 10); if (!Number.isNaN(value)) {
+    setItemsPerPage(value);
+} }; return [itemsPerPage, handleItemsPerPageChange]; };
+var useDisplayPagination = function useDisplayPagination(_ref92) { var items = _ref92.items, _ref92$defaultItemsPe = _ref92.defaultItemsPerPage, defaultItemsPerPage = _ref92$defaultItemsPe === void 0 ? 15 : _ref92$defaultItemsPe, viewId = _ref92.viewId; var _h63 = h$4(0), _h64 = _slicedToArray2(_h63, 2), currentPage = _h64[0], setCurrentPage = _h64[1]; var metadata = F$3(function () { return { total: items.length, cursor: 'none' }; }, [items.length]); var _useItemsPerPage = useItemsPerPage({ viewId: viewId, defaultItemsPerPage: defaultItemsPerPage }), _useItemsPerPage2 = _slicedToArray2(_useItemsPerPage, 2), itemsPerPage = _useItemsPerPage2[0], handleItemsPerPageChange = _useItemsPerPage2[1]; var pageCount = Math.ceil(items.length / itemsPerPage); var lastPageIndex = Math.max(0, pageCount - 1); if (currentPage > lastPageIndex) {
     setCurrentPage(lastPageIndex);
-} return { items: items, currentPage: currentPage, setCurrentPage: setCurrentPage, loadNext: noop, metadata: metadata, rowsPerPage: itemsPerPage }; };
-var itemRenderer = [{ title: 'Display Name', getValue: function getValue(_ref89) { var displayName = _ref89.displayName, isDefault = _ref89.isDefault; return isDefault ? ( /*#__PURE__*/wn.createElement(Typography, null, displayName, " ", /*#__PURE__*/ wn.createElement(Tag, { size: "sm" }, "Default"))) : displayName; } }, { title: 'IdP', getValue: function getValue(_ref90) { var idp = _ref90.idp, connectionType = _ref90.connectionType; return getIdpInfo(idp, connectionType).idp.displayName; } }, { title: 'Status', getValue: function getValue(_ref91) { var status = _ref91.status; switch (status) {
+} return { items: items, currentPage: currentPage, setCurrentPage: setCurrentPage, loadNext: noop, metadata: metadata, rowsPerPage: itemsPerPage, rowsPerPageOptions: itemsPerPageOptions, onRowsPerPageChange: handleItemsPerPageChange }; };
+var DEFAULT_ROWS_PER_PAGE = 10;
+var itemRenderer = [{ title: 'Display Name', getValue: function getValue(_ref93) { var displayName = _ref93.displayName, isDefault = _ref93.isDefault; return isDefault ? ( /*#__PURE__*/wn.createElement(Typography, null, displayName, " ", /*#__PURE__*/ wn.createElement(Tag, { size: "sm" }, "Default"))) : displayName; } }, { title: 'IdP', getValue: function getValue(_ref94) { var idp = _ref94.idp, connectionType = _ref94.connectionType; return getIdpInfo(idp, connectionType).idp.displayName; } }, { title: 'Status', getValue: function getValue(_ref95) { var status = _ref95.status; switch (status) {
             case 'active': return 'Active';
             case 'pending': return 'Pending';
             default: return status;
         } } }];
-var useSearchFilter = function useSearchFilter(_ref92) { var data = _ref92.data, searchKeys = _ref92.searchKeys; var _h61 = h$4(''), _h62 = _slicedToArray2(_h61, 2), filterText = _h62[0], setFilterText = _h62[1]; var filteredData = F$3(function () { if (!filterText) {
+var useSearchFilter = function useSearchFilter(_ref96) { var data = _ref96.data, searchKeys = _ref96.searchKeys; var _h65 = h$4(''), _h66 = _slicedToArray2(_h65, 2), filterText = _h66[0], setFilterText = _h66[1]; var filteredData = F$3(function () { if (!filterText) {
     return data;
 } var filterTextLower = filterText.toLowerCase(); return data.filter(function (item) { return searchKeys.some(function (key) { return String(item[key]).toLowerCase().includes(filterTextLower); }); }); }, [data, filterText, searchKeys]); return { filteredData: filteredData, filterText: filterText, setFilterText: setFilterText }; };
 var useCanProjectCreateSsoConnection = function useCanProjectCreateSsoConnection() { var _useAdminPortalConfig = useAdminPortalConfig(), data = _useAdminPortalConfig.data; return (data === null || data === void 0 ? void 0 : data.sso_config.can_create_oidc_connection) && data.sso_config.can_create_saml_connection; };
-var useConnections = function useConnections() { var _a; var ssoConnections = useSsoConnections(); var orgInfo = useOrgInfo(); var defaultConnectionId = (_a = orgInfo.data) === null || _a === void 0 ? void 0 : _a.sso_default_connection_id; var connections = F$3(function () { return ssoConnections.data ? [].concat(_toConsumableArray2(ssoConnections.data.saml_connections.map(function (c) { return Object.assign({ connectionType: 'saml' }, c); })), _toConsumableArray2(ssoConnections.data.oidc_connections.map(function (c) { return Object.assign({ connectionType: 'oidc' }, c); }))).map(function (connection) { return { displayName: connection.display_name, idp: connection.identity_provider, connectionType: connection.connectionType, status: connection.status, id: connection.connection_id, isDefault: connection.connection_id === defaultConnectionId }; }).sort(function (a, b) { return collator.compare(a.displayName, b.displayName); }) : []; }, [defaultConnectionId, ssoConnections.data]); return { connections: connections, isLoading: ssoConnections.isLoading }; };
-var SSOConnectionsScreen = function SSOConnectionsScreen() { var _useSsoRouterControll5 = useSsoRouterController(), navigate = _useSsoRouterControll5.navigate; var canProjectCreateSsoConnection = useCanProjectCreateSsoConnection(); var _useRbac7 = useRbac('stytch.sso', 'create'), canCreatePermission = _useRbac7.data; var _useRbac8 = useRbac('stytch.sso', 'delete'), canDeleteConnection = _useRbac8.data; var _useRbac9 = useRbac('stytch.sso', 'update'), canUpdateConnection = _useRbac9.data; var _useRbac10 = useRbac('stytch.organization', 'update.settings.default-sso-connection'), canSetDefaultConnection = _useRbac10.data; var canCreateConnection = canCreatePermission && canProjectCreateSsoConnection; var _useConnections = useConnections(), connections = _useConnections.connections, isLoading = _useConnections.isLoading; var _useSearchFilter = useSearchFilter({ data: connections, searchKeys: ['displayName'] }), filterText = _useSearchFilter.filterText, setFilterText = _useSearchFilter.setFilterText, filteredData = _useSearchFilter.filteredData; var tableProps = useDisplayPagination({ items: filteredData, itemsPerPage: 6 }); var defaultConnectionName = F$3(function () { var _a; return (_a = connections.find(function (connection) { return connection.isDefault; })) === null || _a === void 0 ? void 0 : _a.displayName; }, [connections]); var _useSetDefaultConnect2 = useSetDefaultConnection({ defaultConnectionName: defaultConnectionName }), setDefaultModalProps = _useSetDefaultConnect2.modalProps, handleSetDefault = _useSetDefaultConnect2.handleRequestSetDefault; var _useDeleteConnection2 = useDeleteConnection(), deleteModalProps = _useDeleteConnection2.modalProps, handleDelete = _useDeleteConnection2.handleRequestDelete; var handleEdit = T$2(function (connection) { navigate({ screen: 'connectionDetails', params: { connectionId: connection.id } }); }, [navigate]); var handleNewConnectionClick = T$2(function () { navigate({ screen: 'newConnection' }); }, [navigate]); var hasExactlyOneConnection = connections.length === 1; var actions = F$3(function () { return [{ key: 'view', label: 'View connection', icon: /*#__PURE__*/ wn.createElement(VisibilityOutlined, null), onClick: handleEdit, isVisible: !canUpdateConnection }, { key: 'edit', label: 'Edit connection', icon: /*#__PURE__*/ wn.createElement(EditOutlined, null), onClick: handleEdit, isVisible: !!canUpdateConnection }, { key: 'set-default', label: 'Set as default', icon: /*#__PURE__*/ wn.createElement(Tune, null), onClick: handleSetDefault, isVisible: function isVisible(connection) { return !connection.isDefault && !!canSetDefaultConnection; } }, { key: 'delete', label: 'Delete', icon: /*#__PURE__*/ wn.createElement(DeleteOutlined, null), onClick: handleDelete, isDangerous: true, isVisible: function isVisible(connection) { return (!connection.isDefault || hasExactlyOneConnection) && !!canDeleteConnection; } }]; }, [canDeleteConnection, canSetDefaultConnection, canUpdateConnection, handleDelete, handleEdit, handleSetDefault, hasExactlyOneConnection]); var _useActionMenu = useActionMenu({ actions: actions, idPrefix: 'connection' }), getItemActionProps = _useActionMenu.getItemActionProps; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, canCreatePermission && !canCreateConnection && ( /*#__PURE__*/wn.createElement(Alert, null, "You\u2019ve reached the maximum number of allowed connections. Delete an existing connection in order to add a new one.")), /*#__PURE__*/ wn.createElement(FlexBox, { alignItems: "center", justifyContent: "space-between" }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "SSO Connections"), canCreateConnection && ( /*#__PURE__*/wn.createElement(Button, { variant: "primary", startIcon: /*#__PURE__*/ wn.createElement(Add, null), onClick: handleNewConnectionClick }, "New connection"))), /*#__PURE__*/ wn.createElement(SearchBar, { placeholder: "Search", value: filterText, onChange: setFilterText }), /*#__PURE__*/ wn.createElement(PaginatedTable, Object.assign({}, tableProps, { itemRenderer: itemRenderer, isLoading: isLoading, getItemActionProps: getItemActionProps }))), /*#__PURE__*/ wn.createElement(SetDefaultConfirmModal, Object.assign({}, setDefaultModalProps)), /*#__PURE__*/ wn.createElement(DeleteConfirmModal, Object.assign({}, deleteModalProps))); };
+var useConnections = function useConnections(canGetSso) { var _a; var ssoConnections = useSsoConnections(canGetSso); var orgInfo = useOrgInfo(); var defaultConnectionId = (_a = orgInfo.data) === null || _a === void 0 ? void 0 : _a.sso_default_connection_id; var connections = F$3(function () { return ssoConnections.data ? [].concat(_toConsumableArray2(ssoConnections.data.saml_connections.map(function (c) { return Object.assign({ connectionType: 'saml' }, c); })), _toConsumableArray2(ssoConnections.data.oidc_connections.map(function (c) { return Object.assign({ connectionType: 'oidc' }, c); }))).map(function (connection) { return { displayName: connection.display_name, idp: connection.identity_provider, connectionType: connection.connectionType, status: connection.status, id: connection.connection_id, isDefault: connection.connection_id === defaultConnectionId }; }).sort(function (a, b) { return collator.compare(a.displayName, b.displayName); }) : []; }, [defaultConnectionId, ssoConnections.data]); return { connections: connections, isLoading: ssoConnections.isLoading }; };
+var SSOConnectionsScreen = function SSOConnectionsScreen() { var _useSsoRouterControll5 = useSsoRouterController(), navigate = _useSsoRouterControll5.navigate; var canProjectCreateSsoConnection = useCanProjectCreateSsoConnection(); var _useRbac8 = useRbac('stytch.sso', 'get'), canGetConnection = _useRbac8.data; var _useRbac9 = useRbac('stytch.sso', 'create'), canCreatePermission = _useRbac9.data; var _useRbac10 = useRbac('stytch.sso', 'delete'), canDeleteConnection = _useRbac10.data; var _useRbac11 = useRbac('stytch.sso', 'update'), canUpdateConnection = _useRbac11.data; var _useRbac12 = useRbac('stytch.organization', 'update.settings.default-sso-connection'), canSetDefaultConnection = _useRbac12.data; var canCreateConnection = canCreatePermission && canProjectCreateSsoConnection; var _useConnections = useConnections(!!canGetConnection), connections = _useConnections.connections, isLoading = _useConnections.isLoading; var _useSearchFilter = useSearchFilter({ data: connections, searchKeys: ['displayName'] }), filterText = _useSearchFilter.filterText, setFilterText = _useSearchFilter.setFilterText, filteredData = _useSearchFilter.filteredData; var tableProps = useDisplayPagination({ items: filteredData, defaultItemsPerPage: DEFAULT_ROWS_PER_PAGE, viewId: 'adminPortalSsoConnections' }); var defaultConnectionName = F$3(function () { var _a; return (_a = connections.find(function (connection) { return connection.isDefault; })) === null || _a === void 0 ? void 0 : _a.displayName; }, [connections]); var _useSetDefaultConnect2 = useSetDefaultConnection({ defaultConnectionName: defaultConnectionName }), setDefaultModalProps = _useSetDefaultConnect2.modalProps, handleSetDefault = _useSetDefaultConnect2.handleRequestSetDefault; var _useDeleteConnection2 = useDeleteConnection(), deleteModalProps = _useDeleteConnection2.modalProps, handleDelete = _useDeleteConnection2.handleRequestDelete; var handleEdit = T$2(function (connection) { navigate({ screen: 'connectionDetails', params: { connectionId: connection.id } }); }, [navigate]); var handleNewConnectionClick = T$2(function () { navigate({ screen: 'newConnection' }); }, [navigate]); var hasExactlyOneConnection = connections.length === 1; var actions = F$3(function () { return [{ key: 'view', label: 'View connection', icon: /*#__PURE__*/ wn.createElement(VisibilityOutlined, null), onClick: handleEdit, isVisible: !canUpdateConnection }, { key: 'edit', label: 'Edit connection', icon: /*#__PURE__*/ wn.createElement(EditOutlined, null), onClick: handleEdit, isVisible: !!canUpdateConnection }, { key: 'set-default', label: 'Set as default', icon: /*#__PURE__*/ wn.createElement(Tune, null), onClick: handleSetDefault, isVisible: function isVisible(connection) { return !connection.isDefault && !!canSetDefaultConnection; } }, { key: 'delete', label: 'Delete', icon: /*#__PURE__*/ wn.createElement(DeleteOutlined, null), onClick: handleDelete, isDangerous: true, isVisible: function isVisible(connection) { return (!connection.isDefault || hasExactlyOneConnection) && !!canDeleteConnection; } }]; }, [canDeleteConnection, canSetDefaultConnection, canUpdateConnection, handleDelete, handleEdit, handleSetDefault, hasExactlyOneConnection]); var _useActionMenu = useActionMenu({ actions: actions, idPrefix: 'connection' }), getItemActionProps = _useActionMenu.getItemActionProps; return /*#__PURE__*/ wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, canCreatePermission && !canCreateConnection && ( /*#__PURE__*/wn.createElement(Alert, null, "You\u2019ve reached the maximum number of allowed connections. Delete an existing connection in order to add a new one.")), /*#__PURE__*/ wn.createElement(FlexBox, { alignItems: "center", justifyContent: "space-between" }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "SSO Connections"), canCreateConnection && ( /*#__PURE__*/wn.createElement(Button, { variant: "primary", startIcon: /*#__PURE__*/ wn.createElement(Add, null), onClick: handleNewConnectionClick }, "New connection"))), /*#__PURE__*/ wn.createElement(SearchBar, { placeholder: "Search", value: filterText, onChange: setFilterText }), /*#__PURE__*/ wn.createElement(PaginatedTable, Object.assign({}, tableProps, { itemRenderer: itemRenderer, isLoading: isLoading, getItemActionProps: getItemActionProps }))), /*#__PURE__*/ wn.createElement(SetDefaultConfirmModal, Object.assign({}, setDefaultModalProps)), /*#__PURE__*/ wn.createElement(DeleteConfirmModal, Object.assign({}, deleteModalProps))); };
 var makeAccordionStyles = makeStylesFactory(function (theme) { return { accordion: { '&.Mui-expanded.Mui-expanded, &.Mui-expanded + &.MuiAccordion-root': { border: '1px solid' }, '&:not(.Mui-expanded) + *': { borderWidth: '0px 1px 1px' }, '&.MuiAccordion-root:before': { display: 'none' }, border: 'solid', borderWidth: '1px 1px 1px' }, accordionDetails: { alignItems: 'flex-start', display: 'flex', flexDirection: 'column', padding: theme.spacing(2) }, accordionExpanded: { '& $accordionSummary': { margin: theme.spacing(1.5, 0) }, minHeight: '0 !important' }, accordionSummary: { alignItems: 'center', display: 'flex', margin: theme.spacing(1.5, 0) } }; });
 var AccordionCore = function AccordionCore(props) { var className = props.className, classes = props.classes, rest = __rest(props, ["className", "classes"]); return /*#__PURE__*/ wn.createElement(MUIAccordion, Object.assign({ className: C(classes.accordion, className) }, rest)); };
 var AccordionSummaryCore = function AccordionSummaryCore(_a) { var classes = _a.classes, props = __rest(_a, ["classes"]); return /*#__PURE__*/ wn.createElement(MUIAccordionSummary, Object.assign({ classes: { content: C(classes.accordionSummary, classes.content), expanded: C(classes.accordionExpanded, classes.expanded) }, expandIcon: /*#__PURE__*/ wn.createElement(ExpandMore$1, null) }, props)); };
 var AccordionDetailsCore = function AccordionDetailsCore(props) { var className = props.className, classes = props.classes, rest = __rest(props, ["className", "classes"]); return /*#__PURE__*/ wn.createElement(MUIAccordionDetails, Object.assign({ className: C(classes.accordionDetails, className) }, rest)); };
-var useStyles = makeAccordionStyles(function (theme) { return { accordion: { '&.Mui-expanded.Mui-expanded, &.Mui-expanded + &.MuiAccordion-root': { borderColor: theme.styleConfig.colors.subtle }, backgroundColor: theme.styleConfig.container.backgroundColor, borderColor: theme.styleConfig.colors.subtle }, accordionDetails: { padding: theme.spacing(3, 3, 3, 7), alignItems: 'stretch' } }; });
-var Accordion = function Accordion(props) { var classes = useStyles(); return /*#__PURE__*/ wn.createElement(AccordionCore, Object.assign({}, props, { classes: classes })); };
-var AccordionSummary = function AccordionSummary(props) { var classes = useStyles(); return /*#__PURE__*/ wn.createElement(AccordionSummaryCore, Object.assign({}, props, { classes: classes })); };
-var AccordionDetails = function AccordionDetails(props) { var classes = useStyles(); return /*#__PURE__*/ wn.createElement(AccordionDetailsCore, Object.assign({}, props, { classes: classes })); };
-var useManualConfigurationState = function useManualConfigurationState(_ref93) { var idp = _ref93.idp, type = _ref93.type; var _h63 = h$4(false), _h64 = _slicedToArray2(_h63, 2), manualConfigurationState = _h64[0], setManualConfigurationState = _h64[1]; var idpRequiresManualConfig = type === 'saml' && idp.metadataUrlLabel === false; var manualConfiguration = manualConfigurationState || idpRequiresManualConfig; return [manualConfiguration, setManualConfigurationState]; };
-var SSONewConnectionConfigureScreen = function SSONewConnectionConfigureScreen(_ref94) { var connectionProp = _ref94.connection; var _a; var _useSsoRouterControll6 = useSsoRouterController(), navigate = _useSsoRouterControll6.navigate; var info = getIdpAndConnectionInfo(connectionProp); var connection = info.connection, idp = info.idp, type = info.type; var connectionDisplayName = connection.display_name; var _useMutateSsoConnecti3 = useMutateSsoConnection(type), mutate = _useMutateSsoConnecti3.mutate; var _useMutateSsoConnecti4 = useMutateSsoConnectionByUrl(), mutateByUrl = _useMutateSsoConnecti4.mutate; var _useSsoRouterControll7 = useSsoRouterController(), useBlockNavigation = _useSsoRouterControll7.useBlockNavigation; var _h65 = h$4(true), _h66 = _slicedToArray2(_h65, 2), block = _h66[0], setBlock = _h66[1]; var _useBlockNavigation2 = useBlockNavigation(block), allowNavigation = _useBlockNavigation2.allowNavigation, blocked = _useBlockNavigation2.blocked, cancelNavigation = _useBlockNavigation2.cancelNavigation; var _useManualConfigurati = useManualConfigurationState(info), _useManualConfigurati2 = _slicedToArray2(_useManualConfigurati, 2), manualConfiguration = _useManualConfigurati2[0], setManualConfiguration = _useManualConfigurati2[1]; var _h67 = h$4(''), _h68 = _slicedToArray2(_h67, 2), metadataUrl = _h68[0], setMetadataUrl = _h68[1]; var _h69 = h$4(''), _h70 = _slicedToArray2(_h69, 2), ssoUrl = _h70[0], setSsoUrl = _h70[1]; var _h71 = h$4(''), _h72 = _slicedToArray2(_h71, 2), entityId = _h72[0], setEntityId = _h72[1]; var _h73 = h$4(''), _h74 = _slicedToArray2(_h73, 2), x509Certificate = _h74[0], setX509Certificate = _h74[1]; var _h75 = h$4(''), _h76 = _slicedToArray2(_h75, 2), clientId = _h76[0], setClientId = _h76[1]; var _h77 = h$4(''), _h78 = _slicedToArray2(_h77, 2), clientSecret = _h78[0], setClientSecret = _h78[1]; var _h79 = h$4(''), _h80 = _slicedToArray2(_h79, 2), issuer = _h80[0], setIssuer = _h80[1]; var _h81 = h$4(''), _h82 = _slicedToArray2(_h81, 2), issuerDerivedValue = _h82[0], setIssuerDerivedValue = _h82[1]; var _h83 = h$4(''), _h84 = _slicedToArray2(_h83, 2), authorizationUrl = _h84[0], setAuthorizationUrl = _h84[1]; var _h85 = h$4(''), _h86 = _slicedToArray2(_h85, 2), tokenUrl = _h86[0], setTokenUrl = _h86[1]; var _h87 = h$4(''), _h88 = _slicedToArray2(_h87, 2), userInfoUrl = _h88[0], setUserInfoUrl = _h88[1]; var _h89 = h$4(''), _h90 = _slicedToArray2(_h89, 2), jwksUrl = _h90[0], setJwksUrl = _h90[1]; var _h91 = h$4({ attributeMapping: { email: 'NameID', first_name: 'firstName', last_name: 'lastName', groups: '' } }), _h92 = _slicedToArray2(_h91, 2), attributeMappingState = _h92[0], setAttributeMappingState = _h92[1]; var attributeMapping = F$3(function () { return Object.fromEntries(Object.entries(attributeMappingState.attributeMapping).filter(function (_ref95) { var _ref96 = _slicedToArray2(_ref95, 2), value = _ref96[1]; return value; })); }, [attributeMappingState.attributeMapping]); var _useToast5 = useToast(), openToast = _useToast5.openToast; var handleSubmit = T$2(function (e) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee15() { var options, message; return _regeneratorRuntime().wrap(function _callee15$(_context16) { while (1)
+var useStyles$3 = makeAccordionStyles(function (theme) { return { accordion: { '&.Mui-expanded.Mui-expanded, &.Mui-expanded + &.MuiAccordion-root': { borderColor: theme.styleConfig.colors.subtle }, backgroundColor: theme.styleConfig.container.backgroundColor, borderColor: theme.styleConfig.colors.subtle }, accordionDetails: { padding: theme.spacing(3, 3, 3, 7), alignItems: 'stretch' } }; });
+var Accordion = function Accordion(props) { var classes = useStyles$3(); return /*#__PURE__*/ wn.createElement(AccordionCore, Object.assign({}, props, { classes: classes })); };
+var AccordionSummary = function AccordionSummary(props) { var classes = useStyles$3(); return /*#__PURE__*/ wn.createElement(AccordionSummaryCore, Object.assign({}, props, { classes: classes })); };
+var AccordionDetails = function AccordionDetails(props) { var classes = useStyles$3(); return /*#__PURE__*/ wn.createElement(AccordionDetailsCore, Object.assign({}, props, { classes: classes })); };
+var useManualConfigurationState = function useManualConfigurationState(_ref97) { var idp = _ref97.idp, type = _ref97.type; var _h67 = h$4(false), _h68 = _slicedToArray2(_h67, 2), manualConfigurationState = _h68[0], setManualConfigurationState = _h68[1]; var idpRequiresManualConfig = type === 'saml' && idp.metadataUrlLabel === false; var manualConfiguration = manualConfigurationState || idpRequiresManualConfig; return [manualConfiguration, setManualConfigurationState]; };
+var SSONewConnectionConfigureScreen = function SSONewConnectionConfigureScreen(_ref98) { var connectionProp = _ref98.connection; var _a; var _useSsoRouterControll6 = useSsoRouterController(), navigate = _useSsoRouterControll6.navigate; var info = getIdpAndConnectionInfo(connectionProp); var connection = info.connection, idp = info.idp, type = info.type; var connectionDisplayName = connection.display_name; var _useMutateSsoConnecti3 = useMutateSsoConnection(type), mutate = _useMutateSsoConnecti3.mutate; var _useMutateSsoConnecti4 = useMutateSsoConnectionByUrl(), mutateByUrl = _useMutateSsoConnecti4.mutate; var _useSsoRouterControll7 = useSsoRouterController(), useBlockNavigation = _useSsoRouterControll7.useBlockNavigation; var _h69 = h$4(true), _h70 = _slicedToArray2(_h69, 2), block = _h70[0], setBlock = _h70[1]; var _useBlockNavigation2 = useBlockNavigation(block), allowNavigation = _useBlockNavigation2.allowNavigation, blocked = _useBlockNavigation2.blocked, cancelNavigation = _useBlockNavigation2.cancelNavigation; var _useManualConfigurati = useManualConfigurationState(info), _useManualConfigurati2 = _slicedToArray2(_useManualConfigurati, 2), manualConfiguration = _useManualConfigurati2[0], setManualConfiguration = _useManualConfigurati2[1]; var _h71 = h$4(''), _h72 = _slicedToArray2(_h71, 2), metadataUrl = _h72[0], setMetadataUrl = _h72[1]; var _h73 = h$4(''), _h74 = _slicedToArray2(_h73, 2), ssoUrl = _h74[0], setSsoUrl = _h74[1]; var _h75 = h$4(''), _h76 = _slicedToArray2(_h75, 2), entityId = _h76[0], setEntityId = _h76[1]; var _h77 = h$4(''), _h78 = _slicedToArray2(_h77, 2), x509Certificate = _h78[0], setX509Certificate = _h78[1]; var _h79 = h$4(''), _h80 = _slicedToArray2(_h79, 2), clientId = _h80[0], setClientId = _h80[1]; var _h81 = h$4(''), _h82 = _slicedToArray2(_h81, 2), clientSecret = _h82[0], setClientSecret = _h82[1]; var _h83 = h$4(''), _h84 = _slicedToArray2(_h83, 2), issuer = _h84[0], setIssuer = _h84[1]; var _h85 = h$4(''), _h86 = _slicedToArray2(_h85, 2), issuerDerivedValue = _h86[0], setIssuerDerivedValue = _h86[1]; var _h87 = h$4(''), _h88 = _slicedToArray2(_h87, 2), authorizationUrl = _h88[0], setAuthorizationUrl = _h88[1]; var _h89 = h$4(''), _h90 = _slicedToArray2(_h89, 2), tokenUrl = _h90[0], setTokenUrl = _h90[1]; var _h91 = h$4(''), _h92 = _slicedToArray2(_h91, 2), userInfoUrl = _h92[0], setUserInfoUrl = _h92[1]; var _h93 = h$4(''), _h94 = _slicedToArray2(_h93, 2), jwksUrl = _h94[0], setJwksUrl = _h94[1]; var _h95 = h$4({ attributeMapping: { email: 'NameID', first_name: 'firstName', last_name: 'lastName', groups: '' } }), _h96 = _slicedToArray2(_h95, 2), attributeMappingState = _h96[0], setAttributeMappingState = _h96[1]; var attributeMapping = F$3(function () { return Object.fromEntries(Object.entries(attributeMappingState.attributeMapping).filter(function (_ref99) { var _ref100 = _slicedToArray2(_ref99, 2), value = _ref100[1]; return value; })); }, [attributeMappingState.attributeMapping]); var _useToast5 = useToast(), openToast = _useToast5.openToast; var handleSubmit = T$2(function (e) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee15() { var options, message; return _regeneratorRuntime().wrap(function _callee15$(_context16) { while (1)
     switch (_context16.prev = _context16.next) {
         case 0:
             e.preventDefault();
@@ -9436,8 +10018,8 @@ var SSONewConnectionConfigureScreen = function SSONewConnectionConfigureScreen(_
             openToast({ text: message || 'Unable to save connection', type: 'error' });
         case 30:
         case "end": return _context16.stop();
-    } }, _callee15, null, [[3, 26]]); })); }, [connection, type, navigate, manualConfiguration, mutate, ssoUrl, entityId, x509Certificate, attributeMapping, metadataUrl, mutateByUrl, clientId, clientSecret, idp, issuerDerivedValue, issuer, authorizationUrl, tokenUrl, userInfoUrl, jwksUrl, openToast]); var idpValueInputs = type === 'saml' ? { ssoUrl: ( /*#__PURE__*/wn.createElement(Input, { label: idp.idpSsoUrlLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.idpSsoUrlLabel), value: ssoUrl, onChange: setSsoUrl })), entityId: ( /*#__PURE__*/wn.createElement(Input, { label: idp.idpEntityIdLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.idpEntityIdLabel), value: entityId, onChange: setEntityId })), certificate: ( /*#__PURE__*/wn.createElement(Input, { label: idp.x509CertificateLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.x509CertificateLabel), value: x509Certificate, onChange: setX509Certificate })) } : undefined; var stepMap = { copyToIdp: ( /*#__PURE__*/wn.createElement(Accordion, null, /*#__PURE__*/ wn.createElement(AccordionSummary, null, /*#__PURE__*/ wn.createElement(Typography, null, "Copy the following App values to your IdP.")), /*#__PURE__*/ wn.createElement(AccordionDetails, null, /*#__PURE__*/ wn.createElement(SettingsList, null, /*#__PURE__*/ wn.createElement(AppDetails, { connection: connection }))))), copyFromIdp: ( /*#__PURE__*/wn.createElement(Accordion, null, /*#__PURE__*/ wn.createElement(AccordionSummary, null, /*#__PURE__*/ wn.createElement(Typography, null, "Enter the following IdP values.")), /*#__PURE__*/ wn.createElement(AccordionDetails, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, type === 'saml' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, manualConfiguration && idpValueInputs ? idp.idpValueOrder.map(function (key) { return /*#__PURE__*/ wn.createElement(wn.Fragment, { key: key }, idpValueInputs[key]); }) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement("label", null, /*#__PURE__*/ wn.createElement(Typography, null, "Enter the ", idp.metadataUrlLabel, " to configure your connection automatically."), /*#__PURE__*/ wn.createElement(Input, { placeholder: "Enter ".concat(idp.metadataUrlLabel), caption: "If you don\u2019t know your ".concat(idp.metadataUrlLabel, ", you can configure your connection manually."), value: metadataUrl, onChange: setMetadataUrl })))), !!idp.metadataUrlLabel && ( /*#__PURE__*/wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat(idp.metadataUrlLabel) : 'Configure manually')))), type === 'oidc' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Input, { label: idp.clientIdLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.clientIdLabel), value: clientId, onChange: setClientId }), /*#__PURE__*/ wn.createElement(Input, { label: idp.clientSecretLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.clientSecretLabel), value: clientSecret, onChange: setClientSecret }), idp.transformInputToIssuer ? ( /*#__PURE__*/wn.createElement(Input, { label: idp.issuerDerivedLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.issuerDerivedLabel), value: issuerDerivedValue, onChange: setIssuerDerivedValue })) : ( /*#__PURE__*/wn.createElement(Input, { label: idp.issuerLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.issuerLabel), value: issuer, onChange: setIssuer })), manualConfiguration && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Input, { label: "Authorization URL", labelVariant: "body1", placeholder: "Enter Authorization URL", value: authorizationUrl, onChange: setAuthorizationUrl }), /*#__PURE__*/ wn.createElement(Input, { label: "Token URL", labelVariant: "body1", placeholder: "Enter Token URL", value: tokenUrl, onChange: setTokenUrl }), /*#__PURE__*/ wn.createElement(Input, { label: "User Info URL", labelVariant: "body1", placeholder: "Enter User Info", value: userInfoUrl, onChange: setUserInfoUrl }), /*#__PURE__*/ wn.createElement(Input, { label: "JWKS URL", labelVariant: "body1", placeholder: "Enter JWKS URL", value: jwksUrl, onChange: setJwksUrl }))), /*#__PURE__*/ wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat((_a = idp.issuerDerivedLabel) !== null && _a !== void 0 ? _a : idp.issuerLabel) : 'Configure manually'))))))), attributeMapping: type === 'saml' && ( /*#__PURE__*/wn.createElement(Accordion, null, /*#__PURE__*/ wn.createElement(AccordionSummary, null, /*#__PURE__*/ wn.createElement(Typography, null, "Set your ", idp.attributeMappingLabel, ".")), /*#__PURE__*/ wn.createElement(AccordionDetails, null, /*#__PURE__*/ wn.createElement(Typography, null, "The following values are automatically filled based on your IdP. Make changes or add custom mappings."), /*#__PURE__*/ wn.createElement(AttributeMappingTable, { editing: true, localState: attributeMappingState, setLocalState: setAttributeMappingState, remoteState: attributeMappingState })))) }; var steps = idp.setupOrder.map(function (step) { return /*#__PURE__*/ wn.createElement(wn.Fragment, { key: step }, stepMap[step]); }); return /*#__PURE__*/ wn.createElement("form", { onSubmit: handleSubmit }, /*#__PURE__*/ wn.createElement(Modal, { isOpen: block && blocked, close: cancelNavigation, confirm: function confirm() { allowNavigation(); return Promise.resolve(); }, title: "Save ".concat(connectionDisplayName, "?"), confirmButtonText: "Save and complete later", description: 'Your SSO connection is not fully configured. It will remain pending until you complete all necessary configuration steps. You can save your progress and complete later or cancel to finish configuration.' }), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { navigate({ screen: 'connectionsList' }); }, startIcon: /*#__PURE__*/ wn.createElement(ChevronLeft, null) }, "Back to all SSO connections"), /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "Configure ", connectionDisplayName), /*#__PURE__*/ wn.createElement("div", null, steps), /*#__PURE__*/ wn.createElement(FlexBox, { justifyContent: "flex-end" }, /*#__PURE__*/ wn.createElement(Button, { type: "submit" }, "Create")))); };
-var SSONewConnectionScreen = function SSONewConnectionScreen() { var _useSsoRouterControll8 = useSsoRouterController(), navigate = _useSsoRouterControll8.navigate; var _h93 = h$4(''), _h94 = _slicedToArray2(_h93, 2), displayName = _h94[0], setDisplayName = _h94[1]; var _h95 = h$4(), _h96 = _slicedToArray2(_h95, 2), idp = _h96[0], setIdp = _h96[1]; var canCreate = displayName && idp; var client = useStytchClient(); var _useSWRConfig4 = useSWRConfig(), mutate = _useSWRConfig4.mutate; var revalidateConnectionList = useRevalidateConnectionList(); var handleSubmit = T$2(function (e) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee17() { var _idpOptions$idp, idpName, type, response; return _regeneratorRuntime().wrap(function _callee17$(_context18) { while (1)
+    } }, _callee15, null, [[3, 26]]); })); }, [connection, type, navigate, manualConfiguration, mutate, ssoUrl, entityId, x509Certificate, attributeMapping, metadataUrl, mutateByUrl, clientId, clientSecret, idp, issuerDerivedValue, issuer, authorizationUrl, tokenUrl, userInfoUrl, jwksUrl, openToast]); var idpValueInputs = type === 'saml' ? { ssoUrl: ( /*#__PURE__*/wn.createElement(Input$1, { label: idp.idpSsoUrlLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.idpSsoUrlLabel), value: ssoUrl, onChange: setSsoUrl })), entityId: ( /*#__PURE__*/wn.createElement(Input$1, { label: idp.idpEntityIdLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.idpEntityIdLabel), value: entityId, onChange: setEntityId })), certificate: ( /*#__PURE__*/wn.createElement(Input$1, { label: idp.x509CertificateLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.x509CertificateLabel), value: x509Certificate, onChange: setX509Certificate })) } : undefined; var stepMap = { copyToIdp: ( /*#__PURE__*/wn.createElement(Accordion, null, /*#__PURE__*/ wn.createElement(AccordionSummary, null, /*#__PURE__*/ wn.createElement(Typography, null, "Copy the following App values to your IdP.")), /*#__PURE__*/ wn.createElement(AccordionDetails, null, /*#__PURE__*/ wn.createElement(SettingsList, null, /*#__PURE__*/ wn.createElement(AppDetails, { connection: connection }))))), copyFromIdp: ( /*#__PURE__*/wn.createElement(Accordion, null, /*#__PURE__*/ wn.createElement(AccordionSummary, null, /*#__PURE__*/ wn.createElement(Typography, null, "Enter the following IdP values.")), /*#__PURE__*/ wn.createElement(AccordionDetails, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, type === 'saml' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, manualConfiguration && idpValueInputs ? idp.idpValueOrder.map(function (key) { return /*#__PURE__*/ wn.createElement(wn.Fragment, { key: key }, idpValueInputs[key]); }) : ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement("label", null, /*#__PURE__*/ wn.createElement(Typography, null, "Enter the ", idp.metadataUrlLabel, " to configure your connection automatically."), /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Enter ".concat(idp.metadataUrlLabel), caption: "If you don\u2019t know your ".concat(idp.metadataUrlLabel, ", you can configure your connection manually."), value: metadataUrl, onChange: setMetadataUrl })))), !!idp.metadataUrlLabel && ( /*#__PURE__*/wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat(idp.metadataUrlLabel) : 'Configure manually')))), type === 'oidc' && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Input$1, { label: idp.clientIdLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.clientIdLabel), value: clientId, onChange: setClientId }), /*#__PURE__*/ wn.createElement(Input$1, { label: idp.clientSecretLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.clientSecretLabel), value: clientSecret, onChange: setClientSecret }), idp.transformInputToIssuer ? ( /*#__PURE__*/wn.createElement(Input$1, { label: idp.issuerDerivedLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.issuerDerivedLabel), value: issuerDerivedValue, onChange: setIssuerDerivedValue })) : ( /*#__PURE__*/wn.createElement(Input$1, { label: idp.issuerLabel, labelVariant: "body1", placeholder: "Enter ".concat(idp.issuerLabel), value: issuer, onChange: setIssuer })), manualConfiguration && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Input$1, { label: "Authorization URL", labelVariant: "body1", placeholder: "Enter Authorization URL", value: authorizationUrl, onChange: setAuthorizationUrl }), /*#__PURE__*/ wn.createElement(Input$1, { label: "Token URL", labelVariant: "body1", placeholder: "Enter Token URL", value: tokenUrl, onChange: setTokenUrl }), /*#__PURE__*/ wn.createElement(Input$1, { label: "User Info URL", labelVariant: "body1", placeholder: "Enter User Info", value: userInfoUrl, onChange: setUserInfoUrl }), /*#__PURE__*/ wn.createElement(Input$1, { label: "JWKS URL", labelVariant: "body1", placeholder: "Enter JWKS URL", value: jwksUrl, onChange: setJwksUrl }))), /*#__PURE__*/ wn.createElement(Button, { compact: true, variant: "ghost", onClick: function onClick() { setManualConfiguration(!manualConfiguration); } }, manualConfiguration ? "Configure using ".concat((_a = idp.issuerDerivedLabel) !== null && _a !== void 0 ? _a : idp.issuerLabel) : 'Configure manually'))))))), attributeMapping: type === 'saml' && ( /*#__PURE__*/wn.createElement(Accordion, null, /*#__PURE__*/ wn.createElement(AccordionSummary, null, /*#__PURE__*/ wn.createElement(Typography, null, "Set your ", idp.attributeMappingLabel, ".")), /*#__PURE__*/ wn.createElement(AccordionDetails, null, /*#__PURE__*/ wn.createElement(Typography, null, "The following values are automatically filled based on your IdP. Make changes or add custom mappings."), /*#__PURE__*/ wn.createElement(AttributeMappingTable, { editing: true, localState: attributeMappingState, setLocalState: setAttributeMappingState, remoteState: attributeMappingState })))) }; var steps = idp.setupOrder.map(function (step) { return /*#__PURE__*/ wn.createElement(wn.Fragment, { key: step }, stepMap[step]); }); return /*#__PURE__*/ wn.createElement("form", { onSubmit: handleSubmit }, /*#__PURE__*/ wn.createElement(Modal, { isOpen: block && blocked, close: cancelNavigation, confirm: function confirm() { allowNavigation(); return Promise.resolve(); }, title: "Save ".concat(connectionDisplayName, "?"), confirmButtonText: "Save and complete later", description: 'Your SSO connection is not fully configured. It will remain pending until you complete all necessary configuration steps. You can save your progress and complete later or cancel to finish configuration.' }), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { navigate({ screen: 'connectionsList' }); }, startIcon: /*#__PURE__*/ wn.createElement(ChevronLeft, null) }, "Back to all SSO connections"), /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "Configure ", connectionDisplayName), /*#__PURE__*/ wn.createElement("div", null, steps), /*#__PURE__*/ wn.createElement(FlexBox, { justifyContent: "flex-end" }, /*#__PURE__*/ wn.createElement(Button, { type: "submit" }, "Create")))); };
+var SSONewConnectionScreen = function SSONewConnectionScreen() { var _useSsoRouterControll8 = useSsoRouterController(), navigate = _useSsoRouterControll8.navigate; var _h97 = h$4(''), _h98 = _slicedToArray2(_h97, 2), displayName = _h98[0], setDisplayName = _h98[1]; var _h99 = h$4(), _h100 = _slicedToArray2(_h99, 2), idp = _h100[0], setIdp = _h100[1]; var canCreate = displayName && idp; var client = useStytchClient(); var _useSWRConfig4 = useSWRConfig(), mutate = _useSWRConfig4.mutate; var revalidateConnectionList = useRevalidateConnectionList(); var handleSubmit = T$2(function (e) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee17() { var _idpOptions$idp, idpName, type, response; return _regeneratorRuntime().wrap(function _callee17$(_context18) { while (1)
     switch (_context18.prev = _context18.next) {
         case 0:
             e.preventDefault();
@@ -9476,10 +10058,10 @@ var SSONewConnectionScreen = function SSONewConnectionScreen() { var _useSsoRout
         }
         case 10:
         case "end": return _context18.stop();
-    } }, _callee17); })); }, [canCreate, client.sso.oidc, client.sso.saml, idp, displayName, mutate, navigate, revalidateConnectionList]); return /*#__PURE__*/ wn.createElement("form", { onSubmit: handleSubmit }, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { navigate({ screen: 'connectionsList' }); }, startIcon: /*#__PURE__*/ wn.createElement(ChevronLeft, null) }, "Back to all SSO connections"), /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "New SSO Connection"), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, /*#__PURE__*/ wn.createElement(Typography, null, "Set a display name for your connection."), /*#__PURE__*/ wn.createElement(Input, { placeholder: "Text", value: displayName, onChange: setDisplayName, caption: "You will be able to edit this again in the future." })), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, /*#__PURE__*/ wn.createElement(Typography, null, "Select your identity provider or choose to configure a custom SAML / OIDC connection."), /*#__PURE__*/ wn.createElement(Select, { placeholder: "Select", selectItems: idpSelectItems, value: idp, onChange: setIdp }), /*#__PURE__*/ wn.createElement(Typography, null, "Once you click \u201CCreate\u201D the SSO connection will be created. If you need to change the connection type after this, you will need to start over.")), /*#__PURE__*/ wn.createElement(FlexBox, { justifyContent: "space-between" }, /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", onClick: function onClick() { navigate({ screen: 'connectionsList' }); } }, "Cancel"), /*#__PURE__*/ wn.createElement(Button, { type: "submit", disabled: !canCreate }, "Create")))); };
-var routeMap = { connectionDetails: SSOConnectionDetailsScreen, connectionsList: SSOConnectionsScreen, newConnection: SSONewConnectionScreen, newConnectionConfigure: SSONewConnectionConfigureScreen };
-var initialRoute = { screen: 'connectionsList' };
-var Content = function Content() { var _useAdminPortalConfig2 = useAdminPortalConfig(), adminPortalConfig = _useAdminPortalConfig2.data, adminPortalConfigError = _useAdminPortalConfig2.error; var _useRbac11 = useRbac('stytch.sso', 'get'), canGetSso = _useRbac11.data; if (adminPortalConfigError) {
+    } }, _callee17); })); }, [canCreate, client.sso.oidc, client.sso.saml, idp, displayName, mutate, navigate, revalidateConnectionList]); return /*#__PURE__*/ wn.createElement("form", { onSubmit: handleSubmit }, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", compact: true, onClick: function onClick() { navigate({ screen: 'connectionsList' }); }, startIcon: /*#__PURE__*/ wn.createElement(ChevronLeft, null) }, "Back to all SSO connections"), /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "New SSO Connection"), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, /*#__PURE__*/ wn.createElement(Typography, null, "Set a display name for your connection."), /*#__PURE__*/ wn.createElement(Input$1, { placeholder: "Text", value: displayName, onChange: setDisplayName, caption: "You will be able to edit this again in the future." })), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, /*#__PURE__*/ wn.createElement(Typography, null, "Select your identity provider or choose to configure a custom SAML / OIDC connection."), /*#__PURE__*/ wn.createElement(Select, { placeholder: "Select", selectItems: idpSelectItems, value: idp, onChange: setIdp }), /*#__PURE__*/ wn.createElement(Typography, null, "Once you click \u201CCreate\u201D the SSO connection will be created. If you need to change the connection type after this, you will need to start over.")), /*#__PURE__*/ wn.createElement(FlexBox, { justifyContent: "space-between" }, /*#__PURE__*/ wn.createElement(Button, { variant: "ghost", onClick: function onClick() { navigate({ screen: 'connectionsList' }); } }, "Cancel"), /*#__PURE__*/ wn.createElement(Button, { type: "submit", disabled: !canCreate }, "Create")))); };
+var routeMap$1 = { connectionDetails: SSOConnectionDetailsScreen, connectionsList: SSOConnectionsScreen, newConnection: SSONewConnectionScreen, newConnectionConfigure: SSONewConnectionConfigureScreen };
+var initialRoute$1 = { screen: 'connectionsList' };
+var Content$1 = function Content$1() { var _useAdminPortalConfig2 = useAdminPortalConfig(), adminPortalConfig = _useAdminPortalConfig2.data, adminPortalConfigError = _useAdminPortalConfig2.error; var _useRbac13 = useRbac('stytch.sso', 'get'), canGetSso = _useRbac13.data; if (adminPortalConfigError) {
     return /*#__PURE__*/ wn.createElement(Alert, null, "SSO Connections could not be loaded. Please contact your admin if you think this is a mistake.");
 } if (canGetSso === undefined || !adminPortalConfig) {
     return /*#__PURE__*/ wn.createElement(PageLoadingIndicator, null);
@@ -9487,9 +10069,251 @@ var Content = function Content() { var _useAdminPortalConfig2 = useAdminPortalCo
     return /*#__PURE__*/ wn.createElement(Alert, null, "You do not have permission to view SSO Connections. Please contact your admin if you think this is a mistake.");
 } if (!adminPortalConfig.sso_config.sso_enabled) {
     return /*#__PURE__*/ wn.createElement(Alert, null, "SSO Connections are not supported. Please contact your admin if you think this is a mistake.");
-} return /*#__PURE__*/ wn.createElement(SsoRouterProvider, { initialRoute: initialRoute }, /*#__PURE__*/ wn.createElement(SsoRouter, { routeMap: routeMap })); };
-var AdminPortalSSO$1 = function AdminPortalSSO(props) { var initialClient = _$1(props.client); p$3(function () { readB2BInternals(initialClient.current).networkClient.logEvent({ name: 'render_b2b_admin_portal_sso', details: {} }); }, []); return /*#__PURE__*/ wn.createElement(AdminPortalWrapper, { options: props }, /*#__PURE__*/ wn.createElement(Content, null)); };
+} return /*#__PURE__*/ wn.createElement(SsoRouterProvider, { initialRoute: initialRoute$1 }, /*#__PURE__*/ wn.createElement(SsoRouter, { routeMap: routeMap$1 })); };
+var AdminPortalSSO$1 = function AdminPortalSSO(props) { var initialClient = _$1(props.client); p$3(function () { readB2BInternals(initialClient.current).networkClient.logEvent({ name: 'render_b2b_admin_portal_sso', details: {} }); }, []); return /*#__PURE__*/ wn.createElement(AdminPortalWrapper, { options: props }, /*#__PURE__*/ wn.createElement(Content$1, null)); };
 var mountAdminPortalSSO = makeAdminPortalComponentMountFn(AdminPortalSSO$1, 'stytch-b2b-admin-portal-sso-ui', 'mountAdminPortalSSO');
+var _createRouter2 = createRouter(), OrgSettingsRouterProvider = _createRouter2.RouterProvider, OrgSettingsRouter = _createRouter2.Router, useOrgSettingsRouterController = _createRouter2.useRouterController;
+var isEmptyObject = function isEmptyObject(value) { for (var prop in value) {
+    if (Object.prototype.hasOwnProperty.call(value, prop)) {
+        return false;
+    }
+} return true; };
+var useMutateOrgSettingsDetails = function useMutateOrgSettingsDetails() { var _useMutateOrganizatio3 = useMutateOrganization(), mutate = _useMutateOrganizatio3.mutate; var setOrgDetails = function setOrgDetails(_ref101) { var organizationName = _ref101.organizationName, organizationSlug = _ref101.organizationSlug; return mutate(Object.assign(Object.assign({}, organizationName && { organization_name: organizationName }), organizationSlug && { organization_slug: organizationSlug }), { errorMessage: 'Failed to update organization details.' }); }; return { setOrgDetails: setOrgDetails }; };
+var OrgSettingsDetailsBody = function OrgSettingsDetailsBody(_ref102) { var canSetName = _ref102.canSetName, canSetSlug = _ref102.canSetSlug, remoteState = _ref102.remoteState, localState = _ref102.localState, setLocalState = _ref102.setLocalState; var handleNameChange = useStateSliceSetter(setLocalState, 'organizationName'); var handleSlugChange = useStateSliceSetter(setLocalState, 'organizationSlug'); var _useSettingsContainer4 = useSettingsContainer(), editing = _useSettingsContainer4.editing; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsList, null, /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Name" }, editing && canSetName ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter Name", value: localState.organizationName, onChange: handleNameChange })) : ( /*#__PURE__*/wn.createElement(Typography, { variant: "body2", color: "secondary" }, remoteState.organizationName))), /*#__PURE__*/ wn.createElement(SettingsListItem, { title: "Slug" }, editing && canSetSlug ? ( /*#__PURE__*/wn.createElement(Input$1, { placeholder: "Enter Slug", value: localState.organizationSlug, onChange: handleSlugChange })) : ( /*#__PURE__*/wn.createElement(Typography, { variant: "body2", color: "secondary" }, remoteState.organizationSlug))))); };
+var OrgSettingsDetailsSection = function OrgSettingsDetailsSection(_ref103) { var orgInfo = _ref103.orgInfo; var _useRbac14 = useRbac('stytch.organization', 'update.info.name'), canSetName = _useRbac14.data; var _useRbac15 = useRbac('stytch.organization', 'update.info.slug'), canSetSlug = _useRbac15.data; var remoteState = F$3(function () { return { organizationName: orgInfo.organization_name, organizationSlug: orgInfo.organization_slug }; }, [orgInfo]); var _useFormState4 = useFormState({ remoteState: remoteState }), localState = _useFormState4.localState, setLocalState = _useFormState4.setLocalState, editing = _useFormState4.editing, handleSetEditing = _useFormState4.handleSetEditing; var _useOrgSettingsRouter = useOrgSettingsRouterController(), useBlockNavigation = _useOrgSettingsRouter.useBlockNavigation; var _useMutateOrgSettings = useMutateOrgSettingsDetails(), setOrgDetails = _useMutateOrgSettings.setOrgDetails; var findMutatedProperties = T$2(function () { var mutatedProperties = {}; if (remoteState.organizationName !== localState.organizationName && localState.organizationName.length > 0) {
+    mutatedProperties.organizationName = localState.organizationName;
+} if (remoteState.organizationSlug !== localState.organizationSlug && localState.organizationSlug.length > 0) {
+    mutatedProperties.organizationSlug = localState.organizationSlug;
+} return mutatedProperties; }, [localState.organizationName, localState.organizationSlug, remoteState.organizationName, remoteState.organizationSlug]); var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee18() { var mutatedProperties; return _regeneratorRuntime().wrap(function _callee18$(_context19) { while (1)
+    switch (_context19.prev = _context19.next) {
+        case 0:
+            mutatedProperties = findMutatedProperties();
+            if (isEmptyObject(mutatedProperties)) {
+                _context19.next = 4;
+                break;
+            }
+            _context19.next = 4;
+            return setOrgDetails({ organizationName: mutatedProperties.organizationName, organizationSlug: mutatedProperties.organizationSlug });
+        case 4: return _context19.abrupt("return");
+        case 5:
+        case "end": return _context19.stop();
+    } }, _callee18); })); }, [setOrgDetails, findMutatedProperties]); var disableSave = isEmptyObject(findMutatedProperties()); return /*#__PURE__*/ wn.createElement(SettingsContainer, { title: "Details", hasCTA: canSetName || canSetSlug, onSave: handleSave, useBlockNavigation: useBlockNavigation, editing: editing, setEditing: handleSetEditing, disableSave: disableSave }, /*#__PURE__*/ wn.createElement(OrgSettingsDetailsBody, { canSetName: canSetName, canSetSlug: canSetSlug, localState: localState, remoteState: remoteState, setLocalState: setLocalState })); };
+var makeRowStyles = makeStyles(function () { return { rowItemContainer: { maxWidth: DEFAULT_GRID_COLUMN_WIDTH }, rowItemFullWidth: { maxWidth: DEFAULT_MAX_ITEM_WIDTH } }; });
+var RowItemCore = function RowItemCore(_ref104) { var children = _ref104.children, fullWidth = _ref104.fullWidth; var classes = makeRowStyles(); return /*#__PURE__*/ wn.createElement("div", { className: C(classes.rowItemContainer, _defineProperty2({}, classes.rowItemFullWidth, fullWidth)) }, children); };
+var useStyles$2 = makeStyles(function (theme) { var primary = theme.styleConfig.buttons.primary.backgroundColor; var secondary = theme.styleConfig.colors.secondary; var containerBackground = theme.styleConfig.container.backgroundColor; return { root: { width: 46, height: 31, padding: 8, overflow: 'hidden', display: 'flex', boxSizing: 'border-box' }, switchBase: { margin: '2px 3px', '&$checked': { margin: '2px -3px', '& + .MuiSwitch-track': { opacity: 1, backgroundColor: primary } }, '&.Mui-disabled': { '& .MuiSwitch-thumb': { color: secondary }, '& + .MuiSwitch-track': { border: '3px solid', borderColor: secondary, opacity: 1, backgroundColor: containerBackground }, '&$checked': { '& + .MuiSwitch-track': { opacity: 1, backgroundColor: secondary }, '& .MuiSwitch-thumb': { color: containerBackground } } }, '&$checked $thumb': { color: containerBackground } }, thumb: { height: 7, width: 7, margin: 1, boxShadow: 'none', color: primary }, colorSecondary: { '&:hover': { backgroundColor: alpha(containerBackground, 0) }, '&$checked': { '&:hover': { backgroundColor: alpha(containerBackground, 0) } } }, track: { border: '3px solid', borderColor: primary, backgroundColor: containerBackground, borderRadius: 30 / 2, height: 9, opacity: 1 }, checked: {}, disabled: {} }; });
+var stopPropagateOnClick = function stopPropagateOnClick(e) { e.stopPropagation(); };
+var Switch = function Switch(_ref105) { var checked = _ref105.checked, label = _ref105.label, onChange = _ref105.onChange, readOnly = _ref105.readOnly; var classes = useStyles$2(); var handleChange = function handleChange(e) { onChange === null || onChange === void 0 ? void 0 : onChange(e.target.checked); }; return /*#__PURE__*/ wn.createElement(RowItemCore, { fullWidth: true }, /*#__PURE__*/ wn.createElement(FormControlLabel$1, { control: /*#__PURE__*/ wn.createElement(MUISwitch, { "aria-label": "".concat(checked ? 'Disable' : 'Enable', " ").concat(label), checked: checked, classes: classes, disableFocusRipple: true, disableRipple: true, disableTouchRipple: true, disabled: readOnly, onChange: handleChange, onClick: stopPropagateOnClick }), disabled: readOnly, label: /*#__PURE__*/ wn.createElement(FlexBox, null, label && ( /*#__PURE__*/wn.createElement(Typography, { variant: 'body2', disabled: readOnly }, label))) })); };
+var makeCheckboxStyles = makeStylesFactory(function (theme) { return { checkbox: { '&:hover, &.Mui-checked:hover': { backgroundColor: 'transparent' }, '&.MuiCheckbox-root': { padding: 0 }, marginRight: theme.spacing(0.5), marginTop: theme.spacing(0.5) }, checkboxContainer: { display: 'flex', alignItems: 'flex-start', marginLeft: theme.spacing(-0.25), width: 'fit-content' } }; });
+var CheckboxCore = function CheckboxCore(_ref106) { var autoFocus = _ref106.autoFocus, checked = _ref106.checked, disabled = _ref106.disabled, indeterminate = _ref106.indeterminate, label = _ref106.label, onClick = _ref106.onClick, value = _ref106.value, classes = _ref106.classes; var handleChange = function handleChange(e) { onClick === null || onClick === void 0 ? void 0 : onClick(e.target.checked, e.target.name); }; return /*#__PURE__*/ wn.createElement(FormControlLabel$1, { className: classes.checkboxContainer, control: /*#__PURE__*/ wn.createElement(MUICheckbox, { autoFocus: autoFocus, checked: checked, className: classes.checkbox, color: "primary", disableRipple: true, indeterminate: indeterminate, name: value, onChange: handleChange, size: "small" }), disabled: disabled, label: label && ( /*#__PURE__*/wn.createElement("div", { style: { paddingTop: '4px' } }, /*#__PURE__*/ wn.createElement(Typography, { variant: 'body2', disabled: disabled }, label))) }); };
+var useStyles$1 = makeCheckboxStyles(function (theme) { return { checkbox: { '&.MuiCheckbox-root': { padding: 0, color: theme.styleConfig.colors.primary, '&.Mui-disabled': { color: theme.styleConfig.colors.secondary } } } }; });
+var Checkbox = function Checkbox(_a) { var props = __rest(_a, []); var classes = useStyles$1(); return /*#__PURE__*/ wn.createElement(CheckboxCore, Object.assign({}, props, { classes: classes })); };
+var PaddingLeft = He.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding-left: 34px;\n"])));
+var arraysHaveSameContents = function arraysHaveSameContents(arr1, arr2) { if (Array.isArray(arr1) && Array.isArray(arr2)) {
+    if (arr1.length !== arr2.length) {
+        return false;
+    }
+    var array2Sorted = arr2.slice().sort();
+    var isEqual = arr1.slice().sort().every(function (value, index) { return JSON.stringify(value) === JSON.stringify(array2Sorted[index]); });
+    if (!isEqual)
+        return false;
+    return true;
+} return false; };
+var allowedAuthMethodsLabelMap = { magic_link: 'Email Magic Links', sso: 'Single Sign-On', google_oauth: 'Google OAuth', microsoft_oauth: 'Microsoft OAuth', password: 'Password' };
+var allowedMfaMethodsLabelMap = { sms_otp: 'SMS OTP', totp: 'TOTP' };
+var useMutateAuthSettings$1 = function useMutateAuthSettings$1() { var _useMutateOrganizatio4 = useMutateOrganization(), mutate = _useMutateOrganizatio4.mutate; var setOrgAuthSettings = function setOrgAuthSettings(mutatedProperties) { return mutate(mutatedProperties, { errorMessage: 'Failed to update authorization details.' }); }; return { setOrgAuthSettings: setOrgAuthSettings }; };
+var OrgSettingsAuthenticationSettingsBody = function OrgSettingsAuthenticationSettingsBody(_ref107) { var orgConfigAuthMethods = _ref107.orgConfigAuthMethods, orgConfigMfaMethods = _ref107.orgConfigMfaMethods, canSetAllowedAuthMethods = _ref107.canSetAllowedAuthMethods, canSetMfaPolicy = _ref107.canSetMfaPolicy, canSetAllowedMfaMethods = _ref107.canSetAllowedMfaMethods, mfaPolicyConfig = _ref107.mfaPolicyConfig, localState = _ref107.localState, setLocalState = _ref107.setLocalState; var _useSettingsContainer5 = useSettingsContainer(), editing = _useSettingsContainer5.editing; var handlePrimaryAuthChange = function handlePrimaryAuthChange(value) { setLocalState(function (prevState) { return Object.assign(Object.assign({}, prevState), { isPrimaryAuthAllAllowed: value }); }); }; var handleMfaPolicyChange = function handleMfaPolicyChange(value) { setLocalState(function (prevState) { return Object.assign(Object.assign({}, prevState), { isMfaPolicyRequiredForAll: value }); }); }; var handleSecondaryAuthChange = function handleSecondaryAuthChange(value) { setLocalState(function (prevState) { return Object.assign(Object.assign({}, prevState), { isSecondaryAuthAllAllowed: value }); }); }; var isAuthMethodChecked = function isAuthMethodChecked(authMethod) { var _a; return (_a = localState.allowedAuthMethods) === null || _a === void 0 ? void 0 : _a.includes(authMethod); }; var isMfaMethodChecked = function isMfaMethodChecked(mfaMethod) { var _a; return (_a = localState.allowedMfaMethods) === null || _a === void 0 ? void 0 : _a.includes(mfaMethod); }; var handleAllowedAuthMethodClick = function handleAllowedAuthMethodClick(authMethod) { if (localState.allowedAuthMethods.includes(authMethod)) {
+    setLocalState(function (prevState) { return Object.assign(Object.assign({}, prevState), { allowedAuthMethods: prevState.allowedAuthMethods.filter(function (method) { return method !== authMethod; }) }); });
+}
+else {
+    setLocalState(function (prevState) { return Object.assign(Object.assign({}, prevState), { allowedAuthMethods: [].concat(_toConsumableArray2(prevState.allowedAuthMethods), [authMethod]) }); });
+} }; var handleAllowedMfaMethodClick = function handleAllowedMfaMethodClick(mfaMethod) { if (localState.allowedMfaMethods.includes(mfaMethod)) {
+    setLocalState(function (prevState) { var _a; return Object.assign(Object.assign({}, prevState), { allowedMfaMethods: (_a = prevState.allowedMfaMethods) === null || _a === void 0 ? void 0 : _a.filter(function (method) { return method !== mfaMethod; }) }); });
+}
+else {
+    setLocalState(function (prevState) { var _a; return Object.assign(Object.assign({}, prevState), { allowedMfaMethods: [].concat(_toConsumableArray2((_a = prevState === null || prevState === void 0 ? void 0 : prevState.allowedMfaMethods) !== null && _a !== void 0 ? _a : []), [mfaMethod]) }); });
+} }; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Primary authentication" }, editing && !localState.isPrimaryAuthAllAllowed && !!localState.allowedAuthMethods && localState.allowedAuthMethods.length === 0 && ( /*#__PURE__*/wn.createElement(Alert, null, 'Please select at least one primary authentication method.')), /*#__PURE__*/ wn.createElement(Switch, { readOnly: !editing || !canSetAllowedAuthMethods, label: 'Allow all primary auth methods', checked: localState.isPrimaryAuthAllAllowed, onChange: handlePrimaryAuthChange }), !localState.isPrimaryAuthAllAllowed && ( /*#__PURE__*/wn.createElement(PaddingLeft, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "row", flexWrap: "wrap" }, orgConfigAuthMethods.map(function (authMethod) { var label = allowedAuthMethodsLabelMap[authMethod]; return /*#__PURE__*/ wn.createElement(Checkbox, { key: authMethod, label: label, disabled: !editing, checked: isAuthMethodChecked(authMethod), onClick: function onClick() { return handleAllowedAuthMethodClick(authMethod); } }); }))))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Secondary authentication" }, editing && !localState.isSecondaryAuthAllAllowed && !!localState.allowedMfaMethods && localState.allowedMfaMethods.length === 0 && ( /*#__PURE__*/wn.createElement(Alert, null, 'Please select at least one secondary authentication method.')), /*#__PURE__*/ wn.createElement(Typography, { variant: 'body2' }, 'All members logging in will be required to set up one of the allowed secondary auth methods.'), mfaPolicyConfig && ( /*#__PURE__*/wn.createElement(Switch, { readOnly: !editing || !canSetMfaPolicy, label: 'Require MFA for all users', checked: localState.isMfaPolicyRequiredForAll, onChange: handleMfaPolicyChange })), /*#__PURE__*/ wn.createElement(Switch, { readOnly: !editing || !canSetAllowedMfaMethods, label: 'Allow all secondary auth methods', checked: localState.isSecondaryAuthAllAllowed, onChange: handleSecondaryAuthChange }), !localState.isSecondaryAuthAllAllowed && ( /*#__PURE__*/wn.createElement(PaddingLeft, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "row", flexWrap: "wrap" }, orgConfigMfaMethods.map(function (authMethod) { var label = allowedMfaMethodsLabelMap[authMethod]; return /*#__PURE__*/ wn.createElement(Checkbox, { key: authMethod, label: label, disabled: !editing || !canSetAllowedMfaMethods, checked: isMfaMethodChecked(authMethod), onClick: function onClick() { return handleAllowedMfaMethodClick(authMethod); } }); })))))); };
+var configAuthMethodMap = { emailMagicLinks: 'magic_link', sso: 'sso', password: 'password', oauthGoogle: 'google_oauth', oauthMicrosoft: 'microsoft_oauth' };
+var configMfaMethodMap = { smsOtp: 'sms_otp', totp: 'totp' };
+var OrgSettingsAuthenticationSettingsSection = function OrgSettingsAuthenticationSettingsSection(_ref108) { var orgInfo = _ref108.orgInfo; var _useRbac16 = useRbac('stytch.organization', 'update.settings.allowed-auth-methods'), canSetAllowedAuthMethods = _useRbac16.data; var _useRbac17 = useRbac('stytch.organization', 'update.settings.mfa-policy'), canSetMfaPolicy = _useRbac17.data; var _useRbac18 = useRbac('stytch.organization', 'update.settings.allowed-mfa-methods'), canSetAllowedMfaMethods = _useRbac18.data; var _useMutateAuthSetting = useMutateAuthSettings$1(), setOrgAuthSettings = _useMutateAuthSetting.setOrgAuthSettings; var _useAdminPortalConfig3 = useAdminPortalConfig(), adminPortalConfig = _useAdminPortalConfig3.data; var mfaPolicyConfig = adminPortalConfig === null || adminPortalConfig === void 0 ? void 0 : adminPortalConfig.organization_config.mfa_controls_enabled; var orgUIConfig = useAdminPortalOrgUIConfig(); var _F = F$3(function () { var _a, _b; var authMethods = (_a = orgUIConfig === null || orgUIConfig === void 0 ? void 0 : orgUIConfig.allowedAuthMethods) !== null && _a !== void 0 ? _a : Object.keys(configAuthMethodMap); var mfaMethods = (_b = orgUIConfig === null || orgUIConfig === void 0 ? void 0 : orgUIConfig.allowedMfaAuthMethods) !== null && _b !== void 0 ? _b : Object.keys(configMfaMethodMap); var mappedAuthMethods = authMethods.map(function (method) { return configAuthMethodMap[method]; }).filter(isTruthy); var mappedMfaMethods = mfaMethods.map(function (method) { return configMfaMethodMap[method]; }).filter(isTruthy); return { orgConfigAuthMethods: mappedAuthMethods, orgConfigMfaMethods: mappedMfaMethods }; }, [orgUIConfig === null || orgUIConfig === void 0 ? void 0 : orgUIConfig.allowedAuthMethods, orgUIConfig === null || orgUIConfig === void 0 ? void 0 : orgUIConfig.allowedMfaAuthMethods]), orgConfigAuthMethods = _F.orgConfigAuthMethods, orgConfigMfaMethods = _F.orgConfigMfaMethods; var remoteState = F$3(function () { return { authMethods: orgInfo.auth_methods, allowedAuthMethods: orgInfo.allowed_auth_methods, mfaPolicy: orgInfo.mfa_policy, mfaMethods: orgInfo.mfa_methods, allowedMfaMethods: orgInfo.allowed_mfa_methods, isPrimaryAuthAllAllowed: orgInfo.auth_methods === 'ALL_ALLOWED', isSecondaryAuthAllAllowed: orgInfo.mfa_methods === 'ALL_ALLOWED', isMfaPolicyRequiredForAll: orgInfo.mfa_policy === 'REQUIRED_FOR_ALL' }; }, [orgInfo.allowed_auth_methods, orgInfo.allowed_mfa_methods, orgInfo.auth_methods, orgInfo.mfa_methods, orgInfo.mfa_policy]); var _useFormState5 = useFormState({ remoteState: remoteState }), localState = _useFormState5.localState, setLocalState = _useFormState5.setLocalState, editing = _useFormState5.editing, handleSetEditing = _useFormState5.handleSetEditing; var _useOrgSettingsRouter2 = useOrgSettingsRouterController(), useBlockNavigation = _useOrgSettingsRouter2.useBlockNavigation; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee19() { var mutatedProperties; return _regeneratorRuntime().wrap(function _callee19$(_context20) { while (1)
+    switch (_context20.prev = _context20.next) {
+        case 0:
+            mutatedProperties = {};
+            if (localState.isPrimaryAuthAllAllowed !== remoteState.isPrimaryAuthAllAllowed) {
+                mutatedProperties.auth_methods = localState.isPrimaryAuthAllAllowed ? 'ALL_ALLOWED' : 'RESTRICTED';
+            }
+            if (!arraysHaveSameContents(localState.allowedAuthMethods, remoteState.allowedAuthMethods)) {
+                mutatedProperties.allowed_auth_methods = localState.allowedAuthMethods;
+            }
+            if (localState.isSecondaryAuthAllAllowed !== remoteState.isSecondaryAuthAllAllowed) {
+                mutatedProperties.mfa_methods = localState.isSecondaryAuthAllAllowed ? 'ALL_ALLOWED' : 'RESTRICTED';
+            }
+            if (!arraysHaveSameContents(localState.allowedMfaMethods, remoteState.allowedMfaMethods)) {
+                mutatedProperties.allowed_mfa_methods = localState.allowedMfaMethods;
+            }
+            if (localState.isMfaPolicyRequiredForAll !== remoteState.isMfaPolicyRequiredForAll) {
+                mutatedProperties.mfa_policy = localState.isMfaPolicyRequiredForAll ? 'REQUIRED_FOR_ALL' : 'OPTIONAL';
+            }
+            if (!(Object.keys(mutatedProperties).length > 0)) {
+                _context20.next = 9;
+                break;
+            }
+            _context20.next = 9;
+            return setOrgAuthSettings(mutatedProperties);
+        case 9:
+        case "end": return _context20.stop();
+    } }, _callee19); })); }, [localState, remoteState, setOrgAuthSettings]); var handleCancel = T$2(function () { setLocalState(remoteState); }, [remoteState, setLocalState]); var disableSave = F$3(function () { var isDeepEqual = arraysHaveSameContents(localState.allowedAuthMethods, remoteState.allowedAuthMethods) && arraysHaveSameContents(localState.allowedMfaMethods, remoteState.allowedMfaMethods) && localState.isPrimaryAuthAllAllowed === remoteState.isPrimaryAuthAllAllowed && localState.isMfaPolicyRequiredForAll === remoteState.isMfaPolicyRequiredForAll && localState.isSecondaryAuthAllAllowed === remoteState.isSecondaryAuthAllAllowed; var allowPrimaryAuth = !localState.isPrimaryAuthAllAllowed && !!localState.allowedAuthMethods && localState.allowedAuthMethods.length === 0; var allowSecondaryAuth = !localState.isSecondaryAuthAllAllowed && localState.allowedMfaMethods && localState.allowedMfaMethods.length === 0; return isDeepEqual || allowPrimaryAuth || allowSecondaryAuth; }, [remoteState, localState]); return /*#__PURE__*/ wn.createElement(SettingsContainer, { title: "Authentication Settings", hasCTA: canSetAllowedAuthMethods || canSetMfaPolicy || canSetAllowedMfaMethods, onSave: handleSave, useBlockNavigation: useBlockNavigation, editing: editing, setEditing: handleSetEditing, disableSave: disableSave, onCancel: handleCancel }, /*#__PURE__*/ wn.createElement(OrgSettingsAuthenticationSettingsBody, { canSetAllowedAuthMethods: canSetAllowedAuthMethods, canSetMfaPolicy: canSetMfaPolicy, canSetAllowedMfaMethods: canSetAllowedMfaMethods, localState: localState, setLocalState: setLocalState, remoteState: remoteState, orgConfigAuthMethods: orgConfigAuthMethods, orgConfigMfaMethods: orgConfigMfaMethods, mfaPolicyConfig: mfaPolicyConfig })); };
+var roleAssignmentsItemRenderers = function roleAssignmentsItemRenderers(idMap) { return [{ title: 'Role', getValue: function getValue(role) { return /*#__PURE__*/ wn.createElement(Tag, null, role.role_id); } }, { title: 'Number of Sources Assigned', getValue: function getValue(role) { var _a, _b; return /*#__PURE__*/ wn.createElement(Typography, { variant: "body2", color: "secondary" }, String((_b = (_a = idMap[role.role_id]) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0)); } }]; };
+var roleAssigmnentsKeyExtractor = function roleAssigmnentsKeyExtractor(role) { return role.role_id; };
+var roleItemRendererer = [{ title: 'Source', getValue: function getValue(value) { return /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, value.source); } }, { title: 'Display Name', getValue: function getValue(value) { return /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, value.displayName); } }, { title: 'Groups', getValue: function getValue(value) { return /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, value.source === 'SSO' ? value.groups : ''); } }];
+var roleKeyExtractor = function roleKeyExtractor(role) { return role.displayName; };
+var useMutateRoleAssignments = function useMutateRoleAssignments() { var _useMutateOrganizatio5 = useMutateOrganization(), mutate = _useMutateOrganizatio5.mutate; var setOrgEmailAssignments = function setOrgEmailAssignments(_ref109) { var idMap = _ref109.idMap; var rbacEmails = []; Object.entries(idMap).forEach(function (_ref110) { var _ref111 = _slicedToArray2(_ref110, 2), roleId = _ref111[0], values = _ref111[1]; values.forEach(function (value) { if (value.source === 'Email') {
+    rbacEmails.push({ role_id: roleId, domain: value.displayName });
+} }); }); return mutate({ rbac_email_implicit_role_assignments: rbacEmails }, { errorMessage: 'Failed to update email role assignments.' }); }; return { setOrgEmailAssignments: setOrgEmailAssignments }; };
+var RoleTable = function RoleTable(_ref112) { var localState = _ref112.localState, remoteState = _ref112.remoteState, editing = _ref112.editing, setLocalState = _ref112.setLocalState, role = _ref112.role, canUpdateSso = _ref112.canUpdateSso; var _a; var roleId = role.role_id; var items = (_a = (editing ? localState : remoteState).idMap[roleId]) !== null && _a !== void 0 ? _a : []; return /*#__PURE__*/ wn.createElement(TableContainer$1, { component: Paper$1, variant: 'outlined' }, /*#__PURE__*/ wn.createElement(Table, { itemRenderer: roleItemRendererer, items: items, rowKeyExtractor: roleKeyExtractor, disableBottomBorder: true, getItemActionProps: editing ? function (roleAssignment) { return { warningAction: roleAssignment.source === 'Email' || roleAssignment.source === 'SSO' && canUpdateSso ? { text: 'Delete', onClick: function onClick() { setLocalState(function (state) { var assignments = state.idMap[roleId].filter(function (item) { return item !== roleAssignment; }); return Object.assign(Object.assign({}, state), { idMap: Object.assign(Object.assign({}, state.idMap), _defineProperty2({}, roleId, assignments)) }); }); } } : undefined }; } : undefined })); };
+var filterRoleAssignmentsBy = function filterRoleAssignmentsBy(arr, _ref113) { var source = _ref113.source; return arr.slice().filter(function (val) { return val.source === source; }); };
+var uniqueValuesSplitOnSpaces = function uniqueValuesSplitOnSpaces(_ref114) { var input = _ref114.input; return new Set(input.split(' ').map(function (val) { return val.trim(); }).filter(function (val) { return val.length > 0; })); };
+var OrgSettingsRoleAssignmentsBody = function OrgSettingsRoleAssignmentsBody(_ref115) { var editing = _ref115.editing, ssoSamlConnections = _ref115.ssoSamlConnections, roles = _ref115.roles, localState = _ref115.localState, remoteState = _ref115.remoteState, setLocalState = _ref115.setLocalState, canUpdateSso = _ref115.canUpdateSso, isSsoEnabled = _ref115.isSsoEnabled; var idMap = (editing ? localState : remoteState).idMap; var rolesWithAssignments = roles.filter(function (role) { return idMap[role.role_id].length > 0; }); var itemRenderers = roleAssignmentsItemRenderers(idMap); var _h101 = h$4(null), _h102 = _slicedToArray2(_h101, 2), selectedRole = _h102[0], setSelectedRole = _h102[1]; var _h103 = h$4(null), _h104 = _slicedToArray2(_h103, 2), selectedSource = _h104[0], setSelectedSource = _h104[1]; var _h105 = h$4(''), _h106 = _slicedToArray2(_h105, 2), emailDomain = _h106[0], setEmailDomain = _h106[1]; var _h107 = h$4([{ id: '', groups: '' }]), _h108 = _slicedToArray2(_h107, 2), ssoRoleAssignments = _h108[0], setSsoRoleAssignments = _h108[1]; var idToHasGroupAttributeMapping = ssoSamlConnections.reduce(function (acc, val) { acc[val.connection_id] = !!val.attribute_mapping.groups; return acc; }, {}); var sourceItems = new Set(['Email']); if (isSsoEnabled && canUpdateSso && ssoSamlConnections.length > 0) {
+    sourceItems.add('SSO');
+} var sourceSelectItems = Array.from(sourceItems).map(function (source) { return { label: source, value: source }; }); var addRoleAssignmentModalProps = useModalState(function () { if (!selectedSource)
+    return; var roleId = selectedRole; setLocalState(function (state) { var remoteRoleAssignments = _toConsumableArray2(state.idMap[roleId]); var mergedRoleAssignments = _toConsumableArray2(remoteRoleAssignments); var filteredRoleAssignments = filterRoleAssignmentsBy(remoteRoleAssignments, { source: selectedSource }); if (selectedSource === 'Email') {
+    var domains = new Set();
+    filteredRoleAssignments.forEach(function (roleAssignment) { domains.add(roleAssignment.displayName); });
+    uniqueValuesSplitOnSpaces({ input: emailDomain }).forEach(function (domain) { if (!domains.has(domain)) {
+        domains.add(domain);
+        mergedRoleAssignments.push({ source: selectedSource, displayName: domain });
+    } });
+}
+else if (selectedSource === 'SSO') {
+    var idToGroups = {};
+    filteredRoleAssignments.forEach(function (ssoRoleAssignment) { idToGroups[ssoRoleAssignment.id] = new Set([ssoRoleAssignment.groups]); });
+    ssoRoleAssignments.forEach(function (ssoConnection) { var connectionId = ssoConnection.id; if (connectionId.length !== 0) {
+        uniqueValuesSplitOnSpaces({ input: ssoConnection.groups }).forEach(function (group) { var _a, _b; if (!idToGroups[connectionId]) {
+            idToGroups[connectionId] = new Set();
+        } if (!idToGroups[connectionId].has(group)) {
+            mergedRoleAssignments.push({ source: selectedSource, displayName: (_b = (_a = ssoSamlConnections.find(function (val) { return val.connection_id === connectionId; })) === null || _a === void 0 ? void 0 : _a.display_name) !== null && _b !== void 0 ? _b : '', id: ssoConnection.id, groups: group });
+            idToGroups[ssoConnection.id].add(group);
+        } });
+    } });
+} if (mergedRoleAssignments.length !== remoteRoleAssignments.length) {
+    return Object.assign(Object.assign({}, state), { idMap: Object.assign(Object.assign({}, state.idMap), _defineProperty2({}, roleId, mergedRoleAssignments)) });
+} return state; }); }); var showInputContent = !!selectedRole && !!selectedSource; var disableConfirm = !showInputContent || selectedSource === 'Email' && emailDomain.length === 0 || selectedSource === 'SSO' && ssoRoleAssignments.every(function (connection) { return !connection.id; }); var roleSelectItems = F$3(function () { return roles.map(function (role) { return { label: role.role_id, value: role.role_id }; }); }, [roles]); var selectedSsoRoleAssignmentIds = ssoRoleAssignments.map(function (connection) { return connection.id; }); var ssoGroupSelectItems = function ssoGroupSelectItems(currentId) { return ssoSamlConnections.filter(function (_ref116) { var id = _ref116.connection_id; return !selectedSsoRoleAssignmentIds.includes(id) || id === currentId; }).map(function (_ref117) { var id = _ref117.connection_id, displayName = _ref117.display_name; return { label: displayName, value: id }; }); }; var sourceToInputContentMap = { Email: ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Email Domain" }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, "Separate domains by a single space to assign to multiple email domains."), /*#__PURE__*/ wn.createElement(Input$1, { label: "Domain", fullWidth: true, value: emailDomain, onChange: setEmailDomain })))), SSO: ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "SSO" }, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, "Enter a Group name to assign a Role at the Group level, or leave blank to assign at the SSO connection level. Separate groups by a single space to assign to multiple groups."), ssoRoleAssignments.map(function (_ref118, index) { var id = _ref118.id, groups = _ref118.groups; var isValidConnection = !!id; var connectionHasGroupMapping = !!idToHasGroupAttributeMapping[id]; var isValidConnectionWithGroupMapping = isValidConnection && connectionHasGroupMapping; var disableGroupInput = !isValidConnectionWithGroupMapping; var groupInputPlaceholder = isValidConnection && !connectionHasGroupMapping ? 'Add a "groups" key first' : 'Enter or leave blank'; var groupInputCaption = isValidConnection && !connectionHasGroupMapping ? 'Add a "groups" key in the SSO Attribute Mapping first to assign group roles.' : undefined; return /*#__PURE__*/ wn.createElement(FlexBox, { key: index, flexDirection: "row", gap: 2, alignItems: "flex-start" }, /*#__PURE__*/ wn.createElement("div", null, /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, "Connection Display Name"), /*#__PURE__*/ wn.createElement(Select, { width: 250, placeholder: "Select", selectItems: selectedRole ? ssoGroupSelectItems(id) : [], value: id, onChange: function onChange(val) { setSsoRoleAssignments(function (connections) { return connections.map(function (connection, currentIndex) { if (currentIndex === index) {
+            return Object.assign(Object.assign({}, connection), { id: val });
+        } return connection; }); }); } })), /*#__PURE__*/ wn.createElement(Input$1, { label: "Group name", value: groups, disabled: disableGroupInput, placeholder: groupInputPlaceholder, caption: groupInputCaption, onChange: function onChange(val) { setSsoRoleAssignments(function (connections) { return connections.map(function (connection, currentIndex) { var _a; if (currentIndex === index) {
+            return Object.assign(Object.assign({}, connection), { groups: val, id: id, hasGroupAttributeMapping: !!((_a = ssoSamlConnections.find(function (ssoSamlConnection) { return ssoSamlConnection.connection_id === val; })) === null || _a === void 0 ? void 0 : _a.attribute_mapping.groups) });
+        } return connection; }); }); } })); }), /*#__PURE__*/ wn.createElement(Button, { variant: "text", startIcon: /*#__PURE__*/ wn.createElement(default_1$6, null), compact: true, disabled: ssoRoleAssignments.length >= ssoSamlConnections.length, onClick: function onClick() { setSsoRoleAssignments(function (connections) { return [].concat(_toConsumableArray2(connections), [{ id: '', groups: '' }]); }); } }, "Add SSO Role assignment")))) }; return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 1 }, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, addRoleAssignmentModalProps, { title: "Add Role assignment", confirmButtonText: "Save", disableConfirm: disableConfirm, close: function close() { addRoleAssignmentModalProps.close(); setSelectedRole(null); setSelectedSource(null); setEmailDomain(''); setSsoRoleAssignments([{ id: '', groups: '' }]); } }), /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(Select, { label: "Select Role", selectItems: roleSelectItems, value: selectedRole, onChange: function onChange(val) { setSelectedRole(val); }, placeholder: "Select Role" }), /*#__PURE__*/ wn.createElement(Select, { label: "Select Source", selectItems: sourceSelectItems, value: selectedSource, placeholder: "Select Source", onChange: function onChange(val) { setSelectedSource(val); } }), showInputContent && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(Divider$1, null), sourceToInputContentMap[selectedSource])))), editing && ( /*#__PURE__*/wn.createElement(FlexBox, { justifyContent: "flex-end" }, /*#__PURE__*/ wn.createElement(Button, { variant: "text", startIcon: /*#__PURE__*/ wn.createElement(default_1$6, null), compact: true, onClick: addRoleAssignmentModalProps.open }, "Add Role assignment"))), rolesWithAssignments.length > 0 ? ( /*#__PURE__*/wn.createElement(Table, { itemRenderer: itemRenderers, items: rolesWithAssignments, rowKeyExtractor: roleAssigmnentsKeyExtractor, ExpandedContent: function ExpandedContent(_ref119) { var role = _ref119.data; return /*#__PURE__*/ wn.createElement(RoleTable, { role: role, editing: editing, setLocalState: setLocalState, localState: localState, remoteState: remoteState, canUpdateSso: canUpdateSso }); } })) : ( /*#__PURE__*/wn.createElement(Typography, { variant: "body2" }, "No role assignments."))); };
+var OrgSettingsRoleAssignmentsSection = function OrgSettingsRoleAssignmentsSection(_ref120) { var orgInfo = _ref120.orgInfo; var _a, _b; var _useAdminPortalConfig4 = useAdminPortalConfig(), adminPortalConfig = _useAdminPortalConfig4.data; var isSsoEnabled = (_a = adminPortalConfig === null || adminPortalConfig === void 0 ? void 0 : adminPortalConfig.sso_config.sso_enabled) !== null && _a !== void 0 ? _a : false; var _useRbac19 = useRbac('stytch.organization', 'update.settings.implicit-roles'), canSetRoles = _useRbac19.data; var _useRbac20 = useRbac('stytch.sso', 'get'), canGetSso = _useRbac20.data; var _useRbac21 = useRbac('stytch.sso', 'update'), canUpdateSso = _useRbac21.data; var _useSsoConnections2 = useSsoConnections(isSsoEnabled && !!canGetSso), ssoConnections = _useSsoConnections2.data, isLoading = _useSsoConnections2.isLoading; var b2bInterals = useB2BInternals(); var _h109 = h$4((_b = b2bInterals.bootstrap.getSync().rbacPolicy) === null || _b === void 0 ? void 0 : _b.roles), _h110 = _slicedToArray2(_h109, 2), roles = _h110[0], setRoles = _h110[1]; p$3(function () { b2bInterals.bootstrap.getAsync().then(function (value) { var _a; setRoles((_a = value.rbacPolicy) === null || _a === void 0 ? void 0 : _a.roles); }); }); var sortedRoles = F$3(function () { var _a; return (_a = roles === null || roles === void 0 ? void 0 : roles.slice().sort(function (a, b) { if (a.role_id === 'stytch_admin') {
+    return -1;
+} if (b.role_id === 'stytch_admin') {
+    return 1;
+} if (a.role_id === 'stytch_member') {
+    return -1;
+} if (b.role_id === 'stytch_member') {
+    return 1;
+} return a.role_id.localeCompare(b.role_id); })) !== null && _a !== void 0 ? _a : []; }, [roles]); var rbacEmails = orgInfo.rbac_email_implicit_role_assignments; var connections = ssoConnections === null || ssoConnections === void 0 ? void 0 : ssoConnections.saml_connections; var _useMutateRoleAssignm = useMutateRoleAssignments(), setOrgEmailAssignments = _useMutateRoleAssignm.setOrgEmailAssignments; var _useMutateSsoConnecti5 = useMutateSsoConnection('saml'), mutate = _useMutateSsoConnecti5.mutate; var idMap = F$3(function () { var idToRoleAssignments = {}; sortedRoles.forEach(function (role) { idToRoleAssignments[role.role_id] = []; }); connections === null || connections === void 0 ? void 0 : connections.forEach(function (ssoSamlConnection) { var connectionRoleAssignments = ssoSamlConnection.saml_connection_implicit_role_assignments; var groupRoleAssignments = ssoSamlConnection.saml_group_implicit_role_assignments; connectionRoleAssignments.forEach(function (implicitRole) { var role = implicitRole.role_id; if (!idToRoleAssignments[role]) {
+    idToRoleAssignments[role] = [];
+} idToRoleAssignments[role].push({ source: 'SSO', displayName: ssoSamlConnection.display_name, id: ssoSamlConnection.connection_id, groups: '' }); }); groupRoleAssignments.forEach(function (implicitRole) { var role = implicitRole.role_id; if (!idToRoleAssignments[role]) {
+    idToRoleAssignments[role] = [];
+} idToRoleAssignments[role].push({ source: 'SSO', displayName: ssoSamlConnection.display_name, id: ssoSamlConnection.connection_id, groups: implicitRole.group }); }); }); rbacEmails === null || rbacEmails === void 0 ? void 0 : rbacEmails.forEach(function (rbacEmail) { var role = rbacEmail.role_id; if (!idToRoleAssignments[role]) {
+    idToRoleAssignments[role] = [];
+} idToRoleAssignments[role].push({ source: 'Email', displayName: rbacEmail.domain }); }); return idToRoleAssignments; }, [connections, rbacEmails, sortedRoles]); var remoteState = { idMap: idMap }; var _useFormState6 = useFormState({ remoteState: remoteState }), localState = _useFormState6.localState, setLocalState = _useFormState6.setLocalState, editing = _useFormState6.editing, handleSetEditing = _useFormState6.handleSetEditing; var _useOrgSettingsRouter3 = useOrgSettingsRouterController(), useBlockNavigation = _useOrgSettingsRouter3.useBlockNavigation; var disableSave = false; var handleSave = function handleSave() { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee21() { var mutatedConnections, copyConnections; return _regeneratorRuntime().wrap(function _callee21$(_context22) { while (1)
+    switch (_context22.prev = _context22.next) {
+        case 0:
+            if (!canSetRoles) {
+                _context22.next = 10;
+                break;
+            }
+            _context22.next = 3;
+            return setOrgEmailAssignments(localState);
+        case 3:
+            if (!canUpdateSso) {
+                _context22.next = 10;
+                break;
+            }
+            mutatedConnections = {};
+            copyConnections = {};
+            connections === null || connections === void 0 ? void 0 : connections.forEach(function (val) { var shallow = Object.assign({}, { connection_id: val.connection_id, saml_connection_implicit_role_assignments: val.saml_connection_implicit_role_assignments, saml_group_implicit_role_assignments: val.saml_group_implicit_role_assignments }); copyConnections[val.connection_id] = Object.assign({}, shallow); shallow.saml_connection_implicit_role_assignments = []; shallow.saml_group_implicit_role_assignments = []; mutatedConnections[val.connection_id] = shallow; });
+            Object.entries(localState.idMap).forEach(function (_ref121) { var _ref122 = _slicedToArray2(_ref121, 2), roleId = _ref122[0], roleAssignments = _ref122[1]; roleAssignments.forEach(function (roleAssignment) { if (roleAssignment.source === 'SSO') {
+                var connectionId = roleAssignment.id;
+                if (roleAssignment.groups) {
+                    mutatedConnections[connectionId].saml_group_implicit_role_assignments.push({ role_id: roleId, group: roleAssignment.groups });
+                }
+                else {
+                    mutatedConnections[connectionId].saml_connection_implicit_role_assignments.push({ role_id: roleId });
+                }
+            } }); });
+            _context22.next = 10;
+            return Promise.all(Object.entries(mutatedConnections).map(function (_ref123) { var _ref124 = _slicedToArray2(_ref123, 2), connectionId = _ref124[0], mutatedConnection = _ref124[1]; return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee20() { var originalConnection; return _regeneratorRuntime().wrap(function _callee20$(_context21) { while (1)
+                switch (_context21.prev = _context21.next) {
+                    case 0:
+                        originalConnection = copyConnections[connectionId];
+                        if (!(!arraysHaveSameContents(mutatedConnection.saml_connection_implicit_role_assignments.map(function (val) { return val.role_id; }), originalConnection.saml_connection_implicit_role_assignments.map(function (val) { return val.role_id; })) || !arraysHaveSameContents(mutatedConnection.saml_group_implicit_role_assignments.map(function (val) { return _defineProperty2({}, val.role_id, val.group); }), originalConnection.saml_group_implicit_role_assignments.map(function (val) { return _defineProperty2({}, val.role_id, val.group); })))) {
+                            _context21.next = 4;
+                            break;
+                        }
+                        _context21.next = 4;
+                        return mutate(Object.assign({}, mutatedConnection));
+                    case 4:
+                    case "end": return _context21.stop();
+                } }, _callee20); })); }));
+        case 10:
+        case "end": return _context22.stop();
+    } }, _callee21); })); }; if (isLoading && canGetSso) {
+    return /*#__PURE__*/ wn.createElement(PageLoadingIndicator, null);
+} return /*#__PURE__*/ wn.createElement(SettingsContainer, { title: "Role assignments", hasCTA: canSetRoles, onSave: handleSave, useBlockNavigation: useBlockNavigation, editing: editing, setEditing: handleSetEditing, disableSave: disableSave }, /*#__PURE__*/ wn.createElement(OrgSettingsRoleAssignmentsBody, { editing: editing, remoteState: remoteState, localState: localState, setLocalState: setLocalState, ssoSamlConnections: connections !== null && connections !== void 0 ? connections : [], roles: sortedRoles, canUpdateSso: !!canUpdateSso, isSsoEnabled: isSsoEnabled })); };
+var RadioCore = function RadioCore(_ref127) { var autoFocus = _ref127.autoFocus, checked = _ref127.checked, disabled = _ref127.disabled, label = _ref127.label, onClick = _ref127.onClick, value = _ref127.value, classes = _ref127.classes; var handleChange = function handleChange(e) { onClick === null || onClick === void 0 ? void 0 : onClick(e.target.value); }; return /*#__PURE__*/ wn.createElement(FormControlLabel$1, { control: /*#__PURE__*/ wn.createElement(MUIRadio, { autoFocus: autoFocus, checked: checked, classes: classes, disableRipple: true, onChange: handleChange, color: "primary", size: "small", value: value }), disabled: disabled, label: /*#__PURE__*/ wn.createElement(FlexBox, null, label && ( /*#__PURE__*/wn.createElement(Typography, { variant: 'body2', disabled: disabled }, label))) }); };
+var makeRadioGroupStyles = makeStylesFactory(function (theme) { return { radioGroup: { display: 'flex', flexDirection: 'column', gap: theme.spacing(0.5) } }; });
+var RadioGroupCore = function RadioGroupCore(_ref128) { var id = _ref128.id, items = _ref128.items, onChange = _ref128.onChange, readOnly = _ref128.readOnly, value = _ref128.value, classes = _ref128.classes; var radioGroupId = useShortId(id); var onClick = function onClick(value) { onChange === null || onChange === void 0 ? void 0 : onChange(value); }; return /*#__PURE__*/ wn.createElement(RowItemCore, { fullWidth: true }, /*#__PURE__*/ wn.createElement(FormGroup$1, { className: classes.radioGroup, id: radioGroupId }, items.map(function (item) { return /*#__PURE__*/ wn.createElement(RadioCore, Object.assign({}, item, { classes: Object.assign(Object.assign({}, classes), { checkbox: '', root: '', checkboxContainer: '' }), checked: item.value === value, disabled: item.disabled || readOnly, key: item.value, onClick: onClick, label: item.label })); }))); };
+var useStyles = makeRadioGroupStyles(function (theme) { return { radioGroup: { display: 'flex', flexDirection: 'row', gap: theme.spacing(0.5) } }; });
+var RadioGroup = function RadioGroup(props) { var classes = useStyles(props); return /*#__PURE__*/ wn.createElement(RadioGroupCore, Object.assign({ classes: classes }, props)); };
+var useMutateAuthSettings = function useMutateAuthSettings() { var _useMutateOrganizatio6 = useMutateOrganization(), mutate = _useMutateOrganizatio6.mutate; var setOrgAuthSettings = function setOrgAuthSettings(mutatedProperties) { return mutate(mutatedProperties, { errorMessage: 'Failed to update email domain details.' }); }; return { setOrgAuthSettings: setOrgAuthSettings }; };
+var emailAllowedDomainsRenderer = [{ title: 'Domain', getValue: function getValue(email) { return /*#__PURE__*/ wn.createElement(Typography, { variant: "body2" }, email); } }];
+var emailInvitesLabelMap = { ALL_ALLOWED: 'Anybody', RESTRICTED: 'Users from allowed email domains' };
+var EmailDomainsTable = function EmailDomainsTable(_ref129) { var localState = _ref129.localState, remoteState = _ref129.remoteState, setLocalState = _ref129.setLocalState, canSetAllowedDomains = _ref129.canSetAllowedDomains, editing = _ref129.editing; var emailAllowedDomains = editing ? localState.emailAllowedDomains : remoteState.emailAllowedDomains; var _h111 = h$4(''), _h112 = _slicedToArray2(_h111, 2), email = _h112[0], setEmail = _h112[1]; var addEmailModalProps = useModalState(function () { setLocalState(function (state) { return Object.assign(Object.assign({}, state), { emailAllowedDomains: _toConsumableArray2(new Set([].concat(_toConsumableArray2(localState.emailAllowedDomains), [email]))) }); }); setEmail(''); }); return /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Allowed email domains" }, /*#__PURE__*/ wn.createElement(Modal, Object.assign({}, addEmailModalProps, { title: "Add allowed email domain" }), /*#__PURE__*/ wn.createElement(Input$1, { label: "Domain", onChange: setEmail, placeholder: "Enter domain", value: email })), /*#__PURE__*/ wn.createElement(ListEditor, { items: emailAllowedDomains !== null && emailAllowedDomains !== void 0 ? emailAllowedDomains : [], itemRenderer: emailAllowedDomainsRenderer, onAdd: function onAdd() { addEmailModalProps.open(); }, getItemActionProps: editing && canSetAllowedDomains ? function (item) { return { warningAction: { text: 'Delete', onClick: function onClick() { setEmail(''); setLocalState(function (prevState) { return Object.assign(Object.assign({}, prevState), { emailAllowedDomains: localState.emailAllowedDomains.filter(function (domain) { return domain !== item; }) }); }); } } }; } : undefined, hideAddButton: !canSetAllowedDomains || !editing, addButtonText: "Add Domain" })); };
+var OrgSettingsEmailDomainsBody = function OrgSettingsEmailDomainsBody(_ref130) { var canSetEmailInvites = _ref130.canSetEmailInvites, canSetEmailJitProvisioning = _ref130.canSetEmailJitProvisioning, canSetAllowedDomains = _ref130.canSetAllowedDomains, localState = _ref130.localState, remoteState = _ref130.remoteState, setLocalState = _ref130.setLocalState; var _useSettingsContainer6 = useSettingsContainer(), editing = _useSettingsContainer6.editing; var handleJitProvisioningChange = useStateSliceSetter(setLocalState, 'isEmailJitProvisioningAllowed'); var handleEmailInvitesChange = useStateSliceSetter(setLocalState, 'emailInvites'); return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 2 }, /*#__PURE__*/ wn.createElement(SettingsSection, { title: "Email Invites" }, /*#__PURE__*/ wn.createElement(Switch, { readOnly: !editing || !canSetEmailInvites, label: 'Allow inviting members to your organization via allowed email domains', checked: localState.emailInvites !== 'NOT_ALLOWED', onChange: function onChange(value) { return handleEmailInvitesChange(value ? 'ALL_ALLOWED' : 'NOT_ALLOWED'); } }), localState.emailInvites !== 'NOT_ALLOWED' && ( /*#__PURE__*/wn.createElement(PaddingLeft, null, /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "row", flexWrap: "wrap" }, /*#__PURE__*/ wn.createElement(RadioGroup, { onChange: handleEmailInvitesChange, value: localState.emailInvites, items: Object.entries(emailInvitesLabelMap).map(function (_ref131) { var _ref132 = _slicedToArray2(_ref131, 2), value = _ref132[0], label = _ref132[1]; return { value: value, label: label, disabled: !editing || !canSetEmailInvites }; }) }))))), /*#__PURE__*/ wn.createElement(SettingsSection, { title: "JIT Provisioning", tooltipText: "If enabled, users who successfully authenticate via allowed email domains will be automatically granted an account if they do not already exist within your organization." }, /*#__PURE__*/ wn.createElement(Switch, { readOnly: !editing || !canSetEmailJitProvisioning, label: 'Allow JIT provisioning for users from allowed email domains', checked: localState.isEmailJitProvisioningAllowed, onChange: handleJitProvisioningChange })), /*#__PURE__*/ wn.createElement(EmailDomainsTable, { localState: localState, remoteState: remoteState, setLocalState: setLocalState, canSetAllowedDomains: canSetAllowedDomains, editing: editing, manualConfiguration: false })); };
+var OrgSettingsEmailDomainsSection = function OrgSettingsEmailDomainsSection(_ref133) { var orgInfo = _ref133.orgInfo; var _useRbac22 = useRbac('stytch.organization', 'update.settings.email-jit-provisioning'), canSetEmailJitProvisioning = _useRbac22.data; var _useRbac23 = useRbac('stytch.organization', 'update.settings.email-invites'), canSetEmailInvites = _useRbac23.data; var _useRbac24 = useRbac('stytch.organization', 'update.settings.allowed-domains'), canSetAllowedDomains = _useRbac24.data; var remoteState = F$3(function () { return { emailInvites: orgInfo.email_invites, emailAllowedDomains: orgInfo.email_allowed_domains, isEmailJitProvisioningAllowed: orgInfo.email_jit_provisioning !== 'NOT_ALLOWED' }; }, [orgInfo]); var _useFormState7 = useFormState({ remoteState: remoteState }), localState = _useFormState7.localState, setLocalState = _useFormState7.setLocalState, editing = _useFormState7.editing, handleSetEditing = _useFormState7.handleSetEditing; var _useMutateAuthSetting2 = useMutateAuthSettings(), setOrgAuthSettings = _useMutateAuthSetting2.setOrgAuthSettings; var _useOrgSettingsRouter4 = useOrgSettingsRouterController(), useBlockNavigation = _useOrgSettingsRouter4.useBlockNavigation; var handleSave = T$2(function () { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/ _regeneratorRuntime().mark(function _callee22() { var mutatedProperties; return _regeneratorRuntime().wrap(function _callee22$(_context23) { while (1)
+    switch (_context23.prev = _context23.next) {
+        case 0:
+            mutatedProperties = {};
+            if (localState.isEmailJitProvisioningAllowed !== remoteState.isEmailJitProvisioningAllowed) {
+                mutatedProperties.email_jit_provisioning = localState.isEmailJitProvisioningAllowed ? 'RESTRICTED' : 'NOT_ALLOWED';
+            }
+            if (localState.emailInvites !== remoteState.emailInvites) {
+                mutatedProperties.email_invites = localState.emailInvites;
+            }
+            if (!arraysHaveSameContents(localState.emailAllowedDomains, remoteState.emailAllowedDomains)) {
+                mutatedProperties.email_allowed_domains = localState.emailAllowedDomains;
+            }
+            if (!(Object.keys(mutatedProperties).length > 0)) {
+                _context23.next = 7;
+                break;
+            }
+            _context23.next = 7;
+            return setOrgAuthSettings(mutatedProperties);
+        case 7:
+        case "end": return _context23.stop();
+    } }, _callee22); })); }, [localState.emailAllowedDomains, localState.emailInvites, localState.isEmailJitProvisioningAllowed, remoteState.emailAllowedDomains, remoteState.emailInvites, remoteState.isEmailJitProvisioningAllowed, setOrgAuthSettings]); var disableSave = F$3(function () { return arraysHaveSameContents(localState.emailAllowedDomains, remoteState.emailAllowedDomains) && localState.emailInvites === remoteState.emailInvites && localState.isEmailJitProvisioningAllowed === remoteState.isEmailJitProvisioningAllowed; }, [localState.emailAllowedDomains, localState.emailInvites, localState.isEmailJitProvisioningAllowed, remoteState.emailAllowedDomains, remoteState.emailInvites, remoteState.isEmailJitProvisioningAllowed]); return /*#__PURE__*/ wn.createElement(SettingsContainer, { title: "Email Domain Settings", hasCTA: canSetEmailJitProvisioning || canSetEmailInvites || canSetAllowedDomains, onSave: handleSave, useBlockNavigation: useBlockNavigation, editing: editing, setEditing: handleSetEditing, disableSave: disableSave }, /*#__PURE__*/ wn.createElement(OrgSettingsEmailDomainsBody, { canSetEmailJitProvisioning: canSetEmailJitProvisioning, canSetEmailInvites: canSetEmailInvites, canSetAllowedDomains: canSetAllowedDomains, localState: localState, remoteState: remoteState, setLocalState: setLocalState })); };
+var OrgSettingsScreen = function OrgSettingsScreen() { var _useOrgInfo3 = useOrgInfo(), isLoading = _useOrgInfo3.isLoading, error = _useOrgInfo3.error, orgInfo = _useOrgInfo3.data; if (isLoading) {
+    return /*#__PURE__*/ wn.createElement(PageLoadingIndicator, null);
+} if (error) {
+    return /*#__PURE__*/ wn.createElement(Alert, null, extractErrorMessage(error));
+} return /*#__PURE__*/ wn.createElement(FlexBox, { flexDirection: "column", gap: 3 }, /*#__PURE__*/ wn.createElement(Typography, { variant: "h2" }, "Organization Settings"), orgInfo && ( /*#__PURE__*/wn.createElement(wn.Fragment, null, /*#__PURE__*/ wn.createElement(OrgSettingsDetailsSection, { orgInfo: orgInfo }), /*#__PURE__*/ wn.createElement(OrgSettingsAuthenticationSettingsSection, { orgInfo: orgInfo }), /*#__PURE__*/ wn.createElement(OrgSettingsEmailDomainsSection, { orgInfo: orgInfo }), /*#__PURE__*/ wn.createElement(OrgSettingsRoleAssignmentsSection, { orgInfo: orgInfo })))); };
+var validateConfig = function validateConfig(config) { if (!config)
+    return; if (config.allowedAuthMethods.length === 0) {
+    throw new Error('allowedAuthMethods must contain at least one value');
+} if (config.allowedMfaAuthMethods.length === 0) {
+    throw new Error('mfaAuthMethods must contain at least one value');
+} };
+var AdminPortalB2BProducts;
+(function (AdminPortalB2BProducts) { AdminPortalB2BProducts["emailMagicLinks"] = "emailMagicLinks"; AdminPortalB2BProducts["sso"] = "sso"; AdminPortalB2BProducts["password"] = "password"; AdminPortalB2BProducts["oauthGoogle"] = "oauthGoogle"; AdminPortalB2BProducts["oauthMicrosoft"] = "oauthMicrosoft"; })(AdminPortalB2BProducts || (AdminPortalB2BProducts = {}));
+var routeMap = { orgSettingsScreen: OrgSettingsScreen };
+var initialRoute = { screen: 'orgSettingsScreen' };
+var Content = function Content() { var _useAdminPortalConfig5 = useAdminPortalConfig(), adminPortalConfigError = _useAdminPortalConfig5.error, isLoading = _useAdminPortalConfig5.isLoading; if (adminPortalConfigError) {
+    return /*#__PURE__*/ wn.createElement(Alert, null, "Organization Settings could not be loaded. Please contact your admin if you think this is a mistake.");
+} if (isLoading) {
+    return /*#__PURE__*/ wn.createElement(PageLoadingIndicator, null);
+} return /*#__PURE__*/ wn.createElement(OrgSettingsRouterProvider, { initialRoute: initialRoute }, /*#__PURE__*/ wn.createElement(OrgSettingsRouter, { routeMap: routeMap })); };
+var AdminPortalOrgSettings$1 = function AdminPortalOrgSettings(props) { var uiConfig = useAdminPortalOrgUIConfig(); var initialClient = _$1(props.client); p$3(function () { readB2BInternals(initialClient.current).networkClient.logEvent({ name: 'render_b2b_admin_portal_org_settings', details: {} }); }, []); p$3(function () { validateConfig(uiConfig); }, [uiConfig]); return /*#__PURE__*/ wn.createElement(AdminPortalWrapper, { options: props }, /*#__PURE__*/ wn.createElement(Content, null)); };
+var mountAdminPortalOrgSettings = makeAdminPortalComponentMountFn(AdminPortalOrgSettings$1, 'stytch-b2b-admin-portal-org-settings-ui', 'mountAdminPortalOrgSettings');
 
 const makeAdminPortalComponent = (mountFn, componentName) => {
     const Component = (props) => {
@@ -9515,4 +10339,12 @@ const makeAdminPortalComponent = (mountFn, componentName) => {
  */
 const AdminPortalSSO = makeAdminPortalComponent(mountAdminPortalSSO, 'AdminPortalSSO');
 
-export { AdminPortalSSO };
+/**
+ * The Admin Portal Organization Settings UI component.
+ * This component must be rendered within a {@link StytchB2BProvider}.
+ *
+ * See the {@link https://stytch.com/docs/b2b/sdks/javascript-sdk online reference}
+ */
+const AdminPortalOrgSettings = makeAdminPortalComponent(mountAdminPortalOrgSettings, 'AdminPortalOrgSettings');
+
+export { AdminPortalB2BProducts, AdminPortalOrgSettings, AdminPortalSSO };