@trionesdev/antd-mobile-react 0.0.2-beta.17 → 0.0.2-beta.19

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 (69) hide show
  1. package/LICENSE +21 -21
  2. package/dist/ActionSheet/style.scss +52 -52
  3. package/dist/Avatar/demo/base.js +2 -2
  4. package/dist/Avatar/demo/style.scss +6 -6
  5. package/dist/Badge/demo/base.js +2 -2
  6. package/dist/Badge/demo/base.scss +6 -6
  7. package/dist/Button/demo/base.js +2 -2
  8. package/dist/Button/style.scss +234 -234
  9. package/dist/Calendar/style.scss +85 -85
  10. package/dist/Calendar/touchable-calendar-grid.js +9 -9
  11. package/dist/CalendarDatetimePicker/style.scss +54 -54
  12. package/dist/CalendarDatetimePickerCell/style.scss +10 -10
  13. package/dist/CalendarPicker/style.scss +31 -31
  14. package/dist/Card/demo/base.js +2 -2
  15. package/dist/Card/demo/base.scss +18 -18
  16. package/dist/CascaderPicker/style.scss +45 -45
  17. package/dist/CascaderPickerCell/style.scss +24 -24
  18. package/dist/Checkbox/demo/base.js +2 -2
  19. package/dist/ConfigProvider/demo/base.js +2 -2
  20. package/dist/DemoBlock/index.scss +20 -20
  21. package/dist/DemoDescription/index.scss +3 -3
  22. package/dist/Divider/demo/base.js +2 -2
  23. package/dist/Ellipsis/demo/base.js +2 -2
  24. package/dist/Empty/demo/base.js +2 -2
  25. package/dist/ErrorBlock/demo/base.js +2 -2
  26. package/dist/FloatButton/style.scss +123 -123
  27. package/dist/Footer/demo/base.js +2 -2
  28. package/dist/Form/style.scss +106 -106
  29. package/dist/Grid/demo/base.js +2 -2
  30. package/dist/Grid/demo/base.scss +7 -7
  31. package/dist/Icon/demo/base.js +2 -2
  32. package/dist/Image/demo/base.js +2 -2
  33. package/dist/Image/demo/base.scss +4 -4
  34. package/dist/Image/style.scss +30 -30
  35. package/dist/ImagesPreview/style.scss +34 -34
  36. package/dist/ImagesWall/style.scss +70 -70
  37. package/dist/Input/demo/base.js +2 -2
  38. package/dist/Input/index.scss +240 -240
  39. package/dist/NavBar/demo/base.scss +5 -5
  40. package/dist/NoticeBar/demo/base.js +2 -2
  41. package/dist/Overlay/style.scss +20 -20
  42. package/dist/PageIndicator/demo/base.js +2 -2
  43. package/dist/Picker/style.scss +44 -44
  44. package/dist/PickerView/style.scss +72 -72
  45. package/dist/Popup/demo/base.js +2 -2
  46. package/dist/Popup/style.scss +129 -129
  47. package/dist/Radio/demo/base.scss +4 -4
  48. package/dist/Result/demo/base.js +2 -2
  49. package/dist/SafeArea/demo/base.scss +18 -18
  50. package/dist/ScrollView/style.scss +19 -19
  51. package/dist/SideBar/side-bar.js +6 -6
  52. package/dist/SideBar/style.scss +85 -85
  53. package/dist/Space/demo/base.js +2 -2
  54. package/dist/Swiper/style.scss +54 -54
  55. package/dist/Switch/demo/base.js +2 -2
  56. package/dist/TabBar/demo/base.js +2 -2
  57. package/dist/Tag/demo/base.js +2 -2
  58. package/dist/Tag/demo/style.scss +8 -8
  59. package/dist/Toast/style.scss +63 -63
  60. package/dist/VerificationCodeInput/style.scss +20 -20
  61. package/dist/WaterMark/demo/demo1.js +2 -2
  62. package/dist/WaterMark/demo/demo1.scss +6 -6
  63. package/dist/WaterMark/demo/demo2.js +2 -2
  64. package/dist/style/variable.scss +1 -1
  65. package/dist/utils/type.js +36 -36
  66. package/dist/utils/use-isomorphic-update-layout-effect.d.ts +1 -1
  67. package/dist/utils/with-default-props.js +4 -4
  68. package/package.json +4 -4
  69. package/readme.md +43 -43
@@ -1,5 +1,5 @@
1
- /**
2
- * compact: true
1
+ /**
2
+ * compact: true
3
3
  */
4
4
  import { DemoBlock } from "../../DemoBlock";
5
5
  import React from 'react';
@@ -1,44 +1,44 @@
1
- @use "../style/variable" as variable;
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
- &-cancel{
23
- color: variable.$trionesColorTextSecondary;
24
- }
25
- &-ok{
26
- color: variable.$trionesColorPrimary;
27
- }
28
- }
29
-
30
- &-title {
31
- }
32
- }
33
-
34
- &-body {
35
- flex: 1 1;
36
- width: 100%;
37
- height: 100%;
38
- pointer-events: unset;
39
- }
40
- &-view{
41
- --height: 100%;
42
- }
43
-
44
- }
1
+ @use "../style/variable" as variable;
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
+ &-cancel{
23
+ color: variable.$trionesColorTextSecondary;
24
+ }
25
+ &-ok{
26
+ color: variable.$trionesColorPrimary;
27
+ }
28
+ }
29
+
30
+ &-title {
31
+ }
32
+ }
33
+
34
+ &-body {
35
+ flex: 1 1;
36
+ width: 100%;
37
+ height: 100%;
38
+ pointer-events: unset;
39
+ }
40
+ &-view{
41
+ --height: 100%;
42
+ }
43
+
44
+ }
@@ -1,72 +1,72 @@
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
+ $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
+ }
@@ -4,8 +4,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
4
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
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
6
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
- /**
8
- * compact: true
7
+ /**
8
+ * compact: true
9
9
  */
10
10
  import { DemoBlock } from "../../DemoBlock";
11
11
  import React from 'react';
@@ -1,129 +1,129 @@
1
- @use "../style/variable" as variable;
2
-
3
- $trionesPopupCls: 'triones-antm-popup';
4
-
5
- .#{$trionesPopupCls} {
6
- &-overlay {
7
- display: flex;
8
-
9
- .#{$trionesPopupCls} {
10
- &-container {
11
- position: relative;
12
- background-color: white;
13
-
14
- .#{$trionesPopupCls} {
15
- &-header {
16
- padding-block: variable.$trionesPaddingContentVertical;
17
- padding-inline: variable.$trionesPaddingContentHorizontal;
18
- }
19
- }
20
- }
21
-
22
- &-title {
23
- text-align: center;
24
- }
25
-
26
- &-close {
27
- position: absolute;
28
-
29
- &-top-right {
30
- top: variable.$trionesPaddingContentVertical;
31
- right: variable.$trionesPaddingContentHorizontal;
32
- }
33
-
34
- &-top-left {
35
- top: variable.$trionesPaddingContentVertical;
36
- left: variable.$trionesPaddingContentHorizontal;
37
- }
38
- }
39
- }
40
- }
41
-
42
- &-top {
43
- flex-direction: column;
44
- align-items: flex-start;
45
- justify-content: flex-start;
46
-
47
- .#{$trionesPopupCls} {
48
- &-container {
49
- width: 100%;
50
- min-height: 20%;
51
- max-height: 90%;
52
- }
53
-
54
- &-round {
55
- border-bottom-left-radius: variable.$trionesBorderRadius;
56
- border-bottom-right-radius: variable.$trionesBorderRadius;
57
- }
58
- }
59
- }
60
-
61
- &-bottom {
62
- flex-direction: column;
63
- align-items: flex-end;
64
- justify-content: flex-end;
65
-
66
- .#{$trionesPopupCls} {
67
- &-container {
68
- width: 100%;
69
- min-height: 20%;
70
- max-height: 90%;
71
- }
72
-
73
- &-round {
74
- border-top-left-radius: variable.$trionesBorderRadius;
75
- border-top-right-radius: variable.$trionesBorderRadius;
76
- }
77
- }
78
- }
79
-
80
- &-left {
81
- flex-direction: row;
82
- justify-content: flex-start;
83
-
84
- .#{$trionesPopupCls} {
85
- &-container {
86
- height: 100%;
87
- min-width: 20%;
88
- max-width: 90%;
89
- }
90
-
91
- &-round {
92
- border-top-right-radius: variable.$trionesBorderRadius;
93
- border-bottom-right-radius: variable.$trionesBorderRadius;
94
- }
95
- }
96
- }
97
-
98
-
99
- &-right {
100
- flex-direction: row;
101
- justify-content: flex-end;
102
-
103
- .#{$trionesPopupCls} {
104
- &-container {
105
- height: 100%;
106
- min-width: 20%;
107
- max-width: 90%;
108
- }
109
-
110
- &-round {
111
- border-top-left-radius: variable.$trionesBorderRadius;
112
- border-bottom-left-radius: variable.$trionesBorderRadius;
113
- }
114
- }
115
- }
116
-
117
- &-center {
118
- justify-content: center;
119
- align-items: center;
120
-
121
- .#{$trionesPopupCls} {
122
- &-round {
123
- border-radius: variable.$trionesBorderRadius;
124
- }
125
- }
126
- }
127
-
128
-
129
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $trionesPopupCls: 'triones-antm-popup';
4
+
5
+ .#{$trionesPopupCls} {
6
+ &-overlay {
7
+ display: flex;
8
+
9
+ .#{$trionesPopupCls} {
10
+ &-container {
11
+ position: relative;
12
+ background-color: white;
13
+
14
+ .#{$trionesPopupCls} {
15
+ &-header {
16
+ padding-block: variable.$trionesPaddingContentVertical;
17
+ padding-inline: variable.$trionesPaddingContentHorizontal;
18
+ }
19
+ }
20
+ }
21
+
22
+ &-title {
23
+ text-align: center;
24
+ }
25
+
26
+ &-close {
27
+ position: absolute;
28
+
29
+ &-top-right {
30
+ top: variable.$trionesPaddingContentVertical;
31
+ right: variable.$trionesPaddingContentHorizontal;
32
+ }
33
+
34
+ &-top-left {
35
+ top: variable.$trionesPaddingContentVertical;
36
+ left: variable.$trionesPaddingContentHorizontal;
37
+ }
38
+ }
39
+ }
40
+ }
41
+
42
+ &-top {
43
+ flex-direction: column;
44
+ align-items: flex-start;
45
+ justify-content: flex-start;
46
+
47
+ .#{$trionesPopupCls} {
48
+ &-container {
49
+ width: 100%;
50
+ min-height: 20%;
51
+ max-height: 90%;
52
+ }
53
+
54
+ &-round {
55
+ border-bottom-left-radius: variable.$trionesBorderRadius;
56
+ border-bottom-right-radius: variable.$trionesBorderRadius;
57
+ }
58
+ }
59
+ }
60
+
61
+ &-bottom {
62
+ flex-direction: column;
63
+ align-items: flex-end;
64
+ justify-content: flex-end;
65
+
66
+ .#{$trionesPopupCls} {
67
+ &-container {
68
+ width: 100%;
69
+ min-height: 20%;
70
+ max-height: 90%;
71
+ }
72
+
73
+ &-round {
74
+ border-top-left-radius: variable.$trionesBorderRadius;
75
+ border-top-right-radius: variable.$trionesBorderRadius;
76
+ }
77
+ }
78
+ }
79
+
80
+ &-left {
81
+ flex-direction: row;
82
+ justify-content: flex-start;
83
+
84
+ .#{$trionesPopupCls} {
85
+ &-container {
86
+ height: 100%;
87
+ min-width: 20%;
88
+ max-width: 90%;
89
+ }
90
+
91
+ &-round {
92
+ border-top-right-radius: variable.$trionesBorderRadius;
93
+ border-bottom-right-radius: variable.$trionesBorderRadius;
94
+ }
95
+ }
96
+ }
97
+
98
+
99
+ &-right {
100
+ flex-direction: row;
101
+ justify-content: flex-end;
102
+
103
+ .#{$trionesPopupCls} {
104
+ &-container {
105
+ height: 100%;
106
+ min-width: 20%;
107
+ max-width: 90%;
108
+ }
109
+
110
+ &-round {
111
+ border-top-left-radius: variable.$trionesBorderRadius;
112
+ border-bottom-left-radius: variable.$trionesBorderRadius;
113
+ }
114
+ }
115
+ }
116
+
117
+ &-center {
118
+ justify-content: center;
119
+ align-items: center;
120
+
121
+ .#{$trionesPopupCls} {
122
+ &-round {
123
+ border-radius: variable.$trionesBorderRadius;
124
+ }
125
+ }
126
+ }
127
+
128
+
129
+ }
@@ -1,4 +1,4 @@
1
- .blockIndicator {
2
- background-color: #f5f5f5;
3
- border-radius: 2px;
4
- }
1
+ .blockIndicator {
2
+ background-color: #f5f5f5;
3
+ border-radius: 2px;
4
+ }
@@ -1,5 +1,5 @@
1
- /**
2
- * compact: true
1
+ /**
2
+ * compact: true
3
3
  */
4
4
  import { DemoBlock } from "../../DemoBlock";
5
5
  import React from 'react';
@@ -1,18 +1,18 @@
1
- $class-prefix-card: 'card-demo';
2
-
3
- .#{$class-prefix-card} {
4
- &-content {
5
- height: 50px;
6
- }
7
- &-footer {
8
- padding-top: 11px;
9
- border-top: 1px solid #e5e5e5;
10
- display: flex;
11
- justify-content: flex-end;
12
- }
13
-
14
- &-customBody {
15
- color: green;
16
- }
17
-
18
- }
1
+ $class-prefix-card: 'card-demo';
2
+
3
+ .#{$class-prefix-card} {
4
+ &-content {
5
+ height: 50px;
6
+ }
7
+ &-footer {
8
+ padding-top: 11px;
9
+ border-top: 1px solid #e5e5e5;
10
+ display: flex;
11
+ justify-content: flex-end;
12
+ }
13
+
14
+ &-customBody {
15
+ color: green;
16
+ }
17
+
18
+ }
@@ -1,19 +1,19 @@
1
- $trionesScrollViewCls: 'triones-antm-scroll-view';
2
-
3
- .#{$trionesScrollViewCls} {
4
- scrollbar-width: thin;
5
-
6
- &-scroll-x {
7
- overflow-x: auto;
8
- overflow-y: hidden;
9
- }
10
-
11
- &-scroll-y {
12
- overflow-x: hidden;
13
- overflow-y: auto;
14
- }
15
-
16
- &-scroll-bar-hidden {
17
- scrollbar-width: none;
18
- }
19
- }
1
+ $trionesScrollViewCls: 'triones-antm-scroll-view';
2
+
3
+ .#{$trionesScrollViewCls} {
4
+ scrollbar-width: thin;
5
+
6
+ &-scroll-x {
7
+ overflow-x: auto;
8
+ overflow-y: hidden;
9
+ }
10
+
11
+ &-scroll-y {
12
+ overflow-x: hidden;
13
+ overflow-y: auto;
14
+ }
15
+
16
+ &-scroll-bar-hidden {
17
+ scrollbar-width: none;
18
+ }
19
+ }
@@ -70,8 +70,8 @@ var SideBarContent = /*#__PURE__*/memo(function (_ref2) {
70
70
  };
71
71
  }();
72
72
 
73
- /**
74
- * 计算当前页顶部,距离可滚动区域顶部的距离
73
+ /**
74
+ * 计算当前页顶部,距离可滚动区域顶部的距离
75
75
  */
76
76
  var computeReactiveOffsetTop = /*#__PURE__*/function () {
77
77
  var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
@@ -90,8 +90,8 @@ var SideBarContent = /*#__PURE__*/memo(function (_ref2) {
90
90
  };
91
91
  }();
92
92
 
93
- /**
94
- * 计算当前页底部,距离可滚动区域顶部的距离
93
+ /**
94
+ * 计算当前页底部,距离可滚动区域顶部的距离
95
95
  */
96
96
  var computeReactiveOffsetBottom = /*#__PURE__*/function () {
97
97
  var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
@@ -138,8 +138,8 @@ var SideBarContent = /*#__PURE__*/memo(function (_ref2) {
138
138
  }
139
139
  }, [activeKey]);
140
140
 
141
- /**
142
- * 监听滚动变化,只有在人为操作的时候才监听滚动的位置是否需要切换tab,如果是切换tab 引发的滚动则不执行
141
+ /**
142
+ * 监听滚动变化,只有在人为操作的时候才监听滚动的位置是否需要切换tab,如果是切换tab 引发的滚动则不执行
143
143
  */
144
144
  useEffect(function () {
145
145
  // return;