@jiaozhiye/qm-design-react 1.9.6 → 1.9.7

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 (15) hide show
  1. package/lib/download/src/download.d.ts +0 -1
  2. package/lib/index.esm.js +1 -1
  3. package/lib/index.full.js +1 -1
  4. package/lib/index.js +1 -1
  5. package/lib/locale/lang/en.d.ts +2 -0
  6. package/lib/locale/lang/en.js +3 -1
  7. package/lib/locale/lang/zh-cn.d.ts +2 -0
  8. package/lib/locale/lang/zh-cn.js +3 -1
  9. package/lib/style/index.css +52 -5
  10. package/lib/style/index.min.css +1 -1
  11. package/lib/style/themes/default.less +117 -117
  12. package/lib/upload-file/src/upload-file.d.ts +1 -1
  13. package/lib/upload-img/src/upload-img.d.ts +5 -0
  14. package/lib/upload-img/style/index.less +52 -3
  15. package/package.json +2 -2
package/lib/style/themes/default.less CHANGED
@@ -1,117 +1,117 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2021-07-23 18:25:34
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2023-03-28 11:42:59
6
- */
7
- // The prefix to use on all css classes.
8
- @qm-prefix: qm;
9
-
10
- // An override for the html selector for theme prefixes
11
- @--html-selector: html;
12
-
13
- // -------- Colors -----------
14
- @--primary-color: #1890ff;
15
-
16
- @--info-color: @--primary-color;
17
- @--success-color: #52c41a;
18
- @--error-color: #f5222d;
19
- @--warning-color: #faad14;
20
- @--normal-color: #d9d9d9;
21
- @--white: #fff;
22
- @--black: #000;
23
-
24
- // Color used by default to control hover and active backgrounds and for
25
- // colorPalette from antd/lib/style/color/colorPalette
26
- @--primary-1: color(~`colorPalette('@{--primary-color}', 1) `);
27
- @--primary-2: color(~`colorPalette('@{--primary-color}', 2) `);
28
- @--primary-3: color(~`colorPalette('@{--primary-color}', 3) `);
29
- @--primary-4: color(~`colorPalette('@{--primary-color}', 4) `);
30
- @--primary-5: color(~`colorPalette('@{--primary-color}', 5) `);
31
- @--primary-6: @--primary-color;
32
- @--primary-7: color(~`colorPalette('@{--primary-color}', 7) `);
33
- @--primary-8: color(~`colorPalette('@{--primary-color}', 8) `);
34
- @--primary-9: color(~`colorPalette('@{--primary-color}', 9) `);
35
- @--primary-10: color(~`colorPalette('@{--primary-color}', 10) `);
36
-
37
- // Background color for `<body>`
38
- @--body-background: @--white;
39
- // Base background color for most components
40
- @--component-background: @--white;
41
- // Popover background color
42
- @--popover-background: @--component-background;
43
-
44
- // Background-color
45
- @--background-color: #f2f2f2;
46
- @--background-color-cecondary: #f5f5f5;
47
-
48
- // Font-family
49
- @--font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
50
- 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
51
- @--font-path: './fonts';
52
-
53
- // Text color
54
- @--text-color: fade(@--black, 85%);
55
- @--text-color-secondary-dark: fade(@--black, 65%);
56
- @--text-color-secondary: fade(@--black, 45%);
57
- @--header-color: fade(@--black, 85%);
58
-
59
- // Iconfont
60
- @--icon-color: @--text-color-secondary-dark;
61
-
62
- // Disabled color
63
- @--disabled-color: fade(@--black, 25%);
64
- @--disabled-bg: @--background-color;
65
-
66
- // Font-size
67
- @--font-size-base: 14px;
68
- @--font-size-lg: @--font-size-base + 2px;
69
- @--font-size-sm: 12px;
70
-
71
- // Line-height
72
- @--line-height-base: 1.5715;
73
-
74
- // Border
75
- @--border-color-base: #d9d9d9;
76
- @--border-color-secondary: #e8e8e8;
77
- @--border-width-base: 1px;
78
- @--border-style-base: solid;
79
- @--border-radius-base: 2px;
80
- @--border-radius-sm: @--border-radius-base;
81
-
82
- // Outline
83
- @--outline-width: 2px;
84
- @--outline-color: @--primary-color;
85
- @--error-color-outline: fade(@--error-color, 20%);
86
-
87
- // Vertical paddings
88
- @--padding-lg: 12px;
89
- @--padding-md: 10px;
90
- @--padding-sm: 8px;
91
-
92
- // Vertical margins
93
- @--margin-lg: 12px;
94
- @--margin-md: 10px;
95
- @--margin-sm: 8px;
96
-
97
- // Height rules
98
- @--height-lg: 40px;
99
- @--height-md: 32px;
100
- @--height-sm: 24px;
101
-
102
- // LINK
103
- @--link-color: @--primary-color;
104
- @--link-hover-color: @--primary-5;
105
- @--link-active-color: @--primary-7;
106
-
107
- // Shadow
108
- @--shadow-color: fade(@--black, 0.15);
109
- @--shadow-1-up: 0 -2px 8px @--shadow-color;
110
- @--shadow-1-down: 0 2px 8px @--shadow-color;
111
- @--shadow-1-left: -2px 0 8px @--shadow-color;
112
- @--shadow-1-right: 2px 0 8px @--shadow-color;
113
- @--box-shadow-base: @--shadow-1-down;
114
-
115
- // antd
116
- @blue-base: @--primary-color;
117
- @input-disabled-color: @--text-color-secondary-dark;
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2021-07-23 18:25:34
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2023-03-28 11:42:59
6
+ */
7
+ // The prefix to use on all css classes.
8
+ @qm-prefix: qm;
9
+
10
+ // An override for the html selector for theme prefixes
11
+ @--html-selector: html;
12
+
13
+ // -------- Colors -----------
14
+ @--primary-color: #1890ff;
15
+
16
+ @--info-color: @--primary-color;
17
+ @--success-color: #52c41a;
18
+ @--error-color: #ff4d4f;
19
+ @--warning-color: #faad14;
20
+ @--normal-color: #d9d9d9;
21
+ @--white: #fff;
22
+ @--black: #000;
23
+
24
+ // Color used by default to control hover and active backgrounds and for
25
+ // colorPalette from antd/lib/style/color/colorPalette
26
+ @--primary-1: color(~`colorPalette('@{--primary-color}', 1) `);
27
+ @--primary-2: color(~`colorPalette('@{--primary-color}', 2) `);
28
+ @--primary-3: color(~`colorPalette('@{--primary-color}', 3) `);
29
+ @--primary-4: color(~`colorPalette('@{--primary-color}', 4) `);
30
+ @--primary-5: color(~`colorPalette('@{--primary-color}', 5) `);
31
+ @--primary-6: @--primary-color;
32
+ @--primary-7: color(~`colorPalette('@{--primary-color}', 7) `);
33
+ @--primary-8: color(~`colorPalette('@{--primary-color}', 8) `);
34
+ @--primary-9: color(~`colorPalette('@{--primary-color}', 9) `);
35
+ @--primary-10: color(~`colorPalette('@{--primary-color}', 10) `);
36
+
37
+ // Background color for `<body>`
38
+ @--body-background: @--white;
39
+ // Base background color for most components
40
+ @--component-background: @--white;
41
+ // Popover background color
42
+ @--popover-background: @--component-background;
43
+
44
+ // Background-color
45
+ @--background-color: #f2f2f2;
46
+ @--background-color-cecondary: #f5f5f5;
47
+
48
+ // Font-family
49
+ @--font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
50
+ 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
51
+ @--font-path: './fonts';
52
+
53
+ // Text color
54
+ @--text-color: fade(@--black, 85%);
55
+ @--text-color-secondary-dark: fade(@--black, 65%);
56
+ @--text-color-secondary: fade(@--black, 45%);
57
+ @--header-color: fade(@--black, 85%);
58
+
59
+ // Iconfont
60
+ @--icon-color: @--text-color-secondary-dark;
61
+
62
+ // Disabled color
63
+ @--disabled-color: fade(@--black, 25%);
64
+ @--disabled-bg: @--background-color;
65
+
66
+ // Font-size
67
+ @--font-size-base: 14px;
68
+ @--font-size-lg: @--font-size-base + 2px;
69
+ @--font-size-sm: 12px;
70
+
71
+ // Line-height
72
+ @--line-height-base: 1.5715;
73
+
74
+ // Border
75
+ @--border-color-base: #d9d9d9;
76
+ @--border-color-secondary: #e8e8e8;
77
+ @--border-width-base: 1px;
78
+ @--border-style-base: solid;
79
+ @--border-radius-base: 2px;
80
+ @--border-radius-sm: @--border-radius-base;
81
+
82
+ // Outline
83
+ @--outline-width: 2px;
84
+ @--outline-color: @--primary-color;
85
+ @--error-color-outline: fade(@--error-color, 20%);
86
+
87
+ // Vertical paddings
88
+ @--padding-lg: 12px;
89
+ @--padding-md: 10px;
90
+ @--padding-sm: 8px;
91
+
92
+ // Vertical margins
93
+ @--margin-lg: 12px;
94
+ @--margin-md: 10px;
95
+ @--margin-sm: 8px;
96
+
97
+ // Height rules
98
+ @--height-lg: 40px;
99
+ @--height-md: 32px;
100
+ @--height-sm: 24px;
101
+
102
+ // LINK
103
+ @--link-color: @--primary-color;
104
+ @--link-hover-color: @--primary-5;
105
+ @--link-active-color: @--primary-7;
106
+
107
+ // Shadow
108
+ @--shadow-color: fade(@--black, 0.15);
109
+ @--shadow-1-up: 0 -2px 8px @--shadow-color;
110
+ @--shadow-1-down: 0 2px 8px @--shadow-color;
111
+ @--shadow-1-left: -2px 0 8px @--shadow-color;
112
+ @--shadow-1-right: 2px 0 8px @--shadow-color;
113
+ @--box-shadow-base: @--shadow-1-down;
114
+
115
+ // antd
116
+ @blue-base: @--primary-color;
117
+ @input-disabled-color: @--text-color-secondary-dark;
package/lib/upload-file/src/upload-file.d.ts CHANGED
@@ -21,6 +21,7 @@ type IProps = Omit<UploadProps, 'onPreview'> & {
21
21
  onPreview?: (file: UploadFile, cb: (file?: UploadFile) => void) => void;
22
22
  };
23
23
  export type UploadFileProps = IProps;
24
+ export declare const downloadFile: (url: string, { fileName, headers, params }: any) => Promise<void>;
24
25
  declare class QmUploadFile extends Component<IProps> {
25
26
  static contextType: React.Context<import("../../config-provider/context").IConfig>;
26
27
  static defaultProps: {
@@ -35,7 +36,6 @@ declare class QmUploadFile extends Component<IProps> {
35
36
  };
36
37
  get $size(): any;
37
38
  beforeUpload: (file: any, fileList: any) => Promise<any>;
38
- downloadFile(url: string, fileName?: string): Promise<void>;
39
39
  doDownload: (file: any) => Promise<void>;
40
40
  render(): React.JSX.Element;
41
41
  }
package/lib/upload-img/src/upload-img.d.ts CHANGED
@@ -34,10 +34,15 @@ declare class QmUploadImg extends Component<IProps, IState> {
34
34
  openCropper: boolean;
35
35
  };
36
36
  state: IState;
37
+ private isFocused;
37
38
  get $size(): any;
38
39
  get showUploadButton(): boolean;
40
+ componentDidMount(): void;
41
+ componentDidUpdate(prevProps: IProps): void;
42
+ componentWillUnmount(): void;
39
43
  beforeUpload: (file: any, fileList: any) => Promise<any>;
40
44
  handlePreview: (file: any) => void;
45
+ handlePaste: (ev: any) => Promise<void>;
41
46
  render(): React.JSX.Element;
42
47
  }
43
48
  export default QmUploadImg;
package/lib/upload-img/style/index.less CHANGED
@@ -10,9 +10,58 @@
10
10
  @prefix-cropper-preview: ~'@{qm-prefix}-cropper-preview';
11
11
 
12
12
  .@{prefix-upload-img} {
13
- .ant-upload-list-item-actions {
14
- .ant-btn {
15
- margin-left: 15px;
13
+ .ant-upload-select {
14
+ & > span {
15
+ flex-direction: column;
16
+ .ant-upload-drag-icon {
17
+ font-size: 24px;
18
+ line-height: 0;
19
+ color: @--primary-5;
20
+ }
21
+ .ant-upload-text {
22
+ font-size: @--font-size-base - 1px;
23
+ }
24
+ .ant-upload-button {
25
+ display: inline-block;
26
+ text-align: center;
27
+ text-transform: none;
28
+ text-decoration: none;
29
+ background: transparent;
30
+ border: 0;
31
+ outline: 0;
32
+ font-size: @--font-size-base - 1px;
33
+ transition: all 0.3s ease;
34
+ cursor: inherit;
35
+ &:focus {
36
+ box-shadow: 0 0 2px 0 @--primary-5;
37
+ background-color: @--primary-1;
38
+ }
39
+ &.disabled {
40
+ pointer-events: none;
41
+ }
42
+ }
43
+ }
44
+ }
45
+ .upload-item {
46
+ height: 100%;
47
+ position: relative;
48
+ &:hover {
49
+ .icon {
50
+ display: block;
51
+ }
52
+ }
53
+ .icon {
54
+ position: absolute;
55
+ top: 2px;
56
+ right: 2px;
57
+ padding: 1px;
58
+ border-radius: @--border-radius-base;
59
+ font-size: @--font-size-sm;
60
+ color: #fff;
61
+ background-color: rgba(0, 0, 0, 0.4);
62
+ z-index: 2;
63
+ cursor: pointer;
64
+ display: none;
16
65
  }
17
66
  }
18
67
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jiaozhiye/qm-design-react",
3
- "version": "1.9.6",
3
+ "version": "1.9.7",
4
4
  "description": "A Component Library for React",
5
5
  "keywords": [
6
6
  "React",
@@ -54,7 +54,6 @@
54
54
  "@rc-component/trigger": "^1.17.0",
55
55
  "add-dom-event-listener": "^1.1.0",
56
56
  "antd": "4.24.16",
57
- "axios": "^0.27.2",
58
57
  "big.js": "^6.2.1",
59
58
  "china-area-data": "^5.0.1",
60
59
  "classnames": "^2.3.2",
@@ -98,6 +97,7 @@
98
97
  "@typescript-eslint/eslint-plugin": "^5.30.0",
99
98
  "@typescript-eslint/parser": "^5.30.0",
100
99
  "autoprefixer": "^10.4.14",
100
+ "axios": "^0.27.2",
101
101
  "babel-loader": "^9.1.2",
102
102
  "core-js": "^3.32.0",
103
103
  "cp-cli": "^2.0.0",