@zykj2024/much-library 1.0.11 → 1.0.12-beta.2
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/McContainer/index.css +9 -8
- package/dist/McContainer/index.d.ts +8 -2
- package/dist/McContainer/index.js +12 -6
- package/dist/McDateRange/index.d.ts +1 -1
- package/dist/McDateRange/index.js +1 -1
- package/dist/McInput/index.css +25 -0
- package/dist/McSelect/components/PanelSearchInput/index.css +6 -0
- package/dist/McSelect/components/PanelSearchInput/index.d.ts +12 -0
- package/dist/McSelect/components/PanelSearchInput/index.js +45 -0
- package/dist/McSelect/demo/fetchOptions.js +1 -0
- package/dist/McSelect/index.d.ts +7 -0
- package/dist/McSelect/index.js +94 -10
- package/dist/McThemeConfig/globalStyle.js +9 -1
- package/dist/McThemeConfig/layoutStyle.d.ts +1 -1
- package/dist/McThemeConfig/layoutStyle.js +1 -1
- package/dist/McThemeConfig/themeToken.json +4 -3
- package/dist/index.d.ts +11 -6
- package/dist/index.js +11 -6
- package/package.json +1 -1
@@ -2,17 +2,18 @@
|
|
2
2
|
position: relative;
|
3
3
|
}
|
4
4
|
.mc-container__ceiling {
|
5
|
-
width: calc(100% -
|
5
|
+
width: calc(100% - 40px);
|
6
6
|
height: 24px;
|
7
7
|
position: absolute;
|
8
8
|
top: 0;
|
9
|
-
left:
|
9
|
+
left: 16px;
|
10
10
|
z-index: 9;
|
11
11
|
}
|
12
12
|
.mc-container__wrapper {
|
13
13
|
height: 100%;
|
14
|
-
padding: 24px 24px
|
15
|
-
overflow: auto;
|
14
|
+
padding: 24px 24px 50px 16px;
|
15
|
+
overflow-y: auto;
|
16
|
+
border-top-right-radius: 12px;
|
16
17
|
}
|
17
18
|
.mc-container__query {
|
18
19
|
display: -webkit-box;
|
@@ -27,7 +28,7 @@
|
|
27
28
|
.mc-container__query .mc-select,
|
28
29
|
.mc-container__query .mc-cascader,
|
29
30
|
.mc-container__query .mc-input-number {
|
30
|
-
width:
|
31
|
+
width: 270px;
|
31
32
|
}
|
32
33
|
.mc-container__query .mc-date-range {
|
33
34
|
width: 330px;
|
@@ -113,11 +114,11 @@
|
|
113
114
|
transition: all 0.3s;
|
114
115
|
}
|
115
116
|
.mc-container__pagination {
|
116
|
-
padding:
|
117
|
+
padding: 8px 0 16px;
|
117
118
|
margin: 0 !important;
|
118
|
-
width: calc(100% -
|
119
|
+
width: calc(100% - 40px);
|
119
120
|
position: absolute;
|
120
|
-
left:
|
121
|
+
left: 16px;
|
121
122
|
bottom: 0;
|
122
123
|
z-index: 9;
|
123
124
|
}
|
@@ -1,11 +1,15 @@
|
|
1
1
|
import { TableProps } from 'antd';
|
2
2
|
import { CSSProperties, FC, ReactElement, ReactNode } from 'react';
|
3
3
|
import './index.less';
|
4
|
-
export type
|
4
|
+
export type McContainerPropsType = {
|
5
5
|
style?: CSSProperties;
|
6
6
|
className?: string;
|
7
7
|
height?: string;
|
8
8
|
backgroundColor?: string;
|
9
|
+
/**
|
10
|
+
* 是否展示头部遮罩,默认显示
|
11
|
+
*/
|
12
|
+
showCell?: boolean;
|
9
13
|
immediateQuery?: boolean;
|
10
14
|
loading?: boolean;
|
11
15
|
queryItems?: ReactElement;
|
@@ -30,6 +34,8 @@ export type PropsType = {
|
|
30
34
|
onCancel?: () => void;
|
31
35
|
tableProps?: TableProps<any>;
|
32
36
|
tableRender?: ReactNode;
|
37
|
+
/** 折叠事件的回调 */
|
38
|
+
onCollapse?: (v: boolean) => void;
|
33
39
|
[key: string]: any;
|
34
40
|
};
|
35
41
|
export type McContainerRef = {
|
@@ -45,5 +51,5 @@ export type McContainerRef = {
|
|
45
51
|
getQueryParams: () => any;
|
46
52
|
resetQueryParams: () => void;
|
47
53
|
};
|
48
|
-
declare const McContainer: FC<
|
54
|
+
declare const McContainer: FC<McContainerPropsType>;
|
49
55
|
export default McContainer;
|
@@ -15,6 +15,8 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
15
15
|
height = _props$height === void 0 ? 'calc(100vh - 88px)' : _props$height,
|
16
16
|
_props$backgroundColo = props.backgroundColor,
|
17
17
|
backgroundColor = _props$backgroundColo === void 0 ? '#ffffff' : _props$backgroundColo,
|
18
|
+
_props$showCell = props.showCell,
|
19
|
+
showCell = _props$showCell === void 0 ? true : _props$showCell,
|
18
20
|
_props$immediateQuery = props.immediateQuery,
|
19
21
|
immediateQuery = _props$immediateQuery === void 0 ? true : _props$immediateQuery,
|
20
22
|
_props$loading = props.loading,
|
@@ -36,7 +38,8 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
36
38
|
batchBtns = props.batchBtns,
|
37
39
|
onCancel = props.onCancel,
|
38
40
|
tableProps = props.tableProps,
|
39
|
-
tableRender = props.tableRender
|
41
|
+
tableRender = props.tableRender,
|
42
|
+
onCollapse = props.onCollapse;
|
40
43
|
var _useState = useState(false),
|
41
44
|
_useState2 = _slicedToArray(_useState, 2),
|
42
45
|
collapse = _useState2[0],
|
@@ -67,6 +70,9 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
67
70
|
return actionBarResizeObserver.disconnect();
|
68
71
|
};
|
69
72
|
}, []);
|
73
|
+
useEffect(function () {
|
74
|
+
onCollapse === null || onCollapse === void 0 || onCollapse(collapse);
|
75
|
+
}, [collapse]);
|
70
76
|
|
71
77
|
// 为设置过name属性的查询项添加value属性和onChange事件,从而收集查询项的值(查询项自身已绑定value属性的除外,需自行编写相关业务逻辑代码进行状态管理)
|
72
78
|
var mapQuerys = function mapQuerys(items) {
|
@@ -265,7 +271,7 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
265
271
|
height: height,
|
266
272
|
backgroundColor: backgroundColor
|
267
273
|
}, style),
|
268
|
-
children: [/*#__PURE__*/_jsx("div", {
|
274
|
+
children: [showCell && /*#__PURE__*/_jsx("div", {
|
269
275
|
className: "mc-container__ceiling",
|
270
276
|
style: {
|
271
277
|
backgroundColor: backgroundColor
|
@@ -273,7 +279,7 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
273
279
|
}), /*#__PURE__*/_jsxs("div", {
|
274
280
|
className: "mc-container__wrapper",
|
275
281
|
style: {
|
276
|
-
paddingBottom: tableRender || tableRender === null || (tableProps === null || tableProps === void 0 ? void 0 : tableProps.pagination) === false ?
|
282
|
+
paddingBottom: tableRender || tableRender === null || (tableProps === null || tableProps === void 0 ? void 0 : tableProps.pagination) === false ? 16 : 50
|
277
283
|
},
|
278
284
|
children: [queryRender || queryRender === null ? queryRender : /*#__PURE__*/_jsxs("div", {
|
279
285
|
className: "mc-container__query",
|
@@ -300,7 +306,8 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
300
306
|
style: {
|
301
307
|
marginLeft: 16,
|
302
308
|
fontSize: 12,
|
303
|
-
padding: 0
|
309
|
+
padding: 0,
|
310
|
+
gap: 4
|
304
311
|
},
|
305
312
|
onClick: function onClick() {
|
306
313
|
return setCollapse(function (os) {
|
@@ -309,8 +316,7 @@ var McContainer = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
309
316
|
},
|
310
317
|
children: [collapse ? '展开' : '收起', /*#__PURE__*/_jsx(DoubleLeftOutlined, {
|
311
318
|
style: {
|
312
|
-
fontSize: 12
|
313
|
-
marginLeft: 2
|
319
|
+
fontSize: 12
|
314
320
|
},
|
315
321
|
rotate: collapse ? -90 : 90
|
316
322
|
})]
|
@@ -10,7 +10,7 @@ declare const shortcutValueMap: {
|
|
10
10
|
last60days: string[];
|
11
11
|
last90days: string[];
|
12
12
|
};
|
13
|
-
export declare const
|
13
|
+
export declare const SHORTCUT_VALUE_MAP: typeof shortcutValueMap & {
|
14
14
|
[key: string]: any;
|
15
15
|
};
|
16
16
|
export type McDateRangeProps = Omit<RangePickerProps, 'value' | 'onChange'> & {
|
@@ -18,7 +18,7 @@ var shortcutValueMap = {
|
|
18
18
|
last60days: [dayjs().add(-59, 'd').format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')],
|
19
19
|
last90days: [dayjs().add(-89, 'd').format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')]
|
20
20
|
};
|
21
|
-
export var
|
21
|
+
export var SHORTCUT_VALUE_MAP = shortcutValueMap;
|
22
22
|
var McDateRange = /*#__PURE__*/forwardRef(function (props, ref) {
|
23
23
|
var style = props.style,
|
24
24
|
className = props.className,
|
package/dist/McInput/index.css
CHANGED
@@ -42,3 +42,28 @@
|
|
42
42
|
color: #b3b3b3;
|
43
43
|
font-size: 12px;
|
44
44
|
}
|
45
|
+
.mc-input .ant-input-wrapper .ant-input-group-addon:nth-child(1)::after,
|
46
|
+
.mc-input .ant-input-wrapper .ant-input-group-addon:nth-last-child(1)::before {
|
47
|
+
content: '';
|
48
|
+
position: absolute;
|
49
|
+
top: 50%;
|
50
|
+
/* 居中对齐 */
|
51
|
+
-webkit-transform: translateY(-50%);
|
52
|
+
-ms-transform: translateY(-50%);
|
53
|
+
transform: translateY(-50%);
|
54
|
+
/* 垂直居中 */
|
55
|
+
height: 50%;
|
56
|
+
/* 竖线高度为输入框高度的 50% */
|
57
|
+
width: 1px;
|
58
|
+
/* 竖线宽度 */
|
59
|
+
background-color: #d8d8d8;
|
60
|
+
/* 竖线颜色 */
|
61
|
+
}
|
62
|
+
.mc-input .ant-input-wrapper .ant-input-group-addon:nth-child(1)::after {
|
63
|
+
right: 0;
|
64
|
+
/* 定位到右侧 */
|
65
|
+
}
|
66
|
+
.mc-input .ant-input-wrapper .ant-input-group-addon:nth-last-child(1)::before {
|
67
|
+
left: 0;
|
68
|
+
/* 定位到右侧 */
|
69
|
+
}
|
@@ -0,0 +1,12 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import './index.less';
|
3
|
+
interface PanelSearchInputProps {
|
4
|
+
placeholder: string | undefined;
|
5
|
+
searchValue: string | undefined;
|
6
|
+
onSearch: (e: string | undefined) => void;
|
7
|
+
}
|
8
|
+
export interface PanelSearchInputRef {
|
9
|
+
focus: () => void;
|
10
|
+
}
|
11
|
+
declare const _default: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<PanelSearchInputProps & import("react").RefAttributes<PanelSearchInputRef>>>;
|
12
|
+
export default _default;
|
@@ -0,0 +1,45 @@
|
|
1
|
+
import { SearchOutlined } from 'much-icons';
|
2
|
+
import { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';
|
3
|
+
import McInput from "../../../McInput";
|
4
|
+
import "./index.css";
|
5
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
6
|
+
var PanelSearchInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
7
|
+
var placeholder = _ref.placeholder,
|
8
|
+
onSearch = _ref.onSearch,
|
9
|
+
searchValue = _ref.searchValue;
|
10
|
+
var inputRef = useRef(null);
|
11
|
+
var focus = function focus() {
|
12
|
+
if (inputRef.current) {
|
13
|
+
setTimeout(function () {
|
14
|
+
var _inputRef$current;
|
15
|
+
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus({
|
16
|
+
cursor: 'all'
|
17
|
+
});
|
18
|
+
}, 200);
|
19
|
+
}
|
20
|
+
};
|
21
|
+
useEffect(focus, []);
|
22
|
+
useImperativeHandle(ref, function () {
|
23
|
+
return {
|
24
|
+
focus: focus
|
25
|
+
};
|
26
|
+
});
|
27
|
+
return /*#__PURE__*/_jsx("div", {
|
28
|
+
className: "mc-search-input__container",
|
29
|
+
children: /*#__PURE__*/_jsx(McInput, {
|
30
|
+
ref: inputRef,
|
31
|
+
className: "mc-search-input",
|
32
|
+
placeholder: placeholder || '请输入搜索内容',
|
33
|
+
value: searchValue,
|
34
|
+
onKeyDown: function onKeyDown(e) {
|
35
|
+
// 避免触发原select的keydown,比如删除选项等不符预期的操作
|
36
|
+
if (['Backspace', 'Delete', 'Enter'].includes(e.key)) {
|
37
|
+
e.stopPropagation();
|
38
|
+
}
|
39
|
+
},
|
40
|
+
onChange: onSearch,
|
41
|
+
suffix: /*#__PURE__*/_jsx(SearchOutlined, {})
|
42
|
+
})
|
43
|
+
});
|
44
|
+
});
|
45
|
+
export default /*#__PURE__*/memo(PanelSearchInput);
|
package/dist/McSelect/index.d.ts
CHANGED
@@ -25,6 +25,7 @@ export type FetchOptions = (params: {
|
|
25
25
|
export type McSelectProps = Omit<SelectProps, 'mode' | 'fieldNames'> & {
|
26
26
|
style?: CSSProperties;
|
27
27
|
className?: string;
|
28
|
+
/** 外部控制展示的options */
|
28
29
|
toFilterOptions?: (options: Option[]) => Option[];
|
29
30
|
name?: string;
|
30
31
|
label?: ReactNode;
|
@@ -35,6 +36,12 @@ export type McSelectProps = Omit<SelectProps, 'mode' | 'fieldNames'> & {
|
|
35
36
|
pageSize?: number;
|
36
37
|
extra?: any;
|
37
38
|
options?: Option[];
|
39
|
+
/** 仅多选生效。默认为false,在下拉框中展示搜索框,会影响回车生成新标签等功能 */
|
40
|
+
searchInPanel?: boolean;
|
41
|
+
/** 搜索框提示文字 */
|
42
|
+
searchInPanelPlaceholder?: string;
|
43
|
+
/** 仅多选+("非远程"或"远程+labelvalue"")生效。默认为false,将选中项置顶。 */
|
44
|
+
pinSelectedOptions?: boolean;
|
38
45
|
};
|
39
46
|
declare const McSelect: FC<McSelectProps>;
|
40
47
|
export default McSelect;
|
package/dist/McSelect/index.js
CHANGED
@@ -3,13 +3,45 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
3
3
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
4
4
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
5
5
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
6
|
-
|
6
|
+
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
7
|
+
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
8
|
+
var _excluded = ["style", "className", "label", "multiple", "changeOnHidden", "inexistent", "fetchOptions", "pageSize", "extra", "value", "onChange", "labelInValue", "options", "disabled", "maxTagCount", "onSearch", "onPopupScroll", "onBlur", "onDropdownVisibleChange", "toFilterOptions", "searchInPanel", "pinSelectedOptions", "searchInPanelPlaceholder"];
|
7
9
|
import { Empty, Popover, Select, Spin } from 'antd';
|
8
10
|
import { debounce } from "../Utils";
|
9
11
|
import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
12
|
+
import PanelSearchInput from "./components/PanelSearchInput";
|
10
13
|
import "./index.css";
|
11
14
|
import { jsx as _jsx } from "react/jsx-runtime";
|
15
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
12
16
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
17
|
+
// 将已选的option置顶
|
18
|
+
var createPinedSelectedOptions = function createPinedSelectedOptions(options, selectedValues) {
|
19
|
+
if (!options || options.length === 0) return [];
|
20
|
+
if (!selectedValues || selectedValues.length === 0) return options;
|
21
|
+
var isLabelInValue = _typeof(selectedValues[0]) === 'object';
|
22
|
+
if (isLabelInValue) {
|
23
|
+
var unselectedOptions = options.filter(function (o) {
|
24
|
+
return !selectedValues.some(function (v) {
|
25
|
+
return v.value === o.value;
|
26
|
+
});
|
27
|
+
});
|
28
|
+
return [].concat(_toConsumableArray(selectedValues), _toConsumableArray(unselectedOptions));
|
29
|
+
} else {
|
30
|
+
var _options$filter;
|
31
|
+
// options中找不到的就不展示
|
32
|
+
var selectedOptions = selectedValues.map(function (v) {
|
33
|
+
return options.find(function (o) {
|
34
|
+
return o.value === v;
|
35
|
+
});
|
36
|
+
}).filter(function (o) {
|
37
|
+
return Boolean(o);
|
38
|
+
});
|
39
|
+
var _unselectedOptions = (_options$filter = options.filter(function (x) {
|
40
|
+
return !selectedValues.includes(x.value);
|
41
|
+
})) !== null && _options$filter !== void 0 ? _options$filter : [];
|
42
|
+
return [].concat(_toConsumableArray(selectedOptions), _toConsumableArray(_unselectedOptions));
|
43
|
+
}
|
44
|
+
};
|
13
45
|
var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
14
46
|
var style = props.style,
|
15
47
|
className = props.className,
|
@@ -33,6 +65,11 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
33
65
|
onBlur = props.onBlur,
|
34
66
|
onDropdownVisibleChange = props.onDropdownVisibleChange,
|
35
67
|
toFilterOptions = props.toFilterOptions,
|
68
|
+
_props$searchInPanel = props.searchInPanel,
|
69
|
+
searchInPanel = _props$searchInPanel === void 0 ? false : _props$searchInPanel,
|
70
|
+
_props$pinSelectedOpt = props.pinSelectedOptions,
|
71
|
+
pinSelectedOptions = _props$pinSelectedOpt === void 0 ? false : _props$pinSelectedOpt,
|
72
|
+
searchInPanelPlaceholder = props.searchInPanelPlaceholder,
|
36
73
|
rest = _objectWithoutProperties(props, _excluded);
|
37
74
|
var _ref = typeof inexistent === 'boolean' ? {} : inexistent,
|
38
75
|
_ref$inexistentText = _ref.inexistentText,
|
@@ -88,7 +125,19 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
88
125
|
var _oldValue = useRef();
|
89
126
|
var _changeOption = useRef();
|
90
127
|
var _inexistent = useRef(false);
|
91
|
-
var
|
128
|
+
var panelSearchInputRef = useRef(null);
|
129
|
+
var useDefaultSearch = !(multiple && searchInPanel);
|
130
|
+
var optionWithPriority = useMemo(function () {
|
131
|
+
if (pinSelectedOptions && multiple) {
|
132
|
+
if (fetchOptions && !labelInValue) {
|
133
|
+
console.warn('远程搜索下,pinSelectedOptions只支持labelInValue模式,建议修改');
|
134
|
+
} else {
|
135
|
+
return createPinedSelectedOptions(selectOptions, selectValue);
|
136
|
+
}
|
137
|
+
}
|
138
|
+
return selectOptions;
|
139
|
+
}, [selectOptions, selectValue]);
|
140
|
+
var filteredOptions = toFilterOptions ? toFilterOptions(optionWithPriority) : optionWithPriority; // 只要有render就需要重新生成options
|
92
141
|
|
93
142
|
// 监听值和备选项的变化(赋值备选项,执行不存在值的判断逻辑)
|
94
143
|
useEffect(function () {
|
@@ -216,7 +265,7 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
216
265
|
|
217
266
|
// 文本框值变化时回调
|
218
267
|
var search = function search(v) {
|
219
|
-
var _v = v.trim();
|
268
|
+
var _v = (v === null || v === void 0 ? void 0 : v.trim()) || '';
|
220
269
|
setSearchValue(_v);
|
221
270
|
if (fetchOptions) {
|
222
271
|
debounceSearcher(_v, 1);
|
@@ -256,13 +305,16 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
256
305
|
}
|
257
306
|
onPopupScroll === null || onPopupScroll === void 0 || onPopupScroll(e);
|
258
307
|
};
|
308
|
+
var clearSearchData = function clearSearchData() {
|
309
|
+
setSearchValue('');
|
310
|
+
loadOptions('', 1);
|
311
|
+
};
|
259
312
|
|
260
313
|
// 失去焦点时的回调(若为异步分页查询,需重置查询)
|
261
314
|
var blur = function blur(e) {
|
262
315
|
// 若当前文本框有值,则清空文本框并重置查询
|
263
|
-
if (searchValue) {
|
264
|
-
|
265
|
-
loadOptions('', 1);
|
316
|
+
if (useDefaultSearch && searchValue) {
|
317
|
+
clearSearchData();
|
266
318
|
}
|
267
319
|
onBlur === null || onBlur === void 0 || onBlur(e);
|
268
320
|
};
|
@@ -279,8 +331,38 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
279
331
|
}
|
280
332
|
}
|
281
333
|
}
|
334
|
+
// 新版搜索交互逻辑
|
335
|
+
if (!useDefaultSearch) {
|
336
|
+
if (open) {
|
337
|
+
var _panelSearchInputRef$;
|
338
|
+
(_panelSearchInputRef$ = panelSearchInputRef.current) === null || _panelSearchInputRef$ === void 0 || _panelSearchInputRef$.focus();
|
339
|
+
} else if (searchValue) {
|
340
|
+
// 避免界面抖动
|
341
|
+
setTimeout(clearSearchData, 200);
|
342
|
+
}
|
343
|
+
}
|
282
344
|
onDropdownVisibleChange === null || onDropdownVisibleChange === void 0 || onDropdownVisibleChange(open);
|
283
345
|
};
|
346
|
+
var renderDropdownPanel = function renderDropdownPanel(menu) {
|
347
|
+
if (!multiple || !searchInPanel) {
|
348
|
+
return menu;
|
349
|
+
}
|
350
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
351
|
+
children: [/*#__PURE__*/_jsx(PanelSearchInput, {
|
352
|
+
ref: panelSearchInputRef,
|
353
|
+
placeholder: searchInPanelPlaceholder,
|
354
|
+
searchValue: searchValue,
|
355
|
+
onSearch: search
|
356
|
+
}), menu, filteredOptions.length > 0 && fetching && /*#__PURE__*/_jsx("div", {
|
357
|
+
style: {
|
358
|
+
color: '#999',
|
359
|
+
fontSize: 12,
|
360
|
+
textAlign: 'center'
|
361
|
+
},
|
362
|
+
children: "\u52A0\u8F7D\u4E2D..."
|
363
|
+
})]
|
364
|
+
});
|
365
|
+
};
|
284
366
|
return /*#__PURE__*/_jsxs("div", {
|
285
367
|
style: _objectSpread({
|
286
368
|
position: label ? 'relative' : 'static',
|
@@ -302,7 +384,8 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
302
384
|
options: filteredOptions,
|
303
385
|
disabled: disabled,
|
304
386
|
placeholder: "\u8BF7\u9009\u62E9",
|
305
|
-
showSearch:
|
387
|
+
showSearch: useDefaultSearch // 否则会和panel中的search冲突
|
388
|
+
,
|
306
389
|
optionFilterProp: "label",
|
307
390
|
allowClear: true,
|
308
391
|
maxTagCount: _maxTagCount,
|
@@ -332,8 +415,8 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
332
415
|
});
|
333
416
|
},
|
334
417
|
filterOption: fetchOptions ? false : true,
|
335
|
-
searchValue: searchValue,
|
336
|
-
onSearch: search,
|
418
|
+
searchValue: useDefaultSearch ? searchValue : undefined,
|
419
|
+
onSearch: useDefaultSearch ? search : undefined,
|
337
420
|
loading: fetching,
|
338
421
|
notFoundContent: fetching ? /*#__PURE__*/_jsx(Spin, {
|
339
422
|
size: "small"
|
@@ -342,7 +425,8 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
342
425
|
}),
|
343
426
|
onPopupScroll: popupScroll,
|
344
427
|
onBlur: blur,
|
345
|
-
onDropdownVisibleChange: dropdownVisibleChange
|
428
|
+
onDropdownVisibleChange: dropdownVisibleChange,
|
429
|
+
dropdownRender: renderDropdownPanel
|
346
430
|
}, rest), {}, {
|
347
431
|
mode: multiple ? 'multiple' : undefined,
|
348
432
|
fieldNames: undefined
|
@@ -2,7 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
|
|
2
2
|
var _templateObject;
|
3
3
|
// @ts-nocheck
|
4
4
|
import { createGlobalStyle } from 'antd-style';
|
5
|
-
var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n// <====================== Layout ======================>\n\n", "\n\n// <====================== Font ======================>\n\n@font-face {\n font-family: 'SourceHanSansCN';\n src: url(", ");\n}\n\nbody * {\n font-family: 'SourceHanSansCN';\n}\n\n// <====================== Button ======================>\n\n// primary\n.ant-btn-primary[disabled]{\n background: ", ";\n color: ", ";\n opacity: 0.3;\n}\n\n// default\n.ant-btn-default[disabled] {\n border-color: ", " !important;\n}\n\n// danger\n.ant-btn-default.ant-btn-dangerous,.ant-btn-default[data-danger],\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n color: ", ";\n background: ", ";\n border-color:", ";\n\n &:hover {\n color: ", " !important;\n background: ", " !important;\n border-color:", " !important;\n }\n\n &:active {\n color: ", " !important;\n }\n}\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n opacity: 0.4;\n}\n\n// secondary\n.ant-btn-default[data-secondary],\n// modal\u3001drawer\u3001popconfirm footer\n.ant-modal-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-drawer-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-popconfirm-buttons .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous){\n background: ", ";\n border-color: ", ";\n\n &:hover {\n background: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n border-color: ", " !important;\n color: ", " !important;\n }\n}\n\n.ant-btn-default[data-secondary][disabled] {\n color: ", " ;\n background: ", ";\n border-color: ", " !important;\n\n &:hover {\n color: ", ";\n background: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// add\n.ant-btn-default[data-add] {\n background: ", " !important;\n color: ", " !important;\n border-color: ", " !important;\n\n &:hover {\n color: ", " !important;\n background: ", " !important;\n border-color: ", " !important;\n }\n\n &:active{\n color: ", " !important;\n }\n}\n\n.ant-btn-default[data-add][disabled] {\n opacity: 0.4;\n color: ", ";\n\n &:hover {\n background: ", " !important;\n color: ", " !important;\n }\n\n &:active{\n background: ", " !important;\n color: ", " !important;\n }\n}\n\n//dashed\n.ant-btn-dashed {\n background: ", " !important;\n border-color: ", " !important;\n}\n\n.ant-btn-dashed:not([disabled]) {\n &:hover {\n background: ", " !important;\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active{\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// dashed danger\n.ant-btn-dashed.ant-btn-dangerous,\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n color: ", " !important;\n border-color: ", " !important;\n\n &:hover {\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n }\n}\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n opacity: 0.4;\n\n &:hover {\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// ghost\n.ant-btn-background-ghost:not([disabled]) {\n &:hover {\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// link\n.ant-btn-link:not([disabled]) {\n &:hover {\n color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n\n }\n}\n\n.ant-btn-link[disabled] {\n color: ", " !important;\n opacity: 0.3;\n}\n\n// link danger\n.ant-btn-link.ant-btn-dangerous {\n\n &:hover {\n color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n }\n}\n\n.ant-btn-link.ant-btn-dangerous:disabled {\n color: ", " !important;\n opacity: 0.3;\n}\n\n\n\n// <====================== Drawer ======================>\n\n.ant-drawer .ant-drawer-header{\n border-bottom: none;\n padding: 23px 24px;\n .ant-drawer-header-title {\n flex-direction: row-reverse;\n .ant-drawer-close {\n margin: -4px;\n }\n }\n}\n// Drawer \u5BBD\u9AD8 \u4E1A\u52A1\u65B9\u81EA\u884C\u5B9E\u73B0\n//.ant-drawer .ant-drawer-content-wrapper {\n// min-width: 480px\n//}\n.ant-drawer .ant-drawer-body{\n padding: 0 24px;\n}\n.ant-drawer .ant-drawer-footer{\n border-top: none;\n padding: 24px;\n}\n\n// <====================== Modal ======================>\n\n.ant-modal .ant-modal-header {\n margin-bottom:24px;\n}\n\n.ant-modal-body {\n overflow-y: auto\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1280px\u4E14\u5C0F\u4E8E1366px\u7684\u65F6\u5019\u6267\u884C,1280-1366*/\n@media screen and (min-width:1280px) and (max-width: 1366px){\n .ant-modal-root[data-small] {\n .ant-modal-body {\n max-height: 150px;\n }\n .ant-modal {\n top: 150px;\n }\n }\n\n .ant-modal-root[data-medium] {\n .ant-modal-body {\n max-height: 300px;\n min-height: 150px\n }\n .ant-modal {\n top: 80px;\n }\n }\n\n .ant-modal-root[data-large] {\n .ant-modal-body {\n max-height: 450px;\n min-height: 300px\n }\n .ant-modal {\n top: 40px;\n }\n }\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1440px\u4E14\u5C0F\u4E8E1600px\u7684\u65F6\u5019\u6267\u884C,1440-1600*/\n@media screen and (min-width:1440px) and (max-width:1600px){\n .ant-modal-root[data-small] {\n .ant-modal-body {\n max-height: 150px;\n }\n .ant-modal {\n top: 200px;\n }\n }\n\n .ant-modal-root[data-medium] {\n .ant-modal-body {\n max-height: 300px;\n min-height: 150px\n }\n .ant-modal {\n top: 150px;\n }\n }\n\n .ant-modal-root[data-large] {\n .ant-modal-body {\n max-height: 450px;\n min-height: 300px\n }\n .ant-modal {\n top: 80px;\n }\n }\n}\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1680px\u4E14\u5C0F\u4E8E1920px\u7684\u65F6\u5019\u6267\u884C,1680-1920*/\n@media screen and (min-width:1680px) and (max-width:2560px){\n .ant-modal-root[data-small] {\n .ant-modal-body {\n max-height: 150px;\n }\n .ant-modal {\n top: 200px;\n }\n }\n\n .ant-modal-root[data-medium] {\n .ant-modal-body {\n max-height: 300px;\n min-height: 150px\n }\n .ant-modal {\n top: 150px;\n }\n }\n\n .ant-modal-root[data-large] {\n .ant-modal-body {\n max-height: 450px;\n min-height: 300px\n }\n .ant-modal {\n top: 150px;\n }\n }\n}\n\n// <====================== Tabs ======================>\n\n.ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {\n text-shadow: unset;\n}\n.ant-tabs-card {\n .ant-tabs-nav {\n &::before {\n border: none;\n }\n .ant-tabs-nav-wrap {\n background: transparent;\n .ant-tabs-nav-list {\n background: ", ";\n border-top-right-radius: ", "px;\n .ant-tabs-tab {\n position: relative;\n border: ", ";\n border-radius: ", "px ", "px 0px 0px;\n &::after {\n position: absolute;\n top: 11px;\n right: -1px;\n width: 1px;\n height: 24px;\n background: ", ";\n content: '';\n }\n }\n .ant-tabs-nav-add {\n position: relative;\n border: none;\n border-top-right-radius: ", "px;\n &::before {\n position: absolute;\n top: 11px;\n left: 1px;\n width: 1px;\n height: 24px;\n background: ", ";\n content: '';\n }\n }\n .ant-tabs-tab-active {\n border: ", ";\n &::after {\n display: none;\n }\n }\n .ant-tabs-tab:nth-last-of-type(2) {\n &::after {\n display: none;\n }\n }\n .ant-tabs-tab:has(+ .ant-tabs-tab-active) {\n &::after {\n display: none;\n }\n }\n }\n }\n }\n}\n\n// <====================== Pagination ======================>\n\n.ant-pagination {\n display: flex;\n\n .ant-pagination-total-text {\n margin-right: auto;\n color: ", ";\n }\n\n .ant-pagination-item.ant-pagination-item-active {\n &:hover {\n border-color: ", ";\n }\n\n &>a {\n color: ", ";\n }\n }\n\n &.ant-pagination-mini li:not(:first-of-type) {\n margin-left: 2px;\n }\n}\n\n// <====================== Radio ======================>\n .ant-radio-group {\n .ant-radio-button-wrapper {\n position: relative;\n border: 1px solid ", ";\n &::before {\n display: none;\n }\n &::after {\n display: inline-block;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n width: 1px;\n height: ", "px;\n background: ", ";\n right: -1px;\n content: '';\n }\n }\n .ant-radio-button-wrapper-checked {\n border: 1px solid ", ";\n &::after {\n display: none;\n }\n }\n .ant-radio-button-wrapper:nth-last-of-type(1) {\n &::after {\n display: none;\n }\n }\n .ant-radio-button-wrapper:has(+ .ant-radio-button-wrapper-checked) {\n &::after {\n display: none;\n }\n }\n .ant-radio-button-wrapper-disabled {\n border: 1px solid ", " !important;\n }\n .ant-radio-button-wrapper-disabled.ant-radio-button-wrapper-checked {\n border-color: ", " !important;\n }\n}\n"])), function (props) {
|
5
|
+
var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n// <====================== Layout ======================>\n\n", "\n\n// <====================== Font ======================>\n\n@font-face {\n font-family: 'SourceHanSansCN';\n src: url(", ");\n}\n\nbody * {\n font-family: 'SourceHanSansCN';\n}\n\n// <====================== Button ======================>\n\n// primary\n.ant-btn-primary[disabled]{\n background: ", ";\n color: ", ";\n opacity: 0.3;\n}\n\n// default\n.ant-btn-default[disabled] {\n border-color: ", " !important;\n}\n\n// danger\n.ant-btn-default.ant-btn-dangerous,.ant-btn-default[data-danger],\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n color: ", ";\n background: ", ";\n border-color:", ";\n\n &:hover {\n color: ", " !important;\n background: ", " !important;\n border-color:", " !important;\n }\n\n &:active {\n color: ", " !important;\n }\n}\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n opacity: 0.4;\n}\n\n// secondary\n.ant-btn-default[data-secondary],\n// modal\u3001drawer\u3001popconfirm footer\n.ant-modal-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-drawer-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-popconfirm-buttons .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous){\n background: ", ";\n border-color: ", ";\n\n &:hover {\n background: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n border-color: ", " !important;\n color: ", " !important;\n }\n}\n\n.ant-btn-default[data-secondary][disabled] {\n color: ", " ;\n background: ", ";\n border-color: ", " !important;\n\n &:hover {\n color: ", ";\n background: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// add\n.ant-btn-default[data-add] {\n background: ", " !important;\n color: ", " !important;\n border-color: ", " !important;\n\n &:hover {\n color: ", " !important;\n background: ", " !important;\n border-color: ", " !important;\n }\n\n &:active{\n color: ", " !important;\n }\n}\n\n.ant-btn-default[data-add][disabled] {\n opacity: 0.4;\n color: ", ";\n\n &:hover {\n background: ", " !important;\n color: ", " !important;\n }\n\n &:active{\n background: ", " !important;\n color: ", " !important;\n }\n}\n\n//dashed\n.ant-btn-dashed {\n background: ", " !important;\n border-color: ", " !important;\n}\n\n.ant-btn-dashed:not([disabled]) {\n &:hover {\n background: ", " !important;\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active{\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// dashed danger\n.ant-btn-dashed.ant-btn-dangerous,\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n color: ", " !important;\n border-color: ", " !important;\n\n &:hover {\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n }\n}\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n opacity: 0.4;\n\n &:hover {\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// ghost\n.ant-btn-background-ghost:not([disabled]) {\n &:hover {\n color: ", " !important;\n border-color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n border-color: ", " !important;\n }\n}\n\n// link\n.ant-btn-link:not([disabled]) {\n &:hover {\n color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n\n }\n}\n\n.ant-btn-link[disabled] {\n color: ", " !important;\n opacity: 0.3;\n}\n\n// link danger\n.ant-btn-link.ant-btn-dangerous {\n\n &:hover {\n color: ", " !important;\n }\n\n &:active {\n color: ", " !important;\n }\n}\n\n.ant-btn-link.ant-btn-dangerous:disabled {\n color: ", " !important;\n opacity: 0.3;\n}\n\n\n\n// <====================== Drawer ======================>\n\n.ant-drawer .ant-drawer-header{\n border-bottom: none;\n padding: 23px 24px;\n .ant-drawer-header-title {\n flex-direction: row-reverse;\n .ant-drawer-close {\n margin: -4px;\n }\n }\n}\n// Drawer \u5BBD\u9AD8 \u4E1A\u52A1\u65B9\u81EA\u884C\u5B9E\u73B0\n//.ant-drawer .ant-drawer-content-wrapper {\n// min-width: 480px\n//}\n.ant-drawer .ant-drawer-body{\n padding: 0 24px;\n}\n.ant-drawer .ant-drawer-footer{\n border-top: none;\n padding: 24px;\n}\n\n// <====================== Modal ======================>\n\n.ant-modal .ant-modal-header {\n margin-bottom:24px;\n}\n\n.ant-modal-body {\n overflow-y: auto\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1280px\u4E14\u5C0F\u4E8E1366px\u7684\u65F6\u5019\u6267\u884C,1280-1366*/\n@media screen and (min-width:1280px) and (max-width: 1366px){\n .ant-modal-root[data-small] {\n .ant-modal-body {\n max-height: 150px;\n }\n .ant-modal {\n top: 150px;\n }\n }\n\n .ant-modal-root[data-medium] {\n .ant-modal-body {\n max-height: 300px;\n min-height: 150px\n }\n .ant-modal {\n top: 80px;\n }\n }\n\n .ant-modal-root[data-large] {\n .ant-modal-body {\n max-height: 450px;\n min-height: 300px\n }\n .ant-modal {\n top: 40px;\n }\n }\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1440px\u4E14\u5C0F\u4E8E1600px\u7684\u65F6\u5019\u6267\u884C,1440-1600*/\n@media screen and (min-width:1440px) and (max-width:1600px){\n .ant-modal-root[data-small] {\n .ant-modal-body {\n max-height: 150px;\n }\n .ant-modal {\n top: 200px;\n }\n }\n\n .ant-modal-root[data-medium] {\n .ant-modal-body {\n max-height: 300px;\n min-height: 150px\n }\n .ant-modal {\n top: 150px;\n }\n }\n\n .ant-modal-root[data-large] {\n .ant-modal-body {\n max-height: 450px;\n min-height: 300px\n }\n .ant-modal {\n top: 80px;\n }\n }\n}\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1680px\u4E14\u5C0F\u4E8E1920px\u7684\u65F6\u5019\u6267\u884C,1680-1920*/\n@media screen and (min-width:1680px) and (max-width:2560px){\n .ant-modal-root[data-small] {\n .ant-modal-body {\n max-height: 150px;\n }\n .ant-modal {\n top: 200px;\n }\n }\n\n .ant-modal-root[data-medium] {\n .ant-modal-body {\n max-height: 300px;\n min-height: 150px\n }\n .ant-modal {\n top: 150px;\n }\n }\n\n .ant-modal-root[data-large] {\n .ant-modal-body {\n max-height: 450px;\n min-height: 300px\n }\n .ant-modal {\n top: 150px;\n }\n }\n}\n\n// <====================== Tabs ======================>\n\n.ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {\n text-shadow: unset;\n}\n.ant-tabs-card {\n .ant-tabs-nav {\n margin: 0;\n &::before {\n border: none;\n }\n .ant-tabs-nav-wrap {\n background: transparent;\n .ant-tabs-nav-list {\n background: ", ";\n border-top-right-radius: ", "px;\n .ant-tabs-tab {\n position: relative;\n border: ", ";\n border-radius: ", "px ", "px 0px 0px;\n &::after {\n position: absolute;\n top: 11px;\n right: -1px;\n width: 1px;\n height: 24px;\n background: ", ";\n content: '';\n }\n }\n .ant-tabs-nav-add {\n position: relative;\n border: none;\n border-top-right-radius: ", "px;\n &::before {\n position: absolute;\n top: 11px;\n left: 1px;\n width: 1px;\n height: 24px;\n background: ", ";\n content: '';\n }\n }\n .ant-tabs-tab-active {\n border: ", ";\n &::after {\n display: none;\n }\n }\n .ant-tabs-tab:nth-last-of-type(2) {\n &::after {\n display: none;\n }\n }\n .ant-tabs-tab:has(+ .ant-tabs-tab-active) {\n &::after {\n display: none;\n }\n }\n }\n }\n }\n}\n\n// <====================== Pagination ======================>\n\n.ant-pagination {\n display: flex;\n align-items: center;\n\n .ant-pagination-total-text {\n margin-right: auto;\n color: ", ";\n }\n\n .ant-pagination-item.ant-pagination-item-active {\n &:hover {\n border-color: ", ";\n }\n\n &>a {\n color: ", ";\n }\n }\n\n .ant-pagination-options {\n .ant-pagination-options-quick-jumper {\n input {\n background: ", ";\n border-color: ", ";\n padding: 12px;\n\n &:hover {\n border-color: ", ";\n }\n\n &:focus {\n border-color: ", ";\n }\n }\n }\n }\n\n &.ant-pagination-mini li:not(:first-of-type) {\n margin-left: 2px;\n }\n}\n\n// <====================== Radio ======================>\n .ant-radio-group {\n .ant-radio-button-wrapper {\n position: relative;\n border: 1px solid ", ";\n &::before {\n display: none;\n }\n &::after {\n display: inline-block;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n width: 1px;\n height: ", "px;\n background: ", ";\n right: -1px;\n content: '';\n }\n }\n .ant-radio-button-wrapper-checked {\n border: 1px solid ", ";\n &::after {\n display: none;\n }\n }\n .ant-radio-button-wrapper:nth-last-of-type(1) {\n &::after {\n display: none;\n }\n }\n .ant-radio-button-wrapper:has(+ .ant-radio-button-wrapper-checked) {\n &::after {\n display: none;\n }\n }\n .ant-radio-button-wrapper-disabled {\n border: 1px solid ", " !important;\n }\n .ant-radio-button-wrapper-disabled.ant-radio-button-wrapper-checked {\n border-color: ", " !important;\n }\n}\n// <====================== Collapse ======================>\n.ant-collapse .ant-collapse-content {\n border-top-width: 0px;\n}\n"])), function (props) {
|
6
6
|
return props.layout;
|
7
7
|
}, function (props) {
|
8
8
|
return props.font.Regular;
|
@@ -154,6 +154,14 @@ var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _tagge
|
|
154
154
|
return props.theme.CustomToken.Pagination.itemActiveHoverBorderColor;
|
155
155
|
}, function (props) {
|
156
156
|
return props.theme.CustomToken.Pagination.itemActiveColor;
|
157
|
+
}, function (props) {
|
158
|
+
return props.theme.Input.colorBgContainer;
|
159
|
+
}, function (props) {
|
160
|
+
return props.theme.Input.colorBorder;
|
161
|
+
}, function (props) {
|
162
|
+
return props.theme.Input.hoverBorderColor;
|
163
|
+
}, function (props) {
|
164
|
+
return props.theme.Input.hoverBorderColor;
|
157
165
|
}, function (props) {
|
158
166
|
return props.theme.Radio.buttonBg;
|
159
167
|
}, function (props) {
|
@@ -1,2 +1,2 @@
|
|
1
|
-
declare const _default: "\n/* =========== 布局样式 =========== */\n.ant-pro-layout {\n\n /* 侧边菜单 */\n .ant-pro-sider {\n padding: 8px 0 16px 16px;\n background: transparent !important;\n \n .ant-layout-sider-children {\n background: #f0f4f9;\n border-radius: 12px 0 0 12px;\n padding: 0;\n border-right: 0;\n margin-right: 0;\n overflow: hidden;\n \n .ant-pro-sider-menu {\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n font-size: 18px;\n color: #8C8C8C;\n }\n \n [class*='-selected'] .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n \n a {\n transition: color 0s;\n }\n \n &>.ant-menu-item {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:first-of-type {\n margin-top: 0;\n }\n \n &:not(.ant-menu-item-selected):hover {\n color: #325cf7;\n background: transparent !important;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n background: #ffffff;\n }\n }\n \n .ant-menu-submenu {\n .ant-menu-submenu-title {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n }\n \n &:first-of-type .ant-menu-submenu-title {\n margin-top: 0;\n }\n \n &.ant-menu-submenu-selected {\n .ant-menu-submenu-title {\n color: #325cf7;\n }\n }\n \n .ant-menu-sub {\n padding: 0;\n \n .ant-menu-item {\n color: #595959;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n padding-left: 44px !important;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n font-weight: 500;\n background: #ffffff;\n }\n }\n }\n }\n }\n \n .ant-pro-sider-footer {\n text-align: right;\n padding: 0 12px 16px;\n \n .menu-footer-collapse-btn {\n width: 24px;\n height: 24px;\n border-radius: 6px;\n padding: 0;\n border: 0;\n \n .ant-btn-icon .anticon {\n font-size: 14px;\n color: #b3b3b3;\n }\n \n &:not(:hover) {\n background: #ffffff;\n }\n }\n }\n }\n \n &.ant-layout-sider-collapsed .ant-layout-sider-children .ant-pro-sider-menu {\n margin-top: -4px;\n \n .ant-menu-item.ant-menu-item-selected,\n .ant-menu-submenu.ant-menu-submenu-selected .ant-menu-submenu-title {\n background: #ffffff;\n }\n }\n }\n \n /* 头部区header */\n .ant-pro-layout-container .ant-pro-layout-header {\n border-bottom: 0 !important;\n \n .ant-pro-top-nav-header-main {\n padding-left: 0;\n \n .ant-pro-top-nav-header-menu {\n padding: 0;\n line-height: 48px;\n
|
1
|
+
declare const _default: "\n/* =========== 布局样式 =========== */\n.ant-pro-layout {\n\n /* 侧边菜单 */\n .ant-pro-sider {\n padding: 8px 0 16px 16px;\n background: transparent !important;\n \n .ant-layout-sider-children {\n background: #f0f4f9;\n border-radius: 12px 0 0 12px;\n padding: 0;\n border-right: 0;\n margin-right: 0;\n overflow: hidden;\n \n .ant-pro-sider-menu {\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n font-size: 18px;\n color: #8C8C8C;\n }\n \n [class*='-selected'] .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n \n a {\n transition: color 0s;\n }\n \n &>.ant-menu-item {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:first-of-type {\n margin-top: 0;\n }\n \n &:not(.ant-menu-item-selected):hover {\n color: #325cf7;\n background: transparent !important;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n background: #ffffff;\n }\n }\n \n .ant-menu-submenu {\n .ant-menu-submenu-title {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n }\n \n &:first-of-type .ant-menu-submenu-title {\n margin-top: 0;\n }\n \n &.ant-menu-submenu-selected {\n .ant-menu-submenu-title {\n color: #325cf7;\n }\n }\n \n .ant-menu-sub {\n padding: 0;\n \n .ant-menu-item {\n color: #595959;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n padding-left: 44px !important;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n font-weight: 500;\n background: #ffffff;\n }\n }\n }\n }\n }\n \n .ant-pro-sider-footer {\n text-align: right;\n padding: 0 12px 16px;\n \n .menu-footer-collapse-btn {\n width: 24px;\n height: 24px;\n border-radius: 6px;\n padding: 0;\n border: 0;\n \n .ant-btn-icon .anticon {\n font-size: 14px;\n color: #b3b3b3;\n }\n \n &:not(:hover) {\n background: #ffffff;\n }\n }\n }\n }\n \n &.ant-layout-sider-collapsed .ant-layout-sider-children .ant-pro-sider-menu {\n margin-top: -4px;\n \n .ant-menu-item.ant-menu-item-selected,\n .ant-menu-submenu.ant-menu-submenu-selected .ant-menu-submenu-title {\n background: #ffffff;\n }\n }\n }\n \n /* 头部区header */\n .ant-pro-layout-container .ant-pro-layout-header {\n border-bottom: 0 !important;\n \n .ant-pro-top-nav-header-main {\n padding-left: 0;\n \n .ant-pro-top-nav-header-menu {\n padding: 0;\n line-height: 48px;\n\n .ant-menu-overflow-item-rest {\n margin: 8px;\n }\n \n .ant-menu-item {\n padding: 0 28px;\n margin: 8px;\n \n &:hover {\n font-weight: 500;\n background: rgba(50, 92, 247, 0.1);\n }\n \n &.ant-menu-item-selected {\n font-weight: bold;\n \n &:hover {\n background: rgba(50, 92, 247, 0.1);\n }\n \n &::after {\n content: '';\n display: block;\n width: 21px;\n height: 4px;\n border-radius: 4px;\n background: #325cf7;\n position: absolute;\n bottom: 0;\n left: calc((100% - 21px) / 2);\n }\n }\n }\n }\n }\n }\n \n /* 内容区main */\n .ant-pro-layout-container .ant-pro-layout-content {\n width: calc(100% - 32px);\n margin: 8px 16px 16px;\n padding: 0;\n height: calc(100vh - 88px);\n overflow: auto;\n border-radius: 12px;\n }\n \n .ant-layout-has-sider .ant-pro-layout-container .ant-pro-layout-content {\n width: calc(100% - 16px);\n margin-left: 0;\n border-radius: 0 12px 12px 0;\n }\n }";
|
2
2
|
export default _default;
|
@@ -1 +1 @@
|
|
1
|
-
export default "\n/* =========== \u5E03\u5C40\u6837\u5F0F =========== */\n.ant-pro-layout {\n\n /* \u4FA7\u8FB9\u83DC\u5355 */\n .ant-pro-sider {\n padding: 8px 0 16px 16px;\n background: transparent !important;\n \n .ant-layout-sider-children {\n background: #f0f4f9;\n border-radius: 12px 0 0 12px;\n padding: 0;\n border-right: 0;\n margin-right: 0;\n overflow: hidden;\n \n .ant-pro-sider-menu {\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n font-size: 18px;\n color: #8C8C8C;\n }\n \n [class*='-selected'] .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n \n a {\n transition: color 0s;\n }\n \n &>.ant-menu-item {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:first-of-type {\n margin-top: 0;\n }\n \n &:not(.ant-menu-item-selected):hover {\n color: #325cf7;\n background: transparent !important;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n background: #ffffff;\n }\n }\n \n .ant-menu-submenu {\n .ant-menu-submenu-title {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n }\n \n &:first-of-type .ant-menu-submenu-title {\n margin-top: 0;\n }\n \n &.ant-menu-submenu-selected {\n .ant-menu-submenu-title {\n color: #325cf7;\n }\n }\n \n .ant-menu-sub {\n padding: 0;\n \n .ant-menu-item {\n color: #595959;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n padding-left: 44px !important;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n font-weight: 500;\n background: #ffffff;\n }\n }\n }\n }\n }\n \n .ant-pro-sider-footer {\n text-align: right;\n padding: 0 12px 16px;\n \n .menu-footer-collapse-btn {\n width: 24px;\n height: 24px;\n border-radius: 6px;\n padding: 0;\n border: 0;\n \n .ant-btn-icon .anticon {\n font-size: 14px;\n color: #b3b3b3;\n }\n \n &:not(:hover) {\n background: #ffffff;\n }\n }\n }\n }\n \n &.ant-layout-sider-collapsed .ant-layout-sider-children .ant-pro-sider-menu {\n margin-top: -4px;\n \n .ant-menu-item.ant-menu-item-selected,\n .ant-menu-submenu.ant-menu-submenu-selected .ant-menu-submenu-title {\n background: #ffffff;\n }\n }\n }\n \n /* \u5934\u90E8\u533Aheader */\n .ant-pro-layout-container .ant-pro-layout-header {\n border-bottom: 0 !important;\n \n .ant-pro-top-nav-header-main {\n padding-left: 0;\n \n .ant-pro-top-nav-header-menu {\n padding: 0;\n line-height: 48px;\n
|
1
|
+
export default "\n/* =========== \u5E03\u5C40\u6837\u5F0F =========== */\n.ant-pro-layout {\n\n /* \u4FA7\u8FB9\u83DC\u5355 */\n .ant-pro-sider {\n padding: 8px 0 16px 16px;\n background: transparent !important;\n \n .ant-layout-sider-children {\n background: #f0f4f9;\n border-radius: 12px 0 0 12px;\n padding: 0;\n border-right: 0;\n margin-right: 0;\n overflow: hidden;\n \n .ant-pro-sider-menu {\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n font-size: 18px;\n color: #8C8C8C;\n }\n \n [class*='-selected'] .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n \n a {\n transition: color 0s;\n }\n \n &>.ant-menu-item {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:first-of-type {\n margin-top: 0;\n }\n \n &:not(.ant-menu-item-selected):hover {\n color: #325cf7;\n background: transparent !important;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n background: #ffffff;\n }\n }\n \n .ant-menu-submenu {\n .ant-menu-submenu-title {\n color: #262626;\n font-weight: 500;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n }\n \n &:first-of-type .ant-menu-submenu-title {\n margin-top: 0;\n }\n \n &.ant-menu-submenu-selected {\n .ant-menu-submenu-title {\n color: #325cf7;\n }\n }\n \n .ant-menu-sub {\n padding: 0;\n \n .ant-menu-item {\n color: #595959;\n margin: 4px 0;\n width: 100%;\n border-radius: 4px 0 0 4px;\n padding-left: 44px !important;\n \n &:hover {\n color: #325cf7;\n background: transparent;\n \n .ant-pro-base-menu-inline-item-icon .anticon {\n color: #325cf7;\n }\n }\n \n &.ant-menu-item-selected {\n color: #325cf7;\n font-weight: 500;\n background: #ffffff;\n }\n }\n }\n }\n }\n \n .ant-pro-sider-footer {\n text-align: right;\n padding: 0 12px 16px;\n \n .menu-footer-collapse-btn {\n width: 24px;\n height: 24px;\n border-radius: 6px;\n padding: 0;\n border: 0;\n \n .ant-btn-icon .anticon {\n font-size: 14px;\n color: #b3b3b3;\n }\n \n &:not(:hover) {\n background: #ffffff;\n }\n }\n }\n }\n \n &.ant-layout-sider-collapsed .ant-layout-sider-children .ant-pro-sider-menu {\n margin-top: -4px;\n \n .ant-menu-item.ant-menu-item-selected,\n .ant-menu-submenu.ant-menu-submenu-selected .ant-menu-submenu-title {\n background: #ffffff;\n }\n }\n }\n \n /* \u5934\u90E8\u533Aheader */\n .ant-pro-layout-container .ant-pro-layout-header {\n border-bottom: 0 !important;\n \n .ant-pro-top-nav-header-main {\n padding-left: 0;\n \n .ant-pro-top-nav-header-menu {\n padding: 0;\n line-height: 48px;\n\n .ant-menu-overflow-item-rest {\n margin: 8px;\n }\n \n .ant-menu-item {\n padding: 0 28px;\n margin: 8px;\n \n &:hover {\n font-weight: 500;\n background: rgba(50, 92, 247, 0.1);\n }\n \n &.ant-menu-item-selected {\n font-weight: bold;\n \n &:hover {\n background: rgba(50, 92, 247, 0.1);\n }\n \n &::after {\n content: '';\n display: block;\n width: 21px;\n height: 4px;\n border-radius: 4px;\n background: #325cf7;\n position: absolute;\n bottom: 0;\n left: calc((100% - 21px) / 2);\n }\n }\n }\n }\n }\n }\n \n /* \u5185\u5BB9\u533Amain */\n .ant-pro-layout-container .ant-pro-layout-content {\n width: calc(100% - 32px);\n margin: 8px 16px 16px;\n padding: 0;\n height: calc(100vh - 88px);\n overflow: auto;\n border-radius: 12px;\n }\n \n .ant-layout-has-sider .ant-pro-layout-container .ant-pro-layout-content {\n width: calc(100% - 16px);\n margin-left: 0;\n border-radius: 0 12px 12px 0;\n }\n }";
|
@@ -8,7 +8,8 @@
|
|
8
8
|
"colorText": "#262626",
|
9
9
|
"colorTextSecondary": "#595959",
|
10
10
|
"colorTextTertiary": "#8c8c8c",
|
11
|
-
"colorTextQuaternary": "#b3b3b3"
|
11
|
+
"colorTextQuaternary": "#b3b3b3",
|
12
|
+
"controlHeightSM": 26
|
12
13
|
},
|
13
14
|
"components": {
|
14
15
|
"Button": {
|
@@ -121,7 +122,7 @@
|
|
121
122
|
"Cascader": {
|
122
123
|
"colorBgContainerDisabled": "rgba(240, 242, 245, 0.5)",
|
123
124
|
"colorSplit": "rgba(5, 5, 5, 0)",
|
124
|
-
"colorBorder": "rgba(217, 217, 217
|
125
|
+
"colorBorder": "rgba(217, 217, 217)"
|
125
126
|
},
|
126
127
|
"Switch": {
|
127
128
|
"handleShadow": "-1px 0px 2px 0px rgba(0, 0, 0, 0.1)",
|
@@ -139,7 +140,7 @@
|
|
139
140
|
"cardBg": "#F0F4F9",
|
140
141
|
"cardGutter": 0,
|
141
142
|
"cardHeight": 44,
|
142
|
-
"cardPadding": "
|
143
|
+
"cardPadding": "12px 32px"
|
143
144
|
},
|
144
145
|
"Pagination": {
|
145
146
|
"itemActiveBg": "#325CF7",
|
package/dist/index.d.ts
CHANGED
@@ -1,10 +1,6 @@
|
|
1
|
-
import McCascader from './McCascader';
|
2
|
-
import McContainer from './McContainer';
|
3
|
-
import McDateRange from './McDateRange';
|
4
1
|
import McFonts from './McFonts';
|
5
2
|
import McGroupPanel from './McGroupPanel';
|
6
3
|
import McIconFont from './McIconFont';
|
7
|
-
import McInput from './McInput';
|
8
4
|
import McInputNumber from './McInputNumber';
|
9
5
|
import McModalProvider from './McModalProvider';
|
10
6
|
import McPeriodSelect from './McPeriodSelect';
|
@@ -12,11 +8,20 @@ import McPopoverButton from './McPopoverButton';
|
|
12
8
|
import McPopoverForm from './McPopoverForm';
|
13
9
|
import McProSelect from './McProSelect';
|
14
10
|
import McResult from './McResult';
|
15
|
-
import McSelect from './McSelect';
|
16
11
|
import McTag from './McTag';
|
17
12
|
import McLazyLoader from './McLazyLoader';
|
18
13
|
import McThemeConfig from './McThemeConfig';
|
19
14
|
import McTreePanel from './McTreePanel';
|
20
15
|
import McTreeSelect from './McTreeSelect';
|
16
|
+
export * from './McCascader';
|
17
|
+
export { default as McCascader } from './McCascader';
|
18
|
+
export * from './McContainer';
|
19
|
+
export { default as McContainer } from './McContainer';
|
20
|
+
export * from './McDateRange';
|
21
|
+
export { default as McDateRange } from './McDateRange';
|
22
|
+
export * from './McInput';
|
23
|
+
export { default as McInput } from './McInput';
|
24
|
+
export * from './McSelect';
|
25
|
+
export { default as McSelect } from './McSelect';
|
21
26
|
import * as Utils from './Utils';
|
22
|
-
export {
|
27
|
+
export { McFonts, McGroupPanel, McIconFont, McInputNumber, McLazyLoader, McModalProvider, McPeriodSelect, McPopoverButton, McPopoverForm, McProSelect, McResult, McTag, McThemeConfig, McTreePanel, McTreeSelect, Utils, };
|
package/dist/index.js
CHANGED
@@ -1,10 +1,6 @@
|
|
1
|
-
import McCascader from "./McCascader";
|
2
|
-
import McContainer from "./McContainer";
|
3
|
-
import McDateRange from "./McDateRange";
|
4
1
|
import McFonts from "./McFonts";
|
5
2
|
import McGroupPanel from "./McGroupPanel";
|
6
3
|
import McIconFont from "./McIconFont";
|
7
|
-
import McInput from "./McInput";
|
8
4
|
import McInputNumber from "./McInputNumber";
|
9
5
|
import McModalProvider from "./McModalProvider";
|
10
6
|
import McPeriodSelect from "./McPeriodSelect";
|
@@ -12,11 +8,20 @@ import McPopoverButton from "./McPopoverButton";
|
|
12
8
|
import McPopoverForm from "./McPopoverForm";
|
13
9
|
import McProSelect from "./McProSelect";
|
14
10
|
import McResult from "./McResult";
|
15
|
-
import McSelect from "./McSelect";
|
16
11
|
import McTag from "./McTag";
|
17
12
|
import McLazyLoader from "./McLazyLoader";
|
18
13
|
import McThemeConfig from "./McThemeConfig";
|
19
14
|
import McTreePanel from "./McTreePanel";
|
20
15
|
import McTreeSelect from "./McTreeSelect";
|
16
|
+
export * from "./McCascader";
|
17
|
+
export { default as McCascader } from "./McCascader";
|
18
|
+
export * from "./McContainer";
|
19
|
+
export { default as McContainer } from "./McContainer";
|
20
|
+
export * from "./McDateRange";
|
21
|
+
export { default as McDateRange } from "./McDateRange";
|
22
|
+
export * from "./McInput";
|
23
|
+
export { default as McInput } from "./McInput";
|
24
|
+
export * from "./McSelect";
|
25
|
+
export { default as McSelect } from "./McSelect";
|
21
26
|
import * as Utils from "./Utils";
|
22
|
-
export {
|
27
|
+
export { McFonts, McGroupPanel, McIconFont, McInputNumber, McLazyLoader, McModalProvider, McPeriodSelect, McPopoverButton, McPopoverForm, McProSelect, McResult, McTag, McThemeConfig, McTreePanel, McTreeSelect, Utils };
|