@rocket.chat/fuselage 0.60.0 → 0.60.1

package/dist/fuselage.development.js

@@ -2219,6 +2219,17 @@ exports["default"] = Object.assign(AnimatedVisibility_1.default, {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 
+var __assign = (this && this.__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);
+};
 var __read = (this && this.__read) || function (o, n) {
     var m = typeof Symbol === "function" && o[Symbol.iterator];
     if (!m) return o;
@@ -2284,11 +2295,8 @@ var getDurationForInfinityDurationAudioFile = function (src, callback) {
         audioElement.remove();
     });
 };
-/**
- * A Fuselage’s custom AudioPlayer.
- */
 exports.AudioPlayer = (0, react_1.forwardRef)(function (_a, ref) {
-    var src = _a.src, _b = _a.type, type = _b === void 0 ? 'audio/mpeg' : _b, _c = _a.maxPlaybackSpeed, maxPlaybackSpeed = _c === void 0 ? 2 : _c, _d = _a.minPlaybackSpeed, minPlaybackSpeed = _d === void 0 ? 0.5 : _d, _e = _a.playbackSpeedStep, playbackSpeedStep = _e === void 0 ? 0.25 : _e, _f = _a.download, download = _f === void 0 ? false : _f, _g = _a.playLabel, playLabel = _g === void 0 ? 'Play' : _g, _h = _a.pauseLabel, pauseLabel = _h === void 0 ? 'Pause' : _h, _j = _a.audioPlaybackRangeLabel, audioPlaybackRangeLabel = _j === void 0 ? 'Audio Playback Range' : _j, _k = _a.changePlaybackSpeedLabel, changePlaybackSpeedLabel = _k === void 0 ? 'Change Playback Speed' : _k, _l = _a.downloadAudioFileLabel, downloadAudioFileLabel = _l === void 0 ? 'Download Audio File' : _l;
+    var src = _a.src, _b = _a.type, type = _b === void 0 ? 'audio/mpeg' : _b, _c = _a.maxPlaybackSpeed, maxPlaybackSpeed = _c === void 0 ? 2 : _c, _d = _a.minPlaybackSpeed, minPlaybackSpeed = _d === void 0 ? 0.5 : _d, _e = _a.playbackSpeedStep, playbackSpeedStep = _e === void 0 ? 0.25 : _e, _f = _a.download, download = _f === void 0 ? false : _f, _g = _a.playLabel, playLabel = _g === void 0 ? 'Play' : _g, _h = _a.pauseLabel, pauseLabel = _h === void 0 ? 'Pause' : _h, _j = _a.audioPlaybackRangeLabel, audioPlaybackRangeLabel = _j === void 0 ? 'Audio Playback Range' : _j, _k = _a.changePlaybackSpeedLabel, changePlaybackSpeedLabel = _k === void 0 ? 'Change Playback Speed' : _k, _l = _a.downloadAudioFileLabel, downloadAudioFileLabel = _l === void 0 ? 'Download Audio File' : _l, trackProps = _a.trackProps;
     var audioRef = (0, react_1.useRef)(null);
     var refs = (0, fuselage_hooks_1.useMergedRefs)(ref, audioRef);
     var _m = __read((0, react_1.useState)(false), 2), isPlaying = _m[0], setIsPlaying = _m[1];
@@ -2332,7 +2340,7 @@ exports.AudioPlayer = (0, react_1.forwardRef)(function (_a, ref) {
                         e.preventDefault();
                         forceDownload(src);
                     }
-                } })), (0, jsx_runtime_1.jsx)("audio", { style: { display: 'none' }, onTimeUpdate: function (e) {
+                } })), (0, jsx_runtime_1.jsxs)("audio", { style: { display: 'none' }, onTimeUpdate: function (e) {
                     setCurrentTime(e.target.currentTime);
                 }, onLoadedMetadata: function (e) {
                     var duration = e.target.duration;
@@ -2346,7 +2354,7 @@ exports.AudioPlayer = (0, react_1.forwardRef)(function (_a, ref) {
                     setIsPlaying(true);
                 }, onPause: function () {
                     setIsPlaying(false);
-                }, controls: true, children: (0, jsx_runtime_1.jsx)("source", { src: src, type: type }) })] }));
+                }, controls: true, children: [(0, jsx_runtime_1.jsx)("source", { src: src, type: type }), (0, jsx_runtime_1.jsx)("track", __assign({ kind: 'captions' }, trackProps))] })] }));
 });
 
 
@@ -2579,7 +2587,7 @@ var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_mod
 var AvatarContainer_1 = __webpack_require__(/*! ./AvatarContainer */ "./src/components/Avatar/AvatarContainer.tsx");
 var AvatarStack_1 = __webpack_require__(/*! ./AvatarStack */ "./src/components/Avatar/AvatarStack.tsx");
 var Avatar = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? 'x36' : _b, _c = _a.rounded, rounded = _c === void 0 ? false : _c, _d = _a.objectFit, objectFit = _d === void 0 ? false : _d, url = _a.url, className = _a.className, props = __rest(_a, ["size", "rounded", "objectFit", "url", "className"]);
+    var _b = _a.size, size = _b === void 0 ? 'x36' : _b, _c = _a.rounded, rounded = _c === void 0 ? false : _c, _d = _a.objectFit, objectFit = _d === void 0 ? false : _d, url = _a.url, className = _a.className, alt = _a.alt, props = __rest(_a, ["size", "rounded", "objectFit", "url", "className", "alt"]);
     var innerClass = [
         'rcx-avatar__element',
         objectFit && 'rcx-avatar__element--object-fit',
@@ -2588,7 +2596,7 @@ var Avatar = function (_a) {
     ]
         .filter(Boolean)
         .join(' ');
-    return ((0, jsx_runtime_1.jsx)(AvatarContainer_1.AvatarContainer, { size: size, className: className, children: (0, jsx_runtime_1.jsx)("img", __assign({ src: "".concat(url), className: "".concat(innerClass) }, props)) }));
+    return ((0, jsx_runtime_1.jsx)(AvatarContainer_1.AvatarContainer, { size: size, className: className, children: (0, jsx_runtime_1.jsx)("img", __assign({ src: url, className: innerClass, alt: alt || '' }, props)) }));
 };
 exports.Avatar = Avatar;
 /**
@@ -2857,7 +2865,9 @@ var Banner = function (_a) {
             onClose();
         }
     }, [onClose]);
-    return ((0, jsx_runtime_1.jsxs)("section", __assign({ className: (0, composeClassNames_1.composeClassNames)('rcx-banner')((_b = {}, _b[variant] = true, _b.inline = inline, _b.actionable = actionable, _b), className), ref: ref, role: 'banner', onClick: handleBannerClick }, props, { children: [icon && isIconVisible && ((0, jsx_runtime_1.jsx)("div", { className: (0, composeClassNames_1.composeClassNames)("rcx-banner__icon rcx-banner__icon--".concat(variant))({
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, composeClassNames_1.composeClassNames)('rcx-banner')((_b = {}, _b[variant] = true, _b.inline = inline, _b.actionable = actionable, _b), className), ref: ref, role: onAction ? 'button' : 'banner', tabIndex: onAction ? 0 : -1, onKeyDown: function (e) {
+            return e.code === 'Enter' || (e.code === 'Space' && handleBannerClick());
+        }, onClick: handleBannerClick }, props, { children: [icon && isIconVisible && ((0, jsx_runtime_1.jsx)("div", { className: (0, composeClassNames_1.composeClassNames)("rcx-banner__icon rcx-banner__icon--".concat(variant))({
                     inline: inline,
                 }), children: icon })), (0, jsx_runtime_1.jsxs)("div", { className: (0, composeClassNames_1.composeClassNames)('rcx-banner__content')({ inline: inline }), children: [title && ((0, jsx_runtime_1.jsx)("h6", { className: (0, composeClassNames_1.composeClassNames)('rcx-banner__title')({ inline: inline }), children: title })), children, link && ((0, jsx_runtime_1.jsx)("a", { href: link, target: linkTarget, className: (0, composeClassNames_1.composeClassNames)('rcx-banner__link')((_c = {}, _c[variant] = true, _c)), children: linkText }))] }), closeable && ((0, jsx_runtime_1.jsx)("div", { className: (0, composeClassNames_1.composeClassNames)('rcx-banner__close-button')({ inline: inline }), children: (0, jsx_runtime_1.jsx)(Button_1.IconButton, { small: true, onClick: handleCloseButtonClick, icon: 'cross' }) }))] })));
 };
@@ -4404,13 +4414,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -7513,13 +7533,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -8995,8 +9025,11 @@ Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.MessageGenericPreviewTitle = void 0;
 var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_modules/react/jsx-runtime.js");
 var MessageGenericPreviewTitle = function (_a) {
-    var externalUrl = _a.externalUrl, props = __rest(_a, ["externalUrl"]);
-    return externalUrl ? ((0, jsx_runtime_1.jsx)("span", { children: (0, jsx_runtime_1.jsx)("a", __assign({ className: 'rcx-message-generic-preview__title rcx-message-generic-preview__title-link', href: externalUrl, target: '_blank' }, props)) })) : ((0, jsx_runtime_1.jsx)("span", __assign({ className: 'rcx-message-generic-preview__title' }, props)));
+    var externalUrl = _a.externalUrl, children = _a.children, props = __rest(_a, ["externalUrl", "children"]);
+    if (externalUrl) {
+        return ((0, jsx_runtime_1.jsx)("a", __assign({ className: 'rcx-message-generic-preview__title rcx-message-generic-preview__title-link', href: externalUrl, target: '_blank' }, props, { children: children })));
+    }
+    return (0, jsx_runtime_1.jsx)("span", __assign({ className: 'rcx-message-generic-preview__title' }, props));
 };
 exports.MessageGenericPreviewTitle = MessageGenericPreviewTitle;
 
@@ -9517,13 +9550,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.MessageMetricsReply = exports.MessageMetricsFollowing = exports.MessageMetricsItemLabel = exports.MessageMetricsItemIcon = exports.MessageMetricsItem = exports.MessageMetricsItemAvatarRowContent = exports.MessageMetricsItemAvatarRow = exports.MessageMetrics = void 0;
 var MessageMetrics_1 = __webpack_require__(/*! ./MessageMetrics */ "./src/components/Message/MessageMetrics/MessageMetrics.tsx");
@@ -12368,6 +12411,17 @@ exports["default"] = OptionHeader;
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 
+var __assign = (this && this.__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);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -12375,10 +12429,7 @@ Object.defineProperty(exports, "__esModule", ({ value: true }));
 var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_modules/react/jsx-runtime.js");
 var Icon_1 = __webpack_require__(/*! ../Icon */ "./src/components/Icon/index.ts");
 var OptionColumn_1 = __importDefault(__webpack_require__(/*! ./OptionColumn */ "./src/components/Option/OptionColumn.tsx"));
-var OptionIcon = function (_a) {
-    var name = _a.name;
-    return ((0, jsx_runtime_1.jsx)(OptionColumn_1.default, { children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { size: 'x20', "rcx-option__icon": true, name: name }) }));
-};
+var OptionIcon = function (props) { return ((0, jsx_runtime_1.jsx)(OptionColumn_1.default, { children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, __assign({ size: 'x20', "rcx-option__icon": true }, props)) })); };
 exports["default"] = OptionIcon;
 
 
@@ -12590,13 +12641,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -13309,7 +13370,7 @@ var PaginatedSelect = function (_a) {
     var internalChangedByClick = (0, fuselage_hooks_1.useEffectEvent)(function (_a) {
         var _b = __read(_a, 1), value = _b[0];
         setInternalValue(value);
-        onChange(value);
+        onChange(value); // FIXME
         hide();
     });
     var ref = (0, react_1.useRef)(null);
@@ -15145,7 +15206,7 @@ exports.SelectLegacy = (0, react_1.forwardRef)(function (_a, ref) {
     var internalChangedByKeyboard = (0, fuselage_hooks_1.useEffectEvent)(function (_a) {
         var _b = __read(_a, 1), value = _b[0];
         setInternalValue(value);
-        onChange(value);
+        onChange(value); // FIXME
     });
     var option = options.find(function (option) { return getValue(option) === internalValue; });
     var index = options.indexOf(option);
@@ -15170,7 +15231,7 @@ exports.SelectLegacy = (0, react_1.forwardRef)(function (_a, ref) {
     var internalChangedByClick = (0, fuselage_hooks_1.useEffectEvent)(function (_a) {
         var _b = __read(_a, 1), value = _b[0];
         setInternalValue(value);
-        onChange(value);
+        onChange(value); // FIXME
         removeFocusClass();
         hide();
     });
@@ -15544,12 +15605,12 @@ var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_mod
 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, addon = _a.addon, onClose = _a.onClose, children = _a.children;
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "rcx-box rcx-box--full rcx-sidebar-banner rcx-sidebar-banner--".concat(variant), children: [(0, jsx_runtime_1.jsxs)("div", { children: [text && (0, jsx_runtime_1.jsx)("div", { className: 'rcx-sidebar-banner--text', children: text }), description && ((0, jsx_runtime_1.jsx)("div", { className: [
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "rcx-box rcx-box--full rcx-sidebar-banner rcx-sidebar-banner--".concat(variant), children: [(0, jsx_runtime_1.jsxs)("div", { children: [text && (0, jsx_runtime_1.jsx)("div", { className: 'rcx-sidebar-banner--text', children: text }), description && ((0, jsx_runtime_1.jsx)("div", { role: onClick ? 'link' : undefined, tabIndex: 0, className: [
                             'rcx-sidebar-banner--description',
                             onClick && 'rcx-sidebar-banner--description--clickable',
                         ]
                             .filter(Boolean)
-                            .join(' '), onClick: onClick, children: description })), children] }), (0, jsx_runtime_1.jsxs)("div", { className: 'rcx-sidebar-banner__actions', children: [addon, onClose && (0, jsx_runtime_1.jsx)(Button_1.IconButton, { onClick: onClose, tiny: true, icon: 'cross' })] })] }));
+                            .join(' '), onClick: onClick, onKeyDown: function (e) { return e.key === 'Enter' && (onClick === null || onClick === void 0 ? void 0 : onClick()); }, children: description })), children] }), (0, jsx_runtime_1.jsxs)("div", { className: 'rcx-sidebar-banner__actions', children: [addon, onClose && (0, jsx_runtime_1.jsx)(Button_1.IconButton, { onClick: onClose, tiny: true, icon: 'cross' })] })] }));
 };
 exports.SidebarBanner = SidebarBanner;
 
@@ -16300,7 +16361,7 @@ var jsx_runtime_1 = __webpack_require__(/*! react/jsx-runtime */ "../../node_mod
 var Button_1 = __webpack_require__(/*! ../Button */ "./src/components/Button/index.ts");
 var SidebarBanner = function (_a) {
     var title = _a.title, linkText = _a.linkText, linkProps = _a.linkProps, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, addon = _a.addon, onClose = _a.onClose, children = _a.children, props = __rest(_a, ["title", "linkText", "linkProps", "variant", "addon", "onClose", "children"]);
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "rcx-box rcx-box--full rcx-sidebar-v2-banner rcx-sidebar-v2-banner--".concat(variant) }, props, { children: [(0, jsx_runtime_1.jsxs)("div", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__content', children: [title && ((0, jsx_runtime_1.jsx)("h5", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__title', children: title })), linkText && ((0, jsx_runtime_1.jsx)("a", __assign({ className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__link', tabIndex: 0 }, linkProps, { children: linkText }))), children] }), (0, jsx_runtime_1.jsxs)("div", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__addon', children: [addon, onClose && (0, jsx_runtime_1.jsx)(Button_1.IconButton, { onClick: onClose, tiny: true, icon: 'cross' })] })] })));
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "rcx-box rcx-box--full rcx-sidebar-v2-banner rcx-sidebar-v2-banner--".concat(variant) }, props, { children: [(0, jsx_runtime_1.jsxs)("div", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__content', children: [title && ((0, jsx_runtime_1.jsx)("h5", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__title', children: title })), linkText && ((0, jsx_runtime_1.jsx)("a", __assign({ className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__link' }, linkProps, { children: linkText }))), children] }), (0, jsx_runtime_1.jsxs)("div", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-banner__addon', children: [addon, onClose && (0, jsx_runtime_1.jsx)(Button_1.IconButton, { onClick: onClose, tiny: true, icon: 'cross' })] })] })));
 };
 exports.SidebarBanner = SidebarBanner;
 
@@ -17220,14 +17281,14 @@ var patchChildren_1 = __webpack_require__(/*! ../../helpers/patchChildren */ "./
 var Icon_1 = __webpack_require__(/*! ../Icon */ "./src/components/Icon/index.ts");
 var SidebarLink = function (_a) {
     var selected = _a.selected, icon = _a.icon, badge = _a.badge, menu = _a.menu, props = __rest(_a, ["selected", "icon", "badge", "menu"]);
-    return ((0, jsx_runtime_1.jsxs)("a", __assign({ className: [
+    return ((0, jsx_runtime_1.jsxs)("a", __assign({ role: 'link', tabIndex: 0, className: [
             'rcx-box rcx-box--full',
             'rcx-sidebar-v2-link',
             'rcx-sidebar-v2-item',
             selected && 'rcx-sidebar-v2-item--selected',
         ]
             .filter(Boolean)
-            .join(' '), onClick: function (e) { return e.stopPropagation(); } }, props, { children: [icon && ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: icon, size: 'x20', className: 'rcx-sidebar-v2-item__icon' })), (0, jsx_runtime_1.jsx)("span", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-item__title', children: props.children }), badge, menu &&
+            .join(' '), onClick: function (e) { return e.stopPropagation(); }, onKeyDown: function (e) { return e.code === 'Enter' && e.stopPropagation(); } }, props, { children: [icon && ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: icon, size: 'x20', className: 'rcx-sidebar-v2-item__icon' })), (0, jsx_runtime_1.jsx)("span", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-item__title', children: props.children }), badge, menu &&
                 (0, patchChildren_1.patchChildren)((0, jsx_runtime_1.jsx)("span", { className: 'rcx-box rcx-box--full rcx-sidebar-v2-item__menu-wrapper', children: menu }), function (childProps) { return ({
                     className: (0, appendClassName_1.appendClassName)(childProps.className, 'rcx-box rcx-box--full rcx-sidebar-v2-item__menu rcx-box--animated'),
                 }); })] })));