@jiaozhiye/qm-design-react 1.9.20 → 1.9.21

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.
@@ -10,6 +10,7 @@ type IProps = {
10
10
  wrapClassName?: string;
11
11
  wrapStyle?: CSSProperties;
12
12
  barWidth?: number;
13
+ showTopScrollbar?: boolean;
13
14
  always?: boolean;
14
15
  minSize?: number;
15
16
  native?: boolean;
@@ -7,6 +7,7 @@ export type IThumbOption = {
7
7
  type IProps = {
8
8
  thumb: IThumbOption;
9
9
  direction?: 'horizontal' | 'vertical';
10
+ className?: string;
10
11
  barSize?: number;
11
12
  always?: boolean;
12
13
  onDrag?: (value: boolean) => void;
@@ -1,72 +1,76 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2023-06-04 09:42:40
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2023-06-05 16:47:52
6
- */
7
- @import '../../style/common';
8
-
9
- @prefix-scrollbar: ~'@{qm-prefix}-scrollbar';
10
-
11
- .@{prefix-scrollbar} {
12
- position: relative;
13
- &__wrap {
14
- display: grid;
15
- height: 100%;
16
- overflow: auto;
17
- &--hidden {
18
- scrollbar-width: none;
19
- &::-webkit-scrollbar {
20
- display: none;
21
- }
22
- }
23
- }
24
- &__view {
25
- display: block;
26
- }
27
- &__bar {
28
- position: absolute;
29
- right: 2px;
30
- bottom: 2px;
31
- z-index: 2;
32
- border-radius: 4px;
33
- &.is-vertical {
34
- width: 6px;
35
- top: 2px;
36
- & > div {
37
- width: 100%;
38
- }
39
- }
40
- &.is-horizontal {
41
- height: 6px;
42
- left: 2px;
43
- & > div {
44
- height: 100%;
45
- }
46
- }
47
- // fade-transition
48
- &.fade {
49
- transition: all 0.3s ease;
50
- }
51
- &.fade.preEnter,
52
- &.fade.exiting {
53
- opacity: 0;
54
- }
55
- &.fade.exited {
56
- display: none;
57
- }
58
- }
59
- &__thumb {
60
- position: relative;
61
- display: block;
62
- width: 0;
63
- height: 0;
64
- cursor: pointer;
65
- border-radius: inherit;
66
- background-color: #909090;
67
- opacity: 0.3;
68
- &:hover {
69
- opacity: 0.5;
70
- }
71
- }
72
- }
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2023-06-04 09:42:40
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2023-06-05 16:47:52
6
+ */
7
+ @import '../../style/common';
8
+
9
+ @prefix-scrollbar: ~'@{qm-prefix}-scrollbar';
10
+
11
+ .@{prefix-scrollbar} {
12
+ position: relative;
13
+ &__wrap {
14
+ display: grid;
15
+ height: 100%;
16
+ overflow: auto;
17
+ &--hidden {
18
+ scrollbar-width: none;
19
+ &::-webkit-scrollbar {
20
+ display: none;
21
+ }
22
+ }
23
+ }
24
+ &__view {
25
+ display: block;
26
+ }
27
+ &__bar {
28
+ position: absolute;
29
+ right: 2px;
30
+ bottom: 2px;
31
+ z-index: 2;
32
+ border-radius: 4px;
33
+ &.is-vertical {
34
+ width: 6px;
35
+ top: 2px;
36
+ & > div {
37
+ width: 100%;
38
+ }
39
+ }
40
+ &.is-horizontal {
41
+ height: 6px;
42
+ left: 2px;
43
+ &.top {
44
+ top: 2px;
45
+ bottom: auto;
46
+ }
47
+ & > div {
48
+ height: 100%;
49
+ }
50
+ }
51
+ // fade-transition
52
+ &.fade {
53
+ transition: all 0.3s ease;
54
+ }
55
+ &.fade.preEnter,
56
+ &.fade.exiting {
57
+ opacity: 0;
58
+ }
59
+ &.fade.exited {
60
+ display: none;
61
+ }
62
+ }
63
+ &__thumb {
64
+ position: relative;
65
+ display: block;
66
+ width: 0;
67
+ height: 0;
68
+ cursor: pointer;
69
+ border-radius: inherit;
70
+ background-color: #909090;
71
+ opacity: 0.3;
72
+ &:hover {
73
+ opacity: 0.5;
74
+ }
75
+ }
76
+ }
@@ -27516,6 +27516,10 @@ table {
27516
27516
  height: 6px;
27517
27517
  left: 2px;
27518
27518
  }
27519
+ .qm-scrollbar__bar.is-horizontal.top {
27520
+ top: 2px;
27521
+ bottom: auto;
27522
+ }
27519
27523
  .qm-scrollbar__bar.is-horizontal > div {
27520
27524
  height: 100%;
27521
27525
  }