dce-reactkit 3.5.8 → 3.5.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +18 -24
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +18 -24
- package/dist/esm/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/AutoscrollToBottomContainer.tsx +21 -22
package/dist/cjs/index.js
CHANGED
|
@@ -40804,10 +40804,10 @@ const getItemIds = (items) => {
|
|
|
40804
40804
|
// Types of actions
|
|
40805
40805
|
var ActionType;
|
|
40806
40806
|
(function (ActionType) {
|
|
40807
|
-
//
|
|
40808
|
-
ActionType["
|
|
40809
|
-
//
|
|
40810
|
-
ActionType["
|
|
40807
|
+
// Hide the "jump to bottom" button
|
|
40808
|
+
ActionType["HideJumpToBottomButton"] = "HideJumpToBottomButton";
|
|
40809
|
+
// Show the "jump to bottom" button
|
|
40810
|
+
ActionType["ShowJumpToBottomButton"] = "ShowJumpToBottomButton";
|
|
40811
40811
|
})(ActionType || (ActionType = {}));
|
|
40812
40812
|
/**
|
|
40813
40813
|
* Reducer that executes actions
|
|
@@ -40817,15 +40817,11 @@ var ActionType;
|
|
|
40817
40817
|
*/
|
|
40818
40818
|
const reducer = (state, action) => {
|
|
40819
40819
|
switch (action.type) {
|
|
40820
|
-
case ActionType.
|
|
40821
|
-
return Object.assign(Object.assign({}, state), {
|
|
40822
|
-
// Hide the "jump to bottom" button
|
|
40823
|
-
jumpToBottomButtonVisible: false });
|
|
40820
|
+
case ActionType.HideJumpToBottomButton: {
|
|
40821
|
+
return Object.assign(Object.assign({}, state), { jumpToBottomButtonVisible: false });
|
|
40824
40822
|
}
|
|
40825
|
-
case ActionType.
|
|
40826
|
-
return Object.assign(Object.assign({}, state), {
|
|
40827
|
-
// Show the "jump to bottom" button
|
|
40828
|
-
jumpToBottomButtonVisible: true });
|
|
40823
|
+
case ActionType.ShowJumpToBottomButton: {
|
|
40824
|
+
return Object.assign(Object.assign({}, state), { jumpToBottomButtonVisible: true });
|
|
40829
40825
|
}
|
|
40830
40826
|
default: {
|
|
40831
40827
|
return state;
|
|
@@ -40873,10 +40869,10 @@ const AutoscrollToBottomContainer = (props) => {
|
|
|
40873
40869
|
return true;
|
|
40874
40870
|
}
|
|
40875
40871
|
// Get info about container
|
|
40876
|
-
const { scrollTop, } = container.current;
|
|
40872
|
+
const { scrollTop, scrollHeight, clientHeight, } = container.current;
|
|
40877
40873
|
// Distance to bottom
|
|
40878
40874
|
const rootFontSizePx = Number.parseInt(getComputedStyle(document.documentElement).fontSize, 10);
|
|
40879
|
-
const distanceToBottomRems = Math.abs(scrollTop / rootFontSizePx);
|
|
40875
|
+
const distanceToBottomRems = Math.abs((scrollTop + clientHeight - scrollHeight) / rootFontSizePx);
|
|
40880
40876
|
// Figure out if we're scrolled to the bottom
|
|
40881
40877
|
return (distanceToBottomRems < SCROLLED_TO_BOTTOM_THRESHOLD_REMS);
|
|
40882
40878
|
};
|
|
@@ -40891,10 +40887,10 @@ const AutoscrollToBottomContainer = (props) => {
|
|
|
40891
40887
|
}
|
|
40892
40888
|
// Update state
|
|
40893
40889
|
dispatch({
|
|
40894
|
-
type: ActionType.
|
|
40890
|
+
type: ActionType.HideJumpToBottomButton,
|
|
40895
40891
|
});
|
|
40896
40892
|
// Scroll to bottom
|
|
40897
|
-
container.current.scrollTop =
|
|
40893
|
+
container.current.scrollTop = container.current.scrollHeight;
|
|
40898
40894
|
};
|
|
40899
40895
|
/*----------------------------------------*/
|
|
40900
40896
|
/* -------------- Handlers -------------- */
|
|
@@ -40908,12 +40904,10 @@ const AutoscrollToBottomContainer = (props) => {
|
|
|
40908
40904
|
if (!container.current) {
|
|
40909
40905
|
return;
|
|
40910
40906
|
}
|
|
40911
|
-
//
|
|
40912
|
-
|
|
40913
|
-
// Remember if now no longer scrolled to bottom
|
|
40914
|
-
if (nowScrolledToBottom) {
|
|
40907
|
+
// If scrolled to bottom, hide the button
|
|
40908
|
+
if (isScrolledToBottom()) {
|
|
40915
40909
|
dispatch({
|
|
40916
|
-
type: ActionType.
|
|
40910
|
+
type: ActionType.HideJumpToBottomButton,
|
|
40917
40911
|
});
|
|
40918
40912
|
}
|
|
40919
40913
|
};
|
|
@@ -40936,11 +40930,11 @@ const AutoscrollToBottomContainer = (props) => {
|
|
|
40936
40930
|
// Check if new content appeared
|
|
40937
40931
|
const currentItemIds = getItemIds(items);
|
|
40938
40932
|
// Check if new content appeared at bottom
|
|
40939
|
-
const
|
|
40933
|
+
const newContentAppeared = (currentItemIds.length > 0
|
|
40940
40934
|
&& (currentItemIds[currentItemIds.length - 1]
|
|
40941
40935
|
!== lastItemIds.current[lastItemIds.current.length - 1]));
|
|
40942
40936
|
// Do nothing if no new content
|
|
40943
|
-
if (!
|
|
40937
|
+
if (!newContentAppeared) {
|
|
40944
40938
|
return;
|
|
40945
40939
|
}
|
|
40946
40940
|
// Check if used to be scrolled to the bottom
|
|
@@ -40951,7 +40945,7 @@ const AutoscrollToBottomContainer = (props) => {
|
|
|
40951
40945
|
else {
|
|
40952
40946
|
// Not scrolled to bottom. Show "jump to bottom" button.
|
|
40953
40947
|
dispatch({
|
|
40954
|
-
type: ActionType.
|
|
40948
|
+
type: ActionType.ShowJumpToBottomButton,
|
|
40955
40949
|
});
|
|
40956
40950
|
}
|
|
40957
40951
|
// Update last item ids
|