@rocket.chat/fuselage 0.68.0 → 0.69.0

package/dist/fuselage.development.js

@@ -623,9 +623,6 @@ __webpack_require__.r(__webpack_exports__);
 /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
 __webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   AutoComplete: function() { return /* binding */ AutoComplete; }
-/* harmony export */ });
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @rocket.chat/fuselage-hooks */ "@rocket.chat/fuselage-hooks");
@@ -651,7 +648,6 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-const Addon = (props) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__["default"], { "rcx-autocomplete__addon": true, ...props }));
 const getSelected = (value, options) => {
     if (!value) {
         return [];
@@ -720,10 +716,11 @@ function AutoComplete({ value, filter, setFilter, options = [], renderItem, rend
     (0,react__WEBPACK_IMPORTED_MODULE_2__.useEffect)(reset, [filter, reset]);
     return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Box__WEBPACK_IMPORTED_MODULE_4__["default"], { "rcx-autocomplete": true, ref: containerRef, onClick: (0,_rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__.useEffectEvent)(() => ref.current?.focus()), flexGrow: 1, className: (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(() => [error && 'invalid', disabled && 'disabled'], [error, disabled]), children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__["default"], { display: 'flex', flexGrow: 1, alignItems: 'center', flexWrap: 'wrap', margin: 'neg-x4', role: 'group', children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Margins__WEBPACK_IMPORTED_MODULE_8__["default"], { all: 'x4', children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_InputBox__WEBPACK_IMPORTED_MODULE_7__.Input, { ref: ref, onChange: (0,_rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__.useEffectEvent)((e) => setFilter?.(e.currentTarget.value)), onBlur: handleOnBlur, onFocus: show, onKeyDown: handleKeyDown, placeholder: optionsAreVisible === _AnimatedVisibility__WEBPACK_IMPORTED_MODULE_3__["default"].HIDDEN || !value
                                 ? placeholder
-                                : undefined, order: 1, "rcx-input-box--undecorated": true, value: filter, disabled: disabled, ...props }), selected.map((itemSelected) => RenderSelected ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(RenderSelected, { selected: itemSelected, onRemove: handleRemove }, itemSelected.value)) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Chip__WEBPACK_IMPORTED_MODULE_5__["default"], { value: itemSelected.value, children: itemSelected.label, onClick: handleRemove }, itemSelected.value)))] }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Addon, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Icon__WEBPACK_IMPORTED_MODULE_6__.Icon, { name: optionsAreVisible === _AnimatedVisibility__WEBPACK_IMPORTED_MODULE_3__["default"].VISIBLE
+                                : undefined, order: 1, "rcx-input-box--undecorated": true, value: filter, disabled: disabled, ...props }), selected.map((itemSelected) => RenderSelected ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(RenderSelected, { selected: itemSelected, onRemove: handleRemove }, itemSelected.value)) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Chip__WEBPACK_IMPORTED_MODULE_5__["default"], { value: itemSelected.value, children: itemSelected.label, onClick: handleRemove }, itemSelected.value)))] }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__["default"], { "rcx-autocomplete__addon": true, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Icon__WEBPACK_IMPORTED_MODULE_6__.Icon, { name: optionsAreVisible === _AnimatedVisibility__WEBPACK_IMPORTED_MODULE_3__["default"].VISIBLE
                         ? 'cross'
                         : 'magnifier', size: 'x20', color: 'default' }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_PositionAnimated__WEBPACK_IMPORTED_MODULE_10__["default"], { visible: optionsAreVisible, anchor: containerRef, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Options__WEBPACK_IMPORTED_MODULE_9__.Options, { width: borderBoxSize.inlineSize, onSelect: handleSelect, renderItem: renderItem, renderEmpty: renderEmpty, cursor: cursor, value: value, options: memoizedOptions }) })] }));
 }
+/* harmony default export */ __webpack_exports__["default"] = (AutoComplete);
 
 
 /***/ }),
@@ -736,7 +733,7 @@ function AutoComplete({ value, filter, setFilter, options = [], renderItem, rend
 
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   AutoComplete: function() { return /* reexport safe */ _AutoComplete__WEBPACK_IMPORTED_MODULE_0__.AutoComplete; }
+/* harmony export */   AutoComplete: function() { return /* reexport safe */ _AutoComplete__WEBPACK_IMPORTED_MODULE_0__["default"]; }
 /* harmony export */ });
 /* harmony import */ var _AutoComplete__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./AutoComplete */ "./src/components/AutoComplete/AutoComplete.tsx");
 
@@ -4390,7 +4387,7 @@ function MenuPopover({ children, state, offset = 4, maxWidth, ...props }) {
     if (isMobile) {
         return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Popover__WEBPACK_IMPORTED_MODULE_4__.Popover, { state: state, offset: offset, ...props, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dropdown_DropdownMobile__WEBPACK_IMPORTED_MODULE_3__.DropdownMobile, { children: children }) }));
     }
-    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Popover__WEBPACK_IMPORTED_MODULE_4__.Popover, { state: state, offset: offset, ...props, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dropdown_DropdownDesktop__WEBPACK_IMPORTED_MODULE_2__.DropdownDesktop, { maxWidth: maxWidth, children: children }) }));
+    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Popover__WEBPACK_IMPORTED_MODULE_4__.Popover, { state: state, offset: offset, ...props, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dropdown_DropdownDesktop__WEBPACK_IMPORTED_MODULE_2__.DropdownDesktop, { maxHeight: '80vh', overflowY: 'auto', maxWidth: maxWidth, children: children }) }));
 }
 /* harmony default export */ __webpack_exports__["default"] = (MenuPopover);
 
@@ -7217,12 +7214,20 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _NavBarDivider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./NavBarDivider */ "./src/components/NavBar/NavBarDivider.tsx");
+/* harmony import */ var _NavBarGroup__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./NavBarGroup */ "./src/components/NavBar/NavBarGroup.tsx");
+
 
 
 
+const isNavBarGroup = (child) => {
+    if (!(0,react__WEBPACK_IMPORTED_MODULE_1__.isValidElement)(child))
+        return false;
+    const component = child.type;
+    return component.displayName === _NavBarGroup__WEBPACK_IMPORTED_MODULE_3__.NavBarGroup.displayName;
+};
 const NavBarSection = ({ children, ...props }) => {
-    const validChildren = react__WEBPACK_IMPORTED_MODULE_1__.Children.toArray(children).filter(react__WEBPACK_IMPORTED_MODULE_1__.isValidElement);
-    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("span", { className: 'rcx-navbar-section', ...props, children: validChildren.map((child, index) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react__WEBPACK_IMPORTED_MODULE_1__.Fragment, { children: [child, index < validChildren.length - 1 && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_NavBarDivider__WEBPACK_IMPORTED_MODULE_2__.NavBarDivider, {})] }, index))) }));
+    const validChildren = react__WEBPACK_IMPORTED_MODULE_1__.Children.toArray(children).filter(isNavBarGroup);
+    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("span", { className: 'rcx-navbar-section', ...props, children: react__WEBPACK_IMPORTED_MODULE_1__.Children.toArray(children).map((child, index) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react__WEBPACK_IMPORTED_MODULE_1__.Fragment, { children: [child, index < validChildren.length - 1 && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_NavBarDivider__WEBPACK_IMPORTED_MODULE_2__.NavBarDivider, {})] }, index))) }));
 };
 
 
@@ -7724,7 +7729,7 @@ const Options = (0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function Optio
                         (0,_helpers_prevent__WEBPACK_IMPORTED_MODULE_2__.prevent)(e);
                         onSelect([value, label, selected, disabled, type, url]);
                         return false;
-                    }, value: value, selected: selected || (multiple !== true && null), disabled: disabled, focus: cursor === i || null }, value));
+                    }, value: value, selected: selected || (multiple !== true && undefined), disabled: disabled, focus: cursor === i || undefined }, value));
         }
     }), [options, multiple, cursor, onSelect, OptionComponent]);
     return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_3__["default"], { "rcx-options": true, ...props, ref: ref, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Tile__WEBPACK_IMPORTED_MODULE_6__["default"], { padding: 0, paddingBlock: 'x12', paddingInline: 0, elevation: '2', children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Scrollable__WEBPACK_IMPORTED_MODULE_5__["default"], { vertical: true, smooth: true, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Tile__WEBPACK_IMPORTED_MODULE_6__["default"], { ref: liRef, elevation: '0', padding: 'none', maxHeight: maxHeight, onMouseDown: _helpers_prevent__WEBPACK_IMPORTED_MODULE_2__.prevent, onClick: _helpers_prevent__WEBPACK_IMPORTED_MODULE_2__.prevent, is: 'ol', "aria-multiselectable": multiple || true, role: 'listbox', "aria-activedescendant": options?.[cursor]?.[0]
@@ -7989,7 +7994,7 @@ const OptionsPaginated = (0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(({ wi
                 (0,_helpers_prevent__WEBPACK_IMPORTED_MODULE_4__.prevent)(e);
                 onSelect([value, label]);
                 return false;
-            }, key: value, value: value, selected: selected || (multiple !== true && null), focus: cursor === index || null }));
+            }, key: value, value: value, selected: selected || (multiple !== true && undefined), focus: cursor === index || undefined }));
     };
     return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_6__["default"], { "rcx-options": true, ...props, ref: ref, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_Tile__WEBPACK_IMPORTED_MODULE_9__["default"], { padding: 0, paddingBlock: 'x12', paddingInline: 0, elevation: '2', children: !options.length ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(EmptyComponent, {})) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(react_virtuoso__WEBPACK_IMPORTED_MODULE_3__.Virtuoso, { endReached: endReached, style: { height: '144px' }, totalCount: options.length, data: options, 
                 // TODO Add a scroller element
@@ -10727,10 +10732,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _Chevron__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Chevron */ "./src/components/Chevron/index.tsx");
-
+/* harmony import */ var _Chevron__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Chevron */ "./src/components/Chevron/index.tsx");
 
 
 const SidebarGroupTitle = ({ title, titleId, badge, barProps, expanded, ...props }) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: [
@@ -10738,7 +10740,7 @@ const SidebarGroupTitle = ({ title, titleId, badge, barProps, expanded, ...props
         'rcx-sidebar-v2-collapse-group__bar rcx-box--animated',
     ]
         .filter(Boolean)
-        .join(' '), ...barProps, ...props, children: [expanded !== undefined && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Chevron__WEBPACK_IMPORTED_MODULE_2__.Chevron, { size: 'x20', right: !expanded }), title && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("h4", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-collapse-group__title', id: titleId, children: title })), !expanded && badge && badge] }));
+        .join(' '), ...barProps, ...props, children: [expanded !== undefined && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Chevron__WEBPACK_IMPORTED_MODULE_1__.Chevron, { size: 'x20', right: !expanded }), title && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("h4", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-collapse-group__title', id: titleId, children: title })), !expanded && badge && badge] }));
 
 
 /***/ }),