rsuite 6.0.0-canary-2025031415 → 6.0.0-canary-20250319

package/dist/rsuite.css

@@ -298,13 +298,15 @@ dd {
   --rs-radius-3xl: 1.5rem;
   --rs-radius-4xl: 2rem;
   --rs-radius-full: calc(infinity * 1px);
+  --rs-shadow-color: rgba(0, 0, 0, 0.1);
+  --rs-shadow-color-deep: rgba(0, 0, 0, 0.25);
   --rs-shadow-none: 0 0 #0000;
-  --rs-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-  --rs-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.1);
-  --rs-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px 0 rgba(0, 0, 0, 0.1);
-  --rs-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px 0 rgba(0, 0, 0, 0.1);
-  --rs-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px 0 rgba(0, 0, 0, 0.1);
-  --rs-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+  --rs-shadow-xs: 0 1px 2px 0 var(--rs-shadow-color);
+  --rs-shadow-sm: 0 1px 3px 0 var(--rs-shadow-color), 0 1px 2px 0 var(--rs-shadow-color);
+  --rs-shadow-md: 0 4px 6px -1px var(--rs-shadow-color), 0 2px 4px 0 var(--rs-shadow-color);
+  --rs-shadow-lg: 0 10px 15px -3px var(--rs-shadow-color), 0 4px 6px 0 var(--rs-shadow-color);
+  --rs-shadow-xl: 0 20px 25px -5px var(--rs-shadow-color), 0 8px 10px 0 var(--rs-shadow-color);
+  --rs-shadow-2xl: 0 25px 50px -12px var(--rs-shadow-color-deep);
 }
 :root,
 .rs-theme-light {
@@ -2694,6 +2696,10 @@ tbody.rs-anim-collapse.rs-anim-in {
 .rs-btn-toolbar {
   line-height: 0;
 }
+.rs-btn-toolbar.rs-stack {
+  --rs-stack-spacing: calc(var(--rs-spacing) * 2);
+  --rs-stack-wrap: wrap;
+}
 .rs-picker-subtle .picker-subtle-toggle {
   --rs-picker-toggle-border-width: 0px;
   position: relative;
@@ -3996,7 +4002,7 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
   border-left: 1px solid var(--rs-tree-indent-line-color);
   position: absolute;
   width: 1px;
-  top: -10px;
+  top: -4px;
   inset-inline-start: 12px;
   bottom: -4px;
 }
@@ -4036,7 +4042,7 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
   display: none;
 }
 .rs-check-tree-group {
-  padding-inline-start: 24px;
+  padding-inline-start: 20px;
 }
 .rs-check-tree-node {
   position: relative;
@@ -10554,7 +10560,7 @@ textarea.rs-input {
   transition: opacity 0.1s linear, transform 0.1s ease-out;
 }
 .rs-popover.rs-anim-in {
-  opacity: 1;
+  --rs-popover-opacity: 1;
   transition: opacity 0.15s linear, transform 0.15s ease-in;
 }
 .rs-theme-high-contrast .rs-popover {
@@ -11107,12 +11113,16 @@ textarea.rs-input {
   --rs-radio-tile-border-radius: var(--rs-radius-md);
   --rs-radio-tile-padding: calc(var(--rs-spacing) * 2.5);
   --rs-radio-tile-mark-size: 48px;
+  --rs-radio-tile-spacing: calc(var(--rs-spacing) * 1.5);
   border-radius: var(--rs-radio-tile-border-radius);
   overflow: hidden;
   border: 2px solid var(--rs-radio-tile-border);
   padding: var(--rs-radio-tile-padding);
   position: relative;
   cursor: pointer;
+  display: flex;
+  gap: var(--rs-radio-tile-spacing);
+  align-items: center;
 }
 .rs-radio-tile-label {
   font-weight: bold;
@@ -11245,6 +11255,10 @@ textarea.rs-input {
 .rs-picker-select-menu-group-children .rs-picker-select-menu-item {
   padding-inline-start: 26px;
 }
+.rs-sidebar {
+  --rs-sidebar-width: var(--rs-box-w, 260px);
+  flex: 0 0 var(--rs-sidebar-width);
+}
 .rs-sidebar-collapse {
   transition: flex 0.15s ease-in, width 0.15s ease-in;
   min-width: 0;
@@ -14482,8 +14496,9 @@ textarea.rs-input {
   font-family: var(--rs-font-family-base);
   margin: 0;
   color: var(--rs-text-color, var(--rs-text-primary));
-  font-size: var(--rs-text-font-size);
+  font-size: var(--rs-font-size);
   line-height: var(--rs-text-line-height, 1.42857143);
+  line-clamp: var(--rs-text-max-lines);
 }
 blockquote.rs-text {
   font-style: italic;
@@ -14599,44 +14614,34 @@ kbd.rs-text {
 .rs-text-violet {
   --rs-text-color: var(--rs-violet-500);
 }
-.rs-text-xs {
-  --rs-text-font-size: var(--rs-font-size-xs);
+.rs-text:where([style*='size-xs']) {
   --rs-text-line-height: var(--rs-text-line-height-xs);
 }
-.rs-text-sm {
-  --rs-text-font-size: var(--rs-font-size-sm);
+.rs-text:where([style*='size-sm']) {
   --rs-text-line-height: var(--rs-text-line-height-sm);
 }
-.rs-text-md {
-  --rs-text-font-size: var(--rs-font-size-md);
+.rs-text:where([style*='size-md']) {
   --rs-text-line-height: var(--rs-text-line-height-md);
 }
-.rs-text-lg {
-  --rs-text-font-size: var(--rs-font-size-lg);
+.rs-text:where([style*='size-lg']) {
   --rs-text-line-height: var(--rs-text-line-height-lg);
 }
-.rs-text-xl {
-  --rs-text-font-size: var(--rs-font-size-xl);
+.rs-text:where([style*='size-xl']) {
   --rs-text-line-height: var(--rs-text-line-height-xl);
 }
-.rs-text-2xl {
-  --rs-text-font-size: var(--rs-font-size-2xl);
+.rs-text:where([style*='size-2xl']) {
   --rs-text-line-height: var(--rs-text-line-height-2xl);
 }
-.rs-text-3xl {
-  --rs-text-font-size: var(--rs-font-size-3xl);
+.rs-text:where([style*='size-3xl']) {
   --rs-text-line-height: var(--rs-text-line-height-3xl);
 }
-.rs-text-4xl {
-  --rs-text-font-size: var(--rs-font-size-4xl);
+.rs-text:where([style*='size-4xl']) {
   --rs-text-line-height: var(--rs-text-line-height-4xl);
 }
-.rs-text-5xl {
-  --rs-text-font-size: var(--rs-font-size-5xl);
+.rs-text:where([style*='size-5xl']) {
   --rs-text-line-height: var(--rs-text-line-height-5xl);
 }
-.rs-text-6xl {
-  --rs-text-font-size: var(--rs-font-size-6xl);
+.rs-text:where([style*='size-6xl']) {
   --rs-text-line-height: var(--rs-text-line-height-6xl);
 }
 :root {
@@ -15102,7 +15107,7 @@ kbd.rs-text {
 .rs-search-box-icon {
   color: var(--rs-text-secondary);
 }
-:where(.rs-box) {
+[data-rs='box'] {
   --rs-box-rounded-xs: var(--rs-radius-xs);
   --rs-box-rounded-sm: var(--rs-radius-sm);
   --rs-box-rounded-md: var(--rs-radius-md);
@@ -15115,157 +15120,119 @@ kbd.rs-text {
   --rs-box-shadow-lg: var(--rs-shadow-lg);
   --rs-box-shadow-xl: var(--rs-shadow-xl);
 }
-:where(.rs-box)[style*='--rs-box-bg'] {
-  background: var(--rs-box-bg);
-}
-:where(.rs-box)[style*='--rs-box-color'] {
-  color: var(--rs-box-color);
-}
-:where(.rs-box)[style*='--rs-box-display'] {
-  display: var(--rs-box-display);
-}
-:where(.rs-box)[style*='--rs-box-p'] {
+[data-rs='box'][style*='--rs-box-p'] {
   padding: var(--rs-box-p);
 }
-:where(.rs-box)[style*='--rs-box-pt'] {
+[data-rs='box'][style*='--rs-box-pt'] {
   padding-top: var(--rs-box-pt);
 }
-:where(.rs-box)[style*='--rs-box-pb'] {
+[data-rs='box'][style*='--rs-box-pb'] {
   padding-bottom: var(--rs-box-pb);
 }
-:where(.rs-box)[style*='--rs-box-pl'] {
+[data-rs='box'][style*='--rs-box-pl'] {
   padding-left: var(--rs-box-pl);
 }
-:where(.rs-box)[style*='--rs-box-pr'] {
+[data-rs='box'][style*='--rs-box-pr'] {
   padding-right: var(--rs-box-pr);
 }
-:where(.rs-box)[style*='--rs-box-px'] {
+[data-rs='box'][style*='--rs-box-px'] {
   padding-inline: var(--rs-box-px);
 }
-:where(.rs-box)[style*='--rs-box-py'] {
+[data-rs='box'][style*='--rs-box-py'] {
   padding-block: var(--rs-box-py);
 }
-:where(.rs-box)[style*='--rs-box-m'] {
+[data-rs='box'][style*='--rs-box-m'] {
   margin: var(--rs-box-m);
 }
-:where(.rs-box)[style*='--rs-box-mt'] {
+[data-rs='box'][style*='--rs-box-mt'] {
   margin-top: var(--rs-box-mt);
 }
-:where(.rs-box)[style*='--rs-box-mb'] {
+[data-rs='box'][style*='--rs-box-mb'] {
   margin-bottom: var(--rs-box-mb);
 }
-:where(.rs-box)[style*='--rs-box-ml'] {
+[data-rs='box'][style*='--rs-box-ml'] {
   margin-left: var(--rs-box-ml);
 }
-:where(.rs-box)[style*='--rs-box-mr'] {
+[data-rs='box'][style*='--rs-box-mr'] {
   margin-right: var(--rs-box-mr);
 }
-:where(.rs-box)[style*='--rs-box-mx'] {
+[data-rs='box'][style*='--rs-box-mx'] {
   margin-inline: var(--rs-box-mx);
 }
-:where(.rs-box)[style*='--rs-box-my'] {
+[data-rs='box'][style*='--rs-box-my'] {
   margin-block: var(--rs-box-my);
 }
-:where(.rs-box)[style*='--rs-box-w'] {
+[data-rs='box'][style*='--rs-box-w'] {
   width: var(--rs-box-w);
 }
-:where(.rs-box)[style*='--rs-box-h'] {
+[data-rs='box'][style*='--rs-box-h'] {
   height: var(--rs-box-h);
 }
-:where(.rs-box)[style*='--rs-box-rounded'] {
-  border-radius: var(--rs-box-rounded);
-}
-:where(.rs-box)[style*='--rs-box-border'] {
-  border: var(--rs-box-border);
-}
-:where(.rs-box)[style*='--rs-box-shadow'] {
-  box-shadow: var(--rs-box-shadow);
-}
-:where(.rs-box-visible-xs) {
-  display: none !important;
-}
-@media (max-width: 575px) {
-  :where(.rs-box-visible-xs) {
-    display: var(--rs-box-display, inherit) !important;
-  }
-}
-:where(.rs-box-visible-sm) {
-  display: none !important;
-}
-@media (max-width: 767px) {
-  :where(.rs-box-visible-sm) {
-    display: var(--rs-box-display, inherit) !important;
-  }
-}
-:where(.rs-box-visible-md) {
-  display: none !important;
-}
-@media (max-width: 991px) {
-  :where(.rs-box-visible-md) {
-    display: var(--rs-box-display, inherit) !important;
-  }
-}
-:where(.rs-box-visible-lg) {
-  display: none !important;
+[data-rs='box'][style*='--rs-box-c'] {
+  color: var(--rs-box-c);
 }
-@media (max-width: 1199px) {
-  :where(.rs-box-visible-lg) {
-    display: var(--rs-box-display, inherit) !important;
-  }
+[data-rs='box'][style*='--rs-box-bd'] {
+  border: var(--rs-box-bd);
 }
-:where(.rs-box-visible-xl) {
-  display: none !important;
+[data-rs='box'][style*='--rs-box-rounded'] {
+  border-radius: var(--rs-box-rounded);
 }
-@media (max-width: 1399px) {
-  :where(.rs-box-visible-xl) {
-    display: var(--rs-box-display, inherit) !important;
-  }
+[data-rs='box'][style*='--rs-box-shadow'] {
+  box-shadow: var(--rs-box-shadow);
 }
-:where(.rs-box-visible-xxl) {
-  display: none !important;
-  display: var(--rs-box-display, inherit) !important;
+[data-rs='box'][style*='--rs-box-bg'] {
+  background: var(--rs-box-bg);
 }
-:where(.rs-box-hidden-xs) {
-  display: var(--rs-box-display, inherit) !important;
+[data-rs='box'][style*='--rs-box-display'] {
+  display: var(--rs-box-display);
 }
 @media (max-width: 575px) {
-  :where(.rs-box-hidden-xs) {
+  [data-visible-from='xs'] {
     display: none !important;
   }
 }
-:where(.rs-box-hidden-sm) {
-  display: var(--rs-box-display, inherit) !important;
+@media (min-width: 576px) {
+  [data-hidden-from='xs'] {
+    display: none !important;
+  }
 }
 @media (max-width: 767px) {
-  :where(.rs-box-hidden-sm) {
+  [data-visible-from='sm'] {
     display: none !important;
   }
 }
-:where(.rs-box-hidden-md) {
-  display: var(--rs-box-display, inherit) !important;
+@media (min-width: 768px) {
+  [data-hidden-from='sm'] {
+    display: none !important;
+  }
 }
 @media (max-width: 991px) {
-  :where(.rs-box-hidden-md) {
+  [data-visible-from='md'] {
     display: none !important;
   }
 }
-:where(.rs-box-hidden-lg) {
-  display: var(--rs-box-display, inherit) !important;
+@media (min-width: 992px) {
+  [data-hidden-from='md'] {
+    display: none !important;
+  }
 }
 @media (max-width: 1199px) {
-  :where(.rs-box-hidden-lg) {
+  [data-visible-from='lg'] {
     display: none !important;
   }
 }
-:where(.rs-box-hidden-xl) {
-  display: var(--rs-box-display, inherit) !important;
+@media (min-width: 1200px) {
+  [data-hidden-from='lg'] {
+    display: none !important;
+  }
 }
 @media (max-width: 1399px) {
-  :where(.rs-box-hidden-xl) {
+  [data-visible-from='xl'] {
     display: none !important;
   }
 }
-:where(.rs-box-hidden-xxl) {
-  display: var(--rs-box-display, inherit) !important;
-  display: none !important;
+@media (min-width: 1400px) {
+  [data-hidden-from='xl'] {
+    display: none !important;
+  }
 }