rsuite 5.46.1 → 5.48.0

package/cjs/CheckTreePicker/CheckTreePicker.js

@@ -27,6 +27,12 @@ var emptyArray = [];
 var itemSize = function itemSize() {
   return 36;
 };
+
+/**
+ * The `CheckTreePicker` component is used for selecting multiple options which are organized in a tree structure.
+ *
+ * @see https://rsuitejs.com/components/check-tree-picker
+ */
 var CheckTreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,

package/cjs/Checkbox/Checkbox.d.ts

@@ -36,6 +36,12 @@ export interface CheckboxProps<V = ValueType> extends WithAsProps {
     onClick?: (event: React.SyntheticEvent) => void;
     /** Called when the checkbox is clicked. */
     onCheckboxClick?: (event: React.SyntheticEvent) => void;
+    /** Called when the user presses down a key. */
+    onKeyDown?: (event: React.KeyboardEvent) => void;
 }
+/**
+ * The Checkbox component is used for selecting multiple options from a set.
+ * @see https://rsuitejs.com/components/checkbox
+ */
 declare const Checkbox: RsRefForwardingComponent<'div', CheckboxProps>;
 export default Checkbox;

package/cjs/Checkbox/Checkbox.js

@@ -13,6 +13,10 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
 var _CheckboxGroup = require("../CheckboxGroup");
 var _templateObject, _templateObject2, _templateObject3;
+/**
+ * The Checkbox component is used for selecting multiple options from a set.
+ * @see https://rsuitejs.com/components/checkbox
+ */
 var Checkbox = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var checkboxGroupContext = (0, _react.useContext)(_CheckboxGroup.CheckboxGroupContext);
   var _ref = checkboxGroupContext !== null && checkboxGroupContext !== void 0 ? checkboxGroupContext : {},

package/cjs/CheckboxGroup/CheckboxGroup.d.ts

@@ -9,5 +9,9 @@ export interface CheckboxGroupProps<V = ValueType[]> extends WithAsProps, FormCo
     /** Inline layout */
     inline?: boolean;
 }
+/**
+ * The `CheckboxGroup` component is used for selecting multiple options which are unrelated.
+ * @see https://rsuitejs.com/components/checkbox/#checkbox-group
+ */
 declare const CheckboxGroup: RsRefForwardingComponent<'div', CheckboxGroupProps>;
 export default CheckboxGroup;

package/cjs/CheckboxGroup/CheckboxGroup.js

@@ -14,6 +14,10 @@ var _remove = _interopRequireDefault(require("lodash/remove"));
 var _utils = require("../utils");
 var _Plaintext = _interopRequireDefault(require("../Plaintext"));
 var _CheckboxGroupContext = require("./CheckboxGroupContext");
+/**
+ * The `CheckboxGroup` component is used for selecting multiple options which are unrelated.
+ * @see https://rsuitejs.com/components/checkbox/#checkbox-group
+ */
 var CheckboxGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,

package/cjs/CloseButton/CloseButton.js

@@ -14,7 +14,7 @@ var _utils = require("../utils");
  */
 var CloseButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
-    Component = _props$as === void 0 ? 'span' : _props$as,
+    Component = _props$as === void 0 ? 'button' : _props$as,
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'btn-close' : _props$classPrefix,
     className = props.className,
@@ -27,13 +27,11 @@ var CloseButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     locale = _useCustom.locale;
   var classes = merge(className, withClassPrefix());
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
-    role: "button"
-  }, rest, {
+    type: "button",
     ref: ref,
     className: classes,
-    title: locale === null || locale === void 0 ? void 0 : locale.closeLabel,
     "aria-label": locale === null || locale === void 0 ? void 0 : locale.closeLabel
-  }), /*#__PURE__*/_react.default.createElement(_Close.default, null));
+  }, rest), /*#__PURE__*/_react.default.createElement(_Close.default, null));
 });
 CloseButton.displayName = 'CloseButton';
 var _default = CloseButton;

package/cjs/Col/Col.d.ts

@@ -61,5 +61,9 @@ export interface ColProps extends WithAsProps {
     /** Hide column on Ultra large devices Desktops */
     xxlHidden?: boolean;
 }
+/**
+ * The `Col` component is used for layout and grids.
+ * @see https://rsuitejs.com/en/components/grid
+ */
 declare const Col: RsRefForwardingComponent<'div', ColProps>;
 export default Col;

package/cjs/Col/Col.js

@@ -10,6 +10,10 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _omit = _interopRequireDefault(require("lodash/omit"));
 var _utils = require("../utils");
+/**
+ * The `Col` component is used for layout and grids.
+ * @see https://rsuitejs.com/en/components/grid
+ */
 var Col = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,

package/cjs/Container/Container.d.ts

@@ -5,5 +5,9 @@ export declare const ContainerContext: React.Context<ContainerContextValue>;
 interface ContainerContextValue {
     setHasSidebar?: (value: boolean) => void;
 }
+/**
+ * The Container component is used to wrap content in a themed container with a max-width.
+ * @see https://rsuitejs.com/components/container
+ */
 declare const Container: React.ForwardRefExoticComponent<WithAsProps<React.ElementType<any>> & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export default Container;

package/cjs/Container/Container.js

@@ -12,6 +12,10 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
 var ContainerContext = /*#__PURE__*/_react.default.createContext({});
 exports.ContainerContext = ContainerContext;
+/**
+ * The Container component is used to wrap content in a themed container with a max-width.
+ * @see https://rsuitejs.com/components/container
+ */
 var Container = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'section' : _props$as,

package/cjs/Content/Content.d.ts

@@ -1,6 +1,9 @@
 import { ComponentProps } from '../utils/createComponent';
 export declare type ContentProps = ComponentProps;
 /**
+ * The Content component is used to wrap content in a themed container with a max-width.
+ * @see https://rsuitejs.com/components/container/
+ *
  * For Internet Explorer 11 and lower, it's suggested that an ARIA role of "main"
  * be added to the <main> element to ensure it is accessible
  */

package/cjs/Content/Content.js

@@ -6,6 +6,9 @@ exports.__esModule = true;
 exports.default = void 0;
 var _createComponent = _interopRequireDefault(require("../utils/createComponent"));
 /**
+ * The Content component is used to wrap content in a themed container with a max-width.
+ * @see https://rsuitejs.com/components/container/
+ *
  * For Internet Explorer 11 and lower, it's suggested that an ARIA role of "main"
  * be added to the <main> element to ensure it is accessible
  */

package/cjs/CustomProvider/CustomProvider.d.ts

@@ -55,6 +55,8 @@ declare const CustomContext: React.Context<CustomProviderProps<{
     common?: {
         loading: string;
         emptyMessage: string;
+        remove: string;
+        clear: string;
     } | undefined;
     Plaintext?: {
         unfilled: string;
@@ -134,9 +136,6 @@ declare const CustomContext: React.Context<CustomProviderProps<{
     } | undefined;
     InputPicker?: {
         newItem: string;
-        /**
-         * A Map of toast containers
-         */
         createOption: string;
     } | undefined;
     Uploader?: {
@@ -146,6 +145,7 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         complete: string;
         emptyFile: string;
         upload: string;
+        removeFile: string;
     } | undefined;
     CloseButton?: {
         closeLabel: string;
@@ -158,6 +158,11 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         off: string;
     } | undefined;
 }>>;
+/**
+ * CustomProvider is used to provide global configuration, such as language, theme, etc.
+ *
+ * @see https://rsuitejs.com/components/custom-provider
+ */
 declare const CustomProvider: (props: Omit<CustomProviderProps, 'toasters'>) => JSX.Element;
 export { CustomContext };
 export default CustomProvider;

package/cjs/CustomProvider/CustomProvider.js

@@ -15,6 +15,12 @@ var _utils = require("../utils");
 var CustomContext = /*#__PURE__*/_react.default.createContext({});
 exports.CustomContext = CustomContext;
 var themes = ['light', 'dark', 'high-contrast'];
+
+/**
+ * CustomProvider is used to provide global configuration, such as language, theme, etc.
+ *
+ * @see https://rsuitejs.com/components/custom-provider
+ */
 var CustomProvider = function CustomProvider(props) {
   var children = props.children,
     _props$classPrefix = props.classPrefix,

package/cjs/DOMHelper/index.d.ts

@@ -1,6 +1,10 @@
 /// <reference types="node" />
 import * as helpers from 'dom-lib';
 export * from 'dom-lib';
+/**
+ * a wrapper of dom-lib with some custom methods.
+ * @see https://rsuitejs.com/components/dom-helper/
+ */
 declare const DOMHelper: {
     isElement: (value: any) => value is HTMLElement;
     on: typeof helpers.on;

package/cjs/DOMHelper/index.js

@@ -15,6 +15,10 @@ Object.keys(helpers).forEach(function (key) {
   exports[key] = helpers[key];
 });
 var _isElement = _interopRequireDefault(require("./isElement"));
+/**
+ * a wrapper of dom-lib with some custom methods.
+ * @see https://rsuitejs.com/components/dom-helper/
+ */
 var DOMHelper = (0, _extends2.default)({}, helpers, {
   isElement: _isElement.default
 });

package/cjs/DateInput/DateField.d.ts

@@ -0,0 +1,180 @@
+/// <reference types="react" />
+import { type Locale } from 'date-fns';
+export declare const patternMap: {
+    y: string;
+    M: string;
+    d: string;
+    H: string;
+    h: string;
+    m: string;
+    s: string;
+    a: string;
+};
+export declare class DateField extends Object {
+    format: string;
+    patternArray: {
+        pattern: string;
+        key: string;
+    }[];
+    year: number | null;
+    month: number | null;
+    day: number | null;
+    hour: number | null;
+    minute: number | null;
+    second: number | null;
+    meridian: 'AM' | 'PM' | null;
+    constructor(format: string, value?: Date | null);
+}
+export declare const useDateField: (format: string, localize: Locale['localize'], date?: Date | null) => {
+    dateField: {
+        year: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        month: number | null;
+        day: number | null;
+        hour: number | null;
+        minute: number | null;
+        second: number | null;
+        meridian: 'AM' | 'PM' | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    } | {
+        month: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        year: number | null;
+        day: number | null;
+        hour: number | null;
+        minute: number | null;
+        second: number | null;
+        meridian: 'AM' | 'PM' | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    } | {
+        day: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        year: number | null;
+        month: number | null;
+        hour: number | null;
+        minute: number | null;
+        second: number | null;
+        meridian: 'AM' | 'PM' | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    } | {
+        hour: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        year: number | null;
+        month: number | null;
+        day: number | null;
+        minute: number | null;
+        second: number | null;
+        meridian: 'AM' | 'PM' | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    } | {
+        minute: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        year: number | null;
+        month: number | null;
+        day: number | null;
+        hour: number | null;
+        second: number | null;
+        meridian: 'AM' | 'PM' | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    } | {
+        second: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        year: number | null;
+        month: number | null;
+        day: number | null;
+        hour: number | null;
+        minute: number | null;
+        meridian: 'AM' | 'PM' | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    } | {
+        meridian: any;
+        format: string;
+        patternArray: {
+            pattern: string;
+            key: string;
+        }[];
+        year: number | null;
+        month: number | null;
+        day: number | null;
+        hour: number | null;
+        minute: number | null;
+        second: number | null;
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+        should: Chai.Assertion;
+    };
+    dispatch: import("react").Dispatch<any>;
+    toDate: (type: string, value: number | null) => Date;
+    toDateString: () => string;
+};

package/cjs/DateInput/DateField.js

@@ -0,0 +1,151 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.useDateField = exports.DateField = exports.patternMap = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+var _wrapNativeSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/wrapNativeSuper"));
+var _react = require("react");
+var _utils = require("./utils");
+var patternMap = {
+  y: 'year',
+  M: 'month',
+  d: 'day',
+  H: 'hour',
+  h: 'hour',
+  m: 'minute',
+  s: 'second',
+  a: 'meridian'
+};
+exports.patternMap = patternMap;
+var DateField = /*#__PURE__*/function (_Object) {
+  (0, _inheritsLoose2.default)(DateField, _Object);
+  function DateField(format, value) {
+    var _this;
+    _this = _Object.call(this) || this;
+    _this.format = void 0;
+    _this.patternArray = [];
+    _this.year = null;
+    _this.month = null;
+    _this.day = null;
+    _this.hour = null;
+    _this.minute = null;
+    _this.second = null;
+    _this.meridian = null;
+    _this.format = format;
+    var formatArray = format.match(new RegExp('([y|d|M|H|h|m|s|a])+', 'ig')) || [];
+    _this.patternArray = formatArray.map(function (pattern) {
+      return {
+        pattern: pattern,
+        key: patternMap[pattern[0]]
+      };
+    });
+    if (value) {
+      _this.year = value.getFullYear();
+      _this.month = value.getMonth() + 1;
+      _this.day = value.getDate();
+      _this.hour = value.getHours();
+      _this.minute = value.getMinutes();
+      _this.second = value.getSeconds();
+      _this.meridian = value.getHours() > 12 ? 'PM' : 'AM';
+    }
+    return _this;
+  }
+  return DateField;
+}( /*#__PURE__*/(0, _wrapNativeSuper2.default)(Object));
+/**
+ * Pad a number with zeros to the left.
+ */
+exports.DateField = DateField;
+function padNumber(number, length) {
+  var numberString = String(number);
+  if (numberString.length >= length) {
+    return numberString;
+  }
+  var paddingCount = length - numberString.length;
+  for (var i = 0; i < paddingCount; i++) {
+    numberString = '0' + numberString;
+  }
+  return numberString;
+}
+var useDateField = function useDateField(format, localize, date) {
+  var _useReducer = (0, _react.useReducer)(function (state, action) {
+      switch (action.type) {
+        case 'setYear':
+          return (0, _extends2.default)({}, state, {
+            year: action.value
+          });
+        case 'setMonth':
+          return (0, _extends2.default)({}, state, {
+            month: action.value
+          });
+        case 'setDay':
+          return (0, _extends2.default)({}, state, {
+            day: action.value
+          });
+        case 'setHour':
+          return (0, _extends2.default)({}, state, {
+            hour: action.value
+          });
+        case 'setMinute':
+          return (0, _extends2.default)({}, state, {
+            minute: action.value
+          });
+        case 'setSecond':
+          return (0, _extends2.default)({}, state, {
+            second: action.value
+          });
+        case 'setMeridian':
+          return (0, _extends2.default)({}, state, {
+            meridian: action.value
+          });
+        default:
+          return state;
+      }
+    }, new DateField(format, date)),
+    dateField = _useReducer[0],
+    dispatch = _useReducer[1];
+  var toDateString = function toDateString() {
+    var str = format;
+    dateField.patternArray.forEach(function (item) {
+      var key = item.key,
+        pattern = item.pattern;
+      var value = dateField[key];
+      if (value !== null) {
+        if (pattern === 'MMM' && typeof value === 'number') {
+          value = localize === null || localize === void 0 ? void 0 : localize.month(value - 1, {
+            width: 'abbreviated'
+          });
+        } else if (pattern === 'MMMM' && typeof value === 'number') {
+          value = localize === null || localize === void 0 ? void 0 : localize.month(value - 1, {
+            width: 'wide'
+          });
+        } else if (pattern === 'aa' && typeof value === 'number') {
+          value = value === 0 ? 'AM' : 'PM';
+        } else if (pattern === 'hh' && typeof value === 'number') {
+          value = value === 0 ? 12 : value > 12 ? value - 12 : value;
+        }
+        if (typeof value === 'number') {
+          value = padNumber(value, pattern.length);
+        }
+        str = str.replace(pattern, value);
+      }
+    });
+    return str;
+  };
+  var toDate = function toDate(type, value) {
+    if (value === null) {
+      return new Date('');
+    }
+    return (0, _utils.modifyDate)(new Date(dateField.year, dateField.month ? dateField.month - 1 : 0, dateField.day, dateField.hour, dateField.minute, dateField.second), type, value);
+  };
+  return {
+    dateField: dateField,
+    dispatch: dispatch,
+    toDate: toDate,
+    toDateString: toDateString
+  };
+};
+exports.useDateField = useDateField;

package/cjs/DateInput/DateInput.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { InputProps } from '../Input';
+import { FormControlBaseProps } from '../@types/common';
+export interface DateInputProps extends Omit<InputProps, 'value' | 'onChange' | 'defaultValue'>, FormControlBaseProps<Date | null> {
+    /**
+     * Format of the date when rendered in the input.
+     * Format of the string is based on Unicode Technical Standard: https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table
+     * @default 'yyyy-MM-dd'
+     **/
+    format?: string;
+}
+/**
+ * The DateInput component lets users select a date with the keyboard.
+ * @version 5.58.0
+ * @see https://rsuitejs.com/components/date-input/
+ */
+declare const DateInput: React.ForwardRefExoticComponent<DateInputProps & React.RefAttributes<unknown>>;
+export default DateInput;