Skip to content

Commit 8845a16

Browse files
github-actions[bot]github-actions[bot]
committed
chore(prettier): 🤖 ✨
1 parent c99d96a commit 8845a16

14 files changed

+176
-161
lines changed

‎.releaserc.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"extends": "@sanity/semantic-release-preset",
33
"branches": ["main"]
4-
}
4+
}

‎README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@ You can also pass a function to do more dynamic checks to override the scroll sc
103103

104104
```js
105105
const actions = computeScrollIntoView(target, {
106-
boundary: parent => {
106+
boundary: (parent) => {
107107
// By default `overflow: hidden` elements are allowed, only `overflow: visible | clip` is skipped as
108108
// this is required by the CSSOM spec
109109
if (getComputedStyle(parent)['overflow'] === 'hidden') {

‎integration/body.html

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,16 @@
11
<!DOCTYPE html>
2-
<meta charset="utf-8">
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2+
<meta charset="utf-8" />
3+
<meta
4+
name="viewport"
5+
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
6+
/>
47
<script src="../umd/compute-scroll-into-view.min.js"></script>
58
<script src="./utils.js"></script>
69
<style>
7-
*, *:before, *:after {
8-
box-sizing: border-box;
10+
*,
11+
*:before,
12+
*:after {
13+
box-sizing: border-box;
914
}
1015
body {
1116
height: 100vh;

‎integration/deeply_nested_overflow.html

Lines changed: 90 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
<!DOCTYPE html>
2-
<meta charset="utf-8">
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2+
<meta charset="utf-8" />
3+
<meta
4+
name="viewport"
5+
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
6+
/>
47
<script src="../umd/compute-scroll-into-view.min.js"></script>
58
<script src="./utils.js"></script>
69
<style>
7-
html, body {
10+
html,
11+
body {
812
margin: 0;
913
padding: 0;
1014
height: 100vh;
@@ -14,93 +18,93 @@
1418
padding: 0 100vw;
1519
}
1620

17-
.outer-scroll-container,
18-
.inner-scroll-container {
19-
overflow: scroll;
20-
-webkit-box-shadow: 0 0 0 1px hsla(0, 0%, 0%, .1);
21-
box-shadow: 0 0 0 1px hsla(0, 0%, 0%, .1);
22-
}
23-
.outer-scroll-container {
24-
background: #f5f5fb;
25-
margin: 200vh auto;
26-
}
27-
.outer-scroll-container,
28-
.inner-scroll-element {
29-
height: 400px;
30-
width: 400px;
31-
}
32-
.inner-scroll-container {
33-
height: 200px;
34-
width: 200px;
35-
}
21+
.outer-scroll-container,
22+
.inner-scroll-container {
23+
overflow: scroll;
24+
-webkit-box-shadow: 0 0 0 1px hsla(0, 0%, 0%, 0.1);
25+
box-shadow: 0 0 0 1px hsla(0, 0%, 0%, 0.1);
26+
}
27+
.outer-scroll-container {
28+
background: #f5f5fb;
29+
margin: 200vh auto;
30+
}
31+
.outer-scroll-container,
32+
.inner-scroll-element {
33+
height: 400px;
34+
width: 400px;
35+
}
36+
.inner-scroll-container {
37+
height: 200px;
38+
width: 200px;
39+
}
3640

37-
.outer-scroll-element,
38-
.inner-scroll-element {
39-
display: -webkit-box;
40-
display: -ms-flexbox;
41-
display: flex;
42-
-webkit-box-align: center;
43-
-ms-flex-align: center;
44-
align-items: center;
45-
-webkit-box-pack: center;
46-
-ms-flex-pack: center;
47-
justify-content: center;
48-
}
41+
.outer-scroll-element,
42+
.inner-scroll-element {
43+
display: -webkit-box;
44+
display: -ms-flexbox;
45+
display: flex;
46+
-webkit-box-align: center;
47+
-ms-flex-align: center;
48+
align-items: center;
49+
-webkit-box-pack: center;
50+
-ms-flex-pack: center;
51+
justify-content: center;
52+
}
4953

50-
.outer-scroll-element {
51-
height: 800px;
52-
width: 800px;
53-
}
54+
.outer-scroll-element {
55+
height: 800px;
56+
width: 800px;
57+
}
5458

55-
.inner-scroll-element {
56-
background: hsla(0, 0%, 0%, .05);
57-
}
59+
.inner-scroll-element {
60+
background: hsla(0, 0%, 0%, 0.05);
61+
}
5862

59-
.scroll-padding {
60-
display: -webkit-box;
61-
display: -ms-flexbox;
62-
display: flex;
63-
-ms-flex-wrap: wrap;
64-
flex-wrap: wrap;
65-
padding: 16.666666666666668px;
66-
height: 333.3333333333333px;
67-
width: 333.3333333333333px;
68-
}
63+
.scroll-padding {
64+
display: -webkit-box;
65+
display: -ms-flexbox;
66+
display: flex;
67+
-ms-flex-wrap: wrap;
68+
flex-wrap: wrap;
69+
padding: 16.666666666666668px;
70+
height: 333.3333333333333px;
71+
width: 333.3333333333333px;
72+
}
6973

70-
.layer {
71-
display: -webkit-box;
72-
display: -ms-flexbox;
73-
display: flex;
74-
-webkit-box-pack: center;
75-
-ms-flex-pack: center;
76-
justify-content: center;
77-
-webkit-box-align: center;
78-
-ms-flex-align: center;
79-
align-items: center;
80-
height: 33.333333333333336%;
81-
-webkit-box-flex: 0;
82-
-ms-flex: none;
83-
flex: none;
84-
width: 33.3333%;
85-
}
86-
.scroll-tile {
87-
font-size: 48px !important;
88-
font-size: 3rem !important;
89-
display: -webkit-box;
90-
display: -ms-flexbox;
91-
display: flex;
92-
-webkit-box-align: center;
93-
-ms-flex-align: center;
94-
align-items: center;
95-
border-radius: 4px;
96-
height: 66.66666666666667px;
97-
color: hsla(0, 0%, 0%, .3);
98-
background-color: #00d1b2;
99-
-webkit-box-pack: center;
100-
-ms-flex-pack: center;
101-
justify-content: center;
102-
width: 66.66666666666667px;
103-
}
74+
.layer {
75+
display: -webkit-box;
76+
display: -ms-flexbox;
77+
display: flex;
78+
-webkit-box-pack: center;
79+
-ms-flex-pack: center;
80+
justify-content: center;
81+
-webkit-box-align: center;
82+
-ms-flex-align: center;
83+
align-items: center;
84+
height: 33.333333333333336%;
85+
-webkit-box-flex: 0;
86+
-ms-flex: none;
87+
flex: none;
88+
width: 33.3333%;
89+
}
90+
.scroll-tile {
91+
font-size: 48px !important;
92+
font-size: 3rem !important;
93+
display: -webkit-box;
94+
display: -ms-flexbox;
95+
display: flex;
96+
-webkit-box-align: center;
97+
-ms-flex-align: center;
98+
align-items: center;
99+
border-radius: 4px;
100+
height: 66.66666666666667px;
101+
color: hsla(0, 0%, 0%, 0.3);
102+
background-color: #00d1b2;
103+
-webkit-box-pack: center;
104+
-ms-flex-pack: center;
105+
justify-content: center;
106+
width: 66.66666666666667px;
107+
}
104108
</style>
105109
<div class="outer-scroll-container">
106110
<div class="outer-scroll-element">
@@ -138,4 +142,4 @@
138142
</div>
139143
</div>
140144
</div>
141-
</div>
145+
</div>

‎integration/iframe.html

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
11
<!DOCTYPE html>
2-
<meta charset="utf-8">
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2+
<meta charset="utf-8" />
3+
<meta
4+
name="viewport"
5+
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
6+
/>
47
<script src="../umd/compute-scroll-into-view.min.js"></script>
58
<script src="./utils.js"></script>
6-
<iframe srcdoc="
9+
<iframe
10+
srcdoc="
711
<div class='container' style='height: 100vh'></div>
812
<div class='target' style='background: crimson; px; height: 100px; width: 100px;'></div>
9-
">
13+
"
14+
>
1015
</iframe>
11-

‎integration/nested_overflow.html

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
<!DOCTYPE html>
2-
<meta charset="utf-8">
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2+
<meta charset="utf-8" />
3+
<meta
4+
name="viewport"
5+
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
6+
/>
47
<script src="../umd/compute-scroll-into-view.min.js"></script>
58
<script src="./utils.js"></script>
69
<style>
7-
html, body {
10+
html,
11+
body {
812
margin: 0;
913
padding: 0;
1014
height: 100vh;
@@ -30,7 +34,7 @@
3034
}
3135
</style>
3236
<div class="container">
33-
<div class="inner">
34-
<div class="target"></div>
35-
</div>
36-
</div>
37+
<div class="inner">
38+
<div class="target"></div>
39+
</div>
40+
</div>

‎integration/overflow_auto.html

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
<!DOCTYPE html>
2-
<meta charset="utf-8">
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2+
<meta charset="utf-8" />
3+
<meta
4+
name="viewport"
5+
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
6+
/>
47
<script src="../umd/compute-scroll-into-view.min.js"></script>
58
<script src="./utils.js"></script>
69
<style>
7-
html, body {
10+
html,
11+
body {
812
margin: 0;
913
padding: 0;
1014
height: 100vh;
@@ -27,7 +31,7 @@
2731
}
2832
</style>
2933
<div class="container">
30-
<div class="inner">
31-
<div class="target"></div>
32-
</div>
33-
</div>
34+
<div class="inner">
35+
<div class="target"></div>
36+
</div>
37+
</div>

‎integration/overflow_auto.test.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,11 @@ beforeAll(async () => {
55
const ScrollLogicalPosition = ['start', 'center', 'end', 'nearest']
66

77
describe('scrollMode: always', () => {
8-
ScrollLogicalPosition.forEach(block => {
9-
ScrollLogicalPosition.forEach(inline => {
8+
ScrollLogicalPosition.forEach((block) => {
9+
ScrollLogicalPosition.forEach((inline) => {
1010
test(`block: ${block}, inline: ${inline}`, async () => {
1111
const expected = await page.evaluate(
12-
options => {
12+
(options) => {
1313
const container = document.querySelector('.container')
1414
container.scrollTo(0, 0)
1515
document.querySelector('.target').scrollIntoView(options)
@@ -19,7 +19,7 @@ describe('scrollMode: always', () => {
1919
{ block, inline }
2020
)
2121
const actual = await page.evaluate(
22-
options => {
22+
(options) => {
2323
const container = document.querySelector('.container')
2424
container.scrollTo(0, 0)
2525
const [{ left, top }] = window.computeScrollIntoView(
@@ -36,7 +36,7 @@ describe('scrollMode: always', () => {
3636
// The 'nearest' cases can have diff behavior depending on the current scroll position
3737
if (block === 'nearest' || inline === 'nearest') {
3838
const expected = await page.evaluate(
39-
options => {
39+
(options) => {
4040
const container = document.querySelector('.container')
4141
container.scrollTo(
4242
container.clientWidth * 3,
@@ -49,7 +49,7 @@ describe('scrollMode: always', () => {
4949
{ block, inline }
5050
)
5151
const actual = await page.evaluate(
52-
options => {
52+
(options) => {
5353
const container = document.querySelector('.container')
5454
container.scrollTo(
5555
container.clientWidth * 3,

‎integration/target_same_height.html

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
<!DOCTYPE html>
2-
<meta charset="utf-8">
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2+
<meta charset="utf-8" />
3+
<meta
4+
name="viewport"
5+
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
6+
/>
47
<script src="../umd/compute-scroll-into-view.min.js"></script>
58
<script src="./utils.js"></script>
69
<style>
7-
html, body {
10+
html,
11+
body {
812
display: flex;
913
align-items: center;
1014
justify-content: center;
@@ -28,7 +32,7 @@
2832
}
2933
</style>
3034
<div class="container">
31-
<div class="pane"></div>
32-
<div class="pane target"></div>
33-
<div class="pane"></div>
34-
</div>
35+
<div class="pane"></div>
36+
<div class="pane target"></div>
37+
<div class="pane"></div>
38+
</div>

‎integration/utils.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
window.mapActions = item => ({
1+
window.mapActions = (item) => ({
22
...item,
33
el: (item.el.tagName.toLowerCase() + '.' + item.el.className).replace(
44
/\.$/,

0 commit comments

Comments
 (0)