@trionesdev/antd-mobile-base-react 0.0.2-beta.2 → 0.0.2-beta.20

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 (249) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +23 -23
  3. package/dist/Alert/alert.js +1 -1
  4. package/dist/Alert/style.scss +69 -69
  5. package/dist/Avatar/avatar.d.ts +4 -1
  6. package/dist/Avatar/avatar.js +19 -6
  7. package/dist/Avatar/style.scss +17 -16
  8. package/dist/Badge/style.scss +100 -100
  9. package/dist/Card/style.scss +35 -35
  10. package/dist/CascaderView/cascader-column-item.js +1 -1
  11. package/dist/CascaderView/style.scss +22 -22
  12. package/dist/Cell/CellGroup.js +53 -14
  13. package/dist/Cell/cell.js +52 -15
  14. package/dist/Cell/context.d.ts +19 -0
  15. package/dist/Cell/context.js +2 -0
  16. package/dist/Cell/styles.scss +81 -52
  17. package/dist/Cell/types.d.ts +30 -7
  18. package/dist/Checkbox/checkbox-button.d.ts +6 -2
  19. package/dist/Checkbox/checkbox-button.js +6 -18
  20. package/dist/Checkbox/checkbox-group.js +19 -4
  21. package/dist/Checkbox/checkbox-round.d.ts +8 -0
  22. package/dist/Checkbox/checkbox-round.js +35 -0
  23. package/dist/Checkbox/checkbox.js +49 -34
  24. package/dist/Checkbox/index.d.ts +0 -2
  25. package/dist/Checkbox/index.js +0 -2
  26. package/dist/Checkbox/index.scss +165 -151
  27. package/dist/Checkbox/types.d.ts +11 -1
  28. package/dist/ConfigProvider/config-provider.d.ts +1 -0
  29. package/dist/DemoBlock/index.scss +20 -20
  30. package/dist/DemoDescription/index.scss +3 -3
  31. package/dist/Descriptions/style.scss +65 -65
  32. package/dist/Divider/divider.d.ts +1 -1
  33. package/dist/Divider/divider.js +5 -3
  34. package/dist/Divider/style.scss +62 -62
  35. package/dist/Ellipsis/style.scss +13 -13
  36. package/dist/Empty/style.scss +29 -29
  37. package/dist/ErrorBlock/demo/base.js +2 -2
  38. package/dist/ErrorBlock/style.scss +62 -62
  39. package/dist/Footer/style.scss +55 -55
  40. package/dist/Form/ErrorList.d.ts +4 -0
  41. package/dist/Form/ErrorList.js +9 -0
  42. package/dist/Form/context.d.ts +5 -2
  43. package/dist/Form/context.js +2 -1
  44. package/dist/Form/form.d.ts +25 -12
  45. package/dist/Form/form.js +25 -13
  46. package/dist/Form/hooks/useForm.js +1 -8
  47. package/dist/Form/hooks/useFormContext.js +1 -2
  48. package/dist/Form/index.d.ts +8 -3
  49. package/dist/Form/index.js +7 -2
  50. package/dist/Form/styles.scss +11 -0
  51. package/dist/Form/types.d.ts +8 -0
  52. package/dist/FormCell/FormCell.d.ts +21 -0
  53. package/dist/FormCell/FormCell.js +56 -0
  54. package/dist/FormCell/index.d.ts +4 -0
  55. package/dist/FormCell/index.js +3 -0
  56. package/dist/FormCell/styles.scss +103 -0
  57. package/dist/Grid/style.scss +17 -17
  58. package/dist/Icon/demo/base.js +2 -2
  59. package/dist/IndexedStack/IndexedStack.d.ts +9 -0
  60. package/dist/IndexedStack/IndexedStack.js +27 -0
  61. package/dist/IndexedStack/index.d.ts +3 -0
  62. package/dist/IndexedStack/index.js +2 -0
  63. package/dist/InputNumber/input-number.d.ts +3 -2
  64. package/dist/InputNumber/input-number.js +48 -26
  65. package/dist/InputNumber/style.scss +100 -43
  66. package/dist/Loading/DotLoading.d.ts +7 -0
  67. package/dist/{Mask/mask-modal.js → Loading/DotLoading.js} +25 -25
  68. package/dist/{SpinLoading/spin-loading.d.ts → Loading/SpinLoading.d.ts} +0 -1
  69. package/dist/Loading/SpinLoading.js +69 -0
  70. package/dist/Loading/index.d.ts +6 -0
  71. package/dist/Loading/index.js +4 -0
  72. package/dist/Loading/style.scss +113 -0
  73. package/dist/NavBar/nav-bar.d.ts +1 -0
  74. package/dist/NavBar/nav-bar.js +3 -2
  75. package/dist/NavBar/style.scss +65 -61
  76. package/dist/NoticeBar/style.scss +130 -130
  77. package/dist/PageIndicator/style.scss +59 -59
  78. package/dist/Progress/Progress.d.ts +39 -0
  79. package/dist/Progress/Progress.js +56 -0
  80. package/dist/Progress/ProgressCircle.d.ts +15 -0
  81. package/dist/Progress/ProgressCircle.js +117 -0
  82. package/dist/Progress/ProgressLine.d.ts +15 -0
  83. package/dist/Progress/ProgressLine.js +87 -0
  84. package/dist/Progress/index.d.ts +3 -0
  85. package/dist/Progress/index.js +2 -0
  86. package/dist/Progress/style.scss +33 -0
  87. package/dist/Progress/types.d.ts +6 -0
  88. package/dist/Progress/types.js +2 -0
  89. package/dist/Radio/RadioGroup.js +3 -3
  90. package/dist/Radio/radio.js +1 -1
  91. package/dist/Radio/style.scss +154 -138
  92. package/dist/Radio/types.d.ts +6 -4
  93. package/dist/Rate/rate.js +1 -1
  94. package/dist/Rate/style.scss +37 -37
  95. package/dist/Result/demo/base.js +2 -2
  96. package/dist/Result/style.scss +73 -73
  97. package/dist/Result/use-result-icon.js +1 -1
  98. package/dist/SafeArea/style.scss +20 -18
  99. package/dist/Scaffold/style.scss +17 -16
  100. package/dist/Segmented/Segmented.d.ts +57 -0
  101. package/dist/Segmented/Segmented.js +82 -0
  102. package/dist/Segmented/index.d.ts +2 -0
  103. package/dist/Segmented/index.js +1 -0
  104. package/dist/Segmented/style.scss +75 -0
  105. package/dist/Skeleton/Skeleton.d.ts +86 -0
  106. package/dist/Skeleton/Skeleton.js +263 -0
  107. package/dist/Skeleton/index.d.ts +3 -0
  108. package/dist/Skeleton/index.js +2 -0
  109. package/dist/Skeleton/style.scss +215 -0
  110. package/dist/Space/space.d.ts +1 -0
  111. package/dist/Space/space.js +20 -6
  112. package/dist/Space/style.scss +101 -77
  113. package/dist/Stepper/index.d.ts +3 -0
  114. package/dist/Stepper/index.js +2 -0
  115. package/dist/Stepper/stepper.d.ts +14 -0
  116. package/dist/Stepper/stepper.js +92 -0
  117. package/dist/Stepper/style.scss +100 -0
  118. package/dist/Steps/HorizontalSteps.js +10 -3
  119. package/dist/Steps/VerticalSteps.js +5 -2
  120. package/dist/Steps/style.scss +153 -146
  121. package/dist/Steps/types.d.ts +2 -0
  122. package/dist/Switch/style.scss +127 -128
  123. package/dist/Switch/switch.d.ts +2 -0
  124. package/dist/Switch/switch.js +6 -5
  125. package/dist/TabBar/demo/base.js +2 -2
  126. package/dist/TabBar/index.js +2 -1
  127. package/dist/TabBar/index.scss +37 -36
  128. package/dist/Tabs/style.scss +108 -108
  129. package/dist/Tag/style.scss +110 -86
  130. package/dist/Tag/tag.d.ts +4 -1
  131. package/dist/Tag/tag.js +8 -2
  132. package/dist/WaterMark/style.scss +17 -17
  133. package/dist/index.d.ts +17 -26
  134. package/dist/index.js +8 -13
  135. package/dist/style/css-variable.scss +6 -0
  136. package/dist/style/style.scss +52 -52
  137. package/dist/style/theme-dark.scss +24 -24
  138. package/dist/style/theme-default.scss +54 -54
  139. package/dist/style/variable.scss +180 -168
  140. package/dist/types.d.ts +10 -1
  141. package/dist/utils/type.js +36 -36
  142. package/dist/utils/with-default-props.js +4 -4
  143. package/package.json +5 -8
  144. package/dist/ActionSheet/ActionSheet.d.ts +0 -25
  145. package/dist/ActionSheet/ActionSheet.js +0 -77
  146. package/dist/ActionSheet/index.d.ts +0 -3
  147. package/dist/ActionSheet/index.js +0 -2
  148. package/dist/ActionSheet/style.scss +0 -51
  149. package/dist/CascaderPicker/cascader-picker.d.ts +0 -27
  150. package/dist/CascaderPicker/cascader-picker.js +0 -88
  151. package/dist/CascaderPicker/index.d.ts +0 -3
  152. package/dist/CascaderPicker/index.js +0 -2
  153. package/dist/CascaderPicker/style.scss +0 -42
  154. package/dist/Form/FormItem/form-item-input.d.ts +0 -15
  155. package/dist/Form/FormItem/form-item-input.js +0 -39
  156. package/dist/Form/FormItem/form-item-label.d.ts +0 -13
  157. package/dist/Form/FormItem/form-item-label.js +0 -25
  158. package/dist/Form/FormItem/form-item.d.ts +0 -21
  159. package/dist/Form/FormItem/form-item.js +0 -70
  160. package/dist/Form/FormItem/index.d.ts +0 -5
  161. package/dist/Form/FormItem/index.js +0 -3
  162. package/dist/Form/style.scss +0 -45
  163. package/dist/Input/base-input.d.ts +0 -14
  164. package/dist/Input/base-input.js +0 -63
  165. package/dist/Input/index.d.ts +0 -12
  166. package/dist/Input/index.js +0 -9
  167. package/dist/Input/index.scss +0 -173
  168. package/dist/Input/input-affix-wrapper.d.ts +0 -8
  169. package/dist/Input/input-affix-wrapper.js +0 -50
  170. package/dist/Input/input-opt.d.ts +0 -16
  171. package/dist/Input/input-opt.js +0 -93
  172. package/dist/Input/input-password.d.ts +0 -7
  173. package/dist/Input/input-password.js +0 -47
  174. package/dist/Input/input.d.ts +0 -15
  175. package/dist/Input/input.js +0 -47
  176. package/dist/Input/textarea.d.ts +0 -13
  177. package/dist/Input/textarea.js +0 -45
  178. package/dist/Input/types.d.ts +0 -1
  179. package/dist/Input/types.js +0 -1
  180. package/dist/Mask/index.d.ts +0 -3
  181. package/dist/Mask/index.js +0 -2
  182. package/dist/Mask/mask-modal.d.ts +0 -45
  183. package/dist/Mask/mask.d.ts +0 -5
  184. package/dist/Mask/mask.js +0 -19
  185. package/dist/Mask/style.scss +0 -20
  186. package/dist/Picker/index.d.ts +0 -3
  187. package/dist/Picker/index.js +0 -2
  188. package/dist/Picker/picker.d.ts +0 -19
  189. package/dist/Picker/picker.js +0 -97
  190. package/dist/Picker/style.scss +0 -41
  191. package/dist/PickerView/index.d.ts +0 -4
  192. package/dist/PickerView/index.js +0 -2
  193. package/dist/PickerView/picker-view-column-item.d.ts +0 -7
  194. package/dist/PickerView/picker-view-column-item.js +0 -11
  195. package/dist/PickerView/picker-view-column.d.ts +0 -10
  196. package/dist/PickerView/picker-view-column.js +0 -117
  197. package/dist/PickerView/picker-view.d.ts +0 -12
  198. package/dist/PickerView/picker-view.js +0 -60
  199. package/dist/PickerView/style.scss +0 -72
  200. package/dist/PickerView/types.d.ts +0 -4
  201. package/dist/Popup/index.d.ts +0 -3
  202. package/dist/Popup/index.js +0 -2
  203. package/dist/Popup/popup-modal.d.ts +0 -52
  204. package/dist/Popup/popup-modal.js +0 -74
  205. package/dist/Popup/popup.d.ts +0 -4
  206. package/dist/Popup/popup.js +0 -56
  207. package/dist/Popup/style.scss +0 -53
  208. package/dist/ScrollView/index.d.ts +0 -4
  209. package/dist/ScrollView/index.js +0 -2
  210. package/dist/ScrollView/scroll-view.d.ts +0 -4
  211. package/dist/ScrollView/scroll-view.js +0 -55
  212. package/dist/ScrollView/style.scss +0 -19
  213. package/dist/ScrollView/types.d.ts +0 -26
  214. package/dist/ScrollView/types.js +0 -1
  215. package/dist/SideBar/SideBarContext.d.ts +0 -18
  216. package/dist/SideBar/SideBarContext.js +0 -2
  217. package/dist/SideBar/index.d.ts +0 -3
  218. package/dist/SideBar/index.js +0 -2
  219. package/dist/SideBar/side-bar.d.ts +0 -25
  220. package/dist/SideBar/side-bar.js +0 -351
  221. package/dist/SideBar/style.scss +0 -85
  222. package/dist/SideBar/types.d.ts +0 -7
  223. package/dist/SideBar/types.js +0 -1
  224. package/dist/SpinLoading/demo/base.d.ts +0 -3
  225. package/dist/SpinLoading/demo/base.js +0 -21
  226. package/dist/SpinLoading/index.d.ts +0 -3
  227. package/dist/SpinLoading/index.js +0 -2
  228. package/dist/SpinLoading/spin-loading.js +0 -59
  229. package/dist/SpinLoading/spin-loading.scss +0 -40
  230. package/dist/Tabs/demo/base.d.ts +0 -3
  231. package/dist/Tabs/demo/base.js +0 -59
  232. package/dist/Tag/demo/base.d.ts +0 -7
  233. package/dist/Tag/demo/base.js +0 -67
  234. package/dist/Tag/demo/style.scss +0 -8
  235. package/dist/Toast/index.d.ts +0 -5
  236. package/dist/Toast/index.js +0 -3
  237. package/dist/Toast/style.scss +0 -63
  238. package/dist/Toast/toast-modal.d.ts +0 -18
  239. package/dist/Toast/toast-modal.js +0 -112
  240. package/dist/Toast/toast.d.ts +0 -7
  241. package/dist/Toast/toast.js +0 -78
  242. package/dist/VerificationCodeInput/demo/base.d.ts +0 -3
  243. package/dist/VerificationCodeInput/demo/base.js +0 -11
  244. package/dist/VerificationCodeInput/index.d.ts +0 -3
  245. package/dist/VerificationCodeInput/index.js +0 -2
  246. package/dist/VerificationCodeInput/style.scss +0 -20
  247. package/dist/VerificationCodeInput/verification-code-input.d.ts +0 -24
  248. package/dist/VerificationCodeInput/verification-code-input.js +0 -99
  249. /package/dist/{PickerView → Form}/types.js +0 -0
@@ -1,19 +0,0 @@
1
- import React, { FC } from 'react';
2
- import { PickerColumnOption } from '../PickerView';
3
- import './style.scss';
4
- export type PickerProps = {
5
- open?: boolean;
6
- afterOpenChange?: (open: boolean) => void;
7
- title?: React.ReactNode;
8
- columns?: PickerColumnOption[][];
9
- /**
10
- * @description 是否把每个选项的 label 包装到 value 中,会把 Select 的 value 类型从 string 变为 { value: string, label: ReactNode } 的格式
11
- * @default false
12
- */
13
- labelInValue?: boolean;
14
- value?: any[];
15
- onOk: (value: any[]) => void;
16
- onCancel?: () => void;
17
- onClose?: () => void;
18
- };
19
- export declare const Picker: FC<PickerProps>;
@@ -1,97 +0,0 @@
1
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
- import classNames from 'classnames';
8
- import { size } from 'lodash-es';
9
- import React, { useEffect, useState } from 'react';
10
- import ConfigProvider from "../ConfigProvider";
11
- import PickerView from "../PickerView";
12
- import Popup from "../Popup";
13
- import "./style.scss";
14
- var pickerCls = 'triones-antm-picker';
15
- export var Picker = /*#__PURE__*/React.memo(function (_ref) {
16
- var open = _ref.open,
17
- afterOpenChange = _ref.afterOpenChange,
18
- title = _ref.title,
19
- columns = _ref.columns,
20
- _ref$labelInValue = _ref.labelInValue,
21
- labelInValue = _ref$labelInValue === void 0 ? false : _ref$labelInValue,
22
- value = _ref.value,
23
- onOk = _ref.onOk,
24
- onCancel = _ref.onCancel,
25
- onClose = _ref.onClose;
26
- var _ConfigProvider$useCo = ConfigProvider.useConfig(),
27
- locale = _ConfigProvider$useCo.locale;
28
- var _useState = useState(value || Array.from({
29
- length: size(columns)
30
- }).map(function () {
31
- return null;
32
- })),
33
- _useState2 = _slicedToArray(_useState, 2),
34
- internalValue = _useState2[0],
35
- setInternalValue = _useState2[1];
36
- var _React$useState = React.useState(open || false),
37
- _React$useState2 = _slicedToArray(_React$useState, 2),
38
- innerOpen = _React$useState2[0],
39
- setInnerOpen = _React$useState2[1];
40
- var handleClose = function handleClose() {
41
- setInnerOpen(false);
42
- onClose === null || onClose === void 0 || onClose();
43
- };
44
- var handleOk = function handleOk() {
45
- onOk === null || onOk === void 0 || onOk(internalValue);
46
- handleClose();
47
- };
48
- var handelCancel = function handelCancel() {
49
- onCancel === null || onCancel === void 0 || onCancel();
50
- handleClose();
51
- };
52
- useEffect(function () {
53
- afterOpenChange === null || afterOpenChange === void 0 || afterOpenChange(innerOpen);
54
- }, [innerOpen]);
55
- useEffect(function () {
56
- if (open === undefined) {
57
- return;
58
- }
59
- if (open === innerOpen) {
60
- return;
61
- }
62
- setInnerOpen(open);
63
- }, [open]);
64
- return /*#__PURE__*/React.createElement(Popup, {
65
- open: innerOpen,
66
- onClose: function onClose() {
67
- setInnerOpen(false);
68
- },
69
- styles: {
70
- body: {
71
- borderTopLeftRadius: 6,
72
- borderTopRightRadius: 6
73
- }
74
- }
75
- }, /*#__PURE__*/React.createElement("div", {
76
- className: classNames(pickerCls)
77
- }, /*#__PURE__*/React.createElement("div", {
78
- className: classNames("".concat(pickerCls, "-header"))
79
- }, /*#__PURE__*/React.createElement("a", {
80
- className: classNames("".concat(pickerCls, "-header-button")),
81
- onClick: handelCancel
82
- }, locale.common.cancel), title && /*#__PURE__*/React.createElement("div", {
83
- className: classNames("".concat(pickerCls, "-header-title"))
84
- }, title), /*#__PURE__*/React.createElement("a", {
85
- className: classNames("".concat(pickerCls, "-header-button"), "".concat(pickerCls, "-header-button-ok")),
86
- onClick: handleOk
87
- }, locale.common.confirm)), /*#__PURE__*/React.createElement("div", {
88
- className: classNames("".concat(pickerCls, "-body"))
89
- }, /*#__PURE__*/React.createElement(PickerView, {
90
- columns: columns,
91
- labelInValue: labelInValue,
92
- value: internalValue,
93
- onChange: function onChange(v) {
94
- setInternalValue(v);
95
- }
96
- }))));
97
- });
@@ -1,41 +0,0 @@
1
- @use "../style/variable" as *;
2
- $pickerCls: 'triones-antm-picker';
3
-
4
- .#{$pickerCls} {
5
- width: 100%;
6
- height: 300Px;
7
- overflow: hidden;
8
- position: relative;
9
- display: flex;
10
- flex-direction: column;
11
-
12
- &-header {
13
- display: flex;
14
- justify-content: space-between;
15
- align-items: center;
16
- border-bottom: 1Px solid #eee;
17
- padding: 4Px;
18
-
19
- &-button {
20
- padding: 8Px;
21
- font-size: 12Px;
22
- &-ok{
23
- color: $trionesColorPrimary;
24
- }
25
- }
26
-
27
- &-title {
28
- }
29
- }
30
-
31
- &-body {
32
- flex: 1 1;
33
- width: 100%;
34
- height: 100%;
35
- pointer-events: unset;
36
- }
37
- &-view{
38
- --height: 100%;
39
- }
40
-
41
- }
@@ -1,4 +0,0 @@
1
- import { PickerView, PickerViewProps } from "./picker-view";
2
- import { PickerColumnOption } from "./types";
3
- export type { PickerViewProps, PickerColumnOption };
4
- export default PickerView;
@@ -1,2 +0,0 @@
1
- import { PickerView } from "./picker-view";
2
- export default PickerView;
@@ -1,7 +0,0 @@
1
- import { FC } from "react";
2
- import { PickerColumnOption } from "./types";
3
- type PickerViewColumnItemProps = {
4
- option: PickerColumnOption;
5
- };
6
- export declare const PickerViewColumnItem: FC<PickerViewColumnItemProps>;
7
- export {};
@@ -1,11 +0,0 @@
1
- import classNames from "classnames";
2
- import React from "react";
3
- var pickerViewCls = "triones-antm-picker-view";
4
- export var PickerViewColumnItem = function PickerViewColumnItem(_ref) {
5
- var option = _ref.option;
6
- return /*#__PURE__*/React.createElement("div", {
7
- className: classNames("".concat(pickerViewCls, "-column-item"))
8
- }, /*#__PURE__*/React.createElement("div", {
9
- className: "".concat(pickerViewCls, "-column-item-label")
10
- }, option.label));
11
- };
@@ -1,10 +0,0 @@
1
- import { FC } from "react";
2
- import { PickerColumnOption } from "./types";
3
- type PickerViewColumnProps = {
4
- options?: PickerColumnOption[];
5
- labelInValue?: boolean;
6
- value?: any;
7
- onChange?: (value: any, index?: number) => void;
8
- };
9
- export declare const PickerViewColumn: FC<PickerViewColumnProps>;
10
- export {};
@@ -1,117 +0,0 @@
1
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
- import React, { useEffect, useState } from "react";
8
- import classNames from "classnames";
9
- import { PickerViewColumnItem } from "./picker-view-column-item";
10
- import { findIndex, isEmpty, size } from "lodash-es";
11
- var pickerViewCls = "triones-antm-picker-view";
12
- export var PickerViewColumn = /*#__PURE__*/React.memo(function (_ref) {
13
- var options = _ref.options,
14
- labelInValue = _ref.labelInValue,
15
- value = _ref.value,
16
- onChange = _ref.onChange;
17
- var _useState = useState(value || null),
18
- _useState2 = _slicedToArray(_useState, 2),
19
- internalValue = _useState2[0],
20
- setInternalValue = _useState2[1];
21
- var itemHeight = 34;
22
- var max = 0;
23
- var min = 0 - itemHeight * (size(options) - 1);
24
- var _useState3 = useState(false),
25
- _useState4 = _slicedToArray(_useState3, 2),
26
- touching = _useState4[0],
27
- setTouching = _useState4[1];
28
- var _React$useState = React.useState(),
29
- _React$useState2 = _slicedToArray(_React$useState, 2),
30
- touchPoint = _React$useState2[0],
31
- setTouchPoint = _React$useState2[1];
32
- var _useState5 = useState(0),
33
- _useState6 = _slicedToArray(_useState5, 2),
34
- translateY = _useState6[0],
35
- setTranslateY = _useState6[1];
36
- var handleSelectOption = function handleSelectOption(selectValue) {
37
- var valueIndex = findIndex(options, function (option) {
38
- if (labelInValue) {
39
- return option.value === selectValue.value;
40
- }
41
- return option.value === selectValue;
42
- });
43
- setTranslateY(0 - valueIndex * itemHeight);
44
- };
45
- useEffect(function () {
46
- if (value === undefined) {
47
- return;
48
- }
49
- if (value === internalValue) {
50
- return;
51
- }
52
- setInternalValue(value);
53
- handleSelectOption(value);
54
- }, [value]);
55
- useEffect(function () {
56
- if (!value) {
57
- var selectValue = labelInValue ? options === null || options === void 0 ? void 0 : options[0] : options === null || options === void 0 ? void 0 : options[0].value;
58
- setInternalValue(selectValue || null);
59
- onChange === null || onChange === void 0 || onChange(selectValue || null);
60
- handleSelectOption(selectValue);
61
- } else {
62
- handleSelectOption(value);
63
- }
64
- }, [options]);
65
- return /*#__PURE__*/React.createElement("div", {
66
- className: classNames("".concat(pickerViewCls, "-column"))
67
- }, /*#__PURE__*/React.createElement("div", {
68
- className: classNames("".concat(pickerViewCls, "-column-wheel")),
69
- style: {
70
- transform: "translate3d(0, ".concat(translateY, "px, 0)")
71
- },
72
- onTouchStart: function onTouchStart(event) {
73
- setTouching(true);
74
- var startPoint = {
75
- clientX: event.touches[0].clientX,
76
- clientY: event.touches[0].clientY
77
- };
78
- setTouchPoint(startPoint);
79
- },
80
- onTouchMove: function onTouchMove(event) {
81
- if (touching) {
82
- var movePoint = {
83
- clientX: event.touches[0].clientX,
84
- clientY: event.touches[0].clientY
85
- };
86
- if (translateY > max || translateY < min) {
87
- return;
88
- }
89
- setTranslateY(translateY + (movePoint.clientY - touchPoint.clientY));
90
- setTouchPoint(movePoint);
91
- }
92
- },
93
- onTouchEnd: function onTouchEnd(event) {
94
- setTouching(false);
95
- var selectIndex = 0;
96
- if (translateY > 0) {
97
- setTranslateY(0);
98
- selectIndex = 0;
99
- } else if (translateY < 0 - itemHeight * (size(options) - 1)) {
100
- setTranslateY(0 - itemHeight * (size(options) - 1));
101
- selectIndex = size(options) - 1;
102
- } else {
103
- var num = Math.abs(Math.round(translateY / itemHeight));
104
- setTranslateY(0 - num * itemHeight);
105
- selectIndex = num;
106
- }
107
- var selectValue = labelInValue ? options === null || options === void 0 ? void 0 : options[selectIndex] : options === null || options === void 0 ? void 0 : options[selectIndex].value;
108
- setInternalValue(selectValue);
109
- onChange === null || onChange === void 0 || onChange(selectValue);
110
- }
111
- }, !isEmpty(options) && (options === null || options === void 0 ? void 0 : options.map(function (option, index) {
112
- return /*#__PURE__*/React.createElement(PickerViewColumnItem, {
113
- option: option,
114
- key: "view-column-".concat(index)
115
- });
116
- }))));
117
- });
@@ -1,12 +0,0 @@
1
- import React, { FC } from "react";
2
- import { PickerColumnOption } from "./types";
3
- import "./style.scss";
4
- export type PickerViewProps = {
5
- className?: string;
6
- style?: React.CSSProperties;
7
- columns?: PickerColumnOption[][];
8
- labelInValue?: boolean;
9
- value?: any[];
10
- onChange?: (value: any[]) => void;
11
- };
12
- export declare const PickerView: FC<PickerViewProps>;
@@ -1,60 +0,0 @@
1
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
- import classNames from "classnames";
8
- import { isEmpty, size } from "lodash-es";
9
- import { PickerViewColumn } from "./picker-view-column";
10
- import React, { useEffect, useState } from "react";
11
- import "./style.scss";
12
- var pickerViewCls = "triones-antm-picker-view";
13
- export var PickerView = /*#__PURE__*/React.memo(function (_ref) {
14
- var className = _ref.className,
15
- style = _ref.style,
16
- columns = _ref.columns,
17
- labelInValue = _ref.labelInValue,
18
- value = _ref.value,
19
- _onChange = _ref.onChange;
20
- var _useState = useState(value || Array.from({
21
- length: size(columns)
22
- }).map(function () {
23
- return null;
24
- })),
25
- _useState2 = _slicedToArray(_useState, 2),
26
- internalValue = _useState2[0],
27
- setInternalValue = _useState2[1];
28
- useEffect(function () {
29
- if (value === undefined) {
30
- return;
31
- }
32
- if (value === internalValue) {
33
- return;
34
- }
35
- setInternalValue(value);
36
- }, [value]);
37
- return /*#__PURE__*/React.createElement("div", {
38
- className: classNames("".concat(pickerViewCls), className),
39
- style: style
40
- }, !isEmpty(columns) && (columns === null || columns === void 0 ? void 0 : columns.map(function (column, index) {
41
- return /*#__PURE__*/React.createElement(PickerViewColumn, {
42
- key: "column-".concat(index),
43
- labelInValue: labelInValue,
44
- options: column,
45
- value: value === null || value === void 0 ? void 0 : value[index],
46
- onChange: function onChange(v) {
47
- internalValue[index] = v;
48
- _onChange === null || _onChange === void 0 || _onChange(internalValue);
49
- }
50
- });
51
- })), /*#__PURE__*/React.createElement("div", {
52
- className: classNames("".concat(pickerViewCls, "-mask"))
53
- }, /*#__PURE__*/React.createElement("div", {
54
- className: classNames("".concat(pickerViewCls, "-mask-top"))
55
- }), /*#__PURE__*/React.createElement("div", {
56
- className: classNames("".concat(pickerViewCls, "-mask-middle"))
57
- }), /*#__PURE__*/React.createElement("div", {
58
- className: classNames("".concat(pickerViewCls, "-mask-bottom"))
59
- })));
60
- });
@@ -1,72 +0,0 @@
1
- $pickerViewCls: 'triones-antm-picker-view';
2
- .#{$pickerViewCls} {
3
- width: 100%;
4
- height: var(--height,240Px);
5
- display: flex;
6
- position: relative;
7
- overflow: hidden;
8
- --item-height: 34Px;
9
- --item-font-size: 16Px;
10
-
11
- &-column {
12
- height: 100%;
13
- flex: 1 1;
14
- user-select: none;
15
- touch-action: none;
16
- position: relative;
17
- z-index: 0;
18
- &-wheel{
19
- width: 100%;
20
- cursor: grab;
21
- position: absolute;
22
- top: calc(50% - var(--item-height)/2);
23
- left: 0;
24
- }
25
-
26
- &-item {
27
- font-size: var(--item-font-size);
28
- padding: 0 6px;
29
- height: var(--item-height);
30
- display: flex;
31
- justify-content: center;
32
- align-items: center;
33
- &-label{
34
- overflow: hidden;
35
- text-overflow: ellipsis;
36
- white-space: nowrap;
37
- }
38
- }
39
- }
40
-
41
- &-mask {
42
- position: absolute;
43
- z-index: 10000;
44
- left: 0;
45
- top: 0;
46
- width: 100%;
47
- height: 100%;
48
- display: flex;
49
- flex-direction: column;
50
- pointer-events: none;
51
-
52
- &-top {
53
- background-color: white;
54
- flex: auto;
55
- mask: linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .8) 50%, #000);
56
- }
57
-
58
- &-middle {
59
- height: var(--item-height);
60
- box-sizing: border-box;
61
- flex: none;
62
- border-top: 1px solid #eee;
63
- border-bottom: 1px solid #eee;
64
- }
65
-
66
- &-bottom {
67
- background-color: white;
68
- flex: auto;
69
- mask: linear-gradient(180deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .8) 50%, #000);
70
- }
71
- }
72
- }
@@ -1,4 +0,0 @@
1
- export type PickerColumnOption = {
2
- label?: string;
3
- value?: string;
4
- };
@@ -1,3 +0,0 @@
1
- import { Popup, PopupProps } from "./popup";
2
- export type { PopupProps };
3
- export default Popup;
@@ -1,2 +0,0 @@
1
- import { Popup } from "./popup";
2
- export default Popup;
@@ -1,52 +0,0 @@
1
- import { CSSProperties, FC, PropsWithChildren } from 'react';
2
- import './style.scss';
3
- export type Position = 'top' | 'bottom' | 'left' | 'right';
4
- export type PopupModalProps = {
5
- className?: string;
6
- /**
7
- * @description 样式
8
- * @default horizontal
9
- */
10
- styles?: {
11
- body?: CSSProperties;
12
- };
13
- /**
14
- * @description Modal 完全关闭后的回调
15
- * @default
16
- */
17
- afterClose?: () => void;
18
- /**
19
- * @description 是否打开
20
- * @default false
21
- */
22
- open?: boolean;
23
- /**
24
- * @description 打开位置
25
- * @default bottom
26
- */
27
- position?: Position;
28
- /**
29
- * @description 是否可以关闭(显示关闭按钮)
30
- * @default false
31
- */
32
- closable?: boolean;
33
- /**
34
- * @description 是否蒙层关闭
35
- * @default true
36
- */
37
- maskClosable?: boolean;
38
- onMaskClick?: () => void;
39
- /**
40
- * @description 关闭时销毁 Modal 里的子元素
41
- * @default false
42
- */
43
- destroyOnClose?: boolean;
44
- /**
45
- * @description 设置 Modal 的 z-index
46
- * @default 1000
47
- */
48
- zIndex?: number;
49
- onClose?: () => void;
50
- onDestroy?: () => void;
51
- };
52
- export declare const PopupModal: FC<PropsWithChildren<PopupModalProps>>;
@@ -1,74 +0,0 @@
1
- import classNames from 'classnames';
2
- import React, { memo, useMemo } from 'react';
3
- import SafeArea from "../SafeArea";
4
- import "./style.scss";
5
- import { CloseOutline } from "@trionesdev/antd-mobile-icons-react";
6
- var popupCls = 'triones-antm-popup';
7
- export var PopupModal = /*#__PURE__*/memo(function (_ref) {
8
- var children = _ref.children,
9
- styles = _ref.styles,
10
- afterClose = _ref.afterClose,
11
- _ref$open = _ref.open,
12
- open = _ref$open === void 0 ? false : _ref$open,
13
- _ref$position = _ref.position,
14
- position = _ref$position === void 0 ? 'bottom' : _ref$position,
15
- _ref$closable = _ref.closable,
16
- closable = _ref$closable === void 0 ? false : _ref$closable,
17
- _ref$maskClosable = _ref.maskClosable,
18
- maskClosable = _ref$maskClosable === void 0 ? true : _ref$maskClosable,
19
- onMaskClick = _ref.onMaskClick,
20
- _ref$destroyOnClose = _ref.destroyOnClose,
21
- destroyOnClose = _ref$destroyOnClose === void 0 ? false : _ref$destroyOnClose,
22
- _ref$zIndex = _ref.zIndex,
23
- zIndex = _ref$zIndex === void 0 ? 1000 : _ref$zIndex,
24
- onClose = _ref.onClose,
25
- onDestroy = _ref.onDestroy;
26
- var safeAreaPosition = useMemo(function () {
27
- if (position === 'bottom') {
28
- return 'bottom';
29
- } else if (position === 'top') {
30
- return 'top';
31
- }
32
- return undefined;
33
- }, [position]);
34
- var handleClose = function handleClose() {
35
- onClose === null || onClose === void 0 || onClose();
36
- afterClose === null || afterClose === void 0 || afterClose();
37
- if (destroyOnClose) {
38
- onDestroy === null || onDestroy === void 0 || onDestroy();
39
- }
40
- };
41
- return /*#__PURE__*/React.createElement("div", {
42
- className: classNames(popupCls),
43
- style: {
44
- zIndex: zIndex,
45
- display: open ? 'block' : 'none'
46
- },
47
- onClick: function onClick(e) {
48
- e.stopPropagation();
49
- e.preventDefault();
50
- }
51
- }, /*#__PURE__*/React.createElement("div", {
52
- className: classNames("".concat(popupCls, "-mask")),
53
- onClick: function onClick() {
54
- if (maskClosable) {
55
- onMaskClick === null || onMaskClick === void 0 || onMaskClick();
56
- handleClose();
57
- }
58
- }
59
- }), /*#__PURE__*/React.createElement("div", {
60
- className: classNames("".concat(popupCls, "-body"), "".concat(popupCls, "-").concat(position)),
61
- style: styles === null || styles === void 0 ? void 0 : styles.body,
62
- onClick: function onClick(e) {
63
- e.stopPropagation();
64
- e.preventDefault();
65
- }
66
- }, closable && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CloseOutline, {
67
- className: classNames("".concat(popupCls, "-close")),
68
- onClick: function onClick() {
69
- handleClose();
70
- }
71
- })), /*#__PURE__*/React.createElement(SafeArea, {
72
- position: safeAreaPosition
73
- }, children)));
74
- });
@@ -1,4 +0,0 @@
1
- import { FC, PropsWithChildren } from 'react';
2
- import { PopupModalProps } from './popup-modal';
3
- export type PopupProps = Omit<PopupModalProps, 'onDestroy'>;
4
- export declare const Popup: FC<PropsWithChildren<PopupProps>>;
@@ -1,56 +0,0 @@
1
- var _excluded = ["children", "open"];
2
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
3
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
4
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
5
- import React, { memo } from 'react';
6
- import { PopupModal } from "./popup-modal";
7
- export var Popup = /*#__PURE__*/memo(function (_ref) {
8
- var children = _ref.children,
9
- _ref$open = _ref.open,
10
- open = _ref$open === void 0 ? false : _ref$open,
11
- rest = _objectWithoutProperties(_ref, _excluded);
12
- // const [renderEnable, setRenderEnable] = React.useState(false);
13
- // const containerRef = React.useRef<HTMLDivElement>(null);
14
- // const mountRef = React.useRef<HTMLDivElement | null>(null);
15
- // const rootContainer = getContainer?.() || containerRef.current!;
16
- //
17
- // const Portal = () => {
18
- // if (!mountRef.current) {
19
- // mountRef.current = document.createElement('div');
20
- // rootContainer.appendChild(mountRef.current);
21
- // }
22
- //
23
- // const destroy = () => {
24
- // if (rootContainer && mountRef.current) {
25
- // rootContainer.removeChild(mountRef.current);
26
- // }
27
- // mountRef.current = null;
28
- // setRenderEnable(false);
29
- // };
30
- //
31
- // return (
32
- // <>
33
- // {createPortal(
34
- // <PopupModal {...rest} onDestroy={destroy} open={open}>
35
- // {children}
36
- // </PopupModal>,
37
- // mountRef.current!,
38
- // )}
39
- // </>
40
- // );
41
- // };
42
-
43
- // useEffect(() => {
44
- // if (open && !renderEnable) {
45
- // setRenderEnable(true);
46
- // }
47
- // // rest.afterOpenChange?.(open);
48
- // }, [open]);
49
-
50
- if (!open) {
51
- return null;
52
- }
53
- return /*#__PURE__*/React.createElement(PopupModal, _extends({}, rest, {
54
- open: open
55
- }), children);
56
- });