@rainbow-oh/yee-c 0.8.19 → 0.9.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.
- package/dist/cjs/Anchor/anchor.js +4 -1
- package/dist/cjs/Checkbox/checkbox.js +2 -1
- package/dist/cjs/Checkbox/style/index.less +3 -0
- package/dist/cjs/Form/Field.js +6 -6
- package/dist/cjs/Form/demo/field-status.d.ts +3 -0
- package/dist/cjs/Form/demo/field-status.js +116 -0
- package/dist/cjs/Form/form-store.d.ts +6 -1
- package/dist/cjs/Form/form-store.js +74 -2
- package/dist/cjs/Form/index.d.ts +1 -1
- package/dist/cjs/Form/interface.d.ts +17 -1
- package/dist/cjs/Form/style/index.less +26 -0
- package/dist/cjs/Progress/circle.js +46 -35
- package/dist/cjs/Progress/line.js +20 -11
- package/dist/cjs/Search/demo/basic.js +38 -3
- package/dist/cjs/Search/interface.d.ts +2 -2
- package/dist/cjs/Search/search.js +52 -32
- package/dist/cjs/Search/style/index.less +20 -3
- package/dist/cjs/Table/style/index.less +4 -2
- package/dist/cjs/Table/tbody/cell.js +2 -2
- package/dist/cjs/Transfer/interface.d.ts +0 -1
- package/dist/cjs/Transfer/style/index.less +4 -0
- package/dist/cjs/Transfer/transfer-list.js +1 -0
- package/dist/cjs/message/use-message.js +1 -3
- package/dist/cjs/notice/notice.js +1 -1
- package/dist/cjs/style/themes.css +1 -1
- package/dist/cjs/style/variables.css +1 -1
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/Checkbox/checkbox.js +2 -1
- package/dist/esm/Checkbox/style/index.less +3 -0
- package/dist/esm/Form/Field.js +6 -6
- package/dist/esm/Form/demo/field-status.d.ts +3 -0
- package/dist/esm/Form/demo/field-status.js +104 -0
- package/dist/esm/Form/form-store.d.ts +6 -1
- package/dist/esm/Form/form-store.js +88 -6
- package/dist/esm/Form/index.d.ts +1 -1
- package/dist/esm/Form/interface.d.ts +17 -1
- package/dist/esm/Form/style/index.less +26 -0
- package/dist/esm/Search/demo/basic.js +61 -7
- package/dist/esm/Search/interface.d.ts +2 -2
- package/dist/esm/Search/search.js +22 -15
- package/dist/esm/Search/style/index.less +20 -3
- package/dist/esm/Table/style/index.less +4 -2
- package/dist/esm/Table/tbody/cell.js +2 -2
- package/dist/esm/Transfer/interface.d.ts +0 -1
- package/dist/esm/Transfer/style/index.less +4 -0
- package/dist/esm/Transfer/transfer-list.js +1 -0
- package/dist/esm/notice/notice.js +1 -1
- package/dist/esm/style/themes.css +1 -1
- package/dist/esm/style/variables.css +1 -1
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/yee-c.min.css +1 -1
- package/dist/umd/yee-c.min.js +1 -1
- package/package.json +1 -1
- package/src/Anchor/anchor.tsx +9 -5
- package/src/Checkbox/checkbox.tsx +1 -0
- package/src/Checkbox/style/index.less +3 -0
- package/src/Form/Field.tsx +7 -8
- package/src/Form/demo/field-status.tsx +108 -0
- package/src/Form/form-store.ts +92 -2
- package/src/Form/index.en-US.md +6 -1
- package/src/Form/index.ts +2 -0
- package/src/Form/index.zh-CN.md +6 -1
- package/src/Form/interface.ts +19 -1
- package/src/Form/style/index.less +26 -0
- package/src/Progress/circle.tsx +5 -1
- package/src/Progress/line.tsx +5 -1
- package/src/Progress/progress.tsx +5 -1
- package/src/Search/demo/basic.tsx +43 -7
- package/src/Search/index.en-US.md +1 -1
- package/src/Search/index.zh-CN.md +1 -1
- package/src/Search/interface.ts +2 -2
- package/src/Search/search.tsx +40 -23
- package/src/Search/style/index.less +20 -3
- package/src/Spin/indicator.tsx +1 -1
- package/src/Table/style/index.less +4 -2
- package/src/Table/tbody/cell.tsx +2 -2
- package/src/Transfer/interface.ts +0 -1
- package/src/Transfer/style/index.less +4 -0
- package/src/Transfer/transfer-list.tsx +1 -0
- package/src/Tree/interface.ts +6 -1
- package/src/Tree/tree-node.tsx +7 -6
- package/src/Tree/utils/tree-tools.ts +4 -1
- package/src/Trigger/interface.ts +2 -1
- package/src/message/demo/base.tsx +1 -1
- package/src/message/interface.ts +1 -5
- package/src/message/message.test.tsx +15 -5
- package/src/message/message.tsx +10 -4
- package/src/message/use-message.tsx +2 -8
- package/src/message/wrapper.tsx +1 -2
- package/src/notice/interface.ts +1 -5
- package/src/notice/notice.test.tsx +14 -6
- package/src/notice/notice.tsx +12 -6
- package/src/notice/wrapper.tsx +1 -2
- package/src/version.ts +1 -1
- package/dist/cjs/Search/style/index.d.ts +0 -1
- package/dist/cjs/Search/style/index.js +0 -2
- package/dist/esm/Search/style/index.d.ts +0 -1
- package/dist/esm/Search/style/index.js +0 -1
- package/src/Search/style/index.ts +0 -1
|
@@ -46,6 +46,7 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
46
46
|
_defineProperty(this, "fieldEntities", []);
|
|
47
47
|
_defineProperty(this, "fieldMap", new Map());
|
|
48
48
|
_defineProperty(this, "validateMessages", new Map());
|
|
49
|
+
_defineProperty(this, "fieldStatuses", new Map());
|
|
49
50
|
_defineProperty(this, "initialized", false);
|
|
50
51
|
_defineProperty(this, "initialValues", {});
|
|
51
52
|
// List key manager
|
|
@@ -109,6 +110,65 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
109
110
|
}
|
|
110
111
|
return null;
|
|
111
112
|
});
|
|
113
|
+
_defineProperty(this, "getFieldStatus", function (name) {
|
|
114
|
+
var _this$validateMessage;
|
|
115
|
+
var normalizedName = stringifyPath(getNamePath(name));
|
|
116
|
+
var manualStatus = _this.fieldStatuses.get(normalizedName);
|
|
117
|
+
var validateMessage = (_this$validateMessage = _this.validateMessages.get(normalizedName)) === null || _this$validateMessage === void 0 ? void 0 : _this$validateMessage[0];
|
|
118
|
+
|
|
119
|
+
// Rule errors reflect the current value and auto-clear once validation
|
|
120
|
+
// passes, so they always take display precedence — a stale manually set
|
|
121
|
+
// status must never hide why submission failed.
|
|
122
|
+
if ((validateMessage === null || validateMessage === void 0 ? void 0 : validateMessage.status) === 'error') {
|
|
123
|
+
return {
|
|
124
|
+
status: 'error',
|
|
125
|
+
message: validateMessage.message
|
|
126
|
+
};
|
|
127
|
+
}
|
|
128
|
+
if (manualStatus) {
|
|
129
|
+
return _objectSpread({}, manualStatus);
|
|
130
|
+
}
|
|
131
|
+
if (validateMessage) {
|
|
132
|
+
return {
|
|
133
|
+
status: validateMessage.status,
|
|
134
|
+
message: validateMessage.message
|
|
135
|
+
};
|
|
136
|
+
}
|
|
137
|
+
return null;
|
|
138
|
+
});
|
|
139
|
+
_defineProperty(this, "setFieldStatus", function (name, status) {
|
|
140
|
+
var _this$fieldMap$get;
|
|
141
|
+
var normalizedName = stringifyPath(getNamePath(name));
|
|
142
|
+
if (!normalizedName) return;
|
|
143
|
+
if (status) {
|
|
144
|
+
_this.fieldStatuses.set(normalizedName, _objectSpread({}, status));
|
|
145
|
+
} else {
|
|
146
|
+
_this.fieldStatuses.delete(normalizedName);
|
|
147
|
+
}
|
|
148
|
+
(_this$fieldMap$get = _this.fieldMap.get(normalizedName)) === null || _this$fieldMap$get === void 0 || _this$fieldMap$get.onStoreChange();
|
|
149
|
+
});
|
|
150
|
+
// Delete entries whose key equals or nests under one of `names`
|
|
151
|
+
// (no names = delete all). Keeps rule messages and manual statuses in
|
|
152
|
+
// sync with the fields that reset/clear actually touched.
|
|
153
|
+
_defineProperty(this, "deleteRelatedEntries", function (entries, names) {
|
|
154
|
+
if (!names) {
|
|
155
|
+
entries.clear();
|
|
156
|
+
return;
|
|
157
|
+
}
|
|
158
|
+
var normalizedNames = names.map(function (name) {
|
|
159
|
+
return stringifyPath(getNamePath(name));
|
|
160
|
+
});
|
|
161
|
+
Array.from(entries.keys()).forEach(function (fieldName) {
|
|
162
|
+
if (normalizedNames.some(function (name) {
|
|
163
|
+
return isRelatedNamePath(fieldName, name);
|
|
164
|
+
})) {
|
|
165
|
+
entries.delete(fieldName);
|
|
166
|
+
}
|
|
167
|
+
});
|
|
168
|
+
});
|
|
169
|
+
_defineProperty(this, "clearFieldStatuses", function (names) {
|
|
170
|
+
_this.deleteRelatedEntries(_this.fieldStatuses, names);
|
|
171
|
+
});
|
|
112
172
|
_defineProperty(this, "setFieldsValue", function (newStore) {
|
|
113
173
|
var trigger = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'onChange';
|
|
114
174
|
if (trigger === 'reset' || trigger === 'clear') {
|
|
@@ -189,7 +249,10 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
189
249
|
});
|
|
190
250
|
}
|
|
191
251
|
(_this$callbacks4 = _this.callbacks) === null || _this$callbacks4 === void 0 || (_this$callbacks4$onRe = _this$callbacks4.onReset) === null || _this$callbacks4$onRe === void 0 || _this$callbacks4$onRe.call(_this$callbacks4);
|
|
192
|
-
|
|
252
|
+
// A named reset only clears rule messages of the fields it touched;
|
|
253
|
+
// unrelated fields keep their (still valid) validation state.
|
|
254
|
+
_this.deleteRelatedEntries(_this.validateMessages, name);
|
|
255
|
+
_this.clearFieldStatuses(name);
|
|
193
256
|
_this.groupEntities.forEach(function (entity) {
|
|
194
257
|
return entity.reset();
|
|
195
258
|
});
|
|
@@ -201,6 +264,7 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
201
264
|
acc[name] = undefined;
|
|
202
265
|
return acc;
|
|
203
266
|
}, {});
|
|
267
|
+
_this.clearFieldStatuses(name);
|
|
204
268
|
_this.setFieldsValue(clearStore, 'clear');
|
|
205
269
|
});
|
|
206
270
|
_defineProperty(this, "validateField", /*#__PURE__*/function () {
|
|
@@ -347,8 +411,8 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
347
411
|
var changedKeys = Object.keys(newStore);
|
|
348
412
|
var fieldNames = relatedFieldNames !== null && relatedFieldNames !== void 0 ? relatedFieldNames : _this.getRelatedFieldNames(changedKeys);
|
|
349
413
|
fieldNames.forEach(function (fieldName) {
|
|
350
|
-
var _this$fieldMap$
|
|
351
|
-
(_this$fieldMap$
|
|
414
|
+
var _this$fieldMap$get2;
|
|
415
|
+
(_this$fieldMap$get2 = _this.fieldMap.get(fieldName)) === null || _this$fieldMap$get2 === void 0 || _this$fieldMap$get2.onStoreChange();
|
|
352
416
|
});
|
|
353
417
|
_this.notifyWatchers(changedKeys);
|
|
354
418
|
} else {
|
|
@@ -577,7 +641,7 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
577
641
|
};
|
|
578
642
|
});
|
|
579
643
|
_defineProperty(this, "submit", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
|
580
|
-
var _this$callbacks5, onFinish, onFinishFailed, fieldErrors, groupErrors, allErrors;
|
|
644
|
+
var _this$callbacks5, onFinish, onFinishFailed, fieldErrors, groupErrors, statusErrors, allErrors;
|
|
581
645
|
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
|
582
646
|
while (1) switch (_context4.prev = _context4.next) {
|
|
583
647
|
case 0:
|
|
@@ -590,7 +654,23 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
590
654
|
return _this.validateGroups(true);
|
|
591
655
|
case 6:
|
|
592
656
|
groupErrors = _context4.sent;
|
|
593
|
-
|
|
657
|
+
statusErrors = Array.from(_this.fieldStatuses.entries()).filter(function (_ref9) {
|
|
658
|
+
var _ref10 = _slicedToArray(_ref9, 2),
|
|
659
|
+
status = _ref10[1];
|
|
660
|
+
return status.status === 'error' && status.blocking === true;
|
|
661
|
+
}).map(function (_ref11) {
|
|
662
|
+
var _status$message;
|
|
663
|
+
var _ref12 = _slicedToArray(_ref11, 2),
|
|
664
|
+
name = _ref12[0],
|
|
665
|
+
status = _ref12[1];
|
|
666
|
+
return {
|
|
667
|
+
name: name,
|
|
668
|
+
message: (_status$message = status.message) !== null && _status$message !== void 0 ? _status$message : '',
|
|
669
|
+
value: _this.getFieldValue(name),
|
|
670
|
+
status: 'error'
|
|
671
|
+
};
|
|
672
|
+
});
|
|
673
|
+
allErrors = [].concat(_toConsumableArray(fieldErrors), _toConsumableArray(groupErrors), _toConsumableArray(statusErrors));
|
|
594
674
|
if (allErrors.length === 0) {
|
|
595
675
|
onFinish === null || onFinish === void 0 || onFinish(_this.getFieldsValue());
|
|
596
676
|
} else {
|
|
@@ -598,7 +678,7 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
598
678
|
}
|
|
599
679
|
_this.refreshField();
|
|
600
680
|
return _context4.abrupt("return", allErrors);
|
|
601
|
-
case
|
|
681
|
+
case 12:
|
|
602
682
|
case "end":
|
|
603
683
|
return _context4.stop();
|
|
604
684
|
}
|
|
@@ -647,6 +727,8 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
647
727
|
value: function getForm() {
|
|
648
728
|
return {
|
|
649
729
|
getFieldValidate: this.getFieldValidate,
|
|
730
|
+
getFieldStatus: this.getFieldStatus,
|
|
731
|
+
setFieldStatus: this.setFieldStatus,
|
|
650
732
|
getFieldsValue: this.getFieldsValue,
|
|
651
733
|
getFieldValue: this.getFieldValue,
|
|
652
734
|
setFieldsValue: this.setFieldsValue,
|
package/dist/esm/Form/index.d.ts
CHANGED
|
@@ -16,5 +16,5 @@ type FormInterface = typeof InternalForm & {
|
|
|
16
16
|
List: typeof List;
|
|
17
17
|
};
|
|
18
18
|
declare const Form: FormInterface;
|
|
19
|
-
export type { FieldGroupProps, FormInstance, FormListProps, FormProps, } from './interface';
|
|
19
|
+
export type { FieldGroupProps, FieldStatus, FieldStatusData, FormInstance, FormListProps, FormProps, } from './interface';
|
|
20
20
|
export default Form;
|
|
@@ -96,6 +96,15 @@ export interface FormInstance<Values = any> {
|
|
|
96
96
|
* Get field validation info
|
|
97
97
|
*/
|
|
98
98
|
getFieldValidate: (name: Name) => ValidateMessage | null;
|
|
99
|
+
/**
|
|
100
|
+
* Get the displayed field status. Rule validation errors take display
|
|
101
|
+
* precedence; otherwise a manually set status overrides validation.
|
|
102
|
+
*/
|
|
103
|
+
getFieldStatus: (name: NamePath) => FieldStatusData | null;
|
|
104
|
+
/**
|
|
105
|
+
* Set or clear a field's displayed status. Pass null to clear it.
|
|
106
|
+
*/
|
|
107
|
+
setFieldStatus: (name: NamePath, status: FieldStatusData | null) => void;
|
|
99
108
|
/**
|
|
100
109
|
* Get field value
|
|
101
110
|
*/
|
|
@@ -225,11 +234,18 @@ export type Rule = {
|
|
|
225
234
|
*/
|
|
226
235
|
validateTrigger?: 'onBlur' | 'onChange' | 'onSubmit' | 'reset' | Array<'onBlur' | 'onChange' | 'onSubmit'>;
|
|
227
236
|
};
|
|
237
|
+
export type FieldStatus = 'error' | 'success' | 'warning' | 'info';
|
|
238
|
+
export type FieldStatusData = {
|
|
239
|
+
status: FieldStatus;
|
|
240
|
+
message?: string;
|
|
241
|
+
/** Whether an error status should prevent form submission. */
|
|
242
|
+
blocking?: boolean;
|
|
243
|
+
};
|
|
228
244
|
export type ValidateMessage = {
|
|
229
245
|
name: NamePath | NamePath[] | undefined;
|
|
230
246
|
message: string;
|
|
231
247
|
value: unknown;
|
|
232
|
-
status:
|
|
248
|
+
status: FieldStatus;
|
|
233
249
|
};
|
|
234
250
|
export type FieldConfigurableTooltip = Omit<TooltipProps, 'children'> & {
|
|
235
251
|
/**
|
|
@@ -79,6 +79,18 @@
|
|
|
79
79
|
&-error {
|
|
80
80
|
color: var(--yee-error-color);
|
|
81
81
|
}
|
|
82
|
+
|
|
83
|
+
&-warning {
|
|
84
|
+
color: var(--yee-warning-color);
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
&-success {
|
|
88
|
+
color: var(--yee-success-color);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
&-info {
|
|
92
|
+
color: var(--yee-info-color);
|
|
93
|
+
}
|
|
82
94
|
}
|
|
83
95
|
|
|
84
96
|
// 表单校验态:在此重定义控件读取的 border / box-shadow 变量,
|
|
@@ -97,5 +109,19 @@
|
|
|
97
109
|
--yee-input-focus-bs-color: var(--yee-warning-color-border);
|
|
98
110
|
--yee-checkbox-border-color: var(--yee-warning-color);
|
|
99
111
|
}
|
|
112
|
+
|
|
113
|
+
&&-success {
|
|
114
|
+
--yee-input-border-color: var(--yee-success-color);
|
|
115
|
+
--yee-input-hover-border-color: var(--yee-success-color-hover);
|
|
116
|
+
--yee-input-focus-bs-color: var(--yee-success-color-border);
|
|
117
|
+
--yee-checkbox-border-color: var(--yee-success-color);
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
&&-info {
|
|
121
|
+
--yee-input-border-color: var(--yee-info-color);
|
|
122
|
+
--yee-input-hover-border-color: var(--yee-info-color-hover);
|
|
123
|
+
--yee-input-focus-bs-color: var(--yee-info-color-border);
|
|
124
|
+
--yee-checkbox-border-color: var(--yee-info-color);
|
|
125
|
+
}
|
|
100
126
|
}
|
|
101
127
|
}
|
|
@@ -1,15 +1,69 @@
|
|
|
1
|
-
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import React, { useMemo, useState } from 'react';
|
|
2
8
|
import Search from "../index";
|
|
9
|
+
var people = [{
|
|
10
|
+
key: 'ada',
|
|
11
|
+
value: 'ada',
|
|
12
|
+
label: 'Ada Lovelace'
|
|
13
|
+
}, {
|
|
14
|
+
key: 'grace',
|
|
15
|
+
value: 'grace',
|
|
16
|
+
label: 'Grace Hopper'
|
|
17
|
+
}, {
|
|
18
|
+
key: 'alan',
|
|
19
|
+
value: 'alan',
|
|
20
|
+
label: 'Alan Turing'
|
|
21
|
+
}, {
|
|
22
|
+
key: 'margaret',
|
|
23
|
+
value: 'margaret',
|
|
24
|
+
label: 'Margaret Hamilton'
|
|
25
|
+
}];
|
|
3
26
|
export default (function () {
|
|
4
|
-
var
|
|
5
|
-
|
|
27
|
+
var _useState = useState(''),
|
|
28
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
29
|
+
keyword = _useState2[0],
|
|
30
|
+
setKeyword = _useState2[1];
|
|
31
|
+
var _useState3 = useState(null),
|
|
32
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
33
|
+
selected = _useState4[0],
|
|
34
|
+
setSelected = _useState4[1];
|
|
35
|
+
var results = useMemo(function () {
|
|
36
|
+
var normalizedKeyword = keyword.trim().toLowerCase();
|
|
37
|
+
var matched = people.filter(function (person) {
|
|
38
|
+
return String(person.label).toLowerCase().includes(normalizedKeyword);
|
|
39
|
+
});
|
|
40
|
+
return matched.length > 0 ? matched : [{
|
|
41
|
+
key: 'empty',
|
|
42
|
+
value: 'empty',
|
|
43
|
+
label: 'No results found',
|
|
44
|
+
disabled: true
|
|
45
|
+
}];
|
|
46
|
+
}, [keyword]);
|
|
47
|
+
var handleSelect = function handleSelect(option) {
|
|
48
|
+
setSelected(option);
|
|
49
|
+
if (option) {
|
|
50
|
+
setKeyword(String(option.label));
|
|
51
|
+
}
|
|
6
52
|
};
|
|
7
53
|
return /*#__PURE__*/React.createElement("div", {
|
|
8
54
|
style: {
|
|
9
|
-
width:
|
|
55
|
+
width: 320
|
|
10
56
|
}
|
|
11
57
|
}, /*#__PURE__*/React.createElement(Search, {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
58
|
+
allowClear: true,
|
|
59
|
+
value: keyword,
|
|
60
|
+
options: results,
|
|
61
|
+
placeholder: "Search people",
|
|
62
|
+
onSearch: setKeyword,
|
|
63
|
+
onChange: handleSelect
|
|
64
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
65
|
+
style: {
|
|
66
|
+
marginTop: 12
|
|
67
|
+
}
|
|
68
|
+
}, "Selected: ", selected ? String(selected.label) : 'None'));
|
|
15
69
|
});
|
|
@@ -50,7 +50,7 @@ export interface SearchProps extends Omit<React.InputHTMLAttributes<HTMLInputEle
|
|
|
50
50
|
/**
|
|
51
51
|
* @description Suffix content
|
|
52
52
|
*/
|
|
53
|
-
suffix?: React.ReactNode;
|
|
53
|
+
suffix?: React.ReactNode | false;
|
|
54
54
|
/**
|
|
55
55
|
* @description Whether disabled
|
|
56
56
|
* @default false
|
|
@@ -74,7 +74,7 @@ export interface SearchProps extends Omit<React.InputHTMLAttributes<HTMLInputEle
|
|
|
74
74
|
* @description trigger search event
|
|
75
75
|
* @default 'typing'
|
|
76
76
|
*/
|
|
77
|
-
searchOnAction?: 'typing' | 'enter';
|
|
77
|
+
searchOnAction?: 'typing' | 'enter' | 'button';
|
|
78
78
|
/**
|
|
79
79
|
* @description suggest data
|
|
80
80
|
*/
|
|
@@ -13,7 +13,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
|
13
13
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
14
14
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
15
15
|
import clsx from 'clsx';
|
|
16
|
-
import { X } from 'lucide-react';
|
|
16
|
+
import { Search as SearchIcon, X } from 'lucide-react';
|
|
17
17
|
import React, { startTransition, useContext, useEffect, useId, useRef, useState } from 'react';
|
|
18
18
|
import { GlobalContext } from "../Config-Provider";
|
|
19
19
|
import useMergedState from "../hooks/useMergedState";
|
|
@@ -92,20 +92,12 @@ var Search = /*#__PURE__*/React.forwardRef(function (baseProps, ref) {
|
|
|
92
92
|
(_popupRef$current = popupRef.current) === null || _popupRef$current === void 0 || _popupRef$current.focus();
|
|
93
93
|
} else {}
|
|
94
94
|
}, [open]);
|
|
95
|
-
var handleSearch = function handleSearch(e) {
|
|
96
|
-
if (disabled) return;
|
|
97
|
-
onSearch === null || onSearch === void 0 || onSearch(searchValue);
|
|
98
|
-
if ((e === null || e === void 0 ? void 0 : e.type) === 'click') {
|
|
99
|
-
var _blur, _ref;
|
|
100
|
-
(_blur = (_ref = e.target).blur) === null || _blur === void 0 || _blur.call(_ref);
|
|
101
|
-
}
|
|
102
|
-
};
|
|
103
95
|
var handleChange = function handleChange(e) {
|
|
104
96
|
var newValue = e.target.value;
|
|
105
97
|
setSearchValue(newValue);
|
|
106
98
|
startTransition(function () {
|
|
107
99
|
if (searchOnAction === 'typing') {
|
|
108
|
-
|
|
100
|
+
onSearch === null || onSearch === void 0 || onSearch(newValue);
|
|
109
101
|
}
|
|
110
102
|
});
|
|
111
103
|
};
|
|
@@ -115,10 +107,24 @@ var Search = /*#__PURE__*/React.forwardRef(function (baseProps, ref) {
|
|
|
115
107
|
onChange === null || onChange === void 0 || onChange(null);
|
|
116
108
|
onSearch === null || onSearch === void 0 || onSearch('');
|
|
117
109
|
};
|
|
110
|
+
var handleSearchClick = function handleSearchClick(e) {
|
|
111
|
+
e.stopPropagation();
|
|
112
|
+
if (searchOnAction === 'button') {
|
|
113
|
+
onSearch === null || onSearch === void 0 || onSearch(searchValue);
|
|
114
|
+
}
|
|
115
|
+
};
|
|
116
|
+
var renderSearchIcon = function renderSearchIcon() {
|
|
117
|
+
if (suffix === false) return null;
|
|
118
|
+
return /*#__PURE__*/React.createElement("span", {
|
|
119
|
+
className: "".concat(prefixCls, "-search-icon"),
|
|
120
|
+
onClick: handleSearchClick
|
|
121
|
+
}, suffix || /*#__PURE__*/React.createElement(SearchIcon, {
|
|
122
|
+
size: 14
|
|
123
|
+
}));
|
|
124
|
+
};
|
|
118
125
|
var renderSuffix = function renderSuffix() {
|
|
119
|
-
var
|
|
120
|
-
var
|
|
121
|
-
var showSuffix = suffix || showClearIcon;
|
|
126
|
+
var showClearIcon = allowClear && !disabled && !rest.readOnly;
|
|
127
|
+
var showSuffix = suffix !== false || suffix !== null || showClearIcon;
|
|
122
128
|
if (!showSuffix) {
|
|
123
129
|
return null;
|
|
124
130
|
}
|
|
@@ -141,7 +147,7 @@ var Search = /*#__PURE__*/React.forwardRef(function (baseProps, ref) {
|
|
|
141
147
|
}, /*#__PURE__*/React.createElement(X, {
|
|
142
148
|
size: 14,
|
|
143
149
|
"aria-hidden": "true"
|
|
144
|
-
})),
|
|
150
|
+
})), renderSearchIcon());
|
|
145
151
|
};
|
|
146
152
|
var renderPrefix = function renderPrefix() {
|
|
147
153
|
if (!prefix) return null;
|
|
@@ -154,7 +160,7 @@ var Search = /*#__PURE__*/React.forwardRef(function (baseProps, ref) {
|
|
|
154
160
|
return clsx("".concat(prefixCls, "-input"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-input-small"), size === 'small'), "".concat(prefixCls, "-input-large"), size === 'large'), "".concat(prefixCls, "-input-disabled"), disabled), classNames === null || classNames === void 0 ? void 0 : classNames.input);
|
|
155
161
|
};
|
|
156
162
|
var getRootClassName = function getRootClassName() {
|
|
157
|
-
return clsx(prefixCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-borderless"), !bordered), "".concat(prefixCls, "-small"), size === 'small'), "".concat(prefixCls, "-large"), size === 'large'), className);
|
|
163
|
+
return clsx(prefixCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-with-clear"), allowClear && searchValue), "".concat(prefixCls, "-borderless"), !bordered), "".concat(prefixCls, "-small"), size === 'small'), "".concat(prefixCls, "-large"), size === 'large'), className);
|
|
158
164
|
};
|
|
159
165
|
var hasPopup = Array.isArray(options) || Array.isArray(suggestions);
|
|
160
166
|
var popup = /*#__PURE__*/React.createElement("div", {
|
|
@@ -176,6 +182,7 @@ var Search = /*#__PURE__*/React.forwardRef(function (baseProps, ref) {
|
|
|
176
182
|
return /*#__PURE__*/React.createElement(Trigger, {
|
|
177
183
|
popup: popup,
|
|
178
184
|
open: open,
|
|
185
|
+
stretch: "width",
|
|
179
186
|
onOpenChange: setOpen
|
|
180
187
|
}, /*#__PURE__*/React.createElement("div", {
|
|
181
188
|
className: getRootClassName(),
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
// @import '../../style/index.less';
|
|
2
2
|
|
|
3
|
-
@
|
|
3
|
+
@cls: ~'yee-search';
|
|
4
4
|
|
|
5
|
-
.@{
|
|
5
|
+
.@{cls} {
|
|
6
6
|
position: relative;
|
|
7
7
|
display: inline-flex;
|
|
8
8
|
align-items: center;
|
|
@@ -69,9 +69,10 @@
|
|
|
69
69
|
border: none;
|
|
70
70
|
outline: none;
|
|
71
71
|
transition: all 0.2s;
|
|
72
|
+
line-height: var(--yee-input-line-height);
|
|
72
73
|
|
|
73
74
|
&::placeholder {
|
|
74
|
-
color: var(--yee-
|
|
75
|
+
color: var(--yee-placeholder-color);
|
|
75
76
|
}
|
|
76
77
|
|
|
77
78
|
&-disabled {
|
|
@@ -99,7 +100,17 @@
|
|
|
99
100
|
color: var(--yee-input-fix-icon-color);
|
|
100
101
|
}
|
|
101
102
|
|
|
103
|
+
&-search-icon {
|
|
104
|
+
display: inline-flex;
|
|
105
|
+
}
|
|
106
|
+
|
|
102
107
|
&-clear-icon {
|
|
108
|
+
display: inline-flex;
|
|
109
|
+
padding: var(--yee-input-clear-padding);
|
|
110
|
+
color: var(--yee-input-clear-color);
|
|
111
|
+
background-color: var(--yee-input-clear-bg-color);
|
|
112
|
+
border-radius: 50%;
|
|
113
|
+
visibility: hidden;
|
|
103
114
|
cursor: pointer;
|
|
104
115
|
transition: color 0.2s;
|
|
105
116
|
|
|
@@ -108,6 +119,12 @@
|
|
|
108
119
|
}
|
|
109
120
|
}
|
|
110
121
|
|
|
122
|
+
&&-with-clear:not(.@{cls}-disabled):hover {
|
|
123
|
+
.@{cls}-clear-icon {
|
|
124
|
+
visibility: visible;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
|
|
111
128
|
&-button {
|
|
112
129
|
display: flex;
|
|
113
130
|
align-items: center;
|
|
@@ -97,7 +97,8 @@
|
|
|
97
97
|
width: 15px;
|
|
98
98
|
right: -15px;
|
|
99
99
|
top: 0;
|
|
100
|
-
box-shadow: inset 4px 0 8px -4px
|
|
100
|
+
box-shadow: inset 4px 0 8px -4px
|
|
101
|
+
var(--yee-table-fixed-left-after-bs-color);
|
|
101
102
|
}
|
|
102
103
|
}
|
|
103
104
|
|
|
@@ -111,7 +112,8 @@
|
|
|
111
112
|
width: 15px;
|
|
112
113
|
left: -15px;
|
|
113
114
|
top: 0;
|
|
114
|
-
box-shadow: inset -4px 0 8px -4px
|
|
115
|
+
box-shadow: inset -4px 0 8px -4px
|
|
116
|
+
var(--yee-table-fixed-right-after-bs-color);
|
|
115
117
|
}
|
|
116
118
|
}
|
|
117
119
|
}
|
|
@@ -43,7 +43,7 @@ var TableCell = function TableCell(props) {
|
|
|
43
43
|
var getTdProps = function getTdProps() {
|
|
44
44
|
var title = render ? undefined : record[dataIndex || ''];
|
|
45
45
|
var cls = clsx("".concat(prefixCls, "-cell"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-cell-fixed-").concat(fixed), fixed), "".concat(prefixCls, "-cell-fixed-").concat(fixed, "-first"), isFixedRightFirst), "".concat(prefixCls, "-cell-fixed-").concat(fixed, "-last"), isFixedLeftLast), className);
|
|
46
|
-
var
|
|
46
|
+
var _style = _objectSpread(_objectSpread({}, style), {}, {
|
|
47
47
|
width: width,
|
|
48
48
|
maxWidth: width,
|
|
49
49
|
textAlign: align
|
|
@@ -51,7 +51,7 @@ var TableCell = function TableCell(props) {
|
|
|
51
51
|
var _title = typeof title === 'string' ? title : undefined;
|
|
52
52
|
return _objectSpread(_objectSpread({}, cellProperty), {}, {
|
|
53
53
|
className: cls,
|
|
54
|
-
style:
|
|
54
|
+
style: _style,
|
|
55
55
|
title: _title
|
|
56
56
|
});
|
|
57
57
|
};
|
|
@@ -115,7 +115,6 @@ export interface TransferListProps {
|
|
|
115
115
|
total?: number;
|
|
116
116
|
};
|
|
117
117
|
draggable?: boolean;
|
|
118
|
-
targetMinCountLimit?: number;
|
|
119
118
|
onDrop?: (dropObj: Record<string, any>, dataSource: DataSource[]) => void;
|
|
120
119
|
onDelete?: (key: string | number) => void;
|
|
121
120
|
onItemSelect: (keys: Array<string | number>) => void;
|
|
@@ -66,6 +66,10 @@
|
|
|
66
66
|
line-height: var(--yee-transfer-list-item-height, 32px);
|
|
67
67
|
padding: var(--yee-transfer-list-item-padding, 0 11px);
|
|
68
68
|
|
|
69
|
+
&-checkbox {
|
|
70
|
+
width: 100%;
|
|
71
|
+
}
|
|
72
|
+
|
|
69
73
|
&:hover:not(.yee-one-way):not(.disabled) {
|
|
70
74
|
color: var(--yee-transfer-list-content-item-hover-color);
|
|
71
75
|
background-color: var(--yee-transfer-list-content-item-hover-bg-color);
|
|
@@ -192,6 +192,7 @@ var TransferList = function TransferList(props) {
|
|
|
192
192
|
className: "".concat(prefixCls, "-list-item"),
|
|
193
193
|
key: option.value || index
|
|
194
194
|
}, /*#__PURE__*/React.createElement(Checkbox, {
|
|
195
|
+
className: "".concat(prefixCls, "-list-item-checkbox"),
|
|
195
196
|
value: option.value,
|
|
196
197
|
disabled: option.disabled || disabled,
|
|
197
198
|
checked: checkedKeys.includes(option.value),
|
|
@@ -9,9 +9,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
|
9
9
|
import clsx from 'clsx';
|
|
10
10
|
import { CircleAlert, CircleCheck, CircleX, Info, X } from 'lucide-react';
|
|
11
11
|
import React from 'react';
|
|
12
|
+
import Button from "../Button";
|
|
12
13
|
import Progress from "../Progress";
|
|
13
14
|
import useCountdown from "../hooks/useCountdown";
|
|
14
|
-
import Button from "../Button";
|
|
15
15
|
var icons = {
|
|
16
16
|
info: /*#__PURE__*/React.createElement(Info, {
|
|
17
17
|
size: 22,
|
package/dist/esm/version.d.ts
CHANGED
package/dist/esm/version.js
CHANGED