rsuite 5.67.0 → 5.68.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (73) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/Nav/styles/index.css +68 -0
  3. package/Nav/styles/index.less +37 -0
  4. package/Tabs/styles/index.css +68 -3
  5. package/Tabs/styles/index.less +0 -4
  6. package/cjs/DateInput/DateInput.js +18 -2
  7. package/cjs/DateInput/hooks/useDateInputState.d.ts +1 -0
  8. package/cjs/DateInput/hooks/useDateInputState.js +10 -9
  9. package/cjs/DateInput/hooks/useKeyboardInputEvent.js +5 -0
  10. package/cjs/DateRangeInput/DateRangeInput.js +24 -2
  11. package/cjs/Form/Form.js +4 -10
  12. package/cjs/Form/FormContext.d.ts +2 -4
  13. package/cjs/Form/hooks/useFormValidate.d.ts +2 -2
  14. package/cjs/Form/hooks/useFormValidate.js +99 -35
  15. package/cjs/FormControl/FormControl.js +6 -22
  16. package/cjs/Nav/AdaptiveNavItem.d.ts +1 -1
  17. package/cjs/Nav/Nav.d.ts +28 -9
  18. package/cjs/Nav/Nav.js +1 -1
  19. package/cjs/Nav/NavContext.d.ts +2 -2
  20. package/cjs/Nav/NavItem.d.ts +1 -1
  21. package/cjs/Navbar/NavbarItem.d.ts +1 -1
  22. package/cjs/Sidenav/Sidenav.d.ts +3 -3
  23. package/cjs/Tabs/Tabs.d.ts +20 -17
  24. package/cjs/Tabs/Tabs.js +5 -1
  25. package/cjs/internals/Overlay/OverlayTrigger.d.ts +2 -2
  26. package/cjs/internals/Overlay/OverlayTrigger.js +17 -8
  27. package/cjs/internals/utils/BrowserDetection.js +6 -0
  28. package/cjs/internals/utils/ReactChildren.d.ts +6 -0
  29. package/cjs/internals/utils/ReactChildren.js +1 -0
  30. package/dist/rsuite-no-reset-rtl.css +65 -3
  31. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  32. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  33. package/dist/rsuite-no-reset.css +65 -3
  34. package/dist/rsuite-no-reset.min.css +1 -1
  35. package/dist/rsuite-no-reset.min.css.map +1 -1
  36. package/dist/rsuite-rtl.css +65 -3
  37. package/dist/rsuite-rtl.min.css +1 -1
  38. package/dist/rsuite-rtl.min.css.map +1 -1
  39. package/dist/rsuite.css +65 -3
  40. package/dist/rsuite.js +12 -12
  41. package/dist/rsuite.min.css +1 -1
  42. package/dist/rsuite.min.css.map +1 -1
  43. package/dist/rsuite.min.js +1 -1
  44. package/dist/rsuite.min.js.map +1 -1
  45. package/esm/DateInput/DateInput.js +18 -2
  46. package/esm/DateInput/hooks/useDateInputState.d.ts +1 -0
  47. package/esm/DateInput/hooks/useDateInputState.js +11 -10
  48. package/esm/DateInput/hooks/useKeyboardInputEvent.js +5 -0
  49. package/esm/DateRangeInput/DateRangeInput.js +24 -2
  50. package/esm/Form/Form.js +4 -10
  51. package/esm/Form/FormContext.d.ts +2 -4
  52. package/esm/Form/hooks/useFormValidate.d.ts +2 -2
  53. package/esm/Form/hooks/useFormValidate.js +98 -34
  54. package/esm/FormControl/FormControl.js +6 -22
  55. package/esm/Nav/AdaptiveNavItem.d.ts +1 -1
  56. package/esm/Nav/Nav.d.ts +28 -9
  57. package/esm/Nav/Nav.js +1 -1
  58. package/esm/Nav/NavContext.d.ts +2 -2
  59. package/esm/Nav/NavItem.d.ts +1 -1
  60. package/esm/Navbar/NavbarItem.d.ts +1 -1
  61. package/esm/Sidenav/Sidenav.d.ts +3 -3
  62. package/esm/Tabs/Tabs.d.ts +20 -17
  63. package/esm/Tabs/Tabs.js +6 -1
  64. package/esm/internals/Overlay/OverlayTrigger.d.ts +2 -2
  65. package/esm/internals/Overlay/OverlayTrigger.js +18 -9
  66. package/esm/internals/utils/BrowserDetection.js +6 -0
  67. package/esm/internals/utils/ReactChildren.d.ts +6 -0
  68. package/esm/internals/utils/ReactChildren.js +1 -1
  69. package/package.json +1 -1
  70. package/styles/color-modes/dark.less +7 -0
  71. package/styles/color-modes/high-contrast.less +7 -0
  72. package/styles/color-modes/light.less +8 -0
  73. package/styles/plugins/palette.js +34 -6
@@ -1,12 +1,13 @@
1
1
  'use client';
2
2
  import _extends from "@babel/runtime/helpers/esm/extends";
3
3
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
- var _excluded = ["format", "value", "defaultValue", "placeholder", "onChange", "onKeyDown", "onBlur", "onFocus"];
4
+ var _excluded = ["format", "value", "defaultValue", "placeholder", "onChange", "onKeyDown", "onBlur", "onFocus", "onPaste"];
5
5
  import React, { useRef, useMemo } from 'react';
6
6
  import PropTypes from 'prop-types';
7
7
  import Input from "../Input/index.js";
8
8
  import { useCustom, useControlled, useEventCallback } from "../internals/hooks/index.js";
9
9
  import { mergeRefs } from "../internals/utils/index.js";
10
+ import { isValid } from "../internals/utils/date/index.js";
10
11
  import { getInputSelectedState, validateDateTime, useInputSelection } from "./utils.js";
11
12
  import useDateInputState from "./hooks/useDateInputState.js";
12
13
  import useKeyboardInputEvent from "./hooks/useKeyboardInputEvent.js";
@@ -28,13 +29,15 @@ var DateInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
28
29
  onKeyDown = props.onKeyDown,
29
30
  onBlur = props.onBlur,
30
31
  onFocus = props.onFocus,
32
+ onPaste = props.onPaste,
31
33
  rest = _objectWithoutPropertiesLoose(props, _excluded);
32
34
  var inputRef = useRef();
33
35
  var _useSelectedState = useSelectedState(),
34
36
  selectedState = _useSelectedState.selectedState,
35
37
  setSelectedState = _useSelectedState.setSelectedState;
36
38
  var _useCustom = useCustom('Calendar'),
37
- locale = _useCustom.locale;
39
+ locale = _useCustom.locale,
40
+ parseDate = _useCustom.parseDate;
38
41
  var dateLocale = locale.dateLocale;
39
42
  var _useControlled = useControlled(valueProp, defaultValue),
40
43
  value = _useControlled[0],
@@ -49,6 +52,7 @@ var DateInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
49
52
  dateField = _useDateInputState.dateField,
50
53
  setDateOffset = _useDateInputState.setDateOffset,
51
54
  setDateField = _useDateInputState.setDateField,
55
+ setNewDate = _useDateInputState.setNewDate,
52
56
  getDateField = _useDateInputState.getDateField,
53
57
  toDateString = _useDateInputState.toDateString,
54
58
  isEmptyValue = _useDateInputState.isEmptyValue;
@@ -162,6 +166,17 @@ var DateInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
162
166
  reset();
163
167
  }
164
168
  });
169
+ var handlePaste = useEventCallback(function (event) {
170
+ var _event$clipboardData;
171
+ event.preventDefault();
172
+ var pasteText = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.getData('text');
173
+ var nextDate = parseDate(pasteText, formatStr);
174
+ if (isValid(nextDate)) {
175
+ handleChange(nextDate, event);
176
+ setNewDate(nextDate);
177
+ }
178
+ onPaste === null || onPaste === void 0 ? void 0 : onPaste(event);
179
+ });
165
180
  var onKeyboardInput = useKeyboardInputEvent({
166
181
  onSegmentChange: onSegmentChange,
167
182
  onSegmentValueChange: onSegmentValueChange,
@@ -189,6 +204,7 @@ var DateInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
189
204
  ref: mergeRefs(inputRef, ref),
190
205
  onKeyDown: onKeyboardInput,
191
206
  onClick: handleClick,
207
+ onPaste: handlePaste,
192
208
  value: renderedValue,
193
209
  placeholder: placeholder || formatStr
194
210
  }, focusEventProps, rest));
@@ -131,6 +131,7 @@ export declare function useDateInputState({ formatStr, locale, date, isControlle
131
131
  };
132
132
  setDateOffset: (pattern: string, offset: number, callback?: ((newDate: Date | null) => void) | undefined) => void;
133
133
  setDateField: (pattern: string, value: number | null, callback?: ((newDate: Date | null) => void) | undefined) => void;
134
+ setNewDate: (value: Date | null) => void;
134
135
  getDateField: (pattern: string) => {
135
136
  name: any;
136
137
  value: any;
@@ -1,5 +1,5 @@
1
1
  'use client';
2
- import { useEffect } from 'react';
2
+ import { useCallback, useEffect } from 'react';
3
3
  import startCase from 'lodash/startCase';
4
4
  import { addDays, addMonths, addYears, addHours, addMinutes, addSeconds, format, isLastDayOfMonth, lastDayOfMonth, isValid } from "../../internals/utils/date/index.js";
5
5
  import { useDateField, patternMap } from "../DateField.js";
@@ -95,25 +95,26 @@ export function useDateInputState(_ref) {
95
95
  // if date is not valid, return uncontrolled date string
96
96
  return toDateString();
97
97
  };
98
+ var setNewDate = useCallback(function (value) {
99
+ dispatch({
100
+ type: 'setNewDate',
101
+ value: value
102
+ });
103
+ }, [dispatch]);
98
104
  useEffect(function () {
99
105
  if (isControlledDate) {
100
106
  if (date && isValid(date)) {
101
- dispatch({
102
- type: 'setNewDate',
103
- value: date
104
- });
107
+ setNewDate(date);
105
108
  } else if (date === null) {
106
- dispatch({
107
- type: 'setNewDate',
108
- value: null
109
- });
109
+ setNewDate(null);
110
110
  }
111
111
  }
112
- }, [date, dispatch, isControlledDate]);
112
+ }, [date, dispatch, isControlledDate, setNewDate]);
113
113
  return {
114
114
  dateField: dateField,
115
115
  setDateOffset: setDateOffset,
116
116
  setDateField: setDateField,
117
+ setNewDate: setNewDate,
117
118
  getDateField: getDateField,
118
119
  toDateString: isControlledDate ? toControlledDateString : toDateString,
119
120
  isEmptyValue: isEmptyValue
@@ -28,6 +28,11 @@ export function useKeyboardInputEvent(_ref) {
28
28
  onSegmentValueChangeWithNumericKeys === null || onSegmentValueChangeWithNumericKeys === void 0 ? void 0 : onSegmentValueChangeWithNumericKeys(event);
29
29
  event.preventDefault();
30
30
  case (_key$match2 = key.match(/[a-z]/)) === null || _key$match2 === void 0 ? void 0 : _key$match2[0]:
31
+ // Determine whether the Ctrl or Command key is pressed, does not affect user copy and paste
32
+ if (event.ctrlKey || event.metaKey) {
33
+ break;
34
+ }
35
+
31
36
  // Prevent letters from being entered
32
37
  event.preventDefault();
33
38
  break;
@@ -1,10 +1,11 @@
1
1
  'use client';
2
2
  import _extends from "@babel/runtime/helpers/esm/extends";
3
3
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
- var _excluded = ["className", "classPrefix", "character", "format", "value", "defaultValue", "placeholder", "onChange", "onKeyDown", "onBlur", "onFocus"];
4
+ var _excluded = ["className", "classPrefix", "character", "format", "value", "defaultValue", "placeholder", "onChange", "onKeyDown", "onBlur", "onFocus", "onPaste"];
5
5
  import React, { useState, useRef, useMemo } from 'react';
6
6
  import PropTypes from 'prop-types';
7
7
  import Input from "../Input/index.js";
8
+ import { isValid } from "../internals/utils/date/index.js";
8
9
  import { useClassNames, useCustom, useControlled, useEventCallback } from "../internals/hooks/index.js";
9
10
  import { mergeRefs } from "../internals/utils/index.js";
10
11
  import { validateDateTime, useDateInputState, useInputSelection, useKeyboardInputEvent, useIsFocused, useSelectedState, useFieldCursor } from "../DateInput/index.js";
@@ -30,6 +31,7 @@ var DateRangeInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
30
31
  onKeyDown = props.onKeyDown,
31
32
  onBlur = props.onBlur,
32
33
  onFocus = props.onFocus,
34
+ onPaste = props.onPaste,
33
35
  rest = _objectWithoutPropertiesLoose(props, _excluded);
34
36
  var _useClassNames = useClassNames(classPrefix),
35
37
  withClassPrefix = _useClassNames.withClassPrefix,
@@ -40,7 +42,8 @@ var DateRangeInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
40
42
  selectedState = _useSelectedState.selectedState,
41
43
  setSelectedState = _useSelectedState.setSelectedState;
42
44
  var _useCustom = useCustom('Calendar'),
43
- locale = _useCustom.locale;
45
+ locale = _useCustom.locale,
46
+ parseDate = _useCustom.parseDate;
44
47
  var rangeFormatStr = "" + formatStr + character + formatStr;
45
48
  var dateLocale = locale.dateLocale;
46
49
  var _useControlled = useControlled(valueProp, defaultValue),
@@ -211,6 +214,24 @@ var DateRangeInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
211
214
  reset();
212
215
  }
213
216
  });
217
+ var handlePaste = useEventCallback(function (event) {
218
+ var _event$clipboardData;
219
+ event.preventDefault();
220
+ var pasteText = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.getData('text');
221
+ var _ref = pasteText.split(character).map(function (date) {
222
+ return parseDate(date, formatStr);
223
+ }),
224
+ start = _ref[0],
225
+ end = _ref[1];
226
+ if (isValid(start) && isValid(end)) {
227
+ var nextValue = [start, end];
228
+ onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
229
+ setValue(nextValue);
230
+ startDateState.setNewDate(start);
231
+ endDateState.setNewDate(end);
232
+ }
233
+ onPaste === null || onPaste === void 0 ? void 0 : onPaste(event);
234
+ });
214
235
  var onKeyboardInput = useKeyboardInputEvent({
215
236
  onSegmentChange: onSegmentChange,
216
237
  onSegmentValueChange: onSegmentValueChange,
@@ -227,6 +248,7 @@ var DateRangeInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
227
248
  ref: mergeRefs(inputRef, ref),
228
249
  onKeyDown: onKeyboardInput,
229
250
  onClick: handleClick,
251
+ onPaste: handlePaste,
230
252
  value: renderedValue,
231
253
  placeholder: placeholder || rangeFormatStr
232
254
  }, focusEventProps, rest));
package/esm/Form/Form.js CHANGED
@@ -74,12 +74,13 @@ var Form = /*#__PURE__*/React.forwardRef(function (props, ref) {
74
74
  };
75
75
  var _useFormValidate = useFormValidate(controlledFormError, formValidateProps),
76
76
  formError = _useFormValidate.formError,
77
- setFieldError = _useFormValidate.setFieldError,
78
77
  onRemoveError = _useFormValidate.onRemoveError,
79
78
  check = _useFormValidate.check,
80
79
  checkAsync = _useFormValidate.checkAsync,
81
80
  checkForField = _useFormValidate.checkForField,
81
+ checkFieldForNextValue = _useFormValidate.checkFieldForNextValue,
82
82
  checkForFieldAsync = _useFormValidate.checkForFieldAsync,
83
+ checkFieldAsyncForNextValue = _useFormValidate.checkFieldAsyncForNextValue,
83
84
  cleanErrors = _useFormValidate.cleanErrors,
84
85
  resetErrors = _useFormValidate.resetErrors,
85
86
  cleanErrorForField = _useFormValidate.cleanErrorForField;
@@ -145,12 +146,6 @@ var Form = /*#__PURE__*/React.forwardRef(function (props, ref) {
145
146
  var removeFieldError = useEventCallback(function (name) {
146
147
  onRemoveError(name);
147
148
  });
148
- var onFieldError = useEventCallback(function (name, checkResult) {
149
- setFieldError(name, checkResult);
150
- });
151
- var onFieldSuccess = useEventCallback(function (name) {
152
- removeFieldError(name);
153
- });
154
149
  var onFieldChange = useEventCallback(function (name, value, event) {
155
150
  var nextFormValue = setFieldValue(name, value);
156
151
  onChange === null || onChange === void 0 ? void 0 : onChange(nextFormValue, event);
@@ -164,13 +159,12 @@ var Form = /*#__PURE__*/React.forwardRef(function (props, ref) {
164
159
  formError: formError,
165
160
  nestedField: nestedField,
166
161
  pushFieldRule: pushFieldRule,
167
- getCombinedModel: getCombinedModel,
168
162
  removeFieldValue: removeFieldValue,
169
163
  removeFieldError: removeFieldError,
170
164
  removeFieldRule: removeFieldRule,
171
- onFieldSuccess: onFieldSuccess,
172
165
  onFieldChange: onFieldChange,
173
- onFieldError: onFieldError
166
+ checkFieldForNextValue: checkFieldForNextValue,
167
+ checkFieldAsyncForNextValue: checkFieldAsyncForNextValue
174
168
  };
175
169
  return /*#__PURE__*/React.createElement("form", _extends({}, rest, {
176
170
  ref: formRef,
@@ -1,6 +1,5 @@
1
1
  import React from 'react';
2
2
  import { TypeAttributes } from '../internals/types';
3
- import type { Schema, CheckResult } from 'schema-typed';
4
3
  import type { FieldRuleType } from './hooks/useSchemaModel';
5
4
  type RecordAny = Record<string, any>;
6
5
  interface TrulyFormContextValue<T = RecordAny, M = any, E = {
@@ -8,14 +7,13 @@ interface TrulyFormContextValue<T = RecordAny, M = any, E = {
8
7
  }> {
9
8
  formError: E;
10
9
  nestedField: boolean;
11
- getCombinedModel: () => Schema;
12
10
  removeFieldValue: (name: string) => void;
13
11
  removeFieldError: (name: string) => void;
14
12
  removeFieldRule: (name: string) => void;
15
13
  pushFieldRule: (name: string, fieldRule: FieldRuleType) => void;
16
- onFieldError: (name: string, fieldError: string | CheckResult) => void;
17
14
  onFieldChange: (name: string, value: any, event: React.SyntheticEvent) => void;
18
- onFieldSuccess: (name: string) => void;
15
+ checkFieldForNextValue: (name: string, nextValue: Record<string, unknown>, callback?: (checkResult: Record<string, unknown>) => void) => boolean;
16
+ checkFieldAsyncForNextValue: (name: string, nextValue: Record<string, unknown>) => Promise<Record<string, unknown>>;
19
17
  }
20
18
  type ExternalPropsContextValue = {
21
19
  checkTrigger?: TypeAttributes.CheckTrigger;
@@ -1,5 +1,4 @@
1
1
  /// <reference types="lodash" />
2
- import type { CheckResult } from 'schema-typed';
3
2
  export interface FormErrorProps {
4
3
  formValue: any;
5
4
  getCombinedModel: () => any;
@@ -11,11 +10,12 @@ export default function useFormValidate(formError: any, props: FormErrorProps):
11
10
  formError: any;
12
11
  check: (...args: any[]) => any;
13
12
  checkForField: (...args: any[]) => any;
13
+ checkFieldForNextValue: (...args: any[]) => any;
14
14
  checkAsync: (...args: any[]) => any;
15
15
  checkForFieldAsync: (...args: any[]) => any;
16
+ checkFieldAsyncForNextValue: (...args: any[]) => any;
16
17
  cleanErrors: (...args: any[]) => any;
17
18
  resetErrors: (...args: any[]) => any;
18
19
  cleanErrorForField: (...args: any[]) => any;
19
- setFieldError: (fieldName: string, checkResult: string | CheckResult) => any;
20
20
  onRemoveError: (name: string) => import("lodash").Omit<any, string>;
21
21
  };
@@ -1,5 +1,8 @@
1
1
  'use client';
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2
3
  import _extends from "@babel/runtime/helpers/esm/extends";
4
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
5
+ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
3
6
  import { useRef, useCallback } from 'react';
4
7
  import omit from 'lodash/omit';
5
8
  import set from 'lodash/set';
@@ -14,6 +17,9 @@ export default function useFormValidate(formError, props) {
14
17
  var _useControlled = useControlled(formError, {}),
15
18
  realFormError = _useControlled[0],
16
19
  setFormError = _useControlled[1];
20
+ var checkOptions = {
21
+ nestedObject: nestedField
22
+ };
17
23
  var realFormErrorRef = useRef(realFormError);
18
24
  realFormErrorRef.current = realFormError;
19
25
 
@@ -27,7 +33,7 @@ export default function useFormValidate(formError, props) {
27
33
  var errorCount = 0;
28
34
  var model = getCombinedModel();
29
35
  Object.keys(model.getSchemaSpec()).forEach(function (key) {
30
- var checkResult = model.checkForField(key, formValue || {});
36
+ var checkResult = model.checkForField(key, formValue || {}, checkOptions);
31
37
  if (checkResult.hasError === true) {
32
38
  errorCount += 1;
33
39
  formError[key] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult;
@@ -42,24 +48,56 @@ export default function useFormValidate(formError, props) {
42
48
  }
43
49
  return true;
44
50
  });
45
-
51
+ var checkFieldForNextValue = useEventCallback(function (fieldName, nextValue, callback) {
52
+ var model = getCombinedModel();
53
+ var resultOfCurrentField = model.checkForField(fieldName, nextValue, checkOptions);
54
+ var nextFormError = _extends({}, formError);
55
+ /**
56
+ * when using proxy of schema-typed, we need to use getCheckResult to get all errors,
57
+ * but if nestedField is used, it is impossible to distinguish whether the nested object has an error here,
58
+ * so nestedField does not support proxy here
59
+ */
60
+ if (nestedField) {
61
+ nextFormError = set(nextFormError, nameToPath(fieldName), resultOfCurrentField);
62
+ setFormError(nextFormError);
63
+ onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
64
+ callback === null || callback === void 0 ? void 0 : callback(resultOfCurrentField);
65
+ if (resultOfCurrentField.hasError) {
66
+ onError === null || onError === void 0 ? void 0 : onError(nextFormError);
67
+ }
68
+ return !resultOfCurrentField.hasError;
69
+ } else {
70
+ var allResults = model.getCheckResult();
71
+ var hasError = false;
72
+ Object.keys(allResults).forEach(function (key) {
73
+ var currentResult = allResults[key];
74
+ if (currentResult.hasError) {
75
+ nextFormError[key] = currentResult.errorMessage || currentResult;
76
+ hasError = true;
77
+ } else {
78
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
79
+ var _nextFormError = nextFormError,
80
+ _ = _nextFormError[key],
81
+ rest = _objectWithoutPropertiesLoose(_nextFormError, [key].map(_toPropertyKey));
82
+ nextFormError = rest;
83
+ }
84
+ });
85
+ setFormError(nextFormError);
86
+ onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
87
+ callback === null || callback === void 0 ? void 0 : callback(resultOfCurrentField);
88
+ if (hasError) {
89
+ onError === null || onError === void 0 ? void 0 : onError(nextFormError);
90
+ }
91
+ return !hasError;
92
+ }
93
+ });
46
94
  /**
47
95
  * Check the data field
48
96
  * @param fieldName
49
97
  * @param callback
50
98
  */
51
99
  var checkForField = useEventCallback(function (fieldName, callback) {
52
- var _extends2;
53
- var model = getCombinedModel();
54
- var checkResult = model.checkForField(fieldName, formValue || {});
55
- var nextFormError = _extends({}, formError, (_extends2 = {}, _extends2[fieldName] = (checkResult === null || checkResult === void 0 ? void 0 : checkResult.errorMessage) || checkResult, _extends2));
56
- setFormError(nextFormError);
57
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
58
- callback === null || callback === void 0 ? void 0 : callback(checkResult);
59
- if (checkResult.hasError) {
60
- onError === null || onError === void 0 ? void 0 : onError(nextFormError);
61
- }
62
- return !checkResult.hasError;
100
+ return checkFieldForNextValue(fieldName, formValue || {}, callback);
63
101
  });
64
102
 
65
103
  /**
@@ -71,7 +109,7 @@ export default function useFormValidate(formError, props) {
71
109
  var model = getCombinedModel();
72
110
  Object.keys(model.getSchemaSpec()).forEach(function (key) {
73
111
  keys.push(key);
74
- promises.push(model.checkForFieldAsync(key, formValue || {}));
112
+ promises.push(model.checkForFieldAsync(key, formValue || {}, checkOptions));
75
113
  });
76
114
  return Promise.all(promises).then(function (values) {
77
115
  var formError = {};
@@ -93,23 +131,56 @@ export default function useFormValidate(formError, props) {
93
131
  };
94
132
  });
95
133
  });
134
+ var checkFieldAsyncForNextValue = useEventCallback(function (fieldName, nextValue) {
135
+ var model = getCombinedModel();
136
+ return model.checkForFieldAsync(fieldName, nextValue, checkOptions).then(function (resultOfCurrentField) {
137
+ var nextFormError = _extends({}, formError);
138
+ /**
139
+ * when using proxy of schema-typed, we need to use getCheckResult to get all errors,
140
+ * but if nestedField is used, it is impossible to distinguish whether the nested object has an error here,
141
+ * so nestedField does not support proxy here
142
+ */
143
+
144
+ if (nestedField) {
145
+ nextFormError = set(nextFormError, nameToPath(fieldName), resultOfCurrentField);
146
+ onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
147
+ setFormError(nextFormError);
148
+ if (resultOfCurrentField.hasError) {
149
+ onError === null || onError === void 0 ? void 0 : onError(nextFormError);
150
+ }
151
+ return resultOfCurrentField;
152
+ } else {
153
+ var allResults = model.getCheckResult();
154
+ var hasError = false;
155
+ Object.keys(allResults).forEach(function (key) {
156
+ var currentResult = allResults[key];
157
+ if (currentResult.hasError) {
158
+ nextFormError[key] = currentResult.errorMessage || currentResult;
159
+ hasError = true;
160
+ } else {
161
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
162
+ var _nextFormError2 = nextFormError,
163
+ _ = _nextFormError2[key],
164
+ rest = _objectWithoutPropertiesLoose(_nextFormError2, [key].map(_toPropertyKey));
165
+ nextFormError = rest;
166
+ }
167
+ });
168
+ setFormError(nextFormError);
169
+ onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
170
+ if (hasError) {
171
+ onError === null || onError === void 0 ? void 0 : onError(nextFormError);
172
+ }
173
+ return resultOfCurrentField;
174
+ }
175
+ });
176
+ });
96
177
 
97
178
  /**
98
179
  * Asynchronously check form fields and return Promise
99
180
  * @param fieldName
100
181
  */
101
182
  var checkForFieldAsync = useEventCallback(function (fieldName) {
102
- var model = getCombinedModel();
103
- return model.checkForFieldAsync(fieldName, formValue || {}).then(function (checkResult) {
104
- var _extends3;
105
- var nextFormError = _extends({}, formError, (_extends3 = {}, _extends3[fieldName] = checkResult.errorMessage, _extends3));
106
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
107
- setFormError(nextFormError);
108
- if (checkResult.hasError) {
109
- onError === null || onError === void 0 ? void 0 : onError(nextFormError);
110
- }
111
- return checkResult;
112
- });
183
+ return checkFieldAsyncForNextValue(fieldName, formValue || {});
113
184
  });
114
185
  var onRemoveError = useCallback(function (name) {
115
186
  /**
@@ -122,14 +193,6 @@ export default function useFormValidate(formError, props) {
122
193
  onCheck === null || onCheck === void 0 ? void 0 : onCheck(formError);
123
194
  return formError;
124
195
  }, [nestedField, onCheck, setFormError]);
125
- var setFieldError = useCallback(function (fieldName, checkResult) {
126
- var _extends4;
127
- var nextFormError = nestedField ? set(_extends({}, formError), nameToPath(fieldName), checkResult) : _extends({}, formError, (_extends4 = {}, _extends4[fieldName] = checkResult, _extends4));
128
- setFormError(nextFormError);
129
- onError === null || onError === void 0 ? void 0 : onError(nextFormError);
130
- onCheck === null || onCheck === void 0 ? void 0 : onCheck(nextFormError);
131
- return nextFormError;
132
- }, [formError, nestedField, onCheck, onError, setFormError]);
133
196
  var cleanErrors = useEventCallback(function () {
134
197
  setFormError({});
135
198
  });
@@ -146,12 +209,13 @@ export default function useFormValidate(formError, props) {
146
209
  formError: realFormError,
147
210
  check: check,
148
211
  checkForField: checkForField,
212
+ checkFieldForNextValue: checkFieldForNextValue,
149
213
  checkAsync: checkAsync,
150
214
  checkForFieldAsync: checkForFieldAsync,
215
+ checkFieldAsyncForNextValue: checkFieldAsyncForNextValue,
151
216
  cleanErrors: cleanErrors,
152
217
  resetErrors: resetErrors,
153
218
  cleanErrorForField: cleanErrorForField,
154
- setFieldError: setFieldError,
155
219
  onRemoveError: onRemoveError
156
220
  };
157
221
  }
@@ -37,10 +37,9 @@ var FormControl = /*#__PURE__*/React.forwardRef(function (props, ref) {
37
37
  removeFieldValue = _useContext.removeFieldValue,
38
38
  removeFieldError = _useContext.removeFieldError,
39
39
  onFieldChange = _useContext.onFieldChange,
40
- onFieldError = _useContext.onFieldError,
41
- onFieldSuccess = _useContext.onFieldSuccess,
42
- getCombinedModel = _useContext.getCombinedModel,
43
- contextCheckTrigger = _useContext.checkTrigger;
40
+ contextCheckTrigger = _useContext.checkTrigger,
41
+ checkFieldForNextValue = _useContext.checkFieldForNextValue,
42
+ checkFieldAsyncForNextValue = _useContext.checkFieldAsyncForNextValue;
44
43
  var _props$as = props.as,
45
44
  Component = _props$as === void 0 ? 'div' : _props$as,
46
45
  _props$accepter = props.accepter,
@@ -115,27 +114,12 @@ var FormControl = /*#__PURE__*/React.forwardRef(function (props, ref) {
115
114
  onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
116
115
  });
117
116
  var handleFieldCheck = useEventCallback(function (value) {
118
- var callbackEvents = function callbackEvents(checkResult) {
119
- if (checkResult.hasError) {
120
- var _errorMessage = checkResult.errorMessage;
121
- var _fieldError = nestedField ? checkResult : _errorMessage || checkResult;
122
- onFieldError === null || onFieldError === void 0 ? void 0 : onFieldError(name, _fieldError);
123
- } else {
124
- onFieldSuccess === null || onFieldSuccess === void 0 ? void 0 : onFieldSuccess(name);
125
- }
126
- return checkResult;
127
- };
128
117
  var nextFormValue = setFieldValue(name, value);
129
- var model = getCombinedModel();
130
- var checkOptions = {
131
- nestedObject: nestedField
132
- };
133
118
  if (checkAsync) {
134
- return model === null || model === void 0 ? void 0 : model.checkForFieldAsync(name, nextFormValue, checkOptions).then(function (checkResult) {
135
- return callbackEvents(checkResult);
136
- });
119
+ checkFieldAsyncForNextValue(name, nextFormValue);
120
+ } else {
121
+ checkFieldForNextValue(name, nextFormValue);
137
122
  }
138
- return Promise.resolve(callbackEvents(model === null || model === void 0 ? void 0 : model.checkForField(name, nextFormValue, checkOptions)));
139
123
  });
140
124
  var fieldHasError = Boolean(fieldError);
141
125
 
@@ -5,5 +5,5 @@ import { NavItemProps } from './NavItem';
5
5
  * When used as direct child of <Nav>, render the NavItem
6
6
  * When used within a <Nav.Menu>, render the NavDropdownItem
7
7
  */
8
- declare const AdaptiveNavItem: React.ForwardRefExoticComponent<NavItemProps<string> & React.RefAttributes<any>>;
8
+ declare const AdaptiveNavItem: React.ForwardRefExoticComponent<NavItemProps<string | number> & React.RefAttributes<any>>;
9
9
  export default AdaptiveNavItem;
package/esm/Nav/Nav.d.ts CHANGED
@@ -4,21 +4,40 @@ import { WithAsProps, RsRefForwardingComponent } from '../internals/types';
4
4
  import NavDropdown from './NavDropdown';
5
5
  import NavMenu from './NavMenu';
6
6
  export interface NavProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
7
- /** sets appearance */
8
- appearance?: 'default' | 'subtle' | 'tabs';
9
- /** Reverse Direction of tabs/subtle */
7
+ /**
8
+ * The appearance style of the Nav component.
9
+ *
10
+ * @default 'default'
11
+ * @version 'pills' is supported in version 5.68.0
12
+ */
13
+ appearance?: 'default' | 'subtle' | 'tabs' | 'pills';
14
+ /**
15
+ * Whether the Nav component is reversed.
16
+ */
10
17
  reversed?: boolean;
11
- /** Justified navigation */
18
+ /**
19
+ * Whether the Nav component is justified.
20
+ */
12
21
  justified?: boolean;
13
- /** Vertical navigation */
22
+ /**
23
+ * Whether the Nav component is vertical.
24
+ */
14
25
  vertical?: boolean;
15
- /** appears on the right. */
26
+ /**
27
+ * Whether the Nav component is pulled to the right.
28
+ */
16
29
  pullRight?: boolean;
17
- /** Active key, corresponding to eventkey in <Nav.item>. */
30
+ /**
31
+ * The active key of the Nav component.
32
+ */
18
33
  activeKey?: T;
19
- /** Default active key, corresponding to eventkey in <Nav.item>. */
34
+ /**
35
+ * The default active key of the Nav component.
36
+ */
20
37
  defaultActiveKey?: T;
21
- /** Callback function triggered after selection */
38
+ /**
39
+ * Event handler for selecting a Nav item.
40
+ */
22
41
  onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
23
42
  }
24
43
  interface NavComponent extends RsRefForwardingComponent<'div', NavProps> {
package/esm/Nav/Nav.js CHANGED
@@ -117,7 +117,7 @@ Nav.propTypes = {
117
117
  classPrefix: PropTypes.string,
118
118
  className: PropTypes.string,
119
119
  children: PropTypes.node,
120
- appearance: oneOf(['default', 'subtle', 'tabs']),
120
+ appearance: oneOf(['default', 'subtle', 'tabs', 'pills']),
121
121
  // Reverse Direction of tabs/subtle
122
122
  reversed: PropTypes.bool,
123
123
  justified: PropTypes.bool,
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  export interface NavContextProps {
3
- activeKey: string | undefined;
4
- onSelect?: (eventKey: string | undefined, event: React.SyntheticEvent) => void;
3
+ activeKey: string | number | undefined;
4
+ onSelect?: (eventKey: string | number | undefined, event: React.SyntheticEvent) => void;
5
5
  }
6
6
  declare const NavContext: React.Context<NavContextProps | null>;
7
7
  export default NavContext;
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { RsRefForwardingComponent, WithAsProps } from '../internals/types';
3
3
  import { IconProps } from '@rsuite/icons/lib/Icon';
4
- export interface NavItemProps<T = string> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
4
+ export interface NavItemProps<T = string | number> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
5
5
  /** Activation status */
6
6
  active?: boolean;
7
7
  /** Disabled status */
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { IconProps } from '@rsuite/icons/lib/Icon';
3
3
  import { RsRefForwardingComponent, WithAsProps } from '../internals/types';
4
- export interface NavbarItemProps<T = string> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
4
+ export interface NavbarItemProps<T = string | number> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
5
5
  /** Activation status */
6
6
  active?: boolean;
7
7
  /** Disabled status */
@@ -3,7 +3,7 @@ import SidenavBody from './SidenavBody';
3
3
  import SidenavHeader from './SidenavHeader';
4
4
  import SidenavToggle from './SidenavToggle';
5
5
  import { WithAsProps, RsRefForwardingComponent } from '../internals/types';
6
- export interface SidenavProps<T = string> extends WithAsProps {
6
+ export interface SidenavProps<T = string | number> extends WithAsProps {
7
7
  /** Whether to expand the Sidenav */
8
8
  expanded?: boolean;
9
9
  /** Menu style */
@@ -25,8 +25,8 @@ export interface SidenavProps<T = string> extends WithAsProps {
25
25
  */
26
26
  onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
27
27
  }
28
- export declare const SidenavContext: React.Context<SidenavContextType<string> | null>;
29
- export interface SidenavContextType<T = string> {
28
+ export declare const SidenavContext: React.Context<SidenavContextType<string | number> | null>;
29
+ export interface SidenavContextType<T = string | number> {
30
30
  openKeys: T[];
31
31
  /**
32
32
  * @deprecated Use activeKey from NavContext instead