@superrb/react-addons 3.0.0-2 → 3.0.0-20
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.
- package/actions.d.ts +6 -0
- package/actions.d.ts.map +1 -0
- package/actions.js +18 -0
- package/components/accordion.d.ts +10 -0
- package/components/accordion.d.ts.map +1 -0
- package/components/accordion.js +50 -0
- package/components/button.d.ts +1 -1
- package/components/context-wrapper.d.ts.map +1 -1
- package/components/cookie-banner.d.ts +22 -16
- package/components/cookie-banner.d.ts.map +1 -1
- package/components/cookie-banner.js +10 -10
- package/components/form/field.d.ts.map +1 -1
- package/components/form/field.js +3 -0
- package/components/form/submit-button.d.ts +1 -1
- package/components/form/submit-button.d.ts.map +1 -1
- package/components/form.d.ts +1 -1
- package/components/form.d.ts.map +1 -1
- package/components/form.js +25 -15
- package/components/modal.d.ts.map +1 -1
- package/components/slideshow-buttons.d.ts +9 -0
- package/components/slideshow-buttons.d.ts.map +1 -0
- package/components/slideshow-buttons.js +6 -0
- package/components/slideshow-pagination.d.ts +6 -0
- package/components/slideshow-pagination.d.ts.map +1 -0
- package/components/slideshow-pagination.js +3 -0
- package/components.d.ts +4 -1
- package/components.d.ts.map +1 -1
- package/components.js +4 -1
- package/context/cookies-context-provider.d.ts +13 -0
- package/context/cookies-context-provider.d.ts.map +1 -0
- package/context/cookies-context-provider.js +54 -0
- package/context/modal-context-provider.d.ts +13 -0
- package/context/modal-context-provider.d.ts.map +1 -0
- package/context/modal-context-provider.js +31 -0
- package/context/nav-context-provider.js +26 -0
- package/context.d.ts +2 -1
- package/context.d.ts.map +1 -1
- package/context.js +2 -1
- package/hooks/use-async.d.ts.map +1 -1
- package/hooks/use-draggable-scroll.d.ts.map +1 -1
- package/hooks/use-event-listener.d.ts +1 -1
- package/hooks/use-event-listener.d.ts.map +1 -1
- package/hooks/use-event-listener.js +2 -9
- package/hooks/use-hide-on-scroll.js +1 -1
- package/hooks/use-is-in-viewport.d.ts +1 -1
- package/hooks/use-is-in-viewport.d.ts.map +1 -1
- package/hooks/use-is-in-viewport.js +15 -12
- package/hooks/use-is-overflowing.d.ts.map +1 -1
- package/hooks/use-slideshow.d.ts +19 -0
- package/hooks/use-slideshow.d.ts.map +1 -0
- package/hooks/use-slideshow.js +110 -0
- package/hooks.d.ts +2 -1
- package/hooks.d.ts.map +1 -1
- package/hooks.js +2 -1
- package/package.json +3 -4
- package/store/cookies.d.ts +3 -0
- package/store/cookies.d.ts.map +1 -1
- package/store/cookies.js +25 -22
- package/tsconfig.tsbuildinfo +1 -1
- package/utils/animate.d.ts.map +1 -1
- package/utils/is-external-link.js +4 -4
- package/utils.d.ts +2 -1
- package/utils.d.ts.map +1 -1
- package/utils.js +2 -1
package/context.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Context
|
|
3
3
|
*/
|
|
4
|
+
import { CookiesContext, CookiesContextProvider, } from './context/cookies-context-provider';
|
|
4
5
|
import { ModalContext, ModalContextProvider, } from './context/modal-context-provider';
|
|
5
6
|
import { NavContext, NavContextProvider } from './context/nav-context-provider';
|
|
6
|
-
export { ModalContext, ModalContextProvider, NavContext, NavContextProvider, };
|
|
7
|
+
export { CookiesContext, CookiesContextProvider, ModalContext, ModalContextProvider, NavContext, NavContextProvider, };
|
package/hooks/use-async.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-async.d.ts","sourceRoot":"","sources":["../src/hooks/use-async.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAA;AAE7D,UAAU,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM;IAChC,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxC,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,CAAC,GAAG,IAAI,CAAA;IACf,KAAK,EAAE,CAAC,GAAG,IAAI,CAAA;CAChB;AAGD,QAAA,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"use-async.d.ts","sourceRoot":"","sources":["../src/hooks/use-async.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAA;AAE7D,UAAU,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM;IAChC,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxC,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,CAAC,GAAG,IAAI,CAAA;IACf,KAAK,EAAE,CAAC,GAAG,IAAI,CAAA;CAChB;AAGD,QAAA,MAAM,QAAQ,GAAI,CAAC,EAAE,CAAC,0BACL,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,OAAO,CAAC,CAAC,CAAC,sCAE/B,GAAG,EAAE,KAClB,UAAU,CAAC,CAAC,EAAE,CAAC,CA2CjB,CAAA;AAED,eAAe,QAAQ,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-draggable-scroll.d.ts","sourceRoot":"","sources":["../src/hooks/use-draggable-scroll.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,gBAAgB,EAIjB,MAAM,OAAO,CAAA;AAId,UAAU,MAAM;IACd,WAAW,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAA;CAC5C;AAED,QAAA,MAAM,kBAAkB,QACjB,
|
|
1
|
+
{"version":3,"file":"use-draggable-scroll.d.ts","sourceRoot":"","sources":["../src/hooks/use-draggable-scroll.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,gBAAgB,EAIjB,MAAM,OAAO,CAAA;AAId,UAAU,MAAM;IACd,WAAW,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAA;CAC5C;AAED,QAAA,MAAM,kBAAkB,QACjB,gBAAgB,CAAC,WAAW,CAAC,0BACV;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE;;CA8E9C,CAAA;AAED,eAAe,kBAAkB,CAAA"}
|
|
@@ -2,6 +2,6 @@ type Target = Document | Window | Element;
|
|
|
2
2
|
type EventMap<T extends Target> = T extends Window ? WindowEventHandlersEventMap & GlobalEventHandlersEventMap : T extends Document ? DocumentEventMap : GlobalEventHandlersEventMap;
|
|
3
3
|
type EventName<T extends Target> = keyof EventMap<T>;
|
|
4
4
|
type EventListener<T extends Target, E extends EventName<T>> = (event: EventMap<T>[E]) => void | boolean;
|
|
5
|
-
declare const useEventListener: <T extends Target, E extends
|
|
5
|
+
declare const useEventListener: <T extends Target, E extends EventName<T>>(eventName: E, handler: EventListener<T, E>, options?: boolean | AddEventListenerOptions, element?: T, flag?: boolean) => void;
|
|
6
6
|
export default useEventListener;
|
|
7
7
|
//# sourceMappingURL=use-event-listener.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-event-listener.d.ts","sourceRoot":"","sources":["../src/hooks/use-event-listener.ts"],"names":[],"mappings":"AAEA,KAAK,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;AAEzC,KAAK,QAAQ,CAAC,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,MAAM,GAC9C,2BAA2B,GAAG,2BAA2B,GACzD,CAAC,SAAS,QAAQ,
|
|
1
|
+
{"version":3,"file":"use-event-listener.d.ts","sourceRoot":"","sources":["../src/hooks/use-event-listener.ts"],"names":[],"mappings":"AAEA,KAAK,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;AAEzC,KAAK,QAAQ,CAAC,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,MAAM,GAC9C,2BAA2B,GAAG,2BAA2B,GACzD,CAAC,SAAS,QAAQ,GAChB,gBAAgB,GAChB,2BAA2B,CAAA;AAEjC,KAAK,SAAS,CAAC,CAAC,SAAS,MAAM,IAAI,MAAM,QAAQ,CAAC,CAAC,CAAC,CAAA;AAEpD,KAAK,aAAa,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,SAAS,CAAC,CAAC,CAAC,IAAI,CAC7D,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAClB,IAAI,GAAG,OAAO,CAAA;AAGnB,QAAA,MAAM,gBAAgB,GAAI,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,SAAS,CAAC,CAAC,CAAC,aACrD,CAAC,WACH,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,YACnB,OAAO,GAAG,uBAAuB,YAChC,CAAC,SACL,OAAO,SAwDd,CAAA;AAED,eAAe,gBAAgB,CAAA"}
|
|
@@ -13,7 +13,7 @@ const useEventListener = (eventName, handler, options = {}, element, flag = true
|
|
|
13
13
|
// ... and potentially cause effect to re-run every render.
|
|
14
14
|
useEffect(() => {
|
|
15
15
|
savedHandler.current = handler;
|
|
16
|
-
}, [handler
|
|
16
|
+
}, [handler]);
|
|
17
17
|
useEffect(() => {
|
|
18
18
|
// Make sure element supports addEventListener
|
|
19
19
|
// On
|
|
@@ -33,13 +33,6 @@ const useEventListener = (eventName, handler, options = {}, element, flag = true
|
|
|
33
33
|
return () => {
|
|
34
34
|
elementRef.current.removeEventListener(eventName, eventListener);
|
|
35
35
|
};
|
|
36
|
-
}, [
|
|
37
|
-
eventName,
|
|
38
|
-
handler,
|
|
39
|
-
savedHandler.current,
|
|
40
|
-
element,
|
|
41
|
-
elementRef.current,
|
|
42
|
-
flag,
|
|
43
|
-
]);
|
|
36
|
+
}, [eventName, handler, element, options, flag]);
|
|
44
37
|
};
|
|
45
38
|
export default useEventListener;
|
|
@@ -25,7 +25,7 @@ const useHideOnScroll = (hiddenOnLoad = false) => {
|
|
|
25
25
|
}, [setHidden]);
|
|
26
26
|
useEffect(() => {
|
|
27
27
|
handleScroll();
|
|
28
|
-
}
|
|
28
|
+
});
|
|
29
29
|
useEventListener('scroll', handleScroll, { passive: true }, typeof window !== 'undefined' ? window : undefined);
|
|
30
30
|
useEventListener('resize', handleLoad, { passive: true }, typeof window !== 'undefined' ? window : undefined);
|
|
31
31
|
useEventListener('popstate', handleLoad, { passive: true }, typeof window !== 'undefined' ? window : undefined);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
declare const useIsInViewport: (initial?: boolean, rootMargin?: string, threshold?: number[]) => {
|
|
2
2
|
isInViewport: boolean;
|
|
3
|
-
setRef: (ref: HTMLElement | null) =>
|
|
3
|
+
setRef: (ref: HTMLElement | null) => void;
|
|
4
4
|
};
|
|
5
5
|
export default useIsInViewport;
|
|
6
6
|
//# sourceMappingURL=use-is-in-viewport.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-is-in-viewport.d.ts","sourceRoot":"","sources":["../src/hooks/use-is-in-viewport.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,eAAe;;
|
|
1
|
+
{"version":3,"file":"use-is-in-viewport.d.ts","sourceRoot":"","sources":["../src/hooks/use-is-in-viewport.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,eAAe;;kBAgEE,WAAW,GAAG,IAAI;CAiBxC,CAAA;AAED,eAAe,eAAe,CAAA"}
|
|
@@ -45,19 +45,22 @@ const useIsInViewport = (initial = false, rootMargin = '0px 0px', threshold = [0
|
|
|
45
45
|
wait();
|
|
46
46
|
});
|
|
47
47
|
};
|
|
48
|
-
const setRef =
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
48
|
+
const setRef = (ref) => {
|
|
49
|
+
;
|
|
50
|
+
(async () => {
|
|
51
|
+
element.current = ref;
|
|
52
|
+
if (ref) {
|
|
53
|
+
try {
|
|
54
|
+
const observer = await waitForObserver();
|
|
55
|
+
observer.observe(ref);
|
|
56
|
+
}
|
|
57
|
+
catch (error) {
|
|
58
|
+
// If IntersectionObserver fails, just set isInViewport to true
|
|
59
|
+
console.error(error);
|
|
60
|
+
setIsInViewport(true);
|
|
61
|
+
}
|
|
59
62
|
}
|
|
60
|
-
}
|
|
63
|
+
})();
|
|
61
64
|
};
|
|
62
65
|
return { isInViewport, setRef };
|
|
63
66
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-is-overflowing.d.ts","sourceRoot":"","sources":["../src/hooks/use-is-overflowing.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAA;AAExC,QAAA,MAAM,gBAAgB,gBAAiB,
|
|
1
|
+
{"version":3,"file":"use-is-overflowing.d.ts","sourceRoot":"","sources":["../src/hooks/use-is-overflowing.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAA;AAExC,QAAA,MAAM,gBAAgB,gBAAiB,gBAAgB,CAAC,WAAW,CAAC,YAGpB,CAAA;AAEhD,eAAe,gBAAgB,CAAA"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { MutableRefObject } from 'react';
|
|
2
|
+
export type SlideshowElement = HTMLElement & {
|
|
3
|
+
previousScroll?: number;
|
|
4
|
+
};
|
|
5
|
+
export type Slideshow = {
|
|
6
|
+
slideshowRef: MutableRefObject<SlideshowElement>;
|
|
7
|
+
currentSlide: number;
|
|
8
|
+
slideCount: number;
|
|
9
|
+
goTo: (index: number) => void;
|
|
10
|
+
atStart: boolean;
|
|
11
|
+
atEnd: boolean;
|
|
12
|
+
};
|
|
13
|
+
export declare const isHorizontal: (element: SlideshowElement) => boolean;
|
|
14
|
+
export declare const isCentered: (element: SlideshowElement) => boolean;
|
|
15
|
+
export declare const getScrollProgress: (target: SlideshowElement) => number;
|
|
16
|
+
export declare const getCurrentSlideIndex: (element: SlideshowElement, currentIndex: number) => number;
|
|
17
|
+
declare const useSlideshow: (slideshow: MutableRefObject<SlideshowElement>) => Slideshow;
|
|
18
|
+
export default useSlideshow;
|
|
19
|
+
//# sourceMappingURL=use-slideshow.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-slideshow.d.ts","sourceRoot":"","sources":["../src/hooks/use-slideshow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAoC,MAAM,OAAO,CAAA;AAG1E,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAA;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,YAAY,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAA;IAChD,YAAY,EAAE,MAAM,CAAA;IACpB,UAAU,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7B,OAAO,EAAE,OAAO,CAAA;IAChB,KAAK,EAAE,OAAO,CAAA;CACf,CAAA;AAED,eAAO,MAAM,YAAY,YAAa,gBAAgB,KAAG,OAExD,CAAA;AAED,eAAO,MAAM,UAAU,YAAa,gBAAgB,KAAG,OAKtD,CAAA;AAED,eAAO,MAAM,iBAAiB,WAAY,gBAAgB,WAMzD,CAAA;AAED,eAAO,MAAM,oBAAoB,YACtB,gBAAgB,gBACX,MAAM,KACnB,MAsDF,CAAA;AAED,QAAA,MAAM,YAAY,cACL,gBAAgB,CAAC,gBAAgB,CAAC,KAC5C,SA2EF,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { useCallback, useEffect, useState } from 'react';
|
|
2
|
+
import useEventListener from './use-event-listener';
|
|
3
|
+
export const isHorizontal = (element) => {
|
|
4
|
+
return window.getComputedStyle(element).scrollSnapType.startsWith('x');
|
|
5
|
+
};
|
|
6
|
+
export const isCentered = (element) => {
|
|
7
|
+
return (window.getComputedStyle(element.firstElementChild)
|
|
8
|
+
?.scrollSnapAlign === 'center');
|
|
9
|
+
};
|
|
10
|
+
export const getScrollProgress = (target) => {
|
|
11
|
+
if (!target || target.scrollWidth === target.clientWidth) {
|
|
12
|
+
return -1;
|
|
13
|
+
}
|
|
14
|
+
return target.scrollLeft / (target.scrollWidth - target.clientWidth);
|
|
15
|
+
};
|
|
16
|
+
export const getCurrentSlideIndex = (element, currentIndex) => {
|
|
17
|
+
if (!element) {
|
|
18
|
+
return currentIndex;
|
|
19
|
+
}
|
|
20
|
+
if (!element.previousScroll) {
|
|
21
|
+
element.previousScroll = element.scrollLeft;
|
|
22
|
+
return currentIndex;
|
|
23
|
+
}
|
|
24
|
+
const centered = isCentered(element);
|
|
25
|
+
const horizontal = isHorizontal(element);
|
|
26
|
+
const direction = element.scrollLeft > element.previousScroll ? 'right' : 'left';
|
|
27
|
+
const offset = 50;
|
|
28
|
+
let gap = parseFloat(window.getComputedStyle(element).gap) || 0;
|
|
29
|
+
if (isNaN(gap)) {
|
|
30
|
+
gap = 0;
|
|
31
|
+
}
|
|
32
|
+
const containerEdge = element.getBoundingClientRect()[horizontal ? 'left' : 'top'];
|
|
33
|
+
let newIndex = currentIndex;
|
|
34
|
+
let i = 0;
|
|
35
|
+
for (const child of element.children) {
|
|
36
|
+
const edge = child.getBoundingClientRect()[horizontal ? 'left' : 'top'] - containerEdge;
|
|
37
|
+
if (centered) {
|
|
38
|
+
const threshold = horizontal
|
|
39
|
+
? element.clientWidth / 2
|
|
40
|
+
: element.clientHeight / 2;
|
|
41
|
+
if (edge >= 0 && edge < threshold) {
|
|
42
|
+
return i;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
else {
|
|
46
|
+
const threshold = direction === 'right'
|
|
47
|
+
? (horizontal ? child.clientWidth : child.clientHeight) - gap - offset
|
|
48
|
+
: 0 + gap + offset;
|
|
49
|
+
if (edge >= 0 - threshold) {
|
|
50
|
+
return i;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
i++;
|
|
54
|
+
}
|
|
55
|
+
element.previousScroll = element.scrollLeft;
|
|
56
|
+
return newIndex;
|
|
57
|
+
};
|
|
58
|
+
const useSlideshow = (slideshow) => {
|
|
59
|
+
const [currentSlide, setCurrentSlide] = useState(0);
|
|
60
|
+
const [progress, setProgress] = useState(-1);
|
|
61
|
+
const [ready, setReady] = useState(false);
|
|
62
|
+
const update = useCallback(() => {
|
|
63
|
+
if (!slideshow.current) {
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
setCurrentSlide((current) => getCurrentSlideIndex(slideshow.current, current));
|
|
67
|
+
setProgress(getScrollProgress(slideshow.current));
|
|
68
|
+
}, [setCurrentSlide, slideshow]);
|
|
69
|
+
useEventListener('scroll', update, { passive: true }, slideshow.current, !!slideshow.current && ready);
|
|
70
|
+
useEventListener('resize', update, { passive: true }, slideshow.current, !!slideshow.current && ready);
|
|
71
|
+
useEffect(() => {
|
|
72
|
+
setReady(true);
|
|
73
|
+
if (slideshow.current) {
|
|
74
|
+
update();
|
|
75
|
+
slideshow.current.setAttribute('role', 'region');
|
|
76
|
+
slideshow.current.setAttribute('aria-label', 'carousel');
|
|
77
|
+
slideshow.current.setAttribute('aria-live', 'polite');
|
|
78
|
+
}
|
|
79
|
+
}, [slideshow, update]);
|
|
80
|
+
useEffect(() => {
|
|
81
|
+
[...slideshow.current?.children].forEach(child => child.setAttribute('aria-hidden', 'true'));
|
|
82
|
+
slideshow.current?.children[currentSlide].setAttribute('aria-hidden', 'false');
|
|
83
|
+
}, [currentSlide, slideshow]);
|
|
84
|
+
return {
|
|
85
|
+
slideshowRef: slideshow,
|
|
86
|
+
currentSlide,
|
|
87
|
+
slideCount: slideshow.current?.children.length || 0,
|
|
88
|
+
goTo: (index) => {
|
|
89
|
+
const scrollOpts = {
|
|
90
|
+
behavior: 'smooth',
|
|
91
|
+
block: 'start',
|
|
92
|
+
inline: 'start',
|
|
93
|
+
};
|
|
94
|
+
if (isCentered(slideshow.current)) {
|
|
95
|
+
scrollOpts.block = 'center';
|
|
96
|
+
scrollOpts.inline = 'center';
|
|
97
|
+
}
|
|
98
|
+
if (isHorizontal(slideshow.current)) {
|
|
99
|
+
scrollOpts.block = 'nearest';
|
|
100
|
+
}
|
|
101
|
+
else {
|
|
102
|
+
scrollOpts.inline = 'nearest';
|
|
103
|
+
}
|
|
104
|
+
slideshow.current?.children[index]?.scrollIntoView(scrollOpts);
|
|
105
|
+
},
|
|
106
|
+
atStart: progress <= 0 || progress === -1,
|
|
107
|
+
atEnd: progress >= 1 || progress === -1,
|
|
108
|
+
};
|
|
109
|
+
};
|
|
110
|
+
export default useSlideshow;
|
package/hooks.d.ts
CHANGED
|
@@ -13,5 +13,6 @@ import useLockBodyScroll from './hooks/use-lock-body-scroll';
|
|
|
13
13
|
import useModal from './hooks/use-modal';
|
|
14
14
|
import useMotionAllowed from './hooks/use-motion-allowed';
|
|
15
15
|
import useParallax from './hooks/use-parallax';
|
|
16
|
-
|
|
16
|
+
import useSlideshow from './hooks/use-slideshow';
|
|
17
|
+
export { useAsync, useDraggableScroll, useEventListener, useHideOnScroll, useId, useIsOverflowing, useIsInViewport, useIsMobile, useLockBodyScroll, useModal, useMotionAllowed, useParallax, useSlideshow, };
|
|
17
18
|
//# sourceMappingURL=hooks.d.ts.map
|
package/hooks.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["src/hooks.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,kBAAkB,MAAM,8BAA8B,CAAA;AAC7D,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,KAAK,MAAM,gBAAgB,CAAA;AAClC,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,uBAAuB,CAAA;AAC/C,OAAO,iBAAiB,MAAM,8BAA8B,CAAA;AAC5D,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,sBAAsB,CAAA;
|
|
1
|
+
{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["src/hooks.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,kBAAkB,MAAM,8BAA8B,CAAA;AAC7D,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,KAAK,MAAM,gBAAgB,CAAA;AAClC,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,uBAAuB,CAAA;AAC/C,OAAO,iBAAiB,MAAM,8BAA8B,CAAA;AAC5D,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,gBAAgB,MAAM,4BAA4B,CAAA;AACzD,OAAO,WAAW,MAAM,sBAAsB,CAAA;AAC9C,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAEhD,OAAO,EACL,QAAQ,EACR,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,EACf,KAAK,EACL,gBAAgB,EAChB,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,YAAY,GACb,CAAA"}
|
package/hooks.js
CHANGED
|
@@ -13,4 +13,5 @@ import useLockBodyScroll from './hooks/use-lock-body-scroll';
|
|
|
13
13
|
import useModal from './hooks/use-modal';
|
|
14
14
|
import useMotionAllowed from './hooks/use-motion-allowed';
|
|
15
15
|
import useParallax from './hooks/use-parallax';
|
|
16
|
-
|
|
16
|
+
import useSlideshow from './hooks/use-slideshow';
|
|
17
|
+
export { useAsync, useDraggableScroll, useEventListener, useHideOnScroll, useId, useIsOverflowing, useIsInViewport, useIsMobile, useLockBodyScroll, useModal, useMotionAllowed, useParallax, useSlideshow, };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@superrb/react-addons",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "3.0.0-
|
|
4
|
+
"version": "3.0.0-20",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"repository": "https://github.com/superrbstudio/react-addons",
|
|
7
7
|
"author": "@molovo",
|
|
@@ -14,13 +14,12 @@
|
|
|
14
14
|
"js-cookie": "^3.0.5",
|
|
15
15
|
"react-google-recaptcha-v3": "^1.10.1",
|
|
16
16
|
"react-hook-form": "^7.46.1",
|
|
17
|
-
"react-use-draggable-scroll": "^0.4.7"
|
|
18
|
-
"yup": "^1.2.0"
|
|
17
|
+
"react-use-draggable-scroll": "^0.4.7"
|
|
19
18
|
},
|
|
20
19
|
"peerDependencies": {
|
|
21
|
-
"@superrb/react-addons": "^1.0.0",
|
|
22
20
|
"react": "^18.2.0",
|
|
23
21
|
"typescript": "^5.2.2",
|
|
22
|
+
"yup": "^1.2.0",
|
|
24
23
|
"zustand": "^4.4.7"
|
|
25
24
|
},
|
|
26
25
|
"scripts": {
|
package/store/cookies.d.ts
CHANGED
|
@@ -3,6 +3,9 @@ export interface CookieState {
|
|
|
3
3
|
trackingCookiesAccepted: boolean;
|
|
4
4
|
setCookiesAccepted: (accepted: boolean) => void;
|
|
5
5
|
setTrackingCookiesAccepted: (accepted: boolean) => void;
|
|
6
|
+
popupOpen: boolean;
|
|
7
|
+
openPopup: () => void;
|
|
8
|
+
closePopup: () => void;
|
|
6
9
|
}
|
|
7
10
|
declare const useCookieStore: import("zustand").UseBoundStore<import("zustand").StoreApi<CookieState>>;
|
|
8
11
|
export default useCookieStore;
|
package/store/cookies.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cookies.d.ts","sourceRoot":"","sources":["../src/store/cookies.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,WAAW;IAC1B,eAAe,EAAE,OAAO,CAAA;IACxB,uBAAuB,EAAE,OAAO,CAAA;IAChC,kBAAkB,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAC/C,0BAA0B,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;
|
|
1
|
+
{"version":3,"file":"cookies.d.ts","sourceRoot":"","sources":["../src/store/cookies.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,WAAW;IAC1B,eAAe,EAAE,OAAO,CAAA;IACxB,uBAAuB,EAAE,OAAO,CAAA;IAChC,kBAAkB,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAC/C,0BAA0B,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IACvD,SAAS,EAAE,OAAO,CAAA;IAClB,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,QAAA,MAAM,cAAc,0EAyBlB,CAAA;AAEF,eAAe,cAAc,CAAA"}
|
package/store/cookies.js
CHANGED
|
@@ -1,25 +1,28 @@
|
|
|
1
1
|
import { create } from 'zustand';
|
|
2
2
|
import Cookies from 'js-cookie';
|
|
3
|
-
const
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
cookiesAccepted: accepted
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
})
|
|
3
|
+
const useCookieStore = create()((set) => {
|
|
4
|
+
const cookiesAccepted = !!Cookies.get('accepted-cookies') || false;
|
|
5
|
+
const trackingCookiesAccepted = !!Cookies.get('accepted-tracking-cookies') || false;
|
|
6
|
+
return {
|
|
7
|
+
cookiesAccepted,
|
|
8
|
+
trackingCookiesAccepted,
|
|
9
|
+
setCookiesAccepted: (accepted) => {
|
|
10
|
+
Cookies.set('accepted-cookies', accepted.toString(), {
|
|
11
|
+
expires: 30,
|
|
12
|
+
});
|
|
13
|
+
return set((state) => ({ cookiesAccepted: accepted }));
|
|
14
|
+
},
|
|
15
|
+
setTrackingCookiesAccepted: (accepted) => {
|
|
16
|
+
Cookies.set('accepted-tracking-cookies', accepted.toString(), {
|
|
17
|
+
expires: 30,
|
|
18
|
+
});
|
|
19
|
+
return set((state) => ({
|
|
20
|
+
trackingCookiesAccepted: accepted,
|
|
21
|
+
}));
|
|
22
|
+
},
|
|
23
|
+
popupOpen: false,
|
|
24
|
+
openPopup: () => set({ popupOpen: true }),
|
|
25
|
+
closePopup: () => set({ popupOpen: false }),
|
|
26
|
+
};
|
|
27
|
+
});
|
|
25
28
|
export default useCookieStore;
|