@esportsplus/ui 0.13.3 → 0.13.5

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 @@ export default (data, content) => {
10
10
  });
11
11
  return html `
12
12
  <div
13
+ class='scrollbar-container'
13
14
  onscroll='${function () {
14
15
  if (width === undefined) {
15
16
  width = this.offsetWidth - this.clientWidth;
@@ -22,7 +23,9 @@ export default (data, content) => {
22
23
  }}'
23
24
  ${omit(data, ['scrollbar'])}
24
25
  >
25
- ${content}
26
+ <div class="scrollbar-container-content">
27
+ ${content}
28
+ </div>
26
29
 
27
30
  <div
28
31
  class='
@@ -1,2 +1,2 @@
1
- @layer components {.scrollbar{--background:transparent;--height:0;--translate:translate3d(0,0,0);--width:4px}::-webkit-scrollbar{box-shadow:unset;background:0 0}::-webkit-scrollbar-track{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb:window-inactive{box-shadow:unset;background:0 0}.scrollbar{z-index:9;height:100%}.scrollbar,.scrollbar:before{transition:opacity var(--transition-duration)ease-in-out;width:var(--width);position:absolute;top:0;right:0}.scrollbar:before{background:var(--background);content:"";height:var(--height);transform:var(--translate);transform-origin:top;border-radius:1px 0 0 1px}.scrollbar--fixed{position:fixed}.scrollbar--hidden{opacity:0}.scrollbar-container{flex-flow:column;display:flex;position:relative;overflow:hidden}.scrollbar-content{height:100%;margin-right:calc(var(--scrollbar-width)*-1);scrollbar-gutter:stable;scroll-behavior:smooth;width:calc(100% + var(--scrollbar-width));overflow:hidden scroll}.scrollbar-content--snap{scroll-snap-type:both mandatory;overscroll-behavior-x:contain;overflow:auto}.scrollbar-content--snap>*{scroll-snap-stop:normal;scroll-snap-align:center}}
1
+ @layer components {.scrollbar{--background:transparent;--height:0;--translate:translate3d(0,0,0);--width:4px}::-webkit-scrollbar{box-shadow:unset;background:0 0}::-webkit-scrollbar-track{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb:window-inactive{box-shadow:unset;background:0 0}.scrollbar{z-index:9;height:100%}.scrollbar,.scrollbar:before{transition:opacity var(--transition-duration)ease-in-out;width:var(--width);position:absolute;top:0;right:0}.scrollbar:before{background:var(--background);content:"";height:var(--height);transform:var(--translate);transform-origin:top;border-radius:1px 0 0 1px}.scrollbar--fixed{position:fixed}.scrollbar--hidden{opacity:0}.scrollbar-container{flex-flow:column;display:flex;position:relative;overflow:hidden}.scrollbar-container-content{height:100%;margin-right:calc(var(--scrollbar-width)*-1);scrollbar-gutter:stable;scroll-behavior:smooth;width:calc(100% + var(--scrollbar-width));overflow:hidden scroll}.scrollbar-container-content--snap{scroll-snap-type:both mandatory;overscroll-behavior-x:contain;overflow:auto}.scrollbar-container-content--snap>*{scroll-snap-stop:normal;scroll-snap-align:center}}
2
2
  /*$vite$:1*/
package/package.json CHANGED
@@ -47,7 +47,7 @@
47
47
  "private": false,
48
48
  "sideEffects": false,
49
49
  "type": "module",
50
- "version": "0.13.3",
50
+ "version": "0.13.5",
51
51
  "scripts": {
52
52
  "build": "run-s build:vite build:ts",
53
53
  "build:ts": "tsc && tsc-alias",
@@ -17,6 +17,7 @@ export default (data: Record<string, unknown> & { scrollbar?: Record<string, unk
17
17
 
18
18
  return html`
19
19
  <div
20
+ class='scrollbar-container'
20
21
  onscroll='${function(this: HTMLElement) {
21
22
  if (width === undefined) {
22
23
  width = this.offsetWidth - this.clientWidth;
@@ -31,7 +32,9 @@ export default (data: Record<string, unknown> & { scrollbar?: Record<string, unk
31
32
  }}'
32
33
  ${omit(data, ['scrollbar'])}
33
34
  >
34
- ${content}
35
+ <div class="scrollbar-container-content">
36
+ ${content}
37
+ </div>
35
38
 
36
39
  <div
37
40
  class='
@@ -47,25 +47,25 @@
47
47
  flex-flow: column;
48
48
  overflow: hidden;
49
49
  position: relative;
50
- }
51
50
 
52
- &-content {
53
- height: 100%;
54
- margin-right: calc(var(--scrollbar-width) * -1);
55
- overflow-x: hidden;
56
- overflow-y: scroll;
57
- scrollbar-gutter: stable;
58
- scroll-behavior: smooth;
59
- width: calc(100% + var(--scrollbar-width));
51
+ &-content {
52
+ height: 100%;
53
+ margin-right: calc(var(--scrollbar-width) * -1);
54
+ overflow-x: hidden;
55
+ overflow-y: scroll;
56
+ scrollbar-gutter: stable;
57
+ scroll-behavior: smooth;
58
+ width: calc(100% + var(--scrollbar-width));
60
59
 
61
- &--snap {
62
- overflow: auto;
63
- scroll-snap-type: both mandatory;
64
- overscroll-behavior-x: contain;
60
+ &--snap {
61
+ overflow: auto;
62
+ scroll-snap-type: both mandatory;
63
+ overscroll-behavior-x: contain;
65
64
 
66
- > * {
67
- scroll-snap-stop: normal;
68
- scroll-snap-align: center;
65
+ > * {
66
+ scroll-snap-stop: normal;
67
+ scroll-snap-align: center;
68
+ }
69
69
  }
70
70
  }
71
71
  }