@zykj2024/much-library 1.0.12-beta.1 → 1.0.12-beta.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/dist/McContainer/demo/actionBar.d.ts +1 -1
  2. package/dist/McContainer/demo/actionBar.js +58 -10
  3. package/dist/McContainer/demo/batch.d.ts +1 -1
  4. package/dist/McContainer/demo/batch.js +70 -30
  5. package/dist/McContainer/demo/standard.js +1 -2
  6. package/dist/McContainer/index.d.ts +21 -2
  7. package/dist/McContainer/index.js +85 -23
  8. package/dist/McEllipsisMiddle/demo/base.d.ts +6 -0
  9. package/dist/McEllipsisMiddle/demo/base.js +25 -0
  10. package/dist/McEllipsisMiddle/index.css +4 -0
  11. package/dist/McEllipsisMiddle/index.d.ts +11 -0
  12. package/dist/McEllipsisMiddle/index.js +32 -0
  13. package/dist/McGroupPanel/comps/SelectedItem/index.js +2 -3
  14. package/dist/McGroupPanel/index.css +12 -10
  15. package/dist/McGroupPanel/index.js +34 -34
  16. package/dist/McInput/index.css +2 -0
  17. package/dist/McInputNumber/demo/index.js +6 -0
  18. package/dist/McInputNumber/index.css +27 -0
  19. package/dist/McSelect/demo/panelInSearch.d.ts +2 -0
  20. package/dist/McSelect/demo/panelInSearch.js +47 -0
  21. package/dist/McThemeConfig/demo/card.d.ts +2 -0
  22. package/dist/McThemeConfig/demo/card.js +60 -0
  23. package/dist/McThemeConfig/globalStyle.js +1 -1
  24. package/dist/McThemeConfig/layoutStyle.d.ts +1 -1
  25. package/dist/McThemeConfig/layoutStyle.js +1 -1
  26. package/dist/McThemeConfig/provider.d.ts +1 -0
  27. package/dist/McThemeConfig/provider.js +1 -0
  28. package/dist/McThemeConfig/themeToken.json +5 -3
  29. package/dist/Styles/demo/basic.d.ts +2 -0
  30. package/dist/Styles/demo/basic.js +44 -0
  31. package/dist/Styles/demo/delete-icon.d.ts +2 -0
  32. package/dist/Styles/demo/delete-icon.js +72 -0
  33. package/dist/Styles/demo/form-bottom-0.d.ts +2 -0
  34. package/dist/Styles/demo/form-bottom-0.js +33 -0
  35. package/dist/Styles/index.css +41 -0
  36. package/dist/Styles/mixins.css +2 -0
  37. package/dist/Styles/utilities.css +41 -0
  38. package/dist/index.d.ts +1 -0
  39. package/dist/index.js +1 -0
  40. package/package.json +6 -1
package/dist/McGroupPanel/index.js CHANGED
@@ -4,8 +4,8 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
4
4
  import { DndContext } from '@dnd-kit/core';
5
5
  import { SortableContext, arrayMove, verticalListSortingStrategy } from '@dnd-kit/sortable';
6
6
  import { Button, Checkbox, Empty, Input, Typography } from 'antd';
7
+ import debounce from 'lodash/debounce';
7
8
  import { SearchOutlined } from 'much-icons';
8
- import { Utils } from "./..";
9
9
  import { useEffect, useMemo, useState } from 'react';
10
10
  import SelectedItem from "./comps/SelectedItem";
11
11
  import "./index.css";
@@ -122,26 +122,26 @@ var McGroupPanel = function McGroupPanel(props) {
122
122
  setGroupMap(_groupMap);
123
123
  setActiveGroup(_options === null || _options === void 0 || (_options$2 = _options[0]) === null || _options$2 === void 0 ? void 0 : _options$2.value);
124
124
  };
125
- return Utils.debounce(fn, 350);
125
+ return debounce(fn, 350);
126
126
  }, [options]);
127
- var echo = function echo(value) {
128
- var _inexistentItemMap = {};
129
- value === null || value === void 0 || value.forEach(function (item) {
130
- var v = labelInValue ? item.value : item,
131
- l = labelInValue ? item.label || item.value : item;
132
- if (!itemMap[v]) _inexistentItemMap[v] = {
133
- value: v,
134
- label: l
135
- };
136
- });
137
- setSelected(value ? labelInValue ? value.map(function (item) {
138
- return item.value;
139
- }) : value : []);
140
- setInexistentItemMap(_inexistentItemMap);
141
- };
142
127
 
143
128
  /* 回显 */
144
129
  useEffect(function () {
130
+ var echo = function echo(value) {
131
+ var _inexistentItemMap = {};
132
+ value === null || value === void 0 || value.forEach(function (item) {
133
+ var v = labelInValue ? item.value : item,
134
+ l = labelInValue ? item.label || item.value : item;
135
+ if (!itemMap[v]) _inexistentItemMap[v] = {
136
+ value: v,
137
+ label: l
138
+ };
139
+ });
140
+ setSelected(value ? labelInValue ? value.map(function (item) {
141
+ return item.value;
142
+ }) : value : []);
143
+ setInexistentItemMap(_inexistentItemMap);
144
+ };
145
145
  echo(value);
146
146
  }, [value]);
147
147
 
@@ -189,9 +189,7 @@ var McGroupPanel = function McGroupPanel(props) {
189
189
  onChange: function onChange(e) {
190
190
  var v = e.target.value.trim();
191
191
  setSearchValue(v);
192
- if (v !== searchValue) {
193
- debounceSearch(v);
194
- }
192
+ v !== searchValue && debounceSearch(v);
195
193
  }
196
194
  })
197
195
  }), _options.length > 0 ? /*#__PURE__*/_jsxs("div", {
@@ -199,7 +197,7 @@ var McGroupPanel = function McGroupPanel(props) {
199
197
  children: [/*#__PURE__*/_jsxs("div", {
200
198
  className: "mc-group-panel__options-groups",
201
199
  children: [/*#__PURE__*/_jsx("div", {
202
- className: "mc-group-panel__checkbox-wrapper",
200
+ className: "mc-group-panel__checkbox-wrapper mc-group-panel__check-all",
203
201
  children: /*#__PURE__*/_jsx(Checkbox, {
204
202
  checked: allValues.length > 0 && allValues.every(function (v) {
205
203
  return selected.includes(v);
@@ -221,7 +219,7 @@ var McGroupPanel = function McGroupPanel(props) {
221
219
  className: "mc-group-panel__options-list",
222
220
  children: _options.map(function (item) {
223
221
  var _groupMap$item$value, _groupMap$item$value2;
224
- return /*#__PURE__*/_jsx("div", {
222
+ return /*#__PURE__*/_jsxs("div", {
225
223
  className: "mc-group-panel__checkbox-wrapper",
226
224
  style: {
227
225
  background: activeGroup === item.value ? '#EAEEFE' : ''
@@ -229,7 +227,7 @@ var McGroupPanel = function McGroupPanel(props) {
229
227
  onClick: function onClick() {
230
228
  return setActiveGroup(item.value);
231
229
  },
232
- children: /*#__PURE__*/_jsx(Checkbox, {
230
+ children: [/*#__PURE__*/_jsx(Checkbox, {
233
231
  checked: ((_groupMap$item$value = groupMap[item.value]) === null || _groupMap$item$value === void 0 ? void 0 : _groupMap$item$value.length) > 0 && groupMap[item.value].every(function (_ref2) {
234
232
  var value = _ref2.value;
235
233
  return selected.includes(value);
@@ -255,16 +253,18 @@ var McGroupPanel = function McGroupPanel(props) {
255
253
  }));
256
254
  },
257
255
  disabled: disabled,
258
- children: /*#__PURE__*/_jsx(Typography.Paragraph, {
259
- style: {
260
- margin: 0
261
- },
262
- ellipsis: {
263
- tooltip: item.label
264
- },
265
- children: item.label
266
- })
267
- })
256
+ onClick: function onClick(e) {
257
+ return e.stopPropagation();
258
+ }
259
+ }), /*#__PURE__*/_jsx(Typography.Paragraph, {
260
+ style: {
261
+ margin: '0 0 0 8px'
262
+ },
263
+ ellipsis: {
264
+ tooltip: item.label
265
+ },
266
+ children: item.label
267
+ })]
268
268
  }, item.value);
269
269
  })
270
270
  })]
@@ -272,7 +272,7 @@ var McGroupPanel = function McGroupPanel(props) {
272
272
  className: "mc-group-panel__options-items",
273
273
  children: ((_groupMap$activeGroup = groupMap[activeGroup]) === null || _groupMap$activeGroup === void 0 ? void 0 : _groupMap$activeGroup.length) > 0 ? /*#__PURE__*/_jsxs(_Fragment, {
274
274
  children: [/*#__PURE__*/_jsx("div", {
275
- className: "mc-group-panel__checkbox-wrapper",
275
+ className: "mc-group-panel__checkbox-wrapper mc-group-panel__check-all",
276
276
  children: /*#__PURE__*/_jsx(Checkbox, {
277
277
  checked: ((_groupMap$activeGroup2 = groupMap[activeGroup]) === null || _groupMap$activeGroup2 === void 0 ? void 0 : _groupMap$activeGroup2.length) > 0 && groupMap[activeGroup].every(function (_ref7) {
278
278
  var value = _ref7.value;
package/dist/McInput/index.css CHANGED
@@ -1,3 +1,5 @@
1
+ /** 给input和input number用的， 增加竖线 **/
2
+ /** 最后一个formitem没有底部空白 */
1
3
  .mc-input .ant-input-suffix .ant-input-show-count-suffix,
2
4
  .mc-search .ant-input-suffix .ant-input-show-count-suffix {
3
5
  color: #b3b3b3;
package/dist/McInputNumber/demo/index.js CHANGED
@@ -14,6 +14,12 @@ export default (function () {
14
14
  style: {
15
15
  width: 200
16
16
  }
17
+ }), /*#__PURE__*/_jsx(McInputNumber, {
18
+ addonBefore: "\u65E7\u7D20\u6750",
19
+ addonAfter: "%",
20
+ style: {
21
+ width: 200
22
+ }
17
23
  }), /*#__PURE__*/_jsxs(Space, {
18
24
  children: [/*#__PURE__*/_jsx("span", {
19
25
  children: "\u7981\u7528"
package/dist/McInputNumber/index.css CHANGED
@@ -1,3 +1,5 @@
1
+ /** 给input和input number用的， 增加竖线 **/
2
+ /** 最后一个formitem没有底部空白 */
1
3
  .mc-input-number__label {
2
4
  color: #262626;
3
5
  font-size: 14px;
@@ -7,3 +9,28 @@
7
9
  content: '：';
8
10
  margin-left: 2px;
9
11
  }
12
+ .mc-input-number .ant-input-number-wrapper .ant-input-number-group-addon:nth-child(1)::after,
13
+ .mc-input-number .ant-input-number-wrapper .ant-input-number-group-addon:nth-last-child(1)::before {
14
+ content: '';
15
+ position: absolute;
16
+ top: 50%;
17
+ /* 居中对齐 */
18
+ -webkit-transform: translateY(-50%);
19
+ -ms-transform: translateY(-50%);
20
+ transform: translateY(-50%);
21
+ /* 垂直居中 */
22
+ height: 50%;
23
+ /* 竖线高度为输入框高度的 50% */
24
+ width: 1px;
25
+ /* 竖线宽度 */
26
+ background-color: #d8d8d8;
27
+ /* 竖线颜色 */
28
+ }
29
+ .mc-input-number .ant-input-number-wrapper .ant-input-number-group-addon:nth-child(1)::after {
30
+ right: 0;
31
+ /* 定位到右侧 */
32
+ }
33
+ .mc-input-number .ant-input-number-wrapper .ant-input-number-group-addon:nth-last-child(1)::before {
34
+ left: 0;
35
+ /* 定位到右侧 */
36
+ }
package/dist/McSelect/demo/panelInSearch.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const _default: () => import("react/jsx-runtime").JSX.Element;
2
+ export default _default;
package/dist/McSelect/demo/panelInSearch.js ADDED
@@ -0,0 +1,47 @@
1
+ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
+ /**
3
+ * title: 搜索框下移+已选中的优先展示
4
+ * description: 默认都为false，仅支持多选
5
+ */
6
+ import { Space } from 'antd';
7
+ import { McSelect } from "../..";
8
+ import { useState } from 'react';
9
+ import { jsx as _jsx } from "react/jsx-runtime";
10
+ var options = [{
11
+ value: 'jack',
12
+ label: 'Jack'
13
+ }, {
14
+ value: 'lucy',
15
+ label: 'Lucy'
16
+ }, {
17
+ value: 'Yiminghe',
18
+ label: 'yiminghe'
19
+ }, {
20
+ value: 'disabled',
21
+ label: 'Disabled',
22
+ disabled: true
23
+ }];
24
+ export default (function () {
25
+ var _useState = useState(options),
26
+ _useState2 = _slicedToArray(_useState, 2),
27
+ finalOptions = _useState2[0],
28
+ setFinalOptions = _useState2[1];
29
+ return /*#__PURE__*/_jsx(Space, {
30
+ wrap: true,
31
+ children: /*#__PURE__*/_jsx(McSelect, {
32
+ style: {
33
+ width: 240
34
+ },
35
+ searchInPanel: true,
36
+ pinSelectedOptions: true,
37
+ searchInPanelPlaceholder: "\u81EA\u5B9A\u4E49\u641C\u7D22\u6846\u63D0\u793A\u6587\u5B57",
38
+ options: finalOptions,
39
+ onSearch: function onSearch(v) {
40
+ return setFinalOptions(options.filter(function (item) {
41
+ return item.value.includes(v);
42
+ }));
43
+ },
44
+ multiple: true
45
+ })
46
+ });
47
+ });
package/dist/McThemeConfig/demo/card.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const _default: () => import("react/jsx-runtime").JSX.Element;
2
+ export default _default;
package/dist/McThemeConfig/demo/card.js ADDED
@@ -0,0 +1,60 @@
1
+ import { Card, Space } from 'antd';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ import { jsxs as _jsxs } from "react/jsx-runtime";
4
+ import { Fragment as _Fragment } from "react/jsx-runtime";
5
+ export default (function () {
6
+ return /*#__PURE__*/_jsxs(_Fragment, {
7
+ children: [/*#__PURE__*/_jsxs(Space, {
8
+ children: [/*#__PURE__*/_jsx("div", {
9
+ style: {
10
+ backgroundColor: 'rgb(240, 242, 245)',
11
+ padding: 24
12
+ },
13
+ children: /*#__PURE__*/_jsxs(Card, {
14
+ size: "small",
15
+ title: "\u65E0\u8FB9\u6846\u5361\u7247, \u5728\u7070\u8272\u80CC\u666F\u4F7F\u7528",
16
+ bordered: false,
17
+ style: {
18
+ width: 300
19
+ },
20
+ children: [/*#__PURE__*/_jsx("p", {
21
+ children: "Card content"
22
+ }), /*#__PURE__*/_jsx("p", {
23
+ children: "Card content"
24
+ }), /*#__PURE__*/_jsx("p", {
25
+ children: "Card content"
26
+ })]
27
+ })
28
+ }), /*#__PURE__*/_jsxs(Card, {
29
+ size: "small",
30
+ title: "\u6709\u8FB9\u6846\u5361\u7247",
31
+ style: {
32
+ width: 300
33
+ },
34
+ children: [/*#__PURE__*/_jsx("p", {
35
+ children: "Card content"
36
+ }), /*#__PURE__*/_jsx("p", {
37
+ children: "Card content"
38
+ }), /*#__PURE__*/_jsx("p", {
39
+ children: "Card content"
40
+ })]
41
+ })]
42
+ }), /*#__PURE__*/_jsx(Space, {
43
+ children: /*#__PURE__*/_jsxs(Card, {
44
+ size: "small",
45
+ type: "inner",
46
+ title: "\u5185\u90E8\u5361\u7247",
47
+ style: {
48
+ width: 300
49
+ },
50
+ children: [/*#__PURE__*/_jsx("p", {
51
+ children: "Card content"
52
+ }), /*#__PURE__*/_jsx("p", {
53
+ children: "Card content"
54
+ }), /*#__PURE__*/_jsx("p", {
55
+ children: "Card content"
56
+ })]
57
+ })
58
+ })]
59
+ });
60
+ });
package/dist/McThemeConfig/globalStyle.js CHANGED
@@ -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 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) {
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 box-sizing: border-box;\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.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\n// <====================== Card ======================>\n.ant-card-type-inner .ant-card-head {\n border-bottom-width: 0;\n background: #FAFAFA;\n}\n\n// <====================== Table two scroll ======================>\n.ant-table-wrapper .ant-table-sticky-scroll {\n height: 0 !important;\n background: #d9d9d9;\n border-top-width: 0;\n opacity: 1;\n}\n\n.ant-table-wrapper .ant-table-sticky-scroll-bar-active, .ant-table-wrapper .ant-table-sticky-scroll-bar:hover {\n background-color: #d9d9d9;\n}\n\n.ant-table-wrapper .ant-table-sticky-scroll-bar {\n height: 6px;\n position: absolute;\n background: #d9d9d9;\n bottom: 2px;\n}\n\n.ant-table-wrapper .ant-table-sticky-scroll-bar:after {\n content: \" \";\n display: block;\n height: 2px;\n background: #FFF;\n position: absolute;\n top: 6px;\n left: 0;\n right: 0;\n}\n\n// <====================== antd 5.22 bugfix ======================>\n.ant-select-multiple .ant-select-selection-wrap {\n position: static;\n}\n"])), function (props) {
6
6
  return props.layout;
7
7
  }, function (props) {
8
8
  return props.font.Regular;
package/dist/McThemeConfig/layoutStyle.d.ts CHANGED
@@ -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\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 }";
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: 21px;\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;
package/dist/McThemeConfig/layoutStyle.js CHANGED
@@ -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\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 }";
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: 21px;\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 }";
package/dist/McThemeConfig/provider.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import { ReactElement } from 'react';
2
+ import '../Styles/utilities.less';
2
3
  export interface IMcThemeProviderProps {
3
4
  children: ReactElement;
4
5
  layout?: boolean;
package/dist/McThemeConfig/provider.js CHANGED
@@ -3,6 +3,7 @@ import { McFonts } from "./..";
3
3
  import GlobalStyle from "./globalStyle";
4
4
  import McThemeConfig from "./index";
5
5
  import LayoutStyle from "./layoutStyle";
6
+ import "../Styles/utilities.css";
6
7
  import { jsx as _jsx } from "react/jsx-runtime";
7
8
  import { jsxs as _jsxs } from "react/jsx-runtime";
8
9
  var McThemeProvider = function McThemeProvider(_ref) {
package/dist/McThemeConfig/themeToken.json CHANGED
@@ -8,8 +8,9 @@
8
8
  "colorText": "#262626",
9
9
  "colorTextSecondary": "#595959",
10
10
  "colorTextTertiary": "#8c8c8c",
11
- "colorTextQuaternary": "#b3b3b3",
12
- "controlHeightSM": 26
11
+ "colorTextQuaternary": "#8c8c8c",
12
+ "controlHeightSM": 26,
13
+ "fontFamily": "'SourceHanSansCN', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji'"
13
14
  },
14
15
  "components": {
15
16
  "Button": {
@@ -117,7 +118,8 @@
117
118
  "hoverBorderColor": "rgb(50, 92, 247)",
118
119
  "cellBgDisabled": "rgba(240, 242, 245, 0.5)",
119
120
  "multipleItemColorDisabled": "rgb(179, 179, 179)",
120
- "colorBgContainerDisabled": "rgba(240, 242, 245, 0.5)"
121
+ "colorBgContainerDisabled": "rgba(240, 242, 245, 0.5)",
122
+ "colorTextPlaceholder": "rgb(140, 140, 140)"
121
123
  },
122
124
  "Cascader": {
123
125
  "colorBgContainerDisabled": "rgba(240, 242, 245, 0.5)",
package/dist/Styles/demo/basic.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const _default: () => import("react/jsx-runtime").JSX.Element;
2
+ export default _default;
package/dist/Styles/demo/basic.js ADDED
@@ -0,0 +1,44 @@
1
+ import { Form, Radio } from 'antd';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ import { jsxs as _jsxs } from "react/jsx-runtime";
4
+ export default (function () {
5
+ return /*#__PURE__*/_jsxs("div", {
6
+ children: [/*#__PURE__*/_jsx(Form.Item, {
7
+ label: ".text-center",
8
+ children: /*#__PURE__*/_jsx("div", {
9
+ style: {
10
+ width: 100,
11
+ border: '1px solid grey'
12
+ },
13
+ className: "text-center",
14
+ children: "\u6587\u5B57\u5C45\u4E2D"
15
+ })
16
+ }), /*#__PURE__*/_jsx(Form.Item, {
17
+ label: ".text-ellipsis",
18
+ children: /*#__PURE__*/_jsx("div", {
19
+ style: {
20
+ width: 100,
21
+ border: '1px solid grey'
22
+ },
23
+ className: "text-ellipsis",
24
+ children: "\u5C3E\u90E8\u8D85\u51FA\u7701\u7565\u5C3E\u90E8\u8D85\u51FA\u7701\u7565\u5C3E\u90E8\u8D85\u51FA\u7701\u7565\u5C3E\u90E8\u8D85\u51FA\u7701\u7565"
25
+ })
26
+ }), /*#__PURE__*/_jsx(Form.Item, {
27
+ label: "\u7B49\u5BBDRadioButton .equal-radio-group",
28
+ children: /*#__PURE__*/_jsxs(Radio.Group, {
29
+ className: "equal-radio-group",
30
+ value: "a",
31
+ children: [/*#__PURE__*/_jsx(Radio.Button, {
32
+ value: "a",
33
+ children: "A"
34
+ }), /*#__PURE__*/_jsx(Radio.Button, {
35
+ value: "b",
36
+ children: "B"
37
+ }), /*#__PURE__*/_jsx(Radio.Button, {
38
+ value: "c",
39
+ children: "C\u5F88\u957F\u5F88\u957F"
40
+ })]
41
+ })
42
+ })]
43
+ });
44
+ });
package/dist/Styles/demo/delete-icon.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const _default: () => import("react/jsx-runtime").JSX.Element;
2
+ export default _default;
package/dist/Styles/demo/delete-icon.js ADDED
@@ -0,0 +1,72 @@
1
+ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
+ var _excluded = ["key", "name"];
4
+ import { Button, Form, Input, Space } from 'antd';
5
+ import { DeleteOutlined, PlusOutlined } from 'much-icons';
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ import { jsxs as _jsxs } from "react/jsx-runtime";
8
+ import { Fragment as _Fragment } from "react/jsx-runtime";
9
+ export default (function () {
10
+ return /*#__PURE__*/_jsx("div", {
11
+ children: /*#__PURE__*/_jsx(Form, {
12
+ layout: "vertical",
13
+ children: /*#__PURE__*/_jsx(Form.List, {
14
+ name: "items",
15
+ initialValue: [{
16
+ name: '',
17
+ description: ''
18
+ }] // 初始数据
19
+ ,
20
+ children: function children(fields, _ref) {
21
+ var add = _ref.add,
22
+ remove = _ref.remove;
23
+ return /*#__PURE__*/_jsxs(_Fragment, {
24
+ children: [fields.map(function (_ref2) {
25
+ var key = _ref2.key,
26
+ name = _ref2.name,
27
+ restField = _objectWithoutProperties(_ref2, _excluded);
28
+ return /*#__PURE__*/_jsxs(Space, {
29
+ style: {
30
+ display: 'flex',
31
+ marginBottom: 0
32
+ },
33
+ align: "baseline",
34
+ children: [/*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, restField), {}, {
35
+ name: [name, 'name'],
36
+ rules: [{
37
+ required: true,
38
+ message: '请输入名称'
39
+ }],
40
+ children: /*#__PURE__*/_jsx(Input, {
41
+ placeholder: "\u540D\u79F0"
42
+ })
43
+ })), /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, restField), {}, {
44
+ name: [name, 'description'],
45
+ rules: [{
46
+ required: true,
47
+ message: '请输入描述'
48
+ }],
49
+ children: /*#__PURE__*/_jsx(Input, {
50
+ placeholder: "\u63CF\u8FF0"
51
+ })
52
+ })), /*#__PURE__*/_jsx(DeleteOutlined, {
53
+ className: "mc-delete-icon",
54
+ onClick: function onClick() {
55
+ return remove(name);
56
+ }
57
+ })]
58
+ }, key);
59
+ }), /*#__PURE__*/_jsx(Button, {
60
+ type: "link",
61
+ onClick: function onClick() {
62
+ return add();
63
+ },
64
+ icon: /*#__PURE__*/_jsx(PlusOutlined, {}),
65
+ children: "\u6DFB\u52A0"
66
+ })]
67
+ });
68
+ }
69
+ })
70
+ })
71
+ });
72
+ });
package/dist/Styles/demo/form-bottom-0.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const _default: () => import("react/jsx-runtime").JSX.Element;
2
+ export default _default;
package/dist/Styles/demo/form-bottom-0.js ADDED
@@ -0,0 +1,33 @@
1
+ import { Card, Form, Input, Space } from 'antd';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ import { jsxs as _jsxs } from "react/jsx-runtime";
4
+ export default (function () {
5
+ return /*#__PURE__*/_jsx("div", {
6
+ children: /*#__PURE__*/_jsx("div", {
7
+ children: /*#__PURE__*/_jsxs(Space, {
8
+ children: [/*#__PURE__*/_jsxs(Card, {
9
+ type: "inner",
10
+ title: "\u9ED8\u8BA4\u72B6\u6001\uFF0C\u5E95\u90E8\u95F4\u8DDD\u8FC7\u5927",
11
+ children: [/*#__PURE__*/_jsx(Form.Item, {
12
+ label: "\u59D3\u540D",
13
+ children: /*#__PURE__*/_jsx(Input, {})
14
+ }), /*#__PURE__*/_jsx(Form.Item, {
15
+ label: "\u5E74\u9F84",
16
+ children: /*#__PURE__*/_jsx(Input, {})
17
+ })]
18
+ }), /*#__PURE__*/_jsxs(Card, {
19
+ type: "inner",
20
+ title: "\u6DFB\u52A0className='card-last-form-item-mb0',\u53BB\u6389\u5E95\u90E8\u95F4\u8DDD",
21
+ className: "card-last-form-item-mb0",
22
+ children: [/*#__PURE__*/_jsx(Form.Item, {
23
+ label: "\u59D3\u540D",
24
+ children: /*#__PURE__*/_jsx(Input, {})
25
+ }), /*#__PURE__*/_jsx(Form.Item, {
26
+ label: "\u5E74\u9F84",
27
+ children: /*#__PURE__*/_jsx(Input, {})
28
+ })]
29
+ })]
30
+ })
31
+ })
32
+ });
33
+ });