@trionesdev/antd-mobile-react 0.0.2-beta.22 → 0.0.2-beta.24

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/FetchPicker/styles.scss +118 -118
  27. package/dist/FloatButton/style.scss +123 -123
  28. package/dist/Footer/demo/base.js +2 -2
  29. package/dist/Form/style.scss +106 -106
  30. package/dist/Grid/demo/base.js +2 -2
  31. package/dist/Grid/demo/base.scss +7 -7
  32. package/dist/Icon/demo/base.js +2 -2
  33. package/dist/Image/demo/base.js +2 -2
  34. package/dist/Image/demo/base.scss +4 -4
  35. package/dist/Image/style.scss +30 -30
  36. package/dist/ImagesPreview/style.scss +34 -34
  37. package/dist/ImagesWall/style.scss +70 -70
  38. package/dist/Input/demo/base.js +2 -2
  39. package/dist/Input/index.scss +240 -240
  40. package/dist/NavBar/demo/base.scss +5 -5
  41. package/dist/NoticeBar/demo/base.js +2 -2
  42. package/dist/Overlay/style.scss +20 -20
  43. package/dist/PageIndicator/demo/base.js +2 -2
  44. package/dist/Picker/style.scss +44 -44
  45. package/dist/PickerView/style.scss +72 -72
  46. package/dist/Popup/demo/base.js +2 -2
  47. package/dist/Popup/style.scss +129 -129
  48. package/dist/Radio/demo/base.scss +4 -4
  49. package/dist/Result/demo/base.js +2 -2
  50. package/dist/SafeArea/demo/base.scss +18 -18
  51. package/dist/ScrollView/style.scss +19 -19
  52. package/dist/SideBar/side-bar.js +6 -6
  53. package/dist/SideBar/style.scss +85 -85
  54. package/dist/Space/demo/base.js +2 -2
  55. package/dist/Swiper/style.scss +54 -54
  56. package/dist/Switch/demo/base.js +2 -2
  57. package/dist/TabBar/demo/base.js +2 -2
  58. package/dist/Tag/demo/base.js +2 -2
  59. package/dist/Tag/demo/style.scss +8 -8
  60. package/dist/Toast/style.scss +63 -63
  61. package/dist/VerificationCodeInput/style.scss +20 -20
  62. package/dist/WaterMark/demo/demo1.js +2 -2
  63. package/dist/WaterMark/demo/demo1.scss +6 -6
  64. package/dist/WaterMark/demo/demo2.js +2 -2
  65. package/dist/style/variable.scss +1 -1
  66. package/dist/utils/type.js +36 -36
  67. package/dist/utils/with-default-props.js +4 -4
  68. package/package.json +26 -23
  69. package/readme.md +43 -43
@@ -1,85 +1,85 @@
1
- @use "../style/variable" as variable;
2
-
3
- $calendarCls: 'triones-antm-calendar';
4
-
5
- .#{$calendarCls}-grid {
6
- //display: flex;
7
- //flex-wrap: wrap;
8
- display: grid;
9
- grid-template-columns: repeat(7, 1fr);
10
- }
11
-
12
- .#{$calendarCls}-cell {
13
- aspect-ratio: 1;
14
- display: flex;
15
- justify-content: center;
16
- align-items: center;
17
- border-radius: variable.$trionesBorderRadius;
18
- cursor: default;
19
- flex-direction: column;
20
-
21
- &-date {
22
- display: flex;
23
- width: 100%;
24
- justify-content: center;
25
- align-items: center;
26
- }
27
-
28
- &-mouth {
29
- display: flex;
30
- width: 100%;
31
- justify-content: center;
32
- align-items: center;
33
- font-size: 8Px;
34
- }
35
-
36
- &.#{$calendarCls}-cell {
37
- &-disabled {
38
- color: #999999;
39
- }
40
-
41
- &-selected {
42
- background-color: variable.$trionesColorPrimary;
43
- color: white;
44
- }
45
-
46
- &-selected-range {
47
- border-radius: 0;
48
- background-color: variable.$trionesColorPrimaryBg;
49
- color: black;
50
- }
51
- }
52
- }
53
-
54
- .#{$calendarCls} {
55
- &-header {
56
- display: flex;
57
- justify-content: space-between;
58
- align-items: center;
59
-
60
- &-title {
61
- font-size: 16Px;
62
- padding: 8Px;
63
- text-align: center;
64
- }
65
-
66
- &-button {
67
- padding-left: 12Px;
68
- padding-right: 12Px;
69
- cursor: pointer;
70
- }
71
- }
72
-
73
- &-week {
74
- display: grid;
75
- grid-template-columns: repeat(7, 1fr);
76
-
77
- &-cell {
78
- display: flex;
79
- justify-content: center;
80
- align-items: center;
81
- padding-top: 8Px;
82
- padding-bottom: 8Px;
83
- }
84
- }
85
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $calendarCls: 'triones-antm-calendar';
4
+
5
+ .#{$calendarCls}-grid {
6
+ //display: flex;
7
+ //flex-wrap: wrap;
8
+ display: grid;
9
+ grid-template-columns: repeat(7, 1fr);
10
+ }
11
+
12
+ .#{$calendarCls}-cell {
13
+ aspect-ratio: 1;
14
+ display: flex;
15
+ justify-content: center;
16
+ align-items: center;
17
+ border-radius: variable.$trionesBorderRadius;
18
+ cursor: default;
19
+ flex-direction: column;
20
+
21
+ &-date {
22
+ display: flex;
23
+ width: 100%;
24
+ justify-content: center;
25
+ align-items: center;
26
+ }
27
+
28
+ &-mouth {
29
+ display: flex;
30
+ width: 100%;
31
+ justify-content: center;
32
+ align-items: center;
33
+ font-size: 8Px;
34
+ }
35
+
36
+ &.#{$calendarCls}-cell {
37
+ &-disabled {
38
+ color: #999999;
39
+ }
40
+
41
+ &-selected {
42
+ background-color: variable.$trionesColorPrimary;
43
+ color: white;
44
+ }
45
+
46
+ &-selected-range {
47
+ border-radius: 0;
48
+ background-color: variable.$trionesColorPrimaryBg;
49
+ color: black;
50
+ }
51
+ }
52
+ }
53
+
54
+ .#{$calendarCls} {
55
+ &-header {
56
+ display: flex;
57
+ justify-content: space-between;
58
+ align-items: center;
59
+
60
+ &-title {
61
+ font-size: 16Px;
62
+ padding: 8Px;
63
+ text-align: center;
64
+ }
65
+
66
+ &-button {
67
+ padding-left: 12Px;
68
+ padding-right: 12Px;
69
+ cursor: pointer;
70
+ }
71
+ }
72
+
73
+ &-week {
74
+ display: grid;
75
+ grid-template-columns: repeat(7, 1fr);
76
+
77
+ &-cell {
78
+ display: flex;
79
+ justify-content: center;
80
+ align-items: center;
81
+ padding-top: 8Px;
82
+ padding-bottom: 8Px;
83
+ }
84
+ }
85
+ }
@@ -18,8 +18,8 @@ import { RandomUtils } from "../utils/random-utils";
18
18
  import classNames from "classnames";
19
19
  import dayjs from "dayjs";
20
20
  var monthLines = 6;
21
- /**
22
- * 可以手势滑动的日历组件
21
+ /**
22
+ * 可以手势滑动的日历组件
23
23
  */
24
24
  export var TouchableCalendarGrid = /*#__PURE__*/memo(function (_ref) {
25
25
  var _wrapperRef$current3;
@@ -62,8 +62,8 @@ export var TouchableCalendarGrid = /*#__PURE__*/memo(function (_ref) {
62
62
  months = _useState10[0],
63
63
  setMonths = _useState10[1];
64
64
 
65
- /**
66
- * 计算出每个格子的大小
65
+ /**
66
+ * 计算出每个格子的大小
67
67
  */
68
68
  var cellSize = /*#__PURE__*/function () {
69
69
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
@@ -82,8 +82,8 @@ export var TouchableCalendarGrid = /*#__PURE__*/memo(function (_ref) {
82
82
  return _ref2.apply(this, arguments);
83
83
  };
84
84
  }();
85
- /**
86
- * 计算出最大的translateY,默认为wrapperRef.current?.clientHeight
85
+ /**
86
+ * 计算出最大的translateY,默认为wrapperRef.current?.clientHeight
87
87
  */
88
88
  var minTranslateY = /*#__PURE__*/function () {
89
89
  var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
@@ -103,9 +103,9 @@ export var TouchableCalendarGrid = /*#__PURE__*/memo(function (_ref) {
103
103
  };
104
104
  }();
105
105
 
106
- /**
107
- * 计算出该月的行数
108
- * @param mouth
106
+ /**
107
+ * 计算出该月的行数
108
+ * @param mouth
109
109
  */
110
110
  // const mouthLines = (mouth: Date) => {
111
111
  // const firstDate = new Date(mouth.getFullYear(), mouth.getMonth(), 1);
@@ -1,54 +1,54 @@
1
- @use "../style/variable" as variable;
2
-
3
- $calendarDatetimePopupCls: 'triones-antm-calendar-datetime-popup';
4
-
5
- .#{$calendarDatetimePopupCls} {
6
- border-top-left-radius: variable.$trionesBorderRadius;
7
- border-top-right-radius: variable.$trionesBorderRadius;
8
-
9
- &-header {
10
- display: flex;
11
- justify-content: space-between;
12
- border-bottom: 1Px solid variable.$trionesBorderColor;
13
-
14
-
15
- &-display {
16
- display: flex;
17
- padding-left: 8Px;
18
-
19
- &-date {
20
- padding-inline: 8Px;
21
- cursor: default;
22
- display: flex;
23
- align-items: center;
24
- }
25
-
26
- &-time {
27
- padding-inline: 12Px;
28
- display: flex;
29
- align-items: center;
30
- cursor: default;
31
- }
32
-
33
- &-active {
34
- color: variable.$trionesColorText;
35
- font-weight: bold;
36
- background-color: variable.$trionesColorBgTextActive;
37
- }
38
- }
39
-
40
- &-button {
41
- padding: 12Px 16Px;
42
-
43
- &-cancel {
44
- }
45
-
46
- &-ok {
47
- color: variable.$trionesColorPrimary;
48
- }
49
- }
50
- }
51
- &-body {
52
-
53
- }
54
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $calendarDatetimePopupCls: 'triones-antm-calendar-datetime-popup';
4
+
5
+ .#{$calendarDatetimePopupCls} {
6
+ border-top-left-radius: variable.$trionesBorderRadius;
7
+ border-top-right-radius: variable.$trionesBorderRadius;
8
+
9
+ &-header {
10
+ display: flex;
11
+ justify-content: space-between;
12
+ border-bottom: 1Px solid variable.$trionesBorderColor;
13
+
14
+
15
+ &-display {
16
+ display: flex;
17
+ padding-left: 8Px;
18
+
19
+ &-date {
20
+ padding-inline: 8Px;
21
+ cursor: default;
22
+ display: flex;
23
+ align-items: center;
24
+ }
25
+
26
+ &-time {
27
+ padding-inline: 12Px;
28
+ display: flex;
29
+ align-items: center;
30
+ cursor: default;
31
+ }
32
+
33
+ &-active {
34
+ color: variable.$trionesColorText;
35
+ font-weight: bold;
36
+ background-color: variable.$trionesColorBgTextActive;
37
+ }
38
+ }
39
+
40
+ &-button {
41
+ padding: 12Px 16Px;
42
+
43
+ &-cancel {
44
+ }
45
+
46
+ &-ok {
47
+ color: variable.$trionesColorPrimary;
48
+ }
49
+ }
50
+ }
51
+ &-body {
52
+
53
+ }
54
+ }
@@ -1,10 +1,10 @@
1
- @use "../style/variable" as variable;
2
- $calendarDatetimePickerCls: 'triones-antm-calendar-datetime-picker';
3
-
4
- .#{$calendarDatetimePickerCls}{
5
- min-width: 50Px;
6
- line-height: 1.4;
7
- &-placeholder{
8
- color: variable.$trionesColorTextPlaceholder;
9
- }
10
- }
1
+ @use "../style/variable" as variable;
2
+ $calendarDatetimePickerCls: 'triones-antm-calendar-datetime-picker';
3
+
4
+ .#{$calendarDatetimePickerCls}{
5
+ min-width: 50Px;
6
+ line-height: 1.4;
7
+ &-placeholder{
8
+ color: variable.$trionesColorTextPlaceholder;
9
+ }
10
+ }
@@ -1,31 +1,31 @@
1
- @use "../style/variable" as variable;
2
-
3
- $calendarPickerCls: 'triones-antm-calendar-picker';
4
-
5
- .#{$calendarPickerCls} {
6
- border-top-left-radius: variable.$trionesBorderRadius;
7
- border-top-right-radius: variable.$trionesBorderRadius;
8
-
9
- &-header {
10
- display: flex;
11
- justify-content: space-between;
12
- border-bottom: 1Px solid variable.$trionesBorderColor;
13
- padding: 4Px;
14
- &-button {
15
- padding: 8Px 12Px;
16
-
17
- &-cancel {
18
- }
19
-
20
- &-ok {
21
- color: variable.$trionesColorPrimary;
22
- }
23
- }
24
-
25
-
26
- }
27
-
28
- &-body {
29
- pointer-events: unset;
30
- }
31
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $calendarPickerCls: 'triones-antm-calendar-picker';
4
+
5
+ .#{$calendarPickerCls} {
6
+ border-top-left-radius: variable.$trionesBorderRadius;
7
+ border-top-right-radius: variable.$trionesBorderRadius;
8
+
9
+ &-header {
10
+ display: flex;
11
+ justify-content: space-between;
12
+ border-bottom: 1Px solid variable.$trionesBorderColor;
13
+ padding: 4Px;
14
+ &-button {
15
+ padding: 8Px 12Px;
16
+
17
+ &-cancel {
18
+ }
19
+
20
+ &-ok {
21
+ color: variable.$trionesColorPrimary;
22
+ }
23
+ }
24
+
25
+
26
+ }
27
+
28
+ &-body {
29
+ pointer-events: unset;
30
+ }
31
+ }
@@ -1,5 +1,5 @@
1
- /**
2
- * compact: true
1
+ /**
2
+ * compact: true
3
3
  */
4
4
  import classNames from 'classnames';
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,45 +1,45 @@
1
- @use "../style/variable" as variable;
2
- $cascaderPickerCls: 'triones-antm-cascader-picker';
3
-
4
- .#{$cascaderPickerCls} {
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 variable.$trionesBorderColor;
17
- padding: 4Px;
18
-
19
- &-button {
20
-
21
- padding: 8Px;
22
- font-size: 12Px;
23
- &-cancel{
24
- color: variable.$trionesColorTextSecondary;
25
- }
26
- &-ok{
27
- color: variable.$trionesColorPrimary;
28
- }
29
- }
30
-
31
- &-title {
32
- }
33
- }
34
-
35
- &-body {
36
- flex: 1 1;
37
- width: 100%;
38
- pointer-events: unset;
39
- overflow: hidden;
40
- }
41
- &-view{
42
- --height: 100%;
43
- }
44
-
45
- }
1
+ @use "../style/variable" as variable;
2
+ $cascaderPickerCls: 'triones-antm-cascader-picker';
3
+
4
+ .#{$cascaderPickerCls} {
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 variable.$trionesBorderColor;
17
+ padding: 4Px;
18
+
19
+ &-button {
20
+
21
+ padding: 8Px;
22
+ font-size: 12Px;
23
+ &-cancel{
24
+ color: variable.$trionesColorTextSecondary;
25
+ }
26
+ &-ok{
27
+ color: variable.$trionesColorPrimary;
28
+ }
29
+ }
30
+
31
+ &-title {
32
+ }
33
+ }
34
+
35
+ &-body {
36
+ flex: 1 1;
37
+ width: 100%;
38
+ pointer-events: unset;
39
+ overflow: hidden;
40
+ }
41
+ &-view{
42
+ --height: 100%;
43
+ }
44
+
45
+ }
@@ -1,24 +1,24 @@
1
- @use "../style/variable" as variable;
2
- $cascaderPickerCls: 'triones-antm-cascader-picker';
3
-
4
- .#{$cascaderPickerCls}{
5
- width: 100%;
6
- line-height: 1.4;
7
- display: flex;
8
-
9
- &-left {
10
- justify-content: flex-start;
11
- }
12
-
13
- &-center {
14
- justify-content: center;
15
- }
16
-
17
- &-right {
18
- justify-content: flex-end;
19
- }
20
-
21
- &-placeholder{
22
- color: variable.$trionesColorTextPlaceholder;
23
- }
24
- }
1
+ @use "../style/variable" as variable;
2
+ $cascaderPickerCls: 'triones-antm-cascader-picker';
3
+
4
+ .#{$cascaderPickerCls}{
5
+ width: 100%;
6
+ line-height: 1.4;
7
+ display: flex;
8
+
9
+ &-left {
10
+ justify-content: flex-start;
11
+ }
12
+
13
+ &-center {
14
+ justify-content: center;
15
+ }
16
+
17
+ &-right {
18
+ justify-content: flex-end;
19
+ }
20
+
21
+ &-placeholder{
22
+ color: variable.$trionesColorTextPlaceholder;
23
+ }
24
+ }
@@ -1,5 +1,5 @@
1
- /**
2
- * compact: true
1
+ /**
2
+ * compact: true
3
3
  */
4
4
  import React from 'react';
5
5
  import { DemoBlock } from "../../DemoBlock";
@@ -1,5 +1,5 @@
1
- /**
2
- * compact: true
1
+ /**
2
+ * compact: true
3
3
  */
4
4
  import React from 'react';
5
5
  import { DemoBlock } from "../../DemoBlock";
@@ -1,20 +1,20 @@
1
- .demoBlock {
2
- font-size: 14px;
3
- margin-bottom: 12px;
4
- &:last-of-type {
5
- padding-bottom: 32px;
6
- }
7
- scrollbar-width: thin;
8
- }
9
-
10
- .demoTitle {
11
- padding: 12px 12px 8px;
12
- color: #697b8c;
13
- font-size: 14px;
14
- background: #fafbfc;
15
- }
16
-
17
- .demoMain {
18
- border-right: none;
19
- border-left: none;
20
- }
1
+ .demoBlock {
2
+ font-size: 14px;
3
+ margin-bottom: 12px;
4
+ &:last-of-type {
5
+ padding-bottom: 32px;
6
+ }
7
+ scrollbar-width: thin;
8
+ }
9
+
10
+ .demoTitle {
11
+ padding: 12px 12px 8px;
12
+ color: #697b8c;
13
+ font-size: 14px;
14
+ background: #fafbfc;
15
+ }
16
+
17
+ .demoMain {
18
+ border-right: none;
19
+ border-left: none;
20
+ }
@@ -1,3 +1,3 @@
1
- .demoDescription {
2
- color: var(--triones-antm-color-weak);
3
- }
1
+ .demoDescription {
2
+ color: var(--triones-antm-color-weak);
3
+ }
@@ -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,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';