linear-react-components-ui 2.2.0-beta.2 → 2.2.0-beta.4

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 (3) hide show
  1. package/lib/hooks/useScrollEndReached/index.js +33 -77
  2. package/lib/hooks/useScrollEndReached/index.js.map +1 -1
  3. package/package.json +1 -1
package/lib/hooks/useScrollEndReached/index.js CHANGED
@@ -1,4 +1,3 @@
1
- import { c as compilerRuntimeExports } from "../../_virtual/compiler-runtime.js";
2
1
  import { useRef, useEffect } from "react";
3
2
  function getCurrentThreshold(scrollableElement, scrollThreshold) {
4
3
  const MIN_THRESHOLD = 0;
@@ -14,87 +13,44 @@ function getCurrentThreshold(scrollableElement, scrollThreshold) {
14
13
  const maxScrollThreshold = Math.round(offsetHeight - offsetHeight * 0.3);
15
14
  return Math.min(calculatedScrollThreshold, maxScrollThreshold);
16
15
  }
17
- function useScrollEndReached(t0) {
18
- const $ = compilerRuntimeExports.c(9);
19
- const {
20
- elementRef,
21
- onEndReached,
22
- onEndReachedThreshold: t1
23
- } = t0;
24
- const onEndReachedThreshold = t1 === void 0 ? 0.1 : t1;
25
- const lastScrollHeight = useRef(0);
16
+ function useScrollEndReached({
17
+ elementRef,
18
+ onEndReached,
19
+ onEndReachedThreshold = 0.1
20
+ }) {
21
+ const lastScrollTop = useRef(null);
26
22
  const enableOnEndReached = useRef(true);
27
- let t2;
28
- if ($[0] !== elementRef || $[1] !== onEndReached || $[2] !== onEndReachedThreshold) {
29
- t2 = async () => {
30
- const element = elementRef.current;
31
- if (element && onEndReached) {
32
- const {
33
- scrollTop,
34
- scrollHeight,
35
- clientHeight
36
- } = element;
37
- const scrollOffset = scrollHeight - clientHeight - scrollTop - 1;
38
- const threshold = getCurrentThreshold(element, onEndReachedThreshold);
39
- if (scrollOffset <= threshold && enableOnEndReached.current && scrollHeight !== lastScrollHeight.current) {
40
- enableOnEndReached.current = false;
41
- await new Promise((resolve) => {
42
- resolve(onEndReached());
43
- });
23
+ const onScrollEndReached = async () => {
24
+ const element = elementRef.current;
25
+ if (element && onEndReached) {
26
+ const {
27
+ scrollTop,
28
+ scrollHeight,
29
+ clientHeight
30
+ } = element;
31
+ const isScrollingDown = lastScrollTop.current === null || scrollTop > lastScrollTop.current;
32
+ lastScrollTop.current = scrollTop;
33
+ const scrollOffset = scrollHeight - clientHeight - scrollTop - 1;
34
+ const threshold = getCurrentThreshold(element, onEndReachedThreshold);
35
+ if (scrollOffset <= threshold && isScrollingDown && enableOnEndReached.current) {
36
+ enableOnEndReached.current = false;
37
+ try {
38
+ await onEndReached();
39
+ } finally {
44
40
  enableOnEndReached.current = true;
45
- lastScrollHeight.current = scrollHeight;
46
41
  }
47
42
  }
43
+ }
44
+ };
45
+ useEffect(() => {
46
+ const element_0 = elementRef.current;
47
+ if (element_0 && onEndReached) {
48
+ element_0.addEventListener("scroll", onScrollEndReached);
49
+ }
50
+ return () => {
51
+ element_0?.removeEventListener("scroll", onScrollEndReached);
48
52
  };
49
- $[0] = elementRef;
50
- $[1] = onEndReached;
51
- $[2] = onEndReachedThreshold;
52
- $[3] = t2;
53
- } else {
54
- t2 = $[3];
55
- }
56
- const onScrollEndReached = t2;
57
- let t3;
58
- if ($[4] !== elementRef || $[5] !== onEndReached || $[6] !== onScrollEndReached) {
59
- t3 = () => {
60
- let observer;
61
- const element_0 = elementRef.current;
62
- if (element_0 && onEndReached) {
63
- observer = new ResizeObserver(() => {
64
- const currentElement = elementRef.current;
65
- if (currentElement) {
66
- const {
67
- scrollHeight: scrollHeight_0
68
- } = currentElement;
69
- if (scrollHeight_0 && scrollHeight_0 !== lastScrollHeight.current) {
70
- enableOnEndReached.current = true;
71
- observer?.disconnect();
72
- }
73
- }
74
- });
75
- observer.observe(element_0);
76
- element_0.addEventListener("scroll", onScrollEndReached);
77
- }
78
- return () => {
79
- element_0?.removeEventListener("scroll", onScrollEndReached);
80
- observer?.disconnect();
81
- };
82
- };
83
- $[4] = elementRef;
84
- $[5] = onEndReached;
85
- $[6] = onScrollEndReached;
86
- $[7] = t3;
87
- } else {
88
- t3 = $[7];
89
- }
90
- let t4;
91
- if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
92
- t4 = [];
93
- $[8] = t4;
94
- } else {
95
- t4 = $[8];
96
- }
97
- useEffect(t3, t4);
53
+ }, [onEndReached, onEndReachedThreshold]);
98
54
  }
99
55
  export {
100
56
  getCurrentThreshold,
package/lib/hooks/useScrollEndReached/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/lib/hooks/useScrollEndReached/index.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { AsyncFunc, Func, UseScrollEndReachedParams } from \"./types\";\n\nexport interface ScrollEndReachedParams extends UseScrollEndReachedParams {\n elementRef: React.RefObject<HTMLElement | null>;\n onEndReached?: Func | AsyncFunc;\n onEndReachedThreshold?: number;\n}\n\nexport function getCurrentThreshold(\n scrollableElement: HTMLElement,\n scrollThreshold: number,\n): number {\n const MIN_THRESHOLD = 0;\n const MAX_THRESHOLD = 1;\n if (scrollThreshold < MIN_THRESHOLD) return MIN_THRESHOLD;\n if (scrollThreshold > MAX_THRESHOLD) return MAX_THRESHOLD;\n const { scrollHeight, clientHeight } = scrollableElement;\n const offsetHeight = scrollHeight - clientHeight;\n\n const calculatedScrollThreshold = Math.round(scrollHeight * scrollThreshold);\n const maxScrollThreshold = Math.round(offsetHeight - (offsetHeight * 0.3));\n\n return Math.min(calculatedScrollThreshold, maxScrollThreshold);\n}\n\nexport function useScrollEndReached({\n elementRef,\n onEndReached,\n onEndReachedThreshold = 0.1,\n}: ScrollEndReachedParams) {\n const lastScrollHeight = useRef(0);\n const enableOnEndReached = useRef(true);\n\n const onScrollEndReached = async () => {\n const element = elementRef.current;\n \n if (element && onEndReached) {\n const { scrollTop, scrollHeight, clientHeight } = element;\n const scrollOffset = scrollHeight - clientHeight - scrollTop - 1;\n const threshold = getCurrentThreshold(element, onEndReachedThreshold);\n\n if (\n scrollOffset <= threshold && enableOnEndReached.current \n && scrollHeight !== lastScrollHeight.current\n ) {\n enableOnEndReached.current = false;\n await new Promise((resolve) => {\n resolve(onEndReached());\n });\n enableOnEndReached.current = true;\n lastScrollHeight.current = scrollHeight;\n }\n }\n };\n\n useEffect(() => {\n let observer: ResizeObserver | null;\n const element = elementRef.current;\n if (element && onEndReached) {\n observer = new ResizeObserver(() => {\n const currentElement = elementRef.current;\n if (currentElement) {\n const { scrollHeight } = currentElement as HTMLDivElement;\n if (scrollHeight && scrollHeight !== lastScrollHeight.current) {\n enableOnEndReached.current = true;\n observer?.disconnect();\n }\n }\n });\n \n observer.observe(element);\n element.addEventListener('scroll', onScrollEndReached);\n }\n \n return () => {\n element?.removeEventListener('scroll', onScrollEndReached);\n observer?.disconnect();\n };\n }, []);\n}\n"],"names":["getCurrentThreshold","scrollableElement","scrollThreshold","MIN_THRESHOLD","MAX_THRESHOLD","scrollHeight","clientHeight","offsetHeight","calculatedScrollThreshold","Math","round","maxScrollThreshold","min","useScrollEndReached","t0","$","_c","elementRef","onEndReached","onEndReachedThreshold","t1","undefined","lastScrollHeight","useRef","enableOnEndReached","t2","element","current","scrollTop","scrollOffset","threshold","Promise","resolve","onScrollEndReached","t3","observer","element_0","ResizeObserver","currentElement","scrollHeight_0","disconnect","observe","addEventListener","removeEventListener","t4","Symbol","for","useEffect"],"mappings":";;AASO,SAASA,oBACdC,mBACAC,iBACQ;AACR,QAAMC,gBAAgB;AACtB,QAAMC,gBAAgB;AACtB,MAAIF,kBAAkBC,cAAe,QAAOA;AAC5C,MAAID,kBAAkBE,cAAe,QAAOA;AAC5C,QAAM;AAAA,IAAEC;AAAAA,IAAcC;AAAAA,EAAAA,IAAiBL;AACvC,QAAMM,eAAeF,eAAeC;AAEpC,QAAME,4BAA4BC,KAAKC,MAAML,eAAeH,eAAe;AAC3E,QAAMS,qBAAqBF,KAAKC,MAAMH,eAAgBA,eAAe,GAAI;AAEzE,SAAOE,KAAKG,IAAIJ,2BAA2BG,kBAAkB;AAC/D;AAEO,SAAAE,oBAAAC,IAAA;AAAA,QAAAC,IAAAC,uBAAAA,EAAA,CAAA;AAA6B,QAAA;AAAA,IAAAC;AAAAA,IAAAC;AAAAA,IAAAC,uBAAAC;AAAAA,EAAAA,IAAAN;AAGlC,QAAAK,wBAAAC,OAAAC,SAAA,MAAAD;AAEA,QAAAE,mBAAyBC,OAAO,CAAC;AACjC,QAAAC,qBAA2BD,OAAO,IAAI;AAAE,MAAAE;AAAA,MAAAV,EAAA,CAAA,MAAAE,cAAAF,SAAAG,gBAAAH,EAAA,CAAA,MAAAI,uBAAA;AAEbM,qBAAA;AACzB,YAAAC,UAAgBT,WAAUU;AAE1B,UAAID,WAAAR,cAAuB;AACzB,cAAA;AAAA,UAAAU;AAAAA,UAAAvB;AAAAA,UAAAC;AAAAA,QAAAA,IAAkDoB;AAClD,cAAAG,eAAqBxB,eAAeC,eAAesB,YAAY;AAC/D,cAAAE,YAAkB9B,oBAAoB0B,SAASP,qBAAqB;AAEpE,YACEU,gBAAgBC,aAAaN,mBAAkBG,WAC5CtB,iBAAiBiB,iBAAgBK,SAAQ;AAE5CH,6BAAkBG,UAAW;AAC7B,gBAAM,IAAII,QAAQC,CAAAA,YAAA;AAChBA,oBAAQd,cAAc;AAAA,UAAC,CACxB;AACDM,6BAAkBG,UAAW;AAC7BL,2BAAgBK,UAAWtB;AAAAA,QAAH;AAAA,MACzB;AAAA,IACF;AACFU,WAAAE;AAAAF,WAAAG;AAAAH,WAAAI;AAAAJ,WAAAU;AAAAA,EAAA,OAAA;AAAAA,SAAAV,EAAA,CAAA;AAAA,EAAA;AApBD,QAAAkB,qBAA2BR;AAoBzB,MAAAS;AAAA,MAAAnB,EAAA,CAAA,MAAAE,cAAAF,SAAAG,gBAAAH,EAAA,CAAA,MAAAkB,oBAAA;AAEQC,SAAAA,MAAA;AACJC,UAAAA;AACJ,YAAAC,YAAiBnB,WAAUU;AAC3B,UAAIS,aAAAlB,cAAuB;AACzBiB,mBAAWA,IAAIE,eAAe,MAAA;AAC5B,gBAAAC,iBAAuBrB,WAAUU;AACjC,cAAIW,gBAAc;AAChB,kBAAA;AAAA,cAAAjC,cAAAkC;AAAAA,YAAAA,IAAyBD;AACzB,gBAAIC,kBAAgBlC,mBAAiBiB,iBAAgBK,SAAQ;AAC3DH,iCAAkBG,UAAW;AAC7BQ,wBAAQK,WAAAA;AAAAA,YAAc;AAAA,UACvB;AAAA,QACF,CACF;AAEDL,iBAAQM,QAASf,SAAO;AACxBA,kBAAOgB,iBAAkB,UAAUT,kBAAkB;AAAA,MAAC;AACvD,aAEM,MAAA;AACLP,mBAAOiB,oBAAsB,UAAUV,kBAAkB;AACzDE,kBAAQK,WAAAA;AAAAA,MAAc;AAAA,IACvB;AACFzB,WAAAE;AAAAF,WAAAG;AAAAH,WAAAkB;AAAAlB,WAAAmB;AAAAA,EAAA,OAAA;AAAAA,SAAAnB,EAAA,CAAA;AAAA,EAAA;AAAA,MAAA6B;AAAA,MAAA7B,EAAA,CAAA,MAAA8B,OAAAC,IAAA,2BAAA,GAAA;AAAEF,SAAA,CAAA;AAAE7B,WAAA6B;AAAAA,EAAA,OAAA;AAAAA,SAAA7B,EAAA,CAAA;AAAA,EAAA;AAvBLgC,YAAUb,IAuBPU,EAAE;AAAC;"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/lib/hooks/useScrollEndReached/index.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { AsyncFunc, Func, UseScrollEndReachedParams } from \"./types\";\n\nexport interface ScrollEndReachedParams extends UseScrollEndReachedParams {\n elementRef: React.RefObject<HTMLElement | null>;\n onEndReached?: Func | AsyncFunc;\n onEndReachedThreshold?: number;\n}\n\nexport function getCurrentThreshold(\n scrollableElement: HTMLElement,\n scrollThreshold: number,\n): number {\n const MIN_THRESHOLD = 0;\n const MAX_THRESHOLD = 1;\n if (scrollThreshold < MIN_THRESHOLD) return MIN_THRESHOLD;\n if (scrollThreshold > MAX_THRESHOLD) return MAX_THRESHOLD;\n const { scrollHeight, clientHeight } = scrollableElement;\n const offsetHeight = scrollHeight - clientHeight;\n\n const calculatedScrollThreshold = Math.round(scrollHeight * scrollThreshold);\n const maxScrollThreshold = Math.round(offsetHeight - (offsetHeight * 0.3));\n\n return Math.min(calculatedScrollThreshold, maxScrollThreshold);\n}\n\nexport function useScrollEndReached({\n elementRef,\n onEndReached,\n onEndReachedThreshold = 0.1,\n}: ScrollEndReachedParams) {\n const lastScrollTop = useRef<number | null>(null);\n const enableOnEndReached = useRef(true);\n\n const onScrollEndReached = async () => {\n const element = elementRef.current;\n\n if (element && onEndReached) {\n const { scrollTop, scrollHeight, clientHeight } = element;\n const isScrollingDown =\n lastScrollTop.current === null || scrollTop > lastScrollTop.current;\n lastScrollTop.current = scrollTop;\n const scrollOffset = scrollHeight - clientHeight - scrollTop - 1;\n const threshold = getCurrentThreshold(element, onEndReachedThreshold);\n\n if (\n scrollOffset <= threshold && isScrollingDown && enableOnEndReached.current\n ) {\n enableOnEndReached.current = false;\n try {\n await onEndReached();\n } finally {\n enableOnEndReached.current = true;\n }\n }\n }\n };\n\n useEffect(() => {\n const element = elementRef.current;\n if (element && onEndReached) {\n element.addEventListener('scroll', onScrollEndReached);\n }\n\n return () => {\n element?.removeEventListener('scroll', onScrollEndReached);\n };\n }, [onEndReached, onEndReachedThreshold]);\n}\n"],"names":["getCurrentThreshold","scrollableElement","scrollThreshold","MIN_THRESHOLD","MAX_THRESHOLD","scrollHeight","clientHeight","offsetHeight","calculatedScrollThreshold","Math","round","maxScrollThreshold","min","useScrollEndReached","elementRef","onEndReached","onEndReachedThreshold","lastScrollTop","useRef","enableOnEndReached","onScrollEndReached","element","current","scrollTop","isScrollingDown","scrollOffset","threshold","useEffect","addEventListener","removeEventListener"],"mappings":";AASO,SAASA,oBACdC,mBACAC,iBACQ;AACR,QAAMC,gBAAgB;AACtB,QAAMC,gBAAgB;AACtB,MAAIF,kBAAkBC,cAAe,QAAOA;AAC5C,MAAID,kBAAkBE,cAAe,QAAOA;AAC5C,QAAM;AAAA,IAAEC;AAAAA,IAAcC;AAAAA,EAAAA,IAAiBL;AACvC,QAAMM,eAAeF,eAAeC;AAEpC,QAAME,4BAA4BC,KAAKC,MAAML,eAAeH,eAAe;AAC3E,QAAMS,qBAAqBF,KAAKC,MAAMH,eAAgBA,eAAe,GAAI;AAEzE,SAAOE,KAAKG,IAAIJ,2BAA2BG,kBAAkB;AAC/D;AAEO,SAASE,oBAAoB;AAAA,EAClCC;AAAAA,EACAC;AAAAA,EACAC,wBAAwB;AACF,GAAG;AACzB,QAAMC,gBAAgBC,OAAsB,IAAI;AAChD,QAAMC,qBAAqBD,OAAO,IAAI;AAEtC,QAAME,qBAAqB,YAAY;AACrC,UAAMC,UAAUP,WAAWQ;AAE3B,QAAID,WAAWN,cAAc;AAC3B,YAAM;AAAA,QAAEQ;AAAAA,QAAWlB;AAAAA,QAAcC;AAAAA,MAAAA,IAAiBe;AAClD,YAAMG,kBACJP,cAAcK,YAAY,QAAQC,YAAYN,cAAcK;AAC9DL,oBAAcK,UAAUC;AACxB,YAAME,eAAepB,eAAeC,eAAeiB,YAAY;AAC/D,YAAMG,YAAY1B,oBAAoBqB,SAASL,qBAAqB;AAEpE,UACES,gBAAgBC,aAAaF,mBAAmBL,mBAAmBG,SACnE;AACAH,2BAAmBG,UAAU;AAC7B,YAAI;AACF,gBAAMP,aAAAA;AAAAA,QACR,UAAA;AACEI,6BAAmBG,UAAU;AAAA,QAC/B;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEAK,YAAU,MAAM;AACd,UAAMN,YAAUP,WAAWQ;AAC3B,QAAID,aAAWN,cAAc;AAC3BM,gBAAQO,iBAAiB,UAAUR,kBAAkB;AAAA,IACvD;AAEA,WAAO,MAAM;AACXC,iBAASQ,oBAAoB,UAAUT,kBAAkB;AAAA,IAC3D;AAAA,EACF,GAAG,CAACL,cAAcC,qBAAqB,CAAC;AAC1C;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "linear-react-components-ui",
3
- "version": "2.2.0-beta.2",
3
+ "version": "2.2.0-beta.4",
4
4
  "description": "Linear Sistemas ReactJs Components",
5
5
  "type": "module",
6
6
  "main": "./lib/index.js",