@matrix-widget-toolkit/mui 1.1.3 → 1.1.5

package/README.md

@@ -69,7 +69,7 @@ import { EventDirection, WidgetEventCapability } from 'matrix-widget-api';
   capabilities={[
     WidgetEventCapability.forStateEvent(
       EventDirection.Receive,
-      STATE_EVENT_ROOM_NAME
+      STATE_EVENT_ROOM_NAME,
     ),
   ]}
 >

package/build/cjs/index.js

@@ -31,6 +31,42 @@ var ContentCopyOutlinedIcon__default = /*#__PURE__*/_interopDefaultCompat(Conten
 var LanguageDetector__default = /*#__PURE__*/_interopDefaultCompat(LanguageDetector);
 var resourcesToBackend__default = /*#__PURE__*/_interopDefaultCompat(resourcesToBackend);
 
+/*
+ * Copyright 2022 Nordeck IT + Consulting GmbH
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Retrieve the nonce passed by our Docker base image.
+ * @returns A nonce that can be used to perform operations that are disabled in
+ *          our CSP by default.
+ */
+function getNonce() {
+    return window['NONCE'];
+}
+
+function createEmotionCache() {
+    return createCache__default.default({
+        key: 'widget',
+        nonce: getNonce(),
+    });
+}
+var cache = createEmotionCache();
+function EmotionCacheProvider(_a) {
+    var children = _a.children;
+    return jsxRuntime.jsx(react.CacheProvider, { value: cache, children: children });
+}
+
 /*
  * Copyright 2022 Nordeck IT + Consulting GmbH
  *
@@ -68,53 +104,6 @@ function getEnvironment(name, defaultValue) {
     return value !== null && value !== void 0 ? value : defaultValue;
 }
 
-/*
- * Copyright 2022 Nordeck IT + Consulting GmbH
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * Retrieve the nonce passed by our Docker base image.
- * @returns A nonce that can be used to perform operations that are disabled in
- *          our CSP by default.
- */
-function getNonce() {
-    return window['NONCE'];
-}
-
-var __assign$b = (undefined && undefined.__assign) || function () {
-    __assign$b = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$b.apply(this, arguments);
-};
-function createEmotionCache() {
-    return createCache__default.default({
-        key: 'widget',
-        nonce: getNonce(),
-    });
-}
-var cache = createEmotionCache();
-function EmotionCacheProvider(_a) {
-    var children = _a.children;
-    return jsxRuntime.jsx(react.CacheProvider, __assign$b({ value: cache }, { children: children }));
-}
-
 /*
  * Copyright 2022 Nordeck IT + Consulting GmbH
  *
@@ -132,12 +121,12 @@ function EmotionCacheProvider(_a) {
  */
 var fontFamily = [
     'Inter',
-    'Twemoji',
-    '"Apple Color Emoji"',
-    '"Segoe UI Emoji"',
     'Arial',
     'Helvetica',
     'sans-serif',
+    'Twemoji',
+    '"Apple Color Emoji"',
+    '"Segoe UI Emoji"',
     '"Noto Color Emoji"',
 ].join(',');
 var primaryColor = getEnvironment('REACT_APP_PRIMARY_COLOR', '#0dbd8b');
@@ -613,17 +602,6 @@ var darkTheme = {
     },
 };
 
-var __assign$a = (undefined && undefined.__assign) || function () {
-    __assign$a = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$a.apply(this, arguments);
-};
 /**
  * Provide a semantic UI based theme to the child components.
  * @param param0 - {@link MuiThemeProviderProps}
@@ -661,7 +639,7 @@ function ElementMuiThemeProvider(_a) {
         var localeOptions = locale$1 && new Intl.Locale(locale$1).language === 'de' ? locale.deDE : locale.enUS;
         return material.createTheme(utils.deepmerge(baseTheme, themeOptions), localeOptions);
     }, [locale$1, theme]);
-    return (jsxRuntime.jsxs(material.ThemeProvider, __assign$a({ theme: muiTheme }, { children: [jsxRuntime.jsx(material.CssBaseline, {}), children] })));
+    return (jsxRuntime.jsxs(material.ThemeProvider, { theme: muiTheme, children: [jsxRuntime.jsx(material.CssBaseline, {}), children] }));
 }
 
 /*
@@ -754,8 +732,8 @@ function getInitialLetter(name) {
     return lodash.split(name, '', 1)[0].toUpperCase();
 }
 
-var __assign$9 = (undefined && undefined.__assign) || function () {
-    __assign$9 = Object.assign || function(t) {
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
             s = arguments[i];
             for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
@@ -763,7 +741,7 @@ var __assign$9 = (undefined && undefined.__assign) || function () {
         }
         return t;
     };
-    return __assign$9.apply(this, arguments);
+    return __assign.apply(this, arguments);
 };
 var __rest = (undefined && undefined.__rest) || function (s, e) {
     var t = {};
@@ -800,55 +778,22 @@ var ElementAvatar = react$2.forwardRef(function ElementAvatar(_a, ref) {
     var avatarUrl = _a.avatarUrl, userId = _a.userId, displayName = _a.displayName, props = __rest(_a, ["avatarUrl", "userId", "displayName"]);
     var src = avatarUrl ? createAvatarUrl(avatarUrl) : undefined;
     var name = displayName !== null && displayName !== void 0 ? displayName : userId;
-    return (jsxRuntime.jsx(StyledAvatar, __assign$9({ ref: ref, alt: "", "aria-hidden": true, src: src, color: getColor(userId) }, props, { children: getInitialLetter(name) })));
+    return (jsxRuntime.jsx(StyledAvatar, __assign({ ref: ref, alt: "", "aria-hidden": true, src: src, color: getColor(userId) }, props, { children: getInitialLetter(name) })));
 });
 
-var __assign$8 = (undefined && undefined.__assign) || function () {
-    __assign$8 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$8.apply(this, arguments);
-};
 function LoadingView() {
     var id = utils.unstable_useId();
     var isLongLoad = reactUse.useTimeout(100)[0];
     var t = reactI18next.useTranslation('widget-toolkit').t;
-    return isLongLoad() ? (jsxRuntime.jsxs(material.Box, __assign$8({ display: "flex", flexDirection: "column", alignItems: "center", p: 2 }, { children: [jsxRuntime.jsx(material.CircularProgress, { "aria-labelledby": id }), jsxRuntime.jsx(material.Typography, __assign$8({ py: 2, variant: "h6", id: id }, { children: t('loading.message', 'Loading…') }))] }))) : (jsxRuntime.jsx(jsxRuntime.Fragment, {}));
+    return isLongLoad() ? (jsxRuntime.jsxs(material.Box, { display: "flex", flexDirection: "column", alignItems: "center", p: 2, children: [jsxRuntime.jsx(material.CircularProgress, { "aria-labelledby": id }), jsxRuntime.jsx(material.Typography, { py: 2, variant: "h6", id: id, children: t('loading.message', 'Loading…') })] })) : (jsxRuntime.jsx(jsxRuntime.Fragment, {}));
 }
 
-var __assign$7 = (undefined && undefined.__assign) || function () {
-    __assign$7 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$7.apply(this, arguments);
-};
 function MissingCapabilitiesError(_a) {
     var onRetry = _a.onRetry;
     var t = reactI18next.useTranslation('widget-toolkit').t;
-    return (jsxRuntime.jsx(material.Box, __assign$7({ my: 2 }, { children: jsxRuntime.jsxs(material.Alert, __assign$7({ severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}) }, { children: [jsxRuntime.jsx(material.AlertTitle, { children: t('missing-capabilities.title', 'Missing capabilities') }), jsxRuntime.jsx(material.Typography, __assign$7({ variant: "body2" }, { children: t('missing-capabilities.instructions', 'The minimum capabilities required for this widget are missing. Make sure to grant all requested capabilities.') })), jsxRuntime.jsx(material.Box, __assign$7({ mt: 1 }, { children: jsxRuntime.jsx(material.Button, __assign$7({ variant: "contained", onClick: onRetry }, { children: t('missing-capabilities.request-capabilities', 'Request capabilities') })) }))] })) })));
+    return (jsxRuntime.jsx(material.Box, { my: 2, children: jsxRuntime.jsxs(material.Alert, { severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}), children: [jsxRuntime.jsx(material.AlertTitle, { children: t('missing-capabilities.title', 'Missing capabilities') }), jsxRuntime.jsx(material.Typography, { variant: "body2", children: t('missing-capabilities.instructions', 'The minimum capabilities required for this widget are missing. Make sure to grant all requested capabilities.') }), jsxRuntime.jsx(material.Box, { mt: 1, children: jsxRuntime.jsx(material.Button, { variant: "contained", onClick: onRetry, children: t('missing-capabilities.request-capabilities', 'Request capabilities') }) })] }) }));
 }
 
-var __assign$6 = (undefined && undefined.__assign) || function () {
-    __assign$6 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$6.apply(this, arguments);
-};
 /**
  * A guard that ask the user for capabilities and only shows the `children`
  * if all capabilities were accepted.
@@ -858,65 +803,32 @@ var __assign$6 = (undefined && undefined.__assign) || function () {
  */
 function MuiCapabilitiesGuard(_a) {
     var capabilities = _a.capabilities, children = _a.children;
-    return (jsxRuntime.jsx(react$1.CapabilitiesGuard, __assign$6({ capabilities: capabilities, loadingComponent: LoadingView, missingCapabilitiesComponent: MissingCapabilitiesError }, { children: children })));
+    return (jsxRuntime.jsx(react$1.CapabilitiesGuard, { capabilities: capabilities, loadingComponent: LoadingView, missingCapabilitiesComponent: MissingCapabilitiesError, children: children }));
 }
 
-var __assign$5 = (undefined && undefined.__assign) || function () {
-    __assign$5 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$5.apply(this, arguments);
-};
 function CopyableCode(_a) {
     var code = _a.code;
     var t = reactI18next.useTranslation('widget-toolkit').t;
     var _b = react$2.useState(false), hasCopied = _b[0], setHasCopied = _b[1];
     var _c = reactUse.useCopyToClipboard(), copyToClipboard = _c[1];
     var copyLabel = t('code.copy-to-clipboard', 'Copy to clipboard');
-    return (jsxRuntime.jsx(material.Paper, __assign$5({ sx: { position: 'relative' } }, { children: jsxRuntime.jsxs(material.Box, __assign$5({ sx: { overflowY: 'auto' } }, { children: [jsxRuntime.jsx(material.Box, __assign$5({ component: "code", sx: { userSelect: 'all' }, m: 0 }, { children: jsxRuntime.jsx(material.Box, __assign$5({ component: "pre", m: 2 }, { children: code })) })), jsxRuntime.jsx(material.IconButton, __assign$5({ sx: function (theme) { return ({
+    return (jsxRuntime.jsx(material.Paper, { sx: { position: 'relative' }, children: jsxRuntime.jsxs(material.Box, { sx: { overflowY: 'auto' }, children: [jsxRuntime.jsx(material.Box, { component: "code", sx: { userSelect: 'all' }, m: 0, children: jsxRuntime.jsx(material.Box, { component: "pre", m: 2, children: code }) }), jsxRuntime.jsx(material.IconButton, { sx: function (theme) { return ({
                         position: 'absolute',
                         right: theme.spacing(1),
                         bottom: theme.spacing(1),
                     }); }, onClick: function () {
                         copyToClipboard(code);
                         setHasCopied(true);
-                    }, onBlur: function () { return setHasCopied(false); }, "aria-label": copyLabel }, { children: hasCopied ? jsxRuntime.jsx(CheckOutlinedIcon__default.default, {}) : jsxRuntime.jsx(ContentCopyOutlinedIcon__default.default, {}) }))] })) })));
+                    }, onBlur: function () { return setHasCopied(false); }, "aria-label": copyLabel, children: hasCopied ? jsxRuntime.jsx(CheckOutlinedIcon__default.default, {}) : jsxRuntime.jsx(ContentCopyOutlinedIcon__default.default, {}) })] }) }));
 }
 
-var __assign$4 = (undefined && undefined.__assign) || function () {
-    __assign$4 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$4.apply(this, arguments);
-};
 function ChildError(_a) {
     var _b;
     var error = _a.error;
     var t = reactI18next.useTranslation('widget-toolkit').t;
-    return (jsxRuntime.jsx(material.Box, __assign$4({ my: 2 }, { children: jsxRuntime.jsxs(material.Alert, __assign$4({ severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}) }, { children: [jsxRuntime.jsx(material.AlertTitle, { children: t('error.title', 'Ohh no!') }), jsxRuntime.jsx(material.Typography, __assign$4({ variant: "body2" }, { children: t('error.instructions', 'An error occured inside the widget. You can try to reopen the widget.') })), jsxRuntime.jsx(material.Box, __assign$4({ mt: 1 }, { children: jsxRuntime.jsx(CopyableCode, { code: "".concat((_b = error.stack) !== null && _b !== void 0 ? _b : error) }) }))] })) })));
+    return (jsxRuntime.jsx(material.Box, { my: 2, children: jsxRuntime.jsxs(material.Alert, { severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}), children: [jsxRuntime.jsx(material.AlertTitle, { children: t('error.title', 'Ohh no!') }), jsxRuntime.jsx(material.Typography, { variant: "body2", children: t('error.instructions', 'An error occured inside the widget. You can try to reopen the widget.') }), jsxRuntime.jsx(material.Box, { mt: 1, children: jsxRuntime.jsx(CopyableCode, { code: "".concat((_b = error.stack) !== null && _b !== void 0 ? _b : error) }) })] }) }));
 }
 
-var __assign$3 = (undefined && undefined.__assign) || function () {
-    __assign$3 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$3.apply(this, arguments);
-};
 var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -932,7 +844,7 @@ var __generator = (undefined && undefined.__generator) || function (thisArg, bod
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -982,54 +894,21 @@ function MissingParametersError(_a) {
     var errorDialogTextId = utils.unstable_useId();
     var successDialogTitleId = utils.unstable_useId();
     var successDialogTextId = utils.unstable_useId();
-    return (jsxRuntime.jsxs(material.Box, __assign$3({ my: 2 }, { children: [jsxRuntime.jsxs(material.Alert, __assign$3({ severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}) }, { children: [jsxRuntime.jsx(material.AlertTitle, { children: t('missing-parameters.title', 'Wrong widget registration') }), jsxRuntime.jsx(material.Typography, __assign$3({ variant: "body2" }, { children: t('missing-parameters.instructions', 'The widget is not registered correctly. Make sure to include the correct parameters in the widget URL:') })), jsxRuntime.jsx(material.Box, __assign$3({ my: 1 }, { children: jsxRuntime.jsx(CopyableCode, { code: api.generateWidgetRegistrationUrl() }) })), jsxRuntime.jsx(material.Typography, __assign$3({ variant: "body2" }, { children: t('missing-parameters.repair-instructions', 'You can either modify the widget registration manually or fix it automatically:') })), jsxRuntime.jsx(material.Box, __assign$3({ mt: 1 }, { children: jsxRuntime.jsx(material.Button, __assign$3({ variant: "contained", onClick: handleRepairWidget }, { children: t('missing-parameters.repair', 'Repair registration') })) }))] })), jsxRuntime.jsxs(material.Dialog, __assign$3({ open: isErrorDialogOpen, onClose: function () { return setErrorDialogOpen(false); }, "aria-labelledby": errorDialogTitleId, "aria-describedby": errorDialogTextId }, { children: [jsxRuntime.jsx(material.DialogTitle, __assign$3({ id: errorDialogTitleId }, { children: t('missing-parameters.permissions-error.title', 'Error') })), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(material.DialogContentText, __assign$3({ id: errorDialogTextId }, { children: t('missing-parameters.permissions-error.instructions', 'Insufficient permissions, could not configure widget. Only room admins can configure the widget.') })) }), jsxRuntime.jsx(material.DialogActions, { children: jsxRuntime.jsx(material.Button, __assign$3({ onClick: function () { return setErrorDialogOpen(false); }, autoFocus: true }, { children: t('missing-parameters.permissions-error.close', 'Close') })) })] })), jsxRuntime.jsxs(material.Dialog, __assign$3({ open: isCompleted, "aria-labelledby": successDialogTitleId, "aria-describedby": successDialogTextId }, { children: [jsxRuntime.jsx(material.DialogTitle, __assign$3({ id: successDialogTitleId }, { children: t('missing-parameters.completed.title', 'Widget configuration complete') })), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(material.DialogContentText, __assign$3({ id: successDialogTextId }, { children: t('missing-parameters.completed.instructions', 'Configuration completed, reopen the widget to start using it.') })) })] }))] })));
+    return (jsxRuntime.jsxs(material.Box, { my: 2, children: [jsxRuntime.jsxs(material.Alert, { severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}), children: [jsxRuntime.jsx(material.AlertTitle, { children: t('missing-parameters.title', 'Wrong widget registration') }), jsxRuntime.jsx(material.Typography, { variant: "body2", children: t('missing-parameters.instructions', 'The widget is not registered correctly. Make sure to include the correct parameters in the widget URL:') }), jsxRuntime.jsx(material.Box, { my: 1, children: jsxRuntime.jsx(CopyableCode, { code: api.generateWidgetRegistrationUrl() }) }), jsxRuntime.jsx(material.Typography, { variant: "body2", children: t('missing-parameters.repair-instructions', 'You can either modify the widget registration manually or fix it automatically:') }), jsxRuntime.jsx(material.Box, { mt: 1, children: jsxRuntime.jsx(material.Button, { variant: "contained", onClick: handleRepairWidget, children: t('missing-parameters.repair', 'Repair registration') }) })] }), jsxRuntime.jsxs(material.Dialog, { open: isErrorDialogOpen, onClose: function () { return setErrorDialogOpen(false); }, "aria-labelledby": errorDialogTitleId, "aria-describedby": errorDialogTextId, children: [jsxRuntime.jsx(material.DialogTitle, { id: errorDialogTitleId, children: t('missing-parameters.permissions-error.title', 'Error') }), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(material.DialogContentText, { id: errorDialogTextId, children: t('missing-parameters.permissions-error.instructions', 'Insufficient permissions, could not configure widget. Only room admins can configure the widget.') }) }), jsxRuntime.jsx(material.DialogActions, { children: jsxRuntime.jsx(material.Button, { onClick: function () { return setErrorDialogOpen(false); }, autoFocus: true, children: t('missing-parameters.permissions-error.close', 'Close') }) })] }), jsxRuntime.jsxs(material.Dialog, { open: isCompleted, "aria-labelledby": successDialogTitleId, "aria-describedby": successDialogTextId, children: [jsxRuntime.jsx(material.DialogTitle, { id: successDialogTitleId, children: t('missing-parameters.completed.title', 'Widget configuration complete') }), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(material.DialogContentText, { id: successDialogTextId, children: t('missing-parameters.completed.instructions', 'Configuration completed, reopen the widget to start using it.') }) })] })] }));
 }
 
-var __assign$2 = (undefined && undefined.__assign) || function () {
-    __assign$2 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$2.apply(this, arguments);
-};
 function MobileClientError() {
     var t = reactI18next.useTranslation('widget-toolkit').t;
-    return (jsxRuntime.jsx(material.Box, __assign$2({ m: 2 }, { children: jsxRuntime.jsxs(material.Alert, __assign$2({ severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}) }, { children: [jsxRuntime.jsx(material.AlertTitle, { children: t('mobile-client.title', 'Mobile clients are not supported') }), t('mobile-client.instructions', "The widget doesn't work in mobile clients due to technical limitations. Open the widget on you Desktop or Web client.")] })) })));
+    return (jsxRuntime.jsx(material.Box, { m: 2, children: jsxRuntime.jsxs(material.Alert, { severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}), children: [jsxRuntime.jsx(material.AlertTitle, { children: t('mobile-client.title', 'Mobile clients are not supported') }), t('mobile-client.instructions', "The widget doesn't work in mobile clients due to technical limitations. Open the widget on you Desktop or Web client.")] }) }));
 }
 
-var __assign$1 = (undefined && undefined.__assign) || function () {
-    __assign$1 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$1.apply(this, arguments);
-};
 function OutsideClientError() {
     var t = reactI18next.useTranslation('widget-toolkit').t;
-    return (jsxRuntime.jsx(material.Box, __assign$1({ m: 2 }, { children: jsxRuntime.jsxs(material.Alert, __assign$1({ severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}) }, { children: [jsxRuntime.jsx(material.AlertTitle, { children: t('outside-client.title', 'Only runs as a widget') }), jsxRuntime.jsx(material.Typography, __assign$1({ variant: "body2" }, { children: t('outside-client.instructions', "You need to register this URL as a widget, it's not possible to use it standalone. Run this command in the matrix room you want to register the widget in:") })), jsxRuntime.jsx(material.Box, __assign$1({ mt: 1 }, { children: jsxRuntime.jsx(CopyableCode, { code: "/addwidget ".concat(api.generateWidgetRegistrationUrl({
+    return (jsxRuntime.jsx(material.Box, { m: 2, children: jsxRuntime.jsxs(material.Alert, { severity: "error", icon: jsxRuntime.jsx(ErrorIcon__default.default, {}), children: [jsxRuntime.jsx(material.AlertTitle, { children: t('outside-client.title', 'Only runs as a widget') }), jsxRuntime.jsx(material.Typography, { variant: "body2", children: t('outside-client.instructions', "You need to register this URL as a widget, it's not possible to use it standalone. Run this command in the matrix room you want to register the widget in:") }), jsxRuntime.jsx(material.Box, { mt: 1, children: jsxRuntime.jsx(CopyableCode, { code: "/addwidget ".concat(api.generateWidgetRegistrationUrl({
                             includeParameters: false,
-                        })) }) }))] })) })));
+                        })) }) })] }) }));
 }
 
-var __assign = (undefined && undefined.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 /**
  * Provides the `WidgetApi` in the React context once it's fully
  * initialized without errors.
@@ -1038,7 +917,7 @@ var __assign = (undefined && undefined.__assign) || function () {
  */
 function MuiWidgetApiProvider(_a) {
     var widgetRegistration = _a.widgetRegistration, widgetApiPromise = _a.widgetApiPromise, children = _a.children;
-    return (jsxRuntime.jsx(react$1.WidgetApiProvider, __assign({ widgetApiPromise: widgetApiPromise, widgetRegistration: widgetRegistration, loadingViewComponent: LoadingView, mobileClientErrorComponent: MobileClientError, childErrorComponent: ChildError, outsideClientErrorComponent: OutsideClientError, missingCapabilitiesComponent: MissingCapabilitiesError, missingParametersErrorComponent: MissingParametersError }, { children: children })));
+    return (jsxRuntime.jsx(react$1.WidgetApiProvider, { widgetApiPromise: widgetApiPromise, widgetRegistration: widgetRegistration, loadingViewComponent: LoadingView, mobileClientErrorComponent: MobileClientError, childErrorComponent: ChildError, outsideClientErrorComponent: OutsideClientError, missingCapabilitiesComponent: MissingCapabilitiesError, missingParametersErrorComponent: MissingParametersError, children: children }));
 }
 
 /*

package/build/esm/index.js

@@ -19,6 +19,42 @@ import { repairWidgetRegistration, generateWidgetRegistrationUrl, extractWidgetP
 import LanguageDetector from 'i18next-browser-languagedetector';
 import resourcesToBackend from 'i18next-resources-to-backend';
 
+/*
+ * Copyright 2022 Nordeck IT + Consulting GmbH
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Retrieve the nonce passed by our Docker base image.
+ * @returns A nonce that can be used to perform operations that are disabled in
+ *          our CSP by default.
+ */
+function getNonce() {
+    return window['NONCE'];
+}
+
+function createEmotionCache() {
+    return createCache({
+        key: 'widget',
+        nonce: getNonce(),
+    });
+}
+var cache = createEmotionCache();
+function EmotionCacheProvider(_a) {
+    var children = _a.children;
+    return jsx(CacheProvider, { value: cache, children: children });
+}
+
 /*
  * Copyright 2022 Nordeck IT + Consulting GmbH
  *
@@ -56,53 +92,6 @@ function getEnvironment(name, defaultValue) {
     return value !== null && value !== void 0 ? value : defaultValue;
 }
 
-/*
- * Copyright 2022 Nordeck IT + Consulting GmbH
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * Retrieve the nonce passed by our Docker base image.
- * @returns A nonce that can be used to perform operations that are disabled in
- *          our CSP by default.
- */
-function getNonce() {
-    return window['NONCE'];
-}
-
-var __assign$b = (undefined && undefined.__assign) || function () {
-    __assign$b = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$b.apply(this, arguments);
-};
-function createEmotionCache() {
-    return createCache({
-        key: 'widget',
-        nonce: getNonce(),
-    });
-}
-var cache = createEmotionCache();
-function EmotionCacheProvider(_a) {
-    var children = _a.children;
-    return jsx(CacheProvider, __assign$b({ value: cache }, { children: children }));
-}
-
 /*
  * Copyright 2022 Nordeck IT + Consulting GmbH
  *
@@ -120,12 +109,12 @@ function EmotionCacheProvider(_a) {
  */
 var fontFamily = [
     'Inter',
-    'Twemoji',
-    '"Apple Color Emoji"',
-    '"Segoe UI Emoji"',
     'Arial',
     'Helvetica',
     'sans-serif',
+    'Twemoji',
+    '"Apple Color Emoji"',
+    '"Segoe UI Emoji"',
     '"Noto Color Emoji"',
 ].join(',');
 var primaryColor = getEnvironment('REACT_APP_PRIMARY_COLOR', '#0dbd8b');
@@ -601,17 +590,6 @@ var darkTheme = {
     },
 };
 
-var __assign$a = (undefined && undefined.__assign) || function () {
-    __assign$a = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$a.apply(this, arguments);
-};
 /**
  * Provide a semantic UI based theme to the child components.
  * @param param0 - {@link MuiThemeProviderProps}
@@ -649,7 +627,7 @@ function ElementMuiThemeProvider(_a) {
         var localeOptions = locale && new Intl.Locale(locale).language === 'de' ? deDE : enUS;
         return createTheme(deepmerge(baseTheme, themeOptions), localeOptions);
     }, [locale, theme]);
-    return (jsxs(ThemeProvider, __assign$a({ theme: muiTheme }, { children: [jsx(CssBaseline, {}), children] })));
+    return (jsxs(ThemeProvider, { theme: muiTheme, children: [jsx(CssBaseline, {}), children] }));
 }
 
 /*
@@ -742,8 +720,8 @@ function getInitialLetter(name) {
     return split(name, '', 1)[0].toUpperCase();
 }
 
-var __assign$9 = (undefined && undefined.__assign) || function () {
-    __assign$9 = Object.assign || function(t) {
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
             s = arguments[i];
             for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
@@ -751,7 +729,7 @@ var __assign$9 = (undefined && undefined.__assign) || function () {
         }
         return t;
     };
-    return __assign$9.apply(this, arguments);
+    return __assign.apply(this, arguments);
 };
 var __rest = (undefined && undefined.__rest) || function (s, e) {
     var t = {};
@@ -788,55 +766,22 @@ var ElementAvatar = forwardRef(function ElementAvatar(_a, ref) {
     var avatarUrl = _a.avatarUrl, userId = _a.userId, displayName = _a.displayName, props = __rest(_a, ["avatarUrl", "userId", "displayName"]);
     var src = avatarUrl ? createAvatarUrl(avatarUrl) : undefined;
     var name = displayName !== null && displayName !== void 0 ? displayName : userId;
-    return (jsx(StyledAvatar, __assign$9({ ref: ref, alt: "", "aria-hidden": true, src: src, color: getColor(userId) }, props, { children: getInitialLetter(name) })));
+    return (jsx(StyledAvatar, __assign({ ref: ref, alt: "", "aria-hidden": true, src: src, color: getColor(userId) }, props, { children: getInitialLetter(name) })));
 });
 
-var __assign$8 = (undefined && undefined.__assign) || function () {
-    __assign$8 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$8.apply(this, arguments);
-};
 function LoadingView() {
     var id = unstable_useId();
     var isLongLoad = useTimeout(100)[0];
     var t = useTranslation('widget-toolkit').t;
-    return isLongLoad() ? (jsxs(Box, __assign$8({ display: "flex", flexDirection: "column", alignItems: "center", p: 2 }, { children: [jsx(CircularProgress, { "aria-labelledby": id }), jsx(Typography, __assign$8({ py: 2, variant: "h6", id: id }, { children: t('loading.message', 'Loading…') }))] }))) : (jsx(Fragment, {}));
+    return isLongLoad() ? (jsxs(Box, { display: "flex", flexDirection: "column", alignItems: "center", p: 2, children: [jsx(CircularProgress, { "aria-labelledby": id }), jsx(Typography, { py: 2, variant: "h6", id: id, children: t('loading.message', 'Loading…') })] })) : (jsx(Fragment, {}));
 }
 
-var __assign$7 = (undefined && undefined.__assign) || function () {
-    __assign$7 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$7.apply(this, arguments);
-};
 function MissingCapabilitiesError(_a) {
     var onRetry = _a.onRetry;
     var t = useTranslation('widget-toolkit').t;
-    return (jsx(Box, __assign$7({ my: 2 }, { children: jsxs(Alert, __assign$7({ severity: "error", icon: jsx(ErrorIcon, {}) }, { children: [jsx(AlertTitle, { children: t('missing-capabilities.title', 'Missing capabilities') }), jsx(Typography, __assign$7({ variant: "body2" }, { children: t('missing-capabilities.instructions', 'The minimum capabilities required for this widget are missing. Make sure to grant all requested capabilities.') })), jsx(Box, __assign$7({ mt: 1 }, { children: jsx(Button, __assign$7({ variant: "contained", onClick: onRetry }, { children: t('missing-capabilities.request-capabilities', 'Request capabilities') })) }))] })) })));
+    return (jsx(Box, { my: 2, children: jsxs(Alert, { severity: "error", icon: jsx(ErrorIcon, {}), children: [jsx(AlertTitle, { children: t('missing-capabilities.title', 'Missing capabilities') }), jsx(Typography, { variant: "body2", children: t('missing-capabilities.instructions', 'The minimum capabilities required for this widget are missing. Make sure to grant all requested capabilities.') }), jsx(Box, { mt: 1, children: jsx(Button, { variant: "contained", onClick: onRetry, children: t('missing-capabilities.request-capabilities', 'Request capabilities') }) })] }) }));
 }
 
-var __assign$6 = (undefined && undefined.__assign) || function () {
-    __assign$6 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$6.apply(this, arguments);
-};
 /**
  * A guard that ask the user for capabilities and only shows the `children`
  * if all capabilities were accepted.
@@ -846,65 +791,32 @@ var __assign$6 = (undefined && undefined.__assign) || function () {
  */
 function MuiCapabilitiesGuard(_a) {
     var capabilities = _a.capabilities, children = _a.children;
-    return (jsx(CapabilitiesGuard, __assign$6({ capabilities: capabilities, loadingComponent: LoadingView, missingCapabilitiesComponent: MissingCapabilitiesError }, { children: children })));
+    return (jsx(CapabilitiesGuard, { capabilities: capabilities, loadingComponent: LoadingView, missingCapabilitiesComponent: MissingCapabilitiesError, children: children }));
 }
 
-var __assign$5 = (undefined && undefined.__assign) || function () {
-    __assign$5 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$5.apply(this, arguments);
-};
 function CopyableCode(_a) {
     var code = _a.code;
     var t = useTranslation('widget-toolkit').t;
     var _b = useState(false), hasCopied = _b[0], setHasCopied = _b[1];
     var _c = useCopyToClipboard(), copyToClipboard = _c[1];
     var copyLabel = t('code.copy-to-clipboard', 'Copy to clipboard');
-    return (jsx(Paper, __assign$5({ sx: { position: 'relative' } }, { children: jsxs(Box, __assign$5({ sx: { overflowY: 'auto' } }, { children: [jsx(Box, __assign$5({ component: "code", sx: { userSelect: 'all' }, m: 0 }, { children: jsx(Box, __assign$5({ component: "pre", m: 2 }, { children: code })) })), jsx(IconButton, __assign$5({ sx: function (theme) { return ({
+    return (jsx(Paper, { sx: { position: 'relative' }, children: jsxs(Box, { sx: { overflowY: 'auto' }, children: [jsx(Box, { component: "code", sx: { userSelect: 'all' }, m: 0, children: jsx(Box, { component: "pre", m: 2, children: code }) }), jsx(IconButton, { sx: function (theme) { return ({
                         position: 'absolute',
                         right: theme.spacing(1),
                         bottom: theme.spacing(1),
                     }); }, onClick: function () {
                         copyToClipboard(code);
                         setHasCopied(true);
-                    }, onBlur: function () { return setHasCopied(false); }, "aria-label": copyLabel }, { children: hasCopied ? jsx(CheckOutlinedIcon, {}) : jsx(ContentCopyOutlinedIcon, {}) }))] })) })));
+                    }, onBlur: function () { return setHasCopied(false); }, "aria-label": copyLabel, children: hasCopied ? jsx(CheckOutlinedIcon, {}) : jsx(ContentCopyOutlinedIcon, {}) })] }) }));
 }
 
-var __assign$4 = (undefined && undefined.__assign) || function () {
-    __assign$4 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$4.apply(this, arguments);
-};
 function ChildError(_a) {
     var _b;
     var error = _a.error;
     var t = useTranslation('widget-toolkit').t;
-    return (jsx(Box, __assign$4({ my: 2 }, { children: jsxs(Alert, __assign$4({ severity: "error", icon: jsx(ErrorIcon, {}) }, { children: [jsx(AlertTitle, { children: t('error.title', 'Ohh no!') }), jsx(Typography, __assign$4({ variant: "body2" }, { children: t('error.instructions', 'An error occured inside the widget. You can try to reopen the widget.') })), jsx(Box, __assign$4({ mt: 1 }, { children: jsx(CopyableCode, { code: "".concat((_b = error.stack) !== null && _b !== void 0 ? _b : error) }) }))] })) })));
+    return (jsx(Box, { my: 2, children: jsxs(Alert, { severity: "error", icon: jsx(ErrorIcon, {}), children: [jsx(AlertTitle, { children: t('error.title', 'Ohh no!') }), jsx(Typography, { variant: "body2", children: t('error.instructions', 'An error occured inside the widget. You can try to reopen the widget.') }), jsx(Box, { mt: 1, children: jsx(CopyableCode, { code: "".concat((_b = error.stack) !== null && _b !== void 0 ? _b : error) }) })] }) }));
 }
 
-var __assign$3 = (undefined && undefined.__assign) || function () {
-    __assign$3 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$3.apply(this, arguments);
-};
 var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -920,7 +832,7 @@ var __generator = (undefined && undefined.__generator) || function (thisArg, bod
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -970,54 +882,21 @@ function MissingParametersError(_a) {
     var errorDialogTextId = unstable_useId();
     var successDialogTitleId = unstable_useId();
     var successDialogTextId = unstable_useId();
-    return (jsxs(Box, __assign$3({ my: 2 }, { children: [jsxs(Alert, __assign$3({ severity: "error", icon: jsx(ErrorIcon, {}) }, { children: [jsx(AlertTitle, { children: t('missing-parameters.title', 'Wrong widget registration') }), jsx(Typography, __assign$3({ variant: "body2" }, { children: t('missing-parameters.instructions', 'The widget is not registered correctly. Make sure to include the correct parameters in the widget URL:') })), jsx(Box, __assign$3({ my: 1 }, { children: jsx(CopyableCode, { code: generateWidgetRegistrationUrl() }) })), jsx(Typography, __assign$3({ variant: "body2" }, { children: t('missing-parameters.repair-instructions', 'You can either modify the widget registration manually or fix it automatically:') })), jsx(Box, __assign$3({ mt: 1 }, { children: jsx(Button, __assign$3({ variant: "contained", onClick: handleRepairWidget }, { children: t('missing-parameters.repair', 'Repair registration') })) }))] })), jsxs(Dialog, __assign$3({ open: isErrorDialogOpen, onClose: function () { return setErrorDialogOpen(false); }, "aria-labelledby": errorDialogTitleId, "aria-describedby": errorDialogTextId }, { children: [jsx(DialogTitle, __assign$3({ id: errorDialogTitleId }, { children: t('missing-parameters.permissions-error.title', 'Error') })), jsx(DialogContent, { children: jsx(DialogContentText, __assign$3({ id: errorDialogTextId }, { children: t('missing-parameters.permissions-error.instructions', 'Insufficient permissions, could not configure widget. Only room admins can configure the widget.') })) }), jsx(DialogActions, { children: jsx(Button, __assign$3({ onClick: function () { return setErrorDialogOpen(false); }, autoFocus: true }, { children: t('missing-parameters.permissions-error.close', 'Close') })) })] })), jsxs(Dialog, __assign$3({ open: isCompleted, "aria-labelledby": successDialogTitleId, "aria-describedby": successDialogTextId }, { children: [jsx(DialogTitle, __assign$3({ id: successDialogTitleId }, { children: t('missing-parameters.completed.title', 'Widget configuration complete') })), jsx(DialogContent, { children: jsx(DialogContentText, __assign$3({ id: successDialogTextId }, { children: t('missing-parameters.completed.instructions', 'Configuration completed, reopen the widget to start using it.') })) })] }))] })));
+    return (jsxs(Box, { my: 2, children: [jsxs(Alert, { severity: "error", icon: jsx(ErrorIcon, {}), children: [jsx(AlertTitle, { children: t('missing-parameters.title', 'Wrong widget registration') }), jsx(Typography, { variant: "body2", children: t('missing-parameters.instructions', 'The widget is not registered correctly. Make sure to include the correct parameters in the widget URL:') }), jsx(Box, { my: 1, children: jsx(CopyableCode, { code: generateWidgetRegistrationUrl() }) }), jsx(Typography, { variant: "body2", children: t('missing-parameters.repair-instructions', 'You can either modify the widget registration manually or fix it automatically:') }), jsx(Box, { mt: 1, children: jsx(Button, { variant: "contained", onClick: handleRepairWidget, children: t('missing-parameters.repair', 'Repair registration') }) })] }), jsxs(Dialog, { open: isErrorDialogOpen, onClose: function () { return setErrorDialogOpen(false); }, "aria-labelledby": errorDialogTitleId, "aria-describedby": errorDialogTextId, children: [jsx(DialogTitle, { id: errorDialogTitleId, children: t('missing-parameters.permissions-error.title', 'Error') }), jsx(DialogContent, { children: jsx(DialogContentText, { id: errorDialogTextId, children: t('missing-parameters.permissions-error.instructions', 'Insufficient permissions, could not configure widget. Only room admins can configure the widget.') }) }), jsx(DialogActions, { children: jsx(Button, { onClick: function () { return setErrorDialogOpen(false); }, autoFocus: true, children: t('missing-parameters.permissions-error.close', 'Close') }) })] }), jsxs(Dialog, { open: isCompleted, "aria-labelledby": successDialogTitleId, "aria-describedby": successDialogTextId, children: [jsx(DialogTitle, { id: successDialogTitleId, children: t('missing-parameters.completed.title', 'Widget configuration complete') }), jsx(DialogContent, { children: jsx(DialogContentText, { id: successDialogTextId, children: t('missing-parameters.completed.instructions', 'Configuration completed, reopen the widget to start using it.') }) })] })] }));
 }
 
-var __assign$2 = (undefined && undefined.__assign) || function () {
-    __assign$2 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$2.apply(this, arguments);
-};
 function MobileClientError() {
     var t = useTranslation('widget-toolkit').t;
-    return (jsx(Box, __assign$2({ m: 2 }, { children: jsxs(Alert, __assign$2({ severity: "error", icon: jsx(ErrorIcon, {}) }, { children: [jsx(AlertTitle, { children: t('mobile-client.title', 'Mobile clients are not supported') }), t('mobile-client.instructions', "The widget doesn't work in mobile clients due to technical limitations. Open the widget on you Desktop or Web client.")] })) })));
+    return (jsx(Box, { m: 2, children: jsxs(Alert, { severity: "error", icon: jsx(ErrorIcon, {}), children: [jsx(AlertTitle, { children: t('mobile-client.title', 'Mobile clients are not supported') }), t('mobile-client.instructions', "The widget doesn't work in mobile clients due to technical limitations. Open the widget on you Desktop or Web client.")] }) }));
 }
 
-var __assign$1 = (undefined && undefined.__assign) || function () {
-    __assign$1 = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign$1.apply(this, arguments);
-};
 function OutsideClientError() {
     var t = useTranslation('widget-toolkit').t;
-    return (jsx(Box, __assign$1({ m: 2 }, { children: jsxs(Alert, __assign$1({ severity: "error", icon: jsx(ErrorIcon, {}) }, { children: [jsx(AlertTitle, { children: t('outside-client.title', 'Only runs as a widget') }), jsx(Typography, __assign$1({ variant: "body2" }, { children: t('outside-client.instructions', "You need to register this URL as a widget, it's not possible to use it standalone. Run this command in the matrix room you want to register the widget in:") })), jsx(Box, __assign$1({ mt: 1 }, { children: jsx(CopyableCode, { code: "/addwidget ".concat(generateWidgetRegistrationUrl({
+    return (jsx(Box, { m: 2, children: jsxs(Alert, { severity: "error", icon: jsx(ErrorIcon, {}), children: [jsx(AlertTitle, { children: t('outside-client.title', 'Only runs as a widget') }), jsx(Typography, { variant: "body2", children: t('outside-client.instructions', "You need to register this URL as a widget, it's not possible to use it standalone. Run this command in the matrix room you want to register the widget in:") }), jsx(Box, { mt: 1, children: jsx(CopyableCode, { code: "/addwidget ".concat(generateWidgetRegistrationUrl({
                             includeParameters: false,
-                        })) }) }))] })) })));
+                        })) }) })] }) }));
 }
 
-var __assign = (undefined && undefined.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 /**
  * Provides the `WidgetApi` in the React context once it's fully
  * initialized without errors.
@@ -1026,7 +905,7 @@ var __assign = (undefined && undefined.__assign) || function () {
  */
 function MuiWidgetApiProvider(_a) {
     var widgetRegistration = _a.widgetRegistration, widgetApiPromise = _a.widgetApiPromise, children = _a.children;
-    return (jsx(WidgetApiProvider, __assign({ widgetApiPromise: widgetApiPromise, widgetRegistration: widgetRegistration, loadingViewComponent: LoadingView, mobileClientErrorComponent: MobileClientError, childErrorComponent: ChildError, outsideClientErrorComponent: OutsideClientError, missingCapabilitiesComponent: MissingCapabilitiesError, missingParametersErrorComponent: MissingParametersError }, { children: children })));
+    return (jsx(WidgetApiProvider, { widgetApiPromise: widgetApiPromise, widgetRegistration: widgetRegistration, loadingViewComponent: LoadingView, mobileClientErrorComponent: MobileClientError, childErrorComponent: ChildError, outsideClientErrorComponent: OutsideClientError, missingCapabilitiesComponent: MissingCapabilitiesError, missingParametersErrorComponent: MissingParametersError, children: children }));
 }
 
 /*

package/build/index.d.ts

@@ -22,7 +22,7 @@ import { WidgetRegistration } from '@matrix-widget-toolkit/api';
  * A component to display user and room avatars in the style of Element.
  * @param param0 - {@link ElementAvatarProps}
  */
-export declare const ElementAvatar: ForwardRefExoticComponent<Pick<ElementAvatarProps, "id" | "userId" | "displayName" | "avatarUrl" | "title" | "results" | "children" | "slot" | "onReset" | "onError" | "color" | "translate" | keyof CommonProps | "sx" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "alt" | "imgProps" | "sizes" | "src" | "srcSet"> & RefAttributes<HTMLDivElement>>;
+export declare const ElementAvatar: ForwardRefExoticComponent<Pick<ElementAvatarProps, "id" | "userId" | "displayName" | "avatarUrl" | "title" | "results" | "children" | "slot" | "onReset" | "onError" | "color" | "translate" | keyof CommonProps | "sx" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "component" | "variant" | "alt" | "imgProps" | "sizes" | "src" | "srcSet"> & RefAttributes<HTMLDivElement>>;
 
 /**
  * Props for the {@link ElementAvatar} component.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@matrix-widget-toolkit/mui",
-  "version": "1.1.3",
+  "version": "1.1.5",
   "description": "A customized material-ui theme that matches the style of the Element Matrix client",
   "author": "Nordeck IT + Consulting GmbH",
   "license": "Apache-2.0",
@@ -8,21 +8,21 @@
   "module": "./build/esm/index.js",
   "types": "./build/index.d.ts",
   "devDependencies": {
-    "@craco/craco": "^6.4.5",
-    "@testing-library/jest-dom": "^5.16.5",
+    "@craco/craco": "^7.1.0",
+    "@testing-library/jest-dom": "^6.0.1",
     "@testing-library/react": "^12.1.5",
     "@testing-library/user-event": "^14.4.3",
     "@types/jest": "^27.5.2",
     "@types/jest-axe": "^3.5.5",
-    "@types/lodash": "^4.14.194",
-    "@types/node": "^16.18.23",
+    "@types/lodash": "^4.14.197",
+    "@types/node": "^16.18.42",
     "@types/react": "^17.0.45",
     "copyfiles": "^2.4.1",
-    "i18next-parser": "^7.7.0",
-    "jest-axe": "^7.0.1",
+    "i18next-parser": "^8.6.0",
+    "jest-axe": "^8.0.0",
     "react": "^17.0.2",
     "react-scripts": "5.0.1",
-    "typescript": "^4.8.4"
+    "typescript": "^5.1.6"
   },
   "scripts": {
     "build": "tsc && rollup --config ../../rollup.config.mjs",
@@ -30,7 +30,7 @@
     "tsc": "tsc",
     "lint": "eslint .",
     "test": "jest --watch",
-    "depcheck": "depcheck --ignores=@types/jest,@types/node,i18next-parser --ignore-dirs=lib,build",
+    "depcheck": "depcheck --ignores=@types/node --ignore-dirs=lib,build",
     "prepack": "node ../../scripts/prepack.js",
     "postpack": "node ../../scripts/postpack.js",
     "translate": "i18next src/**/*.{ts,tsx}",
@@ -38,22 +38,22 @@
     "generate-api-report": "tsc && api-extractor run --verbose --local"
   },
   "dependencies": {
-    "@emotion/cache": "^11.10.7",
-    "@emotion/react": "^11.10.6",
-    "@emotion/styled": "^11.10.6",
-    "@fontsource/inter": "^4.5.15",
-    "@mui/icons-material": "^5.11.16",
-    "@mui/material": "^5.12.0",
-    "@mui/utils": "^5.12.0",
-    "@matrix-widget-toolkit/api": "^3.2.0",
+    "@emotion/cache": "^11.11.0",
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
+    "@fontsource/inter": "^5.0.8",
+    "@mui/icons-material": "^5.14.3",
+    "@mui/material": "^5.14.5",
+    "@mui/utils": "^5.14.5",
+    "@matrix-widget-toolkit/api": "^3.2.1",
     "@matrix-widget-toolkit/react": "^1.0.5",
-    "i18next": "^22.4.14",
-    "i18next-browser-languagedetector": "^7.0.1",
+    "i18next": "^23.4.4",
+    "i18next-browser-languagedetector": "^7.1.0",
     "i18next-resources-to-backend": "^1.1.3",
     "lodash": "^4.17.21",
     "matrix-widget-api": "^1.3.1",
     "react": "^17.0.2",
-    "react-i18next": "^12.2.0",
+    "react-i18next": "^13.1.2",
     "react-use": "^17.4.0"
   },
   "repository": {