doui-react 2.0.7 → 2.0.8
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/color-picker/component/index.d.ts +2 -0
- package/es/color-picker/component/index.js +17 -0
- package/es/color-picker/index.d.ts +2 -0
- package/es/color-picker/index.js +2 -0
- package/es/color-picker/type/index.d.ts +7 -0
- package/es/color-picker/type/index.js +1 -0
- package/es/form/component/form-item-map.d.ts +2 -0
- package/es/form/component/form-item-map.js +2 -0
- package/es/form/component/utils.d.ts +8 -8
- package/es/index.d.ts +2 -1
- package/es/index.js +1 -0
- package/es/open-modal/style/index.js +1 -1
- package/es/radio/component/abstract-box.d.ts +30 -30
- package/es/table/component/display-column.d.ts +2 -0
- package/es/table/component/display-column.js +95 -0
- package/es/table/component/index.d.ts +2 -0
- package/es/table/component/index.js +3 -1
- package/es/table/component/table.js +3 -1
- package/es/table/component/utils.d.ts +2 -2
- package/es/table/component/utils.js +37 -20
- package/es/table/style/index.d.ts +1 -0
- package/es/table/style/index.js +3 -2
- package/es/table/type/display-column.d.ts +9 -0
- package/es/table/type/display-column.js +1 -0
- package/es/table/type/index.d.ts +6 -0
- package/es/table/type/index.js +1 -0
- package/es/tabs/component/utils.d.ts +7 -7
- package/lib/color-picker/component/index.d.ts +2 -0
- package/lib/color-picker/component/index.js +24 -0
- package/lib/color-picker/index.d.ts +2 -0
- package/lib/color-picker/index.js +27 -0
- package/lib/color-picker/type/index.d.ts +7 -0
- package/lib/color-picker/type/index.js +5 -0
- package/lib/form/component/form-item-map.d.ts +2 -0
- package/lib/form/component/form-item-map.js +2 -0
- package/lib/form/component/utils.d.ts +8 -8
- package/lib/index.d.ts +2 -1
- package/lib/index.js +8 -0
- package/lib/open-modal/style/index.js +1 -1
- package/lib/radio/component/abstract-box.d.ts +30 -30
- package/lib/table/component/display-column.d.ts +2 -0
- package/lib/table/component/display-column.js +102 -0
- package/lib/table/component/index.d.ts +2 -0
- package/lib/table/component/index.js +3 -1
- package/lib/table/component/table.js +3 -1
- package/lib/table/component/utils.d.ts +2 -2
- package/lib/table/component/utils.js +38 -20
- package/lib/table/style/index.d.ts +1 -0
- package/lib/table/style/index.js +3 -2
- package/lib/table/type/display-column.d.ts +9 -0
- package/lib/table/type/display-column.js +5 -0
- package/lib/table/type/index.d.ts +6 -0
- package/lib/table/type/index.js +11 -0
- package/lib/tabs/component/utils.d.ts +7 -7
- package/package.json +1 -1
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["onChange"];
|
|
4
|
+
import { getPopupContainer } from "../../api";
|
|
5
|
+
import { ColorPicker as AntdColorPicker } from 'antd';
|
|
6
|
+
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
7
|
+
export function ColorPicker(_ref) {
|
|
8
|
+
var _onChange = _ref.onChange,
|
|
9
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
10
|
+
return _jsx(AntdColorPicker, _objectSpread({
|
|
11
|
+
allowClear: true,
|
|
12
|
+
onChange: function onChange(color) {
|
|
13
|
+
_onChange === null || _onChange === void 0 || _onChange(color.cleared ? undefined : color.toHexString());
|
|
14
|
+
},
|
|
15
|
+
getPopupContainer: getPopupContainer
|
|
16
|
+
}, props));
|
|
17
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CheckboxProps } from "../../checkbox";
|
|
3
|
+
import { ColorPicker } from "../../color-picker";
|
|
3
4
|
import { DatePicker, RangePicker } from "../../date-picker";
|
|
4
5
|
import { FormInstance, FormItemContext, FormItemProps } from "..";
|
|
5
6
|
import { Radio } from "../../radio";
|
|
@@ -35,6 +36,7 @@ export declare const formItemMap: {
|
|
|
35
36
|
switch: typeof Switch;
|
|
36
37
|
radio: typeof Radio;
|
|
37
38
|
slider: import("react").ForwardRefExoticComponent<(import("antd").SliderSingleProps | import("antd/es/slider").SliderRangeProps) & import("react").RefAttributes<import("rc-slider").SliderRef>>;
|
|
39
|
+
colorPicker: typeof ColorPicker;
|
|
38
40
|
date: typeof DatePicker;
|
|
39
41
|
rangeDate: typeof RangePicker;
|
|
40
42
|
};
|
|
@@ -4,6 +4,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
5
|
var _excluded = ["name", "collectState", "filterNotExistValue", "requiredInOptions", "form"];
|
|
6
6
|
import { Checkbox } from "../../checkbox";
|
|
7
|
+
import { ColorPicker } from "../../color-picker";
|
|
7
8
|
import { DatePicker, RangePicker } from "../../date-picker";
|
|
8
9
|
import { useFormContext } from "./..";
|
|
9
10
|
import { useDebounce } from "../../hooks";
|
|
@@ -116,6 +117,7 @@ export var formItemMap = _objectSpread({
|
|
|
116
117
|
switch: Switch,
|
|
117
118
|
radio: Radio,
|
|
118
119
|
slider: Slider,
|
|
120
|
+
colorPicker: ColorPicker,
|
|
119
121
|
date: DatePicker,
|
|
120
122
|
rangeDate: RangePicker
|
|
121
123
|
}, supportCollectStateItem);
|
|
@@ -38,26 +38,26 @@ export declare function getFormItemProps(props: any): {
|
|
|
38
38
|
defaultVisible?: boolean | undefined;
|
|
39
39
|
onVisibleChange?: ((visible: boolean) => void) | undefined;
|
|
40
40
|
afterVisibleChange?: ((visible: boolean) => void) | undefined;
|
|
41
|
-
zIndex?: number | undefined;
|
|
42
|
-
animation?: string | undefined;
|
|
43
|
-
motion?: import("rc-motion").CSSMotionProps | undefined;
|
|
44
|
-
transitionName?: string | undefined;
|
|
45
41
|
prefixCls?: string | undefined;
|
|
46
|
-
forceRender?: boolean | undefined;
|
|
47
|
-
id?: string | undefined;
|
|
48
|
-
align?: import("@rc-component/trigger").AlignType | undefined;
|
|
49
42
|
onPopupAlign?: ((element: HTMLElement, align: import("@rc-component/trigger").AlignType) => void) | undefined;
|
|
50
43
|
fresh?: boolean | undefined;
|
|
51
44
|
mouseLeaveDelay?: number | undefined;
|
|
52
45
|
mouseEnterDelay?: number | undefined;
|
|
46
|
+
forceRender?: boolean | undefined;
|
|
53
47
|
popupVisible?: boolean | undefined;
|
|
54
48
|
trigger?: import("@rc-component/trigger").ActionType | import("@rc-component/trigger").ActionType[] | undefined;
|
|
49
|
+
transitionName?: string | undefined;
|
|
50
|
+
animation?: string | undefined;
|
|
51
|
+
motion?: import("rc-motion").CSSMotionProps | undefined;
|
|
55
52
|
overlayStyle?: import("react").CSSProperties | undefined;
|
|
56
53
|
overlayClassName?: string | undefined;
|
|
57
54
|
getTooltipContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
|
|
55
|
+
align?: import("@rc-component/trigger").AlignType | undefined;
|
|
58
56
|
showArrow?: boolean | import("@rc-component/trigger").ArrowType | undefined;
|
|
59
57
|
arrowContent?: import("react").ReactNode;
|
|
58
|
+
id?: string | undefined;
|
|
60
59
|
overlayInnerStyle?: import("react").CSSProperties | undefined;
|
|
60
|
+
zIndex?: number | undefined;
|
|
61
61
|
icon: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
62
62
|
} | undefined;
|
|
63
63
|
initialValue: any;
|
|
@@ -85,7 +85,7 @@ export declare function transformPathToName(path?: NamePath): string | undefined
|
|
|
85
85
|
export declare function transformKeyToPath(params?: Record<string, any>): Record<string, any>;
|
|
86
86
|
export declare function parseFormFailedError(error: ValidateErrorEntity): Record<string, string>;
|
|
87
87
|
export declare function noStyle(item: FormItemProps): boolean;
|
|
88
|
-
export declare function transformOptions(item: FormItemProps, values: FormValues, params: CommonParams): ((values: FormValues, params: import("..").OptionsParams) => import("../../api").FunctionReturn<SelectOptions>) |
|
|
88
|
+
export declare function transformOptions(item: FormItemProps, values: FormValues, params: CommonParams): import("../../api").FunctionReturn<SelectOptions> | ((values: FormValues, params: import("..").OptionsParams) => import("../../api").FunctionReturn<SelectOptions>) | ((search?: string) => import("../../api").FunctionReturn<SelectOptions>) | undefined;
|
|
89
89
|
interface FocusFirstInputParams extends CommonParams {
|
|
90
90
|
focusFirstOnMount: FormProps['focusFirstOnMount'];
|
|
91
91
|
}
|
package/es/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ export * from './hooks';
|
|
|
3
3
|
export * from './icon';
|
|
4
4
|
export { Button, type ButtonProps } from './button';
|
|
5
5
|
export { Checkbox, type CheckboxProps } from './checkbox';
|
|
6
|
+
export { ColorPicker, type ColorPickerProps } from './color-picker';
|
|
6
7
|
export { DatePicker, RangePicker, type DatePickerProps, type RangePickerProps } from './date-picker';
|
|
7
8
|
export { Empty, type EmptyProps } from './empty';
|
|
8
9
|
export { Form, useForm, useFormContext, useFormListContext, useFormValue, useFormValueChange, useValidateForm, useValidateNotExistValue, type FormContext, type FormItemChildrenProps, type FormItemProps, type FormItemRenderProps, type FormProps, type FormValues, type SubmitButtonProps, } from './form';
|
|
@@ -16,7 +17,7 @@ export { Radio, type RadioProps } from './radio';
|
|
|
16
17
|
export { Select, type SelectProps } from './select';
|
|
17
18
|
export { CenterStack, HStack, VStack, type CenterStackProps, type HStackProps, type VStackProps } from './stack';
|
|
18
19
|
export { Switch, type SwitchProps } from './switch';
|
|
19
|
-
export { Table, useSearchColumn, useTableContext, type ActionProps as TableActionProps, type Column as TableColumn, type RenderProps as TableColumnRenderProps, type TableContext, type TableProps, } from './table';
|
|
20
|
+
export { Table, useSearchColumn, useTableContext, type DisplayColumnProps, type ActionProps as TableActionProps, type Column as TableColumn, type RenderProps as TableColumnRenderProps, type TableContext, type TableProps, } from './table';
|
|
20
21
|
export { Tabs, type TabsProps } from './tabs';
|
|
21
22
|
export { Text, type TextProps } from './text';
|
|
22
23
|
export { Tooltip, type TooltipProps } from './tooltip';
|
package/es/index.js
CHANGED
|
@@ -3,6 +3,7 @@ export * from "./hooks";
|
|
|
3
3
|
export * from "./icon";
|
|
4
4
|
export { Button } from "./button";
|
|
5
5
|
export { Checkbox } from "./checkbox";
|
|
6
|
+
export { ColorPicker } from "./color-picker";
|
|
6
7
|
export { DatePicker, RangePicker } from "./date-picker";
|
|
7
8
|
export { Empty } from "./empty";
|
|
8
9
|
export { Form, useForm, useFormContext, useFormListContext, useFormValue, useFormValueChange, useValidateForm, useValidateNotExistValue } from "./form";
|
|
@@ -12,7 +12,7 @@ var style = {
|
|
|
12
12
|
wrapper: function wrapper(_ref) {
|
|
13
13
|
var bodyBottomMargin = _ref.bodyBottomMargin,
|
|
14
14
|
titleCenter = _ref.titleCenter;
|
|
15
|
-
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n .ant-modal-title {\n font-size: 16px;\n ", "\n }\n\n .ant-modal-body {\n overflow: auto;\n max-height: calc(100vh - 300px);\n border-top: 1px solid #f0f0f0;\n border-bottom: 1px solid #f0f0f0;\n margin: 15px 0 20px;\n padding: 20px 0 ", ";\n }\n\n .do-table-wrapper {\n height: unset;\n }\n\n &:not(:has(.ant-modal-footer)) {\n .", " {\n display: none;\n }\n }\n "])), titleStyle(titleCenter), bodyBottomMargin, getClassName('footer-divider'));
|
|
15
|
+
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n .ant-modal-title {\n font-size: 16px;\n ", "\n }\n\n .ant-modal-body {\n overflow: hidden auto;\n max-height: calc(100vh - 300px);\n border-top: 1px solid #f0f0f0;\n border-bottom: 1px solid #f0f0f0;\n margin: 15px 0 20px;\n padding: 20px 0 ", ";\n }\n\n .do-table-wrapper {\n height: unset;\n }\n\n &:not(:has(.ant-modal-footer)) {\n .", " {\n display: none;\n }\n }\n "])), titleStyle(titleCenter), bodyBottomMargin, getClassName('footer-divider'));
|
|
16
16
|
}
|
|
17
17
|
};
|
|
18
18
|
export default style;
|
|
@@ -36,26 +36,26 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
36
36
|
defaultVisible?: boolean | undefined;
|
|
37
37
|
onVisibleChange?: ((visible: boolean) => void) | undefined;
|
|
38
38
|
afterVisibleChange?: ((visible: boolean) => void) | undefined;
|
|
39
|
-
zIndex?: number | undefined;
|
|
40
|
-
animation?: string | undefined;
|
|
41
|
-
motion?: import("rc-motion").CSSMotionProps | undefined;
|
|
42
|
-
transitionName?: string | undefined;
|
|
43
39
|
prefixCls?: string | undefined;
|
|
44
|
-
forceRender?: boolean | undefined;
|
|
45
|
-
id?: string | undefined;
|
|
46
|
-
align?: import("@rc-component/trigger").AlignType | undefined;
|
|
47
40
|
onPopupAlign?: ((element: HTMLElement, align: import("@rc-component/trigger").AlignType) => void) | undefined;
|
|
48
41
|
fresh?: boolean | undefined;
|
|
49
42
|
mouseLeaveDelay?: number | undefined;
|
|
50
43
|
mouseEnterDelay?: number | undefined;
|
|
44
|
+
forceRender?: boolean | undefined;
|
|
51
45
|
popupVisible?: boolean | undefined;
|
|
52
46
|
trigger?: import("@rc-component/trigger").ActionType | import("@rc-component/trigger").ActionType[] | undefined;
|
|
47
|
+
transitionName?: string | undefined;
|
|
48
|
+
animation?: string | undefined;
|
|
49
|
+
motion?: import("rc-motion").CSSMotionProps | undefined;
|
|
53
50
|
overlayStyle?: import("react").CSSProperties | undefined;
|
|
54
51
|
overlayClassName?: string | undefined;
|
|
55
52
|
getTooltipContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
|
|
53
|
+
align?: import("@rc-component/trigger").AlignType | undefined;
|
|
56
54
|
showArrow?: boolean | import("@rc-component/trigger").ArrowType | undefined;
|
|
57
55
|
arrowContent?: import("react").ReactNode;
|
|
56
|
+
id?: string | undefined;
|
|
58
57
|
overlayInnerStyle?: import("react").CSSProperties | undefined;
|
|
58
|
+
zIndex?: number | undefined;
|
|
59
59
|
};
|
|
60
60
|
boxProps: {
|
|
61
61
|
onChange(e: CheckboxChangeEvent): void;
|
|
@@ -65,50 +65,49 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
65
65
|
value?: any;
|
|
66
66
|
boxTooltip?: import("react").ReactNode | import("antd").TooltipProps;
|
|
67
67
|
inGroup?: boolean | undefined;
|
|
68
|
+
prefixCls?: string | undefined;
|
|
69
|
+
disabled?: boolean | undefined;
|
|
68
70
|
className?: string | undefined;
|
|
69
71
|
style?: import("react").CSSProperties | undefined;
|
|
70
|
-
|
|
71
|
-
prefixCls?: string | undefined;
|
|
72
|
+
id?: string | undefined;
|
|
72
73
|
rootClassName?: string | undefined;
|
|
74
|
+
checked?: boolean | undefined;
|
|
73
75
|
name?: string | undefined;
|
|
76
|
+
required?: boolean | undefined;
|
|
77
|
+
type?: string | undefined;
|
|
74
78
|
defaultChecked?: boolean | undefined;
|
|
75
79
|
autoFocus?: boolean | undefined;
|
|
76
|
-
id?: string | undefined;
|
|
77
80
|
tabIndex?: number | undefined;
|
|
81
|
+
title?: string | undefined;
|
|
78
82
|
onKeyDown?: import("react").KeyboardEventHandler<HTMLElement> | undefined;
|
|
79
83
|
onKeyPress?: import("react").KeyboardEventHandler<HTMLElement> | undefined;
|
|
80
84
|
onClick?: import("react").MouseEventHandler<HTMLElement> | undefined;
|
|
81
85
|
onMouseEnter?: import("react").MouseEventHandler<HTMLElement> | undefined;
|
|
82
86
|
onMouseLeave?: import("react").MouseEventHandler<HTMLElement> | undefined;
|
|
83
|
-
disabled?: boolean | undefined;
|
|
84
|
-
type?: string | undefined;
|
|
85
|
-
checked?: boolean | undefined;
|
|
86
|
-
required?: boolean | undefined;
|
|
87
87
|
indeterminate?: boolean | undefined;
|
|
88
88
|
skipGroup?: boolean | undefined;
|
|
89
|
-
color?: string | undefined;
|
|
90
|
-
content?: string | undefined;
|
|
91
|
-
direction?: import("antd/es/config-provider").DirectionType;
|
|
92
|
-
translate?: "yes" | "no" | undefined;
|
|
93
|
-
onSubmit?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
94
89
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
90
|
+
color?: string | undefined;
|
|
91
|
+
rows?: number | false | undefined;
|
|
95
92
|
suppressContentEditableWarning?: boolean | undefined;
|
|
96
93
|
suppressHydrationWarning?: boolean | undefined;
|
|
97
94
|
accessKey?: string | undefined;
|
|
98
|
-
autoCapitalize?: (string & {}) | "
|
|
99
|
-
contentEditable?: (boolean | "true" | "false") | "
|
|
95
|
+
autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
|
|
96
|
+
contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
|
|
100
97
|
contextMenu?: string | undefined;
|
|
101
98
|
dir?: string | undefined;
|
|
102
99
|
draggable?: (boolean | "true" | "false") | undefined;
|
|
103
|
-
enterKeyHint?: "
|
|
100
|
+
enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
|
|
104
101
|
hidden?: boolean | undefined;
|
|
105
102
|
lang?: string | undefined;
|
|
106
103
|
nonce?: string | undefined;
|
|
107
104
|
slot?: string | undefined;
|
|
108
105
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
106
|
+
translate?: "yes" | "no" | undefined;
|
|
109
107
|
radioGroup?: string | undefined;
|
|
110
108
|
role?: import("react").AriaRole | undefined;
|
|
111
109
|
about?: string | undefined;
|
|
110
|
+
content?: string | undefined;
|
|
112
111
|
datatype?: string | undefined;
|
|
113
112
|
inlist?: any;
|
|
114
113
|
prefix?: string | undefined;
|
|
@@ -128,13 +127,13 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
128
127
|
results?: number | undefined;
|
|
129
128
|
security?: string | undefined;
|
|
130
129
|
unselectable?: "off" | "on" | undefined;
|
|
131
|
-
inputMode?: "
|
|
130
|
+
inputMode?: "search" | "none" | "text" | "email" | "tel" | "url" | "numeric" | "decimal" | undefined;
|
|
132
131
|
is?: string | undefined;
|
|
133
132
|
exportparts?: string | undefined;
|
|
134
133
|
part?: string | undefined;
|
|
135
134
|
"aria-activedescendant"?: string | undefined;
|
|
136
135
|
"aria-atomic"?: (boolean | "true" | "false") | undefined;
|
|
137
|
-
"aria-autocomplete"?: "
|
|
136
|
+
"aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
|
|
138
137
|
"aria-braillelabel"?: string | undefined;
|
|
139
138
|
"aria-brailleroledescription"?: string | undefined;
|
|
140
139
|
"aria-busy"?: (boolean | "true" | "false") | undefined;
|
|
@@ -144,17 +143,17 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
144
143
|
"aria-colindextext"?: string | undefined;
|
|
145
144
|
"aria-colspan"?: number | undefined;
|
|
146
145
|
"aria-controls"?: string | undefined;
|
|
147
|
-
"aria-current"?: boolean | "
|
|
146
|
+
"aria-current"?: boolean | "step" | "true" | "false" | "page" | "location" | "date" | "time" | undefined;
|
|
148
147
|
"aria-describedby"?: string | undefined;
|
|
149
148
|
"aria-description"?: string | undefined;
|
|
150
149
|
"aria-details"?: string | undefined;
|
|
151
150
|
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
152
|
-
"aria-dropeffect"?: "
|
|
151
|
+
"aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
|
|
153
152
|
"aria-errormessage"?: string | undefined;
|
|
154
153
|
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
155
154
|
"aria-flowto"?: string | undefined;
|
|
156
155
|
"aria-grabbed"?: (boolean | "true" | "false") | undefined;
|
|
157
|
-
"aria-haspopup"?: boolean | "
|
|
156
|
+
"aria-haspopup"?: boolean | "true" | "false" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
|
|
158
157
|
"aria-hidden"?: (boolean | "true" | "false") | undefined;
|
|
159
158
|
"aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
|
|
160
159
|
"aria-keyshortcuts"?: string | undefined;
|
|
@@ -165,13 +164,13 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
165
164
|
"aria-modal"?: (boolean | "true" | "false") | undefined;
|
|
166
165
|
"aria-multiline"?: (boolean | "true" | "false") | undefined;
|
|
167
166
|
"aria-multiselectable"?: (boolean | "true" | "false") | undefined;
|
|
168
|
-
"aria-orientation"?: "
|
|
167
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined;
|
|
169
168
|
"aria-owns"?: string | undefined;
|
|
170
169
|
"aria-placeholder"?: string | undefined;
|
|
171
170
|
"aria-posinset"?: number | undefined;
|
|
172
171
|
"aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
|
|
173
172
|
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
174
|
-
"aria-relevant"?: "
|
|
173
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
|
|
175
174
|
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
176
175
|
"aria-roledescription"?: string | undefined;
|
|
177
176
|
"aria-rowcount"?: number | undefined;
|
|
@@ -209,6 +208,7 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
209
208
|
onInputCapture?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
210
209
|
onReset?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
211
210
|
onResetCapture?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
211
|
+
onSubmit?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
212
212
|
onSubmitCapture?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
213
213
|
onInvalid?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
214
214
|
onInvalidCapture?: import("react").FormEventHandler<HTMLElement> | undefined;
|
|
@@ -337,8 +337,8 @@ export declare function useAbstractBox({ refs, boxTooltip, value, onChange, inGr
|
|
|
337
337
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLElement> | undefined;
|
|
338
338
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLElement> | undefined;
|
|
339
339
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLElement> | undefined;
|
|
340
|
+
direction?: import("antd/es/config-provider").DirectionType;
|
|
340
341
|
tooltip?: import("react").ReactNode | import("antd").TooltipProps;
|
|
341
|
-
rows?: number | false | undefined;
|
|
342
342
|
autoShowTooltip?: boolean | undefined;
|
|
343
343
|
refs?: import("../../api").Refs | undefined;
|
|
344
344
|
ref: import("../../api").Refs | undefined;
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
3
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
|
+
var _excluded = ["value", "onChange", "storageKey"];
|
|
5
|
+
import { getPopupContainer } from "../../api";
|
|
6
|
+
import { Button } from "../../button";
|
|
7
|
+
import { Checkbox } from "../../checkbox";
|
|
8
|
+
import { useTableContext } from "./..";
|
|
9
|
+
import { SettingOutlined } from '@ant-design/icons';
|
|
10
|
+
import { Popover } from 'antd';
|
|
11
|
+
import _ from 'lodash';
|
|
12
|
+
import { useEffect } from 'react';
|
|
13
|
+
import { useLocalStorage } from 'react-use';
|
|
14
|
+
import style from "../style";
|
|
15
|
+
import { isActionsColumn } from "./utils";
|
|
16
|
+
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
17
|
+
function useControllableState(_ref) {
|
|
18
|
+
var value = _ref.value,
|
|
19
|
+
onChange = _ref.onChange,
|
|
20
|
+
_ref$storageKey = _ref.storageKey,
|
|
21
|
+
storageKey = _ref$storageKey === void 0 ? 'default' : _ref$storageKey,
|
|
22
|
+
defaultOptions = _ref.defaultOptions;
|
|
23
|
+
var finalStorageKey = "table-display-column-".concat(storageKey);
|
|
24
|
+
var _useLocalStorage = useLocalStorage(finalStorageKey, defaultOptions),
|
|
25
|
+
_useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
|
|
26
|
+
internalValue = _useLocalStorage2[0],
|
|
27
|
+
setInternalValue = _useLocalStorage2[1];
|
|
28
|
+
var _useTableContext = useTableContext(),
|
|
29
|
+
setContext = _useTableContext.setContext;
|
|
30
|
+
var finalValue = value !== null && value !== void 0 ? value : internalValue;
|
|
31
|
+
useEffect(function () {
|
|
32
|
+
setContext({
|
|
33
|
+
displayColumnKeys: finalValue
|
|
34
|
+
});
|
|
35
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
36
|
+
}, [finalValue]);
|
|
37
|
+
return {
|
|
38
|
+
value: finalValue,
|
|
39
|
+
onChange: onChange !== null && onChange !== void 0 ? onChange : setInternalValue
|
|
40
|
+
};
|
|
41
|
+
}
|
|
42
|
+
function useOptions() {
|
|
43
|
+
var _useTableContext2 = useTableContext(),
|
|
44
|
+
columns = _useTableContext2.columns;
|
|
45
|
+
var options = _.filter(columns, function (column) {
|
|
46
|
+
return column.title && !isActionsColumn(column);
|
|
47
|
+
}).map(function (column) {
|
|
48
|
+
return {
|
|
49
|
+
label: column.title,
|
|
50
|
+
value: column.dataIndex
|
|
51
|
+
};
|
|
52
|
+
});
|
|
53
|
+
return {
|
|
54
|
+
options: options,
|
|
55
|
+
defaultOptions: _.map(options, 'value')
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
function Content(props) {
|
|
59
|
+
var _useOptions = useOptions(),
|
|
60
|
+
options = _useOptions.options,
|
|
61
|
+
defaultOptions = _useOptions.defaultOptions;
|
|
62
|
+
var _useControllableState = useControllableState(_objectSpread(_objectSpread({}, props), {}, {
|
|
63
|
+
defaultOptions: defaultOptions
|
|
64
|
+
})),
|
|
65
|
+
value = _useControllableState.value,
|
|
66
|
+
onChange = _useControllableState.onChange;
|
|
67
|
+
return _jsx(Checkbox, {
|
|
68
|
+
value: value,
|
|
69
|
+
onChange: onChange,
|
|
70
|
+
options: options,
|
|
71
|
+
sort: false,
|
|
72
|
+
css: style.displayColumn
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
export function DisplayColumn(_ref2) {
|
|
76
|
+
var value = _ref2.value,
|
|
77
|
+
onChange = _ref2.onChange,
|
|
78
|
+
storageKey = _ref2.storageKey,
|
|
79
|
+
props = _objectWithoutProperties(_ref2, _excluded);
|
|
80
|
+
return _jsx(Popover, {
|
|
81
|
+
placement: "bottomRight",
|
|
82
|
+
arrow: false,
|
|
83
|
+
trigger: "click",
|
|
84
|
+
forceRender: true,
|
|
85
|
+
getPopupContainer: getPopupContainer,
|
|
86
|
+
content: _jsx(Content, {
|
|
87
|
+
value: value,
|
|
88
|
+
onChange: onChange,
|
|
89
|
+
storageKey: storageKey
|
|
90
|
+
}),
|
|
91
|
+
children: _jsx(Button, _objectSpread({
|
|
92
|
+
icon: _jsx(SettingOutlined, {})
|
|
93
|
+
}, props))
|
|
94
|
+
});
|
|
95
|
+
}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { ActionButton } from './action-button';
|
|
2
|
+
import { DisplayColumn } from './display-column';
|
|
2
3
|
import { Table as InternalTable } from './table';
|
|
3
4
|
type TableType = typeof InternalTable & {
|
|
4
5
|
ActionButton: typeof ActionButton;
|
|
6
|
+
DisplayColumn: typeof DisplayColumn;
|
|
5
7
|
};
|
|
6
8
|
export declare const Table: TableType;
|
|
7
9
|
export {};
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { ActionButton } from "./action-button";
|
|
2
|
+
import { DisplayColumn } from "./display-column";
|
|
2
3
|
import { Table as InternalTable } from "./table";
|
|
3
4
|
export var Table = InternalTable;
|
|
4
|
-
Table.ActionButton = ActionButton;
|
|
5
|
+
Table.ActionButton = ActionButton;
|
|
6
|
+
Table.DisplayColumn = DisplayColumn;
|
|
@@ -104,6 +104,7 @@ function useInit(_ref2) {
|
|
|
104
104
|
},
|
|
105
105
|
operation: operation,
|
|
106
106
|
rowKey: rowKey,
|
|
107
|
+
columns: columns,
|
|
107
108
|
editorValueKey: editorValueKey
|
|
108
109
|
});
|
|
109
110
|
function updateSelectedStatus(keys) {
|
|
@@ -188,7 +189,8 @@ export function useTable(_ref4) {
|
|
|
188
189
|
columns: _.reject(restProps.columns, {
|
|
189
190
|
type: 'selection'
|
|
190
191
|
}),
|
|
191
|
-
getSearchColumn: getSearchColumn
|
|
192
|
+
getSearchColumn: getSearchColumn,
|
|
193
|
+
context: params.context
|
|
192
194
|
});
|
|
193
195
|
return _objectSpread(_objectSpread(_objectSpread({
|
|
194
196
|
onRow: function onRow(record) {
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { FormInstance, FormProps } from "../../form";
|
|
2
|
-
import type { ColumnType } from 'antd/es/table';
|
|
3
2
|
import type { TableRowSelection } from 'antd/es/table/interface';
|
|
4
3
|
import { Column, DataSource, GetSearchColumn, TableContext, TableProps } from '../type';
|
|
5
4
|
import { Actions } from './actions';
|
|
@@ -20,7 +19,8 @@ export declare const componentMap: {
|
|
|
20
19
|
editor: typeof Editor;
|
|
21
20
|
default: (props: any) => any;
|
|
22
21
|
};
|
|
23
|
-
export declare function
|
|
22
|
+
export declare function isActionsColumn(column: Column): boolean;
|
|
23
|
+
export declare function generateColumns({ columns, getSearchColumn, context }: GenerateColumnsProps): Column[];
|
|
24
24
|
interface RowSelectionProps {
|
|
25
25
|
rowKey: string;
|
|
26
26
|
columns: Column[];
|
|
@@ -27,9 +27,22 @@ export var componentMap = {
|
|
|
27
27
|
return props.children;
|
|
28
28
|
}
|
|
29
29
|
};
|
|
30
|
-
|
|
31
|
-
var
|
|
32
|
-
|
|
30
|
+
function isHiddenColumn(_ref) {
|
|
31
|
+
var context = _ref.context,
|
|
32
|
+
column = _ref.column;
|
|
33
|
+
var displayColumnKeys = _.get(context, 'displayColumnKeys');
|
|
34
|
+
if (!displayColumnKeys || isActionsColumn(column)) {
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
return !_.includes(displayColumnKeys, column.dataIndex);
|
|
38
|
+
}
|
|
39
|
+
export function isActionsColumn(column) {
|
|
40
|
+
return column.type === 'actions';
|
|
41
|
+
}
|
|
42
|
+
export function generateColumns(_ref2) {
|
|
43
|
+
var columns = _ref2.columns,
|
|
44
|
+
getSearchColumn = _ref2.getSearchColumn,
|
|
45
|
+
context = _ref2.context;
|
|
33
46
|
return _.map(columns, function (column) {
|
|
34
47
|
var newColumn = _.clone(column);
|
|
35
48
|
var dataIndex = newColumn.dataIndex,
|
|
@@ -55,7 +68,7 @@ export function generateColumns(_ref) {
|
|
|
55
68
|
if (!_.isEmpty(filters)) {
|
|
56
69
|
_.assign(newColumn, getFilterColumn(newColumn));
|
|
57
70
|
}
|
|
58
|
-
if (newColumn
|
|
71
|
+
if (isActionsColumn(newColumn)) {
|
|
59
72
|
var _newColumn$fixed;
|
|
60
73
|
(_newColumn$fixed = newColumn.fixed) !== null && _newColumn$fixed !== void 0 ? _newColumn$fixed : newColumn.fixed = 'right';
|
|
61
74
|
}
|
|
@@ -84,6 +97,10 @@ export function generateColumns(_ref) {
|
|
|
84
97
|
};
|
|
85
98
|
return _objectSpread(_objectSpread({}, newColumn), {}, {
|
|
86
99
|
dataIndex: transformNameToPath(dataIndex),
|
|
100
|
+
hidden: isHiddenColumn({
|
|
101
|
+
context: context,
|
|
102
|
+
column: newColumn
|
|
103
|
+
}),
|
|
87
104
|
align: align,
|
|
88
105
|
render: render
|
|
89
106
|
});
|
|
@@ -110,10 +127,10 @@ function renderComponent(props) {
|
|
|
110
127
|
children: _jsx(Component, _objectSpread({}, props))
|
|
111
128
|
}));
|
|
112
129
|
}
|
|
113
|
-
function getColumnWidth(
|
|
114
|
-
var width =
|
|
115
|
-
minWidth =
|
|
116
|
-
maxWidth =
|
|
130
|
+
function getColumnWidth(_ref3) {
|
|
131
|
+
var width = _ref3.width,
|
|
132
|
+
minWidth = _ref3.minWidth,
|
|
133
|
+
maxWidth = _ref3.maxWidth;
|
|
117
134
|
var style;
|
|
118
135
|
if (_.isNil(width)) {
|
|
119
136
|
style = {
|
|
@@ -132,10 +149,10 @@ function getColumnWidth(_ref2) {
|
|
|
132
149
|
}
|
|
133
150
|
};
|
|
134
151
|
}
|
|
135
|
-
export function getRowSelection(
|
|
136
|
-
var rowKey =
|
|
137
|
-
columns =
|
|
138
|
-
context =
|
|
152
|
+
export function getRowSelection(_ref4) {
|
|
153
|
+
var rowKey = _ref4.rowKey,
|
|
154
|
+
columns = _ref4.columns,
|
|
155
|
+
context = _ref4.context;
|
|
139
156
|
var column = _.find(columns, {
|
|
140
157
|
type: 'selection'
|
|
141
158
|
});
|
|
@@ -196,10 +213,10 @@ export function getTableAndFormProps(props) {
|
|
|
196
213
|
tableProps: tableProps
|
|
197
214
|
};
|
|
198
215
|
}
|
|
199
|
-
export function isUseFormWrapper(
|
|
200
|
-
var columns =
|
|
201
|
-
context =
|
|
202
|
-
form =
|
|
216
|
+
export function isUseFormWrapper(_ref5) {
|
|
217
|
+
var columns = _ref5.columns,
|
|
218
|
+
context = _ref5.context,
|
|
219
|
+
form = _ref5.form;
|
|
203
220
|
// 在 Form 中时,将 context 挂载给 formContext
|
|
204
221
|
if (form) {
|
|
205
222
|
_.assign(form.getContext(), context);
|
|
@@ -209,10 +226,10 @@ export function isUseFormWrapper(_ref4) {
|
|
|
209
226
|
type: 'editor'
|
|
210
227
|
});
|
|
211
228
|
}
|
|
212
|
-
export function getTableFormInitialValues(
|
|
213
|
-
var rowKey =
|
|
214
|
-
columns =
|
|
215
|
-
dataSource =
|
|
229
|
+
export function getTableFormInitialValues(_ref6) {
|
|
230
|
+
var rowKey = _ref6.rowKey,
|
|
231
|
+
columns = _ref6.columns,
|
|
232
|
+
dataSource = _ref6.dataSource;
|
|
216
233
|
var dataIndex = _.map(columns, function (col) {
|
|
217
234
|
return col.type === 'editor' && col.dataIndex;
|
|
218
235
|
});
|
|
@@ -5,5 +5,6 @@ declare const style: {
|
|
|
5
5
|
ellipsisText: (rows: number) => import("@emotion/react").SerializedStyles;
|
|
6
6
|
editor: import("@emotion/react").SerializedStyles;
|
|
7
7
|
divider: import("@emotion/react").SerializedStyles;
|
|
8
|
+
displayColumn: import("@emotion/react").SerializedStyles;
|
|
8
9
|
};
|
|
9
10
|
export default style;
|
package/es/table/style/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
3
3
|
import { transformValueWithStyleUnit } from "../../api";
|
|
4
4
|
import { css } from '@emotion/react';
|
|
5
5
|
var style = {
|
|
@@ -11,6 +11,7 @@ var style = {
|
|
|
11
11
|
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n -webkit-line-clamp: ", " !important;\n "])), rows);
|
|
12
12
|
},
|
|
13
13
|
editor: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin-bottom: 0;\n\n .ant-form-item-label {\n display: none !important;\n }\n "]))),
|
|
14
|
-
divider: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n margin: 0;\n "])))
|
|
14
|
+
divider: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n margin: 0;\n "]))),
|
|
15
|
+
displayColumn: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n & {\n flex-direction: column;\n max-width: 200px;\n }\n\n .do-checkbox-all {\n padding-bottom: 10px;\n border-bottom: 1px solid #f0f0f0;\n }\n\n .ant-checkbox-group {\n flex-direction: column;\n width: 100%;\n }\n\n .do-checkbox,\n .do-box-label {\n width: 100%;\n }\n "])))
|
|
15
16
|
};
|
|
16
17
|
export default style;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|