@rocket.chat/fuselage 0.60.2 → 0.61.0

package/dist/fuselage.development.js

@@ -121,106 +121,6 @@ __webpack_require__.r(__webpack_exports__);
 // extracted by mini-css-extract-plugin
 
 
-/***/ }),
-
-/***/ "../../node_modules/object-assign/index.js":
-/*!*************************************************!*\
-  !*** ../../node_modules/object-assign/index.js ***!
-  \*************************************************/
-/***/ (function(module) {
-
-/*
-object-assign
-(c) Sindre Sorhus
-@license MIT
-*/
-
-
-/* eslint-disable no-unused-vars */
-var getOwnPropertySymbols = Object.getOwnPropertySymbols;
-var hasOwnProperty = Object.prototype.hasOwnProperty;
-var propIsEnumerable = Object.prototype.propertyIsEnumerable;
-
-function toObject(val) {
-	if (val === null || val === undefined) {
-		throw new TypeError('Object.assign cannot be called with null or undefined');
-	}
-
-	return Object(val);
-}
-
-function shouldUseNative() {
-	try {
-		if (!Object.assign) {
-			return false;
-		}
-
-		// Detect buggy property enumeration order in older V8 versions.
-
-		// https://bugs.chromium.org/p/v8/issues/detail?id=4118
-		var test1 = new String('abc');  // eslint-disable-line no-new-wrappers
-		test1[5] = 'de';
-		if (Object.getOwnPropertyNames(test1)[0] === '5') {
-			return false;
-		}
-
-		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
-		var test2 = {};
-		for (var i = 0; i < 10; i++) {
-			test2['_' + String.fromCharCode(i)] = i;
-		}
-		var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
-			return test2[n];
-		});
-		if (order2.join('') !== '0123456789') {
-			return false;
-		}
-
-		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
-		var test3 = {};
-		'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
-			test3[letter] = letter;
-		});
-		if (Object.keys(Object.assign({}, test3)).join('') !==
-				'abcdefghijklmnopqrst') {
-			return false;
-		}
-
-		return true;
-	} catch (err) {
-		// We don't expect any of the above to throw, but better to be safe.
-		return false;
-	}
-}
-
-module.exports = shouldUseNative() ? Object.assign : function (target, source) {
-	var from;
-	var to = toObject(target);
-	var symbols;
-
-	for (var s = 1; s < arguments.length; s++) {
-		from = Object(arguments[s]);
-
-		for (var key in from) {
-			if (hasOwnProperty.call(from, key)) {
-				to[key] = from[key];
-			}
-		}
-
-		if (getOwnPropertySymbols) {
-			symbols = getOwnPropertySymbols(from);
-			for (var i = 0; i < symbols.length; i++) {
-				if (propIsEnumerable.call(from, symbols[i])) {
-					to[symbols[i]] = from[symbols[i]];
-				}
-			}
-		}
-	}
-
-	return to;
-};
-
-
 /***/ }),
 
 /***/ "../../node_modules/react-is/cjs/react-is.development.js":
@@ -471,7 +371,8 @@ exports["default"] = flattenChildren;
   \*********************************************************************/
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
-/** @license React v17.0.2
+/**
+ * @license React
  * react-jsx-runtime.development.js
  *
  * Copyright (c) Facebook, Inc. and its affiliates.
@@ -487,59 +388,25 @@ if (true) {
 'use strict';
 
 var React = __webpack_require__(/*! react */ "react");
-var _assign = __webpack_require__(/*! object-assign */ "../../node_modules/object-assign/index.js");
 
 // ATTENTION
 // When adding new symbols to this file,
 // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
-// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
-// nor polyfill, then a plain number is used for performance.
-var REACT_ELEMENT_TYPE = 0xeac7;
-var REACT_PORTAL_TYPE = 0xeaca;
-exports.Fragment = 0xeacb;
-var REACT_STRICT_MODE_TYPE = 0xeacc;
-var REACT_PROFILER_TYPE = 0xead2;
-var REACT_PROVIDER_TYPE = 0xeacd;
-var REACT_CONTEXT_TYPE = 0xeace;
-var REACT_FORWARD_REF_TYPE = 0xead0;
-var REACT_SUSPENSE_TYPE = 0xead1;
-var REACT_SUSPENSE_LIST_TYPE = 0xead8;
-var REACT_MEMO_TYPE = 0xead3;
-var REACT_LAZY_TYPE = 0xead4;
-var REACT_BLOCK_TYPE = 0xead9;
-var REACT_SERVER_BLOCK_TYPE = 0xeada;
-var REACT_FUNDAMENTAL_TYPE = 0xead5;
-var REACT_SCOPE_TYPE = 0xead7;
-var REACT_OPAQUE_ID_TYPE = 0xeae0;
-var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
-var REACT_OFFSCREEN_TYPE = 0xeae2;
-var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
-
-if (typeof Symbol === 'function' && Symbol.for) {
-  var symbolFor = Symbol.for;
-  REACT_ELEMENT_TYPE = symbolFor('react.element');
-  REACT_PORTAL_TYPE = symbolFor('react.portal');
-  exports.Fragment = symbolFor('react.fragment');
-  REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
-  REACT_PROFILER_TYPE = symbolFor('react.profiler');
-  REACT_PROVIDER_TYPE = symbolFor('react.provider');
-  REACT_CONTEXT_TYPE = symbolFor('react.context');
-  REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
-  REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
-  REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
-  REACT_MEMO_TYPE = symbolFor('react.memo');
-  REACT_LAZY_TYPE = symbolFor('react.lazy');
-  REACT_BLOCK_TYPE = symbolFor('react.block');
-  REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
-  REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
-  REACT_SCOPE_TYPE = symbolFor('react.scope');
-  REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
-  REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
-  REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
-  REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
-}
-
-var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
+// The Symbol used to tag the ReactElement-like types.
+var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_PORTAL_TYPE = Symbol.for('react.portal');
+var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
+var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
+var REACT_PROFILER_TYPE = Symbol.for('react.profiler');
+var REACT_PROVIDER_TYPE = Symbol.for('react.provider');
+var REACT_CONTEXT_TYPE = Symbol.for('react.context');
+var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
+var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense');
+var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list');
+var REACT_MEMO_TYPE = Symbol.for('react.memo');
+var REACT_LAZY_TYPE = Symbol.for('react.lazy');
+var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen');
+var MAYBE_ITERATOR_SYMBOL = Symbol.iterator;
 var FAUX_ITERATOR_SYMBOL = '@@iterator';
 function getIteratorFn(maybeIterable) {
   if (maybeIterable === null || typeof maybeIterable !== 'object') {
@@ -559,11 +426,13 @@ var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FI
 
 function error(format) {
   {
-    for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
-      args[_key2 - 1] = arguments[_key2];
-    }
+    {
+      for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
+        args[_key2 - 1] = arguments[_key2];
+      }
 
-    printWarning('error', format, args);
+      printWarning('error', format, args);
+    }
   }
 }
 
@@ -577,10 +446,11 @@ function printWarning(level, format, args) {
     if (stack !== '') {
       format += '%s';
       args = args.concat([stack]);
-    }
+    } // eslint-disable-next-line react-internal/safe-string-coercion
+
 
     var argsWithFormat = args.map(function (item) {
-      return '' + item;
+      return String(item);
     }); // Careful: RN currently depends on this prefix
 
     argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
@@ -591,9 +461,23 @@ function printWarning(level, format, args) {
   }
 }
 
-// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
+// -----------------------------------------------------------------------------
 
 var enableScopeAPI = false; // Experimental Create Event Handle API.
+var enableCacheElement = false;
+var enableTransitionTracing = false; // No known bugs, but needs performance testing
+
+var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber
+// stuff. Intended to enable React core members to more easily debug scheduling
+// issues in DEV builds.
+
+var enableDebugTracing = false; // Track which Fiber(s) schedule render work.
+
+var REACT_MODULE_REFERENCE;
+
+{
+  REACT_MODULE_REFERENCE = Symbol.for('react.module.reference');
+}
 
 function isValidElementType(type) {
   if (typeof type === 'string' || typeof type === 'function') {
@@ -601,12 +485,16 @@ function isValidElementType(type) {
   } // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
 
 
-  if (type === exports.Fragment || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
+  if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || enableDebugTracing  || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || enableLegacyHidden  || type === REACT_OFFSCREEN_TYPE || enableScopeAPI  || enableCacheElement  || enableTransitionTracing ) {
     return true;
   }
 
   if (typeof type === 'object' && type !== null) {
-    if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
+    if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || // This needs to include all possible module reference object
+    // types supported by any Flight configuration anywhere since
+    // we don't know which Flight build this will end up being used
+    // with.
+    type.$$typeof === REACT_MODULE_REFERENCE || type.getModuleId !== undefined) {
       return true;
     }
   }
@@ -615,15 +503,23 @@ function isValidElementType(type) {
 }
 
 function getWrappedName(outerType, innerType, wrapperName) {
+  var displayName = outerType.displayName;
+
+  if (displayName) {
+    return displayName;
+  }
+
   var functionName = innerType.displayName || innerType.name || '';
-  return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
-}
+  return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName;
+} // Keep in sync with react-reconciler/getComponentNameFromFiber
+
 
 function getContextName(type) {
   return type.displayName || 'Context';
-}
+} // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead.
+
 
-function getComponentName(type) {
+function getComponentNameFromType(type) {
   if (type == null) {
     // Host root, text node or just invalid type.
     return null;
@@ -631,7 +527,7 @@ function getComponentName(type) {
 
   {
     if (typeof type.tag === 'number') {
-      error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
+      error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.');
     }
   }
 
@@ -644,7 +540,7 @@ function getComponentName(type) {
   }
 
   switch (type) {
-    case exports.Fragment:
+    case REACT_FRAGMENT_TYPE:
       return 'Fragment';
 
     case REACT_PORTAL_TYPE:
@@ -661,6 +557,7 @@ function getComponentName(type) {
 
     case REACT_SUSPENSE_LIST_TYPE:
       return 'SuspenseList';
+
   }
 
   if (typeof type === 'object') {
@@ -677,10 +574,13 @@ function getComponentName(type) {
         return getWrappedName(type, type.render, 'ForwardRef');
 
       case REACT_MEMO_TYPE:
-        return getComponentName(type.type);
+        var outerName = type.displayName || null;
 
-      case REACT_BLOCK_TYPE:
-        return getComponentName(type._render);
+        if (outerName !== null) {
+          return outerName;
+        }
+
+        return getComponentNameFromType(type.type) || 'Memo';
 
       case REACT_LAZY_TYPE:
         {
@@ -689,17 +589,21 @@ function getComponentName(type) {
           var init = lazyComponent._init;
 
           try {
-            return getComponentName(init(payload));
+            return getComponentNameFromType(init(payload));
           } catch (x) {
             return null;
           }
         }
+
+      // eslint-disable-next-line no-fallthrough
     }
   }
 
   return null;
 }
 
+var assign = Object.assign;
+
 // Helpers to patch console.logs to avoid logging during side-effect free
 // replaying on render function. This currently only patches the object
 // lazily which won't cover if the log function was extracted eagerly.
@@ -763,25 +667,25 @@ function reenableLogs() {
       }; // $FlowFixMe Flow thinks console is immutable.
 
       Object.defineProperties(console, {
-        log: _assign({}, props, {
+        log: assign({}, props, {
           value: prevLog
         }),
-        info: _assign({}, props, {
+        info: assign({}, props, {
           value: prevInfo
         }),
-        warn: _assign({}, props, {
+        warn: assign({}, props, {
           value: prevWarn
         }),
-        error: _assign({}, props, {
+        error: assign({}, props, {
           value: prevError
         }),
-        group: _assign({}, props, {
+        group: assign({}, props, {
           value: prevGroup
         }),
-        groupCollapsed: _assign({}, props, {
+        groupCollapsed: assign({}, props, {
           value: prevGroupCollapsed
         }),
-        groupEnd: _assign({}, props, {
+        groupEnd: assign({}, props, {
           value: prevGroupEnd
         })
       });
@@ -822,7 +726,7 @@ var componentFrameCache;
 
 function describeNativeComponentFrame(fn, construct) {
   // If something asked for a stack inside a fake render, it should get ignored.
-  if (!fn || reentry) {
+  if ( !fn || reentry) {
     return '';
   }
 
@@ -931,7 +835,14 @@ function describeNativeComponentFrame(fn, construct) {
 
               if (c < 0 || sampleLines[s] !== controlLines[c]) {
                 // V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
-                var _frame = '\n' + sampleLines[s].replace(' at new ', ' at ');
+                var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>"
+                // but we have a user-provided "displayName"
+                // splice it in to make the stack more readable.
+
+
+                if (fn.displayName && _frame.includes('<anonymous>')) {
+                  _frame = _frame.replace('<anonymous>', fn.displayName);
+                }
 
                 {
                   if (typeof fn === 'function') {
@@ -1016,9 +927,6 @@ function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
         // Memo may contain any component type so we recursively resolve it.
         return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
 
-      case REACT_BLOCK_TYPE:
-        return describeFunctionComponentFrame(type._render);
-
       case REACT_LAZY_TYPE:
         {
           var lazyComponent = type;
@@ -1036,6 +944,8 @@ function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
   return '';
 }
 
+var hasOwnProperty = Object.prototype.hasOwnProperty;
+
 var loggedTypeFailures = {};
 var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
 
@@ -1054,7 +964,7 @@ function setCurrentlyValidatingElement(element) {
 function checkPropTypes(typeSpecs, values, location, componentName, element) {
   {
     // $FlowFixMe This is okay but Flow doesn't know it.
-    var has = Function.call.bind(Object.prototype.hasOwnProperty);
+    var has = Function.call.bind(hasOwnProperty);
 
     for (var typeSpecName in typeSpecs) {
       if (has(typeSpecs, typeSpecName)) {
@@ -1066,6 +976,7 @@ function checkPropTypes(typeSpecs, values, location, componentName, element) {
           // This is intentionally an invariant that gets caught. It's the same
           // behavior as without this statement except with a better message.
           if (typeof typeSpecs[typeSpecName] !== 'function') {
+            // eslint-disable-next-line react-internal/prod-error-codes
             var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
             err.name = 'Invariant Violation';
             throw err;
@@ -1099,8 +1010,80 @@ function checkPropTypes(typeSpecs, values, location, componentName, element) {
   }
 }
 
+var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
+
+function isArray(a) {
+  return isArrayImpl(a);
+}
+
+/*
+ * The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol
+ * and Temporal.* types. See https://github.com/facebook/react/pull/22064.
+ *
+ * The functions in this module will throw an easier-to-understand,
+ * easier-to-debug exception with a clear errors message message explaining the
+ * problem. (Instead of a confusing exception thrown inside the implementation
+ * of the `value` object).
+ */
+// $FlowFixMe only called in DEV, so void return is not possible.
+function typeName(value) {
+  {
+    // toStringTag is needed for namespaced types like Temporal.Instant
+    var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag;
+    var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object';
+    return type;
+  }
+} // $FlowFixMe only called in DEV, so void return is not possible.
+
+
+function willCoercionThrow(value) {
+  {
+    try {
+      testStringCoercion(value);
+      return false;
+    } catch (e) {
+      return true;
+    }
+  }
+}
+
+function testStringCoercion(value) {
+  // If you ended up here by following an exception call stack, here's what's
+  // happened: you supplied an object or symbol value to React (as a prop, key,
+  // DOM attribute, CSS property, string ref, etc.) and when React tried to
+  // coerce it to a string using `'' + value`, an exception was thrown.
+  //
+  // The most common types that will cause this exception are `Symbol` instances
+  // and Temporal objects like `Temporal.Instant`. But any object that has a
+  // `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this
+  // exception. (Library authors do this to prevent users from using built-in
+  // numeric operators like `+` or comparison operators like `>=` because custom
+  // methods are needed to perform accurate arithmetic or comparison.)
+  //
+  // To fix the problem, coerce this object or symbol value to a string before
+  // passing it to React. The most reliable way is usually `String(value)`.
+  //
+  // To find which value is throwing, check the browser or debugger console.
+  // Before this exception was thrown, there should be `console.error` output
+  // that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the
+  // problem and how that type was used: key, atrribute, input value prop, etc.
+  // In most cases, this console output also shows the component and its
+  // ancestor components where the exception happened.
+  //
+  // eslint-disable-next-line react-internal/safe-string-coercion
+  return '' + value;
+}
+function checkKeyStringCoercion(value) {
+  {
+    if (willCoercionThrow(value)) {
+      error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
+
+      return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
+    }
+  }
+}
+
 var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
-var hasOwnProperty = Object.prototype.hasOwnProperty;
 var RESERVED_PROPS = {
   key: true,
   ref: true,
@@ -1146,10 +1129,10 @@ function hasValidKey(config) {
 function warnIfStringRefCannotBeAutoConverted(config, self) {
   {
     if (typeof config.ref === 'string' && ReactCurrentOwner.current && self && ReactCurrentOwner.current.stateNode !== self) {
-      var componentName = getComponentName(ReactCurrentOwner.current.type);
+      var componentName = getComponentNameFromType(ReactCurrentOwner.current.type);
 
       if (!didWarnAboutStringRefs[componentName]) {
-        error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', getComponentName(ReactCurrentOwner.current.type), config.ref);
+        error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', getComponentNameFromType(ReactCurrentOwner.current.type), config.ref);
 
         didWarnAboutStringRefs[componentName] = true;
       }
@@ -1288,10 +1271,18 @@ function jsxDEV(type, config, maybeKey, source, self) {
     // key is explicitly declared to be undefined or not.
 
     if (maybeKey !== undefined) {
+      {
+        checkKeyStringCoercion(maybeKey);
+      }
+
       key = '' + maybeKey;
     }
 
     if (hasValidKey(config)) {
+      {
+        checkKeyStringCoercion(config.key);
+      }
+
       key = '' + config.key;
     }
 
@@ -1362,6 +1353,7 @@ var propTypesMisspellWarningShown;
  * @final
  */
 
+
 function isValidElement(object) {
   {
     return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
@@ -1371,7 +1363,7 @@ function isValidElement(object) {
 function getDeclarationErrorAddendum() {
   {
     if (ReactCurrentOwner$1.current) {
-      var name = getComponentName(ReactCurrentOwner$1.current.type);
+      var name = getComponentNameFromType(ReactCurrentOwner$1.current.type);
 
       if (name) {
         return '\n\nCheck the render method of `' + name + '`.';
@@ -1451,7 +1443,7 @@ function validateExplicitKey(element, parentType) {
 
     if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
       // Give the component that originally created this child.
-      childOwner = " It was passed a child from " + getComponentName(element._owner.type) + ".";
+      childOwner = " It was passed a child from " + getComponentNameFromType(element._owner.type) + ".";
     }
 
     setCurrentlyValidatingElement$1(element);
@@ -1478,7 +1470,7 @@ function validateChildKeys(node, parentType) {
       return;
     }
 
-    if (Array.isArray(node)) {
+    if (isArray(node)) {
       for (var i = 0; i < node.length; i++) {
         var child = node[i];
 
@@ -1541,12 +1533,12 @@ function validatePropTypes(element) {
 
     if (propTypes) {
       // Intentionally inside to avoid triggering lazy initializers:
-      var name = getComponentName(type);
+      var name = getComponentNameFromType(type);
       checkPropTypes(propTypes, element.props, 'prop', name, element);
     } else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
       propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
 
-      var _name = getComponentName(type);
+      var _name = getComponentNameFromType(type);
 
       error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
     }
@@ -1589,6 +1581,7 @@ function validateFragmentProps(fragment) {
   }
 }
 
+var didWarnAboutKeySpread = {};
 function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
   {
     var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
@@ -1613,10 +1606,10 @@ function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
 
       if (type === null) {
         typeString = 'null';
-      } else if (Array.isArray(type)) {
+      } else if (isArray(type)) {
         typeString = 'array';
       } else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
-        typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
+        typeString = "<" + (getComponentNameFromType(type.type) || 'Unknown') + " />";
         info = ' Did you accidentally export a JSX literal instead of a component?';
       } else {
         typeString = typeof type;
@@ -1642,7 +1635,7 @@ function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
 
       if (children !== undefined) {
         if (isStaticChildren) {
-          if (Array.isArray(children)) {
+          if (isArray(children)) {
             for (var i = 0; i < children.length; i++) {
               validateChildKeys(children[i], type);
             }
@@ -1659,7 +1652,25 @@ function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
       }
     }
 
-    if (type === exports.Fragment) {
+    {
+      if (hasOwnProperty.call(props, 'key')) {
+        var componentName = getComponentNameFromType(type);
+        var keys = Object.keys(props).filter(function (k) {
+          return k !== 'key';
+        });
+        var beforeExample = keys.length > 0 ? '{key: someKey, ' + keys.join(': ..., ') + ': ...}' : '{key: someKey}';
+
+        if (!didWarnAboutKeySpread[componentName + beforeExample]) {
+          var afterExample = keys.length > 0 ? '{' + keys.join(': ..., ') + ': ...}' : '{}';
+
+          error('A props object containing a "key" prop is being spread into JSX:\n' + '  let props = %s;\n' + '  <%s {...props} />\n' + 'React keys must be passed directly to JSX without using spread:\n' + '  let props = %s;\n' + '  <%s key={someKey} {...props} />', beforeExample, componentName, afterExample, componentName);
+
+          didWarnAboutKeySpread[componentName + beforeExample] = true;
+        }
+      }
+    }
+
+    if (type === REACT_FRAGMENT_TYPE) {
       validateFragmentProps(element);
     } else {
       validatePropTypes(element);
@@ -1688,6 +1699,7 @@ var jsx =  jsxWithValidationDynamic ; // we may want to special case jsxs intern
 
 var jsxs =  jsxWithValidationStatic ;
 
+exports.Fragment = REACT_FRAGMENT_TYPE;
 exports.jsx = jsx;
 exports.jsxs = jsxs;
   })();
@@ -2031,6 +2043,7 @@ var __read = (this && this.__read) || function (o, n) {
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_modules/react/jsx-runtime.js");
 var fuselage_hooks_1 = __webpack_require__(/*! @rocket.chat/fuselage-hooks */ "@rocket.chat/fuselage-hooks");
+var react_1 = __webpack_require__(/*! react */ "react");
 var composeClassNames_1 = __webpack_require__(/*! ../../helpers/composeClassNames */ "./src/helpers/composeClassNames.ts");
 var Box_1 = __webpack_require__(/*! ../Box */ "./src/components/Box/index.ts");
 var Chevron_1 = __webpack_require__(/*! ../Chevron */ "./src/components/Chevron/index.tsx");
@@ -2039,8 +2052,8 @@ var AccordionItem = function (_a) {
     var _e = __read((0, fuselage_hooks_1.useToggle)(defaultExpanded), 2), stateExpanded = _e[0], toggleStateExpanded = _e[1];
     var expanded = propExpanded || stateExpanded;
     var panelExpanded = noncollapsible || expanded;
-    var titleId = (0, fuselage_hooks_1.useUniqueId)();
-    var panelId = (0, fuselage_hooks_1.useUniqueId)();
+    var titleId = (0, react_1.useId)();
+    var panelId = (0, react_1.useId)();
     var handleClick = function (e) {
         var _a;
         if (disabled) {
@@ -3032,9 +3045,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.StylingBox = exports["default"] = void 0;
+exports.StylingBox = exports.Box = exports["default"] = void 0;
 var Box_1 = __webpack_require__(/*! ./Box */ "./src/components/Box/Box.tsx");
 Object.defineProperty(exports, "default", ({ enumerable: true, get: function () { return __importDefault(Box_1).default; } }));
+Object.defineProperty(exports, "Box", ({ enumerable: true, get: function () { return __importDefault(Box_1).default; } }));
 var StylingBox_1 = __webpack_require__(/*! ./StylingBox */ "./src/components/Box/StylingBox.tsx");
 Object.defineProperty(exports, "StylingBox", ({ enumerable: true, get: function () { return __importDefault(StylingBox_1).default; } }));
 
@@ -7621,7 +7635,8 @@ var Menu = function (_a) {
         var _a;
         if ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.classList.contains('focus-visible')) {
             ref.current.classList.remove('focus-visible');
-            return hide();
+            hide();
+            return;
         }
         if (ref.current) {
             ref.current.focus();
@@ -14962,12 +14977,12 @@ Object.defineProperty(exports, "Item", ({ enumerable: true, get: function () { r
 exports.SelectAria = (0, react_1.forwardRef)(function SelectAria(_a, outerRef) {
     var error = _a.error, placeholder = _a.placeholder, value = _a.value, onChange = _a.onChange, small = _a.small, isDisabledProps = _a.isDisabled, disabled = _a.disabled, id = _a.id, props = __rest(_a, ["error", "placeholder", "value", "onChange", "small", "isDisabled", "disabled", "id"]);
     var isDisabled = isDisabledProps || disabled;
-    var state = (0, react_stately_1.useSelectState)(__assign({ isDisabled: isDisabled, selectedKey: value, onSelectionChange: onChange }, props));
+    var state = (0, react_stately_1.useSelectState)(__assign({ isDisabled: isDisabled, selectedKey: typeof value !== 'bigint' ? value : null, onSelectionChange: onChange }, props));
     var _b = (0, fuselage_hooks_1.useResizeObserver)(), ref = _b.ref, borderBoxSize = _b.borderBoxSize;
     var mergedRef = (0, fuselage_hooks_1.useMergedRefs)(outerRef, ref);
     var _c = (0, react_aria_1.useSelect)(__assign({ isDisabled: isDisabled }, props), state, ref), triggerProps = _c.triggerProps, valueProps = _c.valueProps, menuProps = _c.menuProps;
     var _d = (0, react_aria_1.useFocusRing)(), focusProps = _d.focusProps, isFocusVisible = _d.isFocusVisible;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_aria_1.HiddenSelect, { state: state, triggerRef: ref, label: props.label, name: props.name, isDisabled: isDisabled }), (0, jsx_runtime_1.jsxs)(SelectTrigger_1.SelectTrigger, __assign({}, (0, react_aria_1.mergeProps)(focusProps, triggerProps), { ref: mergedRef, small: small, focus: isFocusVisible || state.isOpen, error: error, id: id, children: [(0, jsx_runtime_1.jsx)(Box_1.default, __assign({ is: 'span', color: state.selectedItem ? 'default' : 'hint' }, valueProps, (small && { fontScale: 'c1' }), { children: state.selectedItem ? state.selectedItem.rendered : placeholder })), (0, jsx_runtime_1.jsx)(Icon_1.Icon, { color: 'default', name: state.isOpen ? 'chevron-up' : 'chevron-down', size: 'x20' })] })), state.isOpen && ((0, jsx_runtime_1.jsx)(Popover_1.Popover, { state: state, triggerRef: ref, placement: 'bottom', offset: 4, containerPadding: 8, children: (0, jsx_runtime_1.jsx)(Options_1.OptionContainer, { style: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(SelectTrigger_1.SelectTrigger, __assign({}, (0, react_aria_1.mergeProps)(focusProps, triggerProps), { ref: mergedRef, small: small, focus: isFocusVisible || state.isOpen, error: error, id: id, children: [(0, jsx_runtime_1.jsx)(react_aria_1.HiddenSelect, { state: state, triggerRef: ref, label: props.label, name: props.name, isDisabled: isDisabled }), (0, jsx_runtime_1.jsx)(Box_1.default, __assign({ is: 'span', color: state.selectedItem ? 'default' : 'hint' }, valueProps, (small && { fontScale: 'c1' }), { children: state.selectedItem ? state.selectedItem.rendered : placeholder })), (0, jsx_runtime_1.jsx)(Icon_1.Icon, { color: 'default', name: state.isOpen ? 'chevron-up' : 'chevron-down', size: 'x20' })] })), state.isOpen && ((0, jsx_runtime_1.jsx)(Popover_1.Popover, { state: state, triggerRef: ref, placement: 'bottom', offset: 4, containerPadding: 8, children: (0, jsx_runtime_1.jsx)(Options_1.OptionContainer, { style: {
                         width: borderBoxSize === null || borderBoxSize === void 0 ? void 0 : borderBoxSize.inlineSize,
                     }, children: (0, jsx_runtime_1.jsx)(Listbox_1.ListBox, __assign({}, menuProps, { state: state })) }) }))] }));
 });
@@ -17546,6 +17561,7 @@ var __read = (this && this.__read) || function (o, n) {
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.useCollapse = void 0;
 var fuselage_hooks_1 = __webpack_require__(/*! @rocket.chat/fuselage-hooks */ "@rocket.chat/fuselage-hooks");
+var react_1 = __webpack_require__(/*! react */ "react");
 var hasPropExpanded = function (expanded) {
     return expanded !== undefined;
 };
@@ -17554,8 +17570,8 @@ var useCollapse = function (_a) {
     var _c = __read((0, fuselage_hooks_1.useToggle)(defaultExpanded), 2), stateExpanded = _c[0], toggleStateExpanded = _c[1];
     var expanded = hasPropExpanded(propExpanded) ? propExpanded : stateExpanded;
     var panelExpanded = noncollapsible || expanded;
-    var titleId = (0, fuselage_hooks_1.useUniqueId)();
-    var panelId = (0, fuselage_hooks_1.useUniqueId)();
+    var titleId = (0, react_1.useId)();
+    var panelId = (0, react_1.useId)();
     var handleClick = function (e) {
         var _a;
         if (disabled) {
@@ -18106,7 +18122,7 @@ function Slider(props) {
     var label = props.label, formatOptions = props.formatOptions, _a = props.showOutput, showOutput = _a === void 0 ? true : _a, multiThumb = props.multiThumb, maxValue = props.maxValue, minValue = props.minValue;
     // Get a defaultValue in the range for multiThumb
     var getMultiThumbDefaultValue = function () {
-        if (multiThumb && !defaultValue) {
+        if (multiThumb && !props.defaultValue) {
             if (minValue && maxValue) {
                 return [minValue, maxValue];
             }
@@ -18280,7 +18296,7 @@ var SliderTrack = function (_a) {
         }
         return undefined;
     };
-    var track = (0, useStyle_1.useStyle)((0, css_in_js_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      &::before {\n        position: absolute;\n        display: block;\n        content: attr(x);\n\n        background: linear-gradient(", ");\n        transform: translateX(-50%);\n        border-radius: 1rem;\n      }\n      ", ";\n      ", ";\n      ", ";\n    "], ["\n      &::before {\n        position: absolute;\n        display: block;\n        content: attr(x);\n\n        background: linear-gradient(", ");\n        transform: translateX(-50%);\n        border-radius: 1rem;\n      }\n      ", ";\n      ", ";\n      ", ";\n    "])), getTrackGradient(), isHorizontal && (0, css_in_js_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        width: 100%;\n        height: 30px;\n        &::before {\n          top: 50%;\n          width: 100%;\n          height: 4px;\n          transform: translateY(-50%);\n        }\n      "], ["\n        width: 100%;\n        height: 30px;\n        &::before {\n          top: 50%;\n          width: 100%;\n          height: 4px;\n          transform: translateY(-50%);\n        }\n      "]))), isVertical && (0, css_in_js_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n        width: 30px;\n        height: 100%;\n        &::before {\n          left: 50%;\n          width: 4px;\n          height: 100%;\n        }\n      "], ["\n        width: 30px;\n        height: 100%;\n        &::before {\n          left: 50%;\n          width: 4px;\n          height: 100%;\n        }\n      "]))), state.isDisabled && (0, css_in_js_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        cursor: not-allowed;\n        opacity: 0.4;\n      "], ["\n        cursor: not-allowed;\n        opacity: 0.4;\n      "])))), state);
+    var track = (0, useStyle_1.useStyle)((0, css_in_js_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      &::before {\n        position: absolute;\n        display: block;\n        content: '';\n\n        background: linear-gradient(", ");\n        transform: translateX(-50%);\n        border-radius: 1rem;\n      }\n      ", ";\n      ", ";\n      ", ";\n    "], ["\n      &::before {\n        position: absolute;\n        display: block;\n        content: '';\n\n        background: linear-gradient(", ");\n        transform: translateX(-50%);\n        border-radius: 1rem;\n      }\n      ", ";\n      ", ";\n      ", ";\n    "])), getTrackGradient(), isHorizontal && (0, css_in_js_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        width: 100%;\n        height: 30px;\n        &::before {\n          top: 50%;\n          width: 100%;\n          height: 4px;\n          transform: translateY(-50%);\n        }\n      "], ["\n        width: 100%;\n        height: 30px;\n        &::before {\n          top: 50%;\n          width: 100%;\n          height: 4px;\n          transform: translateY(-50%);\n        }\n      "]))), isVertical && (0, css_in_js_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n        width: 30px;\n        height: 100%;\n        &::before {\n          left: 50%;\n          width: 4px;\n          height: 100%;\n        }\n      "], ["\n        width: 30px;\n        height: 100%;\n        &::before {\n          left: 50%;\n          width: 4px;\n          height: 100%;\n        }\n      "]))), state.isDisabled && (0, css_in_js_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        cursor: not-allowed;\n        opacity: 0.4;\n      "], ["\n        cursor: not-allowed;\n        opacity: 0.4;\n      "])))), state);
     return ((0, jsx_runtime_1.jsx)("div", __assign({}, trackProps, { ref: trackRef, className: track, children: children })));
 };
 exports.SliderTrack = SliderTrack;
@@ -20068,7 +20084,7 @@ Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.ToastBar = ToastBar;
 var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_modules/react/jsx-runtime.js");
 var css_in_js_1 = __webpack_require__(/*! @rocket.chat/css-in-js */ "@rocket.chat/css-in-js");
-var fuselage_hooks_1 = __webpack_require__(/*! @rocket.chat/fuselage-hooks */ "@rocket.chat/fuselage-hooks");
+var react_1 = __webpack_require__(/*! react */ "react");
 var Box_1 = __importDefault(__webpack_require__(/*! ../Box */ "./src/components/Box/index.ts"));
 var Button_1 = __webpack_require__(/*! ../Button */ "./src/components/Button/index.ts");
 var Icon_1 = __webpack_require__(/*! ../Icon */ "./src/components/Icon/index.ts");
@@ -20084,7 +20100,7 @@ function ToastBar(_a) {
     var progressBar = (0, css_in_js_1.keyframes)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    from {\n      width: 0%;\n    }\n\n    to {\n      width: 100%;\n    }\n  "], ["\n    from {\n      width: 0%;\n    }\n\n    to {\n      width: 100%;\n    }\n  "])));
     var toastBarAnimation = (0, css_in_js_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    animation: ", " 0.5s;\n  "], ["\n    animation: ", " 0.5s;\n  "])), sideOpen);
     var progressBarAnimation = (0, css_in_js_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    &::after {\n      width: 0%;\n      animation: ", " ", "s;\n      animation-fill-mode: forwards;\n      animation-play-state: ", ";\n    }\n  "], ["\n    &::after {\n      width: 0%;\n      animation: ", " ", "s;\n      animation-fill-mode: forwards;\n      animation-play-state: ", ";\n    }\n  "])), progressBar, time, isPaused ? 'paused' : 'running');
-    var uniqueId = (0, fuselage_hooks_1.useUniqueId)();
+    var uniqueId = (0, react_1.useId)();
     var toastId = id || uniqueId;
     return ((0, jsx_runtime_1.jsxs)(Box_1.default, __assign({ className: [
             "rcx-toastbar rcx-toastbar--".concat(variant, " ").concat(className),
@@ -21141,7 +21157,7 @@ var useStyle = function (cssFn, arg) {
         return content ? (0, css_in_js_1.createClassName)(content) : undefined;
     }, [content]);
     (0, react_1.useDebugValue)(className);
-    (0, react_1.useLayoutEffect)(function () {
+    (0, react_1.useInsertionEffect)(function () {
         if (!content || !className) {
             return;
         }