@autobest-ui/components 1.1.2 → 1.1.9

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 (126) hide show
  1. package/README.md +10 -10
  2. package/esm/accordion/__stories__/style.scss +58 -58
  3. package/esm/affix/__stories__/style.scss +13 -13
  4. package/esm/affix/style/index.scss +34 -34
  5. package/esm/base.scss +42 -42
  6. package/esm/carousel/__stories__/style.scss +41 -41
  7. package/esm/carousel/style/index.scss +37 -37
  8. package/esm/checkbox/style/index.scss +117 -117
  9. package/esm/collapse/__stories__/style.scss +18 -18
  10. package/esm/collapse/style/index.scss +42 -42
  11. package/esm/confirm/style/index.scss +44 -44
  12. package/esm/date-picker/calendar/grid/index.scss +85 -85
  13. package/esm/date-picker/calendar/index.scss +57 -57
  14. package/esm/date-picker/index.d.ts +1 -0
  15. package/esm/date-picker/index.js +17 -7
  16. package/esm/date-picker/style/index.css +1 -1
  17. package/esm/date-picker/style/index.scss +23 -19
  18. package/esm/drawer/style/index.scss +44 -44
  19. package/esm/ellipsis/style/index.scss +35 -35
  20. package/esm/guide/__stories__/style.scss +13 -13
  21. package/esm/guide/style/index.scss +17 -17
  22. package/esm/icon/__stories__/style.scss +39 -39
  23. package/esm/icon/style/index.scss +6 -6
  24. package/esm/index.d.ts +2 -1
  25. package/esm/input-number/index.d.ts +30 -17
  26. package/esm/input-number/index.js +116 -36
  27. package/esm/input-number/style/index.scss +86 -86
  28. package/esm/lazy-image/__stories__/style.scss +9 -9
  29. package/esm/lazy-image/style/index.scss +24 -24
  30. package/esm/link-list/style/index.scss +125 -125
  31. package/esm/loading/style/index.scss +30 -30
  32. package/esm/loading-bar/style/index.scss +62 -62
  33. package/esm/loading-container/__stories__/style.scss +5 -5
  34. package/esm/loading-container/style/index.scss +27 -27
  35. package/esm/loading-icon/style/index.scss +23 -23
  36. package/esm/mask/style/index.scss +34 -34
  37. package/esm/message/style/index.scss +70 -70
  38. package/esm/modal/style/index.scss +112 -112
  39. package/esm/move/__stories__/style.scss +6 -6
  40. package/esm/move/style/index.scss +7 -7
  41. package/esm/popover/__stories__/style.scss +15 -15
  42. package/esm/popover/style/index.scss +59 -59
  43. package/esm/select/__stories__/style.scss +8 -8
  44. package/esm/select/style/index.scss +126 -126
  45. package/esm/show-more/style/index.scss +22 -22
  46. package/esm/skeleton/__stories__/style.scss +2 -2
  47. package/esm/skeleton/style/index.scss +26 -26
  48. package/esm/style.css +16 -16
  49. package/esm/table/__stories__/style.scss +33 -33
  50. package/esm/table/body/BodyRow.d.ts +9 -3
  51. package/esm/table/body/BodyRow.js +6 -2
  52. package/esm/table/body/index.d.ts +2 -2
  53. package/esm/table/body/index.js +8 -7
  54. package/esm/table/header/HeaderCell.d.ts +2 -2
  55. package/esm/table/header/HeaderRow.d.ts +2 -2
  56. package/esm/table/index.d.ts +4 -4
  57. package/esm/table/index.js +3 -3
  58. package/esm/table/interface.d.ts +9 -3
  59. package/esm/table/style/index.scss +51 -51
  60. package/esm/tabs/__stories__/style.scss +8 -8
  61. package/esm/tabs/style/index.scss +62 -62
  62. package/esm/tooltip/style/index.scss +61 -61
  63. package/esm/trigger/style/index.scss +79 -79
  64. package/lib/accordion/__stories__/style.scss +58 -58
  65. package/lib/affix/__stories__/style.scss +13 -13
  66. package/lib/affix/style/index.scss +34 -34
  67. package/lib/base.scss +42 -42
  68. package/lib/carousel/__stories__/style.scss +41 -41
  69. package/lib/carousel/style/index.scss +37 -37
  70. package/lib/checkbox/style/index.scss +117 -117
  71. package/lib/collapse/__stories__/style.scss +18 -18
  72. package/lib/collapse/style/index.scss +42 -42
  73. package/lib/confirm/style/index.scss +44 -44
  74. package/lib/date-picker/calendar/grid/index.scss +85 -85
  75. package/lib/date-picker/calendar/index.scss +57 -57
  76. package/lib/date-picker/index.d.ts +1 -0
  77. package/lib/date-picker/index.js +17 -7
  78. package/lib/date-picker/style/index.css +1 -1
  79. package/lib/date-picker/style/index.scss +23 -19
  80. package/lib/drawer/style/index.scss +44 -44
  81. package/lib/ellipsis/style/index.scss +35 -35
  82. package/lib/guide/__stories__/style.scss +13 -13
  83. package/lib/guide/style/index.scss +17 -17
  84. package/lib/icon/__stories__/style.scss +39 -39
  85. package/lib/icon/style/index.scss +6 -6
  86. package/lib/index.d.ts +2 -1
  87. package/lib/input-number/index.d.ts +30 -17
  88. package/lib/input-number/index.js +116 -36
  89. package/lib/input-number/style/index.scss +86 -86
  90. package/lib/lazy-image/__stories__/style.scss +9 -9
  91. package/lib/lazy-image/style/index.scss +24 -24
  92. package/lib/link-list/style/index.scss +125 -125
  93. package/lib/loading/style/index.scss +30 -30
  94. package/lib/loading-bar/style/index.scss +62 -62
  95. package/lib/loading-container/__stories__/style.scss +5 -5
  96. package/lib/loading-container/style/index.scss +27 -27
  97. package/lib/loading-icon/style/index.scss +23 -23
  98. package/lib/mask/style/index.scss +34 -34
  99. package/lib/message/style/index.scss +70 -70
  100. package/lib/modal/style/index.scss +112 -112
  101. package/lib/move/__stories__/style.scss +6 -6
  102. package/lib/move/style/index.scss +7 -7
  103. package/lib/popover/__stories__/style.scss +15 -15
  104. package/lib/popover/style/index.scss +59 -59
  105. package/lib/select/__stories__/style.scss +8 -8
  106. package/lib/select/style/index.scss +126 -126
  107. package/lib/show-more/style/index.scss +22 -22
  108. package/lib/skeleton/__stories__/style.scss +2 -2
  109. package/lib/skeleton/style/index.scss +26 -26
  110. package/lib/style.css +16 -16
  111. package/lib/table/__stories__/style.scss +33 -33
  112. package/lib/table/body/BodyRow.d.ts +9 -3
  113. package/lib/table/body/BodyRow.js +6 -2
  114. package/lib/table/body/index.d.ts +2 -2
  115. package/lib/table/body/index.js +8 -7
  116. package/lib/table/header/HeaderCell.d.ts +2 -2
  117. package/lib/table/header/HeaderRow.d.ts +2 -2
  118. package/lib/table/index.d.ts +4 -4
  119. package/lib/table/index.js +3 -3
  120. package/lib/table/interface.d.ts +9 -3
  121. package/lib/table/style/index.scss +51 -51
  122. package/lib/tabs/__stories__/style.scss +8 -8
  123. package/lib/tabs/style/index.scss +62 -62
  124. package/lib/tooltip/style/index.scss +61 -61
  125. package/lib/trigger/style/index.scss +79 -79
  126. package/package.json +2 -2
@@ -1,118 +1,118 @@
1
- $namespace: ab-checkbox;
2
-
3
- .#{$namespace} {
4
- display: inline-block;
5
- position: relative;
6
- font-size: 0;
7
- cursor: pointer;
8
-
9
- &-input {
10
- position: absolute;
11
- opacity: 0;
12
- margin: 0;
13
- padding: 0;
14
- width: 100%;
15
- height: 100%;
16
- cursor: pointer;
17
- z-index: 2;
18
- }
19
-
20
- &-inner {
21
- display: inline-block;
22
- position: relative;
23
- width: .16rem;
24
- height: .16rem;
25
- transition: all .3s;
26
- border: .02rem solid #B0B0B0;
27
- border-radius: .02rem;
28
- background-color: #fff;
29
- }
30
-
31
- &-icon {
32
- visibility: hidden;
33
- position: absolute;
34
- width: .06rem;
35
- height: .1rem;
36
- left: 20%;
37
- top: 40%;
38
- transform: rotate(45deg) scale(0) translate(-50%, -50%);
39
- transition: all .2s;
40
- border: .02rem solid #E84040;
41
- border-top: none;
42
- border-left: none;
43
- }
44
-
45
- &.#{$namespace}-checked {
46
- .#{$namespace} {
47
- &-icon {
48
- visibility: visible;
49
- transform: rotate(45deg) scale(1) translate(-50%, -50%);
50
- }
51
- }
52
- }
53
-
54
- &.#{$namespace}-disabled {
55
- cursor: not-allowed;
56
- color: rgba(0, 0, 0, .25);
57
-
58
- .#{$namespace} {
59
- &-inner {
60
- border-color: #f0f0f0 !important;
61
- background-color: #f5f5f5 !important;
62
- }
63
-
64
- &-icon {
65
- border-color: #cecece;
66
- }
67
-
68
- &-content {
69
- text-decoration: none !important;
70
- }
71
- }
72
- }
73
-
74
- &-wrap {
75
- display: inline-block;
76
- position: relative;
77
- cursor: pointer;
78
-
79
- .#{$namespace} {
80
- position: absolute;
81
- transform: translateY(-50%);
82
- top: 50%;
83
- left: 0;
84
- }
85
-
86
- &:hover {
87
- .#{$namespace}-content {
88
- text-decoration: underline;
89
- }
90
- }
91
- }
92
-
93
- &-content {
94
- padding-left: .24rem;
95
- display: inline-block;
96
- }
97
-
98
- &-wrap.#{$namespace}-reverse {
99
- .#{$namespace} {
100
- left: auto;
101
- right: 0;
102
-
103
- &-content {
104
- padding-left: 0;
105
- padding-right: .24rem;
106
- }
107
- }
108
- }
109
-
110
- &-wrap.#{$namespace}-disabled {
111
- cursor: not-allowed;
112
- color: rgba(0, 0, 0, .25);
113
-
114
- .#{$namespace}-content {
115
- text-decoration: none !important;
116
- }
117
- }
1
+ $namespace: ab-checkbox;
2
+
3
+ .#{$namespace} {
4
+ display: inline-block;
5
+ position: relative;
6
+ font-size: 0;
7
+ cursor: pointer;
8
+
9
+ &-input {
10
+ position: absolute;
11
+ opacity: 0;
12
+ margin: 0;
13
+ padding: 0;
14
+ width: 100%;
15
+ height: 100%;
16
+ cursor: pointer;
17
+ z-index: 2;
18
+ }
19
+
20
+ &-inner {
21
+ display: inline-block;
22
+ position: relative;
23
+ width: .16rem;
24
+ height: .16rem;
25
+ transition: all .3s;
26
+ border: .02rem solid #B0B0B0;
27
+ border-radius: .02rem;
28
+ background-color: #fff;
29
+ }
30
+
31
+ &-icon {
32
+ visibility: hidden;
33
+ position: absolute;
34
+ width: .06rem;
35
+ height: .1rem;
36
+ left: 20%;
37
+ top: 40%;
38
+ transform: rotate(45deg) scale(0) translate(-50%, -50%);
39
+ transition: all .2s;
40
+ border: .02rem solid #E84040;
41
+ border-top: none;
42
+ border-left: none;
43
+ }
44
+
45
+ &.#{$namespace}-checked {
46
+ .#{$namespace} {
47
+ &-icon {
48
+ visibility: visible;
49
+ transform: rotate(45deg) scale(1) translate(-50%, -50%);
50
+ }
51
+ }
52
+ }
53
+
54
+ &.#{$namespace}-disabled {
55
+ cursor: not-allowed;
56
+ color: rgba(0, 0, 0, .25);
57
+
58
+ .#{$namespace} {
59
+ &-inner {
60
+ border-color: #f0f0f0 !important;
61
+ background-color: #f5f5f5 !important;
62
+ }
63
+
64
+ &-icon {
65
+ border-color: #cecece;
66
+ }
67
+
68
+ &-content {
69
+ text-decoration: none !important;
70
+ }
71
+ }
72
+ }
73
+
74
+ &-wrap {
75
+ display: inline-block;
76
+ position: relative;
77
+ cursor: pointer;
78
+
79
+ .#{$namespace} {
80
+ position: absolute;
81
+ transform: translateY(-50%);
82
+ top: 50%;
83
+ left: 0;
84
+ }
85
+
86
+ &:hover {
87
+ .#{$namespace}-content {
88
+ text-decoration: underline;
89
+ }
90
+ }
91
+ }
92
+
93
+ &-content {
94
+ padding-left: .24rem;
95
+ display: inline-block;
96
+ }
97
+
98
+ &-wrap.#{$namespace}-reverse {
99
+ .#{$namespace} {
100
+ left: auto;
101
+ right: 0;
102
+
103
+ &-content {
104
+ padding-left: 0;
105
+ padding-right: .24rem;
106
+ }
107
+ }
108
+ }
109
+
110
+ &-wrap.#{$namespace}-disabled {
111
+ cursor: not-allowed;
112
+ color: rgba(0, 0, 0, .25);
113
+
114
+ .#{$namespace}-content {
115
+ text-decoration: none !important;
116
+ }
117
+ }
118
118
  }
@@ -1,19 +1,19 @@
1
- .demo-collapse{
2
- min-height: 200px;
3
- padding: 0.2rem;
4
- }
5
-
6
- .title-wrap {
7
- width: 1rem;
8
- height: .4rem;
9
- background-color: #3B82F6;
10
- color: #F3F4F6;
11
-
12
- > strong {
13
- display: block;
14
- width: 1rem;
15
- height: .2rem;
16
- background-color: #10B981;
17
- cursor: pointer;
18
- }
1
+ .demo-collapse{
2
+ min-height: 200px;
3
+ padding: 0.2rem;
4
+ }
5
+
6
+ .title-wrap {
7
+ width: 1rem;
8
+ height: .4rem;
9
+ background-color: #3B82F6;
10
+ color: #F3F4F6;
11
+
12
+ > strong {
13
+ display: block;
14
+ width: 1rem;
15
+ height: .2rem;
16
+ background-color: #10B981;
17
+ cursor: pointer;
18
+ }
19
19
  }
@@ -1,43 +1,43 @@
1
- $namespace: ab-collapse;
2
- $collapseFade: #{$namespace}-fade;
3
-
4
- .#{$namespace} {
5
- transform-origin: left top;
6
- transition: opacity 200ms, height 200ms;
7
- &-hidden{
8
- height: 0;
9
- overflow: hidden;
10
- }
11
- }
12
-
13
- .#{$collapseFade} {
14
- &-enter {
15
- opacity: 0.8;
16
- overflow: hidden;
17
- }
18
-
19
- &-enter-active {
20
- opacity: 1;
21
- overflow: hidden;
22
- }
23
-
24
- &-enter-done {
25
- opacity: 1;
26
- overflow: initial;
27
- }
28
-
29
- &-exit {
30
- opacity: 1;
31
- overflow: hidden;
32
- }
33
-
34
- &-exit-active {
35
- opacity: 0.8;
36
- overflow: hidden;
37
- }
38
-
39
- &-exit-done {
40
- display: none;
41
- overflow: initial;
42
- }
1
+ $namespace: ab-collapse;
2
+ $collapseFade: #{$namespace}-fade;
3
+
4
+ .#{$namespace} {
5
+ transform-origin: left top;
6
+ transition: opacity 200ms, height 200ms;
7
+ &-hidden{
8
+ height: 0;
9
+ overflow: hidden;
10
+ }
11
+ }
12
+
13
+ .#{$collapseFade} {
14
+ &-enter {
15
+ opacity: 0.8;
16
+ overflow: hidden;
17
+ }
18
+
19
+ &-enter-active {
20
+ opacity: 1;
21
+ overflow: hidden;
22
+ }
23
+
24
+ &-enter-done {
25
+ opacity: 1;
26
+ overflow: initial;
27
+ }
28
+
29
+ &-exit {
30
+ opacity: 1;
31
+ overflow: hidden;
32
+ }
33
+
34
+ &-exit-active {
35
+ opacity: 0.8;
36
+ overflow: hidden;
37
+ }
38
+
39
+ &-exit-done {
40
+ display: none;
41
+ overflow: initial;
42
+ }
43
43
  }
@@ -1,44 +1,44 @@
1
- $namespace: ab-confirm;
2
-
3
- .#{$namespace} {
4
- &-btns {
5
- display: flex;
6
- justify-content: flex-end;
7
- padding-top: .42rem;
8
- }
9
-
10
- &-ok, &-cancel {
11
- overflow: hidden;
12
- position: relative;
13
- font-size: .12rem;
14
- border-width: 1px;
15
- border-style: solid;
16
- outline: none;
17
- cursor: pointer;
18
- font-weight: bold;
19
- padding: .05rem .3rem;
20
- display: inline-block;
21
- color: #fff;
22
- margin-left: .3rem;
23
- }
24
-
25
- &-ok {
26
- border-color: #bc0000;
27
- background: linear-gradient(180deg, #c00000 0%, #c00000 0%, #a00000 100%, #a00000 100%);
28
-
29
- &:hover {
30
- border-color: #bc0000;
31
- background: #bc0000;
32
- }
33
- }
34
-
35
- &-cancel {
36
- border-color: #808080;
37
- background: linear-gradient(180deg, #909090 0%, #909090 0%, #707070 100%, #707070 100%);
38
-
39
- &:hover {
40
- border-color: #808080;
41
- background: #808080;
42
- }
43
- }
44
- }
1
+ $namespace: ab-confirm;
2
+
3
+ .#{$namespace} {
4
+ &-btns {
5
+ display: flex;
6
+ justify-content: flex-end;
7
+ padding-top: .42rem;
8
+ }
9
+
10
+ &-ok, &-cancel {
11
+ overflow: hidden;
12
+ position: relative;
13
+ font-size: .12rem;
14
+ border-width: 1px;
15
+ border-style: solid;
16
+ outline: none;
17
+ cursor: pointer;
18
+ font-weight: bold;
19
+ padding: .05rem .3rem;
20
+ display: inline-block;
21
+ color: #fff;
22
+ margin-left: .3rem;
23
+ }
24
+
25
+ &-ok {
26
+ border-color: #bc0000;
27
+ background: linear-gradient(180deg, #c00000 0%, #c00000 0%, #a00000 100%, #a00000 100%);
28
+
29
+ &:hover {
30
+ border-color: #bc0000;
31
+ background: #bc0000;
32
+ }
33
+ }
34
+
35
+ &-cancel {
36
+ border-color: #808080;
37
+ background: linear-gradient(180deg, #909090 0%, #909090 0%, #707070 100%, #707070 100%);
38
+
39
+ &:hover {
40
+ border-color: #808080;
41
+ background: #808080;
42
+ }
43
+ }
44
+ }
@@ -1,86 +1,86 @@
1
- $namespace: ab-dp-cg;
2
-
3
- .#{$namespace} {
4
- &-title, &-head, &-content {
5
- display: flex;
6
- align-items: center;
7
- }
8
-
9
- &-title {
10
- user-select: none;
11
- font-size: .14rem;
12
- padding-bottom: .08rem;
13
-
14
- > strong {
15
- flex: 1 1;
16
- margin-left: .1rem;
17
- cursor: default;
18
- color: #4A4A4A;
19
-
20
- &.#{$namespace}-clickable {
21
- cursor: pointer;
22
-
23
- &:hover {
24
- color: #000;
25
- }
26
- }
27
- }
28
- }
29
-
30
- &-icon, &-dis-icon {
31
- align-self: flex-end;
32
- margin-left: .08rem;
33
- }
34
-
35
- &-icon {
36
- cursor: pointer;
37
- }
38
-
39
- &-head {
40
- padding-bottom: .05rem;
41
-
42
- > li {
43
- display: flex;
44
- align-items: center;
45
- justify-content: center;
46
- cursor: default;
47
- }
48
- }
49
-
50
- &-content {
51
- flex-wrap: wrap;
52
-
53
- > li {
54
- cursor: pointer;
55
- display: flex;
56
- align-items: center;
57
- justify-content: center;
58
- color: #000;
59
-
60
- &:hover {
61
- background: #F0F0F0;
62
- }
63
-
64
- &.#{$namespace}-dis {
65
- cursor: not-allowed;
66
- color: #b0b0b0;
67
-
68
- &:hover {
69
- background: none;
70
- }
71
- }
72
-
73
- &:active, &.#{$namespace}-selected {
74
- background: #c7e0f4;
75
- border: 3px solid #C7E0F4;
76
- border-radius: 2px;
77
- color: #000000;
78
- }
79
-
80
- &.#{$namespace}-today {
81
- background: #0078D4;
82
- color: #ffffff;
83
- }
84
- }
85
- }
1
+ $namespace: ab-dp-cg;
2
+
3
+ .#{$namespace} {
4
+ &-title, &-head, &-content {
5
+ display: flex;
6
+ align-items: center;
7
+ }
8
+
9
+ &-title {
10
+ user-select: none;
11
+ font-size: .14rem;
12
+ padding-bottom: .08rem;
13
+
14
+ > strong {
15
+ flex: 1 1;
16
+ margin-left: .1rem;
17
+ cursor: default;
18
+ color: #4A4A4A;
19
+
20
+ &.#{$namespace}-clickable {
21
+ cursor: pointer;
22
+
23
+ &:hover {
24
+ color: #000;
25
+ }
26
+ }
27
+ }
28
+ }
29
+
30
+ &-icon, &-dis-icon {
31
+ align-self: flex-end;
32
+ margin-left: .08rem;
33
+ }
34
+
35
+ &-icon {
36
+ cursor: pointer;
37
+ }
38
+
39
+ &-head {
40
+ padding-bottom: .05rem;
41
+
42
+ > li {
43
+ display: flex;
44
+ align-items: center;
45
+ justify-content: center;
46
+ cursor: default;
47
+ }
48
+ }
49
+
50
+ &-content {
51
+ flex-wrap: wrap;
52
+
53
+ > li {
54
+ cursor: pointer;
55
+ display: flex;
56
+ align-items: center;
57
+ justify-content: center;
58
+ color: #000;
59
+
60
+ &:hover {
61
+ background: #F0F0F0;
62
+ }
63
+
64
+ &.#{$namespace}-dis {
65
+ cursor: not-allowed;
66
+ color: #b0b0b0;
67
+
68
+ &:hover {
69
+ background: none;
70
+ }
71
+ }
72
+
73
+ &:active, &.#{$namespace}-selected {
74
+ background: #c7e0f4;
75
+ border: 3px solid #C7E0F4;
76
+ border-radius: 2px;
77
+ color: #000000;
78
+ }
79
+
80
+ &.#{$namespace}-today {
81
+ background: #0078D4;
82
+ color: #ffffff;
83
+ }
84
+ }
85
+ }
86
86
  }