archive-gh-me/nextui
1
0
Fork 0
mirror of https://github.com/nextui-org/nextui.git synced 2025-12-08 19:26:11 +00:00
Code Issues Projects Releases Wiki Activity

fix(pagination): fast pagination animation

Browse Source
This commit is contained in:
Junior Garcia 2023-03-19 17:28:29 -03:00
parent 28229dc0ae
commit 03ad9214af
2 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/components/pagination/src/use-pagination.ts
View File

@ -106,7 +106,7 @@ export function usePagination(originalProps: UsePaginationProps) {
const cursorRef = useRef<HTMLElement>(null);
const itemsRef = useRef<Map<number, HTMLElement>>();
let cursorTimer: Timer;
const cursorTimer = useRef<Timer>();
function getItemsRefMap() {
if (!itemsRef.current) {
@ -132,8 +132,8 @@ export function usePagination(originalProps: UsePaginationProps) {
const node = map.get(value);
// clean up the cursor timer
clearTimeout(cursorTimer);
// clean up the previous cursor timer (if any)
cursorTimer.current && clearTimeout(cursorTimer.current);
if (node) {
// get position of the item
@ -145,13 +145,13 @@ export function usePagination(originalProps: UsePaginationProps) {
cursorRef.current.style.transform = `translateX(${offsetLeft}px) scale(1.1)`;
}
cursorTimer = setTimeout(() => {
cursorTimer.current = setTimeout(() => {
// reset the scale of the cursor
if (cursorRef.current) {
cursorRef.current.setAttribute("data-moving", "false");
cursorRef.current.style.transform = `translateX(${offsetLeft}px) scale(1)`;
}
clearTimeout(cursorTimer);
cursorTimer.current && clearTimeout(cursorTimer.current);
}, CURSOR_TRANSITION_TIMEOUT);
}
}

2
packages/storybook/.storybook/welcome.stories.mdx
View File

@ -134,7 +134,7 @@ import {link, button} from "@nextui-org/theme";
<br/>
<div class="block text-xs text-neutral-400">
Last updated on <time datetime="2023-03-07">March 13, 2023</time>
Last updated on <time datetime="2023-03-07">March 19, 2023</time>
</div>