@lemon-fe/kits 1.0.0-21 → 1.0.0-23
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/es/components/DataGrid/cell-editors/Combination.d.ts +8 -0
- package/es/components/DataGrid/cell-editors/Combination.js +25 -0
- package/es/components/DataGrid/cell-editors/Custom.d.ts +10 -5
- package/es/components/DataGrid/cell-editors/Custom.js +65 -10
- package/es/components/DataGrid/cell-editors/Select.d.ts +5 -2
- package/es/components/DataGrid/index.js +34 -21
- package/es/components/DataGrid/typings.d.ts +39 -12
- package/es/components/Popup/index.js +11 -9
- package/package.json +1 -1
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ICellEditorReactComp } from '@ag-grid-community/react';
|
|
2
|
+
import type { ICellEditorParams } from '@ag-grid-community/core';
|
|
3
|
+
import { type ForwardedRef, type ReactElement } from 'react';
|
|
4
|
+
export interface CombinationEditorParams<T = any> {
|
|
5
|
+
render: (props: ICellEditorParams<T>, ref: ForwardedRef<ICellEditorReactComp>) => ReactElement | null;
|
|
6
|
+
}
|
|
7
|
+
declare const _default: import("react").ForwardRefExoticComponent<ICellEditorParams<any, any> & CombinationEditorParams<any> & import("react").RefAttributes<ICellEditorReactComp>>;
|
|
8
|
+
export default _default;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
var _excluded = ["render"];
|
|
2
|
+
|
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
+
|
|
5
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
+
|
|
7
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
+
|
|
9
|
+
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; }
|
|
10
|
+
|
|
11
|
+
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; }
|
|
12
|
+
|
|
13
|
+
import { forwardRef } from 'react';
|
|
14
|
+
import { useGridStore } from "../hooks";
|
|
15
|
+
export default /*#__PURE__*/forwardRef(function CombinationEditor(props, ref) {
|
|
16
|
+
var render = props.render,
|
|
17
|
+
restProps = _objectWithoutProperties(props, _excluded);
|
|
18
|
+
|
|
19
|
+
var context = useGridStore(function (state) {
|
|
20
|
+
return state.context;
|
|
21
|
+
});
|
|
22
|
+
return render(_objectSpread(_objectSpread({}, restProps), {}, {
|
|
23
|
+
context: context
|
|
24
|
+
}), ref);
|
|
25
|
+
});
|
|
@@ -1,9 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
import React, { MutableRefObject, ReactElement } from 'react';
|
|
2
2
|
import type { ICellEditorReactComp } from '@ag-grid-community/react';
|
|
3
3
|
import type { ICellEditorParams } from '@ag-grid-community/core';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
export interface CustomEditorParams<T = any, K = any> {
|
|
5
|
+
render: (val: K, data: T, params: ICellEditorParams<T, K> & {
|
|
6
|
+
ref: MutableRefObject<{
|
|
7
|
+
select?: () => void;
|
|
8
|
+
focus?: () => void;
|
|
9
|
+
} | null>;
|
|
10
|
+
onChange: (val: Partial<T>, action?: 'stop' | 'next') => void;
|
|
11
|
+
}) => ReactElement | null;
|
|
7
12
|
}
|
|
8
|
-
declare const _default:
|
|
13
|
+
declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any> & CustomEditorParams<any, any> & React.RefAttributes<ICellEditorReactComp>>;
|
|
9
14
|
export default _default;
|
|
@@ -1,25 +1,80 @@
|
|
|
1
|
-
var _excluded = ["render"];
|
|
2
|
-
|
|
3
1
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
2
|
|
|
5
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
4
|
|
|
7
5
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
6
|
|
|
9
|
-
function
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
+
|
|
9
|
+
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."); }
|
|
10
|
+
|
|
11
|
+
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); }
|
|
10
12
|
|
|
11
|
-
function
|
|
13
|
+
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; }
|
|
12
14
|
|
|
13
|
-
|
|
15
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
16
|
+
|
|
17
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
18
|
+
|
|
19
|
+
import React, { useEffect, useRef } from 'react';
|
|
20
|
+
import { get } from 'lodash';
|
|
21
|
+
import { forwardRef, useImperativeHandle, useState } from 'react';
|
|
22
|
+
import EditorWrapper from "./Wrapper";
|
|
14
23
|
import { useGridStore } from "../hooks";
|
|
15
24
|
export default /*#__PURE__*/forwardRef(function CustomEditor(props, ref) {
|
|
16
|
-
var
|
|
17
|
-
|
|
25
|
+
var api = props.api,
|
|
26
|
+
cellStartedEdit = props.cellStartedEdit,
|
|
27
|
+
stopEditing = props.stopEditing,
|
|
28
|
+
data = props.data,
|
|
29
|
+
render = props.render,
|
|
30
|
+
field = props.colDef.field;
|
|
31
|
+
|
|
32
|
+
var _useState = useState(data),
|
|
33
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
34
|
+
value = _useState2[0],
|
|
35
|
+
setValue = _useState2[1];
|
|
18
36
|
|
|
19
37
|
var context = useGridStore(function (state) {
|
|
20
38
|
return state.context;
|
|
21
39
|
});
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
40
|
+
var elm = useRef(null);
|
|
41
|
+
useEffect(function () {
|
|
42
|
+
if (cellStartedEdit && elm.current !== null) {
|
|
43
|
+
if (elm.current.select !== undefined) {
|
|
44
|
+
elm.current.select();
|
|
45
|
+
} else if (elm.current.focus !== undefined) {
|
|
46
|
+
elm.current.focus();
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}, [cellStartedEdit]);
|
|
50
|
+
useImperativeHandle(ref, function () {
|
|
51
|
+
return {
|
|
52
|
+
getValue: function getValue() {
|
|
53
|
+
return value;
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
});
|
|
57
|
+
|
|
58
|
+
var handleChange = function handleChange(val, action) {
|
|
59
|
+
setValue(val);
|
|
60
|
+
|
|
61
|
+
if (action !== undefined) {
|
|
62
|
+
requestAnimationFrame(function () {
|
|
63
|
+
switch (action) {
|
|
64
|
+
case 'stop':
|
|
65
|
+
stopEditing();
|
|
66
|
+
break;
|
|
67
|
+
|
|
68
|
+
case 'next':
|
|
69
|
+
api.tabToNextCell();
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
return /*#__PURE__*/React.createElement(EditorWrapper, null, render(field ? get(value, field) : null, data, _objectSpread(_objectSpread({}, props), {}, {
|
|
76
|
+
context: context,
|
|
77
|
+
ref: elm,
|
|
78
|
+
onChange: handleChange
|
|
79
|
+
})));
|
|
25
80
|
});
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
2
|
import type { ICellEditorReactComp } from '@ag-grid-community/react';
|
|
3
3
|
import type { ICellEditorParams } from '@ag-grid-community/core';
|
|
4
4
|
import type { SelectProps } from 'antd/lib/select';
|
|
5
|
-
export declare type SelectEditorParams = Pick<SelectProps,
|
|
5
|
+
export declare type SelectEditorParams = Pick<SelectProps<any, {
|
|
6
|
+
label: ReactNode;
|
|
7
|
+
value?: string | number | null | boolean;
|
|
8
|
+
}>, 'disabled' | 'options' | 'fieldNames' | 'virtual' | 'showSearch' | 'listHeight' | 'listItemHeight' | 'allowClear' | 'mode' | 'labelInValue'>;
|
|
6
9
|
declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any> & SelectEditorParams & React.RefAttributes<ICellEditorReactComp>>;
|
|
7
10
|
export default _default;
|
|
@@ -81,6 +81,7 @@ import NumberEditor from "./cell-editors/Number";
|
|
|
81
81
|
import SelectEditor from "./cell-editors/Select";
|
|
82
82
|
import Custom from "./cell-editors/Custom";
|
|
83
83
|
import EditorWrapper from "./cell-editors/Wrapper";
|
|
84
|
+
import Combination from "./cell-editors/Combination";
|
|
84
85
|
import empty from "./empty.png";
|
|
85
86
|
export { AgGridReact } from '@ag-grid-community/react';
|
|
86
87
|
ModuleRegistry.registerModules([ClientSideRowModelModule, RowGroupingModule, InfiniteRowModelModule, ClipboardModule, MenuModule, SideBarModule, ColumnsToolPanelModule, ServerSideRowModelModule], false);
|
|
@@ -367,17 +368,27 @@ var DataGrid = /*#__PURE__*/function (_Component) {
|
|
|
367
368
|
var id = getColField(item);
|
|
368
369
|
|
|
369
370
|
if (id !== undefined) {
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
371
|
+
var path = id.split('.');
|
|
372
|
+
var node = {};
|
|
373
|
+
|
|
374
|
+
for (var i = path.length - 1; i >= 0; i -= 1) {
|
|
375
|
+
node = _defineProperty({}, path[i], i === path.length - 1 ? rules.map(function (rule) {
|
|
376
|
+
var validator = rule.validator,
|
|
377
|
+
restRule = _objectWithoutProperties(rule, _excluded);
|
|
378
|
+
|
|
379
|
+
return _objectSpread(_objectSpread({}, restRule), {}, {
|
|
380
|
+
asyncValidator: validator ? function (mRule, value, _, record) {
|
|
381
|
+
return validator(mRule, value, record);
|
|
382
|
+
} : undefined,
|
|
383
|
+
validator: undefined
|
|
384
|
+
});
|
|
385
|
+
}) : {
|
|
386
|
+
type: 'object',
|
|
387
|
+
fields: node
|
|
379
388
|
});
|
|
380
|
-
}
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
Object.assign(descriptor, node);
|
|
381
392
|
}
|
|
382
393
|
}
|
|
383
394
|
|
|
@@ -533,9 +544,9 @@ var DataGrid = /*#__PURE__*/function (_Component) {
|
|
|
533
544
|
if (_typeof(editable) === 'object') {
|
|
534
545
|
var _type = editable.type,
|
|
535
546
|
params = editable.params,
|
|
536
|
-
_render = editable.render,
|
|
537
547
|
valueSetter = editable.valueSetter;
|
|
538
548
|
_opts.editable = true;
|
|
549
|
+
_opts.cellEditorParams = params;
|
|
539
550
|
_opts.cellClassRules = _defineProperty({}, prefix('editor-cell'), function () {
|
|
540
551
|
return true;
|
|
541
552
|
});
|
|
@@ -563,17 +574,14 @@ var DataGrid = /*#__PURE__*/function (_Component) {
|
|
|
563
574
|
switch (_type) {
|
|
564
575
|
case 'text':
|
|
565
576
|
_opts.cellEditor = TextEditor;
|
|
566
|
-
_opts.cellEditorParams = params;
|
|
567
577
|
break;
|
|
568
578
|
|
|
569
579
|
case 'number':
|
|
570
580
|
_opts.cellEditor = NumberEditor;
|
|
571
|
-
_opts.cellEditorParams = params;
|
|
572
581
|
break;
|
|
573
582
|
|
|
574
583
|
case 'date':
|
|
575
584
|
_opts.cellEditor = DateEditor;
|
|
576
|
-
_opts.cellEditorParams = params;
|
|
577
585
|
|
|
578
586
|
_opts.suppressKeyboardEvent = function (_ref2) {
|
|
579
587
|
var editing = _ref2.editing,
|
|
@@ -590,7 +598,6 @@ var DataGrid = /*#__PURE__*/function (_Component) {
|
|
|
590
598
|
|
|
591
599
|
case 'select':
|
|
592
600
|
_opts.cellEditor = SelectEditor;
|
|
593
|
-
_opts.cellEditorParams = params;
|
|
594
601
|
|
|
595
602
|
_opts.suppressKeyboardEvent = function (_ref3) {
|
|
596
603
|
var editing = _ref3.editing,
|
|
@@ -605,13 +612,19 @@ var DataGrid = /*#__PURE__*/function (_Component) {
|
|
|
605
612
|
|
|
606
613
|
break;
|
|
607
614
|
|
|
615
|
+
case 'combination':
|
|
616
|
+
_opts.cellEditor = Combination;
|
|
617
|
+
break;
|
|
618
|
+
|
|
608
619
|
case 'custom':
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
}
|
|
620
|
+
_opts.cellEditor = Custom;
|
|
621
|
+
|
|
622
|
+
_opts.valueSetter = function (mParams) {
|
|
623
|
+
Object.assign(mParams.data, mParams.newValue);
|
|
624
|
+
return true;
|
|
625
|
+
};
|
|
626
|
+
|
|
627
|
+
break;
|
|
615
628
|
|
|
616
629
|
default:
|
|
617
630
|
}
|
|
@@ -1,18 +1,33 @@
|
|
|
1
|
-
import type { AgGridReactProps
|
|
2
|
-
import type { ColDef, ColGroupDef,
|
|
1
|
+
import type { AgGridReactProps } from '@ag-grid-community/react';
|
|
2
|
+
import type { ColDef, ColGroupDef, ICellRendererParams, IHeaderParams } from '@ag-grid-community/core';
|
|
3
3
|
import type { RuleItem } from 'async-validator/dist-types/interface';
|
|
4
|
-
import type {
|
|
4
|
+
import type { ReactElement, ReactNode } from 'react';
|
|
5
5
|
export type { ColDef, ColGroupDef, ColumnState, GridApi, ICellEditorParams, ICellRendererParams, } from '@ag-grid-community/core';
|
|
6
|
+
export type { AgGridReactProps, ICellEditorReactComp } from '@ag-grid-community/react';
|
|
7
|
+
import type { TextEditorParams } from './cell-editors/Text';
|
|
8
|
+
import type { NumberEditorParams } from './cell-editors/Number';
|
|
9
|
+
import type { DateEditorParams } from './cell-editors/Date';
|
|
10
|
+
import type { SelectEditorParams } from './cell-editors/Select';
|
|
11
|
+
import type { CustomEditorParams } from './cell-editors/Custom';
|
|
12
|
+
import type { CombinationEditorParams } from './cell-editors/Combination';
|
|
6
13
|
export type { TextEditorParams } from './cell-editors/Text';
|
|
7
14
|
export type { NumberEditorParams } from './cell-editors/Number';
|
|
8
15
|
export type { DateEditorParams } from './cell-editors/Date';
|
|
9
16
|
export type { SelectEditorParams } from './cell-editors/Select';
|
|
17
|
+
export type { CombinationEditorParams } from './cell-editors/Combination';
|
|
18
|
+
export type { CustomEditorParams } from './cell-editors/Custom';
|
|
10
19
|
export declare type GetRowKey<T> = string | ((data: T) => string);
|
|
11
20
|
export declare type PathType = string | (string | number)[];
|
|
12
21
|
export declare type ValidateRule<T> = Pick<RuleItem, 'required' | 'message' | 'pattern' | 'min' | 'max' | 'len' | 'type'> & {
|
|
13
22
|
validator?: (rule: any, val: any, record: T) => void | Promise<void>;
|
|
14
23
|
};
|
|
15
|
-
export declare type
|
|
24
|
+
export declare type EditableParams<T extends {
|
|
25
|
+
type: string;
|
|
26
|
+
params?: any;
|
|
27
|
+
}, K> = T & {
|
|
28
|
+
rules?: ValidateRule<K>[];
|
|
29
|
+
valueSetter?: (val: any, data: K) => Partial<K>;
|
|
30
|
+
};
|
|
16
31
|
export interface ColumnType<TData> extends Omit<ColDef<TData>, 'editable'> {
|
|
17
32
|
title?: ReactNode | ((params: IHeaderParams) => ReactNode);
|
|
18
33
|
dataIndex?: PathType;
|
|
@@ -25,19 +40,31 @@ export interface ColumnType<TData> extends Omit<ColDef<TData>, 'editable'> {
|
|
|
25
40
|
/**
|
|
26
41
|
* @description
|
|
27
42
|
* @en cell renderer. it should be a pure function, do not use the state from the closure but from cellContext
|
|
28
|
-
* @zh 单元格渲染函数.
|
|
43
|
+
* @zh 单元格渲染函数. 需要是一个纯函数,不使用外部组件的状态变量,而是通过context引入
|
|
29
44
|
*/
|
|
30
45
|
render?: (val: any, record: TData, index: number, params: ICellRendererParams) => ReactElement | string | number | null;
|
|
31
46
|
/**
|
|
32
47
|
* @description 可编辑单元格
|
|
33
48
|
*/
|
|
34
|
-
editable?: boolean | {
|
|
35
|
-
type
|
|
36
|
-
params?:
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}
|
|
49
|
+
editable?: boolean | EditableParams<{
|
|
50
|
+
type: 'text';
|
|
51
|
+
params?: TextEditorParams;
|
|
52
|
+
}, TData> | EditableParams<{
|
|
53
|
+
type: 'number';
|
|
54
|
+
params?: NumberEditorParams;
|
|
55
|
+
}, TData> | EditableParams<{
|
|
56
|
+
type: 'date';
|
|
57
|
+
params?: DateEditorParams;
|
|
58
|
+
}, TData> | EditableParams<{
|
|
59
|
+
type: 'select';
|
|
60
|
+
params?: SelectEditorParams;
|
|
61
|
+
}, TData> | EditableParams<{
|
|
62
|
+
type: 'combination';
|
|
63
|
+
params?: CombinationEditorParams<TData>;
|
|
64
|
+
}, TData> | EditableParams<{
|
|
65
|
+
type: 'custom';
|
|
66
|
+
params?: CustomEditorParams<TData>;
|
|
67
|
+
}, TData>;
|
|
41
68
|
}
|
|
42
69
|
export interface ColumnGroupType<T> extends Omit<ColGroupDef<T>, 'children'> {
|
|
43
70
|
title?: string | number;
|
|
@@ -26,11 +26,12 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
26
26
|
|
|
27
27
|
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; }
|
|
28
28
|
|
|
29
|
-
import React, { useState, cloneElement, useRef, isValidElement, useEffect } from 'react';
|
|
30
|
-
import { Modal, Input, message } from 'antd';
|
|
29
|
+
import React, { useState, cloneElement, useRef, isValidElement, useEffect, useContext } from 'react';
|
|
30
|
+
import { Modal, Input, message, ConfigProvider } from 'antd';
|
|
31
31
|
import { CloseCircleFilled } from '@ant-design/icons';
|
|
32
|
-
import { PREFIX_CLS } from "../../constants";
|
|
33
32
|
import SearchIcon from "../Icons/Search";
|
|
33
|
+
import { prefixClassName } from "../utils";
|
|
34
|
+
var prefix = prefixClassName('popup');
|
|
34
35
|
|
|
35
36
|
function Popup(props) {
|
|
36
37
|
var valueProp = props.value,
|
|
@@ -55,8 +56,6 @@ function Popup(props) {
|
|
|
55
56
|
emptyValue = props.emptyValue,
|
|
56
57
|
restProps = _objectWithoutProperties(props, _excluded);
|
|
57
58
|
|
|
58
|
-
var prefixCls = "".concat(PREFIX_CLS, "-popup");
|
|
59
|
-
|
|
60
59
|
var _useState = useState(valueProp || emptyValue),
|
|
61
60
|
_useState2 = _slicedToArray(_useState, 2),
|
|
62
61
|
value = _useState2[0],
|
|
@@ -69,6 +68,9 @@ function Popup(props) {
|
|
|
69
68
|
|
|
70
69
|
var inputRef = useRef(null);
|
|
71
70
|
|
|
71
|
+
var _useContext = useContext(ConfigProvider.ConfigContext),
|
|
72
|
+
getPrefixCls = _useContext.getPrefixCls;
|
|
73
|
+
|
|
72
74
|
var handleCancel = function handleCancel() {
|
|
73
75
|
setVisible(false);
|
|
74
76
|
};
|
|
@@ -180,7 +182,7 @@ function Popup(props) {
|
|
|
180
182
|
trigger = showLabel ? /*#__PURE__*/cloneElement(children, undefined, label) : children;
|
|
181
183
|
} else {
|
|
182
184
|
trigger = /*#__PURE__*/React.createElement(Input, {
|
|
183
|
-
className:
|
|
185
|
+
className: prefix('input'),
|
|
184
186
|
value: label,
|
|
185
187
|
readOnly: true,
|
|
186
188
|
ref: inputRef,
|
|
@@ -189,7 +191,7 @@ function Popup(props) {
|
|
|
189
191
|
placeholder: placeholder,
|
|
190
192
|
bordered: bordered,
|
|
191
193
|
suffix: /*#__PURE__*/React.createElement(React.Fragment, null, !disabled && allowClear && label && /*#__PURE__*/React.createElement(CloseCircleFilled, {
|
|
192
|
-
className: "
|
|
194
|
+
className: "".concat(getPrefixCls('input'), "-clear-icon"),
|
|
193
195
|
onClick: handleClear
|
|
194
196
|
}), /*#__PURE__*/React.createElement(SearchIcon, null))
|
|
195
197
|
});
|
|
@@ -201,11 +203,11 @@ function Popup(props) {
|
|
|
201
203
|
}
|
|
202
204
|
}, [valueProp]);
|
|
203
205
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
204
|
-
className:
|
|
206
|
+
className: prefix('wrapper'),
|
|
205
207
|
onClick: handleOpen
|
|
206
208
|
}, trigger), /*#__PURE__*/React.createElement(Modal, _extends({
|
|
207
209
|
destroyOnClose: true,
|
|
208
|
-
|
|
210
|
+
open: visible,
|
|
209
211
|
width: 994,
|
|
210
212
|
centered: true,
|
|
211
213
|
onCancel: handleCancel,
|