@arco-design/mobile-react 2.22.2 → 2.23.0

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 (98) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/README.en-US.md +2 -2
  3. package/README.md +2 -2
  4. package/cjs/carousel/index.d.ts +6 -0
  5. package/cjs/carousel/index.js +6 -4
  6. package/cjs/image-picker/index.js +18 -12
  7. package/cjs/image-picker/type.d.ts +10 -0
  8. package/cjs/index.d.ts +1 -0
  9. package/cjs/index.js +5 -1
  10. package/cjs/input/style/css/index.css +1 -0
  11. package/cjs/input/style/index.less +1 -0
  12. package/cjs/stepper/demo/style/css/mobile.css +4 -0
  13. package/cjs/stepper/demo/style/mobile.less +10 -0
  14. package/cjs/stepper/hooks/useButtonClick.d.ts +11 -0
  15. package/cjs/stepper/hooks/useButtonClick.js +74 -0
  16. package/cjs/stepper/hooks/useInputEvent.d.ts +9 -0
  17. package/cjs/stepper/hooks/useInputEvent.js +59 -0
  18. package/cjs/stepper/hooks/useValue.d.ts +6 -0
  19. package/cjs/stepper/hooks/useValue.js +44 -0
  20. package/cjs/stepper/index.d.ts +13 -0
  21. package/cjs/stepper/index.js +184 -0
  22. package/cjs/stepper/style/css/index.css +76 -0
  23. package/cjs/stepper/style/css/index.d.ts +2 -0
  24. package/cjs/stepper/style/css/index.js +5 -0
  25. package/cjs/stepper/style/index.d.ts +2 -0
  26. package/cjs/stepper/style/index.js +5 -0
  27. package/cjs/stepper/style/index.less +80 -0
  28. package/cjs/stepper/type.d.ts +159 -0
  29. package/cjs/stepper/type.js +3 -0
  30. package/cjs/style.d.ts +1 -0
  31. package/cjs/style.js +2 -0
  32. package/dist/index.js +439 -98
  33. package/dist/index.min.js +4 -4
  34. package/dist/style.css +64 -0
  35. package/dist/style.min.css +1 -1
  36. package/esm/carousel/index.d.ts +6 -0
  37. package/esm/carousel/index.js +6 -4
  38. package/esm/image-picker/index.js +18 -12
  39. package/esm/image-picker/type.d.ts +10 -0
  40. package/esm/index.d.ts +1 -0
  41. package/esm/index.js +1 -0
  42. package/esm/input/style/css/index.css +1 -0
  43. package/esm/input/style/index.less +1 -0
  44. package/esm/stepper/demo/style/css/mobile.css +4 -0
  45. package/esm/stepper/demo/style/mobile.less +10 -0
  46. package/esm/stepper/hooks/useButtonClick.d.ts +11 -0
  47. package/esm/stepper/hooks/useButtonClick.js +69 -0
  48. package/esm/stepper/hooks/useInputEvent.d.ts +9 -0
  49. package/esm/stepper/hooks/useInputEvent.js +53 -0
  50. package/esm/stepper/hooks/useValue.d.ts +6 -0
  51. package/esm/stepper/hooks/useValue.js +38 -0
  52. package/esm/stepper/index.d.ts +13 -0
  53. package/esm/stepper/index.js +157 -0
  54. package/esm/stepper/style/css/index.css +76 -0
  55. package/esm/stepper/style/css/index.d.ts +2 -0
  56. package/esm/stepper/style/css/index.js +2 -0
  57. package/esm/stepper/style/index.d.ts +2 -0
  58. package/esm/stepper/style/index.js +2 -0
  59. package/esm/stepper/style/index.less +80 -0
  60. package/esm/stepper/type.d.ts +159 -0
  61. package/esm/stepper/type.js +1 -0
  62. package/esm/style.d.ts +1 -0
  63. package/esm/style.js +1 -0
  64. package/package.json +3 -3
  65. package/tokens/app/arcodesign/default/css-variables.less +15 -0
  66. package/tokens/app/arcodesign/default/index.d.ts +15 -0
  67. package/tokens/app/arcodesign/default/index.js +16 -1
  68. package/tokens/app/arcodesign/default/index.json +180 -0
  69. package/tokens/app/arcodesign/default/index.less +15 -0
  70. package/tools/flexible.js +82 -63
  71. package/umd/carousel/index.d.ts +6 -0
  72. package/umd/carousel/index.js +6 -4
  73. package/umd/image-picker/index.js +18 -12
  74. package/umd/image-picker/type.d.ts +10 -0
  75. package/umd/index.d.ts +1 -0
  76. package/umd/index.js +7 -5
  77. package/umd/input/style/css/index.css +1 -0
  78. package/umd/input/style/index.less +1 -0
  79. package/umd/stepper/demo/style/css/mobile.css +4 -0
  80. package/umd/stepper/demo/style/mobile.less +10 -0
  81. package/umd/stepper/hooks/useButtonClick.d.ts +11 -0
  82. package/umd/stepper/hooks/useButtonClick.js +86 -0
  83. package/umd/stepper/hooks/useInputEvent.d.ts +9 -0
  84. package/umd/stepper/hooks/useInputEvent.js +71 -0
  85. package/umd/stepper/hooks/useValue.d.ts +6 -0
  86. package/umd/stepper/hooks/useValue.js +56 -0
  87. package/umd/stepper/index.d.ts +13 -0
  88. package/umd/stepper/index.js +185 -0
  89. package/umd/stepper/style/css/index.css +76 -0
  90. package/umd/stepper/style/css/index.d.ts +2 -0
  91. package/umd/stepper/style/css/index.js +15 -0
  92. package/umd/stepper/style/index.d.ts +2 -0
  93. package/umd/stepper/style/index.js +15 -0
  94. package/umd/stepper/style/index.less +80 -0
  95. package/umd/stepper/type.d.ts +159 -0
  96. package/umd/stepper/type.js +17 -0
  97. package/umd/style.d.ts +1 -0
  98. package/umd/style.js +4 -4
@@ -0,0 +1,185 @@
1
+ (function (global, factory) {
2
+ if (typeof define === "function" && define.amd) {
3
+ define(["exports", "@arco-design/mobile-utils", "react", "../context-provider", "./hooks/useButtonClick", "./hooks/useInputEvent", "../icon", "./hooks/useValue", "./type"], factory);
4
+ } else if (typeof exports !== "undefined") {
5
+ factory(exports, require("@arco-design/mobile-utils"), require("react"), require("../context-provider"), require("./hooks/useButtonClick"), require("./hooks/useInputEvent"), require("../icon"), require("./hooks/useValue"), require("./type"));
6
+ } else {
7
+ var mod = {
8
+ exports: {}
9
+ };
10
+ factory(mod.exports, global.mobileUtils, global.react, global.contextProvider, global.useButtonClick, global.useInputEvent, global.icon, global.useValue, global.type);
11
+ global.index = mod.exports;
12
+ }
13
+ })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _mobileUtils, _react, _contextProvider, _useButtonClick2, _useInputEvent2, _icon, _useValue2, _type) {
14
+ "use strict";
15
+
16
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
17
+
18
+ _exports.__esModule = true;
19
+ var _exportNames = {};
20
+ _exports.default = void 0;
21
+ _react = _interopRequireWildcard(_react);
22
+ _useButtonClick2 = _interopRequireDefault(_useButtonClick2);
23
+ _useInputEvent2 = _interopRequireDefault(_useInputEvent2);
24
+ _useValue2 = _interopRequireDefault(_useValue2);
25
+ Object.keys(_type).forEach(function (key) {
26
+ if (key === "default" || key === "__esModule") return;
27
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
28
+ if (key in _exports && _exports[key] === _type[key]) return;
29
+ _exports[key] = _type[key];
30
+ });
31
+
32
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
33
+
34
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
35
+
36
+ /**
37
+ * 步进器组件,支持受控模式
38
+ * @en Stepper component, provide controlled mode
39
+ * @type 数据录入
40
+ * @type_en Data Entry
41
+ * @name 步进器
42
+ * @name_en Stepper
43
+ */
44
+ var Stepper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
45
+ var _props$className = props.className,
46
+ className = _props$className === void 0 ? '' : _props$className,
47
+ style = props.style,
48
+ inputStyle = props.inputStyle,
49
+ _props$inputClass = props.inputClass,
50
+ inputClass = _props$inputClass === void 0 ? '' : _props$inputClass,
51
+ value = props.value,
52
+ _props$defaultValue = props.defaultValue,
53
+ defaultValue = _props$defaultValue === void 0 ? 1 : _props$defaultValue,
54
+ _props$allowEmpty = props.allowEmpty,
55
+ allowEmpty = _props$allowEmpty === void 0 ? false : _props$allowEmpty,
56
+ _props$digits = props.digits,
57
+ digits = _props$digits === void 0 ? 0 : _props$digits,
58
+ _props$disabled = props.disabled,
59
+ disabled = _props$disabled === void 0 ? false : _props$disabled,
60
+ _props$inputReadonly = props.inputReadonly,
61
+ inputReadonly = _props$inputReadonly === void 0 ? false : _props$inputReadonly,
62
+ _props$max = props.max,
63
+ max = _props$max === void 0 ? Infinity : _props$max,
64
+ _props$min = props.min,
65
+ min = _props$min === void 0 ? 1 : _props$min,
66
+ _props$equalLimitDisa = props.equalLimitDisabled,
67
+ equalLimitDisabled = _props$equalLimitDisa === void 0 ? false : _props$equalLimitDisa,
68
+ _props$step = props.step,
69
+ step = _props$step === void 0 ? 1 : _props$step,
70
+ _props$theme = props.theme,
71
+ theme = _props$theme === void 0 ? 'default' : _props$theme,
72
+ formatter = props.formatter,
73
+ addButton = props.addButton,
74
+ minusButton = props.minusButton,
75
+ renderContent = props.renderContent,
76
+ onBlur = props.onBlur,
77
+ onChange = props.onChange,
78
+ onFocus = props.onFocus,
79
+ onAddButtonClick = props.onAddButtonClick,
80
+ onMinusButtonClick = props.onMinusButtonClick,
81
+ onClick = props.onClick,
82
+ onInput = props.onInput; // 值的相关逻辑
83
+ // @en The logic is that handle value
84
+
85
+ var _useValue = (0, _useValue2.default)({
86
+ defaultValue: defaultValue,
87
+ formatter: formatter,
88
+ min: min,
89
+ max: max,
90
+ value: value,
91
+ digits: digits
92
+ }),
93
+ updateValue = _useValue.updateValue,
94
+ actualInputValue = _useValue.actualInputValue,
95
+ showValue = _useValue.showValue; // 按钮点击的相关逻辑
96
+ // @en The logic is that handle button click
97
+
98
+
99
+ var _useButtonClick = (0, _useButtonClick2.default)({
100
+ actualInputValue: actualInputValue,
101
+ min: min,
102
+ max: max,
103
+ step: step,
104
+ disabled: disabled,
105
+ digits: digits,
106
+ equalLimitDisabled: equalLimitDisabled,
107
+ updateValue: updateValue,
108
+ onAddButtonClick: onAddButtonClick,
109
+ onMinusButtonClick: onMinusButtonClick
110
+ }),
111
+ minusButtonDisable = _useButtonClick.minusButtonDisable,
112
+ addButtonDisable = _useButtonClick.addButtonDisable,
113
+ handleAddButtonClick = _useButtonClick.handleAddButtonClick,
114
+ handleMinusButtonClick = _useButtonClick.handleMinusButtonClick; // 输入框操作的相关逻辑
115
+ // @en The logic is that handle input operation
116
+
117
+
118
+ var _useInputEvent = (0, _useInputEvent2.default)({
119
+ defaultValue: defaultValue,
120
+ min: min,
121
+ max: max,
122
+ digits: digits,
123
+ actualInputValue: actualInputValue,
124
+ allowEmpty: allowEmpty,
125
+ updateValue: updateValue,
126
+ onBlur: onBlur,
127
+ onChange: onChange,
128
+ onInput: onInput
129
+ }),
130
+ handleInput = _useInputEvent.handleInput,
131
+ handleBlur = _useInputEvent.handleBlur;
132
+
133
+ var domRef = (0, _react.useRef)(null);
134
+ var inputRef = (0, _react.useRef)(null);
135
+ (0, _react.useImperativeHandle)(ref, function () {
136
+ return {
137
+ dom: domRef.current,
138
+ input: inputRef.current,
139
+ changeValue: function changeValue(newValue) {
140
+ var tempValue = newValue != null ? newValue : defaultValue;
141
+ tempValue = Math.min(max, Math.max(tempValue, min));
142
+ updateValue(tempValue);
143
+ }
144
+ };
145
+ });
146
+ return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
147
+ var prefixCls = _ref.prefixCls;
148
+ return /*#__PURE__*/_react.default.createElement("div", {
149
+ className: (0, _mobileUtils.cls)(prefixCls + "-stepper", prefixCls + "-" + theme, className),
150
+ style: style,
151
+ ref: domRef,
152
+ onClick: onClick
153
+ }, /*#__PURE__*/_react.default.createElement("div", {
154
+ onClick: handleMinusButtonClick
155
+ }, minusButton || /*#__PURE__*/_react.default.createElement("div", {
156
+ className: (0, _mobileUtils.cls)(prefixCls + "-stepper-minus-button")
157
+ }, /*#__PURE__*/_react.default.createElement(_icon.IconMinus, {
158
+ className: (0, _mobileUtils.cls)(prefixCls + "-stepper-minus-button-icon", {
159
+ disabled: minusButtonDisable
160
+ })
161
+ }))), renderContent ? renderContent(actualInputValue) : /*#__PURE__*/_react.default.createElement("input", {
162
+ style: inputStyle,
163
+ className: (0, _mobileUtils.cls)(prefixCls + "-stepper-input", inputClass),
164
+ onFocus: onFocus,
165
+ onInput: handleInput,
166
+ onBlur: handleBlur,
167
+ disabled: disabled,
168
+ value: showValue,
169
+ readOnly: inputReadonly,
170
+ ref: inputRef,
171
+ type: "number"
172
+ }), /*#__PURE__*/_react.default.createElement("div", {
173
+ onClick: handleAddButtonClick
174
+ }, addButton || /*#__PURE__*/_react.default.createElement("div", {
175
+ className: (0, _mobileUtils.cls)(prefixCls + "-stepper-add-button")
176
+ }, /*#__PURE__*/_react.default.createElement(_icon.IconAdd, {
177
+ className: (0, _mobileUtils.cls)(prefixCls + "-stepper-add-button-icon", {
178
+ disabled: addButtonDisable
179
+ })
180
+ }))));
181
+ });
182
+ });
183
+ var _default = Stepper;
184
+ _exports.default = _default;
185
+ });
@@ -0,0 +1,76 @@
1
+ .arco-stepper {
2
+ display: -webkit-box;
3
+ display: -webkit-flex;
4
+ display: flex;
5
+ font-size: 0.28rem ;
6
+ }
7
+ .arco-stepper.arco-square {
8
+ border: 1PX solid #f2f3f5 ;
9
+ border-radius: 0.04rem ;
10
+ }
11
+ .arco-stepper.arco-square .arco-stepper-add-button,
12
+ .arco-stepper.arco-square .arco-stepper-minus-button,
13
+ .arco-stepper.arco-square .arco-stepper-input {
14
+ background: #ffffff ;
15
+ }
16
+ .arco-stepper.arco-square .arco-stepper-input {
17
+ border-left: 1PX solid #f2f3f5 ;
18
+ border-right: 1PX solid #f2f3f5 ;
19
+ }
20
+ .arco-stepper.arco-round .arco-stepper-minus-button,
21
+ .arco-stepper.arco-round .arco-stepper-add-button {
22
+ border-radius: 50% ;
23
+ }
24
+ .arco-stepper.arco-round .arco-stepper-input {
25
+ background: transparent ;
26
+ }
27
+ .arco-stepper-minus-button {
28
+ display: -webkit-box;
29
+ display: -webkit-flex;
30
+ display: flex;
31
+ -webkit-box-align: center;
32
+ -webkit-align-items: center;
33
+ align-items: center;
34
+ -webkit-box-pack: center;
35
+ -webkit-justify-content: center;
36
+ justify-content: center;
37
+ font-size: 0.2rem ;
38
+ width: 0.56rem ;
39
+ height: 0.56rem ;
40
+ background: #f7f8fa ;
41
+ }
42
+ .arco-stepper-minus-button-icon {
43
+ color: #1d2129 ;
44
+ }
45
+ .arco-stepper-minus-button-icon.disabled {
46
+ color: #c9cdd4 ;
47
+ }
48
+ .arco-stepper-input {
49
+ text-align: center;
50
+ width: 0.8rem ;
51
+ height: 0.56rem ;
52
+ background: #f7f8fa ;
53
+ color: #1d2129 ;
54
+ margin: 0 1PX ;
55
+ }
56
+ .arco-stepper-add-button {
57
+ display: -webkit-box;
58
+ display: -webkit-flex;
59
+ display: flex;
60
+ -webkit-box-align: center;
61
+ -webkit-align-items: center;
62
+ align-items: center;
63
+ -webkit-box-pack: center;
64
+ -webkit-justify-content: center;
65
+ justify-content: center;
66
+ font-size: 0.2rem ;
67
+ width: 0.56rem ;
68
+ height: 0.56rem ;
69
+ background: #f7f8fa ;
70
+ }
71
+ .arco-stepper-add-button-icon {
72
+ color: #1d2129 ;
73
+ }
74
+ .arco-stepper-add-button-icon.disabled {
75
+ color: #c9cdd4 ;
76
+ }
@@ -0,0 +1,2 @@
1
+ import '../../../../style/css/public.css';
2
+ import './index.css';
@@ -0,0 +1,15 @@
1
+ (function (global, factory) {
2
+ if (typeof define === "function" && define.amd) {
3
+ define(["../../../../style/css/public.css", "./index.css"], factory);
4
+ } else if (typeof exports !== "undefined") {
5
+ factory(require("../../../../style/css/public.css"), require("./index.css"));
6
+ } else {
7
+ var mod = {
8
+ exports: {}
9
+ };
10
+ factory(global._public, global.index);
11
+ global.index = mod.exports;
12
+ }
13
+ })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_public, _index) {
14
+ "use strict";
15
+ });
@@ -0,0 +1,2 @@
1
+ import '../../../style/public.less';
2
+ import './index.less';
@@ -0,0 +1,15 @@
1
+ (function (global, factory) {
2
+ if (typeof define === "function" && define.amd) {
3
+ define(["../../../style/public.less", "./index.less"], factory);
4
+ } else if (typeof exports !== "undefined") {
5
+ factory(require("../../../style/public.less"), require("./index.less"));
6
+ } else {
7
+ var mod = {
8
+ exports: {}
9
+ };
10
+ factory(global._public, global.index);
11
+ global.index = mod.exports;
12
+ }
13
+ })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_public, _index) {
14
+ "use strict";
15
+ });
@@ -0,0 +1,80 @@
1
+ @import '../../../style/mixin.less';
2
+
3
+ .@{prefix}-stepper {
4
+ display: flex;
5
+ .use-var(font-size, stepper-font-size);
6
+
7
+ &.@{prefix}-square {
8
+ .use-var(border, stepper-square-border);
9
+ .use-var(border-radius, stepper-square-border-radius);
10
+
11
+ .@{prefix}-stepper {
12
+ &-add-button,
13
+ &-minus-button,
14
+ &-input {
15
+ .use-var(background, stepper-square-background-color);
16
+ }
17
+ &-input {
18
+ .use-var(border-left, stepper-square-border);
19
+ .use-var(border-right, stepper-square-border);
20
+ }
21
+ }
22
+ }
23
+
24
+ &.@{prefix}-round {
25
+ .@{prefix}-stepper {
26
+ &-minus-button,
27
+ &-add-button {
28
+ .use-var(border-radius, stepper-round-button-border-radius);
29
+ }
30
+ &-input {
31
+ .use-var(background, stepper-round-input-background-color);
32
+ }
33
+ }
34
+ }
35
+
36
+ &-minus-button {
37
+ display: flex;
38
+ align-items: center;
39
+ justify-content: center;
40
+ .use-var(font-size, stepper-button-icon-size);
41
+ .use-var(width, stepper-button-size);
42
+ .use-var(height, stepper-button-size);
43
+ .use-var(background, stepper-default-background-color);
44
+
45
+ &-icon {
46
+ .use-var(color, stepper-content-color);
47
+
48
+ &.disabled {
49
+ .use-var(color, stepper-disable-color);
50
+ }
51
+ }
52
+ }
53
+
54
+ &-input {
55
+ text-align: center;
56
+ .use-var(width, stepper-input-width);
57
+ .use-var(height, stepper-input-height);
58
+ .use-var(background, stepper-default-background-color);
59
+ .use-var(color, stepper-content-color);
60
+ .use-var(margin, stepper-input-margin);
61
+ }
62
+
63
+ &-add-button {
64
+ display: flex;
65
+ align-items: center;
66
+ justify-content: center;
67
+ .use-var(font-size, stepper-button-icon-size);
68
+ .use-var(width, stepper-button-size);
69
+ .use-var(height, stepper-button-size);
70
+ .use-var(background, stepper-default-background-color);
71
+
72
+ &-icon {
73
+ .use-var(color, stepper-content-color);
74
+
75
+ &.disabled {
76
+ .use-var(color, stepper-disable-color);
77
+ }
78
+ }
79
+ }
80
+ }
@@ -0,0 +1,159 @@
1
+ import { ReactNode } from 'react';
2
+ export interface StepperProps {
3
+ /**
4
+ * 自定义类名
5
+ * @en Custom classname
6
+ */
7
+ className?: string;
8
+ /**
9
+ * 自定义样式
10
+ * @en Custom stylesheet
11
+ * */
12
+ style?: React.CSSProperties;
13
+ /**
14
+ * input样式
15
+ * @en Input stylesheet
16
+ */
17
+ inputStyle?: React.CSSProperties;
18
+ /**
19
+ * input类名
20
+ * @en Input class
21
+ */
22
+ inputClass?: string;
23
+ /**
24
+ * 绑定值,传入即受控
25
+ * @en Bundled value (Controlled)
26
+ */
27
+ value?: number;
28
+ /**
29
+ * 默认值
30
+ * @en Default value
31
+ * @default 1
32
+ */
33
+ defaultValue?: number;
34
+ /**
35
+ * 是否允许内容为空
36
+ * @en Whether the content is allowed to be empty
37
+ * @default false
38
+ */
39
+ allowEmpty?: boolean;
40
+ /**
41
+ * 格式化到小数点后固定位数,设置为 0 表示格式化到整数
42
+ * @en Formatted to a decimal point after a fixed number of digits, set to 0 indicates formatting to an integer
43
+ * @default 0
44
+ */
45
+ digits?: number;
46
+ /**
47
+ * 是否禁用步进器
48
+ * @en Whether to disable the stepper
49
+ * @default false
50
+ */
51
+ disabled?: boolean;
52
+ /**
53
+ * 输入框只读状态
54
+ * @en Input read only status
55
+ * @default false
56
+ */
57
+ inputReadonly?: boolean;
58
+ /**
59
+ * 最大值
60
+ * @en Max value
61
+ * @default Infinity
62
+ */
63
+ max?: number;
64
+ /**
65
+ * 最小值
66
+ * @en Min value
67
+ * @default 1
68
+ */
69
+ min?: number;
70
+ /**
71
+ * 是否允许操作大于/小于极限值时,操作结果等于极限值
72
+ * @en If an operation is allowed to be greater more/less than the limit value, the result of the operation is equal to the limit value
73
+ */
74
+ equalLimitDisabled?: boolean;
75
+ /**
76
+ * 递增/减值
77
+ * @en Incremental/Impairment value
78
+ * @default 1
79
+ */
80
+ step?: number;
81
+ /**
82
+ * 边框风格
83
+ * @en Border style
84
+ * @default "default"
85
+ */
86
+ theme?: 'square' | 'round' | 'default';
87
+ /**
88
+ * 格式化内部值(优先级最高)
89
+ * @en Format the inner value
90
+ */
91
+ formatter?: (innerValue: number) => number | Promise<number>;
92
+ /**
93
+ * 增加按钮
94
+ * @en Add button
95
+ */
96
+ addButton?: ReactNode;
97
+ /**
98
+ * 删除按钮
99
+ * @en Delete button
100
+ */
101
+ minusButton?: ReactNode;
102
+ /**
103
+ * 自定义输入框函数
104
+ * @en The function of customizing the input
105
+ */
106
+ renderContent?: (innerValue: number) => ReactNode;
107
+ /**
108
+ * 输入框失去焦点时触发
109
+ * @en Triggers when the input loses focus
110
+ */
111
+ onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
112
+ /**
113
+ * 数据变化时的触发
114
+ * @en Triggers when the data change
115
+ */
116
+ onChange?: (value: number | null) => void;
117
+ /**
118
+ * 输入框获得焦点时触发
119
+ * @en Triggers when the input gets focus
120
+ */
121
+ onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
122
+ /**
123
+ * 点击增加按钮时触发
124
+ * @en Triggers when the add button is clicked
125
+ */
126
+ onAddButtonClick?: (e: React.MouseEvent) => void;
127
+ /**
128
+ * 点击减少按钮时触发
129
+ * @en Triggers when the minus button is clicked
130
+ */
131
+ onMinusButtonClick?: (e: React.MouseEvent) => void;
132
+ /**
133
+ * 点击最外侧dom时触发
134
+ * @en Triggers when the most out dom is clicked
135
+ */
136
+ onClick?: (e: React.MouseEvent) => void;
137
+ /**
138
+ * 输入框输入时触发
139
+ * @en Triggers when the input is inputting
140
+ */
141
+ onInput?: (e: React.ChangeEvent) => void;
142
+ }
143
+ export interface StepperRef {
144
+ /**
145
+ * 最外层元素 DOM
146
+ * @en The most out element dom
147
+ */
148
+ dom: HTMLDivElement | null;
149
+ /**
150
+ * 输入框 DOM
151
+ * @en Input dom
152
+ */
153
+ input: HTMLInputElement | null;
154
+ /**
155
+ * 改变内部值的方法
156
+ * @en The function of changing inner value
157
+ */
158
+ changeValue: (newValue: number | null) => void;
159
+ }
@@ -0,0 +1,17 @@
1
+ (function (global, factory) {
2
+ if (typeof define === "function" && define.amd) {
3
+ define(["exports"], factory);
4
+ } else if (typeof exports !== "undefined") {
5
+ factory(exports);
6
+ } else {
7
+ var mod = {
8
+ exports: {}
9
+ };
10
+ factory(mod.exports);
11
+ global.type = mod.exports;
12
+ }
13
+ })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
14
+ "use strict";
15
+
16
+ _exports.__esModule = true;
17
+ });
package/umd/style.d.ts CHANGED
@@ -43,6 +43,7 @@ import './radio/style';
43
43
  import './rate/style';
44
44
  import './slider/style';
45
45
  import './search-bar/style';
46
+ import './stepper/style';
46
47
  import './steps/style';
47
48
  import './sticky/style';
48
49
  import './swipe-action/style';
package/umd/style.js CHANGED
@@ -1,15 +1,15 @@
1
1
  (function (global, factory) {
2
2
  if (typeof define === "function" && define.amd) {
3
- define(["../style/public.less", "./action-sheet/style", "./cell/style", "./loading/style", "./badge/style", "./avatar/style", "./button/style", "./carousel/style", "./toast/style", "./switch/style", "./checkbox/style", "./circle-progress/style", "./collapse/style", "./tabs/style", "./context-provider/style", "./dialog/style", "./count-down/style", "./date-picker/style", "./dropdown/style", "./dropdown-menu/style", "./ellipsis/style", "./grid/style", "./image/style", "./show-monitor/style", "./image-picker/style", "./image-preview/style", "./input/style", "./load-more/style", "./masking/style", "./nav-bar/style", "./notice-bar/style", "./notify/style", "./pagination/style", "./picker/style", "./picker-view/style", "./popover/style", "./popup/style", "./popup-swiper/style", "./portal/style", "./progress/style", "./pull-refresh/style", "./radio/style", "./rate/style", "./slider/style", "./search-bar/style", "./steps/style", "./sticky/style", "./swipe-action/style", "./swipe-load/style", "./tab-bar/style", "./tag/style", "./textarea/style", "./transition/style"], factory);
3
+ define(["../style/public.less", "./action-sheet/style", "./cell/style", "./loading/style", "./badge/style", "./avatar/style", "./button/style", "./carousel/style", "./toast/style", "./switch/style", "./checkbox/style", "./circle-progress/style", "./collapse/style", "./tabs/style", "./context-provider/style", "./dialog/style", "./count-down/style", "./date-picker/style", "./dropdown/style", "./dropdown-menu/style", "./ellipsis/style", "./grid/style", "./image/style", "./show-monitor/style", "./image-picker/style", "./image-preview/style", "./input/style", "./load-more/style", "./masking/style", "./nav-bar/style", "./notice-bar/style", "./notify/style", "./pagination/style", "./picker/style", "./picker-view/style", "./popover/style", "./popup/style", "./popup-swiper/style", "./portal/style", "./progress/style", "./pull-refresh/style", "./radio/style", "./rate/style", "./slider/style", "./search-bar/style", "./stepper/style", "./steps/style", "./sticky/style", "./swipe-action/style", "./swipe-load/style", "./tab-bar/style", "./tag/style", "./textarea/style", "./transition/style"], factory);
4
4
  } else if (typeof exports !== "undefined") {
5
- factory(require("../style/public.less"), require("./action-sheet/style"), require("./cell/style"), require("./loading/style"), require("./badge/style"), require("./avatar/style"), require("./button/style"), require("./carousel/style"), require("./toast/style"), require("./switch/style"), require("./checkbox/style"), require("./circle-progress/style"), require("./collapse/style"), require("./tabs/style"), require("./context-provider/style"), require("./dialog/style"), require("./count-down/style"), require("./date-picker/style"), require("./dropdown/style"), require("./dropdown-menu/style"), require("./ellipsis/style"), require("./grid/style"), require("./image/style"), require("./show-monitor/style"), require("./image-picker/style"), require("./image-preview/style"), require("./input/style"), require("./load-more/style"), require("./masking/style"), require("./nav-bar/style"), require("./notice-bar/style"), require("./notify/style"), require("./pagination/style"), require("./picker/style"), require("./picker-view/style"), require("./popover/style"), require("./popup/style"), require("./popup-swiper/style"), require("./portal/style"), require("./progress/style"), require("./pull-refresh/style"), require("./radio/style"), require("./rate/style"), require("./slider/style"), require("./search-bar/style"), require("./steps/style"), require("./sticky/style"), require("./swipe-action/style"), require("./swipe-load/style"), require("./tab-bar/style"), require("./tag/style"), require("./textarea/style"), require("./transition/style"));
5
+ factory(require("../style/public.less"), require("./action-sheet/style"), require("./cell/style"), require("./loading/style"), require("./badge/style"), require("./avatar/style"), require("./button/style"), require("./carousel/style"), require("./toast/style"), require("./switch/style"), require("./checkbox/style"), require("./circle-progress/style"), require("./collapse/style"), require("./tabs/style"), require("./context-provider/style"), require("./dialog/style"), require("./count-down/style"), require("./date-picker/style"), require("./dropdown/style"), require("./dropdown-menu/style"), require("./ellipsis/style"), require("./grid/style"), require("./image/style"), require("./show-monitor/style"), require("./image-picker/style"), require("./image-preview/style"), require("./input/style"), require("./load-more/style"), require("./masking/style"), require("./nav-bar/style"), require("./notice-bar/style"), require("./notify/style"), require("./pagination/style"), require("./picker/style"), require("./picker-view/style"), require("./popover/style"), require("./popup/style"), require("./popup-swiper/style"), require("./portal/style"), require("./progress/style"), require("./pull-refresh/style"), require("./radio/style"), require("./rate/style"), require("./slider/style"), require("./search-bar/style"), require("./stepper/style"), require("./steps/style"), require("./sticky/style"), require("./swipe-action/style"), require("./swipe-load/style"), require("./tab-bar/style"), require("./tag/style"), require("./textarea/style"), require("./transition/style"));
6
6
  } else {
7
7
  var mod = {
8
8
  exports: {}
9
9
  };
10
- factory(global._public, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style);
10
+ factory(global._public, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style, global.style);
11
11
  global.style = mod.exports;
12
12
  }
13
- })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_public, _style, _style2, _style3, _style4, _style5, _style6, _style7, _style8, _style9, _style10, _style11, _style12, _style13, _style14, _style15, _style16, _style17, _style18, _style19, _style20, _style21, _style22, _style23, _style24, _style25, _style26, _style27, _style28, _style29, _style30, _style31, _style32, _style33, _style34, _style35, _style36, _style37, _style38, _style39, _style40, _style41, _style42, _style43, _style44, _style45, _style46, _style47, _style48, _style49, _style50, _style51, _style52) {
13
+ })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_public, _style, _style2, _style3, _style4, _style5, _style6, _style7, _style8, _style9, _style10, _style11, _style12, _style13, _style14, _style15, _style16, _style17, _style18, _style19, _style20, _style21, _style22, _style23, _style24, _style25, _style26, _style27, _style28, _style29, _style30, _style31, _style32, _style33, _style34, _style35, _style36, _style37, _style38, _style39, _style40, _style41, _style42, _style43, _style44, _style45, _style46, _style47, _style48, _style49, _style50, _style51, _style52, _style53) {
14
14
  "use strict";
15
15
  });