@websolutespa/bom-mixer-hooks 0.2.2 → 1.1.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @websolutespa/bom-mixer-hooks
 
+## 1.1.0
+
+### Minor Changes
+
+- Modified: useHttp, useApi.
+
+## 1.0.0
+
+### Minor Changes
+
+- Added: useScrolled.
+
 ## 0.2.2
 
 ### Patch Changes

package/dist/index.d.ts

@@ -1,24 +1,26 @@
 import * as React$1 from 'react';
 import React__default, { RefObject, Dispatch, SetStateAction, MutableRefObject, ComponentProps, useEffect } from 'react';
-import { FetchRequestOptions, ISchema, IEquatable, ILayout, IPage } from '@websolutespa/bom-core';
+import { ApiRequestOptions } from '@websolutespa/bom-mixer-store';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as zustand_middleware from 'zustand/middleware';
 import { StateStorage } from 'zustand/middleware';
 import * as zustand from 'zustand';
+import { ISchema, IEquatable, ILayout, IPage } from '@websolutespa/bom-core';
 import { ICartItem, ICartAddItem, IAddressOptions, ICheckoutPartial, IFeatureType, IUser } from '@websolutespa/bom-mixer-models';
 import { NextRouter } from 'next/router';
 
-declare function useApiFetch<T = any>(pathname: string, options?: FetchRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
-declare function useApiGet<T = any>(pathname: string, options?: FetchRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
-declare function useApiPost<T = any>(pathname: string, payload: unknown, options?: FetchRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
-declare function useApiPut<T = any>(pathname: string, payload: unknown, options?: FetchRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
-declare function useApiPatch<T = any>(pathname: string, payload: unknown, options?: FetchRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
-declare function useApiDelete<T = any>(pathname: string, options?: FetchRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
+declare function useApiFetch<T = unknown>(pathname: string, options?: ApiRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
+declare function useApiGet<T = unknown>(pathname: string, options?: ApiRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
+declare function useApiPost<T = unknown>(pathname: string, payload: unknown, options?: ApiRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
+declare function useApiPut<T = unknown>(pathname: string, payload: unknown, options?: ApiRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
+declare function useApiPatch<T = unknown>(pathname: string, payload: unknown, options?: ApiRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
+declare function useApiDelete<T = unknown>(pathname: string, options?: ApiRequestOptions): [T | undefined, boolean, any, React$1.Dispatch<any>];
 type Api = {
-    get: <T = any>(pathname: string, options?: FetchRequestOptions) => Promise<T>;
-    post: <T = any>(pathname: string, payload?: unknown, options?: FetchRequestOptions) => Promise<T>;
-    put: <T = any>(pathname: string, payload?: unknown, options?: FetchRequestOptions) => Promise<T>;
-    patch: <T = any>(pathname: string, payload?: unknown, options?: FetchRequestOptions) => Promise<T>;
-    delete: <T = any>(pathname: string, options?: FetchRequestOptions) => Promise<T>;
+    get: <T = unknown>(pathname: string, options?: ApiRequestOptions) => Promise<T>;
+    post: <T = unknown>(pathname: string, payload?: unknown, options?: ApiRequestOptions) => Promise<T>;
+    put: <T = unknown>(pathname: string, payload?: unknown, options?: ApiRequestOptions) => Promise<T>;
+    patch: <T = unknown>(pathname: string, payload?: unknown, options?: ApiRequestOptions) => Promise<T>;
+    delete: <T = unknown>(pathname: string, options?: ApiRequestOptions) => Promise<T>;
 };
 declare function useApi(): Api;
 
@@ -73,8 +75,8 @@ type CartProviderProps = React.PropsWithChildren<{
     items?: ICartItem[];
     storage?: StateStorage;
 }>;
-declare function CartProvider({ children, ...props }: CartProviderProps): JSX.Element;
-declare function useCart<T>(selector: (state: CartState) => T, equalityFn?: (left: T, right: T) => boolean): T;
+declare function CartProvider({ children, ...props }: CartProviderProps): react_jsx_runtime.JSX.Element;
+declare function useCart<T>(selector: (state: CartState) => T): T;
 
 type CheckoutProps = {
     hydrated: boolean;
@@ -103,8 +105,8 @@ type CheckoutProviderProps = React.PropsWithChildren<{
     checkout?: ICheckoutPartial;
     storage?: StateStorage;
 }>;
-declare function CheckoutProvider({ children, ...props }: CheckoutProviderProps): JSX.Element;
-declare function useCheckout<T>(selector: (state: CheckoutState) => T, equalityFn?: (left: T, right: T) => boolean): T;
+declare function CheckoutProvider({ children, ...props }: CheckoutProviderProps): react_jsx_runtime.JSX.Element;
+declare function useCheckout<T>(selector: (state: CheckoutState) => T): T;
 
 declare function useClickAnyWhere(handler: (event: MouseEvent) => void): void;
 
@@ -375,7 +377,7 @@ type ILabelContext = (key: string, params?: {
 declare const useLabel: () => ILabelContext;
 declare function LabelProvider({ children }: {
     children?: React__default.ReactNode;
-}): JSX.Element;
+}): react_jsx_runtime.JSX.Element;
 declare function parseParams(label: string, params: {
     [key: string]: any;
 }): string;
@@ -385,7 +387,7 @@ declare const useLayout: () => ILayout;
 declare function LayoutProvider({ children, layout }: {
     children?: React__default.ReactNode;
     layout: ILayout;
-}): JSX.Element;
+}): react_jsx_runtime.JSX.Element;
 
 declare function useModal(): [modal: UIValue, open: (value?: string) => void, close: () => void];
 
@@ -398,7 +400,7 @@ declare const usePage: () => NonNullable<IPage>;
 declare function PageProvider({ children, page }: {
     children?: React__default.ReactNode;
     page: IPage;
-}): JSX.Element;
+}): react_jsx_runtime.JSX.Element;
 
 type IPaginationInfo<T> = {
     items: T[];
@@ -436,6 +438,13 @@ declare function getRealSize(element: HTMLElement | null): SizeType;
 
 declare function useResize(callback: () => unknown, immediate?: boolean): void;
 
+type SSRState = {
+    isBrowser: boolean;
+    isServer: boolean;
+};
+declare const detectIsBrowser: () => boolean;
+declare function useSSR(): SSRState;
+
 type Scroll = {
     left: number;
     top: number;
@@ -447,6 +456,8 @@ declare function scrollToSelector(selector?: string, offset?: number): void;
 declare function scrollToRelativeY(y?: number, offset?: number): void;
 declare function scrollToY(y?: number): void;
 
+declare function useScrolled(callback?: (top: number, left: number) => boolean): boolean;
+
 declare const isBrowser: boolean;
 declare function getSearchParams(url: string, key?: string): IParams | string | null;
 declare function updateSearchParams(currentPath: string, params: IParams): {
@@ -504,13 +515,6 @@ declare function useSorting<T>(items_: T[], callback_: (items: T[], sort?: IEqua
     setSort: (sort?: IEquatable) => void;
 };
 
-type SSRState = {
-    isBrowser: boolean;
-    isServer: boolean;
-};
-declare const detectIsBrowser: () => boolean;
-declare function useSSR(): SSRState;
-
 declare function useSwiperIndex(): [number, (index: number) => void];
 
 /**
@@ -548,4 +552,4 @@ type WindowSize = {
 };
 declare function useWindowSize(): WindowSize;
 
-export { BodyScrollOptions, CartContext, CartProvider, CheckoutContext, CheckoutProvider, ClickOutGetContainer, CurrentStateType, ElementStackItem, Filter, FilterMode, FilterParams, FilterValues, GeoLocationSensorState, IFilter, IFilterOption, IGeolocationPositionError, ILabelContext, ILayoutContext, IPageContext, IPaginationInfo, IParams, IParamsEncoded, IUseSearchParamsEncodedResult, IUseSearchParamsResult, IUseSearchParamsValueResult, KeyCode, KeyMod, KeyboardOptions, KeyboardResult, LabelProvider, LayoutProvider, PageProvider, SSRState, SizeResult, SizeType, Sorting, UIReducer, UIValue, UseFiltersResultType, UseKeyboard, UseKeyboardHandler, createElementWithId, createGenericContext, decode, detectIsBrowser, filtersToParams, getCurrentPosition, getFilteredItems, getFilters, getOwnerPaddingRight, getOwnerScrollbarWidth, getPagedItems, getRealSize, getSearchParams, getSearchParamsEncoded, getUID, hasGeolocation, isBrowser, parseParams, pushSearchParams, pushSearchParamsEncoded, replaceSearchParams, replaceSearchParamsEncoded, replaceSearchParamsEncodedSilently, replaceSearchParamsSilently, scrollToRelativeY, scrollToSelector, scrollToY, setFilters, updateSearchParams, updateSearchParamsEncoded, useApi, useApiDelete, useApiFetch, useApiGet, useApiPatch, useApiPost, useApiPut, useBodyScroll, useBreakpoint, useCart, useCheckout, useClickAnyWhere, useClickOut, useCurrency, useCurrentState, useDateTimeFormat, useDebounce, useDebounceCallback, useDebugChangedProps, useDomObserver, useDrawer, useElementSize, useEventListener, useFilters, useGeolocation, useIdle, useInfiniteLoader, useIsomorphicLayoutEffect, useKeyboard, useLabel, useLayout, useModal, useMounted, useNumber, usePage, usePagination, usePortal, usePrevious, useRealSize, useResize, useSSR, useScroll, useScrollTo, useSearchParams, useSearchParamsEncoded, useSearchParamsValue, useSorting, useSwiperIndex, useSyncedRef, useUI, useUnit, useUnmountEffect, useUser, useWindowSize };
+export { BodyScrollOptions, CartContext, CartProvider, CheckoutContext, CheckoutProvider, ClickOutGetContainer, CurrentStateType, ElementStackItem, Filter, FilterMode, FilterParams, FilterValues, GeoLocationSensorState, IFilter, IFilterOption, IGeolocationPositionError, ILabelContext, ILayoutContext, IPageContext, IPaginationInfo, IParams, IParamsEncoded, IUseSearchParamsEncodedResult, IUseSearchParamsResult, IUseSearchParamsValueResult, KeyCode, KeyMod, KeyboardOptions, KeyboardResult, LabelProvider, LayoutProvider, PageProvider, SSRState, SizeResult, SizeType, Sorting, UIReducer, UIValue, UseFiltersResultType, UseKeyboard, UseKeyboardHandler, createElementWithId, createGenericContext, decode, detectIsBrowser, filtersToParams, getCurrentPosition, getFilteredItems, getFilters, getOwnerPaddingRight, getOwnerScrollbarWidth, getPagedItems, getRealSize, getSearchParams, getSearchParamsEncoded, getUID, hasGeolocation, isBrowser, parseParams, pushSearchParams, pushSearchParamsEncoded, replaceSearchParams, replaceSearchParamsEncoded, replaceSearchParamsEncodedSilently, replaceSearchParamsSilently, scrollToRelativeY, scrollToSelector, scrollToY, setFilters, updateSearchParams, updateSearchParamsEncoded, useApi, useApiDelete, useApiFetch, useApiGet, useApiPatch, useApiPost, useApiPut, useBodyScroll, useBreakpoint, useCart, useCheckout, useClickAnyWhere, useClickOut, useCurrency, useCurrentState, useDateTimeFormat, useDebounce, useDebounceCallback, useDebugChangedProps, useDomObserver, useDrawer, useElementSize, useEventListener, useFilters, useGeolocation, useIdle, useInfiniteLoader, useIsomorphicLayoutEffect, useKeyboard, useLabel, useLayout, useModal, useMounted, useNumber, usePage, usePagination, usePortal, usePrevious, useRealSize, useResize, useSSR, useScroll, useScrollTo, useScrolled, useSearchParams, useSearchParamsEncoded, useSearchParamsValue, useSorting, useSwiperIndex, useSyncedRef, useUI, useUnit, useUnmountEffect, useUser, useWindowSize };

package/dist/index.js

@@ -153,6 +153,7 @@ __export(src_exports, {
   useSSR: () => useSSR,
   useScroll: () => useScroll,
   useScrollTo: () => useScrollTo,
+  useScrolled: () => useScrolled,
   useSearchParams: () => useSearchParams,
   useSearchParamsEncoded: () => useSearchParamsEncoded,
   useSearchParamsValue: () => useSearchParamsValue,
@@ -218,7 +219,7 @@ function LayoutProvider({ children, layout }) {
 // src/useApi/useApi.ts
 function useApiFetch(pathname, options = {}) {
   const layout = useLayout();
-  return useHttpFetch(pathname, options, import_bom_mixer_store.apiFetch, layout);
+  return useHttpFetch(pathname, options, import_bom_mixer_store.localApiFetch, layout);
 }
 function useApiGet(pathname, options = {}) {
   return useApiFetch(pathname, __spreadProps(__spreadValues({}, options), { method: "GET" }));
@@ -239,19 +240,19 @@ function useApi() {
   const layout = useLayout();
   return {
     get: (_0, ..._1) => __async(this, [_0, ..._1], function* (pathname, options = {}) {
-      return (0, import_bom_mixer_store.apiGet)(pathname, options, layout);
+      return (0, import_bom_mixer_store.localApiGet)(pathname, options, layout);
     }),
     post: (_0, _1, ..._2) => __async(this, [_0, _1, ..._2], function* (pathname, payload, options = {}) {
-      return (0, import_bom_mixer_store.apiPost)(pathname, payload, options, layout);
+      return (0, import_bom_mixer_store.localApiPost)(pathname, payload, options, layout);
     }),
     put: (_0, _1, ..._2) => __async(this, [_0, _1, ..._2], function* (pathname, payload, options = {}) {
-      return (0, import_bom_mixer_store.apiPut)(pathname, payload, options, layout);
+      return (0, import_bom_mixer_store.localApiPut)(pathname, payload, options, layout);
     }),
     patch: (_0, _1, ..._2) => __async(this, [_0, _1, ..._2], function* (pathname, payload, options = {}) {
-      return (0, import_bom_mixer_store.apiPatch)(pathname, payload, options, layout);
+      return (0, import_bom_mixer_store.localApiPatch)(pathname, payload, options, layout);
     }),
     delete: (_0, ..._1) => __async(this, [_0, ..._1], function* (pathname, options = {}) {
-      return (0, import_bom_mixer_store.apiDelete)(pathname, options, layout);
+      return (0, import_bom_mixer_store.localApiDelete)(pathname, options, layout);
     })
   };
 }
@@ -488,11 +489,11 @@ function CartProvider(_a) {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CartContext.Provider, { value: storeRef.current, children });
 }
-function useCart(selector, equalityFn) {
+function useCart(selector) {
   const store = (0, import_react8.useContext)(CartContext);
   if (!store)
     throw new Error("Missing CartContext.Provider in the tree");
-  return (0, import_zustand.useStore)(store, selector, equalityFn);
+  return (0, import_zustand.useStore)(store, selector);
 }
 
 // src/useCheckout/useCheckout.tsx
@@ -548,11 +549,11 @@ function CheckoutProvider(_a) {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CheckoutContext.Provider, { value: storeRef.current, children });
 }
-function useCheckout(selector, equalityFn) {
+function useCheckout(selector) {
   const store = (0, import_react9.useContext)(CheckoutContext);
   if (!store)
     throw new Error("Missing CheckoutContext.Provider in the tree");
-  return (0, import_zustand2.useStore)(store, selector, equalityFn);
+  return (0, import_zustand2.useStore)(store, selector);
 }
 
 // src/useClickAnyWhere/useClickAnyWhere.ts
@@ -1523,8 +1524,8 @@ var import_react30 = require("react");
 function useScroll() {
   const [scroll, setScroll] = (0, import_react30.useState)({ left: 0, top: 0 });
   const onScroll = () => {
-    const left = window.pageXOffset;
-    const top = window.pageYOffset;
+    const left = window.scrollX;
+    const top = window.scrollY;
     if (scroll.left !== left || scroll.top !== top) {
       setScroll({ left, top });
     }
@@ -1558,11 +1559,11 @@ function scrollToSelector(selector, offset = 0) {
   }
 }
 function scrollToRelativeY(y = 0, offset = 0) {
-  const to = window.pageYOffset + y - 60 + offset;
+  const to = window.scrollY + y - 60 + offset;
   return scrollToY(to);
 }
 function scrollToY(y = 0) {
-  const from = window.pageYOffset;
+  const from = window.scrollY;
   const to = y;
   const duration = Math.sqrt(Math.abs(to - from) / 4e3);
   (0, import_framer_motion.animate)(from, to, {
@@ -1571,9 +1572,29 @@ function scrollToY(y = 0) {
   });
 }
 
+// src/useScrolled/useScrolled.ts
+var import_react31 = require("react");
+var DEFAULT_CALLBACK = (top, left) => {
+  return top > 0;
+};
+function useScrolled(callback = DEFAULT_CALLBACK) {
+  const [scrolled, setScrolled] = (0, import_react31.useState)(false);
+  const onScrolled = () => {
+    const scrolled_ = callback(window.scrollY, window.scrollX);
+    if (scrolled !== scrolled_) {
+      setScrolled(scrolled_);
+    }
+  };
+  useEventListener("scroll", onScrolled);
+  useIsomorphicLayoutEffect(() => {
+    onScrolled();
+  }, []);
+  return scrolled;
+}
+
 // src/useSearchParams/useSearchParams.ts
 var import_router = require("next/router");
-var import_react31 = require("react");
+var import_react32 = require("react");
 var isBrowser = typeof window !== "undefined";
 function replace_(params) {
   if (window.history) {
@@ -1632,29 +1653,29 @@ function replaceSearchParamsSilently(params) {
 }
 function useSearchParams() {
   const router = (0, import_router.useRouter)();
-  const initialValue = (0, import_react31.useMemo)(() => {
+  const initialValue = (0, import_react32.useMemo)(() => {
     const params2 = deserialize_(router.asPath);
     const value = Object.fromEntries(params2);
     return value;
   }, [router.asPath]);
   const params = initialValue;
-  const replaceParamsSilently = (0, import_react31.useCallback)((params2) => {
+  const replaceParamsSilently = (0, import_react32.useCallback)((params2) => {
     replaceSearchParamsSilently(params2);
   }, []);
-  const replaceParams = (0, import_react31.useCallback)((params2) => {
+  const replaceParams = (0, import_react32.useCallback)((params2) => {
     replaceSearchParams(router, params2);
   }, [router]);
   return { params, replaceParamsSilently, replaceParams };
 }
 function useSearchParamsValue(key) {
   const router = (0, import_router.useRouter)();
-  const initialValue = (0, import_react31.useMemo)(() => {
+  const initialValue = (0, import_react32.useMemo)(() => {
     const params2 = deserialize_(router.asPath);
     const value = params2.get(key);
     return value;
   }, [key, router.asPath]);
   const params = initialValue;
-  const replaceParamsSilently = (0, import_react31.useCallback)((params2) => {
+  const replaceParamsSilently = (0, import_react32.useCallback)((params2) => {
     replaceSearchParamsSilently(params2);
   }, []);
   return { params, replaceParamsSilently };
@@ -1662,7 +1683,7 @@ function useSearchParamsValue(key) {
 
 // src/useSearchParamsEncoded/useSearchParamsEncoded.ts
 var import_router2 = require("next/router");
-var import_react32 = require("react");
+var import_react33 = require("react");
 var USE_ENCRYPTION = true;
 function base64ToString(base64) {
   if (!USE_ENCRYPTION)
@@ -1768,27 +1789,27 @@ function replaceSearchParamsEncodedSilently(value, key) {
 }
 function useSearchParamsEncoded(key) {
   const router = (0, import_router2.useRouter)();
-  const initialValue = (0, import_react32.useMemo)(() => {
+  const initialValue = (0, import_react33.useMemo)(() => {
     const value = getSearchParamsEncoded(router.asPath, key);
     return value;
   }, [key, router.asPath]);
   const params = initialValue;
-  const replaceParamsSilently = (0, import_react32.useCallback)((params2) => {
+  const replaceParamsSilently = (0, import_react33.useCallback)((params2) => {
     replaceSearchParamsEncodedSilently(params2, key);
   }, [key]);
-  const replaceParams = (0, import_react32.useCallback)((params2) => {
+  const replaceParams = (0, import_react33.useCallback)((params2) => {
     replaceSearchParamsEncoded(router, params2, key);
   }, [key, router]);
   return { params, replaceParamsSilently, replaceParams };
 }
 
 // src/useSorting/useSorting.ts
-var import_react33 = require("react");
+var import_react34 = require("react");
 function useSorting(items_, callback_, sort_) {
-  const [sort, setSort] = (0, import_react33.useState)(sort_);
-  const [items, setItems] = (0, import_react33.useState)(callback_(items_.slice(), sort));
-  const isInitialMount = (0, import_react33.useRef)(true);
-  (0, import_react33.useEffect)(() => {
+  const [sort, setSort] = (0, import_react34.useState)(sort_);
+  const [items, setItems] = (0, import_react34.useState)(callback_(items_.slice(), sort));
+  const isInitialMount = (0, import_react34.useRef)(true);
+  (0, import_react34.useEffect)(() => {
     if (isInitialMount.current) {
       isInitialMount.current = false;
     } else {
@@ -1804,18 +1825,18 @@ function useSorting(items_, callback_, sort_) {
 }
 
 // src/useSwiperIndex/useSwiperIndex.ts
-var import_react34 = require("react");
-var import_react35 = require("swiper/react");
+var import_react35 = require("react");
+var import_react36 = require("swiper/react");
 function useSwiperIndex() {
-  const swiper = (0, import_react35.useSwiper)();
-  const [index, setIndex] = (0, import_react34.useState)(swiper.realIndex);
-  const slideTo = (0, import_react34.useCallback)((index2) => {
+  const swiper = (0, import_react36.useSwiper)();
+  const [index, setIndex] = (0, import_react35.useState)(swiper.realIndex);
+  const slideTo = (0, import_react35.useCallback)((index2) => {
     swiper.slideTo(index2);
   }, [swiper]);
   const onSlideChange = (swiper2) => {
     setIndex(swiper2.realIndex);
   };
-  (0, import_react34.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (swiper) {
       swiper.on("slideChange", onSlideChange);
     }
@@ -1829,11 +1850,11 @@ function useSwiperIndex() {
 }
 
 // src/useSyncedRef/useSyncedRef.ts
-var import_react36 = require("react");
+var import_react37 = require("react");
 function useSyncedRef(value) {
-  const ref = (0, import_react36.useRef)(value);
+  const ref = (0, import_react37.useRef)(value);
   ref.current = value;
-  return (0, import_react36.useMemo)(() => Object.freeze({
+  return (0, import_react37.useMemo)(() => Object.freeze({
     get current() {
       return ref.current;
     }
@@ -1846,10 +1867,10 @@ function useUnit(unit = "kilometer", locale) {
 }
 
 // src/useUnmountEffect/useUnmountEffect.ts
-var import_react37 = require("react");
+var import_react38 = require("react");
 function useUnmountEffect(effect) {
   const effectRef = useSyncedRef(effect);
-  (0, import_react37.useEffect)(() => () => {
+  (0, import_react38.useEffect)(() => () => {
     effectRef.current();
   }, []);
 }
@@ -1947,6 +1968,7 @@ var useUser = (0, import_zustand4.create)((set) => ({
   useSSR,
   useScroll,
   useScrollTo,
+  useScrolled,
   useSearchParams,
   useSearchParamsEncoded,
   useSearchParamsValue,

package/dist/index.mjs

@@ -51,7 +51,7 @@ var __async = (__this, __arguments, generator) => {
 };
 
 // src/useApi/useApi.ts
-import { apiDelete, apiFetch, apiGet, apiPatch, apiPost, apiPut } from "@websolutespa/bom-mixer-store";
+import { localApiDelete, localApiFetch, localApiGet, localApiPatch, localApiPost, localApiPut } from "@websolutespa/bom-mixer-store";
 
 // src/useHttp/useHttp.ts
 import { httpFetch } from "@websolutespa/bom-core";
@@ -101,7 +101,7 @@ function LayoutProvider({ children, layout }) {
 // src/useApi/useApi.ts
 function useApiFetch(pathname, options = {}) {
   const layout = useLayout();
-  return useHttpFetch(pathname, options, apiFetch, layout);
+  return useHttpFetch(pathname, options, localApiFetch, layout);
 }
 function useApiGet(pathname, options = {}) {
   return useApiFetch(pathname, __spreadProps(__spreadValues({}, options), { method: "GET" }));
@@ -122,19 +122,19 @@ function useApi() {
   const layout = useLayout();
   return {
     get: (_0, ..._1) => __async(this, [_0, ..._1], function* (pathname, options = {}) {
-      return apiGet(pathname, options, layout);
+      return localApiGet(pathname, options, layout);
     }),
     post: (_0, _1, ..._2) => __async(this, [_0, _1, ..._2], function* (pathname, payload, options = {}) {
-      return apiPost(pathname, payload, options, layout);
+      return localApiPost(pathname, payload, options, layout);
     }),
     put: (_0, _1, ..._2) => __async(this, [_0, _1, ..._2], function* (pathname, payload, options = {}) {
-      return apiPut(pathname, payload, options, layout);
+      return localApiPut(pathname, payload, options, layout);
     }),
     patch: (_0, _1, ..._2) => __async(this, [_0, _1, ..._2], function* (pathname, payload, options = {}) {
-      return apiPatch(pathname, payload, options, layout);
+      return localApiPatch(pathname, payload, options, layout);
     }),
     delete: (_0, ..._1) => __async(this, [_0, ..._1], function* (pathname, options = {}) {
-      return apiDelete(pathname, options, layout);
+      return localApiDelete(pathname, options, layout);
     })
   };
 }
@@ -371,11 +371,11 @@ function CartProvider(_a) {
   }
   return /* @__PURE__ */ jsx2(CartContext.Provider, { value: storeRef.current, children });
 }
-function useCart(selector, equalityFn) {
+function useCart(selector) {
   const store = useContext3(CartContext);
   if (!store)
     throw new Error("Missing CartContext.Provider in the tree");
-  return useStore(store, selector, equalityFn);
+  return useStore(store, selector);
 }
 
 // src/useCheckout/useCheckout.tsx
@@ -431,11 +431,11 @@ function CheckoutProvider(_a) {
   }
   return /* @__PURE__ */ jsx3(CheckoutContext.Provider, { value: storeRef.current, children });
 }
-function useCheckout(selector, equalityFn) {
+function useCheckout(selector) {
   const store = useContext4(CheckoutContext);
   if (!store)
     throw new Error("Missing CheckoutContext.Provider in the tree");
-  return useStore2(store, selector, equalityFn);
+  return useStore2(store, selector);
 }
 
 // src/useClickAnyWhere/useClickAnyWhere.ts
@@ -1406,8 +1406,8 @@ import { useState as useState16 } from "react";
 function useScroll() {
   const [scroll, setScroll] = useState16({ left: 0, top: 0 });
   const onScroll = () => {
-    const left = window.pageXOffset;
-    const top = window.pageYOffset;
+    const left = window.scrollX;
+    const top = window.scrollY;
     if (scroll.left !== left || scroll.top !== top) {
       setScroll({ left, top });
     }
@@ -1441,11 +1441,11 @@ function scrollToSelector(selector, offset = 0) {
   }
 }
 function scrollToRelativeY(y = 0, offset = 0) {
-  const to = window.pageYOffset + y - 60 + offset;
+  const to = window.scrollY + y - 60 + offset;
   return scrollToY(to);
 }
 function scrollToY(y = 0) {
-  const from = window.pageYOffset;
+  const from = window.scrollY;
   const to = y;
   const duration = Math.sqrt(Math.abs(to - from) / 4e3);
   animate(from, to, {
@@ -1454,6 +1454,26 @@ function scrollToY(y = 0) {
   });
 }
 
+// src/useScrolled/useScrolled.ts
+import { useState as useState17 } from "react";
+var DEFAULT_CALLBACK = (top, left) => {
+  return top > 0;
+};
+function useScrolled(callback = DEFAULT_CALLBACK) {
+  const [scrolled, setScrolled] = useState17(false);
+  const onScrolled = () => {
+    const scrolled_ = callback(window.scrollY, window.scrollX);
+    if (scrolled !== scrolled_) {
+      setScrolled(scrolled_);
+    }
+  };
+  useEventListener("scroll", onScrolled);
+  useIsomorphicLayoutEffect(() => {
+    onScrolled();
+  }, []);
+  return scrolled;
+}
+
 // src/useSearchParams/useSearchParams.ts
 import { useRouter } from "next/router";
 import { useCallback as useCallback4, useMemo as useMemo5 } from "react";
@@ -1666,10 +1686,10 @@ function useSearchParamsEncoded(key) {
 }
 
 // src/useSorting/useSorting.ts
-import { useEffect as useEffect22, useRef as useRef11, useState as useState17 } from "react";
+import { useEffect as useEffect22, useRef as useRef11, useState as useState18 } from "react";
 function useSorting(items_, callback_, sort_) {
-  const [sort, setSort] = useState17(sort_);
-  const [items, setItems] = useState17(callback_(items_.slice(), sort));
+  const [sort, setSort] = useState18(sort_);
+  const [items, setItems] = useState18(callback_(items_.slice(), sort));
   const isInitialMount = useRef11(true);
   useEffect22(() => {
     if (isInitialMount.current) {
@@ -1687,11 +1707,11 @@ function useSorting(items_, callback_, sort_) {
 }
 
 // src/useSwiperIndex/useSwiperIndex.ts
-import { useCallback as useCallback6, useEffect as useEffect23, useState as useState18 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect23, useState as useState19 } from "react";
 import { useSwiper } from "swiper/react";
 function useSwiperIndex() {
   const swiper = useSwiper();
-  const [index, setIndex] = useState18(swiper.realIndex);
+  const [index, setIndex] = useState19(swiper.realIndex);
   const slideTo = useCallback6((index2) => {
     swiper.slideTo(index2);
   }, [swiper]);
@@ -1829,6 +1849,7 @@ export {
   useSSR,
   useScroll,
   useScrollTo,
+  useScrolled,
   useSearchParams,
   useSearchParamsEncoded,
   useSearchParamsValue,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@websolutespa/bom-mixer-hooks",
-  "version": "0.2.2",
+  "version": "1.1.0",
   "description": "Mixer Hooks module of the BOM Repository",
   "keywords": [
     "bom",
@@ -34,7 +34,7 @@
     "react": ">= 18.2.0",
     "styled-components": ">= 5.3.5",
     "swiper": ">= 8.3.2",
-    "zustand": ">= 4.1.1"
+    "zustand": ">= 4.4.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.18",

package/src/index.ts

@@ -37,12 +37,13 @@ export * from './usePortal/usePortal';
 export * from './usePrevious/usePrevious';
 export * from './useRealSize/useRealSize';
 export * from './useResize/useResize';
+export * from './useSSR/useSSR';
 export * from './useScroll/useScroll';
 export * from './useScrollTo/useScrollTo';
+export * from './useScrolled/useScrolled';
 export * from './useSearchParams/useSearchParams';
 export * from './useSearchParamsEncoded/useSearchParamsEncoded';
 export * from './useSorting/useSorting';
-export * from './useSSR/useSSR';
 export * from './useSwiperIndex/useSwiperIndex';
 export * from './useSyncedRef/useSyncedRef';
 export * from './useUI/useUI';

package/src/useApi/useApi.test.tsx

@@ -1,12 +1,13 @@
 import '@testing-library/jest-dom';
 import { render, renderHook, screen, waitFor, waitForElementToBeRemoved } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
-import { getApiUrl } from '@websolutespa/bom-mixer-store';
+import { getLocalApiUrl } from '@websolutespa/bom-mixer-store';
 import { LayoutProvider } from '../useLayout/useLayout';
 import { useApi, useApiDelete, useApiFetch, useApiGet, useApiPatch, useApiPost, useApiPut } from './useApi';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>{props.children}</LayoutProvider>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
 );
 
 const defaultResponse = {
@@ -21,7 +22,7 @@ function mockFetch(
   overrideResponse: Partial<typeof defaultResponse> = {}
 ) {
   const endpoint = '/endpoint';
-  const url = `${getApiUrl(endpoint)}?locale=en&market=ww`;
+  const url = `${getLocalApiUrl(endpoint)}?locale=en&market=ww`;
   const payload = { data: 'data' };
   const response = {
     ...defaultResponse,
@@ -37,6 +38,7 @@ function mockFetch(
     method: string;
   } = {
     headers: {
+      'Authorization': 'Bearer STORE_BEARER',
       'Content-Type': 'application/json',
     },
     method,
@@ -55,18 +57,18 @@ describe('useApi', () => {
     jest.resetModules();
     jest.resetAllMocks();
     jest.spyOn(console, 'error').mockImplementation(() => { });
+    jest.spyOn(console, 'log').mockImplementation(() => { });
     process.env = {
       NODE_ENV: 'test',
       NEXT_PUBLIC_URL: 'http://localhost:3000',
       NEXT_PUBLIC_MOCK_FALLBACK_URL: 'http://localhost:3000',
       NEXT_PUBLIC_API: '/api',
-      NEXT_PUBLIC_GOOGLE_MAP_API_KEY: 'AIzaSyDvGw6iAoKdRv8mmaC9GeT-LWLPQtA8p60',
       STORE_URL: 'http://localhost:4000',
-      STORE_API: '/api',
-      STORE_BEARER: '7584f15d12972fb1e7695e998dd5e4c754f46c74d06a08e8d76f556adcd045e48cd52bed6faac098784471ac273ee40243194b9cff7eba3c4a768f8f41d2d51959a7f767b943c7f0170f6e5f632db523803c357083bf7a7bf03ee8e0df2d8ce5cd52e0211283b34d7781313da775018a9e950433d2b6faf711c20e5a63b25243',
+      STORE_API: '/bowl/api',
       STORE_STRATEGY: 'mock',
-      SECRET_COOKIE_PASSWORD: '2gyZ3GDw3LHZQKDhPmPDL3sjREVRXPr8',
-      HOOKS_SECRET: '7584f15d12972fb1e7695e998dd5e4',
+      STORE_BEARER: 'STORE_BEARER',
+      SECRET_COOKIE_PASSWORD: 'SECRET_COOKIE_PASSWORD',
+      HOOKS_SECRET: 'HOOKS_SECRET',
     };
   });
 
@@ -178,7 +180,7 @@ describe('useApi', () => {
         );
       };
       render(
-        <LayoutProvider layout={LayoutDefaults}><Wrapper /></LayoutProvider>
+        <LayoutProvider layout={LayoutDefaults as ILayout}><Wrapper /></LayoutProvider>
       );
       expect(screen.getByTestId('loading')).toHaveTextContent('loading');
       await waitForElementToBeRemoved(() => screen.getByTestId('loading'));

package/src/useApi/useApi.ts

@@ -1,58 +1,59 @@
-import { FetchRequestOptions } from '@websolutespa/bom-core';
-import { apiDelete, apiFetch, apiGet, apiPatch, apiPost, apiPut } from '@websolutespa/bom-mixer-store';
+import { ApiRequestOptions, localApiDelete, localApiFetch, localApiGet, localApiPatch, localApiPost, localApiPut } from '@websolutespa/bom-mixer-store';
 import { useHttpFetch } from '../useHttp/useHttp';
 import { useLayout } from '../useLayout/useLayout';
 
-export function useApiFetch<T = any>(pathname: string, options: FetchRequestOptions = {}) {
+export function useApiFetch<T = unknown>(pathname: string, options: ApiRequestOptions = {}) {
   const layout = useLayout();
-  return useHttpFetch<T>(pathname, options, apiFetch, layout);
+  // const layout = { locale: '', market: '' };
+  return useHttpFetch<T>(pathname, options, localApiFetch, layout);
 }
 
-export function useApiGet<T = any>(pathname: string, options: FetchRequestOptions = {}) {
+export function useApiGet<T = unknown>(pathname: string, options: ApiRequestOptions = {}) {
   return useApiFetch<T>(pathname, { ...options, method: 'GET' });
 }
 
-export function useApiPost<T = any>(pathname: string, payload: unknown, options: FetchRequestOptions = {}) {
+export function useApiPost<T = unknown>(pathname: string, payload: unknown, options: ApiRequestOptions = {}) {
   return useApiFetch<T>(pathname, { ...options, method: 'POST', body: payload ? JSON.stringify(payload) : undefined });
 }
 
-export function useApiPut<T = any>(pathname: string, payload: unknown, options: FetchRequestOptions = {}) {
+export function useApiPut<T = unknown>(pathname: string, payload: unknown, options: ApiRequestOptions = {}) {
   return useApiFetch<T>(pathname, { ...options, method: 'PUT', body: payload ? JSON.stringify(payload) : undefined });
 }
 
-export function useApiPatch<T = any>(pathname: string, payload: unknown, options: FetchRequestOptions = {}) {
+export function useApiPatch<T = unknown>(pathname: string, payload: unknown, options: ApiRequestOptions = {}) {
   return useApiFetch<T>(pathname, { ...options, method: 'PATCH', body: payload ? JSON.stringify(payload) : undefined });
 }
 
-export function useApiDelete<T = any>(pathname: string, options: FetchRequestOptions = {}) {
+export function useApiDelete<T = unknown>(pathname: string, options: ApiRequestOptions = {}) {
   return useApiFetch<T>(pathname, { ...options, method: 'DELETE' });
 }
 
 type Api = {
-  get: <T = any>(pathname: string, options?: FetchRequestOptions) => Promise<T>;
-  post: <T = any>(pathname: string, payload?: unknown, options?: FetchRequestOptions) => Promise<T>;
-  put: <T = any>(pathname: string, payload?: unknown, options?: FetchRequestOptions) => Promise<T>;
-  patch: <T = any>(pathname: string, payload?: unknown, options?: FetchRequestOptions) => Promise<T>;
-  delete: <T = any>(pathname: string, options?: FetchRequestOptions) => Promise<T>;
+  get: <T = unknown>(pathname: string, options?: ApiRequestOptions) => Promise<T>;
+  post: <T = unknown>(pathname: string, payload?: unknown, options?: ApiRequestOptions) => Promise<T>;
+  put: <T = unknown>(pathname: string, payload?: unknown, options?: ApiRequestOptions) => Promise<T>;
+  patch: <T = unknown>(pathname: string, payload?: unknown, options?: ApiRequestOptions) => Promise<T>;
+  delete: <T = unknown>(pathname: string, options?: ApiRequestOptions) => Promise<T>;
 };
 
 export function useApi(): Api {
   const layout = useLayout();
+  // const layout = { locale: '', market: '' };
   return {
-    get: async <T = any>(pathname: string, options: FetchRequestOptions = {}) => {
-      return apiGet<T>(pathname, options, layout);
+    get: async <T = unknown>(pathname: string, options: ApiRequestOptions = {}) => {
+      return localApiGet<T>(pathname, options, layout);
     },
-    post: async <T = any>(pathname: string, payload?: unknown, options: FetchRequestOptions = {}) => {
-      return apiPost<T>(pathname, payload, options, layout);
+    post: async <T = unknown>(pathname: string, payload?: unknown, options: ApiRequestOptions = {}) => {
+      return localApiPost<T>(pathname, payload, options, layout);
     },
-    put: async <T = any>(pathname: string, payload?: unknown, options: FetchRequestOptions = {}) => {
-      return apiPut<T>(pathname, payload, options, layout);
+    put: async <T = unknown>(pathname: string, payload?: unknown, options: ApiRequestOptions = {}) => {
+      return localApiPut<T>(pathname, payload, options, layout);
     },
-    patch: async <T = any>(pathname: string, payload?: unknown, options: FetchRequestOptions = {}) => {
-      return apiPatch<T>(pathname, payload, options, layout);
+    patch: async <T = unknown>(pathname: string, payload?: unknown, options: ApiRequestOptions = {}) => {
+      return localApiPatch<T>(pathname, payload, options, layout);
     },
-    delete: async <T = any>(pathname: string, options: FetchRequestOptions = {}) => {
-      return apiDelete<T>(pathname, options, layout);
+    delete: async <T = unknown>(pathname: string, options: ApiRequestOptions = {}) => {
+      return localApiDelete<T>(pathname, options, layout);
     },
   };
 }

package/src/useCart/useCart.tsx

@@ -119,13 +119,10 @@ function CartProvider({ children, ...props }: CartProviderProps) {
   );
 }
 
-function useCart<T>(
-  selector: (state: CartState) => T,
-  equalityFn?: (left: T, right: T) => boolean
-): T {
+function useCart<T>(selector: (state: CartState) => T): T {
   const store = useContext(CartContext);
   if (!store) throw new Error('Missing CartContext.Provider in the tree');
-  return useStore(store, selector, equalityFn);
+  return useStore(store, selector);
 }
 
 export { CartProvider, useCart };

package/src/useCheckout/useCheckout.tsx

@@ -1,7 +1,7 @@
 import { IAddressOptions, ICheckoutPartial } from '@websolutespa/bom-mixer-models';
 import { createContext, useContext, useRef } from 'react';
 import { createStore, useStore } from 'zustand';
-import { createJSONStorage, persist, StateStorage } from 'zustand/middleware';
+import { StateStorage, createJSONStorage, persist } from 'zustand/middleware';
 
 type CheckoutInitialProps = {
   data: IAddressOptions;
@@ -82,13 +82,10 @@ function CheckoutProvider({ children, ...props }: CheckoutProviderProps) {
   );
 }
 
-function useCheckout<T>(
-  selector: (state: CheckoutState) => T,
-  equalityFn?: (left: T, right: T) => boolean
-): T {
+function useCheckout<T>(selector: (state: CheckoutState) => T): T {
   const store = useContext(CheckoutContext);
   if (!store) throw new Error('Missing CheckoutContext.Provider in the tree');
-  return useStore(store, selector, equalityFn);
+  return useStore(store, selector);
 }
 
 export { CheckoutProvider, useCheckout };

package/src/useCurrency/useCurrency.test.tsx

@@ -1,10 +1,11 @@
 import { renderHook } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
 import { LayoutProvider } from '../useLayout/useLayout';
 import { useCurrency } from './useCurrency';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>{props.children}</LayoutProvider>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
 );
 
 describe('useCurrency', () => {

package/src/useCurrency/useCurrency.ts

@@ -6,7 +6,7 @@ export function useCurrency(currency: string = 'EUR', locale?: string): (value:
 
 /*
 import { useMemo } from 'react';
-import { useNumber } from 'src/useNumber/useNumber';
+import { useNumber } from '../useNumber/useNumber';
 import { useLayout } from '../useLayout/useLayout';
 
 export function useCurrency(currency: string = 'EUR', locale?: string): (value: number) => string {

package/src/useDateTimeFormat/useDateTimeFormat.test.tsx

@@ -1,10 +1,11 @@
 import { renderHook } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
 import { LayoutProvider } from '../useLayout/useLayout';
 import { useDateTimeFormat } from './useDateTimeFormat';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>{props.children}</LayoutProvider>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
 );
 
 describe('useDateTimeFormat', () => {

package/src/useHttp/useHttp.test.tsx

@@ -1,6 +1,6 @@
 import '@testing-library/jest-dom';
 import { render, screen, waitFor, waitForElementToBeRemoved } from '@testing-library/react';
-import { getApiUrl } from '@websolutespa/bom-mixer-store';
+import { getLocalApiUrl } from '@websolutespa/bom-mixer-store';
 import { useHttpDelete, useHttpFetch, useHttpGet, useHttpPatch, useHttpPost, useHttpPut } from './useHttp';
 
 const defaultResponse = {
@@ -12,7 +12,7 @@ const defaultResponse = {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 function mockFetch(method: string = 'GET', result: any = { message: 'ok' }, overrideResponse: Partial<typeof defaultResponse> = {}) {
   const endpoint = '/endpoint';
-  const url = `${getApiUrl(endpoint)}?locale=en&market=ww`;
+  const url = `${getLocalApiUrl(endpoint)}?locale=en&market=ww`;
   const payload = { data: 'data' };
   const response = {
     ...defaultResponse,
@@ -45,22 +45,21 @@ describe('useHttp', () => {
   const FETCH = global.fetch;
 
   beforeEach(() => {
-    // !!! act error
-    jest.spyOn(console, 'error').mockImplementation(() => { });
     jest.resetModules();
     jest.resetAllMocks();
+    jest.spyOn(console, 'error').mockImplementation(() => { });
+    jest.spyOn(console, 'log').mockImplementation(() => { });
     process.env = {
       NODE_ENV: 'test',
       NEXT_PUBLIC_URL: 'http://localhost:3000',
       NEXT_PUBLIC_MOCK_FALLBACK_URL: 'http://localhost:3000',
       NEXT_PUBLIC_API: '/api',
-      NEXT_PUBLIC_GOOGLE_MAP_API_KEY: 'AIzaSyDvGw6iAoKdRv8mmaC9GeT-LWLPQtA8p60',
       STORE_URL: 'http://localhost:4000',
-      STORE_API: '/api',
-      STORE_BEARER: '7584f15d12972fb1e7695e998dd5e4c754f46c74d06a08e8d76f556adcd045e48cd52bed6faac098784471ac273ee40243194b9cff7eba3c4a768f8f41d2d51959a7f767b943c7f0170f6e5f632db523803c357083bf7a7bf03ee8e0df2d8ce5cd52e0211283b34d7781313da775018a9e950433d2b6faf711c20e5a63b25243',
+      STORE_API: '/bowl/api',
       STORE_STRATEGY: 'mock',
-      SECRET_COOKIE_PASSWORD: '2gyZ3GDw3LHZQKDhPmPDL3sjREVRXPr8',
-      HOOKS_SECRET: '7584f15d12972fb1e7695e998dd5e4',
+      STORE_BEARER: 'STORE_BEARER',
+      SECRET_COOKIE_PASSWORD: 'SECRET_COOKIE_PASSWORD',
+      HOOKS_SECRET: 'HOOKS_SECRET',
     };
   });
 

package/src/useHttp/useHttp.ts

@@ -1,15 +1,15 @@
-import { FetchRequestOptions, FetchService, httpFetch } from '@websolutespa/bom-core';
+import { FetchError, FetchRequestOptions, FetchService, httpFetch } from '@websolutespa/bom-core';
 import { Dispatch, useEffect, useState } from 'react';
 
-export function useHttpFetch<T = any>(
+export function useHttpFetch<T = unknown>(
   pathname: string,
   options: FetchRequestOptions = { method: 'GET' },
   service: FetchService<T> = httpFetch,
-  serviceOptions?: any
-): [T | undefined, boolean, any, Dispatch<any>] {
+  serviceOptions?: unknown
+): [T | undefined, boolean, FetchError, Dispatch<FetchError>] {
   const [response, setResponse] = useState<T>();
   const [loading, setLoading] = useState<boolean>(false);
-  const [error, setError] = useState<any>(null);
+  const [error, setError] = useState<FetchError>(null);
   useEffect(() => {
     // const source = axios.CancelToken.source();
     const fetchData = async () => {
@@ -19,7 +19,7 @@ export function useHttpFetch<T = any>(
         const response = await service(pathname, options, serviceOptions);
         // console.log('useHttp.response', response);
         setResponse(response);
-      } catch (error) {
+      } catch (error: FetchError) {
         // console.error(error)
         setError(error);
       }
@@ -31,22 +31,22 @@ export function useHttpFetch<T = any>(
   return [response, loading, error, setError];
 }
 
-export function useHttpGet<T = any>(pathname: string, options: FetchRequestOptions = {}) {
+export function useHttpGet<T = unknown>(pathname: string, options: FetchRequestOptions = {}) {
   return useHttpFetch<T>(pathname, { ...options, method: 'GET' });
 }
 
-export function useHttpPost<T = any>(pathname: string, payload: any, options: FetchRequestOptions = {}) {
+export function useHttpPost<T = unknown>(pathname: string, payload: unknown, options: FetchRequestOptions = {}) {
   return useHttpFetch<T>(pathname, { ...options, method: 'POST', body: payload ? JSON.stringify(payload) : undefined });
 }
 
-export function useHttpPut<T = any>(pathname: string, payload: any, options: FetchRequestOptions = {}) {
+export function useHttpPut<T = unknown>(pathname: string, payload: unknown, options: FetchRequestOptions = {}) {
   return useHttpFetch<T>(pathname, { ...options, method: 'PUT', body: payload ? JSON.stringify(payload) : undefined });
 }
 
-export function useHttpPatch<T = any>(pathname: string, payload: any, options: FetchRequestOptions = {}) {
+export function useHttpPatch<T = unknown>(pathname: string, payload: unknown, options: FetchRequestOptions = {}) {
   return useHttpFetch<T>(pathname, { ...options, method: 'PATCH', body: payload ? JSON.stringify(payload) : undefined });
 }
 
-export function useHttpDelete<T = any>(pathname: string, options: FetchRequestOptions = {}) {
+export function useHttpDelete<T = unknown>(pathname: string, options: FetchRequestOptions = {}) {
   return useHttpFetch<T>(pathname, { ...options, method: 'DELETE' });
 }

package/src/useLabel/useLabel.test.tsx

@@ -1,10 +1,11 @@
 import { renderHook } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
 import { LayoutProvider } from '../useLayout/useLayout';
 import { LabelProvider, parseParams, useLabel } from './useLabel';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>
     <LabelProvider>{props.children}</LabelProvider>
   </LayoutProvider>
 );

package/src/useLayout/useLayout.test.tsx

@@ -1,10 +1,11 @@
 // readme https://testing-library.com/
 import { renderHook } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
 import { LayoutProvider, useLayout } from './useLayout';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>{props.children}</LayoutProvider>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
 );
 
 describe('useLayout', () => {

package/src/useLayout/useLayout.tsx

@@ -15,5 +15,5 @@ function LayoutProvider({ children, layout }: { children?: React.ReactNode, layo
   );
 }
 
-export { useLayout, LayoutProvider };
+export { LayoutProvider, useLayout };
 

package/src/useNumber/useNumber.test.tsx

@@ -1,10 +1,11 @@
 import { renderHook } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
 import { LayoutProvider } from '../useLayout/useLayout';
 import { useNumber } from './useNumber';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>{props.children}</LayoutProvider>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
 );
 
 describe('useNumber', () => {

package/src/usePage/usePage.tsx

@@ -15,5 +15,5 @@ function PageProvider({ children, page }: { children?: React.ReactNode, page: IP
   );
 }
 
-export { usePage, PageProvider };
+export { PageProvider, usePage };
 

package/src/useScroll/useScroll.test.tsx

@@ -3,7 +3,7 @@ import { act, renderHook } from '@testing-library/react';
 import { useScroll } from './useScroll';
 
 const windowScroll = (scrollTop: number): void => {
-  window.pageYOffset = scrollTop;
+  window.scrollY = scrollTop;
   window.dispatchEvent(new Event('scroll'));
 };
 

package/src/useScroll/useScroll.ts

@@ -11,8 +11,8 @@ export function useScroll(): Scroll {
   const [scroll, setScroll] = useState<Scroll>({ left: 0, top: 0 });
 
   const onScroll = () => {
-    const left = window.pageXOffset;
-    const top = window.pageYOffset;
+    const left = window.scrollX;
+    const top = window.scrollY;
     if (scroll.left !== left || scroll.top !== top) {
       setScroll({ left, top });
     }

package/src/useScrollTo/useScrollTo.test.tsx

@@ -77,8 +77,8 @@ describe('useScrollTo', () => {
       left: 0,
     }) as any);
     scrollTo = jest.spyOn(window, 'scrollTo').mockImplementation((left: number, top: number) => {
-      window.pageXOffset = left;
-      window.pageYOffset = top;
+      window.scrollX = left;
+      window.scrollY = top;
     });
   });
 
@@ -93,13 +93,13 @@ describe('useScrollTo', () => {
 
   it('should work correctly', async () => {
     render(<Wrapper />);
-    expect(window.pageYOffset).toBe(0);
+    expect(window.scrollY).toBe(0);
     const trigger = screen.getByTestId('trigger');
     await userEvent.click(trigger);
     expect(scrollTo).toBeCalled();
     expect(scrollTo).toHaveBeenCalledTimes(2);
     expect(scrollTo).toHaveBeenCalledWith(0, 940);
-    expect(window.pageYOffset).toBe(940);
+    expect(window.scrollY).toBe(940);
   });
 
 });

package/src/useScrollTo/useScrollTo.ts

@@ -26,12 +26,12 @@ export function scrollToSelector(selector?: string, offset: number = 0) {
 }
 
 export function scrollToRelativeY(y: number = 0, offset: number = 0) {
-  const to = window.pageYOffset + y - 60 + offset;
+  const to = window.scrollY + y - 60 + offset;
   return scrollToY(to);
 }
 
 export function scrollToY(y: number = 0) {
-  const from = window.pageYOffset;
+  const from = window.scrollY;
   const to = y;
   const duration = Math.sqrt(Math.abs(to - from) / 4000);
   animate(from, to, {

package/src/useScrolled/useScrolled.test.tsx

@@ -0,0 +1,34 @@
+// readme https://testing-library.com/
+import { act, renderHook } from '@testing-library/react';
+import { useScrolled } from './useScrolled';
+
+const windowScroll = (scrollTop: number): void => {
+  window.scrollY = scrollTop;
+  window.dispatchEvent(new Event('scroll'));
+};
+
+const wrapper = (props: { children: React.ReactNode }) => (
+  <div data-testid="test" style={{ height: '2000px' }}>{props.children}</div>
+);
+
+describe('useScrolled', () => {
+
+  it('should work correctly', () => {
+    const { result } = renderHook(() => useScrolled(), { wrapper });
+    expect(result.current).toStrictEqual(false);
+    act(() => {
+      windowScroll(100);
+    });
+    expect(result.current).toStrictEqual(true);
+  });
+
+  it('should return false', () => {
+    const { result } = renderHook(() => useScrolled((top, left) => top > 200), { wrapper });
+    expect(result.current).toStrictEqual(false);
+    act(() => {
+      windowScroll(100);
+    });
+    expect(result.current).toStrictEqual(false);
+  });
+
+});

package/src/useScrolled/useScrolled.ts

@@ -0,0 +1,28 @@
+import { useState } from 'react';
+import { useEventListener } from '../useEventListener/useEventListener';
+import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect';
+
+const DEFAULT_CALLBACK = (top: number, left: number) => {
+  return top > 0;
+};
+
+export function useScrolled(callback: (top: number, left: number) => boolean = DEFAULT_CALLBACK): boolean {
+  const [scrolled, setScrolled] = useState<boolean>(false);
+
+  const onScrolled = () => {
+    const scrolled_ = callback(window.scrollY, window.scrollX);
+    if (scrolled !== scrolled_) {
+      setScrolled(scrolled_);
+    }
+  };
+
+  useEventListener('scroll', onScrolled);
+
+  // Set size at the first client-side load
+  useIsomorphicLayoutEffect(() => {
+    onScrolled();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return scrolled;
+}

package/src/useUnit/useUnit.test.tsx

@@ -1,10 +1,11 @@
 import { renderHook } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
 import { LayoutDefaults } from '@websolutespa/bom-mixer-mock';
 import { LayoutProvider } from '../useLayout/useLayout';
 import { useUnit } from './useUnit';
 
 const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults}>{props.children}</LayoutProvider>
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
 );
 
 describe('useUnit', () => {