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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "6.0.0-canary-2025032014",
+  "version": "6.0.0-canary-20250416",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -34,10 +34,11 @@
     "date-fns": "^4.1.0",
     "dom-lib": "^3.3.1",
     "lodash": "^4.17.21",
+    "react-textarea-autosize": "^8.5.9",
     "react-use-set": "^1.0.0",
     "react-window": "^1.8.11",
     "rsuite-table": "^5.19.1",
-    "schema-typed": "^2.3.0"
+    "schema-typed": "^2.4.1"
   },
   "peerDependencies": {
     "react": ">=18",

package/styles/color-modes/dark.less

@@ -295,10 +295,10 @@
 
   // Rate
   --rs-rate-symbol: var(--rs-gray-600);
-  --rs-rate-symbol-checked: var(--rs-yellow-500);
+  --rs-rate-color: var(--rs-yellow-500);
 
   // Toggle
-  --rs-toggle-bg: var(--rs-gray-400);
+  --rs-toggle-bg: var(--rs-gray-500);
   --rs-toggle-thumb: #fff;
   --rs-toggle-hover-bg: var(--rs-gray-300);
   --rs-toggle-disabled-bg: var(--rs-gray-600);

package/styles/color-modes/high-contrast.less

@@ -41,7 +41,7 @@
       --rs-@{color-name}-50: @@color-name-50;
 
       each(range(9), {
-        @level: @{index}00;
+        @level: ~'@{index}00';
         @color-name-level: ~'@{color-name}-@{level}-high-contrast';
         --rs-@{color-name}-@{level}: @@color-name-level;
       });
@@ -300,7 +300,7 @@
 
   // Rate
   --rs-rate-symbol: var(--rs-gray-100);
-  --rs-rate-symbol-checked: var(--rs-primary-500);
+  --rs-rate-color: var(--rs-primary-500);
 
   // Toggle
   --rs-toggle-bg: var(--rs-gray-800);

package/styles/color-modes/light.less

@@ -308,10 +308,10 @@
 
   // Rate
   --rs-rate-symbol: var(--rs-gray-600);
-  --rs-rate-symbol-checked: var(--rs-blue-500);
+  --rs-rate-color: var(--rs-blue-500);
 
   // Toggle
-  --rs-toggle-bg: var(--rs-gray-400);
+  --rs-toggle-bg: var(--rs-gray-500);
   --rs-toggle-thumb: #fff;
   --rs-toggle-loader-ring: rgb(from var(--rs-gray-50) r g b / 30%);
   --rs-toggle-loader-rotor: var(--rs-gray-0);

package/styles/index.less

@@ -45,8 +45,10 @@
 @import '../InputGroup/styles/index';
 @import '../InputNumber/styles/index';
 @import '../InputPicker/styles/index';
+@import '../Textarea/styles/index';
 @import '../InlineEdit/styles/index';
 @import '../Kbd/styles/index';
+@import '../Link/styles/index';
 @import '../List/styles/index';
 @import '../Loader/styles/index';
 @import '../Menu/styles/index';
@@ -57,6 +59,7 @@
 @import '../Nav/styles/index';
 @import '../Navbar/styles/index';
 @import '../Notification/styles/index';
+@import '../PasswordStrengthMeter/styles/index';
 @import '../Pagination/styles/index';
 @import '../Panel/styles/index';
 @import '../PanelGroup/styles/index';

package/styles/root.less

@@ -5,6 +5,8 @@
   --rs-font-family-monospace: @font-family-monospace;
 
   // Font size
+  --rs-font-size-4xs: 0.375rem; // 6px
+  --rs-font-size-3xs: 0.5rem;   // 8px
   --rs-font-size-2xs: 0.625rem; // 10px
   --rs-font-size-xs: 0.75rem;   // 12px
   --rs-font-size-sm: 0.875rem;  // 14px

package/styles/variables.less

@@ -278,21 +278,6 @@
 @toggle-active-scale: 1.2;
 @toggle-transition: 0.15s ease-out;
 
-@toggle-md-height: 24px;
-@toggle-md-handle-gap: 3px;
-@toggle-md-min-width: 44px;
-@toggle-md-handle-diameter: (@toggle-md-height - @toggle-md-handle-gap*2);
-@toggle-md-inner-margin: @padding-y;
-
-@toggle-sm-height: 14px;
-@toggle-sm-min-width: 26px;
-@toggle-sm-handle-gap: 2px;
-@toggle-sm-inner-margin: 6px;
-
-@toggle-lg-height: 30px;
-@toggle-lg-min-width: 55px;
-@toggle-lg-handle-gap: 4px;
-@toggle-lg-inner-margin: @padding-x-sm;
 
 // Navs
 
@@ -584,15 +569,6 @@
 @cascader-search-panel-max-height: 300px;
 @cascader-row-content-padding-horizontal: @picker-item-content-padding-horizontal;
 
-// Slider
-
-@slider-bar-side-length: 6px;
-@slider-handle-diameter: 12px;
-@slider-handle-border-width: 2px;
-@slider-calibration-diameter: 8px;
-@slider-calibration-border-width: 2px;
-@slider-mark-margin-top: 9px;
-@slider-handle-transition: 0.15s ease-in-out;
 
 // Breadcrumbs
 

package/SafeAnchor/package.json

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

package/cjs/Form/hooks/useFormClassNames.d.ts

@@ -1,5 +0,0 @@
-import type { FormProps } from '../Form';
-/**
- * Take <Form> props and return className for <Form> styles
- */
-export default function useFormClassNames({ classPrefix, className, fluid, layout, readOnly, plaintext, disabled }: Pick<FormProps, 'classPrefix' | 'className' | 'fluid' | 'layout' | 'readOnly' | 'plaintext' | 'disabled'>): string;

package/cjs/Form/hooks/useFormClassNames.js

@@ -1,29 +0,0 @@
-'use client';
-"use strict";
-
-exports.__esModule = true;
-exports.default = useFormClassNames;
-var _hooks = require("../../internals/hooks");
-/**
- * Take <Form> props and return className for <Form> styles
- */
-function useFormClassNames(_ref) {
-  let {
-    classPrefix = 'form',
-    className,
-    fluid,
-    layout = 'vertical',
-    readOnly,
-    plaintext,
-    disabled
-  } = _ref;
-  const {
-    withPrefix,
-    merge
-  } = (0, _hooks.useStyles)(classPrefix);
-  return merge(className, withPrefix(layout, fluid && layout === 'vertical' ? 'fluid' : 'fixed-width', {
-    readonly: readOnly,
-    disabled,
-    plaintext
-  }));
-}

package/cjs/internals/Picker/hooks/usePickerClassName.d.ts

@@ -1,19 +0,0 @@
-export interface PickerClassNameProps {
-    name?: string;
-    classPrefix: string;
-    className?: string;
-    appearance?: 'default' | 'subtle';
-    cleanable?: boolean;
-    block?: boolean;
-    disabled?: boolean;
-    countable?: boolean;
-    readOnly?: boolean;
-    plaintext?: boolean;
-    hasValue?: boolean;
-    classes?: any;
-}
-/**
- * The className of the assembled Toggle is on the Picker.
- */
-declare function usePickerClassName(props: PickerClassNameProps): [string, string[]];
-export default usePickerClassName;

package/cjs/internals/Picker/hooks/usePickerClassName.js

@@ -1,45 +0,0 @@
-'use client';
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _omit = _interopRequireDefault(require("lodash/omit"));
-var _hooks = require("../../hooks");
-/**
- * The className of the assembled Toggle is on the Picker.
- */
-function usePickerClassName(props) {
-  const {
-    name,
-    classPrefix,
-    className,
-    appearance,
-    cleanable,
-    block,
-    disabled,
-    countable,
-    readOnly,
-    plaintext,
-    hasValue,
-    ...rest
-  } = props;
-  const {
-    withPrefix,
-    merge
-  } = (0, _hooks.useStyles)(classPrefix);
-  const classes = merge(className, withPrefix(name, appearance, 'toggle-wrapper', {
-    'read-only': readOnly,
-    'has-value': hasValue,
-    cleanable,
-    block,
-    disabled,
-    countable,
-    plaintext
-  }));
-
-  // Those props that're used for composing the className
-  const usedClassNamePropKeys = Object.keys((0, _omit.default)(props, [...Object.keys(rest || {}), 'disabled', 'readOnly', 'plaintext', 'name']));
-  return [classes, usedClassNamePropKeys];
-}
-var _default = exports.default = usePickerClassName;

package/esm/Form/hooks/useFormClassNames.d.ts

@@ -1,5 +0,0 @@
-import type { FormProps } from '../Form';
-/**
- * Take <Form> props and return className for <Form> styles
- */
-export default function useFormClassNames({ classPrefix, className, fluid, layout, readOnly, plaintext, disabled }: Pick<FormProps, 'classPrefix' | 'className' | 'fluid' | 'layout' | 'readOnly' | 'plaintext' | 'disabled'>): string;

package/esm/Form/hooks/useFormClassNames.js

@@ -1,25 +0,0 @@
-'use client';
-import { useStyles } from "../../internals/hooks/index.js";
-/**
- * Take <Form> props and return className for <Form> styles
- */
-export default function useFormClassNames(_ref) {
-  let {
-    classPrefix = 'form',
-    className,
-    fluid,
-    layout = 'vertical',
-    readOnly,
-    plaintext,
-    disabled
-  } = _ref;
-  const {
-    withPrefix,
-    merge
-  } = useStyles(classPrefix);
-  return merge(className, withPrefix(layout, fluid && layout === 'vertical' ? 'fluid' : 'fixed-width', {
-    readonly: readOnly,
-    disabled,
-    plaintext
-  }));
-}

package/esm/internals/Picker/hooks/usePickerClassName.d.ts

@@ -1,19 +0,0 @@
-export interface PickerClassNameProps {
-    name?: string;
-    classPrefix: string;
-    className?: string;
-    appearance?: 'default' | 'subtle';
-    cleanable?: boolean;
-    block?: boolean;
-    disabled?: boolean;
-    countable?: boolean;
-    readOnly?: boolean;
-    plaintext?: boolean;
-    hasValue?: boolean;
-    classes?: any;
-}
-/**
- * The className of the assembled Toggle is on the Picker.
- */
-declare function usePickerClassName(props: PickerClassNameProps): [string, string[]];
-export default usePickerClassName;

package/esm/internals/Picker/hooks/usePickerClassName.js

@@ -1,40 +0,0 @@
-'use client';
-import omit from 'lodash/omit';
-import { useStyles } from "../../hooks/index.js";
-/**
- * The className of the assembled Toggle is on the Picker.
- */
-function usePickerClassName(props) {
-  const {
-    name,
-    classPrefix,
-    className,
-    appearance,
-    cleanable,
-    block,
-    disabled,
-    countable,
-    readOnly,
-    plaintext,
-    hasValue,
-    ...rest
-  } = props;
-  const {
-    withPrefix,
-    merge
-  } = useStyles(classPrefix);
-  const classes = merge(className, withPrefix(name, appearance, 'toggle-wrapper', {
-    'read-only': readOnly,
-    'has-value': hasValue,
-    cleanable,
-    block,
-    disabled,
-    countable,
-    plaintext
-  }));
-
-  // Those props that're used for composing the className
-  const usedClassNamePropKeys = Object.keys(omit(props, [...Object.keys(rest || {}), 'disabled', 'readOnly', 'plaintext', 'name']));
-  return [classes, usedClassNamePropKeys];
-}
-export default usePickerClassName;