diff --git a/src/atoms/index.ts b/src/atoms/index.ts index dcb4784..7f4921e 100644 --- a/src/atoms/index.ts +++ b/src/atoms/index.ts @@ -34,5 +34,6 @@ export const currentSourcesAtom = atom((get) => { export const goToTopAtom = atom({ ok: false, + el: undefined as HTMLElement | undefined, fn: undefined as (() => void) | undefined, }) diff --git a/src/components/column/dnd.tsx b/src/components/column/dnd.tsx index 888c838..2e671d8 100644 --- a/src/components/column/dnd.tsx +++ b/src/components/column/dnd.tsx @@ -94,8 +94,12 @@ function DndWrapper({ items, setItems, children }: PropsWithChildren<{ trailing: true, wait: AnimationDuration, }) + const { el } = useAtomValue(goToTopAtom) + useEffect(() => { + console.log(el) + }, [el]) return ( - + {children} ) diff --git a/src/components/common/dnd/index.tsx b/src/components/common/dnd/index.tsx index 1d4ea3f..18f30e9 100644 --- a/src/components/common/dnd/index.tsx +++ b/src/components/common/dnd/index.tsx @@ -1,12 +1,15 @@ import { monitorForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter" import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine" +import { autoScrollForElements } from "@atlaskit/pragmatic-drag-and-drop-auto-scroll/element" import type { PropsWithChildren } from "react" import type { AllEvents, ElementDragType } from "@atlaskit/pragmatic-drag-and-drop/dist/types/internal-types" +import type { ElementAutoScrollArgs } from "@atlaskit/pragmatic-drag-and-drop-auto-scroll/dist/types/internal-types" import { InstanceIdContext } from "./useSortable" interface ContextProps extends Partial> { + autoscroll?: ElementAutoScrollArgs } -export function DndContext({ children, ...callback }: PropsWithChildren) { +export function DndContext({ children, autoscroll, ...callback }: PropsWithChildren) { const [instanceId] = useState(randomUUID()) useEffect(() => { return ( @@ -17,9 +20,10 @@ export function DndContext({ children, ...callback }: PropsWithChildren { }, ) ) - }, [callback, instanceId]) + }, [callback, instanceId, autoscroll]) return ( {children} diff --git a/src/components/common/overlay-scrollbar/index.tsx b/src/components/common/overlay-scrollbar/index.tsx index 789d7cc..6189ef8 100644 --- a/src/components/common/overlay-scrollbar/index.tsx +++ b/src/components/common/overlay-scrollbar/index.tsx @@ -71,6 +71,7 @@ export function GlobalOverlayScrollbar({ children, className, ...props }: PropsW const el = e.target as HTMLElement setGoToTop({ ok: el.scrollTop > 100, + el, fn: () => el.scrollTo({ top: 0, behavior: "smooth" }), }) },