@rainbow-oh/yee-c 0.4.5 → 0.5.1

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 (119) hide show
  1. package/dist/cjs/Descriptions/descriptions.js +8 -1
  2. package/dist/cjs/Descriptions/interface.d.ts +1 -1
  3. package/dist/cjs/Dialog/demo/basic.js +1 -1
  4. package/dist/cjs/Dialog/dialog.js +1 -1
  5. package/dist/cjs/Field/demo/validation.js +23 -3
  6. package/dist/cjs/Field/field.js +1 -1
  7. package/dist/cjs/Form/Field.js +1 -4
  8. package/dist/cjs/Form/Form.js +1 -1
  9. package/dist/cjs/Form/Group.js +36 -14
  10. package/dist/cjs/Form/List.js +23 -3
  11. package/dist/cjs/Form/demo/async-validate.d.ts +3 -0
  12. package/dist/cjs/Form/demo/async-validate.js +108 -0
  13. package/dist/cjs/Form/demo/virtual.js +1 -1
  14. package/dist/cjs/Form/form-store.d.ts +4 -4
  15. package/dist/cjs/Form/form-store.js +55 -25
  16. package/dist/cjs/Form/interface.d.ts +10 -7
  17. package/dist/cjs/Form/utils/validate.d.ts +23 -2
  18. package/dist/cjs/Form/utils/validate.js +59 -10
  19. package/dist/cjs/Select/demo/basic.js +1 -1
  20. package/dist/cjs/Select/demo/size.js +2 -0
  21. package/dist/cjs/Select/demo/virtual.d.ts +3 -0
  22. package/dist/cjs/Select/demo/virtual.js +55 -0
  23. package/dist/cjs/Select/hooks/useSelectKeyboard.d.ts +7 -1
  24. package/dist/cjs/Select/hooks/useSelectKeyboard.js +16 -6
  25. package/dist/cjs/Select/interface.d.ts +46 -1
  26. package/dist/cjs/Select/option.js +3 -2
  27. package/dist/cjs/Select/options.js +115 -15
  28. package/dist/cjs/Select/select.js +20 -4
  29. package/dist/cjs/Select/style/index.less +17 -0
  30. package/dist/cjs/Selector/style/index.less +8 -0
  31. package/dist/cjs/Table/style/index.less +19 -0
  32. package/dist/cjs/hooks/index.d.ts +2 -1
  33. package/dist/cjs/hooks/index.js +3 -1
  34. package/dist/cjs/hooks/useVirtualList.d.ts +71 -0
  35. package/dist/cjs/hooks/useVirtualList.js +117 -0
  36. package/dist/cjs/style/size.css +4 -0
  37. package/dist/cjs/style/themes.css +1 -1
  38. package/dist/cjs/style/variables.css +5 -1
  39. package/dist/cjs/version.d.ts +1 -1
  40. package/dist/cjs/version.js +1 -1
  41. package/dist/esm/Descriptions/descriptions.js +2 -1
  42. package/dist/esm/Descriptions/interface.d.ts +1 -1
  43. package/dist/esm/Dialog/demo/basic.js +1 -1
  44. package/dist/esm/Dialog/dialog.js +1 -1
  45. package/dist/esm/Field/demo/validation.js +30 -9
  46. package/dist/esm/Field/field.js +2 -1
  47. package/dist/esm/Form/Field.js +3 -4
  48. package/dist/esm/Form/Form.js +1 -1
  49. package/dist/esm/Form/Group.js +142 -53
  50. package/dist/esm/Form/List.js +61 -42
  51. package/dist/esm/Form/demo/async-validate.d.ts +3 -0
  52. package/dist/esm/Form/demo/async-validate.js +95 -0
  53. package/dist/esm/Form/demo/virtual.js +1 -1
  54. package/dist/esm/Form/form-store.d.ts +4 -4
  55. package/dist/esm/Form/form-store.js +187 -93
  56. package/dist/esm/Form/interface.d.ts +10 -7
  57. package/dist/esm/Form/utils/validate.d.ts +23 -2
  58. package/dist/esm/Form/utils/validate.js +122 -17
  59. package/dist/esm/Select/demo/basic.js +1 -1
  60. package/dist/esm/Select/demo/size.js +2 -0
  61. package/dist/esm/Select/demo/virtual.d.ts +3 -0
  62. package/dist/esm/Select/demo/virtual.js +38 -0
  63. package/dist/esm/Select/hooks/useSelectKeyboard.d.ts +7 -1
  64. package/dist/esm/Select/hooks/useSelectKeyboard.js +25 -9
  65. package/dist/esm/Select/interface.d.ts +46 -1
  66. package/dist/esm/Select/option.js +4 -2
  67. package/dist/esm/Select/options.js +132 -13
  68. package/dist/esm/Select/select.js +19 -4
  69. package/dist/esm/Select/style/index.less +17 -0
  70. package/dist/esm/Selector/style/index.less +8 -0
  71. package/dist/esm/Table/style/index.less +19 -0
  72. package/dist/esm/hooks/index.d.ts +2 -1
  73. package/dist/esm/hooks/index.js +2 -1
  74. package/dist/esm/hooks/useVirtualList.d.ts +71 -0
  75. package/dist/esm/hooks/useVirtualList.js +129 -0
  76. package/dist/esm/style/size.css +4 -0
  77. package/dist/esm/style/themes.css +1 -1
  78. package/dist/esm/style/variables.css +5 -1
  79. package/dist/esm/version.d.ts +1 -1
  80. package/dist/esm/version.js +1 -1
  81. package/dist/umd/yee-c.min.css +2 -2
  82. package/dist/umd/yee-c.min.js +1 -1
  83. package/package.json +1 -1
  84. package/src/Descriptions/descriptions.tsx +4 -1
  85. package/src/Descriptions/interface.ts +7 -1
  86. package/src/Dialog/demo/basic.tsx +1 -1
  87. package/src/Dialog/dialog.tsx +1 -1
  88. package/src/Field/demo/validation.tsx +2 -2
  89. package/src/Field/field.tsx +2 -1
  90. package/src/Field/index.en-US.md +1 -1
  91. package/src/Field/index.zh-CN.md +1 -1
  92. package/src/Form/Field.tsx +3 -4
  93. package/src/Form/Form.tsx +1 -1
  94. package/src/Form/Group.tsx +15 -12
  95. package/src/Form/List.tsx +3 -3
  96. package/src/Form/demo/async-validate.tsx +71 -0
  97. package/src/Form/demo/virtual.tsx +1 -1
  98. package/src/Form/form-store.ts +37 -21
  99. package/src/Form/index.en-US.md +6 -5
  100. package/src/Form/index.zh-CN.md +6 -5
  101. package/src/Form/interface.ts +13 -7
  102. package/src/Form/utils/validate.ts +65 -13
  103. package/src/Select/demo/basic.tsx +1 -1
  104. package/src/Select/demo/size.tsx +2 -0
  105. package/src/Select/demo/virtual.tsx +25 -0
  106. package/src/Select/hooks/useSelectKeyboard.ts +30 -6
  107. package/src/Select/index.en-US.md +4 -0
  108. package/src/Select/index.zh-CN.md +4 -0
  109. package/src/Select/interface.ts +51 -3
  110. package/src/Select/option.tsx +2 -1
  111. package/src/Select/options.tsx +139 -8
  112. package/src/Select/select.tsx +23 -1
  113. package/src/Select/style/index.less +17 -0
  114. package/src/Selector/style/index.less +8 -0
  115. package/src/Table/style/index.less +19 -0
  116. package/src/hooks/index.ts +2 -0
  117. package/src/hooks/useVirtualList.ts +169 -0
  118. package/src/style/size.css +4 -0
  119. package/src/version.ts +1 -1
@@ -0,0 +1,71 @@
1
+ import React from 'react';
2
+ export interface UseVirtualListOptions {
3
+ /**
4
+ * Total number of items in the list.
5
+ */
6
+ itemCount: number;
7
+ /**
8
+ * Fixed height of every item in pixels.
9
+ */
10
+ itemHeight: number;
11
+ /**
12
+ * Extra items rendered above and below the visible window
13
+ * to avoid white flashes while scrolling.
14
+ * @default 4
15
+ */
16
+ overscan?: number;
17
+ }
18
+ export interface UseVirtualListResult {
19
+ /**
20
+ * Inclusive start index of the render window (already includes overscan).
21
+ */
22
+ start: number;
23
+ /**
24
+ * Exclusive end index of the render window (already includes overscan).
25
+ */
26
+ end: number;
27
+ /**
28
+ * Vertical offset to apply to the rendered block, equal to `start * itemHeight`.
29
+ * Use it as `transform: translateY(offsetY)` or `top: offsetY`.
30
+ */
31
+ offsetY: number;
32
+ /**
33
+ * Total scrollable height, equal to `itemCount * itemHeight`.
34
+ * Apply it to the inner spacer element so the scrollbar matches the full list.
35
+ */
36
+ totalHeight: number;
37
+ /**
38
+ * Ref to bind to the scroll container element.
39
+ */
40
+ viewportRef: React.RefObject<HTMLDivElement | null>;
41
+ /**
42
+ * Stable scroll handler (rAF-throttled). Bind to the viewport's `onScroll`.
43
+ */
44
+ onScroll: () => void;
45
+ /**
46
+ * Scroll the viewport so that the item at `index` is visible.
47
+ * Used by keyboard navigation to replace `scrollIntoView`.
48
+ */
49
+ scrollToIndex: (index: number) => void;
50
+ }
51
+ /**
52
+ * Fixed-height virtual scrolling hook.
53
+ *
54
+ * Renders only the items inside the visible window (plus an `overscan` buffer)
55
+ * and keeps the DOM node count constant regardless of `itemCount`.
56
+ *
57
+ * Usage:
58
+ * const { start, end, offsetY, totalHeight, viewportRef, onScroll, scrollToIndex } =
59
+ * useVirtualList({ itemCount, itemHeight });
60
+ *
61
+ * <div ref={viewportRef} onScroll={onScroll} style={{ maxHeight: 200, overflowY: 'auto' }}>
62
+ * <div style={{ height: totalHeight, position: 'relative' }}>
63
+ * {items.slice(start, end).map((it, i) => (
64
+ * <div key={it.key} style={{ position: 'absolute', height: itemHeight, transform: `translateY(${offsetY + i * itemHeight}px)` }}>
65
+ * {it.content}
66
+ * </div>
67
+ * ))}
68
+ * </div>
69
+ * </div>
70
+ */
71
+ export default function useVirtualList({ itemCount, itemHeight, overscan, }: UseVirtualListOptions): UseVirtualListResult;
@@ -0,0 +1,117 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
20
+ // If the importer is in node compatibility mode or this is not an ESM
21
+ // file that has been converted to a CommonJS file using a Babel-
22
+ // compatible transform (i.e. "__esModule" has not been set), then set
23
+ // "default" to the CommonJS "module.exports" for node compatibility.
24
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
25
+ mod
26
+ ));
27
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
28
+
29
+ // src/hooks/useVirtualList.ts
30
+ var useVirtualList_exports = {};
31
+ __export(useVirtualList_exports, {
32
+ default: () => useVirtualList
33
+ });
34
+ module.exports = __toCommonJS(useVirtualList_exports);
35
+ var import_react = require("react");
36
+ var import_useEvent = __toESM(require("./useEvent"));
37
+ var import_useResizeObserver = __toESM(require("./useResizeObserver"));
38
+ function useVirtualList({
39
+ itemCount,
40
+ itemHeight,
41
+ overscan = 4
42
+ }) {
43
+ const [scrollTop, setScrollTop] = (0, import_react.useState)(0);
44
+ const [visibleHeight, setVisibleHeight] = (0, import_react.useState)(0);
45
+ const rafRef = (0, import_react.useRef)(null);
46
+ const { ref: viewportRef } = (0, import_useResizeObserver.default)((entries) => {
47
+ const entry = entries[0];
48
+ if (!entry)
49
+ return;
50
+ const h = entry.contentRect.height;
51
+ setVisibleHeight((prev) => prev === h ? prev : h);
52
+ });
53
+ const totalHeight = itemCount * itemHeight;
54
+ const readViewport = (0, import_useEvent.default)(() => {
55
+ const viewport = viewportRef.current;
56
+ if (!viewport)
57
+ return;
58
+ const top = viewport.scrollTop;
59
+ const h = viewport.clientHeight;
60
+ setScrollTop((prev) => prev === top ? prev : top);
61
+ setVisibleHeight((prev) => prev === h ? prev : h);
62
+ });
63
+ const onScroll = (0, import_useEvent.default)(() => {
64
+ if (rafRef.current !== null)
65
+ return;
66
+ rafRef.current = requestAnimationFrame(() => {
67
+ rafRef.current = null;
68
+ readViewport();
69
+ });
70
+ });
71
+ (0, import_react.useEffect)(
72
+ () => () => {
73
+ if (rafRef.current !== null) {
74
+ cancelAnimationFrame(rafRef.current);
75
+ }
76
+ },
77
+ []
78
+ );
79
+ (0, import_react.useEffect)(() => {
80
+ readViewport();
81
+ }, [readViewport]);
82
+ (0, import_react.useEffect)(() => {
83
+ const viewport = viewportRef.current;
84
+ if (!viewport)
85
+ return;
86
+ const maxScroll = Math.max(0, totalHeight - viewport.clientHeight);
87
+ if (viewport.scrollTop > maxScroll) {
88
+ viewport.scrollTop = maxScroll;
89
+ setScrollTop(maxScroll);
90
+ }
91
+ }, [totalHeight, viewportRef]);
92
+ const scrollToIndex = (0, import_useEvent.default)((index) => {
93
+ const viewport = viewportRef.current;
94
+ if (!viewport)
95
+ return;
96
+ const maxScroll = Math.max(0, totalHeight - viewport.clientHeight);
97
+ const target = Math.min(Math.max(0, index * itemHeight), maxScroll);
98
+ if (viewport.scrollTop !== target) {
99
+ viewport.scrollTop = target;
100
+ }
101
+ readViewport();
102
+ });
103
+ const effectiveVisibleHeight = visibleHeight || itemHeight;
104
+ const visibleCount = Math.ceil(effectiveVisibleHeight / itemHeight);
105
+ const start = Math.max(0, Math.floor(scrollTop / itemHeight) - overscan);
106
+ const end = Math.min(itemCount, start + visibleCount + overscan * 2);
107
+ const offsetY = start * itemHeight;
108
+ return {
109
+ start,
110
+ end,
111
+ offsetY,
112
+ totalHeight,
113
+ viewportRef,
114
+ onScroll,
115
+ scrollToIndex
116
+ };
117
+ }
@@ -482,6 +482,10 @@
482
482
  --yee-selector-arrow-right: 8px;
483
483
  --yee-selector-clear-right: 8px;
484
484
  --yee-selector-clear-padding: 1px;
485
+ --yee-selector-small-padding: 0 6px;
486
+ --yee-selector-small-height: 24px;
487
+ --yee-selector-large-padding: 4px 12px;
488
+ --yee-selector-large-height: 40px;
485
489
  --yee-tags-height: 32px;
486
490
  --yee-tags-input-font-size: 14px;
487
491
  --yee-tags-input-line-height: 22px;
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * @rainbow-oh/yee-c CSS Variables
3
3
  * Auto-generated, do not edit manually
4
- * Generated on 2026-07-06T02:29:25.236Z
4
+ * Generated on 2026-07-08T03:16:37.096Z
5
5
  */
6
6
 
7
7
  /* ========== color.blue.css ========== */
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * @rainbow-oh/yee-c CSS Variables
3
3
  * Auto-generated, do not edit manually
4
- * Generated on 2026-07-06T02:29:25.236Z
4
+ * Generated on 2026-07-08T03:16:37.096Z
5
5
  */
6
6
 
7
7
  /* ========== color.css ========== */
@@ -1600,6 +1600,10 @@
1600
1600
  --yee-selector-arrow-right: 8px;
1601
1601
  --yee-selector-clear-right: 8px;
1602
1602
  --yee-selector-clear-padding: 1px;
1603
+ --yee-selector-small-padding: 0 6px;
1604
+ --yee-selector-small-height: 24px;
1605
+ --yee-selector-large-padding: 4px 12px;
1606
+ --yee-selector-large-height: 40px;
1603
1607
  --yee-tags-height: 32px;
1604
1608
  --yee-tags-input-font-size: 14px;
1605
1609
  --yee-tags-input-line-height: 22px;
@@ -3,4 +3,4 @@ declare global {
3
3
  __yee_c_version__: string;
4
4
  }
5
5
  }
6
- export declare const version = "0.4.5";
6
+ export declare const version = "0.5.1";
@@ -22,7 +22,7 @@ __export(version_exports, {
22
22
  version: () => version
23
23
  });
24
24
  module.exports = __toCommonJS(version_exports);
25
- var version = "0.4.5";
25
+ var version = "0.5.1";
26
26
  if (typeof window !== "undefined") {
27
27
  window.__yee_c_version__ = version;
28
28
  }
@@ -181,7 +181,8 @@ var Descriptions = /*#__PURE__*/React.forwardRef(function (baseprops, ref) {
181
181
  style: style,
182
182
  ref: ref
183
183
  }), renderHeader(), /*#__PURE__*/React.createElement("table", {
184
- className: "".concat(prefixCls, "-table")
184
+ className: clsx("".concat(prefixCls, "-table"), classNames === null || classNames === void 0 ? void 0 : classNames.table),
185
+ style: styles === null || styles === void 0 ? void 0 : styles.table
185
186
  }, /*#__PURE__*/React.createElement("tbody", null, renderRows())));
186
187
  });
187
188
  Descriptions.displayName = 'Descriptions';
@@ -1,6 +1,6 @@
1
1
  import type React from 'react';
2
2
  import type { DataAttributeProps } from '../utils/types';
3
- export type SemanticDOM = 'header' | 'title' | 'extra' | 'label' | 'content';
3
+ export type SemanticDOM = 'header' | 'title' | 'extra' | 'label' | 'content' | 'table';
4
4
  export interface DescriptionsItem {
5
5
  key?: React.Key;
6
6
  label?: React.ReactNode;
@@ -30,7 +30,7 @@ export default (function () {
30
30
  // form.resetFields();
31
31
  },
32
32
  onConfirm: function onConfirm() {
33
- return form.submit();
33
+ return void form.submit();
34
34
  }
35
35
  }, /*#__PURE__*/React.createElement(Form, {
36
36
  form: form,
@@ -116,7 +116,7 @@ var Dialog = function Dialog(baseprops) {
116
116
  useFocusManage(contentRef.current, delayOpen);
117
117
  var cls = clsx(prefixCls, _defineProperty(_defineProperty({}, "".concat(prefixCls, "-open"), delayOpen), "".concat(prefixCls, "-fullscreen"), fullscreen));
118
118
  var renderFooter = function renderFooter() {
119
- if (footer === false) {
119
+ if (footer === false || footer === null) {
120
120
  return null;
121
121
  }
122
122
  if (footer === true || footer === undefined) {
@@ -1,3 +1,7 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
3
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
4
+ function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
1
5
  import { Button, Field, Input, useVirtualForm } from "../..";
2
6
  import React, { useLayoutEffect } from 'react';
3
7
  export default (function () {
@@ -7,15 +11,32 @@ export default (function () {
7
11
  useLayoutEffect(function () {
8
12
  createForm('validationForm');
9
13
  }, []);
10
- var handleSubmit = function handleSubmit() {
11
- var form = getForm('validationForm');
12
- console.log('form: ', form);
13
- var errors = form === null || form === void 0 ? void 0 : form.submit();
14
- console.log('errors: ', errors);
15
- if (errors && errors.length === 0) {
16
- console.log('Submit success:', form === null || form === void 0 ? void 0 : form.getFieldsValue());
17
- }
18
- };
14
+ var handleSubmit = /*#__PURE__*/function () {
15
+ var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
16
+ var form, errors;
17
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
18
+ while (1) switch (_context.prev = _context.next) {
19
+ case 0:
20
+ form = getForm('validationForm');
21
+ console.log('form: ', form);
22
+ _context.next = 4;
23
+ return form === null || form === void 0 ? void 0 : form.submit();
24
+ case 4:
25
+ errors = _context.sent;
26
+ console.log('errors: ', errors);
27
+ if (errors && errors.length === 0) {
28
+ console.log('Submit success:', form === null || form === void 0 ? void 0 : form.getFieldsValue());
29
+ }
30
+ case 7:
31
+ case "end":
32
+ return _context.stop();
33
+ }
34
+ }, _callee);
35
+ }));
36
+ return function handleSubmit() {
37
+ return _ref.apply(this, arguments);
38
+ };
39
+ }();
19
40
  return /*#__PURE__*/React.createElement("div", {
20
41
  style: {
21
42
  maxWidth: 400
@@ -84,7 +84,8 @@ var Field = function Field(props) {
84
84
  forceUpdate();
85
85
  },
86
86
  onBlur: function onBlur(event) {
87
- validateField === null || validateField === void 0 || validateField(name, 'onBlur');
87
+ // Fire-and-forget async validation; store notifies onStoreChange on completion.
88
+ void (validateField === null || validateField === void 0 ? void 0 : validateField(name, 'onBlur'));
88
89
 
89
90
  // Call child component's onBlur
90
91
  if (children.props.onBlur) {
@@ -155,10 +155,9 @@ var Field = function Field(props) {
155
155
  },
156
156
  onBlur: function onBlur(event) {
157
157
  var _props$onBlur;
158
- var err = validateField === null || validateField === void 0 ? void 0 : validateField(normalizedName, 'onBlur');
159
- if (err.length) {
160
- forceUpdate();
161
- }
158
+ // Fire-and-forget; the store calls onStoreChange (→ forceUpdate) when
159
+ // the (possibly async) validation completes, so the error UI refreshes.
160
+ void (validateField === null || validateField === void 0 ? void 0 : validateField(normalizedName, 'onBlur'));
162
161
  props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, event);
163
162
  }
164
163
  });
@@ -64,7 +64,7 @@ var Form = function Form(baseprops) {
64
64
  onSubmit: function onSubmit(e) {
65
65
  e.preventDefault();
66
66
  e.stopPropagation();
67
- formInstance.submit();
67
+ void formInstance.submit();
68
68
  },
69
69
  onReset: function onReset(e) {
70
70
  e.preventDefault();