assistant-chat-scroll - npm Package Compare versions

Comparing version 1.0.0-alpha.3 to 1.0.0-alpha.4

dist/AssistantChatScrollReversed/AssistantChatScrollReversedProps.d.ts

@@ -25,3 +25,4 @@ import React, { Ref } from 'react';
     overscan?: number;
-    paddingStart: number;
+    paddingStart?: number;
+    paddingEnd?: number;
     appendScrollTargetIndex?: AppendScrollTargetIndex;
@@ -28,0 +29,0 @@ scrollAlignment?: ScrollAlignment;

dist/cjs/AssistantChatScrollReversed/AssistantChatScrollReversed.js

@@ -1,1 +0,1 @@
-var se=require("../assets/AssistantChatScrollReversed.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),t=require("react"),W=require("./useElementPos.js"),G=require("../index-rXXebfDg.js"),M=require("./AssistantChatScrollReversedProps.js"),J="_root_mnss7_1",Q="_scrollBlock_mnss7_5",X="_wrapper_mnss7_15",Z="_absolutePos_mnss7_20",p="_item_mnss7_27",ee="_loader_mnss7_38",x={root:J,scrollBlock:Q,wrapper:X,absolutePos:Z,item:p,loader:ee},te=t.forwardRef((q,z)=>{const{style:C,children:A,scrollFollowOffsetPx:D,scrollLoadHistoryOffsetPx:T,scrollLoadHistoryWorker:v,estimateSizePx:$,loader:E,overscan:F,paddingStart:S,appendScrollTargetIndex:R,scrollAlignment:j,getScrollButton:_,itemClassName:L,scrollToLastOnAppend:N}=M.useAssistantChatScrollReversedProps(q),Y=t.useMemo(()=>T+S,[S,T]),s=t.useMemo(()=>t.Children.toArray(A).reverse(),[A]),[c,O]=t.useState(!1),H=t.useCallback(async()=>{c||(O(!0),await v(),O(!1))},[c,v]),a=t.useRef(null),{scrollPos:l}=W.useElementPos(a),[d,V]=t.useState(!0),[m,K]=t.useState(null),[g,B]=t.useState(0),n=G.useVirtualizer({count:s.length,getScrollElement:()=>a.current,estimateSize:()=>$,getItemKey:e=>s[e].key??e,paddingEnd:S,overscan:F}),r=n.getVirtualItems(),b=t.useCallback(()=>M.defaultPrependTargetIndex({childrenArray:s,visibleItem:m,scrollPos:l})??-1,[s,l,m]),y=t.useCallback(()=>{if(r.length){const e=r.find(o=>o.end>=l.bottom)??r[r.length-1];K({key:e.key,start:e.start,index:e.index,bottom:l.bottom})}},[l.bottom,r]),u=t.useCallback((e,o)=>{if(!s.length)return;const i=(o==null?void 0:o.animate)??!0,f=(o==null?void 0:o.align)??j,w=(s.length-e-1)%s.length;n.scrollToIndex(w,{align:f,behavior:i?"smooth":void 0}),setTimeout(()=>{n.scrollToIndex(w,{align:f,behavior:void 0})},500)},[s.length,j,n]),k=t.useCallback(()=>{if(!c&&a.current&&s.length){const e=b(),o=m?m.index:s.length,i=e>o,f=g+Math.max(0,e-o);if(f!==g&&B(f),i&&m){const U=n.getOffsetForIndex(e,"start")[0]-m.start;n.scrollBy(U),N?u(-1,{animate:!0,align:"start"}):d&&s.length&&u(R({childrenArray:s,scrollPos:l}),{animate:!0,align:"start"})}}},[c,s,b,m,g,n,N,d,u,R,l]),I=t.useCallback(async()=>{!v||c||await H()},[c,H,v]);t.useImperativeHandle(z,()=>({getAnchorIndex:b,saveScrollPosition:y,scrollToIndex:u,restoreScrollPosition:k,loadHistory:I}),[b,I,k,y,u]);const P=t.useCallback(e=>{a.current&&(a.current.scrollTop-=e.deltaY,e.preventDefault())},[]);return t.useEffect(()=>{if(a.current)return a.current.addEventListener("wheel",P),()=>{var e;return(e=a.current)==null?void 0:e.removeEventListener("wheel",P)}},[P]),t.useEffect(()=>{y();const e=l.maxBottom-l.bottom;if(e!==0&&e<Y&&I(),l.bottom<D?d||V(!0):d&&V(!1),r.length){const i=(r.find(f=>f.end>=l.bottom)??r[0]).index;i<g&&B(i)}},[d,l]),t.useEffect(()=>{k(),y()},[s]),t.useMemo(()=>{var e;return h.jsxs("div",{style:C,className:x.root,children:[_&&!d&&_({newItems:g,scrollToIndex:u}),h.jsx("div",{className:x.scrollBlock,ref:a,children:h.jsx("div",{className:x.wrapper,style:{height:n.getTotalSize()},children:h.jsxs("div",{className:x.absolutePos,style:{transform:`translateY(${((e=r[0])==null?void 0:e.start)??0}px)`},children:[r.map(o=>{const i=s[o.index];return h.jsx("div",{"data-index":o.index,ref:n.measureElement,className:`${x.item} ${L}`,children:i},i.key)}),h.jsx("div",{className:x.loader,children:h.jsx("div",{children:c&&E})})]})})})]})},[s,_,c,E,u,d,C,g,r,n,L])});exports.AssistantChatScrollReversed=te;
+var oe=require("../assets/AssistantChatScrollReversed.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),t=require("react"),W=require("./useElementPos.js"),G=require("../index-rXXebfDg.js"),M=require("./AssistantChatScrollReversedProps.js"),J="_root_mnss7_1",Q="_scrollBlock_mnss7_5",X="_wrapper_mnss7_15",Z="_absolutePos_mnss7_20",ee="_item_mnss7_27",te="_loader_mnss7_38",x={root:J,scrollBlock:Q,wrapper:X,absolutePos:Z,item:ee,loader:te},se=t.forwardRef((q,z)=>{const{style:C,children:A,scrollFollowOffsetPx:D,scrollLoadHistoryOffsetPx:E,scrollLoadHistoryWorker:v,estimateSizePx:$,loader:T,overscan:F,paddingStart:y,paddingEnd:Y,appendScrollTargetIndex:R,scrollAlignment:j,getScrollButton:_,itemClassName:L,scrollToLastOnAppend:N}=M.useAssistantChatScrollReversedProps(q),p=t.useMemo(()=>E+y,[y,E]),s=t.useMemo(()=>t.Children.toArray(A).reverse(),[A]),[c,O]=t.useState(!1),H=t.useCallback(async()=>{c||(O(!0),await v(),O(!1))},[c,v]),a=t.useRef(null),{scrollPos:l}=W.useElementPos(a),[d,V]=t.useState(!0),[m,K]=t.useState(null),[g,B]=t.useState(0),n=G.useVirtualizer({count:s.length,getScrollElement:()=>a.current,estimateSize:()=>$,getItemKey:e=>s[e].key??e,paddingEnd:y,paddingStart:Y,overscan:F}),r=n.getVirtualItems(),b=t.useCallback(()=>M.defaultPrependTargetIndex({childrenArray:s,visibleItem:m,scrollPos:l})??-1,[s,l,m]),S=t.useCallback(()=>{if(r.length){const e=r.find(o=>o.end>=l.bottom)??r[r.length-1];K({key:e.key,start:e.start,index:e.index,bottom:l.bottom})}},[l.bottom,r]),u=t.useCallback((e,o)=>{if(!s.length)return;const i=(o==null?void 0:o.animate)??!0,f=(o==null?void 0:o.align)??j,w=(s.length-e-1)%s.length;n.scrollToIndex(w,{align:f,behavior:i?"smooth":void 0}),setTimeout(()=>{n.scrollToIndex(w,{align:f,behavior:void 0})},500)},[s.length,j,n]),k=t.useCallback(()=>{if(!c&&a.current&&s.length){const e=b(),o=m?m.index:s.length,i=e>o,f=g+Math.max(0,e-o);if(f!==g&&B(f),i&&m){const U=n.getOffsetForIndex(e,"start")[0]-m.start;n.scrollBy(U),N?u(-1,{animate:!0,align:"start"}):d&&s.length&&u(R({childrenArray:s,scrollPos:l}),{animate:!0,align:"start"})}}},[c,s,b,m,g,n,N,d,u,R,l]),I=t.useCallback(async()=>{!v||c||await H()},[c,H,v]);t.useImperativeHandle(z,()=>({getAnchorIndex:b,saveScrollPosition:S,scrollToIndex:u,restoreScrollPosition:k,loadHistory:I}),[b,I,k,S,u]);const P=t.useCallback(e=>{a.current&&(a.current.scrollTop-=e.deltaY,e.preventDefault())},[]);return t.useEffect(()=>{if(a.current)return a.current.addEventListener("wheel",P),()=>{var e;return(e=a.current)==null?void 0:e.removeEventListener("wheel",P)}},[P]),t.useEffect(()=>{S();const e=l.maxBottom-l.bottom;if(e!==0&&e<p&&I(),l.bottom<D?d||V(!0):d&&V(!1),r.length){const i=(r.find(f=>f.end>=l.bottom)??r[0]).index;i<g&&B(i)}},[d,l]),t.useEffect(()=>{k(),S()},[s]),t.useMemo(()=>{var e;return h.jsxs("div",{style:C,className:x.root,children:[_&&!d&&_({newItems:g,scrollToIndex:u}),h.jsx("div",{className:x.scrollBlock,ref:a,children:h.jsx("div",{className:x.wrapper,style:{height:n.getTotalSize()},children:h.jsxs("div",{className:x.absolutePos,style:{transform:`translateY(${((e=r[0])==null?void 0:e.start)??0}px)`},children:[r.map(o=>{const i=s[o.index];return h.jsx("div",{"data-index":o.index,ref:n.measureElement,className:`${x.item} ${L}`,children:i},i.key)}),h.jsx("div",{className:x.loader,children:h.jsx("div",{children:c&&T})})]})})})]})},[s,_,c,T,u,d,C,g,r,n,L])});exports.AssistantChatScrollReversed=se;

dist/cjs/AssistantChatScrollReversed/AssistantChatScrollReversedProps.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),o=({childrenArray:e,visibleItem:t})=>t?e.findIndex(l=>l.key===t.key):-1,r=({childrenArray:e})=>e.length-1,s={scrollFollowOffsetPx:30,scrollLoadHistoryOffsetPx:100,scrollLoadHistoryWorker:async()=>{},estimateSizePx:100,loader:null,overscan:3,paddingStart:100,appendScrollTargetIndex:r,scrollAlignment:"end",getScrollButton:null,scrollToLastOnAppend:!1},a=e=>n.useMemo(()=>({...s,...e}),[e]);exports.AssistantChatScrollReversedPropDefaults=s;exports.defaultAppendTargetIndex=r;exports.defaultPrependTargetIndex=o;exports.useAssistantChatScrollReversedProps=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),o=({childrenArray:e,visibleItem:t})=>t?e.findIndex(l=>l.key===t.key):-1,r=({childrenArray:e})=>e.length-1,s={scrollFollowOffsetPx:30,scrollLoadHistoryOffsetPx:100,scrollLoadHistoryWorker:async()=>{},estimateSizePx:100,loader:null,overscan:3,paddingStart:100,paddingEnd:0,appendScrollTargetIndex:r,scrollAlignment:"end",getScrollButton:null,scrollToLastOnAppend:!1},a=e=>n.useMemo(()=>({...s,...e}),[e]);exports.AssistantChatScrollReversedPropDefaults=s;exports.defaultAppendTargetIndex=r;exports.defaultPrependTargetIndex=o;exports.useAssistantChatScrollReversedProps=a;

dist/esm/AssistantChatScrollReversed/AssistantChatScrollReversed.js

 import "../assets/AssistantChatScrollReversed.css";
 import { jsxs as $, jsx as x } from "react/jsx-runtime";
-import J, { forwardRef as Q, useMemo as A, Children as X, useState as b, useCallback as u, useImperativeHandle as Z, useEffect as E } from "react";
-import { useElementPos as ee } from "./useElementPos.js";
-import { u as te } from "../index-2kwedRtj.mjs";
-import { useAssistantChatScrollReversedProps as se, defaultPrependTargetIndex as oe } from "./AssistantChatScrollReversedProps.js";
-const re = "_root_mnss7_1", le = "_scrollBlock_mnss7_5", ne = "_wrapper_mnss7_15", ie = "_absolutePos_mnss7_20", ae = "_item_mnss7_27", ce = "_loader_mnss7_38", g = {
-  root: re,
+import Q, { forwardRef as X, useMemo as A, Children as Z, useState as b, useCallback as u, useImperativeHandle as ee, useEffect as E } from "react";
+import { useElementPos as te } from "./useElementPos.js";
+import { u as se } from "../index-2kwedRtj.mjs";
+import { useAssistantChatScrollReversedProps as oe, defaultPrependTargetIndex as re } from "./AssistantChatScrollReversedProps.js";
+const ne = "_root_mnss7_1", le = "_scrollBlock_mnss7_5", ae = "_wrapper_mnss7_15", ie = "_absolutePos_mnss7_20", ce = "_item_mnss7_27", de = "_loader_mnss7_38", h = {
+  root: ne,
   scrollBlock: le,
-  wrapper: ne,
+  wrapper: ae,
   absolutePos: ie,
-  item: ae,
-  loader: ce
-}, xe = Q((j, F) => {
+  item: ce,
+  loader: de
+}, ve = X((j, F) => {
   const {
@@ -25,23 +25,25 @@ style: L,
     paddingStart: I,
+    paddingEnd: W,
     appendScrollTargetIndex: V,
     scrollAlignment: B,
     getScrollButton: w,
-    itemClassName: z,
-    scrollToLastOnAppend: C
-  } = se(j), W = A(
+    itemClassName: p,
+    scrollToLastOnAppend: z
+  } = oe(j), q = A(
     () => H + I,
     [I, H]
-  ), t = A(() => X.toArray(N).reverse(), [N]), [a, R] = b(!1), p = u(async () => {
-    a || (R(!0), await v(), R(!1));
-  }, [a, v]), n = J.useRef(null), { scrollPos: o } = ee(n), [c, D] = b(!0), [d, q] = b(null), [h, M] = b(0), l = te({
+  ), t = A(() => Z.toArray(N).reverse(), [N]), [i, C] = b(!1), R = u(async () => {
+    i || (C(!0), await v(), C(!1));
+  }, [i, v]), l = Q.useRef(null), { scrollPos: o } = te(l), [c, D] = b(!0), [d, G] = b(null), [g, M] = b(0), n = se({
     count: t.length,
-    getScrollElement: () => n.current,
+    getScrollElement: () => l.current,
     estimateSize: () => K,
     getItemKey: (e) => t[e].key ?? e,
     paddingEnd: I,
+    paddingStart: W,
     overscan: U
-  }), r = l.getVirtualItems(), y = u(() => oe({ childrenArray: t, visibleItem: d, scrollPos: o }) ?? -1, [t, o, d]), _ = u(() => {
+  }), r = n.getVirtualItems(), y = u(() => re({ childrenArray: t, visibleItem: d, scrollPos: o }) ?? -1, [t, o, d]), _ = u(() => {
     if (r.length) {
       const e = r.find((s) => s.end >= o.bottom) ?? r[r.length - 1];
-      q({
+      G({
         key: e.key,
@@ -56,18 +58,18 @@ start: e.start,
       return;
-    const i = (s == null ? void 0 : s.animate) ?? !0, f = (s == null ? void 0 : s.align) ?? B, k = (t.length - e - 1) % t.length;
-    l.scrollToIndex(k, { align: f, behavior: i ? "smooth" : void 0 }), setTimeout(() => {
-      l.scrollToIndex(k, { align: f, behavior: void 0 });
+    const a = (s == null ? void 0 : s.animate) ?? !0, f = (s == null ? void 0 : s.align) ?? B, k = (t.length - e - 1) % t.length;
+    n.scrollToIndex(k, { align: f, behavior: a ? "smooth" : void 0 }), setTimeout(() => {
+      n.scrollToIndex(k, { align: f, behavior: void 0 });
     }, 500);
-  }, [t.length, B, l]), S = u(() => {
-    if (!a && n.current && t.length) {
-      const e = y(), s = d ? d.index : t.length, i = e > s, f = h + Math.max(0, e - s);
-      if (f !== h && M(f), i && d) {
-        const G = l.getOffsetForIndex(e, "start")[0] - d.start;
-        l.scrollBy(G), C ? m(-1, { animate: !0, align: "start" }) : c && t.length && m(V({ childrenArray: t, scrollPos: o }), { animate: !0, align: "start" });
+  }, [t.length, B, n]), S = u(() => {
+    if (!i && l.current && t.length) {
+      const e = y(), s = d ? d.index : t.length, a = e > s, f = g + Math.max(0, e - s);
+      if (f !== g && M(f), a && d) {
+        const J = n.getOffsetForIndex(e, "start")[0] - d.start;
+        n.scrollBy(J), z ? m(-1, { animate: !0, align: "start" }) : c && t.length && m(V({ childrenArray: t, scrollPos: o }), { animate: !0, align: "start" });
       }
     }
-  }, [a, t, y, d, h, l, C, c, m, V, o]), P = u(async () => {
-    !v || a || await p();
-  }, [a, p, v]);
-  Z(F, () => ({
+  }, [i, t, y, d, g, n, z, c, m, V, o]), P = u(async () => {
+    !v || i || await R();
+  }, [i, R, v]);
+  ee(F, () => ({
     getAnchorIndex: y,
@@ -80,9 +82,9 @@ saveScrollPosition: _,
   const T = u((e) => {
-    n.current && (n.current.scrollTop -= e.deltaY, e.preventDefault());
+    l.current && (l.current.scrollTop -= e.deltaY, e.preventDefault());
   }, []);
   return E(() => {
-    if (n.current)
-      return n.current.addEventListener("wheel", T), () => {
+    if (l.current)
+      return l.current.addEventListener("wheel", T), () => {
         var e;
-        return (e = n.current) == null ? void 0 : e.removeEventListener("wheel", T);
+        return (e = l.current) == null ? void 0 : e.removeEventListener("wheel", T);
       };
@@ -92,5 +94,5 @@ }, [T]), E(() => {
     const e = o.maxBottom - o.bottom;
-    if (e !== 0 && e < W && P(), o.bottom < Y ? c || D(!0) : c && D(!1), r.length) {
-      const i = (r.find((f) => f.end >= o.bottom) ?? r[0]).index;
-      i < h && M(i);
+    if (e !== 0 && e < q && P(), o.bottom < Y ? c || D(!0) : c && D(!1), r.length) {
+      const a = (r.find((f) => f.end >= o.bottom) ?? r[0]).index;
+      a < g && M(a);
     }
@@ -101,16 +103,16 @@ }, [c, o]), E(() => {
     var e;
-    return /* @__PURE__ */ $("div", { style: L, className: g.root, children: [
+    return /* @__PURE__ */ $("div", { style: L, className: h.root, children: [
       w && !c && w({
-        newItems: h,
+        newItems: g,
         scrollToIndex: m
       }),
-      /* @__PURE__ */ x("div", { className: g.scrollBlock, ref: n, children: /* @__PURE__ */ x(
+      /* @__PURE__ */ x("div", { className: h.scrollBlock, ref: l, children: /* @__PURE__ */ x(
         "div",
         {
-          className: g.wrapper,
-          style: { height: l.getTotalSize() },
+          className: h.wrapper,
+          style: { height: n.getTotalSize() },
           children: /* @__PURE__ */ $(
             "div",
             {
-              className: g.absolutePos,
+              className: h.absolutePos,
               style: {
@@ -121,3 +123,3 @@ transform: `translateY(${((e = r[0]) == null ? void 0 : e.start) ?? 0}px)`
                 r.map((s) => {
-                  const i = t[s.index];
+                  const a = t[s.index];
                   return /* @__PURE__ */ x(
@@ -127,10 +129,10 @@ "div",
                       "data-index": s.index,
-                      ref: l.measureElement,
-                      className: `${g.item} ${z}`,
-                      children: i
+                      ref: n.measureElement,
+                      className: `${h.item} ${p}`,
+                      children: a
                     },
-                    i.key
+                    a.key
                   );
                 }),
-                /* @__PURE__ */ x("div", { className: g.loader, children: /* @__PURE__ */ x("div", { children: a && O }) })
+                /* @__PURE__ */ x("div", { className: h.loader, children: /* @__PURE__ */ x("div", { children: i && O }) })
               ]
@@ -142,6 +144,6 @@ }
     ] });
-  }, [t, w, a, O, m, c, L, h, r, l, z]);
+  }, [t, w, i, O, m, c, L, g, r, n, p]);
 });
 export {
-  xe as AssistantChatScrollReversed
+  ve as AssistantChatScrollReversed
 };

dist/esm/AssistantChatScrollReversed/AssistantChatScrollReversedProps.js

@@ -1,3 +0,3 @@
-import { useMemo as r } from "react";
-const a = ({ childrenArray: e, visibleItem: t }) => t ? e.findIndex((l) => l.key === t.key) : -1, o = ({ childrenArray: e }) => e.length - 1, n = {
+import { useMemo as n } from "react";
+const a = ({ childrenArray: e, visibleItem: t }) => t ? e.findIndex((l) => l.key === t.key) : -1, r = ({ childrenArray: e }) => e.length - 1, o = {
   scrollFollowOffsetPx: 30,
@@ -11,15 +11,16 @@ scrollLoadHistoryOffsetPx: 100,
   paddingStart: 100,
-  appendScrollTargetIndex: o,
+  paddingEnd: 0,
+  appendScrollTargetIndex: r,
   scrollAlignment: "end",
   getScrollButton: null,
   scrollToLastOnAppend: !1
-}, d = (e) => r(() => ({
-  ...n,
+}, d = (e) => n(() => ({
+  ...o,
   ...e
 }), [e]);
 export {
-  n as AssistantChatScrollReversedPropDefaults,
-  o as defaultAppendTargetIndex,
+  o as AssistantChatScrollReversedPropDefaults,
+  r as defaultAppendTargetIndex,
   a as defaultPrependTargetIndex,
   d as useAssistantChatScrollReversedProps
 };

package.json

 {
   "name": "assistant-chat-scroll",
-  "version": "1.0.0-alpha.3",
+  "version": "1.0.0-alpha.4",
   "main": "dist/cjs/main.js",
@@ -5,0 +5,0 @@ "module": "dist/esm/main.js",

No alert changes

Improved metrics

Total package byte prevSize

1162839

increased by0.01%

Lines of code

22673

increased by0.02%

No dependency changes