bkui-vue 2.0.1-beta.39.table.2 → 2.0.1-beta.40

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 (49) hide show
  1. package/dist/index.cjs.js +63 -63
  2. package/dist/index.esm.js +15703 -15738
  3. package/dist/index.umd.js +63 -63
  4. package/dist/style.css +1 -1
  5. package/dist/style.variable.css +1 -1
  6. package/lib/index.js +1 -1
  7. package/lib/scrollbar/index.d.ts +13 -133
  8. package/lib/scrollbar/index.js +18490 -1332
  9. package/lib/scrollbar/scrollbar-core/can-use-dom.d.ts +2 -0
  10. package/lib/scrollbar/scrollbar-core/helpers.d.ts +5 -0
  11. package/lib/scrollbar/scrollbar-core/index.d.ts +242 -0
  12. package/lib/scrollbar/scrollbar-core/mouse-wheel.d.ts +5 -0
  13. package/lib/scrollbar/scrollbar-core/scrollbar-width.d.ts +1 -0
  14. package/lib/scrollbar/{css/scrollbar.css → scrollbar.css} +75 -90
  15. package/lib/scrollbar/scrollbar.less +119 -0
  16. package/lib/scrollbar/{css/scrollbar.variable.css → scrollbar.variable.css} +74 -89
  17. package/lib/styles/index.d.ts +0 -1
  18. package/lib/table/hooks/use-columns.d.ts +1 -4
  19. package/lib/table/hooks/use-layout.d.ts +0 -1
  20. package/lib/table/index.js +66 -140
  21. package/lib/table/table.css +115 -108
  22. package/lib/table/table.less +34 -24
  23. package/lib/table/table.variable.css +115 -108
  24. package/lib/table-column/index.js +0 -4
  25. package/lib/tree/tree.css +83 -90
  26. package/lib/tree/tree.variable.css +83 -90
  27. package/lib/virtual-render/index.d.ts +23 -0
  28. package/lib/virtual-render/index.js +106 -54
  29. package/lib/virtual-render/props.d.ts +6 -0
  30. package/lib/virtual-render/use-scrollbar.d.ts +17 -3
  31. package/lib/virtual-render/virtual-render.css +82 -89
  32. package/lib/virtual-render/virtual-render.d.ts +11 -0
  33. package/lib/virtual-render/virtual-render.less +11 -2
  34. package/lib/virtual-render/virtual-render.variable.css +82 -89
  35. package/lib/volar.components.d.ts +2 -0
  36. package/package.json +1 -1
  37. package/lib/scrollbar/css/scrollbar.less +0 -139
  38. package/lib/scrollbar/handlers/click-rail.d.ts +0 -2
  39. package/lib/scrollbar/handlers/drag-thumb.d.ts +0 -1
  40. package/lib/scrollbar/handlers/keyboard.d.ts +0 -2
  41. package/lib/scrollbar/handlers/mouse-wheel.d.ts +0 -2
  42. package/lib/scrollbar/handlers/touch.d.ts +0 -4
  43. package/lib/scrollbar/helper/class-names.d.ts +0 -21
  44. package/lib/scrollbar/helper/css.d.ts +0 -3
  45. package/lib/scrollbar/helper/dom.d.ts +0 -4
  46. package/lib/scrollbar/helper/event-manager.d.ts +0 -20
  47. package/lib/scrollbar/helper/util.d.ts +0 -11
  48. package/lib/scrollbar/process-scroll-diff.d.ts +0 -1
  49. package/lib/scrollbar/update-geometry.d.ts +0 -8
@@ -145,118 +145,111 @@
145
145
  .bk-F-scroll-y::-webkit-scrollbar-thumb {
146
146
  border-radius: 4px;
147
147
  }
148
- .bk-scrollbar {
149
- overflow: hidden !important;
150
- overflow-anchor: none;
151
- touch-action: auto;
152
- /*
153
- * Scrollbar rail styles
154
- */
155
- /*
156
- * Scrollbar thumb styles
157
- */
158
- }
159
- .bk-scrollbar.bk--active-x > .bk__rail-x,
160
- .bk-scrollbar.bk--active-y > .bk__rail-y {
161
- display: block;
148
+ .bk-scrollbar-wrapper {
149
+ position: relative;
150
+ overflow: hidden;
162
151
  }
163
- .bk-scrollbar .bk__rail-x:hover,
164
- .bk-scrollbar .bk__rail-y:hover,
165
- .bk-scrollbar .bk__rail-x:focus,
166
- .bk-scrollbar .bk__rail-y:focus,
167
- .bk-scrollbar .bk__rail-x.bk--clicking,
168
- .bk-scrollbar .bk__rail-y.bk--clicking {
169
- background-color: #f0f1f5;
152
+ .bk-scrollbar-wrapper .bk-scrollbar-content-el {
153
+ display: inline-flex;
154
+ flex-direction: column;
155
+ width: 100%;
170
156
  }
171
- .bk-scrollbar .bk__rail-x {
172
- display: none;
173
- opacity: 0;
174
- transition: background-color 0.2s linear, opacity 0.2s linear;
175
- height: 10px;
176
- bottom: 0px;
157
+ .bk-scrollbar-wrapper .bk-scrollbar-track {
158
+ z-index: 1;
177
159
  position: absolute;
160
+ right: 0;
161
+ bottom: 0;
162
+ pointer-events: none;
163
+ overflow: hidden;
178
164
  }
179
- .bk-scrollbar .bk__rail-x.bk-size-small {
180
- height: 8px;
181
- }
182
- .bk-scrollbar .bk__rail-x.bk-size-small .bk__thumb-x {
183
- height: 6px;
184
- }
185
- .bk-scrollbar .bk__rail-y {
186
- display: none;
187
- opacity: 0;
188
- transition: background-color 0.2s linear, opacity 0.2s linear;
189
- width: 10px;
190
- right: 0px;
191
- position: absolute;
192
- margin-right: 2px;
165
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-vertical {
166
+ width: 6px;
193
167
  }
194
- .bk-scrollbar .bk__rail-y.bk-size-small {
168
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-vertical.bk-scrollbar-hover {
195
169
  width: 8px;
196
170
  }
197
- .bk-scrollbar .bk__rail-y.bk-size-small .bk__thumb-y {
198
- width: 6px;
199
- }
200
- .bk-scrollbar:hover > .bk__rail-x,
201
- .bk-scrollbar:hover > .bk__rail-y,
202
- .bk-scrollbar.bk--focus > .bk__rail-x,
203
- .bk-scrollbar.bk--focus > .bk__rail-y,
204
- .bk-scrollbar.bk--scrolling-x > .bk__rail-x,
205
- .bk-scrollbar.bk--scrolling-y > .bk__rail-y {
206
- opacity: 0.9;
171
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-horizontal {
172
+ height: 6px;
207
173
  }
208
- .bk-scrollbar .bk__thumb-x {
209
- background-color: #dcdee5;
210
- border-radius: 8px;
211
- transition: background-color 0.2s linear, height 0.2s ease-in-out;
174
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-horizontal.bk-scrollbar-hover {
212
175
  height: 8px;
213
- bottom: 0px;
214
- position: absolute;
215
176
  }
216
- .bk-scrollbar .bk__thumb-y {
217
- background-color: #dcdee5;
218
- border-radius: 8px;
219
- transition: background-color 0.2s linear, width 0.2s ease-in-out;
220
- width: 8px;
221
- right: 0px;
222
- position: absolute;
177
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-hover {
178
+ background-color: #f0f1f5;
179
+ cursor: pointer;
223
180
  }
224
- .bk-scrollbar .bk__rail-x:hover > .bk__thumb-x,
225
- .bk-scrollbar .bk__rail-x:focus > .bk__thumb-x,
226
- .bk-scrollbar .bk__rail-x.bk--clicking .bk__thumb-x {
181
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-hover .bk-scrollbar::before {
227
182
  background-color: #979ba5;
228
- height: 10px;
229
183
  }
230
- .bk-scrollbar .bk__rail-y:hover > .bk__thumb-y,
231
- .bk-scrollbar .bk__rail-y:focus > .bk__thumb-y,
232
- .bk-scrollbar .bk__rail-y.bk--clicking .bk__thumb-y {
233
- background-color: #979ba5;
184
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-vertical {
185
+ top: 0;
186
+ width: 8px;
187
+ transform: translate(var(--scroll-offset-x), var(--scroll-offset-y));
188
+ }
189
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-vertical.bk-scrollbar-hover {
234
190
  width: 10px;
235
191
  }
236
- .bk-scrollbar .bk-size-small > .bk__thumb-x,
237
- .bk-scrollbar .bk-size-small > .bk__thumb-x,
238
- .bk-scrollbar .bk-size-small.bk--clicking .bk__thumb-x {
192
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal {
193
+ left: 0;
239
194
  height: 8px;
195
+ transform: translate(var(--scroll-offset-x), var(--scroll-offset-y));
240
196
  }
241
- .bk-scrollbar .bk-size-small:hover > .bk__thumb-y,
242
- .bk-scrollbar .bk-size-small:focus > .bk__thumb-y,
243
- .bk-scrollbar .bk-size-small.bk--clicking .bk__thumb-y {
244
- width: 8px;
197
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal.bk-scrollbar-hover {
198
+ height: 10px;
245
199
  }
246
- /* MS supports */
247
- @supports (-ms-overflow-style: none) {
248
- .bk-scrollbar {
249
- overflow: auto !important;
250
- }
200
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal.bk-scrollbar {
201
+ right: auto;
202
+ left: 0;
203
+ top: 0;
204
+ bottom: 0;
205
+ min-height: 0;
206
+ min-width: 8px;
207
+ width: auto;
251
208
  }
252
- @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
253
- .bk-scrollbar {
254
- overflow: auto !important;
255
- }
209
+ .bk-scrollbar-wrapper .bk-scrollbar-dragging {
210
+ pointer-events: none;
211
+ -webkit-touch-callout: none;
212
+ -webkit-user-select: none;
213
+ -khtml-user-select: none;
214
+ -moz-user-select: none;
215
+ -ms-user-select: none;
216
+ user-select: none;
217
+ }
218
+ .bk-scrollbar-wrapper .bk-scrollbar {
219
+ position: absolute;
220
+ left: 0;
221
+ right: 0;
222
+ top: 0;
223
+ bottom: 0;
224
+ }
225
+ .bk-scrollbar-wrapper .bk-scrollbar::before {
226
+ position: absolute;
227
+ content: '';
228
+ background: #dcdee5;
229
+ border-radius: 6px;
230
+ left: 0;
231
+ right: 0;
232
+ top: 0;
233
+ bottom: 0;
234
+ opacity: 0;
235
+ transition: opacity 0.2s 0.9s linear;
236
+ }
237
+ .bk-scrollbar-wrapper .bk-scrollbar.bk-scrollbar-visible::before {
238
+ opacity: 0.9;
239
+ transition-delay: 0s;
240
+ transition-duration: 0s;
256
241
  }
257
242
  .bk-virtual-render {
258
243
  position: relative;
259
244
  }
245
+ .bk-virtual-render .bk-virtual-content {
246
+ position: absolute;
247
+ top: 0;
248
+ bottom: 0;
249
+ left: 0;
250
+ width: 100%;
251
+ height: 100%;
252
+ }
260
253
  .bk-virtual-render .bk-virtual-section {
261
254
  width: 1px;
262
255
  background: transparent;
@@ -94,6 +94,11 @@ declare const _default: import("vue").DefineComponent<{
94
94
  } & {
95
95
  default: string;
96
96
  };
97
+ contentAs: import("vue-types").VueTypeValidableDef<string> & {
98
+ default: string;
99
+ } & {
100
+ default: string;
101
+ };
97
102
  scrollOffsetTop: import("vue-types").VueTypeValidableDef<number> & {
98
103
  default: number;
99
104
  } & {
@@ -228,6 +233,11 @@ declare const _default: import("vue").DefineComponent<{
228
233
  } & {
229
234
  default: string;
230
235
  };
236
+ contentAs: import("vue-types").VueTypeValidableDef<string> & {
237
+ default: string;
238
+ } & {
239
+ default: string;
240
+ };
231
241
  scrollOffsetTop: import("vue-types").VueTypeValidableDef<number> & {
232
242
  default: number;
233
243
  } & {
@@ -295,6 +305,7 @@ declare const _default: import("vue").DefineComponent<{
295
305
  groupItemCount: number;
296
306
  preloadItemCount: number;
297
307
  renderAs: string;
308
+ contentAs: string;
298
309
  scrollOffsetTop: number;
299
310
  scrollPosition: string;
300
311
  abosuteHeight: string | number;
@@ -1,12 +1,21 @@
1
1
  @import '../styles/themes/themes.less';
2
2
  @import '../styles/mixins/scroll.less';
3
- @import '../scrollbar/css/scrollbar.less';
3
+ @import '../scrollbar/scrollbar.less';
4
4
 
5
5
  .@{bk-prefix}-virtual-render {
6
6
  position: relative;
7
7
 
8
+ .@{bk-prefix}-virtual-content {
9
+ position: absolute;
10
+ top: 0;
11
+ bottom: 0;
12
+ left: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ }
16
+
8
17
  .@{bk-prefix}-virtual-section {
9
18
  width: 1px;
10
19
  background: transparent;
11
20
  }
12
- }
21
+ }
@@ -535,118 +535,111 @@
535
535
  .bk-F-scroll-y::-webkit-scrollbar-thumb {
536
536
  border-radius: 4px;
537
537
  }
538
- .bk-scrollbar {
539
- overflow: hidden !important;
540
- overflow-anchor: none;
541
- touch-action: auto;
542
- /*
543
- * Scrollbar rail styles
544
- */
545
- /*
546
- * Scrollbar thumb styles
547
- */
548
- }
549
- .bk-scrollbar.bk--active-x > .bk__rail-x,
550
- .bk-scrollbar.bk--active-y > .bk__rail-y {
551
- display: block;
538
+ .bk-scrollbar-wrapper {
539
+ position: relative;
540
+ overflow: hidden;
552
541
  }
553
- .bk-scrollbar .bk__rail-x:hover,
554
- .bk-scrollbar .bk__rail-y:hover,
555
- .bk-scrollbar .bk__rail-x:focus,
556
- .bk-scrollbar .bk__rail-y:focus,
557
- .bk-scrollbar .bk__rail-x.bk--clicking,
558
- .bk-scrollbar .bk__rail-y.bk--clicking {
559
- background-color: #f0f1f5;
542
+ .bk-scrollbar-wrapper .bk-scrollbar-content-el {
543
+ display: inline-flex;
544
+ flex-direction: column;
545
+ width: 100%;
560
546
  }
561
- .bk-scrollbar .bk__rail-x {
562
- display: none;
563
- opacity: 0;
564
- transition: background-color 0.2s linear, opacity 0.2s linear;
565
- height: 10px;
566
- bottom: 0px;
547
+ .bk-scrollbar-wrapper .bk-scrollbar-track {
548
+ z-index: 1;
567
549
  position: absolute;
550
+ right: 0;
551
+ bottom: 0;
552
+ pointer-events: none;
553
+ overflow: hidden;
568
554
  }
569
- .bk-scrollbar .bk__rail-x.bk-size-small {
570
- height: 8px;
571
- }
572
- .bk-scrollbar .bk__rail-x.bk-size-small .bk__thumb-x {
573
- height: 6px;
574
- }
575
- .bk-scrollbar .bk__rail-y {
576
- display: none;
577
- opacity: 0;
578
- transition: background-color 0.2s linear, opacity 0.2s linear;
579
- width: 10px;
580
- right: 0px;
581
- position: absolute;
582
- margin-right: 2px;
555
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-vertical {
556
+ width: 6px;
583
557
  }
584
- .bk-scrollbar .bk__rail-y.bk-size-small {
558
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-vertical.bk-scrollbar-hover {
585
559
  width: 8px;
586
560
  }
587
- .bk-scrollbar .bk__rail-y.bk-size-small .bk__thumb-y {
588
- width: 6px;
589
- }
590
- .bk-scrollbar:hover > .bk__rail-x,
591
- .bk-scrollbar:hover > .bk__rail-y,
592
- .bk-scrollbar.bk--focus > .bk__rail-x,
593
- .bk-scrollbar.bk--focus > .bk__rail-y,
594
- .bk-scrollbar.bk--scrolling-x > .bk__rail-x,
595
- .bk-scrollbar.bk--scrolling-y > .bk__rail-y {
596
- opacity: 0.9;
561
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-horizontal {
562
+ height: 6px;
597
563
  }
598
- .bk-scrollbar .bk__thumb-x {
599
- background-color: #dcdee5;
600
- border-radius: 8px;
601
- transition: background-color 0.2s linear, height 0.2s ease-in-out;
564
+ .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-horizontal.bk-scrollbar-hover {
602
565
  height: 8px;
603
- bottom: 0px;
604
- position: absolute;
605
566
  }
606
- .bk-scrollbar .bk__thumb-y {
607
- background-color: #dcdee5;
608
- border-radius: 8px;
609
- transition: background-color 0.2s linear, width 0.2s ease-in-out;
610
- width: 8px;
611
- right: 0px;
612
- position: absolute;
567
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-hover {
568
+ background-color: #f0f1f5;
569
+ cursor: pointer;
613
570
  }
614
- .bk-scrollbar .bk__rail-x:hover > .bk__thumb-x,
615
- .bk-scrollbar .bk__rail-x:focus > .bk__thumb-x,
616
- .bk-scrollbar .bk__rail-x.bk--clicking .bk__thumb-x {
571
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-hover .bk-scrollbar::before {
617
572
  background-color: #979ba5;
618
- height: 10px;
619
573
  }
620
- .bk-scrollbar .bk__rail-y:hover > .bk__thumb-y,
621
- .bk-scrollbar .bk__rail-y:focus > .bk__thumb-y,
622
- .bk-scrollbar .bk__rail-y.bk--clicking .bk__thumb-y {
623
- background-color: #979ba5;
574
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-vertical {
575
+ top: 0;
576
+ width: 8px;
577
+ transform: translate(var(--scroll-offset-x), var(--scroll-offset-y));
578
+ }
579
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-vertical.bk-scrollbar-hover {
624
580
  width: 10px;
625
581
  }
626
- .bk-scrollbar .bk-size-small > .bk__thumb-x,
627
- .bk-scrollbar .bk-size-small > .bk__thumb-x,
628
- .bk-scrollbar .bk-size-small.bk--clicking .bk__thumb-x {
582
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal {
583
+ left: 0;
629
584
  height: 8px;
585
+ transform: translate(var(--scroll-offset-x), var(--scroll-offset-y));
630
586
  }
631
- .bk-scrollbar .bk-size-small:hover > .bk__thumb-y,
632
- .bk-scrollbar .bk-size-small:focus > .bk__thumb-y,
633
- .bk-scrollbar .bk-size-small.bk--clicking .bk__thumb-y {
634
- width: 8px;
587
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal.bk-scrollbar-hover {
588
+ height: 10px;
635
589
  }
636
- /* MS supports */
637
- @supports (-ms-overflow-style: none) {
638
- .bk-scrollbar {
639
- overflow: auto !important;
640
- }
590
+ .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal.bk-scrollbar {
591
+ right: auto;
592
+ left: 0;
593
+ top: 0;
594
+ bottom: 0;
595
+ min-height: 0;
596
+ min-width: 8px;
597
+ width: auto;
641
598
  }
642
- @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
643
- .bk-scrollbar {
644
- overflow: auto !important;
645
- }
599
+ .bk-scrollbar-wrapper .bk-scrollbar-dragging {
600
+ pointer-events: none;
601
+ -webkit-touch-callout: none;
602
+ -webkit-user-select: none;
603
+ -khtml-user-select: none;
604
+ -moz-user-select: none;
605
+ -ms-user-select: none;
606
+ user-select: none;
607
+ }
608
+ .bk-scrollbar-wrapper .bk-scrollbar {
609
+ position: absolute;
610
+ left: 0;
611
+ right: 0;
612
+ top: 0;
613
+ bottom: 0;
614
+ }
615
+ .bk-scrollbar-wrapper .bk-scrollbar::before {
616
+ position: absolute;
617
+ content: '';
618
+ background: #dcdee5;
619
+ border-radius: 6px;
620
+ left: 0;
621
+ right: 0;
622
+ top: 0;
623
+ bottom: 0;
624
+ opacity: 0;
625
+ transition: opacity 0.2s 0.9s linear;
626
+ }
627
+ .bk-scrollbar-wrapper .bk-scrollbar.bk-scrollbar-visible::before {
628
+ opacity: 0.9;
629
+ transition-delay: 0s;
630
+ transition-duration: 0s;
646
631
  }
647
632
  .bk-virtual-render {
648
633
  position: relative;
649
634
  }
635
+ .bk-virtual-render .bk-virtual-content {
636
+ position: absolute;
637
+ top: 0;
638
+ bottom: 0;
639
+ left: 0;
640
+ width: 100%;
641
+ height: 100%;
642
+ }
650
643
  .bk-virtual-render .bk-virtual-section {
651
644
  width: 1px;
652
645
  background: transparent;
@@ -71,6 +71,8 @@ declare module '@vue/runtime-core' {
71
71
  BkSteps: typeof import('./steps/steps').default;
72
72
  BkSwitcher: typeof import('./switcher/switcher').default;
73
73
  BkTable: typeof import('./table/table').default;
74
+ BkTableColumn: typeof import('./table/components/table-column').default;
75
+ BkCollapse: typeof import('./collapse/collapse').default;
74
76
  BkTag: typeof import('./tag/tag').default;
75
77
  BkTagInput: typeof import('./tag-input/tag-input').default;
76
78
  BkDivider: typeof import('./divider/divider').default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bkui-vue",
3
- "version": "2.0.1-beta.39.table.2",
3
+ "version": "2.0.1-beta.40",
4
4
  "workspaces": [
5
5
  "packages/**",
6
6
  "scripts/cli",
@@ -1,139 +0,0 @@
1
- @import '../../styles/themes/themes.less';
2
-
3
- .@{bk-prefix}-scrollbar {
4
- overflow: hidden !important;
5
- overflow-anchor: none;
6
- touch-action: auto;
7
-
8
- &.@{bk-prefix}--active-x > .@{bk-prefix}__rail-x,
9
- &.@{bk-prefix}--active-y > .@{bk-prefix}__rail-y {
10
- display: block;
11
- }
12
-
13
- .@{bk-prefix}__rail-x:hover,
14
- .@{bk-prefix}__rail-y:hover,
15
- .@{bk-prefix}__rail-x:focus,
16
- .@{bk-prefix}__rail-y:focus,
17
- .@{bk-prefix}__rail-x.@{bk-prefix}--clicking,
18
- .@{bk-prefix}__rail-y.@{bk-prefix}--clicking {
19
- background-color: #f0f1f5;
20
- }
21
-
22
- /*
23
- * Scrollbar rail styles
24
- */
25
- .@{bk-prefix}__rail-x {
26
- display: none;
27
- opacity: 0;
28
- transition:
29
- background-color 0.2s linear,
30
- opacity 0.2s linear;
31
- height: 10px;
32
- bottom: 0px;
33
- position: absolute;
34
- // margin-bottom: 2px;
35
-
36
- &.@{bk-prefix}-size-small {
37
- height: 8px;
38
-
39
- .@{bk-prefix}__thumb-x {
40
- height: 6px;
41
- }
42
- }
43
- }
44
-
45
- .@{bk-prefix}__rail-y {
46
- display: none;
47
- opacity: 0;
48
- transition:
49
- background-color 0.2s linear,
50
- opacity 0.2s linear;
51
- width: 10px;
52
- right: 0px;
53
- position: absolute;
54
- margin-right: 2px;
55
-
56
- &.@{bk-prefix}-size-small {
57
- width: 8px;
58
-
59
- .@{bk-prefix}__thumb-y {
60
- width: 6px;
61
- }
62
- }
63
- }
64
-
65
- &:hover > .@{bk-prefix}__rail-x,
66
- &:hover > .@{bk-prefix}__rail-y,
67
- &.@{bk-prefix}--focus > .@{bk-prefix}__rail-x,
68
- &.@{bk-prefix}--focus > .@{bk-prefix}__rail-y,
69
- &.@{bk-prefix}--scrolling-x > .@{bk-prefix}__rail-x,
70
- &.@{bk-prefix}--scrolling-y > .@{bk-prefix}__rail-y {
71
- opacity: 0.9;
72
- }
73
-
74
- /*
75
- * Scrollbar thumb styles
76
- */
77
- .@{bk-prefix}__thumb-x {
78
- background-color: #dcdee5;
79
- border-radius: 8px;
80
- transition:
81
- background-color 0.2s linear,
82
- height 0.2s ease-in-out;
83
- height: 8px;
84
- bottom: 0px;
85
- position: absolute;
86
- }
87
-
88
- .@{bk-prefix}__thumb-y {
89
- background-color: #dcdee5;
90
- border-radius: 8px;
91
- transition:
92
- background-color 0.2s linear,
93
- width 0.2s ease-in-out;
94
- width: 8px;
95
- right: 0px;
96
- position: absolute;
97
- }
98
-
99
- .@{bk-prefix}__rail-x:hover > .@{bk-prefix}__thumb-x,
100
- .@{bk-prefix}__rail-x:focus > .@{bk-prefix}__thumb-x,
101
- .@{bk-prefix}__rail-x.@{bk-prefix}--clicking .@{bk-prefix}__thumb-x {
102
- background-color: #979ba5;
103
- height: 10px;
104
- }
105
-
106
- .@{bk-prefix}__rail-y:hover > .@{bk-prefix}__thumb-y,
107
- .@{bk-prefix}__rail-y:focus > .@{bk-prefix}__thumb-y,
108
- .@{bk-prefix}__rail-y.@{bk-prefix}--clicking .@{bk-prefix}__thumb-y {
109
- background-color: #979ba5;
110
- width: 10px;
111
- }
112
-
113
- .@{bk-prefix}-size-small {
114
- > .@{bk-prefix}__thumb-x,
115
- > .@{bk-prefix}__thumb-x,
116
- &.@{bk-prefix}--clicking .@{bk-prefix}__thumb-x {
117
- height: 8px;
118
- }
119
-
120
- &:hover > .@{bk-prefix}__thumb-y,
121
- &:focus > .@{bk-prefix}__thumb-y,
122
- &.@{bk-prefix}--clicking .@{bk-prefix}__thumb-y {
123
- width: 8px;
124
- }
125
- }
126
- }
127
-
128
- /* MS supports */
129
- @supports (-ms-overflow-style: none) {
130
- .@{bk-prefix}-scrollbar {
131
- overflow: auto !important;
132
- }
133
- }
134
-
135
- @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
136
- .@{bk-prefix}-scrollbar {
137
- overflow: auto !important;
138
- }
139
- }
@@ -1,2 +0,0 @@
1
- import BkScrollbar from '..';
2
- export default function (i: BkScrollbar): void;
@@ -1 +0,0 @@
1
- export default function (i: any): void;
@@ -1,2 +0,0 @@
1
- import BkScrollbar from '..';
2
- export default function (i: BkScrollbar): void;
@@ -1,2 +0,0 @@
1
- import BkScrollbar from '..';
2
- export default function (i: BkScrollbar): void;
@@ -1,4 +0,0 @@
1
- import BkScrollbar from '..';
2
- export default function (i: BkScrollbar & {
3
- isInitialized: boolean;
4
- }): void;
@@ -1,21 +0,0 @@
1
- declare class Cls {
2
- main: string;
3
- rtl: string;
4
- element: {
5
- thumb: (x: string) => string;
6
- rail: (x: string) => string;
7
- size: (size: string) => string;
8
- consuming: string;
9
- };
10
- state: {
11
- focus: string;
12
- clicking: string;
13
- active: (x: string) => string;
14
- scrolling: (x: string) => string;
15
- };
16
- constructor(prefix?: string);
17
- }
18
- export default Cls;
19
- export declare function addScrollingClass(i: any, x: any): void;
20
- export declare function removeScrollingClass(i: any, x: any): void;
21
- export declare function setScrollingClassInstantly(i: any, x: any): void;
@@ -1,3 +0,0 @@
1
- import { VirtualElement } from '..';
2
- export declare function get(element: Partial<Element> | Partial<VirtualElement>): CSSStyleDeclaration;
3
- export declare function set(element: any, obj: any): any;
@@ -1,4 +0,0 @@
1
- export declare function div(className: any): HTMLDivElement;
2
- export declare function matches(el: any, query: any): boolean;
3
- export declare function remove(el: any): void;
4
- export declare function queryChildren(element: any, selector: any): any[];