assui 2.0.81 → 2.0.82

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/es/index.d.ts CHANGED
@@ -22,7 +22,7 @@ export type { StepNumberInputProps } from './step-number-input';
22
22
  export { default as StepNumberInput } from './step-number-input';
23
23
  export type { RcEchartPropsType } from './rc-echart';
24
24
  export { default as RcEcharts } from './rc-echart';
25
- export type { RcQRcodeProps } from './rc-qrcode';
25
+ export type { RcQrcodeProps } from './rc-qrcode';
26
26
  export { default as RcQRcode } from './rc-qrcode';
27
27
  export { default as RcTransitionGroup } from './rc-transition-group';
28
28
  export type { SingleImgUploadProps } from './single-img-upload';
@@ -59,7 +59,7 @@
59
59
  }
60
60
  .label-input-text {
61
61
  position: absolute;
62
- top: 18px;
62
+ top: 16px;
63
63
  left: 16px;
64
64
  z-index: 2;
65
65
  height: 20px;
@@ -81,7 +81,7 @@
81
81
 
82
82
  &-text {
83
83
  position: absolute;
84
- top: 18px;
84
+ top: 16px;
85
85
  left: 16px;
86
86
  z-index: 2;
87
87
  height: 20px;
@@ -1,2 +1,12 @@
1
- declare const LabelSelect: () => JSX.Element;
1
+ import React from 'react';
2
+ import type { SelectProps } from 'antd/es/select';
3
+ declare const Option: import("rc-select/lib/Option").OptionFC;
4
+ export { Option };
5
+ export interface LabelSelectProps extends SelectProps<string> {
6
+ label: React.ReactNode;
7
+ }
8
+ declare const LabelSelect: {
9
+ (props: LabelSelectProps): JSX.Element;
10
+ Option: import("rc-select/lib/Option").OptionFC;
11
+ };
2
12
  export default LabelSelect;
@@ -1,27 +1,107 @@
1
+ var __assign = this && this.__assign || function () {
2
+ __assign = Object.assign || function (t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+
6
+ for (var p in s) {
7
+ if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
8
+ }
9
+ }
10
+
11
+ return t;
12
+ };
13
+
14
+ return __assign.apply(this, arguments);
15
+ };
16
+
17
+ var __read = this && this.__read || function (o, n) {
18
+ var m = typeof Symbol === "function" && o[Symbol.iterator];
19
+ if (!m) return o;
20
+ var i = m.call(o),
21
+ r,
22
+ ar = [],
23
+ e;
24
+
25
+ try {
26
+ while ((n === void 0 || n-- > 0) && !(r = i.next()).done) {
27
+ ar.push(r.value);
28
+ }
29
+ } catch (error) {
30
+ e = {
31
+ error: error
32
+ };
33
+ } finally {
34
+ try {
35
+ if (r && !r.done && (m = i["return"])) m.call(i);
36
+ } finally {
37
+ if (e) throw e.error;
38
+ }
39
+ }
40
+
41
+ return ar;
42
+ };
43
+
1
44
  import React from 'react';
45
+ import { useControllableValue } from 'ahooks';
2
46
  import Select from 'antd/es/select';
47
+ import classNames from 'classnames';
48
+ import ArrowDropDownFilled from 'a-icons/lib/ArrowDropDownFilled';
49
+ import { omit } from 'lodash';
3
50
  var Option = Select.Option;
51
+ export { Option };
4
52
 
5
- var LabelSelect = function LabelSelect() {
6
- function handleChange(value) {
7
- console.log("selected " + value);
8
- }
53
+ var LabelSelect = function LabelSelect(props) {
54
+ var className = props.className,
55
+ label = props.label;
56
+ var selectRef = React.useRef(null);
57
+
58
+ var _a = __read(useControllableValue(props, {
59
+ valuePropName: 'open',
60
+ trigger: 'setOpen'
61
+ }), 2),
62
+ open = _a[0],
63
+ setOpen = _a[1];
64
+
65
+ var _b = __read(useControllableValue(props), 2),
66
+ value = _b[0],
67
+ setValue = _b[1];
68
+
69
+ var handleChange = function handleChange(nextValue) {
70
+ setValue(nextValue);
71
+ };
72
+
73
+ var handleLabelClick = function handleLabelClick() {
74
+ var _a;
75
+
76
+ if (!open) {
77
+ setOpen(!open);
78
+ }
79
+
80
+ (_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.focus();
81
+ };
82
+
83
+ var onDropdownVisibleChange = function onDropdownVisibleChange(nextOpen) {
84
+ setOpen(nextOpen);
85
+ };
9
86
 
10
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
11
- style: {
12
- width: 120
13
- },
14
- onChange: handleChange
15
- }, /*#__PURE__*/React.createElement(Option, {
16
- value: "jack"
17
- }, "Jack"), /*#__PURE__*/React.createElement(Option, {
18
- value: "lucy"
19
- }, "Lucy"), /*#__PURE__*/React.createElement(Option, {
20
- value: "disabled",
21
- disabled: true
22
- }, "Disabled"), /*#__PURE__*/React.createElement(Option, {
23
- value: "Yiminghe"
24
- }, "yiminghe")));
87
+ return /*#__PURE__*/React.createElement("div", {
88
+ className: classNames({
89
+ 'label-select': true,
90
+ 'label-select-label-scale': open || value
91
+ }, className)
92
+ }, /*#__PURE__*/React.createElement(Select, __assign({}, omit(props, ['open', 'onChange', 'className', 'label']), {
93
+ open: open,
94
+ ref: selectRef,
95
+ size: "large",
96
+ className: "label-select-selector",
97
+ onChange: handleChange,
98
+ onDropdownVisibleChange: onDropdownVisibleChange,
99
+ suffixIcon: /*#__PURE__*/React.createElement(ArrowDropDownFilled, null)
100
+ })), /*#__PURE__*/React.createElement("label", {
101
+ className: "label-select-text",
102
+ onClick: handleLabelClick
103
+ }, label));
25
104
  };
26
105
 
27
- export default LabelSelect;
106
+ export default LabelSelect;
107
+ LabelSelect.Option = Option;
@@ -0,0 +1,55 @@
1
+ /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
2
+ /* stylelint-disable no-duplicate-selectors */
3
+ /* stylelint-disable */
4
+ /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
5
+ .label-select {
6
+ position: relative;
7
+ width: 100%;
8
+ height: 100%;
9
+ }
10
+ .label-select .ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector {
11
+ height: 52px;
12
+ border: 1px solid #e5e5e5;
13
+ border-radius: 12px;
14
+ outline: none;
15
+ }
16
+ .label-select .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
17
+ border-color: #ff6b00;
18
+ box-shadow: none;
19
+ }
20
+ .label-select .ant-select-single.ant-select-show-arrow .ant-select-selection-item {
21
+ padding-top: 14px;
22
+ padding-left: 4px;
23
+ }
24
+ .label-select .ant-select-selection-search {
25
+ padding-top: 14px;
26
+ padding-left: 2px;
27
+ }
28
+ .label-select .ant-select-arrow {
29
+ top: 44%;
30
+ width: 22px;
31
+ height: 22px;
32
+ color: #7d7d7d;
33
+ }
34
+ .label-select .ant-select-arrow .spotecicon {
35
+ width: 22px;
36
+ height: 22px;
37
+ }
38
+ .label-select-text {
39
+ position: absolute;
40
+ top: 18px;
41
+ left: 16px;
42
+ z-index: 2;
43
+ height: 20px;
44
+ color: #9aa5b5;
45
+ font-size: 14px;
46
+ line-height: 20px;
47
+ transform-origin: top left;
48
+ cursor: pointer;
49
+ transition: all 0.2s ease-out;
50
+ }
51
+ .label-select-label-scale .label-select-text {
52
+ transform: translateY(-10px) scale(0.86);
53
+ cursor: text;
54
+ pointer-events: none;
55
+ }
@@ -1 +1,2 @@
1
1
  import 'antd/es/select/style';
2
+ import './index.less';
@@ -1 +1,2 @@
1
- import 'antd/es/select/style';
1
+ import 'antd/es/select/style';
2
+ import './index.less';
@@ -0,0 +1,69 @@
1
+ @import '~antd/es/style/themes/index';
2
+
3
+ @color_9aa5b5: #9aa5b5;
4
+ @font-size-base: 14px;
5
+
6
+ .label-select {
7
+ position: relative;
8
+ width: 100%;
9
+ height: 100%;
10
+
11
+ .ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector {
12
+ height: 52px;
13
+ border: 1px solid #e5e5e5;
14
+ border-radius: 12px;
15
+ outline: none;
16
+ }
17
+
18
+ .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input)
19
+ .ant-select-selector {
20
+ border-color: #ff6b00;
21
+ box-shadow: none;
22
+ }
23
+
24
+ .ant-select-single.ant-select-show-arrow .ant-select-selection-item {
25
+ padding-top: 14px;
26
+ padding-left: 4px;
27
+ }
28
+
29
+ .ant-select-selection-search {
30
+ padding-top: 14px;
31
+ padding-left: 2px;
32
+ }
33
+
34
+ .ant-select-arrow {
35
+ top: 44%;
36
+ // position: relative;
37
+ // top: -2px;
38
+ width: 22px;
39
+ height: 22px;
40
+ color: #7d7d7d;
41
+
42
+ .spotecicon {
43
+ width: 22px;
44
+ height: 22px;
45
+ }
46
+ }
47
+
48
+ &-text {
49
+ position: absolute;
50
+ top: 18px;
51
+ left: 16px;
52
+ z-index: 2;
53
+ height: 20px;
54
+ color: @color_9aa5b5;
55
+ font-size: @font-size-base;
56
+ line-height: 20px;
57
+ transform-origin: top left;
58
+ cursor: pointer;
59
+ transition: all 0.2s ease-out;
60
+ }
61
+
62
+ &-label-scale {
63
+ .label-select-text {
64
+ transform: translateY(-10px) scale(0.86);
65
+ cursor: text;
66
+ pointer-events: none;
67
+ }
68
+ }
69
+ }
@@ -1,21 +1,21 @@
1
1
  import type { QRCodeRenderersOptions, QRCodeSegment } from 'qrcode';
2
2
  import QRCode from 'qrcode';
3
3
  import useQrcode from './useQrcode';
4
- export interface RcQRcodeProps {
4
+ export interface RcQrcodeProps {
5
5
  /** 生成二维码的值 */
6
- value: QRCodeSegment[];
6
+ value: QRCodeSegment[] | string;
7
7
  /** qrcode的QRCodeRenderersOptions */
8
8
  options: QRCodeRenderersOptions;
9
9
  /** 获取HTMLCanvasElement */
10
10
  getCanvasInstance: (result: HTMLCanvasElement) => void;
11
11
  }
12
- declare const RcQRcode: {
13
- (props: RcQRcodeProps): JSX.Element;
12
+ declare const RcQrcode: {
13
+ (props: RcQrcodeProps): JSX.Element;
14
14
  defaultProps: {
15
15
  value: string;
16
16
  options: {};
17
17
  };
18
- useQrcode: (value: string | QRCodeSegment[], options: QRCode.QRCodeToDataURLOptions) => string;
18
+ useQrcode: (value: string | QRCodeSegment[], options?: QRCode.QRCodeToDataURLOptions) => string;
19
19
  };
20
- export default RcQRcode;
20
+ export default RcQrcode;
21
21
  export { useQrcode };
@@ -19,7 +19,7 @@ import QRCode from 'qrcode';
19
19
  import useMount from 'ahooks/lib/useMount';
20
20
  import useQrcode from './useQrcode';
21
21
 
22
- var RcQRcode = function RcQRcode(props) {
22
+ var RcQrcode = function RcQrcode(props) {
23
23
  var value = props.value,
24
24
  options = props.options;
25
25
  var domElRef = React.useRef(null);
@@ -48,10 +48,10 @@ var RcQRcode = function RcQRcode(props) {
48
48
  });
49
49
  };
50
50
 
51
- RcQRcode.defaultProps = {
51
+ RcQrcode.defaultProps = {
52
52
  value: '',
53
53
  options: {}
54
54
  };
55
- RcQRcode.useQrcode = useQrcode;
56
- export default RcQRcode;
55
+ RcQrcode.useQrcode = useQrcode;
56
+ export default RcQrcode;
57
57
  export { useQrcode };
@@ -1,4 +1,4 @@
1
1
  import type { QRCodeToDataURLOptions, QRCodeSegment } from 'qrcode';
2
2
  declare type ValueTypes = string | QRCodeSegment[];
3
- export declare const useQRCode: (value: ValueTypes, options: QRCodeToDataURLOptions) => string;
3
+ export declare const useQRCode: (value: ValueTypes, options?: QRCodeToDataURLOptions) => string;
4
4
  export default useQRCode;
@@ -28,6 +28,10 @@ var __read = this && this.__read || function (o, n) {
28
28
  import QRCode from 'qrcode';
29
29
  import { useEffect, useState } from 'react';
30
30
  export var useQRCode = function useQRCode(value, options) {
31
+ if (options === void 0) {
32
+ options = {};
33
+ }
34
+
31
35
  var _a = __read(useState(''), 2),
32
36
  dataURL = _a[0],
33
37
  setDataURL = _a[1];
package/lib/index.d.ts CHANGED
@@ -22,7 +22,7 @@ export type { StepNumberInputProps } from './step-number-input';
22
22
  export { default as StepNumberInput } from './step-number-input';
23
23
  export type { RcEchartPropsType } from './rc-echart';
24
24
  export { default as RcEcharts } from './rc-echart';
25
- export type { RcQRcodeProps } from './rc-qrcode';
25
+ export type { RcQrcodeProps } from './rc-qrcode';
26
26
  export { default as RcQRcode } from './rc-qrcode';
27
27
  export { default as RcTransitionGroup } from './rc-transition-group';
28
28
  export type { SingleImgUploadProps } from './single-img-upload';
@@ -59,7 +59,7 @@
59
59
  }
60
60
  .label-input-text {
61
61
  position: absolute;
62
- top: 18px;
62
+ top: 16px;
63
63
  left: 16px;
64
64
  z-index: 2;
65
65
  height: 20px;
@@ -81,7 +81,7 @@
81
81
 
82
82
  &-text {
83
83
  position: absolute;
84
- top: 18px;
84
+ top: 16px;
85
85
  left: 16px;
86
86
  z-index: 2;
87
87
  height: 20px;
@@ -1,2 +1,12 @@
1
- declare const LabelSelect: () => JSX.Element;
1
+ import React from 'react';
2
+ import type { SelectProps } from 'antd/es/select';
3
+ declare const Option: import("rc-select/lib/Option").OptionFC;
4
+ export { Option };
5
+ export interface LabelSelectProps extends SelectProps<string> {
6
+ label: React.ReactNode;
7
+ }
8
+ declare const LabelSelect: {
9
+ (props: LabelSelectProps): JSX.Element;
10
+ Option: import("rc-select/lib/Option").OptionFC;
11
+ };
2
12
  export default LabelSelect;
@@ -1,5 +1,48 @@
1
1
  "use strict";
2
2
 
3
+ var __assign = this && this.__assign || function () {
4
+ __assign = Object.assign || function (t) {
5
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
6
+ s = arguments[i];
7
+
8
+ for (var p in s) {
9
+ if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
10
+ }
11
+ }
12
+
13
+ return t;
14
+ };
15
+
16
+ return __assign.apply(this, arguments);
17
+ };
18
+
19
+ var __read = this && this.__read || function (o, n) {
20
+ var m = typeof Symbol === "function" && o[Symbol.iterator];
21
+ if (!m) return o;
22
+ var i = m.call(o),
23
+ r,
24
+ ar = [],
25
+ e;
26
+
27
+ try {
28
+ while ((n === void 0 || n-- > 0) && !(r = i.next()).done) {
29
+ ar.push(r.value);
30
+ }
31
+ } catch (error) {
32
+ e = {
33
+ error: error
34
+ };
35
+ } finally {
36
+ try {
37
+ if (r && !r.done && (m = i["return"])) m.call(i);
38
+ } finally {
39
+ if (e) throw e.error;
40
+ }
41
+ }
42
+
43
+ return ar;
44
+ };
45
+
3
46
  var __importDefault = this && this.__importDefault || function (mod) {
4
47
  return mod && mod.__esModule ? mod : {
5
48
  "default": mod
@@ -9,33 +52,75 @@ var __importDefault = this && this.__importDefault || function (mod) {
9
52
  Object.defineProperty(exports, "__esModule", {
10
53
  value: true
11
54
  });
55
+ exports.Option = void 0;
12
56
 
13
57
  var react_1 = __importDefault(require("react"));
14
58
 
59
+ var ahooks_1 = require("ahooks");
60
+
15
61
  var select_1 = __importDefault(require("antd/es/select"));
16
62
 
63
+ var classnames_1 = __importDefault(require("classnames"));
64
+
65
+ var ArrowDropDownFilled_1 = __importDefault(require("a-icons/lib/ArrowDropDownFilled"));
66
+
67
+ var lodash_1 = require("lodash");
68
+
17
69
  var Option = select_1["default"].Option;
70
+ exports.Option = Option;
18
71
 
19
- var LabelSelect = function LabelSelect() {
20
- function handleChange(value) {
21
- console.log("selected " + value);
22
- }
72
+ var LabelSelect = function LabelSelect(props) {
73
+ var className = props.className,
74
+ label = props.label;
75
+ var selectRef = react_1["default"].useRef(null);
76
+
77
+ var _a = __read(ahooks_1.useControllableValue(props, {
78
+ valuePropName: 'open',
79
+ trigger: 'setOpen'
80
+ }), 2),
81
+ open = _a[0],
82
+ setOpen = _a[1];
83
+
84
+ var _b = __read(ahooks_1.useControllableValue(props), 2),
85
+ value = _b[0],
86
+ setValue = _b[1];
87
+
88
+ var handleChange = function handleChange(nextValue) {
89
+ setValue(nextValue);
90
+ };
91
+
92
+ var handleLabelClick = function handleLabelClick() {
93
+ var _a;
94
+
95
+ if (!open) {
96
+ setOpen(!open);
97
+ }
98
+
99
+ (_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.focus();
100
+ };
101
+
102
+ var onDropdownVisibleChange = function onDropdownVisibleChange(nextOpen) {
103
+ setOpen(nextOpen);
104
+ };
23
105
 
24
- return react_1["default"].createElement("div", null, react_1["default"].createElement(select_1["default"], {
25
- style: {
26
- width: 120
27
- },
28
- onChange: handleChange
29
- }, react_1["default"].createElement(Option, {
30
- value: "jack"
31
- }, "Jack"), react_1["default"].createElement(Option, {
32
- value: "lucy"
33
- }, "Lucy"), react_1["default"].createElement(Option, {
34
- value: "disabled",
35
- disabled: true
36
- }, "Disabled"), react_1["default"].createElement(Option, {
37
- value: "Yiminghe"
38
- }, "yiminghe")));
106
+ return react_1["default"].createElement("div", {
107
+ className: classnames_1["default"]({
108
+ 'label-select': true,
109
+ 'label-select-label-scale': open || value
110
+ }, className)
111
+ }, react_1["default"].createElement(select_1["default"], __assign({}, lodash_1.omit(props, ['open', 'onChange', 'className', 'label']), {
112
+ open: open,
113
+ ref: selectRef,
114
+ size: "large",
115
+ className: "label-select-selector",
116
+ onChange: handleChange,
117
+ onDropdownVisibleChange: onDropdownVisibleChange,
118
+ suffixIcon: react_1["default"].createElement(ArrowDropDownFilled_1["default"], null)
119
+ })), react_1["default"].createElement("label", {
120
+ className: "label-select-text",
121
+ onClick: handleLabelClick
122
+ }, label));
39
123
  };
40
124
 
41
- exports["default"] = LabelSelect;
125
+ exports["default"] = LabelSelect;
126
+ LabelSelect.Option = Option;
@@ -0,0 +1,55 @@
1
+ /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
2
+ /* stylelint-disable no-duplicate-selectors */
3
+ /* stylelint-disable */
4
+ /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
5
+ .label-select {
6
+ position: relative;
7
+ width: 100%;
8
+ height: 100%;
9
+ }
10
+ .label-select .ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector {
11
+ height: 52px;
12
+ border: 1px solid #e5e5e5;
13
+ border-radius: 12px;
14
+ outline: none;
15
+ }
16
+ .label-select .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
17
+ border-color: #ff6b00;
18
+ box-shadow: none;
19
+ }
20
+ .label-select .ant-select-single.ant-select-show-arrow .ant-select-selection-item {
21
+ padding-top: 14px;
22
+ padding-left: 4px;
23
+ }
24
+ .label-select .ant-select-selection-search {
25
+ padding-top: 14px;
26
+ padding-left: 2px;
27
+ }
28
+ .label-select .ant-select-arrow {
29
+ top: 44%;
30
+ width: 22px;
31
+ height: 22px;
32
+ color: #7d7d7d;
33
+ }
34
+ .label-select .ant-select-arrow .spotecicon {
35
+ width: 22px;
36
+ height: 22px;
37
+ }
38
+ .label-select-text {
39
+ position: absolute;
40
+ top: 18px;
41
+ left: 16px;
42
+ z-index: 2;
43
+ height: 20px;
44
+ color: #9aa5b5;
45
+ font-size: 14px;
46
+ line-height: 20px;
47
+ transform-origin: top left;
48
+ cursor: pointer;
49
+ transition: all 0.2s ease-out;
50
+ }
51
+ .label-select-label-scale .label-select-text {
52
+ transform: translateY(-10px) scale(0.86);
53
+ cursor: text;
54
+ pointer-events: none;
55
+ }
@@ -1 +1,2 @@
1
1
  import 'antd/es/select/style';
2
+ import './index.less';
@@ -4,4 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
 
7
- require("antd/es/select/style");
7
+ require("antd/es/select/style");
8
+
9
+ require("./index.less");
@@ -0,0 +1,69 @@
1
+ @import '~antd/es/style/themes/index';
2
+
3
+ @color_9aa5b5: #9aa5b5;
4
+ @font-size-base: 14px;
5
+
6
+ .label-select {
7
+ position: relative;
8
+ width: 100%;
9
+ height: 100%;
10
+
11
+ .ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector {
12
+ height: 52px;
13
+ border: 1px solid #e5e5e5;
14
+ border-radius: 12px;
15
+ outline: none;
16
+ }
17
+
18
+ .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input)
19
+ .ant-select-selector {
20
+ border-color: #ff6b00;
21
+ box-shadow: none;
22
+ }
23
+
24
+ .ant-select-single.ant-select-show-arrow .ant-select-selection-item {
25
+ padding-top: 14px;
26
+ padding-left: 4px;
27
+ }
28
+
29
+ .ant-select-selection-search {
30
+ padding-top: 14px;
31
+ padding-left: 2px;
32
+ }
33
+
34
+ .ant-select-arrow {
35
+ top: 44%;
36
+ // position: relative;
37
+ // top: -2px;
38
+ width: 22px;
39
+ height: 22px;
40
+ color: #7d7d7d;
41
+
42
+ .spotecicon {
43
+ width: 22px;
44
+ height: 22px;
45
+ }
46
+ }
47
+
48
+ &-text {
49
+ position: absolute;
50
+ top: 18px;
51
+ left: 16px;
52
+ z-index: 2;
53
+ height: 20px;
54
+ color: @color_9aa5b5;
55
+ font-size: @font-size-base;
56
+ line-height: 20px;
57
+ transform-origin: top left;
58
+ cursor: pointer;
59
+ transition: all 0.2s ease-out;
60
+ }
61
+
62
+ &-label-scale {
63
+ .label-select-text {
64
+ transform: translateY(-10px) scale(0.86);
65
+ cursor: text;
66
+ pointer-events: none;
67
+ }
68
+ }
69
+ }
@@ -1,21 +1,21 @@
1
1
  import type { QRCodeRenderersOptions, QRCodeSegment } from 'qrcode';
2
2
  import QRCode from 'qrcode';
3
3
  import useQrcode from './useQrcode';
4
- export interface RcQRcodeProps {
4
+ export interface RcQrcodeProps {
5
5
  /** 生成二维码的值 */
6
- value: QRCodeSegment[];
6
+ value: QRCodeSegment[] | string;
7
7
  /** qrcode的QRCodeRenderersOptions */
8
8
  options: QRCodeRenderersOptions;
9
9
  /** 获取HTMLCanvasElement */
10
10
  getCanvasInstance: (result: HTMLCanvasElement) => void;
11
11
  }
12
- declare const RcQRcode: {
13
- (props: RcQRcodeProps): JSX.Element;
12
+ declare const RcQrcode: {
13
+ (props: RcQrcodeProps): JSX.Element;
14
14
  defaultProps: {
15
15
  value: string;
16
16
  options: {};
17
17
  };
18
- useQrcode: (value: string | QRCodeSegment[], options: QRCode.QRCodeToDataURLOptions) => string;
18
+ useQrcode: (value: string | QRCodeSegment[], options?: QRCode.QRCodeToDataURLOptions) => string;
19
19
  };
20
- export default RcQRcode;
20
+ export default RcQrcode;
21
21
  export { useQrcode };
@@ -71,7 +71,7 @@ var useQrcode_1 = __importDefault(require("./useQrcode"));
71
71
 
72
72
  exports.useQrcode = useQrcode_1["default"];
73
73
 
74
- var RcQRcode = function RcQRcode(props) {
74
+ var RcQrcode = function RcQrcode(props) {
75
75
  var value = props.value,
76
76
  options = props.options;
77
77
  var domElRef = React.useRef(null);
@@ -100,9 +100,9 @@ var RcQRcode = function RcQRcode(props) {
100
100
  });
101
101
  };
102
102
 
103
- RcQRcode.defaultProps = {
103
+ RcQrcode.defaultProps = {
104
104
  value: '',
105
105
  options: {}
106
106
  };
107
- RcQRcode.useQrcode = useQrcode_1["default"];
108
- exports["default"] = RcQRcode;
107
+ RcQrcode.useQrcode = useQrcode_1["default"];
108
+ exports["default"] = RcQrcode;
@@ -1,4 +1,4 @@
1
1
  import type { QRCodeToDataURLOptions, QRCodeSegment } from 'qrcode';
2
2
  declare type ValueTypes = string | QRCodeSegment[];
3
- export declare const useQRCode: (value: ValueTypes, options: QRCodeToDataURLOptions) => string;
3
+ export declare const useQRCode: (value: ValueTypes, options?: QRCodeToDataURLOptions) => string;
4
4
  export default useQRCode;
@@ -43,6 +43,10 @@ var qrcode_1 = __importDefault(require("qrcode"));
43
43
  var react_1 = require("react");
44
44
 
45
45
  exports.useQRCode = function (value, options) {
46
+ if (options === void 0) {
47
+ options = {};
48
+ }
49
+
46
50
  var _a = __read(react_1.useState(''), 2),
47
51
  dataURL = _a[0],
48
52
  setDataURL = _a[1];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "assui",
3
- "version": "2.0.81",
3
+ "version": "2.0.82",
4
4
  "description": "react ui library",
5
5
  "author": "jason <usochen@gmail.com>",
6
6
  "main": "./lib/index.js",
@@ -69,5 +69,5 @@
69
69
  "node": ">=10.0.0"
70
70
  },
71
71
  "license": "MIT",
72
- "gitHead": "d304fe5cca5c83ffc8065c08b0fb7e332da17349"
72
+ "gitHead": "29449b7d1c74e1e8b9e32f38ac5a57aba3119418"
73
73
  }