@rocket.chat/fuselage 0.32.2 → 0.34.0

package/dist/fuselage.development.js

@@ -2669,17 +2669,21 @@ var react_1 = __importDefault(__webpack_require__(/*! react */ "react"));
 var Box_1 = __importDefault(__webpack_require__(/*! ../Box */ "./src/components/Box/index.tsx"));
 var Icon_1 = __webpack_require__(/*! ../Icon */ "./src/components/Icon/index.ts");
 var Callout = function (_a) {
-    var type = _a.type, title = _a.title, children = _a.children, icon = _a.icon, props = __rest(_a, ["type", "title", "children", "icon"]);
+    var type = _a.type, title = _a.title, children = _a.children, icon = _a.icon, className = _a.className, props = __rest(_a, ["type", "title", "children", "icon", "className"]);
     var defaultIcon = (type === 'info' && 'info-circled') ||
         (type === 'success' && 'checkmark-circled') ||
         (type === 'warning' && 'warning') ||
         (type === 'danger' && 'ban') ||
         'info-circled';
-    return (react_1.default.createElement(Box_1.default, __assign({ is: 'section', "rcx-callout": true, "rcx-callout--type": type }, props),
-        react_1.default.createElement(Icon_1.Icon, { name: icon || defaultIcon, size: 'x20' }),
+    return (react_1.default.createElement(Box_1.default, __assign({ is: 'section', className: [
+            "rcx-callout ".concat(type && "rcx-callout--".concat(type), " ").concat(className || ''),
+        ]
+            .filter(Boolean)
+            .join(' ') }, props),
+        react_1.default.createElement(Icon_1.Icon, { className: 'rcx-callout__icon', name: icon || defaultIcon, size: 'x20' }),
         react_1.default.createElement(Box_1.default, { "rcx-callout__wrapper": true },
-            title && (react_1.default.createElement(Box_1.default, { is: 'h1', "rcx-callout__title": true }, title)),
-            children && react_1.default.createElement(Box_1.default, { "rcx-callout__children": true }, children))));
+            title && react_1.default.createElement(Box_1.default, { "rcx-callout__title": true }, title),
+            children && react_1.default.createElement(Box_1.default, { "rcx-callout__content": true }, children))));
 };
 exports.Callout = Callout;
 
@@ -3189,7 +3193,7 @@ var react_1 = __importStar(__webpack_require__(/*! react */ "react"));
 var __1 = __webpack_require__(/*! .. */ "./src/components/index.ts");
 var ContextualbarAction = function (_a) {
     var name = _a.name, props = __rest(_a, ["name"]);
-    return (react_1.default.createElement(__1.IconButton, __assign({ flexShrink: 0, icon: name }, props, { tiny: true })));
+    return (react_1.default.createElement(__1.IconButton, __assign({}, props, { small: true, flexShrink: 0, icon: name })));
 };
 exports["default"] = (0, react_1.memo)(ContextualbarAction);
 
@@ -11447,7 +11451,7 @@ var PaginatedSelect = function (_a) {
                             ? 'chevron-up'
                             : 'chevron-down', size: 'x20' })))),
         react_1.default.createElement(PositionAnimated_1.default, { visible: visible, anchor: containerRef },
-            react_1.default.createElement(_Options, __assign({}, (withTitle && { title: withTitle }), { width: borderBoxSize.inlineSize, role: 'listbox', filter: filter, options: options, onSelect: internalChangedByClick, endReached: endReached, onMouseDown: prevent_1.prevent })))));
+            react_1.default.createElement(_Options, { withTitle: withTitle, width: borderBoxSize.inlineSize, role: 'listbox', filter: filter, options: options, onSelect: internalChangedByClick, endReached: endReached, onMouseDown: prevent_1.prevent }))));
 };
 exports.PaginatedSelect = PaginatedSelect;
 
@@ -13556,7 +13560,7 @@ exports.SidebarBanner = void 0;
 var react_1 = __importDefault(__webpack_require__(/*! react */ "react"));
 var Button_1 = __webpack_require__(/*! ../Button */ "./src/components/Button/index.ts");
 var SidebarBanner = function (_a) {
-    var text = _a.text, description = _a.description, onClick = _a.onClick, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, onClose = _a.onClose, children = _a.children;
+    var text = _a.text, description = _a.description, onClick = _a.onClick, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, addon = _a.addon, onClose = _a.onClose, children = _a.children;
     return (react_1.default.createElement("div", { className: "rcx-box rcx-box--full rcx-sidebar-banner rcx-sidebar-banner--".concat(variant) },
         react_1.default.createElement("div", null,
             text && react_1.default.createElement("div", { className: 'rcx-sidebar-banner--text' }, text),
@@ -13567,7 +13571,9 @@ var SidebarBanner = function (_a) {
                     .filter(Boolean)
                     .join(' '), onClick: onClick }, description)),
             children),
-        onClose && react_1.default.createElement(Button_1.IconButton, { onClick: onClose, tiny: true, icon: 'cross' })));
+        react_1.default.createElement("div", { className: 'rcx-sidebar-banner__actions' },
+            addon,
+            onClose && react_1.default.createElement(Button_1.IconButton, { onClick: onClose, tiny: true, icon: 'cross' }))));
 };
 exports.SidebarBanner = SidebarBanner;
 
@@ -15649,19 +15655,21 @@ Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.Tag = void 0;
 var react_1 = __importDefault(__webpack_require__(/*! react */ "react"));
 var prependClassName_1 = __webpack_require__(/*! ../../helpers/prependClassName */ "./src/helpers/prependClassName.ts");
+var Box_1 = __importDefault(__webpack_require__(/*! ../Box/Box */ "./src/components/Box/Box.tsx"));
 var Tag = function (_a) {
-    var large = _a.large, medium = _a.medium, className = _a.className, disabled = _a.disabled, onClick = _a.onClick, variant = _a.variant, children = _a.children, icon = _a.icon, props = __rest(_a, ["large", "medium", "className", "disabled", "onClick", "variant", "children", "icon"]);
+    var large = _a.large, medium = _a.medium, className = _a.className, disabled = _a.disabled, onClick = _a.onClick, variant = _a.variant, children = _a.children, icon = _a.icon, href = _a.href, props = __rest(_a, ["large", "medium", "className", "disabled", "onClick", "variant", "children", "icon", "href"]);
     var modifiers = [
         variant,
         medium && 'medium',
         large && 'large',
         disabled && 'disabled',
         onClick && 'clickable',
+        href && 'clickable',
     ]
         .filter(Boolean)
         .map(function (modifier) { return "rcx-tag--".concat(modifier); })
         .join(' ');
-    return (react_1.default.createElement("span", __assign({ className: (0, prependClassName_1.prependClassName)(className, "rcx-tag ".concat(modifiers)), onClick: onClick }, props),
+    return (react_1.default.createElement(Box_1.default, __assign({ is: href ? 'a' : 'span', className: (0, prependClassName_1.prependClassName)(className, "rcx-tag ".concat(modifiers)), onClick: onClick, href: href }, props),
         icon,
         react_1.default.createElement("span", { className: 'rcx-tag__inner' }, children)));
 };