rsuite 6.0.0-canary-2025032014 → 6.0.0-canary-20250416

package/InputNumber/styles/index.css

@@ -427,9 +427,6 @@
   background-color: var(--rs-input-disabled-bg);
   color: var(--rs-text-disabled);
 }
-textarea.rs-input {
-  height: auto;
-}
 .rs-input.rs-input-xs {
   --rs-input-font-size: var(--rs-input-font-size-xs);
   --rs-input-line-height: var(--rs-input-line-height-xs);
@@ -454,10 +451,6 @@ textarea.rs-input {
   --rs-input-padding-block: var(--rs-input-padding-block-lg);
   --rs-input-padding-inline: var(--rs-input-padding-inline-lg);
 }
-textarea.rs-input {
-  overflow: auto;
-  resize: vertical;
-}
 :root {
   --rs-btn-size-xs: 1.5rem;
   --rs-btn-size-sm: 1.875rem;
@@ -1214,7 +1207,7 @@ textarea.rs-input {
 .rs-input-group .rs-input-number,
 .rs-input-group .rs-input-group-addon,
 .rs-input-group .rs-input-group-btn,
-.rs-input-group .rs-picker-date .rs-picker-toggle {
+.rs-input-group .rs-picker[data-picker='date'] .rs-picker-toggle {
   border: none;
   border-radius: var(--rs-radius-none);
   outline: none;

package/InputPicker/styles/index.css

@@ -510,9 +510,6 @@
   background-color: var(--rs-input-disabled-bg);
   color: var(--rs-text-disabled);
 }
-textarea.rs-input {
-  height: auto;
-}
 .rs-input.rs-input-xs {
   --rs-input-font-size: var(--rs-input-font-size-xs);
   --rs-input-line-height: var(--rs-input-line-height-xs);
@@ -537,10 +534,6 @@ textarea.rs-input {
   --rs-input-padding-block: var(--rs-input-padding-block-lg);
   --rs-input-padding-inline: var(--rs-input-padding-inline-lg);
 }
-textarea.rs-input {
-  overflow: auto;
-  resize: vertical;
-}
 .rs-picker-select-menu-items {
   overflow-y: auto;
 }
@@ -1619,7 +1612,7 @@ textarea.rs-input {
 .rs-input-group .rs-input-number,
 .rs-input-group .rs-input-group-addon,
 .rs-input-group .rs-input-group-btn,
-.rs-input-group .rs-picker-date .rs-picker-toggle {
+.rs-input-group .rs-picker[data-picker='date'] .rs-picker-toggle {
   border: none;
   border-radius: var(--rs-radius-none);
   outline: none;
@@ -1775,22 +1768,22 @@ textarea.rs-input {
   stroke: var(--rs-close-button-hover-color);
   stroke-width: 1;
 }
-.rs-picker-subtle .picker-subtle-toggle {
+.rs-picker[data-variant='subtle'] .picker-subtle-toggle {
   --rs-picker-toggle-border-width: 0px;
   position: relative;
   z-index: 5;
 }
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle {
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle {
   cursor: not-allowed;
 }
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover,
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus,
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active {
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active {
   background: none;
 }
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover::after,
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus::after,
-.rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active::after {
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover::after,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus::after,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active::after {
   display: none;
 }
 .rs-picker {
@@ -1798,25 +1791,23 @@ textarea.rs-input {
   --rs-picker-loader-size: 20px;
   --rs-picker-toggle-border-width: 1px;
   --rs-picker-toggle-bg: var(--rs-input-bg);
-}
-.rs-picker-toggle-wrapper {
   display: inline-block;
   vertical-align: middle;
   max-width: 100%;
 }
-.rs-picker-block {
+.rs-picker[data-block='true'] {
   display: block;
   width: 100%;
 }
-.rs-picker-disabled {
+.rs-picker[data-disabled='true'] {
   cursor: not-allowed;
 }
-.rs-picker-disabled .rs-picker-toggle-value,
-.rs-picker-disabled .rs-picker-toggle-indicator,
-.rs-picker-disabled .rs-picker-tag-list .rs-tag {
+.rs-picker[data-disabled='true'] .rs-picker-toggle-value,
+.rs-picker[data-disabled='true'] .rs-picker-toggle-indicator,
+.rs-picker[data-disabled='true'] .rs-picker-tag-list .rs-tag {
   color: var(--rs-text-disabled) !important;
 }
-.rs-picker-disabled .rs-picker-value-count {
+.rs-picker[data-disabled='true'] .rs-picker-value-count {
   opacity: 0.5;
 }
 .rs-picker-toggle .rs-picker-toggle-placeholder {
@@ -1826,10 +1817,6 @@ textarea.rs-input {
 .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value {
   color: var(--rs-picker-value);
 }
-.rs-picker-countable .rs-picker-toggle-value {
-  display: flex;
-  align-items: center;
-}
 .rs-picker-value-list {
   flex: 0 1 auto;
   overflow: hidden;
@@ -1840,11 +1827,12 @@ textarea.rs-input {
   margin-inline: var(--rs-picker-value-count-margin);
   background-color: var(--rs-picker-count-bg);
   color: var(--rs-picker-count-text);
+  flex-shrink: 0;
 }
 .rs-picker-value-separator {
   margin: 0 var(--rs-spacing) 0 0;
 }
-.rs-picker:not(.rs-picker-disabled):hover,
+.rs-picker:not([data-disabled='true']):hover,
 .rs-picker.rs-picker-focused {
   border-color: var(--rs-input-focus-border);
 }
@@ -1880,6 +1868,7 @@ textarea.rs-input {
   --rs-picker-popup-shadow: var(--rs-shadow-md);
   --rs-picker-popup-position-x: var(--rs-position-x);
   --rs-picker-popup-position-y: var(--rs-position-y);
+  --rs-picker-min-width: 0;
   position: absolute;
   top: var(--rs-picker-popup-position-y);
   left: var(--rs-picker-popup-position-x) /* rtl:ignore */;
@@ -1893,6 +1882,7 @@ textarea.rs-input {
   background-color: var(--rs-bg-overlay);
   box-shadow: var(--rs-picker-popup-shadow);
   padding-block: var(--rs-picker-popup-border-radius);
+  min-width: var(--rs-picker-min-width);
 }
 .rs-theme-high-contrast .rs-picker-popup {
   border: 1px solid var(--rs-border-primary);
@@ -1918,37 +1908,74 @@ textarea.rs-input {
   color: var(--rs-text-secondary);
   cursor: default;
 }
-.rs-picker-default .rs-picker-toggle {
+.rs-picker-popup .rs-picker-listbox {
+  max-height: var(--rs-picker-listbox-max-height);
+}
+.rs-picker-popup[data-breakpoint='xs'] {
+  min-width: unset;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+}
+.rs-picker-popup[data-breakpoint='xs'] .rs-picker-listbox {
+  height: unset;
+  max-height: unset;
+}
+.rs-picker-popup[data-breakpoint='xs'] .rs-tree,
+.rs-picker-popup[data-breakpoint='xs'] .rs-check-tree {
+  display: flex;
+  flex-direction: column;
+}
+.rs-picker-popup[data-breakpoint='xs'] .rs-tree-view,
+.rs-picker-popup[data-breakpoint='xs'] .rs-check-tree-view {
+  max-height: unset;
+  flex: 1 1 auto;
+}
+.rs-picker-popup[data-breakpoint='xs'] .rs-calendar-table {
+  width: 100%;
+}
+.rs-picker-popup[data-breakpoint='xs'] .rs-picker-box {
+  width: 100%;
+  height: 100%;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+.rs-picker-popup[data-breakpoint='xs'].rs-picker-popup-date .rs-calendar,
+.rs-picker-popup[data-breakpoint='xs'] .rs-picker-daterange-panel-only-time .rs-calendar {
+  height: 348px;
+}
+[data-variant='default'] .rs-picker-toggle {
   color: var(--rs-text-primary);
   border: var(--rs-picker-toggle-border-width) solid var(--rs-border-primary);
 }
-.rs-picker-disabled .rs-picker-toggle {
+[data-disabled='true'] .rs-picker-toggle {
   cursor: not-allowed;
 }
-.rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):hover,
-.rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):focus {
+.rs-picker-toggle [data-variant='default']:not([data-disabled='true']):hover,
+.rs-picker-toggle [data-variant='default']:not([data-disabled='true']):focus {
   border-color: var(--rs-input-focus-border);
 }
-.rs-picker-subtle .rs-picker-toggle {
+.rs-picker[data-variant='subtle'] .rs-picker-toggle {
   --rs-picker-toggle-border-width: 0px;
   position: relative;
   z-index: 5;
 }
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle {
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle {
   cursor: not-allowed;
 }
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover,
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus,
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active {
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active {
   background: none;
 }
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover::after,
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus::after,
-.rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active::after {
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover::after,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus::after,
+.rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active::after {
   display: none;
 }
 .rs-picker-toggle-label {
-  color: var(--rs-text-primary);
+  color: var(--rs-text-secondary);
 }
 .rs-picker-toggle .rs-picker-toggle-stack {
   flex: 1 1 auto;
@@ -1987,44 +2014,67 @@ textarea.rs-input {
 .rs-picker-toggle-read-only {
   opacity: 0;
 }
-.rs-picker-default .rs-picker-toggle {
+.rs-picker-toggle .rs-picker[data-variant='default'],
+.rs-picker-toggle {
   transition: border-color ease-in-out 0.15s;
 }
-.rs-theme-high-contrast .rs-picker-default .rs-picker-toggle {
+.rs-theme-high-contrast .rs-picker-toggle .rs-picker[data-variant='default'],
+.rs-theme-high-contrast .rs-picker-toggle {
   transition: none;
 }
-.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:hover,
-.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:focus,
-.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle-active {
+.rs-picker-toggle .rs-picker[data-variant='default']:hover,
+:not([data-disabled='true']) .rs-picker-toggle:hover,
+.rs-picker-toggle .rs-picker[data-variant='default']:focus,
+:not([data-disabled='true']) .rs-picker-toggle:focus,
+.rs-picker-toggle .rs-picker[data-variant='default']-active,
+:not([data-disabled='true']) .rs-picker-toggle-active {
   border-color: var(--rs-input-focus-border);
 }
-.rs-picker-subtle .rs-picker-toggle {
+.rs-picker[data-variant='subtle'] .rs-picker-toggle {
   color: var(--rs-btn-subtle-text);
   background-color: transparent;
   transition: none;
 }
-.rs-picker-subtle .rs-picker-toggle:hover {
+.rs-picker[data-variant='subtle'] .rs-picker-toggle:hover {
   color: var(--rs-btn-subtle-hover-text);
   background-color: var(--rs-btn-subtle-hover-bg);
 }
-.rs-picker-subtle .rs-picker-toggle:active,
-.rs-picker-subtle .rs-picker-toggle.rs-btn-active {
+.rs-picker[data-variant='subtle'] .rs-picker-toggle:active,
+.rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-active {
   color: var(--rs-btn-subtle-active-text);
   background-color: var(--rs-btn-subtle-active-bg);
 }
-.rs-picker-subtle .rs-picker-toggle:disabled,
-.rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
+.rs-picker[data-variant='subtle'] .rs-picker-toggle:disabled,
+.rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-disabled {
   color: var(--rs-btn-subtle-disabled-text);
   background: none;
 }
-.rs-theme-high-contrast .rs-picker-subtle .rs-picker-toggle:disabled,
-.rs-theme-high-contrast .rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
+.rs-theme-high-contrast .rs-picker[data-variant='subtle'] .rs-picker-toggle:disabled,
+.rs-theme-high-contrast .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-disabled {
   border-color: var(--rs-btn-default-disabled-boreder-color);
 }
-.rs-picker-subtle .rs-picker-toggle-active {
+.rs-picker[data-variant='subtle'] .rs-picker-toggle-active {
   background-color: var(--rs-btn-subtle-hover-bg);
   color: var(--rs-btn-subtle-hover-text);
 }
+.rs-picker-toggle[data-size='lg'] .rs-picker-clean .rs-icon {
+  width: 16px;
+  height: 16px;
+}
+.rs-picker-toggle[data-size='sm'] .rs-picker-clean {
+  height: 18px;
+}
+.rs-picker-toggle[data-size='xs'] .rs-picker-clean {
+  height: 18px;
+}
+.rs-picker-toggle[data-size='xs'] .rs-picker-clean .rs-icon {
+  width: 12px;
+  height: 12px;
+}
+.rs-picker-toggle[data-countable='true'] .rs-picker-toggle-value {
+  display: flex;
+  align-items: center;
+}
 .rs-picker-toggle.rs-btn {
   text-align: start;
   display: inline-flex;
@@ -2058,18 +2108,18 @@ textarea.rs-input {
   font-size: var(--rs-font-size-md);
   color: var(--rs-text-secondary);
 }
-.rs-picker-default .rs-btn,
+.rs-picker[data-variant='default'] .rs-btn,
 .rs-picker-input .rs-btn,
-.rs-picker-default .rs-picker-toggle,
+.rs-picker[data-variant='default'] .rs-picker-toggle,
 .rs-picker-input .rs-picker-toggle {
   background-color: var(--rs-picker-toggle-bg);
 }
-.rs-picker-default.rs-picker-disabled,
-.rs-picker-input.rs-picker-disabled {
+.rs-picker[data-variant='default'][data-disabled='true'],
+.rs-picker-input[data-disabled='true'] {
   --rs-picker-toggle-bg: var(--rs-input-disabled-bg);
 }
-.rs-picker-default.rs-picker-disabled .rs-input-group,
-.rs-picker-input.rs-picker-disabled .rs-input-group {
+.rs-picker[data-variant='default'][data-disabled='true'] .rs-input-group,
+.rs-picker-input[data-disabled='true'] .rs-input-group {
   pointer-events: none;
 }
 .rs-check-item {
@@ -2146,7 +2196,7 @@ textarea.rs-input {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.rs-picker-input {
+.rs-picker[data-picker='input'] {
   --rs-picker-textbox-margin-inline: var(--rs-picker-input-height);
   position: relative;
   border: 1px solid var(--rs-border-primary);
@@ -2155,44 +2205,45 @@ textarea.rs-input {
   background-color: var(--rs-input-bg);
   overflow: hidden;
 }
-.rs-picker-input .rs-picker-toggle {
+.rs-picker[data-picker='input'] .rs-picker-toggle {
   border: none !important;
   height: var(--rs-picker-input-height);
   cursor: text;
 }
-.rs-picker-input:not(.rs-picker-disabled) .rs-picker-toggle {
+.rs-picker[data-picker='input']:not([data-disabled='true']) .rs-picker-toggle {
   position: absolute !important;
 }
-.rs-picker-input.rs-picker-input-xs {
+.rs-picker[data-picker='input'][data-size='xs'] {
   --rs-picker-input-height: calc(var(--rs-btn-size-xs) - 2px);
   --rs-picker-search-input-font-size: var(--rs-input-font-size-xs);
   --rs-picker-search-input-line-height: var(--rs-input-line-height-xs);
   --rs-picker-search-input-padding-block: var(--rs-input-padding-block-xs);
   --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-xs);
 }
-.rs-picker-input.rs-picker-input-sm {
+.rs-picker[data-picker='input'][data-size='sm'] {
   --rs-picker-input-height: calc(var(--rs-btn-size-sm) - 2px);
   --rs-picker-search-input-font-size: var(--rs-input-font-size-sm);
   --rs-picker-search-input-line-height: var(--rs-input-line-height-sm);
   --rs-picker-search-input-padding-block: var(--rs-input-padding-block-sm);
   --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-sm);
 }
-.rs-picker-input.rs-picker-input-md {
+.rs-picker[data-picker='input'][data-size='md'] {
   --rs-picker-input-height: calc(var(--rs-btn-size-md) - 2px);
   --rs-picker-search-input-font-size: var(--rs-input-font-size-md);
   --rs-picker-search-input-line-height: var(--rs-input-line-height-md);
   --rs-picker-search-input-padding-block: var(--rs-input-padding-block-md);
   --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-md);
 }
-.rs-picker-input.rs-picker-input-lg {
+.rs-picker[data-picker='input'][data-size='lg'] {
   --rs-picker-input-height: calc(var(--rs-btn-size-lg) - 2px);
   --rs-picker-search-input-font-size: var(--rs-input-font-size-lg);
   --rs-picker-search-input-line-height: var(--rs-input-line-height-lg);
   --rs-picker-search-input-padding-block: var(--rs-input-padding-block-lg);
   --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-lg);
 }
-.rs-picker-input .rs-picker-textbox {
+.rs-picker[data-picker='input'] .rs-picker-textbox {
   margin-inline-end: var(--rs-picker-textbox-margin-inline);
+  height: var(--rs-picker-input-height);
 }
 .rs-picker-search {
   border: none;

package/InputPicker/styles/index.less

@@ -4,8 +4,7 @@
 @import '../../internals/Picker/styles/index.less';
 @import './mixin.less';
 
-.rs-picker-input {
-
+.rs-picker[data-picker='input'] {
   --rs-picker-textbox-margin-inline: var(--rs-picker-input-height);
 
   position: relative;
@@ -21,13 +20,13 @@
     cursor: text;
   }
 
-  &:not(.rs-picker-disabled) .rs-picker-toggle {
+  &:not([data-disabled='true']) .rs-picker-toggle {
     position: absolute !important;
   }
 
   @sizes: xs, sm, md, lg;
   each(@sizes, .(@size) {
-    &.rs-picker-input-@{size} {
+    &[data-size='@{size}'] {
       --rs-picker-input-height: calc(var(~'--rs-btn-size-@{size}') - 2px);
       --rs-picker-search-input-font-size: var(~'--rs-input-font-size-@{size}');
       --rs-picker-search-input-line-height: var(~'--rs-input-line-height-@{size}');
@@ -38,6 +37,7 @@
 
   .rs-picker-textbox {
     margin-inline-end: var(--rs-picker-textbox-margin-inline);
+    height: var(--rs-picker-input-height);
   }
 }
 

package/Link/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "rsuite/Link",
+  "private": true,
+  "main": "../cjs/Link/index.js",
+  "module": "../esm/Link/index.js",
+  "types": "../esm/Link/index.d.ts"
+}

package/Link/styles/index.css

@@ -0,0 +1,32 @@
+.rs-link {
+  --rs-link-disabled-opacity: 0.5;
+  --rs-link-spacing: var(--rs-spacing);
+  display: inline-flex;
+  align-items: center;
+  text-decoration: none;
+}
+.rs-link-icon {
+  margin-inline: var(--rs-link-spacing);
+}
+.rs-link:where([data-underline='always']) {
+  text-decoration: underline;
+}
+.rs-link:where([data-underline='hover']) {
+  text-decoration: none;
+}
+.rs-link:where([data-underline='hover']):hover {
+  text-decoration: underline;
+}
+.rs-link:where([data-underline='never']) {
+  text-decoration: none !important;
+}
+.rs-link:where([data-underline='not-hover']) {
+  text-decoration: underline;
+}
+.rs-link:where([data-underline='not-hover']):hover {
+  text-decoration: none;
+}
+.rs-link:where([data-disabled='true']) {
+  pointer-events: none;
+  opacity: var(--rs-link-disabled-opacity);
+}

package/Link/styles/index.less

@@ -0,0 +1,39 @@
+.rs-link {
+  --rs-link-disabled-opacity: 0.5;
+  --rs-link-spacing: var(--rs-spacing);
+
+  display: inline-flex;
+  align-items: center;
+  text-decoration: none;
+
+  &-icon {
+    margin-inline: var(--rs-link-spacing);
+  }
+
+  &:where([data-underline='always']) {
+    text-decoration: underline;
+  }
+
+  &:where([data-underline='hover']) {
+    text-decoration: none;
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+
+  &:where([data-underline='never']) {
+    text-decoration: none !important;
+  }
+
+  &:where([data-underline='not-hover']) {
+    text-decoration: underline;
+    &:hover {
+      text-decoration: none;
+    }
+  }
+
+  &:where([data-disabled='true']) {
+    pointer-events: none;
+    opacity: var(--rs-link-disabled-opacity);
+  }
+}

package/Message/styles/index.css

@@ -343,6 +343,15 @@
 .rs-message.rs-message-has-title .rs-message-icon .rs-icon {
   line-height: 1;
 }
+.rs-message-bordered {
+  border: 1px solid var(--rs-message-border-color);
+  border-left-width: 4px;
+}
+.rs-message-bordered .rs-message-icon {
+  box-sizing: content-box;
+  border: 4px solid var(--rs-message-icon-border-color);
+  border-radius: 50%;
+}
 .rs-message.rs-message-centered {
   --rs-message-icon-size: var(--rs-font-size-5xl);
 }

package/Message/styles/index.less

@@ -66,6 +66,17 @@
     }
   }
 
+  &-bordered {
+    border: 1px solid var(--rs-message-border-color);
+    border-left-width: 4px;
+
+    .rs-message-icon {
+      box-sizing: content-box;
+      border: 4px solid var(--rs-message-icon-border-color);
+      border-radius: 50%;
+    }
+  }
+
   &&-centered {
     --rs-message-icon-size: var(--rs-font-size-5xl);