Skip to content

Commit 09d0795

Browse files
GrsmtoGrsmto
committed
first commit
1 parent 260fa4d commit 09d0795

22 files changed

+6835
-0
lines changed

Diff for: ‎.editorconfig

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
end_of_line = lf
6+
insert_final_newline = true
7+
trim_trailing_whitespace = true
8+
indent_style = space
9+
10+
[**.js]
11+
indent_size = 2
12+
13+
[**.css]
14+
indent_size = 2
15+
16+
[**.html]
17+
indent_size = 2

Diff for: ‎.gitignore

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.DS_Store
2+
node_modules
3+
.temp
4+
dist
5+
yarn-error.log
6+
.next
7+
.env
8+
.idea
9+
yalc.lock
10+
.yalc

Diff for: ‎.prettierrc

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"singleQuote": true
3+
}

Diff for: ‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2015 Jonathan Nicol
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

Diff for: ‎lerna.json

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"lerna": "3.22.1",
3+
"version": "independent",
4+
"npmClient": "yarn",
5+
"useWorkspaces": true,
6+
"ignoreChanges": ["**/demo/**", "**/*.md"]
7+
}

Diff for: ‎package.json

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "scroll-snap-carousel",
3+
"version": "0.0.1",
4+
"main": "dist/index.js",
5+
"module": "dist/index.es.js",
6+
"jsnext:main": "dist/index.es.js",
7+
"license": "MIT",
8+
"private": true,
9+
"workspaces": [
10+
"packages/*"
11+
],
12+
"scripts": {
13+
"build": "rollup -c",
14+
"start": "rollup -c -w"
15+
},
16+
"devDependencies": {
17+
"@rollup/plugin-commonjs": "^13.0.0",
18+
"@rollup/plugin-node-resolve": "^8.0.1",
19+
"@rollup/plugin-typescript": "^4.1.2",
20+
"@typescript-eslint/eslint-plugin": "^3.2.0",
21+
"@typescript-eslint/parser": "^3.2.0",
22+
"lerna": "^3.22.1",
23+
"prettier": "^2.0.5",
24+
"prettier-eslint": "^11.0.0",
25+
"prettier-eslint-cli": "^5.0.0",
26+
"rollup": "^2.16.1",
27+
"rollup-plugin-peer-deps-external": "^2.2.2",
28+
"tslib": "^2.0.0",
29+
"typescript": "^3.9.5"
30+
}
31+
}

Diff for: ‎packages/react-scroll-snap-carousel/package.json

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"name": "react-scroll-snap-carousel",
3+
"version": "0.0.1",
4+
"main": "dist/index.js",
5+
"module": "dist/index.es.js",
6+
"jsnext:main": "dist/index.es.js",
7+
"license": "MIT",
8+
"private": false,
9+
"scripts": {
10+
"build": "rollup -c",
11+
"start": "rollup -c -w"
12+
},
13+
"dependencies": {
14+
"scroll-snap-carousel": "^0.0.1"
15+
},
16+
"devDependencies": {
17+
"@rollup/plugin-commonjs": "^13.0.0",
18+
"@rollup/plugin-node-resolve": "^8.0.1",
19+
"@rollup/plugin-typescript": "^4.1.2",
20+
"@typescript-eslint/eslint-plugin": "^3.2.0",
21+
"@typescript-eslint/parser": "^3.2.0",
22+
"rollup": "^2.16.1",
23+
"rollup-plugin-peer-deps-external": "^2.2.2",
24+
"tslib": "^2.0.0",
25+
"typescript": "^3.9.5"
26+
}
27+
}

Diff for: ‎packages/react-scroll-snap-carousel/rollup.config.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import typescript from "@rollup/plugin-typescript";
2+
import commonjs from "@rollup/plugin-commonjs";
3+
import resolve from "@rollup/plugin-node-resolve";
4+
import external from "rollup-plugin-peer-deps-external";
5+
6+
import pkg from "./package.json";
7+
8+
export default {
9+
input: "src/index.ts",
10+
output: [
11+
{
12+
file: pkg.main,
13+
format: "cjs",
14+
exports: "named",
15+
sourcemap: true,
16+
},
17+
{
18+
file: pkg.module,
19+
format: "es",
20+
exports: "named",
21+
sourcemap: true,
22+
},
23+
],
24+
plugins: [external(), resolve(), typescript(), commonjs()],
25+
};

Diff for: ‎packages/react-scroll-snap-carousel/src/index.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import { utils } from 'scrollsnap-carousel';

Diff for: ‎packages/react-scroll-snap-carousel/src/useScroll.ts

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { scrollTo } from 'scrollsnap-carousel';
2+
3+
export const useScroll = ({ ref }) => (index) =>
4+
scrollTo({ root: ref.current, index });

Diff for: ‎packages/scroll-snap-carousel/jest-unit.config.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
module.exports = {
2+
transform: {
3+
'^.+\\.js?$': 'babel-jest'
4+
},
5+
transformIgnorePatterns: ['[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs)$'],
6+
moduleFileExtensions: ['js'],
7+
setupFiles: ['<rootDir>/tests/testsSetup.js']
8+
};

Diff for: ‎packages/scroll-snap-carousel/package.json

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"name": "scroll-snap-carousel",
3+
"version": "0.0.1",
4+
"main": "dist/index.js",
5+
"module": "dist/index.es.js",
6+
"jsnext:main": "dist/index.es.js",
7+
"license": "MIT",
8+
"private": false,
9+
"scripts": {
10+
"build": "rollup -c",
11+
"start": "rollup -c -w"
12+
},
13+
"devDependencies": {
14+
"@rollup/plugin-commonjs": "^13.0.0",
15+
"@rollup/plugin-node-resolve": "^8.0.1",
16+
"@rollup/plugin-typescript": "^4.1.2",
17+
"@typescript-eslint/eslint-plugin": "^3.2.0",
18+
"@typescript-eslint/parser": "^3.2.0",
19+
"rollup": "^2.16.1",
20+
"rollup-plugin-peer-deps-external": "^2.2.2",
21+
"tslib": "^2.0.0",
22+
"typescript": "^3.9.5"
23+
}
24+
}

Diff for: ‎packages/scroll-snap-carousel/rollup.config.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import typescript from "@rollup/plugin-typescript";
2+
import commonjs from "@rollup/plugin-commonjs";
3+
import resolve from "@rollup/plugin-node-resolve";
4+
import external from "rollup-plugin-peer-deps-external";
5+
6+
import pkg from "./package.json";
7+
8+
export default {
9+
input: "src/index.ts",
10+
output: [
11+
{
12+
file: pkg.main,
13+
format: "cjs",
14+
exports: "named",
15+
sourcemap: true,
16+
},
17+
{
18+
file: pkg.module,
19+
format: "es",
20+
exports: "named",
21+
sourcemap: true,
22+
},
23+
],
24+
plugins: [external(), resolve(), typescript(), commonjs()],
25+
};

Diff for: ‎packages/scroll-snap-carousel/src/globals.d.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
interface Window {
2+
DocumentTouch: any;
3+
}

Diff for: ‎packages/scroll-snap-carousel/src/index.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export { useActiveSnap } from './useActiveSnap';
2+
export { scrollTo } from './scrollTo';
3+
export * as utils from './utils';

Diff for: ‎packages/scroll-snap-carousel/src/scroll-snap-carousel.js

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { getScrollTo } from './scrollTo';
2+
3+
export default class ScrollSnapCarousel {
4+
constructor(root: HTMLDivElement, options: {}) {
5+
this.el = root;
6+
this.scrollTo = (index) => scrollTo({ root, index });
7+
8+
// Don't re-instantiate over an existing one
9+
if (ScrollSnapCarousel.instances.has(this.el)) {
10+
return;
11+
}
12+
13+
this.init();
14+
}
15+
16+
el: HTMLDivElement;
17+
scrollTo: (element: number) => void;
18+
19+
static instances = new WeakMap();
20+
21+
init() {
22+
// Save a reference to the instance, so we know this DOM node has already been instancied
23+
ScrollSnapCarousel.instances.set(this.el, this);
24+
}
25+
26+
/**
27+
* Delete ScrollSnapCarousel instance from DOM element
28+
*/
29+
unmount() {
30+
ScrollSnapCarousel.instances.delete(this.el);
31+
}
32+
}

Diff for: ‎packages/scroll-snap-carousel/src/scrollTo.ts

+120
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
import { mapItem, mapStyles } from './utils';
2+
3+
const normalize = (
4+
value: number,
5+
{ min, max }: { min: number; max: number }
6+
) => {
7+
return Math.min(max, Math.max(min, value));
8+
};
9+
10+
export const scrollTo = ({ root, index }: { root: any; index: number }) => {
11+
const getScrollFor = (
12+
index: number
13+
):
14+
| {
15+
left: number;
16+
top: number;
17+
}
18+
| undefined => {
19+
const $viewport: HTMLElement = root;
20+
if (!$viewport) return;
21+
22+
const elements = $viewport.children;
23+
const element =
24+
index >= 0 && elements.length ? (elements[index] as HTMLElement) : null;
25+
26+
if (!element) return;
27+
28+
const firstElement = elements[0] as HTMLElement;
29+
30+
const viewportStyles = mapStyles($viewport);
31+
const viewport = {
32+
left: $viewport.scrollLeft,
33+
width: $viewport.offsetWidth,
34+
right: $viewport.scrollLeft + $viewport.offsetWidth,
35+
top: $viewport.scrollTop,
36+
height: $viewport.offsetHeight,
37+
bottom: $viewport.scrollTop + $viewport.offsetHeight,
38+
offsetLeft: $viewport.offsetLeft,
39+
offsetTop: $viewport.offsetTop,
40+
paddingLeft: mapStyles(firstElement).paddingLeft,
41+
paddingRight: mapStyles(elements[elements.length - 1]).paddingRight,
42+
paddingTop: mapStyles(firstElement).paddingTop,
43+
paddingBottom: mapStyles(elements[elements.length - 1]).paddingBottom,
44+
scrollPaddingLeft: viewportStyles.scrollPaddingLeft || 0,
45+
scrollPaddingRight: viewportStyles.scrollPaddingRight || 0,
46+
scrollPaddingTop: viewportStyles.scrollPaddingTop || 0,
47+
scrollPaddingBottom: viewportStyles.scrollPaddingBottom || 0,
48+
scrollWidth: $viewport.scrollWidth,
49+
scrollHeight: $viewport.scrollHeight,
50+
};
51+
52+
const item = mapItem({ element, viewport });
53+
54+
let target = { left: 0, top: 0 };
55+
switch (item.snapAlign) {
56+
case 'start':
57+
target = {
58+
left:
59+
item.left -
60+
item.paddingLeft -
61+
viewport.paddingLeft -
62+
viewport.scrollPaddingLeft,
63+
top:
64+
item.top -
65+
item.paddingTop -
66+
viewport.paddingTop -
67+
viewport.scrollPaddingTop,
68+
};
69+
break;
70+
case 'end':
71+
target = {
72+
left:
73+
item.left -
74+
(viewport.width - item.width) +
75+
viewport.paddingRight +
76+
viewport.scrollPaddingRight,
77+
top:
78+
item.top -
79+
(viewport.height - item.height) +
80+
viewport.paddingBottom +
81+
viewport.scrollPaddingBottom,
82+
};
83+
break;
84+
case 'center':
85+
target = {
86+
left:
87+
item.left -
88+
(viewport.width - item.width) / 2 -
89+
viewport.scrollPaddingLeft / 2,
90+
top:
91+
item.top -
92+
(viewport.height - item.height) / 2 -
93+
viewport.scrollPaddingTop / 2,
94+
};
95+
break;
96+
}
97+
98+
const maxLeftScroll = viewport.scrollWidth - viewport.width;
99+
const maxTopScroll = viewport.scrollHeight - viewport.height;
100+
101+
return {
102+
left: normalize(target.left, { min: 0, max: maxLeftScroll }),
103+
top: normalize(target.top, { min: 0, max: maxTopScroll }),
104+
};
105+
};
106+
107+
const goTo = (index: number) => {
108+
const scrollTarget = getScrollFor(index);
109+
110+
if (scrollTarget) {
111+
root.scrollTo({
112+
left: scrollTarget.left,
113+
top: scrollTarget.top,
114+
behavior: 'smooth',
115+
});
116+
}
117+
};
118+
119+
return goTo(index);
120+
};

0 commit comments

Comments
 (0)