rsuite 6.0.0-canary-20241227 → 6.0.0-canary-20250103

package/cjs/toaster/toaster.js

@@ -1,33 +1,32 @@
 'use client';
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.default = void 0;
-var _ToastContainer = _interopRequireDefault(require("./ToastContainer"));
-const defaultContainerId = 'default';
+var _ToastContainer = _interopRequireWildcard(require("./ToastContainer"));
+var _symbols = require("../internals/symbols");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const containers = new Map();
 
 /**
- * Create a container by Id.
- * @param containerId
- * @param options
+ * Create a container instance.
+ * @param placement
+ * @param props
  */
-async function createContainer(containerId, props) {
-  const [container] = await _ToastContainer.default.getInstance(props);
-  containers.set(containerId || defaultContainerId, container);
+async function createContainer(placement, props) {
+  const [container, containerId] = await _ToastContainer.default.getInstance(props);
+  containers.set(`${containerId}_${placement}`, container);
   return container;
 }
 
 /**
  * Get the container by ID. Use default ID when ID is not available.
  * @param containerId
+ * @param placement
  */
-function getContainer(containerId) {
-  if (containers.size == 0) {
-    return null;
-  }
-  return containers.get(containerId || defaultContainerId);
+function getContainer(containerId, placement) {
+  return containers.get(`${containerId}_${placement}`);
 }
 const toaster = message => toaster.push(message);
 toaster.push = function (message, options) {
@@ -35,14 +34,25 @@ toaster.push = function (message, options) {
     options = {};
   }
   const {
-    placement: containerId,
+    placement = 'topCenter',
+    container = _ToastContainer.defaultToasterContainer,
     ...restOptions
   } = options;
-  const container = getContainer(containerId);
-  if (container !== null && container !== void 0 && container.current) {
-    return container.current.push(message, restOptions);
+  const containerElement = typeof container === 'function' ? container() : container;
+  const containerElementId = containerElement ? containerElement[_symbols.RSUITE_TOASTER_ID] : null;
+  if (containerElementId) {
+    const existedContainer = getContainer(containerElementId, placement);
+    if (existedContainer) {
+      var _existedContainer$cur;
+      return (_existedContainer$cur = existedContainer.current) === null || _existedContainer$cur === void 0 ? void 0 : _existedContainer$cur.push(message, restOptions);
+    }
   }
-  return createContainer(containerId !== null && containerId !== void 0 ? containerId : '', options).then(ref => {
+  const newOptions = {
+    ...options,
+    container: containerElement,
+    placement
+  };
+  return createContainer(placement, newOptions).then(ref => {
     var _ref$current;
     return (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.push(message, restOptions);
   });

package/cjs/useMediaQuery/useMediaQuery.js

@@ -38,9 +38,7 @@ const matchMedia = query => {
  */
 function useMediaQuery(query) {
   const queries = Array.isArray(query) ? query : [query];
-  const mediaQueries = (0, _react.useMemo)(() => queries.map(query => mediaQuerySizeMap[query] || query),
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [...queries]);
+  const mediaQueries = (0, _react.useMemo)(() => queries.map(query => mediaQuerySizeMap[query] || query), [...queries]);
   const mediaQueryArray = (0, _react.useRef)(mediaQueries.map(query => matchMedia(query).matches));
   const subscribe = (0, _react.useCallback)(callback => {
     const list = mediaQueries.map(query => matchMedia(query));

package/cjs/useToaster/useToaster.js

@@ -19,7 +19,8 @@ var _CustomProvider = require("../CustomProvider/CustomProvider");
  */
 const useToaster = () => {
   const {
-    toasters
+    toasters,
+    toastContainer
   } = (0, _react.useContext)(_CustomProvider.CustomContext);
   return (0, _react.useMemo)(() => ({
     /**
@@ -31,9 +32,13 @@ const useToaster = () => {
      * @returns The key of the toast message.
      */
     push: (message, options) => {
-      var _toasters$current;
-      const customToaster = toasters === null || toasters === void 0 || (_toasters$current = toasters.current) === null || _toasters$current === void 0 ? void 0 : _toasters$current.get((options === null || options === void 0 ? void 0 : options.placement) || 'topCenter');
-      return customToaster ? customToaster.push(message, options) : _toaster.default.push(message, options);
+      const container = (typeof (options === null || options === void 0 ? void 0 : options.container) === 'function' ? options === null || options === void 0 ? void 0 : options.container() : options === null || options === void 0 ? void 0 : options.container) || toastContainer;
+      if (container === toastContainer) {
+        var _toasters$current;
+        return toasters === null || toasters === void 0 || (_toasters$current = toasters.current) === null || _toasters$current === void 0 || (_toasters$current = _toasters$current.get((options === null || options === void 0 ? void 0 : options.placement) || 'topCenter')) === null || _toasters$current === void 0 ? void 0 : _toasters$current.push(message, options);
+      } else {
+        return _toaster.default.push(message, options);
+      }
     },
     /**
      * Remove a toast message.
@@ -54,6 +59,6 @@ const useToaster = () => {
         return c === null || c === void 0 ? void 0 : c.clear();
       }) : _toaster.default.clear();
     }
-  }), [toasters]);
+  }), [toastContainer, toasters]);
 };
 var _default = exports.default = useToaster;

package/dist/rsuite-no-reset-rtl.css

@@ -340,6 +340,7 @@
   --rs-avatar-ring-color: var(--rs-avatar-bg);
   --rs-badge-bg: var(--rs-color-red);
   --rs-badge-text: var(--rs-gray-0);
+  --rs-badge-border: var(--rs-gray-0);
   --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-50);
   --rs-card-bg: var(--rs-gray-0);
@@ -726,6 +727,7 @@
   --rs-avatar-ring-color: var(--rs-avatar-bg);
   --rs-badge-bg: var(--rs-color-red);
   --rs-badge-text: var(--rs-gray-0);
+  --rs-badge-border: var(--rs-gray-900);
   --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-600);
   --rs-card-bg: var(--rs-gray-900);
@@ -1111,6 +1113,7 @@
   --rs-avatar-ring-color: var(--rs-avatar-bg);
   --rs-badge-bg: var(--rs-red-500);
   --rs-badge-text: var(--rs-gray-0);
+  --rs-badge-border: var(--rs-gray-900);
   --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-600);
   --rs-card-bg: var(--rs-gray-900);
@@ -1569,58 +1572,118 @@ tbody.rs-anim-collapse.rs-anim-in {
   position: relative;
 }
 .rs-badge {
-  display: inline-block;
+  --rs-badge-offset-x: 5%;
+  --rs-badge-offset-y: 5%;
+  --rs-badge-translate: 40%;
+  display: inline-flex;
+}
+.rs-badge-circle {
+  --rs-badge-translate: 30%;
 }
 .rs-badge-independent,
 .rs-badge-content {
+  opacity: 1;
+  display: flex;
+  align-items: center;
   background-color: var(--rs-badge-bg);
   color: var(--rs-badge-text);
-  border-radius: 8px;
+  border-radius: 999px;
   font-size: 12px;
   line-height: 16px;
   padding: 0 5px;
+  transition: opacity 0.3s ease-in-out;
 }
-.rs-badge-independent.rs-badge-dot,
-.rs-badge-wrapper .rs-badge-content:empty {
-  width: 8px;
-  height: 8px;
-  border-radius: 4px;
+.rs-badge-hidden .rs-badge-content,
+.rs-badge-hidden.rs-badge-independent {
+  opacity: 0;
+}
+.rs-badge-compact .rs-badge-content,
+.rs-badge-compact.rs-badge-independent {
+  padding: 0;
+}
+.rs-badge:empty,
+.rs-badge-content:empty {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
   padding: 0;
 }
 .rs-badge-wrapper .rs-badge-content {
   position: absolute;
-  top: 0;
-  left: 0;
-  transform: translate(-50%, -50%);
   z-index: 1;
 }
+.rs-badge-outline .rs-badge-content {
+  box-sizing: content-box;
+  border: 2px solid var(--rs-badge-border);
+}
+.rs-badge-top-start .rs-badge-content {
+  transform: translate(calc(-1*(0px - var(--rs-badge-translate))), calc(0px - var(--rs-badge-translate)));
+  top: var(--rs-badge-offset-y);
+  right: var(--rs-badge-offset-x);
+}
+.rs-badge-top-end .rs-badge-content {
+  transform: translate(var(--rs-badge-translate), calc(-1*(0px - var(--rs-badge-translate))));
+  top: var(--rs-badge-offset-y);
+  left: var(--rs-badge-offset-x);
+}
+.rs-badge-bottom-start .rs-badge-content {
+  transform: translate(calc(-1*(0px - var(--rs-badge-translate))), var(--rs-badge-translate));
+  bottom: var(--rs-badge-offset-y);
+  right: var(--rs-badge-offset-x);
+}
+.rs-badge-bottom-end .rs-badge-content {
+  transform: translate(var(--rs-badge-translate), var(--rs-badge-translate));
+  bottom: var(--rs-badge-offset-y);
+  left: var(--rs-badge-offset-x);
+}
+.rs-badge-red {
+  --rs-badge-bg: var(--rs-red-500);
+}
 .rs-badge-red.rs-badge-independent,
 .rs-badge-red .rs-badge-content {
-  background-color: var(--rs-red-500);
+  background-color: var(--rs-badge-bg);
+}
+.rs-badge-orange {
+  --rs-badge-bg: var(--rs-orange-500);
 }
 .rs-badge-orange.rs-badge-independent,
 .rs-badge-orange .rs-badge-content {
-  background-color: var(--rs-orange-500);
+  background-color: var(--rs-badge-bg);
+}
+.rs-badge-yellow {
+  --rs-badge-bg: var(--rs-yellow-500);
 }
 .rs-badge-yellow.rs-badge-independent,
 .rs-badge-yellow .rs-badge-content {
-  background-color: var(--rs-yellow-500);
+  background-color: var(--rs-badge-bg);
+}
+.rs-badge-green {
+  --rs-badge-bg: var(--rs-green-500);
 }
 .rs-badge-green.rs-badge-independent,
 .rs-badge-green .rs-badge-content {
-  background-color: var(--rs-green-500);
+  background-color: var(--rs-badge-bg);
+}
+.rs-badge-cyan {
+  --rs-badge-bg: var(--rs-cyan-500);
 }
 .rs-badge-cyan.rs-badge-independent,
 .rs-badge-cyan .rs-badge-content {
-  background-color: var(--rs-cyan-500);
+  background-color: var(--rs-badge-bg);
+}
+.rs-badge-blue {
+  --rs-badge-bg: var(--rs-blue-500);
 }
 .rs-badge-blue.rs-badge-independent,
 .rs-badge-blue .rs-badge-content {
-  background-color: var(--rs-blue-500);
+  background-color: var(--rs-badge-bg);
+}
+.rs-badge-violet {
+  --rs-badge-bg: var(--rs-violet-500);
 }
 .rs-badge-violet.rs-badge-independent,
 .rs-badge-violet .rs-badge-content {
-  background-color: var(--rs-violet-500);
+  background-color: var(--rs-badge-bg);
 }
 .rs-breadcrumb {
   margin-bottom: 20px;
@@ -1714,8 +1777,7 @@ tbody.rs-anim-collapse.rs-anim-in {
 .rs-theme-high-contrast .rs-btn:focus-visible {
   outline-offset: 2px;
 }
-.rs-btn:hover,
-.rs-btn:focus {
+.rs-btn:hover {
   color: var(--rs-btn-default-hover-text);
   background-color: var(--rs-btn-default-hover-bg);
   text-decoration: none;
@@ -1755,8 +1817,7 @@ tbody.rs-anim-collapse.rs-anim-in {
   background-color: var(--rs-btn-primary-bg);
   border: none;
 }
-.rs-btn-primary:hover,
-.rs-btn-primary:focus {
+.rs-btn-primary:hover {
   color: var(--rs-btn-primary-text);
   background-color: var(--rs-btn-primary-hover-bg);
 }
@@ -1780,8 +1841,7 @@ tbody.rs-anim-collapse.rs-anim-in {
   background-color: transparent;
   border: none;
 }
-.rs-btn-subtle:hover,
-.rs-btn-subtle:focus {
+.rs-btn-subtle:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }
@@ -1804,8 +1864,7 @@ tbody.rs-anim-collapse.rs-anim-in {
   background-color: transparent;
   border: none;
 }
-.rs-btn-link:hover,
-.rs-btn-link:focus {
+.rs-btn-link:hover {
   color: var(--rs-btn-link-hover-text);
   background-color: transparent;
   text-decoration: underline;
@@ -1831,8 +1890,7 @@ tbody.rs-anim-collapse.rs-anim-in {
   background-color: transparent;
   border: 1px solid var(--rs-btn-ghost-border);
 }
-.rs-btn-ghost:hover,
-.rs-btn-ghost:focus {
+.rs-btn-ghost:hover {
   color: var(--rs-btn-ghost-hover-text);
   background-color: transparent;
   border-color: var(--rs-btn-ghost-hover-border);
@@ -2794,8 +2852,7 @@ tbody.rs-anim-collapse.rs-anim-in {
   --rs-btn-subtle-active-bg: var(--rs-red-600);
   --rs-btn-subtle-active-text: #fff;
 }
-.rs-calendar-header-error:hover,
-.rs-calendar-header-error:focus {
+.rs-calendar-header-error:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }
@@ -7310,8 +7367,7 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
   background-color: var(--rs-iconbtn-addon);
   transition: color 0.15s ease-out, background-color 0.15s ease-out;
 }
-.rs-btn-icon-with-text:hover > .rs-icon,
-.rs-btn-icon-with-text:focus > .rs-icon {
+.rs-btn-icon-with-text:hover > .rs-icon {
   background-color: var(--rs-iconbtn-activated-addon);
 }
 .rs-btn-icon-with-text:active > .rs-icon,
@@ -7329,8 +7385,7 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
 .rs-btn-icon-with-text.rs-btn-primary > .rs-icon {
   background-color: var(--rs-iconbtn-primary-addon);
 }
-.rs-btn-icon-with-text.rs-btn-primary:hover > .rs-icon,
-.rs-btn-icon-with-text.rs-btn-primary:focus > .rs-icon {
+.rs-btn-icon-with-text.rs-btn-primary:hover > .rs-icon {
   background-color: var(--rs-iconbtn-primary-activated-addon);
 }
 .rs-btn-icon-with-text.rs-btn-primary:active > .rs-icon,
@@ -7567,8 +7622,7 @@ textarea.rs-input-sm {
   padding: 7px 11px;
   border-radius: 6px 0 0 6px;
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn:hover,
-.rs-input-group.rs-input-group-inside .rs-input-group-btn:focus {
+.rs-input-group.rs-input-group-inside .rs-input-group-btn:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }
@@ -9811,8 +9865,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 .rs-theme-high-contrast .rs-pagination-btn:focus-visible {
   outline-offset: 2px;
 }
-.rs-pagination-btn:hover,
-.rs-pagination-btn:focus {
+.rs-pagination-btn:hover {
   color: var(--rs-btn-default-hover-text);
   background-color: var(--rs-btn-default-hover-bg);
   text-decoration: none;
@@ -9839,8 +9892,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
     /* stylelint-enable */
   }
 }
-.rs-pagination-btn:hover,
-.rs-pagination-btn:focus {
+.rs-pagination-btn:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }
@@ -9909,8 +9961,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   background-color: transparent;
   border: 1px solid var(--rs-btn-ghost-border);
 }
-.rs-pagination-btn.rs-pagination-btn-active:hover,
-.rs-pagination-btn.rs-pagination-btn-active:focus {
+.rs-pagination-btn.rs-pagination-btn-active:hover {
   color: var(--rs-btn-ghost-hover-text);
   background-color: transparent;
   border-color: var(--rs-btn-ghost-hover-border);
@@ -12441,7 +12492,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 .rs-table-scrollbar-horizontal .rs-table-scrollbar-handle {
   height: 8px;
   left: 0 ;
-  top: 1px;
+  top: 2px/2;
 }
 .rs-table-scrollbar-pressed.rs-table-scrollbar-horizontal:hover,
 .rs-table-scrollbar-horizontal:hover {
@@ -12459,7 +12510,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   min-height: 20px;
   width: 8px;
   top: 0;
-  right: 1px;
+  right: 2px/2;
 }
 .rs-table-scrollbar-pressed.rs-table-scrollbar-vertical:hover,
 .rs-table-scrollbar-vertical:hover {
@@ -12469,7 +12520,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 .rs-tag {
   display: inline-block;
   background-color: var(--rs-tag-bg);
-  color: var(--rs-text-primary);
+  color: var(--rs-tag-text);
   border-radius: 6px;
   line-height: 20px;
 }
@@ -12515,32 +12566,46 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   margin-right: 10px;
 }
 .rs-tag-red {
-  background-color: var(--rs-red-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-red-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-orange {
-  background-color: var(--rs-orange-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-orange-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-yellow {
-  background-color: var(--rs-yellow-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-yellow-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-green {
-  background-color: var(--rs-green-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-green-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-cyan {
-  background-color: var(--rs-cyan-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-cyan-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-blue {
-  background-color: var(--rs-blue-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-blue-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-violet {
-  background-color: var(--rs-violet-500);
-  color: #ffffff;
+  --rs-tag-bg: var(--rs-violet-500);
+  --rs-tag-text: #fff;
+  background-color: var(--rs-tag-bg);
+  color: var(--rs-tag-text);
 }
 .rs-tag-group {
   margin: -10px -10px 0 0;
@@ -13762,8 +13827,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 .rs-theme-high-contrast .rs-uploader-picture .rs-uploader-trigger-btn:focus-visible {
   outline-offset: 2px;
 }
-.rs-uploader-picture .rs-uploader-trigger-btn:hover,
-.rs-uploader-picture .rs-uploader-trigger-btn:focus {
+.rs-uploader-picture .rs-uploader-trigger-btn:hover {
   color: var(--rs-btn-default-hover-text);
   background-color: var(--rs-btn-default-hover-bg);
   text-decoration: none;
@@ -13790,8 +13854,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
     /* stylelint-enable */
   }
 }
-.rs-uploader-picture .rs-uploader-trigger-btn:hover,
-.rs-uploader-picture .rs-uploader-trigger-btn:focus {
+.rs-uploader-picture .rs-uploader-trigger-btn:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }
@@ -14173,7 +14236,8 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   flex-direction: column-reverse;
   bottom: 3px;
 }
-.rs-rate-character .rs-icon {
+.rs-rate-character .rs-icon,
+.rs-rate-character svg {
   position: absolute;
   height: 1em;
   width: 1em;
@@ -14224,25 +14288,32 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   height: 24px;
 }
 .rs-rate-red {
-  color: var(--rs-red-500);
+  --rs-rate-symbol-checked: var(--rs-red-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-rate-orange {
-  color: var(--rs-orange-500);
+  --rs-rate-symbol-checked: var(--rs-orange-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-rate-yellow {
-  color: var(--rs-yellow-500);
+  --rs-rate-symbol-checked: var(--rs-yellow-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-rate-green {
-  color: var(--rs-green-500);
+  --rs-rate-symbol-checked: var(--rs-green-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-rate-cyan {
-  color: var(--rs-cyan-500);
+  --rs-rate-symbol-checked: var(--rs-cyan-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-rate-blue {
-  color: var(--rs-blue-500);
+  --rs-rate-symbol-checked: var(--rs-blue-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-rate-violet {
-  color: var(--rs-violet-500);
+  --rs-rate-symbol-checked: var(--rs-violet-500);
+  color: var(--rs-rate-symbol-checked);
 }
 .rs-toast {
   pointer-events: auto;
@@ -14668,8 +14739,7 @@ kbd.rs-text {
 .rs-theme-high-contrast .rs-picker-toggle:focus-visible {
   outline-offset: 2px;
 }
-.rs-picker-toggle:hover,
-.rs-picker-toggle:focus {
+.rs-picker-toggle:hover {
   color: var(--rs-btn-default-hover-text);
   background-color: var(--rs-btn-default-hover-bg);
   text-decoration: none;
@@ -14741,8 +14811,7 @@ kbd.rs-text {
   border: none;
   transition: none;
 }
-.rs-picker-subtle .rs-picker-toggle:hover,
-.rs-picker-subtle .rs-picker-toggle:focus {
+.rs-picker-subtle .rs-picker-toggle:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }