Skip to content

Feature/insertion plugin #81

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

Feature/insertion plugin #81

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
4fbe9f1
internal: implements insertion points correctly for vertically spaced…
Jun 28, 2024
89c8031
internal: now handles both horizontal and vertical layouts
Jun 28, 2024
b2712ce
internal: changes way classes are applied in mixed.vue example
Jun 28, 2024
fd5c8f4
feat:
Jun 28, 2024
3af385a
internal: fixes some ty ping issues.
Jun 28, 2024
900e992
internal: adds comment denoting insertion plugin is still under devel…
Jun 28, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 13 additions & 4 deletions src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ export { animations } from "./plugins/animations";
export { selections } from "./plugins/multiDrag/plugins/selections";
export { swap } from "./plugins/swap";
export { place } from "./plugins/place";
export { insertion } from "./plugins/insertion";
export * from "./utils";

const scrollConfig: {
Expand Down Expand Up @@ -454,6 +455,10 @@ export function remapNodes<T>(parent: HTMLElement, force?: boolean) {
parents.set(parent, { ...parentData, enabledNodes: enabledNodeRecords });

config.remapFinished(parentData);

parentData.config.plugins?.forEach((plugin: DNDPlugin) => {
plugin(parent)?.remapFinished?.();
});
}

export function remapFinished() {
Expand All @@ -476,13 +481,16 @@ export function handleDragstart<T>(data: NodeEventData<T>) {
export function dragstartClasses(
el: HTMLElement | Node | Element,
draggingClass: string | undefined,
dropZoneClass: string | undefined
dropZoneClass: string | undefined,
dragPlaceholderClass: string | undefined
) {
addClass([el], draggingClass);

setTimeout(() => {
removeClass([el], draggingClass);

addClass([el], dragPlaceholderClass);

addClass([el], dropZoneClass);
});
}
Expand All @@ -507,7 +515,7 @@ export function initDrag<T>(eventData: NodeDragEventData<T>): DragState<T> {
return dragState;
}

function validateDragHandle<T>(data: NodeEventData<T>): boolean {
export function validateDragHandle<T>(data: NodeEventData<T>): boolean {
if (!(data.e instanceof DragEvent) && !(data.e instanceof TouchEvent))
return false;

Expand Down Expand Up @@ -567,7 +575,8 @@ export function dragstart<T>(data: NodeDragEventData<T>) {
dragstartClasses(
dragState.draggedNode.el,
config.draggingClass,
config.dropZoneClass
config.dropZoneClass,
config.dragPlaceholderClass
);
}

Expand Down Expand Up @@ -988,7 +997,7 @@ function touchmove<T>(data: NodeTouchEventData<T>, touchState: TouchState<T>) {
}
}

function handleScroll() {
export function handleScroll() {
for (const direction of Object.keys(scrollConfig)) {
const [x, y] = scrollConfig[direction];

Expand Down
Loading