@superrb/react-addons 4.0.0-8 → 4.0.0

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.
Files changed (34) hide show
  1. package/.node-version +1 -1
  2. package/components/accordion.d.ts +2 -1
  3. package/components/accordion.d.ts.map +1 -1
  4. package/components/accordion.js +4 -3
  5. package/components/form/field.d.ts.map +1 -1
  6. package/components/form/field.js +6 -1
  7. package/components/form.d.ts +1 -0
  8. package/components/form.d.ts.map +1 -1
  9. package/components/form.js +3 -2
  10. package/components/modal.d.ts.map +1 -1
  11. package/components/modal.js +13 -5
  12. package/config.d.ts +4 -0
  13. package/config.d.ts.map +1 -1
  14. package/config.js +450 -6
  15. package/hooks/use-draggable-scroll.js +11 -2
  16. package/hooks/use-escape.d.ts.map +1 -1
  17. package/hooks/use-escape.js +7 -4
  18. package/hooks/use-event-listener.d.ts +5 -6
  19. package/hooks/use-event-listener.d.ts.map +1 -1
  20. package/hooks/use-event-listener.js +13 -22
  21. package/hooks/use-hide-on-scroll.d.ts.map +1 -1
  22. package/hooks/use-hide-on-scroll.js +5 -5
  23. package/hooks/use-parallax.d.ts.map +1 -1
  24. package/hooks/use-parallax.js +5 -2
  25. package/hooks/use-slideshow.d.ts.map +1 -1
  26. package/hooks/use-slideshow.js +43 -35
  27. package/package.json +27 -25
  28. package/store/cookies.d.ts.map +1 -1
  29. package/store/cookies.js +0 -4
  30. package/store/modal.d.ts.map +1 -1
  31. package/store/modal.js +0 -4
  32. package/store/nav.d.ts.map +1 -1
  33. package/store/nav.js +0 -4
  34. package/tsconfig.tsbuildinfo +1 -1
package/hooks/use-slideshow.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-slideshow.d.ts","sourceRoot":"","sources":["../src/hooks/use-slideshow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAuB,MAAM,OAAO,CAAA;AAG7D,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,wBAAgB,YAAY,CAAC,OAAO,EAAE,gBAAgB,GAAG,OAAO,CAE/D;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,gBAAgB,GAAG,OAAO,CAK7D;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,gBAAgB,UAMzD;AAED,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,gBAAgB,EACzB,YAAY,EAAE,MAAM,GACnB,MAAM,CAkER;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAClC,SAAS,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,GAC5C,SAAS,CAqGX"}
1
+ {"version":3,"file":"use-slideshow.d.ts","sourceRoot":"","sources":["../src/hooks/use-slideshow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAuB,MAAM,OAAO,CAAA;AAG7D,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,wBAAgB,YAAY,CAAC,OAAO,EAAE,gBAAgB,GAAG,OAAO,CAE/D;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,gBAAgB,GAAG,OAAO,CAK7D;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,gBAAgB,UAMzD;AAED,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,gBAAgB,EACzB,YAAY,EAAE,MAAM,GACnB,MAAM,CAkER;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAClC,SAAS,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,GAC5C,SAAS,CA8FX"}
package/hooks/use-slideshow.js CHANGED
@@ -65,7 +65,6 @@ export function getCurrentSlideIndex(element, currentIndex) {
65
65
  export default function useSlideshow(slideshow) {
66
66
  const [currentSlide, setCurrentSlide] = useState(0);
67
67
  const [progress, setProgress] = useState(-1);
68
- const [ready, setReady] = useState(false);
69
68
  const update = () => {
70
69
  if (!slideshow.current) {
71
70
  return;
@@ -73,10 +72,9 @@ export default function useSlideshow(slideshow) {
73
72
  setCurrentSlide((current) => getCurrentSlideIndex(slideshow.current, current));
74
73
  setProgress(getScrollProgress(slideshow.current));
75
74
  };
76
- useEventListener('scroll', update, { passive: true }, slideshow.current, !!slideshow.current && ready);
77
- useEventListener('resize', update, { passive: true }, slideshow.current, !!slideshow.current && ready);
75
+ useEventListener('scroll', update, { passive: true }, slideshow);
76
+ useEventListener('resize', update, { passive: true }, slideshow);
78
77
  useEffect(() => {
79
- setReady(true);
80
78
  if (slideshow.current) {
81
79
  update();
82
80
  slideshow.current.setAttribute('role', 'region');
@@ -87,7 +85,7 @@ export default function useSlideshow(slideshow) {
87
85
  useEffect(() => {
88
86
  ;
89
87
  [...slideshow.current?.children].forEach((child) => child.setAttribute('aria-hidden', 'true'));
90
- slideshow.current?.children[currentSlide].setAttribute('aria-hidden', 'false');
88
+ slideshow.current?.children?.[currentSlide]?.setAttribute('aria-hidden', 'false');
91
89
  }, [currentSlide, slideshow]);
92
90
  return {
93
91
  slideshowRef: slideshow,
@@ -95,37 +93,47 @@ export default function useSlideshow(slideshow) {
95
93
  slideCount: slideshow.current?.children.length || 0,
96
94
  goTo(index) {
97
95
  index = Math.min(slideshow.current?.children.length - 1, Math.max(0, index));
98
- const newElement = slideshow.current?.children[index];
99
- newElement.scrollIntoView({
100
- behavior: 'smooth',
101
- block: isHorizontal(slideshow.current)
102
- ? 'nearest'
103
- : isCentered(slideshow.current)
104
- ? 'center'
105
- : 'start',
106
- inline: isHorizontal(slideshow.current)
107
- ? isCentered(slideshow.current)
108
- ? 'center'
109
- : 'start'
110
- : 'nearest',
111
- });
112
- // const scrollOpts: ScrollToOptions = {
96
+ const newElement = slideshow.current?.children?.[index];
97
+ // newElement.scrollIntoView({
113
98
  // behavior: 'smooth',
114
- // }
115
- // if (isHorizontal(slideshow.current)) {
116
- // if (isCentered(slideshow.current)) {
117
- // scrollOpts.left = newElement?.offsetLeft + newElement?.clientWidth / 2
118
- // } else {
119
- // scrollOpts.left = newElement?.offsetLeft
120
- // }
121
- // } else {
122
- // if (isCentered(slideshow.current)) {
123
- // scrollOpts.top = newElement?.offsetTop + newElement?.clientHeight / 2
124
- // } else {
125
- // scrollOpts.top = newElement?.offsetTop
126
- // }
127
- // }
128
- // slideshow.current?.scrollTo(scrollOpts)
99
+ // block: isHorizontal(slideshow.current)
100
+ // ? 'nearest'
101
+ // : isCentered(slideshow.current)
102
+ // ? 'center'
103
+ // : 'start',
104
+ // inline: isHorizontal(slideshow.current)
105
+ // ? isCentered(slideshow.current)
106
+ // ? 'center'
107
+ // : 'start'
108
+ // : 'nearest',
109
+ // })
110
+ const scrollOpts = {
111
+ behavior: 'smooth',
112
+ };
113
+ const horizontal = isHorizontal(slideshow.current);
114
+ const styles = window.getComputedStyle(slideshow.current);
115
+ const padding = horizontal
116
+ ? parseInt(styles.paddingLeft)
117
+ : parseInt(styles.paddingTop);
118
+ if (isHorizontal(slideshow.current)) {
119
+ if (isCentered(slideshow.current)) {
120
+ scrollOpts.left =
121
+ newElement?.offsetLeft + newElement?.clientWidth / 2 - padding;
122
+ }
123
+ else {
124
+ scrollOpts.left = newElement?.offsetLeft - padding;
125
+ }
126
+ }
127
+ else {
128
+ if (isCentered(slideshow.current)) {
129
+ scrollOpts.top =
130
+ newElement?.offsetTop + newElement?.clientHeight / 2 - padding;
131
+ }
132
+ else {
133
+ scrollOpts.top = newElement?.offsetTop - padding;
134
+ }
135
+ }
136
+ slideshow.current?.scrollTo(scrollOpts);
129
137
  },
130
138
  atStart: progress <= 0 || progress === -1,
131
139
  atEnd: progress >= 1 || progress === -1,
package/package.json CHANGED
@@ -1,28 +1,28 @@
1
1
  {
2
2
  "name": "@superrb/react-addons",
3
3
  "type": "module",
4
- "version": "4.0.0-8",
4
+ "version": "4.0.0",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
7
7
  "repository": "https://github.com/superrbstudio/react-addons",
8
8
  "author": "@molovo",
9
9
  "license": "MIT",
10
10
  "dependencies": {
11
- "@hookform/resolvers": "^3.3.1",
12
- "change-case": "^5.0.0",
11
+ "@hookform/resolvers": "^3.10.0",
12
+ "change-case": "^5.4.4",
13
13
  "install-peers-cli": "^2.2.0",
14
14
  "js-cookie": "^3.0.5",
15
- "react-google-recaptcha-v3": "^1.10.1",
16
- "react-hook-form": "^7.46.1",
17
- "react-use-draggable-scroll": "^0.4.7",
18
- "simple-zustand-devtools": "^1.1.0"
15
+ "react-google-recaptcha-v3": "^1.11.0",
16
+ "react-hook-form": "^7.71.2",
17
+ "react-use-draggable-scroll": "^0.4.7"
19
18
  },
20
19
  "peerDependencies": {
21
20
  "csp-header": "^6.1.0",
22
21
  "react": "^19.1.0",
23
22
  "typescript": "^5.2.2",
23
+ "usehooks-ts": "^3.1.1",
24
24
  "yup": "^1.4.0",
25
- "zustand": "^4.4.7"
25
+ "zustand": "^5.0.5"
26
26
  },
27
27
  "scripts": {
28
28
  "build": "tsc",
@@ -31,24 +31,26 @@
31
31
  "dev": "watch 'yarn build' ./src"
32
32
  },
33
33
  "devDependencies": {
34
- "@types/js-cookie": "^3.0.3",
35
- "@types/node": "^20.5.7",
36
- "@types/react": "^19.1.0",
37
- "csp-header": "^6.1.0",
38
- "eslint": "^8.50.0",
39
- "eslint-config-next": "^13.5.3",
40
- "eslint-config-prettier": "^9.0.0",
41
- "eslint-plugin-jsx-a11y": "^6.7.1",
42
- "eslint-plugin-react": "^7.33.2",
43
- "eslint-plugin-react-hooks": "^4.6.0",
44
- "prettier": "^3.2.2",
45
- "react": "^19.1.0",
46
- "typescript": "^5.2.2",
47
- "typescript-eslint": "^0.0.1-alpha.0",
34
+ "@types/js-cookie": "^3.0.6",
35
+ "@types/node": "^24.11.0",
36
+ "@types/react": "^19.2.14",
37
+ "csp-header": "^6.3.0",
38
+ "eslint": "10.0.2",
39
+ "eslint-config-next": "^16.1.6",
40
+ "eslint-config-prettier": "^10.1.8",
41
+ "eslint-plugin-jsx-a11y": "^6.10.2",
42
+ "eslint-plugin-react": "^7.37.5",
43
+ "eslint-plugin-react-hooks": "^7.0.1",
44
+ "prettier": "^3.8.1",
45
+ "react": "^19.2.4",
46
+ "react-dom": "^19.2.4",
47
+ "typescript": "^5.9.3",
48
+ "typescript-eslint": "^8.56.1",
49
+ "usehooks-ts": "^3.1.1",
48
50
  "watch": "^1.0.2",
49
- "yup": "^1.4.0",
50
- "zustand": "^4.4.7"
51
+ "yup": "^1.7.1",
52
+ "zustand": "^5.0.11"
51
53
  },
52
- "packageManager": "yarn@4.9.1",
54
+ "packageManager": "yarn@4.12.0",
53
55
  "stableVersion": "3.0.0"
54
56
  }
package/store/cookies.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"cookies.d.ts","sourceRoot":"","sources":["../src/store/cookies.ts"],"names":[],"mappings":"AAIA,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;AAMF,eAAe,cAAc,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,5 +1,4 @@
1
1
  import { create } from 'zustand';
2
- import { mountStoreDevtool } from 'simple-zustand-devtools';
3
2
  import Cookies from 'js-cookie';
4
3
  const useCookieStore = create()((set) => {
5
4
  const cookiesAccepted = !!Cookies.get('accepted-cookies') || false;
@@ -26,7 +25,4 @@ const useCookieStore = create()((set) => {
26
25
  closePopup: () => set({ popupOpen: false }),
27
26
  };
28
27
  });
29
- if (process.env.NODE_ENV === 'development') {
30
- mountStoreDevtool('CookieStore', useCookieStore);
31
- }
32
28
  export default useCookieStore;
package/store/modal.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../src/store/modal.ts"],"names":[],"mappings":"AAGA,UAAU,UAAU;IAClB,SAAS,EAAE;QACT,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;KACvB,CAAA;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAA;IACjC,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,QAAA,MAAM,aAAa,yEASjB,CAAA;AAMF,eAAe,aAAa,CAAA"}
1
+ {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../src/store/modal.ts"],"names":[],"mappings":"AAGA,UAAU,UAAU;IAClB,SAAS,EAAE;QACT,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;KACvB,CAAA;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAA;IACjC,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,QAAA,MAAM,aAAa,yEASjB,CAAA;AAEF,eAAe,aAAa,CAAA"}
package/store/modal.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import { create } from 'zustand';
2
- import { mountStoreDevtool } from 'simple-zustand-devtools';
3
2
  const useModalStore = create()((set, get) => {
4
3
  return {
5
4
  openState: {},
@@ -8,7 +7,4 @@ const useModalStore = create()((set, get) => {
8
7
  closeModal: (name) => set((state) => ({ openState: { ...state.openState, [name]: false } })),
9
8
  };
10
9
  });
11
- if (process.env.NODE_ENV === 'development') {
12
- mountStoreDevtool('ModalStore', useModalStore);
13
- }
14
10
  export default useModalStore;
package/store/nav.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"nav.d.ts","sourceRoot":"","sources":["../src/store/nav.ts"],"names":[],"mappings":"AAGA,UAAU,QAAQ;IAChB,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,QAAA,MAAM,WAAW,uEAKd,CAAA;AAMH,eAAe,WAAW,CAAA"}
1
+ {"version":3,"file":"nav.d.ts","sourceRoot":"","sources":["../src/store/nav.ts"],"names":[],"mappings":"AAEA,UAAU,QAAQ;IAChB,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,QAAA,MAAM,WAAW,uEAKd,CAAA;AAEH,eAAe,WAAW,CAAA"}
package/store/nav.js CHANGED
@@ -1,12 +1,8 @@
1
1
  import { create } from 'zustand';
2
- import { mountStoreDevtool } from 'simple-zustand-devtools';
3
2
  const useNavStore = create()((set) => ({
4
3
  navOpen: false,
5
4
  toggleNav: () => set((state) => ({ navOpen: !state.navOpen })),
6
5
  openNav: () => set({ navOpen: true }),
7
6
  closeNav: () => set({ navOpen: false }),
8
7
  }));
9
- if (process.env.NODE_ENV === 'development') {
10
- mountStoreDevtool('NavStore', useNavStore);
11
- }
12
8
  export default useNavStore;