Skip to content

Commit b40610d

Browse files
committed
Initial Commit 🧨
1 parent 30f079b commit b40610d

File tree

21 files changed

+257
-484
lines changed

21 files changed

+257
-484
lines changed

.github/DISCUSSION_TEMPLATE/ideas.yml

Lines changed: 0 additions & 54 deletions
This file was deleted.

.github/DISCUSSION_TEMPLATE/q-a.yml

Lines changed: 0 additions & 45 deletions
This file was deleted.

.github/ISSUE_TEMPLATE/bug.yml

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ body:
88
### Thanks for taking the time to fill out this bug report! 🏓 Before you begin:
99
1010
- ✅ Make sure you are running the latest version of the library
11-
- ✅ Please make sure you read our [Code of Conduct](https://github.com/hirasso/scrollmemory/blob/master/CODE_OF_CONDUCT.md)
12-
- ✅ Make sure to check [discussions](https://github.com/hirasso/scrollmemory/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Fscrollmemory+). Maybe your problem was already solved :)
11+
- ✅ Please make sure you read our [Code of Conduct](https://github.com/hirasso/restore-scroll/blob/master/CODE_OF_CONDUCT.md)
12+
- ✅ Make sure to check [discussions](https://github.com/hirasso/restore-scroll/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Frestore-scroll+). Maybe your problem was already solved :)
1313
1414
- type: textarea
1515
id: what-did-you-expect
@@ -52,11 +52,11 @@ body:
5252
attributes:
5353
label: Checked all these? 📚
5454
options:
55-
- label: I have read the [usage instructions](https://github.com/hirasso/scrollmemory#usage-example)
55+
- label: I have read the [usage instructions](https://github.com/hirasso/restore-scroll#usage-example)
5656
required: true
57-
- label: I have checked [discussions](https://github.com/hirasso/scrollmemory/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Fscrollmemory+) for related problems
57+
- label: I have checked [discussions](https://github.com/hirasso/restore-scroll/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Frestore-scroll+) for related problems
5858
required: true
59-
- label: I agree to follow this project's [Code of Conduct](https://github.com/hirasso/scrollmemory/blob/master/CODE_OF_CONDUCT.md)
59+
- label: I agree to follow this project's [Code of Conduct](https://github.com/hirasso/restore-scroll/blob/master/CODE_OF_CONDUCT.md)
6060
required: true
6161
- label: I have provided all necessary information to the best of my knowledge
6262
required: true

.github/ISSUE_TEMPLATE/config.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
blank_issues_enabled: false
22
contact_links:
33
- name: Discussions
4-
url: https://github.com/hirasso/scrollmemory/discussions
4+
url: https://github.com/hirasso/restore-scroll/discussions
55
about: Join the discussion and get help by other users.

.github/ISSUE_TEMPLATE/feature.yml

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ body:
77
value: |
88
### Thanks for taking the time to request a new feature! 🏓 Before you begin:
99
10-
- ✅ Please make sure you read our [Code of Conduct](https://github.com/hirasso/scrollmemory/blob/master/CODE_OF_CONDUCT.md)
11-
- ✅ Make sure to check [discussions](https://github.com/hirasso/scrollmemory/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Fscrollmemory+). Maybe the feature does already exist :)
10+
- ✅ Please make sure you read our [Code of Conduct](https://github.com/hirasso/restore-scroll/blob/master/CODE_OF_CONDUCT.md)
11+
- ✅ Make sure to check [discussions](https://github.com/hirasso/restore-scroll/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Frestore-scroll+). Maybe the feature does already exist :)
1212
1313
- type: textarea
1414
id: describe-the-problem
@@ -46,11 +46,11 @@ body:
4646
attributes:
4747
label: Checked all these? 📚
4848
options:
49-
- label: I have read the [usage instructions](https://github.com/hirasso/scrollmemory#usage-example)
49+
- label: I have read the [usage instructions](https://github.com/hirasso/restore-scroll#usage-example)
5050
required: true
51-
- label: I have checked [discussions](https://github.com/hirasso/scrollmemory/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Fscrollmemory+) for related problems
51+
- label: I have checked [discussions](https://github.com/hirasso/restore-scroll/discussions) and [existing issues](https://github.com/issues?q=is%3Aissue+repo%3Ahirasso%2Frestore-scroll+) for related problems
5252
required: true
53-
- label: I agree to follow this project's [Code of Conduct](https://github.com/hirasso/scrollmemory/blob/master/CODE_OF_CONDUCT.md)
53+
- label: I agree to follow this project's [Code of Conduct](https://github.com/hirasso/restore-scroll/blob/master/CODE_OF_CONDUCT.md)
5454
required: true
5555
- label: I have provided all necessary information to the best of my knowledge
5656
required: true

CNAME

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
scrollmemory.js.org
1+
restore-scroll.js.org

README.md

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,38 @@
11
<p align="center">
22

3-
[![readme-header](https://github.com/hirasso/scrollmemory/assets/869813/978e2445-d11c-4f32-8f73-e0cf8dfdce8c)](https://scrollmemory.js.org)
3+
[![readme-header](https://github.com/hirasso/restore-scroll/assets/869813/978e2445-d11c-4f32-8f73-e0cf8dfdce8c)](https://restore-scroll.js.org)
44

55
</p>
66

77
<div align="center">
88

9-
[![e2e test status](https://img.shields.io/github/actions/workflow/status/hirasso/scrollmemory/e2e-tests.yml?branch=main&label=e2e%20tests)](https://github.com/hirasso/scrollmemory/actions/workflows/e2e-tests.yml)
10-
[![unit test status](https://img.shields.io/github/actions/workflow/status/hirasso/scrollmemory/unit-tests.yml?branch=main&label=unit%20tests)](https://github.com/hirasso/scrollmemory/actions/workflows/unit-tests.yml)
11-
[![weekly NPM downloads](https://img.shields.io/npm/dw/scrollmemory)](https://www.npmjs.com/package/scrollmemory)
12-
[![license](https://img.shields.io/github/license/hirasso/scrollmemory)](https://github.com/hirasso/scrollmemory/blob/master/LICENSE)
9+
[![e2e test status](https://img.shields.io/github/actions/workflow/status/hirasso/restore-scroll/e2e-tests.yml?branch=main&label=e2e%20tests)](https://github.com/hirasso/restore-scroll/actions/workflows/e2e-tests.yml)
10+
[![unit test status](https://img.shields.io/github/actions/workflow/status/hirasso/restore-scroll/unit-tests.yml?branch=main&label=unit%20tests)](https://github.com/hirasso/restore-scroll/actions/workflows/unit-tests.yml)
11+
[![weekly NPM downloads](https://img.shields.io/npm/dw/restore-scroll)](https://www.npmjs.com/package/restore-scroll)
12+
[![license](https://img.shields.io/github/license/hirasso/restore-scroll)](https://github.com/hirasso/restore-scroll/blob/master/LICENSE)
1313

1414
</div>
1515

1616
## Demo
1717

18-
[scrollmemory.js.org](https://scrollmemory.js.org)
18+
[restore-scroll.js.org](https://restore-scroll.js.org)
1919

2020
## Installation
2121

2222
Install the plugin from npm and import it into your bundle:
2323

2424
```bash
25-
npm i scrollmemory
25+
npm i restore-scroll
2626
```
2727

2828
```js
29-
import ScrollMemory from "scrollmemory";
29+
import restoreScroll from "restore-scroll";
3030
```
3131

3232
Or include the minified production file from a CDN:
3333

3434
```html
35-
<script src="https://unpkg.com/scrollmemory"></script>
35+
<script src="https://unpkg.com/restore-scroll"></script>
3636
```
3737

3838
## Usage Example
@@ -64,29 +64,29 @@ Suppose you have the following HTML:
6464
This is how you would mirror the scroll position between the two `div.scroller`:
6565

6666
```js
67-
import ScrollMemory from "scrollmemory";
67+
import restoreScroll from "restore-scroll";
6868
/** Mirror all divs that match the class `.scroller` */
69-
new ScrollMemory(document.querySelectorAll(".scroller"));
69+
new restoreScroll(document.querySelectorAll(".scroller"));
7070
```
7171

7272
See also this [minimal example on CodePen](https://codepen.io/rassohilber/pen/JjxwJpo)
7373

7474
💡 To mirror the scroll position from and to the `window`, you would have to add one of `:root`, `html` or `body` to the selector:
7575

7676
```js
77-
new ScrollMemory(document.querySelectorAll(":root, .scroller"));
77+
new restoreScroll(document.querySelectorAll(":root, .scroller"));
7878
/** or */
79-
new ScrollMemory(document.querySelectorAll("html, .scroller"));
79+
new restoreScroll(document.querySelectorAll("html, .scroller"));
8080
/** or */
81-
new ScrollMemory(document.querySelectorAll("body, .scroller"));
81+
new restoreScroll(document.querySelectorAll("body, .scroller"));
8282
```
8383

8484
## Options
8585

86-
You can pass in a few additional options to ScrollMemory as the second argument:
86+
You can pass in a few additional options to restoreScroll as the second argument:
8787

8888
```js
89-
new ScrollMemory(document.querySelectorAll(".scroller"), options);
89+
new restoreScroll(document.querySelectorAll(".scroller"), options);
9090
```
9191

9292
The type signature of the options object:
@@ -113,10 +113,10 @@ Type: `boolean`, default: `true`. Should debug messages be printed to the consol
113113

114114
## API
115115

116-
To access ScrollMemory's API, you have to save a reference to the class during instaciation:
116+
To access restoreScroll's API, you have to save a reference to the class during instaciation:
117117

118118
```js
119-
const mirror = new ScrollMemory(document.querySelectorAll(".scroller"));
119+
const mirror = new restoreScroll(document.querySelectorAll(".scroller"));
120120
```
121121

122122
### `mirror.progress`
@@ -142,7 +142,7 @@ mirror.progress = 0.5;
142142
Get the current progress of an element. The element doesn't _need_ to be one of the mirrored elements
143143

144144
```ts
145-
const mirror = new ScrollMemory(document.querySelectorAll(".scroller"));
145+
const mirror = new restoreScroll(document.querySelectorAll(".scroller"));
146146
// ...sometime later:
147147
console.log(mirror.getScrollProgress(document.querySelector(":root")));
148148
```
@@ -153,6 +153,6 @@ There are already a few libraries out there that do the same thing. But all I co
153153

154154
Also, this simple package gave me an excuse to play around with the tooling involved with creating a robust open source `npm` package:
155155

156-
- The [demo page](https://scrollmemory.js.org) is generated using [Astro](https://astro.build) and deployed via [Netlify](https://www.netlify.com/)
156+
- The [demo page](https://restore-scroll.js.org) is generated using [Astro](https://astro.build) and deployed via [Netlify](https://www.netlify.com/)
157157
- Browser testing is being done with [PlayWright](https://playwright.dev/), using the demo site as the source for the test fixtures
158158
- The source code is written in [TypeScript](https://www.typescriptlang.org/)

package.json

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
2-
"name": "scrollmemory",
3-
"amdName": "ScrollMemory",
2+
"name": "restore-scroll",
3+
"amdName": "restore-scroll",
44
"version": "0.0.0",
55
"description": "Remember scroll positions of the window and elements between reloads",
66
"packageManager": "pnpm@10.13.1",
@@ -11,20 +11,20 @@
1111
},
1212
"repository": {
1313
"type": "git",
14-
"url": "https://github.com/hirasso/scrollmemory.git"
14+
"url": "https://github.com/hirasso/restore-scroll.git"
1515
},
1616
"license": "MIT",
1717
"type": "module",
1818
"source": "./src/index.ts",
19-
"main": "./dist/ScrollMemory.cjs",
20-
"module": "./dist/ScrollMemory.module.js",
21-
"unpkg": "./dist/ScrollMemory.umd.js",
19+
"main": "./dist/restore-scroll.cjs",
20+
"module": "./dist/restore-scroll.module.js",
21+
"unpkg": "./dist/restore-scroll.umd.js",
2222
"types": "./dist/types/index.d.ts",
2323
"exports": {
2424
".": {
2525
"types": "./dist/types/index.d.ts",
26-
"import": "./dist/ScrollMemory.modern.js",
27-
"require": "./dist/ScrollMemory.cjs"
26+
"import": "./dist/restore-scroll.modern.js",
27+
"require": "./dist/restore-scroll.cjs"
2828
}
2929
},
3030
"files": [
@@ -37,7 +37,7 @@
3737
"prepublishOnly": "pnpm run build",
3838
"build": "pnpm run clean && pnpm run build:module && pnpm run build:bundle",
3939
"build:module": "BROWSERSLIST_ENV=modern microbundle src/index.ts --format modern,esm,cjs",
40-
"build:bundle": "BROWSERSLIST_ENV=production microbundle src/scrollmemory.ts --format umd --external none",
40+
"build:bundle": "BROWSERSLIST_ENV=production microbundle src/index.ts --format umd --external none --define process.env.NODE_ENV=production",
4141
"watch": "BROWSERSLIST_ENV=development microbundle src/index.ts --watch --format modern",
4242
"playground:dev": "astro dev --root playground",
4343
"playground:build": "astro build --root playground",
@@ -65,7 +65,7 @@
6565
"devEngines": {
6666
"packageManager": {
6767
"name": "pnpm",
68-
"onFail": "error"
68+
"onFail": "warn"
6969
}
7070
}
7171
}

playground/src/components/AnchorsPageContent.astro

Lines changed: 0 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -16,17 +16,6 @@ import Nav from './Nav.astro';
1616
</div>
1717
</section>
1818

19-
<Nav
20-
links={[
21-
{
22-
href: '#top',
23-
title: 'Top',
24-
description: 'Scroll to the top of the page',
25-
direction: 'up'
26-
}
27-
]}
28-
/>
29-
3019
<section data-testid="horizontal">
3120
<h2>Horizontal</h2>
3221
<div
@@ -38,17 +27,6 @@ import Nav from './Nav.astro';
3827
</div>
3928
</section>
4029

41-
<Nav
42-
links={[
43-
{
44-
href: '#top',
45-
title: 'Top',
46-
description: 'Scroll to the top of the page',
47-
direction: 'up'
48-
}
49-
]}
50-
/>
51-
5230
<section data-testid="both-axis">
5331
<h2>Both axis</h2>
5432
<div
@@ -60,25 +38,6 @@ import Nav from './Nav.astro';
6038
</div>
6139
</section>
6240

63-
<Nav
64-
links={[
65-
{
66-
href: '#top',
67-
title: 'Top',
68-
description: 'Scroll to the top of the page',
69-
direction: 'up'
70-
},
71-
{
72-
href: '/anchors-2/',
73-
title: 'Anchors 2',
74-
description: 'Go to the second anchors page',
75-
attributes: {
76-
'data-testid': 'link-to-anchors-2-after-both-axis'
77-
}
78-
}
79-
]}
80-
/>
81-
8241
<section>
8342
<p>
8443
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod eligendi repudiandae

0 commit comments

Comments
 (0)