npm - @byeolnaerim/flex-layout - Versions diffs - 0.0.7 → 0.0.9 - Mend

@byeolnaerim/flex-layout 0.0.7 → 0.0.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.

Files changed (127) hide show

package/dist/flex-layout/hooks/useDrag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/flex-layout/hooks/useDrag.ts"],"names":["setFolderEvent"],"mappings":"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","file":"useDrag.js","sourcesContent":["import equal from \"fast-deep-equal\";\r\nimport {\r\n\tMouseEvent,\r\n\tReactElement,\r\n\tRefObject,\r\n\tTouchEvent,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport { BehaviorSubject, distinctUntilChanged, map, Subject } from \"rxjs\";\r\nimport { DropDocumentOutsideOption } from \"../components/FlexLayoutSplitScreenDragBox\";\r\nimport { getClientXy } from \"../utils/FlexLayoutUtils\";\r\nexport interface DragStateType {\r\n\tisDragging: boolean;\r\n\tisDrop: boolean;\r\n\tnavigationTitle?: string;\r\n\tchildren?: ReactElement;\r\n\tcontainerName: string;\r\n\tx: number;\r\n\ty: number;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tscreenKey?: string;\r\n\tcustomData?: Record<string, string \| number \| boolean \| undefined>;\r\n}\r\nexport type PositionName =\r\n\t\| \"centerBoundary\"\r\n\t\| \"leftBoundary\"\r\n\t\| \"rightBoundary\"\r\n\t\| \"topBoundary\"\r\n\t\| \"bottomBoundary\";\r\n\r\nexport interface DragStateResultType extends DragStateType {\r\n\tpositionName: PositionName;\r\n\tisOver: boolean;\r\n}\r\nexport const dragState = new Subject<DragStateType>();\r\nconst filterChildren = (obj: any) => {\r\n\t// 객체 복사 후 children 속성 제거\r\n\tconst { children, ...rest } = obj \|\| {};\r\n\treturn rest;\r\n};\r\n\r\nexport const useDragCapture = (targetRef: RefObject<HTMLElement \| null>) => {\r\n\tconst stateRef = useRef<DragStateResultType \| null>(null); // 상태를 저장하는 useRef\r\n\tconst forceUpdate = useRef(0); // 강제로 업데이트를 트리거하기 위한 변수\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscription = dragState\r\n\t\t\t.pipe(\r\n\t\t\t\tmap((value) => {\r\n\t\t\t\t\tif (!targetRef \|\| !targetRef.current) return null;\r\n\r\n\t\t\t\t\tconst { x, y } = value;\r\n\t\t\t\t\tconst rect = targetRef.current.getBoundingClientRect();\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\twidth,\r\n\t\t\t\t\t\theight,\r\n\t\t\t\t\t\tx: rectX,\r\n\t\t\t\t\t\ty: rectY,\r\n\t\t\t\t\t\tright,\r\n\t\t\t\t\t\tbottom,\r\n\t\t\t\t\t} = rect;\r\n\r\n\t\t\t\t\tlet isOver = false;\r\n\t\t\t\t\tif (x < rectX \|\| x > right \|\| y < rectY \|\| y > bottom) {\r\n\t\t\t\t\t\tisOver = true;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst leftBoundary = rectX + width * 0.2;\r\n\t\t\t\t\tconst rightBoundary = right - width * 0.2;\r\n\t\t\t\t\tconst topBoundary = rectY + height * 0.2;\r\n\t\t\t\t\tconst bottomBoundary = bottom - height * 0.2;\r\n\r\n\t\t\t\t\tlet position = \"centerBoundary\";\r\n\t\t\t\t\tif (x < leftBoundary) {\r\n\t\t\t\t\t\tposition = \"leftBoundary\";\r\n\t\t\t\t\t} else if (x > rightBoundary) {\r\n\t\t\t\t\t\tposition = \"rightBoundary\";\r\n\t\t\t\t\t} else if (y < topBoundary) {\r\n\t\t\t\t\t\tposition = \"topBoundary\";\r\n\t\t\t\t\t} else if (y > bottomBoundary) {\r\n\t\t\t\t\t\tposition = \"bottomBoundary\";\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\treturn {\r\n\t\t\t\t\t\tpositionName: position as PositionName,\r\n\t\t\t\t\t\tisOver,\r\n\t\t\t\t\t\t...value,\r\n\t\t\t\t\t};\r\n\t\t\t\t}),\r\n\t\t\t\tdistinctUntilChanged((prev, curr) =>\r\n\t\t\t\t\tequal(filterChildren(prev), filterChildren(curr)),\r\n\t\t\t\t),\r\n\t\t\t)\r\n\t\t\t.subscribe({\r\n\t\t\t\tnext: (value) => {\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tvalue &&\r\n\t\t\t\t\t\t!equal(\r\n\t\t\t\t\t\t\tfilterChildren(stateRef.current),\r\n\t\t\t\t\t\t\tfilterChildren(value),\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tstateRef.current = value; // 상태를 업데이트\r\n\t\t\t\t\t\tforceUpdate.current++; // 업데이트 트리거\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\terror: (err) => console.error(err),\r\n\t\t\t});\r\n\r\n\t\treturn () => subscription.unsubscribe();\r\n\t}, [targetRef]);\r\n\r\n\t// 강제 렌더링을 트리거하기 위한 업데이트\r\n\tconst [, rerender] = useState({});\r\n\tuseEffect(() => {\r\n\t\tconst interval = setInterval(() => {\r\n\t\t\trerender({}); // 변경된 ref 상태를 반영\r\n\t\t}, 50); // 50ms 간격으로 렌더링 반영\r\n\t\treturn () => clearInterval(interval);\r\n\t}, []);\r\n\r\n\treturn stateRef.current;\r\n};\r\nexport interface DropTargetComponent {\r\n\tcontainerName: string;\r\n\tcomponent: ReactElement;\r\n\tnavigationTitle?: string;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey: string;\r\n}\r\nexport type DropPositionOrderName = \"before\" \| \"center\" \| \"after\";\r\n\r\nexport interface DropMovementEventType {\r\n\tstate: \"remove\" \| \"append\" \| \"change\";\r\n\ttargetParentLayoutName: string;\r\n\ttargetLayoutName: string;\r\n\ttargetContainerName: string;\r\n\ttargetComponent?: ReactElement;\r\n\tnextContainerName?: string;\r\n\tparentOrderName?: DropPositionOrderName;\r\n\torderName?: DropPositionOrderName;\r\n\tx?: number;\r\n\ty?: number;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tdropTargetComponentEvent?: DropTargetComponentEvent;\r\n}\r\nexport interface DropTargetComponentEvent extends Omit<\r\n\tDropTargetComponent,\r\n\t\"containerName\" \| \"component\"\r\n> {\r\n\tdirection: \"row\" \| \"column\";\r\n}\r\nexport const dropMovementEventSubject = new Subject<DropMovementEventType>();\r\n\r\nexport const allSplitScreenCount = new BehaviorSubject<number>(0);\r\n\r\nexport const useDragEvents = ({\r\n\tisBlockingActiveInput = false,\r\n}: {\r\n\tisBlockingActiveInput?: boolean;\r\n}) => {\r\n\tconst dragResumeTimer = useRef<ReturnType<typeof setTimeout> \| null>(null);\r\n\tconst scrollThreshold = 10; // 이동 거리 임계값\r\n\r\n\tconst isScrolling = useRef<boolean>(false);\r\n\tconst isPending = useRef(false);\r\n\tconst isMouseDown = useRef(false);\r\n\tconst isDragging = useRef(false); // 드래그 상태 플래그\r\n\tconst touchStartX = useRef<number>(0);\r\n\tconst touchStartY = useRef<number>(0);\r\n\r\n\tconst handleStart = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragStartCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent \| TouchEvent \| Event;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\t// 기존 타이머가 있다면 정리\r\n\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t}\r\n\r\n\t\t\tif (\r\n\t\t\t\t(event.target as HTMLElement).contentEditable === \"true\" \|\|\r\n\t\t\t\t(isBlockingActiveInput &&\r\n\t\t\t\t\tdocument.activeElement === event.target)\r\n\t\t\t) {\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tif (event.cancelable) {\r\n\t\t\t\tevent.preventDefault(); // cancelable=false 면 자동 skip\r\n\t\t\t}\r\n\t\t\tisPending.current = true;\r\n\t\t\tisMouseDown.current = true;\r\n\t\t\tif (event instanceof globalThis.TouchEvent) {\r\n\t\t\t\tconst touch = event.touches[0];\r\n\t\t\t\ttouchStartX.current = touch.clientX;\r\n\t\t\t\ttouchStartY.current = touch.clientY;\r\n\t\t\t} else if (event instanceof globalThis.MouseEvent) {\r\n\t\t\t\ttouchStartX.current = event.clientX;\r\n\t\t\t\ttouchStartY.current = event.clientY;\r\n\t\t\t}\r\n\t\t\t//event.preventDefault();\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tif (!isPending.current \|\| isScrolling.current) return; // 스크롤 중이면 드래그 취소\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\tisDragging.current = true;\r\n\r\n\t\t\t\tconst xy = getClientXy(event);\r\n\t\t\t\tif (!xy) return;\r\n\r\n\t\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t}, 300);\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\tconst handleMove = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tnotDragCallback,\r\n\t\t\tdragStartCallback,\r\n\t\t\tmoveingCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent \| TouchEvent \| Event;\r\n\t\t\tnotDragCallback?: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tmoveingCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tif (!isMouseDown.current) return;\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\t\t\tconst deltaX = Math.abs(clientX - touchStartX.current);\r\n\t\t\tconst deltaY = Math.abs(clientY - touchStartY.current);\r\n\r\n\t\t\tif (\r\n\t\t\t\tisPending.current &&\r\n\t\t\t\t(deltaX > scrollThreshold \|\| deltaY > scrollThreshold)\r\n\t\t\t) {\r\n\t\t\t\tisScrolling.current = true; // 스크롤 중으로 설정\r\n\t\t\t\tisPending.current = false; // 드래그 취소\r\n\t\t\t\tisDragging.current = false;\r\n\r\n\t\t\t\tif (notDragCallback)\r\n\t\t\t\t\tnotDragCallback({ x: clientX, y: clientY });\r\n\t\t\t\t//if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\r\n\t\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t\t}\r\n\t\t\t\tdragResumeTimer.current = setTimeout(() => {\r\n\t\t\t\t\tif (!isMouseDown.current) return;\r\n\t\t\t\t\tif (dragStartCallback)\r\n\t\t\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t\t\tisPending.current = true;\r\n\t\t\t\t\tisScrolling.current = false;\r\n\t\t\t\t\thandleStart({ event: _event, dragStartCallback });\r\n\t\t\t\t}, 400);\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tif (!isDragging.current \|\| isPending.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tmoveingCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\tconst handleEnd = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragEndCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent \| TouchEvent \| Event;\r\n\t\t\tdragEndCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tisScrolling.current = false;\r\n\t\t\tisMouseDown.current = false;\r\n\t\t\tif (isPending.current) {\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tif (!isDragging.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tisDragging.current = false; // 드래그 종료\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\tdragEndCallback({ x: clientX, y: clientY });\r\n\t\t\t// const href = hrefUrlRef.current;\r\n\r\n\t\t\t// if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t\t// //console.log(clientX, clientY);\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption &&\r\n\t\t\t// isDocumentOut({ x: clientX, y: clientY })\r\n\t\t\t// ) {\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption.isNewTap \|\|\r\n\t\t\t// (!dropDocumentOutsideOption.widthRatio &&\r\n\t\t\t// !dropDocumentOutsideOption.heightRatio)\r\n\t\t\t// ) {\r\n\t\t\t// window.open(href, '_blank');\r\n\t\t\t// } else {\r\n\t\t\t// const width =\r\n\t\t\t// window.innerWidth \r\n\t\t\t// (dropDocumentOutsideOption.widthRatio \|\| 1);\r\n\t\t\t// const height =\r\n\t\t\t// window.innerHeight \r\n\t\t\t// (dropDocumentOutsideOption.heightRatio \|\| 1);\r\n\t\t\t// window.open(\r\n\t\t\t// href,\r\n\t\t\t// '_blank',\r\n\t\t\t// `width=${width},height=${height},left=${window.screenLeft - clientX * -1 - width},top=${window.screenTop + clientY}`\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t\t// }\r\n\r\n\t\t\t// dragState.next({\r\n\t\t\t// isDragging: false,\r\n\t\t\t// isDrop: true,\r\n\t\t\t// navigationTitle,\r\n\t\t\t// children: targetComponent,\r\n\t\t\t// x: clientX,\r\n\t\t\t// y: clientY,\r\n\t\t\t// containerName,\r\n\t\t\t// dropDocumentOutsideOption,\r\n\t\t\t// dropEndCallback,\r\n\t\t\t// screenKey,\r\n\t\t\t// customData,\r\n\t\t\t// });\r\n\t\t\t//if (dropEndCallback) dropEndCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\treturn {\r\n\t\thandleStart,\r\n\t\thandleMove,\r\n\t\thandleEnd,\r\n\t};\r\n};\r\n\r\nexport type FolderEventType = {\r\n\ttype: \"new\" \| \"sort\" \| \"title\" \| \"delete\" \| \"insert\" \| \"update\" \| \"next\";\r\n\tisFolder: boolean;\r\n\ttitle: string;\r\n\tsort?: number;\r\n\tparentId?: string;\r\n\tid?: string;\r\n\tnewData?: any;\r\n};\r\n\r\nexport const folderEventSubject = new Subject<FolderEventType>();\r\n\r\nexport const setFolderEvent = (newValue: FolderEventType) => {\r\n\tfolderEventSubject.next(newValue);\r\n};\r\n\r\nexport const useFolderEvent = () => {\r\n\tconst [folderEvent, setFolderEvent] = useState<FolderEventType \| null>(\r\n\t\tnull,\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst subscription = folderEventSubject.subscribe((e) => {\r\n\t\t\tif (!e) return;\r\n\t\t\tsetFolderEvent(e);\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tif (subscription) {\r\n\t\t\t\tsubscription.unsubscribe();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\r\n\treturn { folderEvent };\r\n};\r\n"]}
1	+ {"version":3,"sources":["../../../src/flex-layout/hooks/useDrag.ts"],"sourcesContent":["import equal from \"fast-deep-equal\";\r\nimport {\r\n\tMouseEvent,\r\n\tReactElement,\r\n\tRefObject,\r\n\tTouchEvent,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport {\r\n\tanimationFrameScheduler,\r\n\tauditTime,\r\n\tBehaviorSubject,\r\n\tdistinctUntilChanged,\r\n\tmap,\r\n\tSubject,\r\n} from \"rxjs\";\r\nimport { DropDocumentOutsideOption } from \"../components/FlexLayoutSplitScreenDragBox\";\r\nimport { getClientXy } from \"../utils/FlexLayoutUtils\";\r\nexport interface DragStateType {\r\n\tisDragging: boolean;\r\n\tisDrop: boolean;\r\n\tnavigationTitle?: string;\r\n\tchildren?: ReactElement;\r\n\tcontainerName: string;\r\n\tx: number;\r\n\ty: number;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tscreenKey?: string;\r\n\tcustomData?: Record<string, string \| number \| boolean \| undefined>;\r\n}\r\nexport type PositionName =\r\n\t\| \"centerBoundary\"\r\n\t\| \"leftBoundary\"\r\n\t\| \"rightBoundary\"\r\n\t\| \"topBoundary\"\r\n\t\| \"bottomBoundary\";\r\n\r\nexport interface DragStateResultType extends DragStateType {\r\n\tpositionName: PositionName;\r\n\tisOver: boolean;\r\n}\r\nexport const dragStateSubject = new Subject<DragStateType>();\r\n/*\r\n @deprecated Use `dragStateSubject` instead. This alias will be removed in a future release.\r\n /\r\nexport const dragState = dragStateSubject;\r\n\r\nexport const isResizingSubject = new BehaviorSubject<boolean>(false);\r\n\r\nconst filterChildren = (obj: any) => {\r\n\t// 객체 복사 후 children 속성 제거\r\n\tconst { children, ...rest } = obj \|\| {};\r\n\treturn rest;\r\n};\r\n\r\nexport const useDragCapture = (targetRef: RefObject<HTMLElement \| null>) => {\r\n\tconst [state, setState] = useState<DragStateResultType \| null>(null);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscription = dragStateSubject\r\n\t\t\t.pipe(\r\n\t\t\t\tauditTime(0, animationFrameScheduler),\r\n\t\t\t\tmap((value) => {\r\n\t\t\t\t\tif (!targetRef \|\| !targetRef.current) return null;\r\n\r\n\t\t\t\t\tconst { x, y } = value;\r\n\t\t\t\t\tconst rect = targetRef.current.getBoundingClientRect();\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\twidth,\r\n\t\t\t\t\t\theight,\r\n\t\t\t\t\t\tx: rectX,\r\n\t\t\t\t\t\ty: rectY,\r\n\t\t\t\t\t\tright,\r\n\t\t\t\t\t\tbottom,\r\n\t\t\t\t\t} = rect;\r\n\r\n\t\t\t\t\tlet isOver = false;\r\n\t\t\t\t\tif (x < rectX \|\| x > right \|\| y < rectY \|\| y > bottom) {\r\n\t\t\t\t\t\tisOver = true;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst leftBoundary = rectX + width 0.2;\r\n\t\t\t\t\tconst rightBoundary = right - width * 0.2;\r\n\t\t\t\t\tconst topBoundary = rectY + height * 0.2;\r\n\t\t\t\t\tconst bottomBoundary = bottom - height * 0.2;\r\n\r\n\t\t\t\t\tlet position = \"centerBoundary\";\r\n\t\t\t\t\tif (x < leftBoundary) {\r\n\t\t\t\t\t\tposition = \"leftBoundary\";\r\n\t\t\t\t\t} else if (x > rightBoundary) {\r\n\t\t\t\t\t\tposition = \"rightBoundary\";\r\n\t\t\t\t\t} else if (y < topBoundary) {\r\n\t\t\t\t\t\tposition = \"topBoundary\";\r\n\t\t\t\t\t} else if (y > bottomBoundary) {\r\n\t\t\t\t\t\tposition = \"bottomBoundary\";\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\treturn {\r\n\t\t\t\t\t\tpositionName: position as PositionName,\r\n\t\t\t\t\t\tisOver,\r\n\t\t\t\t\t\t...value,\r\n\t\t\t\t\t};\r\n\t\t\t\t}),\r\n\t\t\t\tdistinctUntilChanged((prev, curr) => {\r\n\t\t\t\t\tconst { children: prevChildren, ..._prev } = prev \|\| {};\r\n\t\t\t\t\tconst { children: currChildren, ..._curr } = curr \|\| {};\r\n\r\n\t\t\t\t\treturn equal(filterChildren(_prev), filterChildren(_curr));\r\n\t\t\t\t}),\r\n\t\t\t)\r\n\t\t\t.subscribe({\r\n\t\t\t\tnext: setState,\r\n\t\t\t\terror: (err) => console.error(err),\r\n\t\t\t});\r\n\r\n\t\treturn () => subscription.unsubscribe();\r\n\t}, [targetRef]);\r\n\r\n\treturn state;\r\n};\r\nexport interface DropTargetComponent {\r\n\tcontainerName: string;\r\n\tcomponent: ReactElement;\r\n\tnavigationTitle?: string;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey: string;\r\n}\r\nexport type DropPositionOrderName = \"before\" \| \"center\" \| \"after\";\r\n\r\nexport interface DropMovementEventType {\r\n\tstate: \"remove\" \| \"append\" \| \"change\";\r\n\ttargetParentLayoutName: string;\r\n\ttargetLayoutName: string;\r\n\ttargetContainerName: string;\r\n\ttargetComponent?: ReactElement;\r\n\tnextContainerName?: string;\r\n\tparentOrderName?: DropPositionOrderName;\r\n\torderName?: DropPositionOrderName;\r\n\tx?: number;\r\n\ty?: number;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tdropTargetComponentEvent?: DropTargetComponentEvent;\r\n}\r\nexport interface DropTargetComponentEvent extends Omit<\r\n\tDropTargetComponent,\r\n\t\"containerName\" \| \"component\"\r\n> {\r\n\tdirection: \"row\" \| \"column\";\r\n}\r\nexport const dropMovementEventSubject = new Subject<DropMovementEventType>();\r\n\r\nexport const allSplitScreenCount = new BehaviorSubject<number>(0);\r\n\r\nexport const useDragEvents = ({\r\n\tisBlockingActiveInput = false,\r\n}: {\r\n\tisBlockingActiveInput?: boolean;\r\n}) => {\r\n\tconst dragResumeTimer = useRef<ReturnType<typeof setTimeout> \| null>(null);\r\n\tconst dragStartDelayTimer = useRef<ReturnType<typeof setTimeout> \| null>(\r\n\t\tnull,\r\n\t);\r\n\r\n\tconst scrollThreshold = 10; // 이동 거리 임계값\r\n\r\n\tconst isScrolling = useRef<boolean>(false);\r\n\tconst isPending = useRef(false);\r\n\tconst isMouseDown = useRef(false);\r\n\tconst isDragging = useRef(false); // 드래그 상태 플래그\r\n\tconst touchStartX = useRef<number>(0);\r\n\tconst touchStartY = useRef<number>(0);\r\n\r\n\tuseEffect(() => {\r\n\t\treturn () => {\r\n\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t}\r\n\t\t\tif (dragStartDelayTimer.current) {\r\n\t\t\t\tclearTimeout(dragStartDelayTimer.current);\r\n\t\t\t\tdragStartDelayTimer.current = null;\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\r\n\tconst handleStart = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragStartCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent \| TouchEvent \| Event;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\t// 기존 타이머가 있다면 정리\r\n\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t}\r\n\t\t\tif (dragStartDelayTimer.current) {\r\n\t\t\t\tclearTimeout(dragStartDelayTimer.current);\r\n\t\t\t\tdragStartDelayTimer.current = null;\r\n\t\t\t}\r\n\r\n\t\t\tif (\r\n\t\t\t\t(event.target as HTMLElement).contentEditable === \"true\" \|\|\r\n\t\t\t\t(isBlockingActiveInput &&\r\n\t\t\t\t\tdocument.activeElement === event.target)\r\n\t\t\t) {\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tif (event.cancelable && !(event instanceof globalThis.TouchEvent)) {\r\n\t\t\t\tevent.preventDefault(); // cancelable=false 면 자동 skip\r\n\t\t\t}\r\n\r\n\t\t\tisPending.current = true;\r\n\t\t\tisMouseDown.current = true;\r\n\t\t\tisScrolling.current = false;\r\n\r\n\t\t\t// if (event instanceof globalThis.TouchEvent) {\r\n\t\t\t// \tconst touch = event.touches[0];\r\n\t\t\t// \ttouchStartX.current = touch.clientX;\r\n\t\t\t// \ttouchStartY.current = touch.clientY;\r\n\t\t\t// } else if (event instanceof globalThis.MouseEvent) {\r\n\t\t\t// \ttouchStartX.current = event.clientX;\r\n\t\t\t// \ttouchStartY.current = event.clientY;\r\n\t\t\t// }\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\t\t\ttouchStartX.current = xy.clientX;\r\n\t\t\ttouchStartY.current = xy.clientY;\r\n\r\n\t\t\tif (\r\n\t\t\t\tevent.type.toLowerCase().startsWith(\"touch\") \|\|\r\n\t\t\t\tevent instanceof globalThis.TouchEvent\r\n\t\t\t) {\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\tisDragging.current = true;\r\n\r\n\t\t\t\tdragStartCallback({ x: xy.clientX, y: xy.clientY });\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\t//event.preventDefault();\r\n\t\t\tdragStartDelayTimer.current = setTimeout(() => {\r\n\t\t\t\tif (!isPending.current \|\| isScrolling.current) return; // 스크롤 중이면 드래그 취소\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\tisDragging.current = true;\r\n\r\n\t\t\t\tconst xy = getClientXy(event);\r\n\t\t\t\tif (!xy) return;\r\n\r\n\t\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t}, 300);\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\tconst handleMove = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tnotDragCallback,\r\n\t\t\tdragStartCallback,\r\n\t\t\tmoveingCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent \| TouchEvent \| Event;\r\n\t\t\tnotDragCallback?: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tmoveingCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tif (!isMouseDown.current) return;\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\t\t\tconst deltaX = Math.abs(clientX - touchStartX.current);\r\n\t\t\tconst deltaY = Math.abs(clientY - touchStartY.current);\r\n\r\n\t\t\tif (\r\n\t\t\t\tisPending.current &&\r\n\t\t\t\t(event.type.toLowerCase().startsWith(\"touch\") \|\|\r\n\t\t\t\t\tevent instanceof globalThis.TouchEvent) &&\r\n\t\t\t\t(deltaX > scrollThreshold \|\| deltaY > scrollThreshold)\r\n\t\t\t) {\r\n\t\t\t\tif (dragStartDelayTimer.current) {\r\n\t\t\t\t\tclearTimeout(dragStartDelayTimer.current);\r\n\t\t\t\t\tdragStartDelayTimer.current = null;\r\n\t\t\t\t}\r\n\r\n\t\t\t\tisScrolling.current = true; // 스크롤 중으로 설정\r\n\t\t\t\tisPending.current = false; // 드래그 취소\r\n\t\t\t\tisDragging.current = false;\r\n\r\n\t\t\t\tif (notDragCallback)\r\n\t\t\t\t\tnotDragCallback({ x: clientX, y: clientY });\r\n\t\t\t\t//if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\r\n\t\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t\t}\r\n\t\t\t\tdragResumeTimer.current = setTimeout(() => {\r\n\t\t\t\t\tif (!isMouseDown.current) return;\r\n\t\t\t\t\t// if (dragStartCallback)\r\n\t\t\t\t\t// \tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t\t\t// isPending.current = true;\r\n\t\t\t\t\t// isScrolling.current = false;\r\n\t\t\t\t\t// handleStart({ event: _event, dragStartCallback });\r\n\r\n\t\t\t\t\ttouchStartX.current = clientX;\r\n\t\t\t\t\ttouchStartY.current = clientY;\r\n\t\t\t\t\tisPending.current = true;\r\n\t\t\t\t\tisScrolling.current = false;\r\n\t\t\t\t\thandleStart({ event: _event, dragStartCallback });\r\n\t\t\t\t}, 400);\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tif (!isDragging.current \|\| isPending.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tmoveingCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\tconst handleEnd = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragEndCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent \| TouchEvent \| Event;\r\n\t\t\tdragEndCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tisScrolling.current = false;\r\n\t\t\tisMouseDown.current = false;\r\n\r\n\t\t\tif (isPending.current) {\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\tif (dragStartDelayTimer.current) {\r\n\t\t\t\t\tclearTimeout(dragStartDelayTimer.current);\r\n\t\t\t\t\tdragStartDelayTimer.current = null;\r\n\t\t\t\t}\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tif (!isDragging.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tisDragging.current = false; // 드래그 종료\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\tdragEndCallback({ x: clientX, y: clientY });\r\n\t\t\t// const href = hrefUrlRef.current;\r\n\r\n\t\t\t// if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t\t// //console.log(clientX, clientY);\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption &&\r\n\t\t\t// isDocumentOut({ x: clientX, y: clientY })\r\n\t\t\t// ) {\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption.isNewTap \|\|\r\n\t\t\t// (!dropDocumentOutsideOption.widthRatio &&\r\n\t\t\t// !dropDocumentOutsideOption.heightRatio)\r\n\t\t\t// ) {\r\n\t\t\t// window.open(href, '_blank');\r\n\t\t\t// } else {\r\n\t\t\t// const width =\r\n\t\t\t// window.innerWidth \r\n\t\t\t// (dropDocumentOutsideOption.widthRatio \|\| 1);\r\n\t\t\t// const height =\r\n\t\t\t// window.innerHeight \r\n\t\t\t// (dropDocumentOutsideOption.heightRatio \|\| 1);\r\n\t\t\t// window.open(\r\n\t\t\t// href,\r\n\t\t\t// '_blank',\r\n\t\t\t// `width=${width},height=${height},left=${window.screenLeft - clientX * -1 - width},top=${window.screenTop + clientY}`\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t\t// }\r\n\r\n\t\t\t// dragState.next({\r\n\t\t\t// isDragging: false,\r\n\t\t\t// isDrop: true,\r\n\t\t\t// navigationTitle,\r\n\t\t\t// children: targetComponent,\r\n\t\t\t// x: clientX,\r\n\t\t\t// y: clientY,\r\n\t\t\t// containerName,\r\n\t\t\t// dropDocumentOutsideOption,\r\n\t\t\t// dropEndCallback,\r\n\t\t\t// screenKey,\r\n\t\t\t// customData,\r\n\t\t\t// });\r\n\t\t\t//if (dropEndCallback) dropEndCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\treturn {\r\n\t\thandleStart,\r\n\t\thandleMove,\r\n\t\thandleEnd,\r\n\t};\r\n};\r\n\r\nexport type FolderEventType = {\r\n\ttype: \"new\" \| \"sort\" \| \"title\" \| \"delete\" \| \"insert\" \| \"update\" \| \"next\";\r\n\tisFolder: boolean;\r\n\ttitle: string;\r\n\tsort?: number;\r\n\tparentId?: string;\r\n\tid?: string;\r\n\tnewData?: any;\r\n};\r\n\r\nexport const folderEventSubject = new Subject<FolderEventType>();\r\n\r\nexport const setFolderEvent = (newValue: FolderEventType) => {\r\n\tfolderEventSubject.next(newValue);\r\n};\r\n\r\nexport const useFolderEvent = () => {\r\n\tconst [folderEvent, setFolderEvent] = useState<FolderEventType \| null>(\r\n\t\tnull,\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst subscription = folderEventSubject.subscribe((e) => {\r\n\t\t\tif (!e) return;\r\n\t\t\tsetFolderEvent(e);\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tif (subscription) {\r\n\t\t\t\tsubscription.unsubscribe();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\r\n\treturn { folderEvent };\r\n};\r\n"],"mappings":"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","names":["xy","setFolderEvent"]}

package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.cjs CHANGED Viewed

@@ -1,8 +1,28 @@
-'use strict';
-var react = require('react');
-var useDrag = require('./useDrag');
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useFlexLayoutSplitScreen_exports = {};
+__export(useFlexLayoutSplitScreen_exports, {
+  useFlexLayoutSplitScreen: () => useFlexLayoutSplitScreen
+});
+module.exports = __toCommonJS(useFlexLayoutSplitScreen_exports);
+var import_react = require("react");
+var import_useDrag = require("./useDrag");
 function useFlexLayoutSplitScreen({
   isSplitInitial = false,
   parentDirection,
@@ -11,17 +31,17 @@ function useFlexLayoutSplitScreen({
   parentLayoutName,
   layoutName
 }) {
-  const [direction, setDirection] = react.useState(
+  const [direction, setDirection] = (0, import_react.useState)(
     directionInitial
   );
-  const [isSplit, setIsSplit] = react.useState(isSplitInitial);
-  const [boundaryContainerSize, setBoundaryContainerSize] = react.useState(null);
-  const [centerDropTargetComponent, setCenterDropTargetComponent] = react.useState([]);
-  const [afterDropTargetComponent, setAfterDropTargetComponent] = react.useState([]);
-  const [beforeDropTargetComponent, setBeforeDropTargetComponent] = react.useState([]);
-  const layoutRef = react.useRef(null);
-  const dragState = useDrag.useDragCapture(layoutRef);
-  react.useEffect(() => {
+  const [isSplit, setIsSplit] = (0, import_react.useState)(isSplitInitial);
+  const [boundaryContainerSize, setBoundaryContainerSize] = (0, import_react.useState)(null);
+  const [centerDropTargetComponent, setCenterDropTargetComponent] = (0, import_react.useState)([]);
+  const [afterDropTargetComponent, setAfterDropTargetComponent] = (0, import_react.useState)([]);
+  const [beforeDropTargetComponent, setBeforeDropTargetComponent] = (0, import_react.useState)([]);
+  const layoutRef = (0, import_react.useRef)(null);
+  const dragState = (0, import_useDrag.useDragCapture)(layoutRef);
+  (0, import_react.useEffect)(() => {
     if (!dragState) {
       setBoundaryContainerSize(null);
       return;
@@ -43,7 +63,7 @@ function useFlexLayoutSplitScreen({
     if ((isOver || isDrop) && boundaryContainerSize) {
       setBoundaryContainerSize(null);
     }
-    if (selfContainerName.startsWith(containerName)) {
+    if (selfContainerName === containerName || selfContainerName.startsWith(containerName + "_")) {
       return;
     }
     if (isDrop && screenKey) {
@@ -53,7 +73,7 @@ function useFlexLayoutSplitScreen({
           setIsSplit(true);
           setDirection(dropDirection);
         }
-        useDrag.dropMovementEventSubject.next({
+        import_useDrag.dropMovementEventSubject.next({
           state: "append",
           targetContainerName: containerName,
           targetParentLayoutName: parentLayoutName,
@@ -112,7 +132,8 @@ function useFlexLayoutSplitScreen({
     layoutRef
   };
 }
-exports.useFlexLayoutSplitScreen = useFlexLayoutSplitScreen;
-//# sourceMappingURL=useFlexLayoutSplitScreen.cjs.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useFlexLayoutSplitScreen
+});
 //# sourceMappingURL=useFlexLayoutSplitScreen.cjs.map

package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/flex-layout/hooks/useFlexLayoutSplitScreen.ts"],"names":["useState","useRef","useDragCapture","useEffect","dropMovementEventSubject"],"mappings":"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","file":"useFlexLayoutSplitScreen.cjs","sourcesContent":["// useFlexLayoutSplitScreen.js\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropTargetComponent,\r\n\tuseDragCapture,\r\n} from \"./useDrag\";\r\n\r\nexport function useFlexLayoutSplitScreen({\r\n\tisSplitInitial = false,\r\n\tparentDirection,\r\n\tdirectionInitial = \"row\",\r\n\tselfContainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n}: {\r\n\tisSplitInitial: boolean;\r\n\tparentDirection?: \"row\" \| \"column\" \| null;\r\n\tdirectionInitial: \"row\" \| \"column\";\r\n\tselfContainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n}) {\r\n\tconst [direction, setDirection] = useState<\"row\" \| \"column\">(\r\n\t\tdirectionInitial,\r\n\t);\r\n\r\n\tconst [isSplit, setIsSplit] = useState<boolean>(isSplitInitial);\r\n\tconst [boundaryContainerSize, setBoundaryContainerSize] = useState<{\r\n\t\tleft: string;\r\n\t\ttop: string;\r\n\t\twidth: string;\r\n\t\theight: string;\r\n\t} \| null>(null);\r\n\tconst [centerDropTargetComponent, setCenterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [afterDropTargetComponent, setAfterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [beforeDropTargetComponent, setBeforeDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst layoutRef = useRef<HTMLDivElement>(null);\r\n\r\n\tconst dragState = useDragCapture(layoutRef);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!dragState) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst {\r\n\t\t\tisDrop,\r\n\t\t\tisDragging,\r\n\t\t\tpositionName,\r\n\t\t\tcontainerName,\r\n\t\t\tchildren: dropComponent,\r\n\t\t\tisOver,\r\n\t\t\tnavigationTitle,\r\n\t\t\tdropEndCallback,\r\n\t\t\tx,\r\n\t\t\ty,\r\n\t\t\tscreenKey,\r\n\t\t} = dragState;\r\n\t\tconst orderName =\r\n\t\t\tpositionName === \"leftBoundary\" \|\| positionName === \"topBoundary\"\r\n\t\t\t\t? \"before\"\r\n\t\t\t\t: positionName === \"rightBoundary\" \|\|\r\n\t\t\t\t\t positionName === \"bottomBoundary\"\r\n\t\t\t\t\t? \"after\"\r\n\t\t\t\t\t: \"center\";\r\n\t\t// if (selfContainerName === containerName) {\r\n\t\t// setBoundaryContainerSize(null);\r\n\t\t// return;\r\n\t\t// }\r\n\r\n\t\tif ((isOver \|\| isDrop) && boundaryContainerSize) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t}\r\n\r\n\t\tif (~~selfContainerName~~.startsWith(containerName)) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (isDrop && screenKey) {\r\n\t\t\t// if (isDuplication) {\r\n\t\t\t// setDuplicationInfo({ isDuplication, containerName });\r\n\t\t\t// }\r\n\t\t\t// console.log('isDuplication:::', isDuplication);\r\n\t\t\tconst dropDirection =\r\n\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t? \"row\"\r\n\t\t\t\t\t: \"column\";\r\n\t\t\t// if (!parentDirection) {\r\n\t\t\t// console.log(isSplit, positionName !== 'centerBoundary', isOver);\r\n\t\t\t// }\r\n\t\t\tif (\r\n\t\t\t\t!isSplit &&\r\n\t\t\t\t!isOver\r\n\t\t\t\t//!isDuplication\r\n\t\t\t) {\r\n\t\t\t\t//setDirection(dropDirection);\r\n\t\t\t\t//if (positionName !== 'centerBoundary') {\r\n\t\t\t\tif (\r\n\t\t\t\t\tpositionName !== \"centerBoundary\" &&\r\n\t\t\t\t\tdropDirection !== parentDirection\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t}\r\n\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\t\t\t\ttargetLayoutName: layoutName,\r\n\t\t\t\t\ttargetComponent: dropComponent,\r\n\t\t\t\t\torderName,\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\tdragState?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t\t// } else {\r\n\t\t\t\t// dropMovementEventSubject.next({\r\n\t\t\t\t// state: 'append',\r\n\t\t\t\t// targetContainerName: containerName,\r\n\t\t\t\t// targetParentLayoutName: parentLayoutName,\r\n\t\t\t\t// targetLayoutName: layoutName,\r\n\t\t\t\t// targetComponent: dropComponent,\r\n\t\t\t\t// orderName: orderName,\r\n\t\t\t\t// x,\r\n\t\t\t\t// y,\r\n\t\t\t\t// dropEndCallback,\r\n\t\t\t\t// dropTargetComponentEvent: {\r\n\t\t\t\t// navigationTitle,\r\n\t\t\t\t// dropDocumentOutsideOption:\r\n\t\t\t\t// dragState?.dropDocumentOutsideOption,\r\n\t\t\t\t// direction: direction,\r\n\t\t\t\t// },\r\n\t\t\t\t// });\r\n\t\t\t\t// }\r\n\t\t\t}\r\n\t\t\t// else if (\r\n\t\t\t// isSplit &&\r\n\t\t\t// positionName !== 'centerBoundary' &&\r\n\t\t\t// !isOver\r\n\t\t\t// ) {\r\n\t\t\t// if (!isFirstSplitUpdatedRef.current) {\r\n\t\t\t// isFirstSplitUpdatedRef.current = true;\r\n\t\t\t// return;\r\n\t\t\t// }\r\n\t\t\t// updateDropTargetComponents(\r\n\t\t\t// positionName,\r\n\t\t\t// containerName,\r\n\t\t\t// dropComponent\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t}\r\n\t\tif (isDragging && !isSplit && !isOver) {\r\n\t\t\tconst newSize = {\r\n\t\t\t\tleft: positionName === \"rightBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\ttop: positionName === \"bottomBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\twidth:\r\n\t\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t\theight:\r\n\t\t\t\t\tpositionName === \"topBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"bottomBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t};\r\n\t\t\t// 이전 상태와 비교\r\n\t\t\tif (\r\n\t\t\t\tJSON.stringify(boundaryContainerSize) !==\r\n\t\t\t\tJSON.stringify(newSize)\r\n\t\t\t) {\r\n\t\t\t\tsetBoundaryContainerSize(newSize);\r\n\t\t\t}\r\n\t\t}\r\n\t}, [\r\n\t\tdragState,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tselfContainerName,\r\n\t\tdirection,\r\n\t]);\r\n\treturn {\r\n\t\tdirection,\r\n\t\tsetDirection,\r\n\t\tisSplit,\r\n\t\tsetIsSplit,\r\n\t\tboundaryContainerSize,\r\n\t\t//setBoundaryContainerSize,\r\n\t\tcenterDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\t//dropTargetComponent,\r\n\t\t//setDropTargetComponent,\r\n\t\t//setDropPosition,\r\n\t\tisOver: dragState?.isOver,\r\n\t\tlayoutRef,\r\n\t};\r\n}\r\n"]}
1	+ {"version":3,"sources":["../../../src/flex-layout/hooks/useFlexLayoutSplitScreen.ts"],"sourcesContent":["// useFlexLayoutSplitScreen.js\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropTargetComponent,\r\n\tuseDragCapture,\r\n} from \"./useDrag\";\r\n\r\nexport function useFlexLayoutSplitScreen({\r\n\tisSplitInitial = false,\r\n\tparentDirection,\r\n\tdirectionInitial = \"row\",\r\n\tselfContainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n}: {\r\n\tisSplitInitial: boolean;\r\n\tparentDirection?: \"row\" \| \"column\" \| null;\r\n\tdirectionInitial: \"row\" \| \"column\";\r\n\tselfContainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n}) {\r\n\tconst [direction, setDirection] = useState<\"row\" \| \"column\">(\r\n\t\tdirectionInitial,\r\n\t);\r\n\r\n\tconst [isSplit, setIsSplit] = useState<boolean>(isSplitInitial);\r\n\tconst [boundaryContainerSize, setBoundaryContainerSize] = useState<{\r\n\t\tleft: string;\r\n\t\ttop: string;\r\n\t\twidth: string;\r\n\t\theight: string;\r\n\t} \| null>(null);\r\n\tconst [centerDropTargetComponent, setCenterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [afterDropTargetComponent, setAfterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [beforeDropTargetComponent, setBeforeDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst layoutRef = useRef<HTMLDivElement>(null);\r\n\r\n\tconst dragState = useDragCapture(layoutRef);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!dragState) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst {\r\n\t\t\tisDrop,\r\n\t\t\tisDragging,\r\n\t\t\tpositionName,\r\n\t\t\tcontainerName,\r\n\t\t\tchildren: dropComponent,\r\n\t\t\tisOver,\r\n\t\t\tnavigationTitle,\r\n\t\t\tdropEndCallback,\r\n\t\t\tx,\r\n\t\t\ty,\r\n\t\t\tscreenKey,\r\n\t\t} = dragState;\r\n\r\n\t\tconst orderName =\r\n\t\t\tpositionName === \"leftBoundary\" \|\| positionName === \"topBoundary\"\r\n\t\t\t\t? \"before\"\r\n\t\t\t\t: positionName === \"rightBoundary\" \|\|\r\n\t\t\t\t\t positionName === \"bottomBoundary\"\r\n\t\t\t\t\t? \"after\"\r\n\t\t\t\t\t: \"center\";\r\n\t\t// if (selfContainerName === containerName) {\r\n\t\t// setBoundaryContainerSize(null);\r\n\t\t// return;\r\n\t\t// }\r\n\r\n\t\tif ((isOver \|\| isDrop) && boundaryContainerSize) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t}\r\n\r\n\t\tif (\r\n\t\t\tselfContainerName === containerName \|\|\r\n\t\t\tselfContainerName.startsWith(containerName + \"_\")\r\n\t\t) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (isDrop && screenKey) {\r\n\t\t\t// if (isDuplication) {\r\n\t\t\t// setDuplicationInfo({ isDuplication, containerName });\r\n\t\t\t// }\r\n\t\t\t// console.log('isDuplication:::', isDuplication);\r\n\t\t\tconst dropDirection =\r\n\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t? \"row\"\r\n\t\t\t\t\t: \"column\";\r\n\t\t\t// if (!parentDirection) {\r\n\t\t\t// console.log(isSplit, positionName !== 'centerBoundary', isOver);\r\n\t\t\t// }\r\n\t\t\tif (\r\n\t\t\t\t!isSplit &&\r\n\t\t\t\t!isOver\r\n\t\t\t\t//!isDuplication\r\n\t\t\t) {\r\n\t\t\t\t//setDirection(dropDirection);\r\n\t\t\t\t//if (positionName !== 'centerBoundary') {\r\n\t\t\t\tif (\r\n\t\t\t\t\tpositionName !== \"centerBoundary\" &&\r\n\t\t\t\t\tdropDirection !== parentDirection\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t}\r\n\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\t\t\t\ttargetLayoutName: layoutName,\r\n\t\t\t\t\ttargetComponent: dropComponent,\r\n\t\t\t\t\torderName,\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\tdragState?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t\t// } else {\r\n\t\t\t\t// dropMovementEventSubject.next({\r\n\t\t\t\t// state: 'append',\r\n\t\t\t\t// targetContainerName: containerName,\r\n\t\t\t\t// targetParentLayoutName: parentLayoutName,\r\n\t\t\t\t// targetLayoutName: layoutName,\r\n\t\t\t\t// targetComponent: dropComponent,\r\n\t\t\t\t// orderName: orderName,\r\n\t\t\t\t// x,\r\n\t\t\t\t// y,\r\n\t\t\t\t// dropEndCallback,\r\n\t\t\t\t// dropTargetComponentEvent: {\r\n\t\t\t\t// navigationTitle,\r\n\t\t\t\t// dropDocumentOutsideOption:\r\n\t\t\t\t// dragState?.dropDocumentOutsideOption,\r\n\t\t\t\t// direction: direction,\r\n\t\t\t\t// },\r\n\t\t\t\t// });\r\n\t\t\t\t// }\r\n\t\t\t}\r\n\t\t\t// else if (\r\n\t\t\t// isSplit &&\r\n\t\t\t// positionName !== 'centerBoundary' &&\r\n\t\t\t// !isOver\r\n\t\t\t// ) {\r\n\t\t\t// if (!isFirstSplitUpdatedRef.current) {\r\n\t\t\t// isFirstSplitUpdatedRef.current = true;\r\n\t\t\t// return;\r\n\t\t\t// }\r\n\t\t\t// updateDropTargetComponents(\r\n\t\t\t// positionName,\r\n\t\t\t// containerName,\r\n\t\t\t// dropComponent\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t}\r\n\t\tif (isDragging && !isSplit && !isOver) {\r\n\t\t\tconst newSize = {\r\n\t\t\t\tleft: positionName === \"rightBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\ttop: positionName === \"bottomBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\twidth:\r\n\t\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t\theight:\r\n\t\t\t\t\tpositionName === \"topBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"bottomBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t};\r\n\t\t\t// 이전 상태와 비교\r\n\t\t\tif (\r\n\t\t\t\tJSON.stringify(boundaryContainerSize) !==\r\n\t\t\t\tJSON.stringify(newSize)\r\n\t\t\t) {\r\n\t\t\t\tsetBoundaryContainerSize(newSize);\r\n\t\t\t}\r\n\t\t}\r\n\t}, [\r\n\t\tdragState,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tselfContainerName,\r\n\t\tdirection,\r\n\t]);\r\n\treturn {\r\n\t\tdirection,\r\n\t\tsetDirection,\r\n\t\tisSplit,\r\n\t\tsetIsSplit,\r\n\t\tboundaryContainerSize,\r\n\t\t//setBoundaryContainerSize,\r\n\t\tcenterDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\t//dropTargetComponent,\r\n\t\t//setDropTargetComponent,\r\n\t\t//setDropPosition,\r\n\t\tisOver: dragState?.isOver,\r\n\t\tlayoutRef,\r\n\t};\r\n}\r\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAA4C;AAC5C,qBAIO;AAEA,SAAS,yBAAyB;AAAA,EACxC,iBAAiB;AAAA,EACjB;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACD,GAOG;AACF,QAAM,CAAC,WAAW,YAAY,QAAI;AAAA,IACjC;AAAA,EACD;AAEA,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAkB,cAAc;AAC9D,QAAM,CAAC,uBAAuB,wBAAwB,QAAI,uBAKhD,IAAI;AACd,QAAM,CAAC,2BAA2B,4BAA4B,QAAI,uBAEhE,CAAC,CAAC;AACJ,QAAM,CAAC,0BAA0B,2BAA2B,QAAI,uBAE9D,CAAC,CAAC;AACJ,QAAM,CAAC,2BAA2B,4BAA4B,QAAI,uBAEhE,CAAC,CAAC;AACJ,QAAM,gBAAY,qBAAuB,IAAI;AAE7C,QAAM,gBAAY,+BAAe,SAAS;AAE1C,8BAAU,MAAM;AACf,QAAI,CAAC,WAAW;AACf,+BAAyB,IAAI;AAC7B;AAAA,IACD;AACA,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD,IAAI;AAEJ,UAAM,YACL,iBAAiB,kBAAkB,iBAAiB,gBACjD,WACA,iBAAiB,mBAChB,iBAAiB,mBACjB,UACA;AAML,SAAK,UAAU,WAAW,uBAAuB;AAChD,+BAAyB,IAAI;AAAA,IAC9B;AAEA,QACC,sBAAsB,iBACtB,kBAAkB,WAAW,gBAAgB,GAAG,GAC/C;AACD;AAAA,IACD;AAEA,QAAI,UAAU,WAAW;AAKxB,YAAM,gBACL,iBAAiB,kBACjB,iBAAiB,kBACd,QACA;AAIJ,UACC,CAAC,WACD,CAAC,QAEA;AAGD,YACC,iBAAiB,oBACjB,kBAAkB,iBACjB;AACD,qBAAW,IAAI;AACf,uBAAa,aAAa;AAAA,QAC3B;AACA,gDAAyB,KAAK;AAAA,UAC7B,OAAO;AAAA,UACP,qBAAqB;AAAA,UACrB,wBAAwB;AAAA,UACxB,kBAAkB;AAAA,UAClB,iBAAiB;AAAA,UACjB;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,0BAA0B;AAAA,YACzB;AAAA,YACA,2BACC,WAAW;AAAA,YACZ,WAAW;AAAA,YACX;AAAA,UACD;AAAA,QACD,CAAC;AAAA,MAoBF;AAAA,IAgBD;AACA,QAAI,cAAc,CAAC,WAAW,CAAC,QAAQ;AACtC,YAAM,UAAU;AAAA,QACf,MAAM,iBAAiB,kBAAkB,QAAQ;AAAA,QACjD,KAAK,iBAAiB,mBAAmB,QAAQ;AAAA,QACjD,OACC,iBAAiB,kBACjB,iBAAiB,kBACd,QACA;AAAA,QACJ,QACC,iBAAiB,iBACjB,iBAAiB,mBACd,QACA;AAAA,MACL;AAEA,UACC,KAAK,UAAU,qBAAqB,MACpC,KAAK,UAAU,OAAO,GACrB;AACD,iCAAyB,OAAO;AAAA,MACjC;AAAA,IACD;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AACD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,QAAQ,WAAW;AAAA,IACnB;AAAA,EACD;AACD;","names":[]}

package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.js CHANGED Viewed

@@ -1,6 +1,8 @@
-import { useState, useRef, useEffect } from 'react';
-import { useDragCapture, dropMovementEventSubject } from './useDrag';
+import { useEffect, useRef, useState } from "react";
+import {
+  dropMovementEventSubject,
+  useDragCapture
+} from "./useDrag";
 function useFlexLayoutSplitScreen({
   isSplitInitial = false,
   parentDirection,
@@ -41,7 +43,7 @@ function useFlexLayoutSplitScreen({
     if ((isOver || isDrop) && boundaryContainerSize) {
       setBoundaryContainerSize(null);
     }
-    if (selfContainerName.startsWith(containerName)) {
+    if (selfContainerName === containerName || selfContainerName.startsWith(containerName + "_")) {
       return;
     }
     if (isDrop && screenKey) {
@@ -110,7 +112,7 @@ function useFlexLayoutSplitScreen({
     layoutRef
   };
 }
-export { useFlexLayoutSplitScreen };
-//# sourceMappingURL=useFlexLayoutSplitScreen.js.map
+export {
+  useFlexLayoutSplitScreen
+};
 //# sourceMappingURL=useFlexLayoutSplitScreen.js.map

package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/flex-layout/hooks/useFlexLayoutSplitScreen.ts"],"names":[],"mappings":";;;AAQO,SAAS,wBAAA,CAAyB;AAAA,EACxC,cAAA,GAAiB,KAAA;AAAA,EACjB,eAAA;AAAA,EACA,gBAAA,GAAmB,KAAA;AAAA,EACnB,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACD,CAAA,EAOG;AACF,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,QAAA;AAAA,IACjC;AAAA,GACD;AAEA,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAkB,cAAc,CAAA;AAC9D,EAAA,MAAM,CAAC,qBAAA,EAAuB,wBAAwB,CAAA,GAAI,SAKhD,IAAI,CAAA;AACd,EAAA,MAAM,CAAC,yBAAA,EAA2B,4BAA4B,CAAA,GAAI,QAAA,CAEhE,EAAE,CAAA;AACJ,EAAA,MAAM,CAAC,wBAAA,EAA0B,2BAA2B,CAAA,GAAI,QAAA,CAE9D,EAAE,CAAA;AACJ,EAAA,MAAM,CAAC,yBAAA,EAA2B,4BAA4B,CAAA,GAAI,QAAA,CAEhE,EAAE,CAAA;AACJ,EAAA,MAAM,SAAA,GAAY,OAAuB,IAAI,CAAA;AAE7C,EAAA,MAAM,SAAA,GAAY,eAAe,SAAS,CAAA;AAE1C,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,CAAC,SAAA,EAAW;AACf,MAAA,wBAAA,CAAyB,IAAI,CAAA;AAC7B,MAAA;AAAA,IACD;AACA,IAAA,MAAM;AAAA,MACL,MAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,aAAA;AAAA,MACA,QAAA,EAAU,aAAA;AAAA,MACV,MAAA;AAAA,MACA,eAAA;AAAA,MACA,eAAA;AAAA,MACA,CAAA;AAAA,MACA,CAAA;AAAA,MACA;AAAA,KACD,GAAI,SAAA;AACJ,IAAA,MAAM,SAAA,GACL,YAAA,KAAiB,cAAA,IAAkB,YAAA,KAAiB,aAAA,GACjD,WACA,YAAA,KAAiB,eAAA,IAChB,YAAA,KAAiB,gBAAA,GACjB,OAAA,GACA,QAAA;AAML,IAAA,IAAA,CAAK,MAAA,IAAU,WAAW,qBAAA,EAAuB;AAChD,MAAA,wBAAA,CAAyB,IAAI,CAAA;AAAA,IAC9B;AAEA,IAAA,IAAI,iBAAA,CAAkB,UAAA,CAAW,aAAa,CAAA,EAAG;AAChD,MAAA;AAAA,IACD;AAEA,IAAA,IAAI,UAAU,SAAA,EAAW;AAKxB,MAAA,MAAM,aAAA,GACL,YAAA,KAAiB,cAAA,IACjB,YAAA,KAAiB,kBACd,KAAA,GACA,QAAA;AAIJ,MAAA,IACC,CAAC,OAAA,IACD,CAAC,MAAA,EAEA;AAGD,QAAA,IACC,YAAA,KAAiB,gBAAA,IACjB,aAAA,KAAkB,eAAA,EACjB;AACD,UAAA,UAAA,CAAW,IAAI,CAAA;AACf,UAAA,YAAA,CAAa,aAAa,CAAA;AAAA,QAC3B;AACA,QAAA,wBAAA,CAAyB,IAAA,CAAK;AAAA,UAC7B,KAAA,EAAO,QAAA;AAAA,UACP,mBAAA,EAAqB,aAAA;AAAA,UACrB,sBAAA,EAAwB,gBAAA;AAAA,UACxB,gBAAA,EAAkB,UAAA;AAAA,UAClB,eAAA,EAAiB,aAAA;AAAA,UACjB,SAAA;AAAA,UACA,CAAA;AAAA,UACA,CAAA;AAAA,UACA,eAAA;AAAA,UACA,wBAAA,EAA0B;AAAA,YACzB,eAAA;AAAA,YACA,2BACC,SAAA,EAAW,yBAAA;AAAA,YACZ,SAAA,EAAW,aAAA;AAAA,YACX;AAAA;AACD,SACA,CAAA;AAAA,MAoBF;AAAA,IAgBD;AACA,IAAA,IAAI,UAAA,IAAc,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AACtC,MAAA,MAAM,OAAA,GAAU;AAAA,QACf,IAAA,EAAM,YAAA,KAAiB,eAAA,GAAkB,KAAA,GAAQ,GAAA;AAAA,QACjD,GAAA,EAAK,YAAA,KAAiB,gBAAA,GAAmB,KAAA,GAAQ,GAAA;AAAA,QACjD,KAAA,EACC,YAAA,KAAiB,cAAA,IACjB,YAAA,KAAiB,kBACd,KAAA,GACA,MAAA;AAAA,QACJ,MAAA,EACC,YAAA,KAAiB,aAAA,IACjB,YAAA,KAAiB,mBACd,KAAA,GACA;AAAA,OACL;AAEA,MAAA,IACC,KAAK,SAAA,CAAU,qBAAqB,MACpC,IAAA,CAAK,SAAA,CAAU,OAAO,CAAA,EACrB;AACD,QAAA,wBAAA,CAAyB,OAAO,CAAA;AAAA,MACjC;AAAA,IACD;AAAA,EACD,CAAA,EAAG;AAAA,IACF,SAAA;AAAA,IACA,OAAA;AAAA,IACA,qBAAA;AAAA,IACA,gBAAA;AAAA,IACA,UAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACA,CAAA;AACD,EAAA,OAAO;AAAA,IACN,SAAA;AAAA,IACA,YAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,qBAAA;AAAA;AAAA,IAEA,yBAAA;AAAA,IACA,wBAAA;AAAA,IACA,yBAAA;AAAA,IACA,2BAAA;AAAA,IACA,4BAAA;AAAA,IACA,4BAAA;AAAA;AAAA;AAAA;AAAA,IAIA,QAAQ,SAAA,EAAW,MAAA;AAAA,IACnB;AAAA,GACD;AACD","file":"useFlexLayoutSplitScreen.js","sourcesContent":["// useFlexLayoutSplitScreen.js\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropTargetComponent,\r\n\tuseDragCapture,\r\n} from \"./useDrag\";\r\n\r\nexport function useFlexLayoutSplitScreen({\r\n\tisSplitInitial = false,\r\n\tparentDirection,\r\n\tdirectionInitial = \"row\",\r\n\tselfContainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n}: {\r\n\tisSplitInitial: boolean;\r\n\tparentDirection?: \"row\" \| \"column\" \| null;\r\n\tdirectionInitial: \"row\" \| \"column\";\r\n\tselfContainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n}) {\r\n\tconst [direction, setDirection] = useState<\"row\" \| \"column\">(\r\n\t\tdirectionInitial,\r\n\t);\r\n\r\n\tconst [isSplit, setIsSplit] = useState<boolean>(isSplitInitial);\r\n\tconst [boundaryContainerSize, setBoundaryContainerSize] = useState<{\r\n\t\tleft: string;\r\n\t\ttop: string;\r\n\t\twidth: string;\r\n\t\theight: string;\r\n\t} \| null>(null);\r\n\tconst [centerDropTargetComponent, setCenterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [afterDropTargetComponent, setAfterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [beforeDropTargetComponent, setBeforeDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst layoutRef = useRef<HTMLDivElement>(null);\r\n\r\n\tconst dragState = useDragCapture(layoutRef);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!dragState) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst {\r\n\t\t\tisDrop,\r\n\t\t\tisDragging,\r\n\t\t\tpositionName,\r\n\t\t\tcontainerName,\r\n\t\t\tchildren: dropComponent,\r\n\t\t\tisOver,\r\n\t\t\tnavigationTitle,\r\n\t\t\tdropEndCallback,\r\n\t\t\tx,\r\n\t\t\ty,\r\n\t\t\tscreenKey,\r\n\t\t} = dragState;\r\n\t\tconst orderName =\r\n\t\t\tpositionName === \"leftBoundary\" \|\| positionName === \"topBoundary\"\r\n\t\t\t\t? \"before\"\r\n\t\t\t\t: positionName === \"rightBoundary\" \|\|\r\n\t\t\t\t\t positionName === \"bottomBoundary\"\r\n\t\t\t\t\t? \"after\"\r\n\t\t\t\t\t: \"center\";\r\n\t\t// if (selfContainerName === containerName) {\r\n\t\t// setBoundaryContainerSize(null);\r\n\t\t// return;\r\n\t\t// }\r\n\r\n\t\tif ((isOver \|\| isDrop) && boundaryContainerSize) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t}\r\n\r\n\t\tif (~~selfContainerName~~.startsWith(containerName)) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (isDrop && screenKey) {\r\n\t\t\t// if (isDuplication) {\r\n\t\t\t// setDuplicationInfo({ isDuplication, containerName });\r\n\t\t\t// }\r\n\t\t\t// console.log('isDuplication:::', isDuplication);\r\n\t\t\tconst dropDirection =\r\n\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t? \"row\"\r\n\t\t\t\t\t: \"column\";\r\n\t\t\t// if (!parentDirection) {\r\n\t\t\t// console.log(isSplit, positionName !== 'centerBoundary', isOver);\r\n\t\t\t// }\r\n\t\t\tif (\r\n\t\t\t\t!isSplit &&\r\n\t\t\t\t!isOver\r\n\t\t\t\t//!isDuplication\r\n\t\t\t) {\r\n\t\t\t\t//setDirection(dropDirection);\r\n\t\t\t\t//if (positionName !== 'centerBoundary') {\r\n\t\t\t\tif (\r\n\t\t\t\t\tpositionName !== \"centerBoundary\" &&\r\n\t\t\t\t\tdropDirection !== parentDirection\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t}\r\n\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\t\t\t\ttargetLayoutName: layoutName,\r\n\t\t\t\t\ttargetComponent: dropComponent,\r\n\t\t\t\t\torderName,\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\tdragState?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t\t// } else {\r\n\t\t\t\t// dropMovementEventSubject.next({\r\n\t\t\t\t// state: 'append',\r\n\t\t\t\t// targetContainerName: containerName,\r\n\t\t\t\t// targetParentLayoutName: parentLayoutName,\r\n\t\t\t\t// targetLayoutName: layoutName,\r\n\t\t\t\t// targetComponent: dropComponent,\r\n\t\t\t\t// orderName: orderName,\r\n\t\t\t\t// x,\r\n\t\t\t\t// y,\r\n\t\t\t\t// dropEndCallback,\r\n\t\t\t\t// dropTargetComponentEvent: {\r\n\t\t\t\t// navigationTitle,\r\n\t\t\t\t// dropDocumentOutsideOption:\r\n\t\t\t\t// dragState?.dropDocumentOutsideOption,\r\n\t\t\t\t// direction: direction,\r\n\t\t\t\t// },\r\n\t\t\t\t// });\r\n\t\t\t\t// }\r\n\t\t\t}\r\n\t\t\t// else if (\r\n\t\t\t// isSplit &&\r\n\t\t\t// positionName !== 'centerBoundary' &&\r\n\t\t\t// !isOver\r\n\t\t\t// ) {\r\n\t\t\t// if (!isFirstSplitUpdatedRef.current) {\r\n\t\t\t// isFirstSplitUpdatedRef.current = true;\r\n\t\t\t// return;\r\n\t\t\t// }\r\n\t\t\t// updateDropTargetComponents(\r\n\t\t\t// positionName,\r\n\t\t\t// containerName,\r\n\t\t\t// dropComponent\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t}\r\n\t\tif (isDragging && !isSplit && !isOver) {\r\n\t\t\tconst newSize = {\r\n\t\t\t\tleft: positionName === \"rightBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\ttop: positionName === \"bottomBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\twidth:\r\n\t\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t\theight:\r\n\t\t\t\t\tpositionName === \"topBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"bottomBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t};\r\n\t\t\t// 이전 상태와 비교\r\n\t\t\tif (\r\n\t\t\t\tJSON.stringify(boundaryContainerSize) !==\r\n\t\t\t\tJSON.stringify(newSize)\r\n\t\t\t) {\r\n\t\t\t\tsetBoundaryContainerSize(newSize);\r\n\t\t\t}\r\n\t\t}\r\n\t}, [\r\n\t\tdragState,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tselfContainerName,\r\n\t\tdirection,\r\n\t]);\r\n\treturn {\r\n\t\tdirection,\r\n\t\tsetDirection,\r\n\t\tisSplit,\r\n\t\tsetIsSplit,\r\n\t\tboundaryContainerSize,\r\n\t\t//setBoundaryContainerSize,\r\n\t\tcenterDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\t//dropTargetComponent,\r\n\t\t//setDropTargetComponent,\r\n\t\t//setDropPosition,\r\n\t\tisOver: dragState?.isOver,\r\n\t\tlayoutRef,\r\n\t};\r\n}\r\n"]}
1	+ {"version":3,"sources":["../../../src/flex-layout/hooks/useFlexLayoutSplitScreen.ts"],"sourcesContent":["// useFlexLayoutSplitScreen.js\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropTargetComponent,\r\n\tuseDragCapture,\r\n} from \"./useDrag\";\r\n\r\nexport function useFlexLayoutSplitScreen({\r\n\tisSplitInitial = false,\r\n\tparentDirection,\r\n\tdirectionInitial = \"row\",\r\n\tselfContainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n}: {\r\n\tisSplitInitial: boolean;\r\n\tparentDirection?: \"row\" \| \"column\" \| null;\r\n\tdirectionInitial: \"row\" \| \"column\";\r\n\tselfContainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n}) {\r\n\tconst [direction, setDirection] = useState<\"row\" \| \"column\">(\r\n\t\tdirectionInitial,\r\n\t);\r\n\r\n\tconst [isSplit, setIsSplit] = useState<boolean>(isSplitInitial);\r\n\tconst [boundaryContainerSize, setBoundaryContainerSize] = useState<{\r\n\t\tleft: string;\r\n\t\ttop: string;\r\n\t\twidth: string;\r\n\t\theight: string;\r\n\t} \| null>(null);\r\n\tconst [centerDropTargetComponent, setCenterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [afterDropTargetComponent, setAfterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [beforeDropTargetComponent, setBeforeDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst layoutRef = useRef<HTMLDivElement>(null);\r\n\r\n\tconst dragState = useDragCapture(layoutRef);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!dragState) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst {\r\n\t\t\tisDrop,\r\n\t\t\tisDragging,\r\n\t\t\tpositionName,\r\n\t\t\tcontainerName,\r\n\t\t\tchildren: dropComponent,\r\n\t\t\tisOver,\r\n\t\t\tnavigationTitle,\r\n\t\t\tdropEndCallback,\r\n\t\t\tx,\r\n\t\t\ty,\r\n\t\t\tscreenKey,\r\n\t\t} = dragState;\r\n\r\n\t\tconst orderName =\r\n\t\t\tpositionName === \"leftBoundary\" \|\| positionName === \"topBoundary\"\r\n\t\t\t\t? \"before\"\r\n\t\t\t\t: positionName === \"rightBoundary\" \|\|\r\n\t\t\t\t\t positionName === \"bottomBoundary\"\r\n\t\t\t\t\t? \"after\"\r\n\t\t\t\t\t: \"center\";\r\n\t\t// if (selfContainerName === containerName) {\r\n\t\t// setBoundaryContainerSize(null);\r\n\t\t// return;\r\n\t\t// }\r\n\r\n\t\tif ((isOver \|\| isDrop) && boundaryContainerSize) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t}\r\n\r\n\t\tif (\r\n\t\t\tselfContainerName === containerName \|\|\r\n\t\t\tselfContainerName.startsWith(containerName + \"_\")\r\n\t\t) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (isDrop && screenKey) {\r\n\t\t\t// if (isDuplication) {\r\n\t\t\t// setDuplicationInfo({ isDuplication, containerName });\r\n\t\t\t// }\r\n\t\t\t// console.log('isDuplication:::', isDuplication);\r\n\t\t\tconst dropDirection =\r\n\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t? \"row\"\r\n\t\t\t\t\t: \"column\";\r\n\t\t\t// if (!parentDirection) {\r\n\t\t\t// console.log(isSplit, positionName !== 'centerBoundary', isOver);\r\n\t\t\t// }\r\n\t\t\tif (\r\n\t\t\t\t!isSplit &&\r\n\t\t\t\t!isOver\r\n\t\t\t\t//!isDuplication\r\n\t\t\t) {\r\n\t\t\t\t//setDirection(dropDirection);\r\n\t\t\t\t//if (positionName !== 'centerBoundary') {\r\n\t\t\t\tif (\r\n\t\t\t\t\tpositionName !== \"centerBoundary\" &&\r\n\t\t\t\t\tdropDirection !== parentDirection\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t}\r\n\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\t\t\t\ttargetLayoutName: layoutName,\r\n\t\t\t\t\ttargetComponent: dropComponent,\r\n\t\t\t\t\torderName,\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\tdragState?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t\t// } else {\r\n\t\t\t\t// dropMovementEventSubject.next({\r\n\t\t\t\t// state: 'append',\r\n\t\t\t\t// targetContainerName: containerName,\r\n\t\t\t\t// targetParentLayoutName: parentLayoutName,\r\n\t\t\t\t// targetLayoutName: layoutName,\r\n\t\t\t\t// targetComponent: dropComponent,\r\n\t\t\t\t// orderName: orderName,\r\n\t\t\t\t// x,\r\n\t\t\t\t// y,\r\n\t\t\t\t// dropEndCallback,\r\n\t\t\t\t// dropTargetComponentEvent: {\r\n\t\t\t\t// navigationTitle,\r\n\t\t\t\t// dropDocumentOutsideOption:\r\n\t\t\t\t// dragState?.dropDocumentOutsideOption,\r\n\t\t\t\t// direction: direction,\r\n\t\t\t\t// },\r\n\t\t\t\t// });\r\n\t\t\t\t// }\r\n\t\t\t}\r\n\t\t\t// else if (\r\n\t\t\t// isSplit &&\r\n\t\t\t// positionName !== 'centerBoundary' &&\r\n\t\t\t// !isOver\r\n\t\t\t// ) {\r\n\t\t\t// if (!isFirstSplitUpdatedRef.current) {\r\n\t\t\t// isFirstSplitUpdatedRef.current = true;\r\n\t\t\t// return;\r\n\t\t\t// }\r\n\t\t\t// updateDropTargetComponents(\r\n\t\t\t// positionName,\r\n\t\t\t// containerName,\r\n\t\t\t// dropComponent\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t}\r\n\t\tif (isDragging && !isSplit && !isOver) {\r\n\t\t\tconst newSize = {\r\n\t\t\t\tleft: positionName === \"rightBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\ttop: positionName === \"bottomBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\twidth:\r\n\t\t\t\t\tpositionName === \"leftBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t\theight:\r\n\t\t\t\t\tpositionName === \"topBoundary\" \|\|\r\n\t\t\t\t\tpositionName === \"bottomBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t};\r\n\t\t\t// 이전 상태와 비교\r\n\t\t\tif (\r\n\t\t\t\tJSON.stringify(boundaryContainerSize) !==\r\n\t\t\t\tJSON.stringify(newSize)\r\n\t\t\t) {\r\n\t\t\t\tsetBoundaryContainerSize(newSize);\r\n\t\t\t}\r\n\t\t}\r\n\t}, [\r\n\t\tdragState,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tselfContainerName,\r\n\t\tdirection,\r\n\t]);\r\n\treturn {\r\n\t\tdirection,\r\n\t\tsetDirection,\r\n\t\tisSplit,\r\n\t\tsetIsSplit,\r\n\t\tboundaryContainerSize,\r\n\t\t//setBoundaryContainerSize,\r\n\t\tcenterDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\t//dropTargetComponent,\r\n\t\t//setDropTargetComponent,\r\n\t\t//setDropPosition,\r\n\t\tisOver: dragState?.isOver,\r\n\t\tlayoutRef,\r\n\t};\r\n}\r\n"],"mappings":"AACA,SAAS,WAAW,QAAQ,gBAAgB;AAC5C;AAAA,EACC;AAAA,EAEA;AAAA,OACM;AAEA,SAAS,yBAAyB;AAAA,EACxC,iBAAiB;AAAA,EACjB;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACD,GAOG;AACF,QAAM,CAAC,WAAW,YAAY,IAAI;AAAA,IACjC;AAAA,EACD;AAEA,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,cAAc;AAC9D,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAKhD,IAAI;AACd,QAAM,CAAC,2BAA2B,4BAA4B,IAAI,SAEhE,CAAC,CAAC;AACJ,QAAM,CAAC,0BAA0B,2BAA2B,IAAI,SAE9D,CAAC,CAAC;AACJ,QAAM,CAAC,2BAA2B,4BAA4B,IAAI,SAEhE,CAAC,CAAC;AACJ,QAAM,YAAY,OAAuB,IAAI;AAE7C,QAAM,YAAY,eAAe,SAAS;AAE1C,YAAU,MAAM;AACf,QAAI,CAAC,WAAW;AACf,+BAAyB,IAAI;AAC7B;AAAA,IACD;AACA,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD,IAAI;AAEJ,UAAM,YACL,iBAAiB,kBAAkB,iBAAiB,gBACjD,WACA,iBAAiB,mBAChB,iBAAiB,mBACjB,UACA;AAML,SAAK,UAAU,WAAW,uBAAuB;AAChD,+BAAyB,IAAI;AAAA,IAC9B;AAEA,QACC,sBAAsB,iBACtB,kBAAkB,WAAW,gBAAgB,GAAG,GAC/C;AACD;AAAA,IACD;AAEA,QAAI,UAAU,WAAW;AAKxB,YAAM,gBACL,iBAAiB,kBACjB,iBAAiB,kBACd,QACA;AAIJ,UACC,CAAC,WACD,CAAC,QAEA;AAGD,YACC,iBAAiB,oBACjB,kBAAkB,iBACjB;AACD,qBAAW,IAAI;AACf,uBAAa,aAAa;AAAA,QAC3B;AACA,iCAAyB,KAAK;AAAA,UAC7B,OAAO;AAAA,UACP,qBAAqB;AAAA,UACrB,wBAAwB;AAAA,UACxB,kBAAkB;AAAA,UAClB,iBAAiB;AAAA,UACjB;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,0BAA0B;AAAA,YACzB;AAAA,YACA,2BACC,WAAW;AAAA,YACZ,WAAW;AAAA,YACX;AAAA,UACD;AAAA,QACD,CAAC;AAAA,MAoBF;AAAA,IAgBD;AACA,QAAI,cAAc,CAAC,WAAW,CAAC,QAAQ;AACtC,YAAM,UAAU;AAAA,QACf,MAAM,iBAAiB,kBAAkB,QAAQ;AAAA,QACjD,KAAK,iBAAiB,mBAAmB,QAAQ;AAAA,QACjD,OACC,iBAAiB,kBACjB,iBAAiB,kBACd,QACA;AAAA,QACJ,QACC,iBAAiB,iBACjB,iBAAiB,mBACd,QACA;AAAA,MACL;AAEA,UACC,KAAK,UAAU,qBAAqB,MACpC,KAAK,UAAU,OAAO,GACrB;AACD,iCAAyB,OAAO;AAAA,MACjC;AAAA,IACD;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AACD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,QAAQ,WAAW;AAAA,IACnB;AAAA,EACD;AACD;","names":[]}

package/dist/flex-layout/hooks/useListPaging.cjs CHANGED Viewed

@@ -1,22 +1,44 @@
-'use strict';
-var react = require('react');
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useListPaging_exports = {};
+__export(useListPaging_exports, {
+  useListPagingForSentinel: () => useListPagingForSentinel,
+  usePaginationViewNumber: () => usePaginationViewNumber,
+  usePagingHandler: () => usePagingHandler
+});
+module.exports = __toCommonJS(useListPaging_exports);
+var import_react = require("react");
 const useListPagingForSentinel = ({
   //initPageNumber,
   //initPageSize,
   onReachTerminal
 }) => {
-  const [firstChildNode, setFirstChildNode] = react.useState(null);
-  const [lastChildNode, setLastChildNode] = react.useState(null);
-  const observerRef = react.useRef(null);
-  const firstChildRef = react.useCallback((node) => {
+  const [firstChildNode, setFirstChildNode] = (0, import_react.useState)(null);
+  const [lastChildNode, setLastChildNode] = (0, import_react.useState)(null);
+  const observerRef = (0, import_react.useRef)(null);
+  const firstChildRef = (0, import_react.useCallback)((node) => {
     setFirstChildNode(node);
   }, []);
-  const lastChildRef = react.useCallback((node) => {
+  const lastChildRef = (0, import_react.useCallback)((node) => {
     setLastChildNode(node);
   }, []);
-  react.useEffect(() => {
+  (0, import_react.useEffect)(() => {
     if (firstChildNode && observerRef.current)
       observerRef.current.unobserve(firstChildNode);
     if (lastChildNode && observerRef.current)
@@ -63,9 +85,9 @@ const useListPagingForSentinel = ({
 const usePaginationViewNumber = ({
   initPageNumber
 }) => {
-  const [showCurrentPageNumber, setShowCurrentPageNumber] = react.useState(initPageNumber);
-  const observerRef = react.useRef(null);
-  const showCurrentPageObserveTarget = react.useCallback(
+  const [showCurrentPageNumber, setShowCurrentPageNumber] = (0, import_react.useState)(initPageNumber);
+  const observerRef = (0, import_react.useRef)(null);
+  const showCurrentPageObserveTarget = (0, import_react.useCallback)(
     (node) => {
       if (!node) return;
       if (!observerRef.current) {
@@ -92,7 +114,7 @@ const usePaginationViewNumber = ({
     },
     []
   );
-  react.useEffect(() => {
+  (0, import_react.useEffect)(() => {
     const currentObserver = observerRef.current;
     return () => {
       if (currentObserver) {
@@ -109,17 +131,31 @@ const usePagingHandler = ({
   lastCallPageNumber,
   dataListRef
 }) => {
-  const jumpingPageNumberRef = react.useRef(lastCallPageNumber);
-  react.useEffect(() => {
-    if (jumpingPageNumberRef.current) {
-      setTimeout(() => {
-        jumpingPageNumberRef.current = null;
-      }, 1e3);
+  const jumpingPageNumberRef = (0, import_react.useRef)(lastCallPageNumber);
+  const paginationScrollIntoViewTarget = (0, import_react.useRef)({});
+  const pageNumberRef = (0, import_react.useRef)(lastCallPageNumber);
+  const resetJumpTimerIdRef = (0, import_react.useRef)(
+    null
+  );
+  const clearResetTimer = (0, import_react.useCallback)(() => {
+    if (resetJumpTimerIdRef.current !== null) {
+      window.clearTimeout(resetJumpTimerIdRef.current);
+      resetJumpTimerIdRef.current = null;
     }
-  }, [jumpingPageNumberRef]);
-  const paginationScrollIntoViewTarget = react.useRef({});
-  const pageNumberRef = react.useRef(lastCallPageNumber);
-  const setPaginationRef = react.useCallback(
+  }, []);
+  const armResetTimer = (0, import_react.useCallback)(() => {
+    clearResetTimer();
+    resetJumpTimerIdRef.current = window.setTimeout(() => {
+      jumpingPageNumberRef.current = null;
+      resetJumpTimerIdRef.current = null;
+    }, 1e3);
+  }, [clearResetTimer]);
+  (0, import_react.useEffect)(() => {
+    return () => {
+      clearResetTimer();
+    };
+  }, [clearResetTimer]);
+  const setPaginationRef = (0, import_react.useCallback)(
     (i) => (node) => {
       if (!node) return;
       paginationScrollIntoViewTarget.current[i] = node;
@@ -142,9 +178,7 @@ const usePagingHandler = ({
     if (dataListRef.current[callPageNumber] != null && (dataListRef.current[callPageNumber]?.length || 0) > 0)
       return;
     jumpingPageNumberRef.current = callPageNumber;
-    setTimeout(() => {
-      jumpingPageNumberRef.current = null;
-    }, 1e3);
+    armResetTimer();
     dataCallFetch(callPageNumber);
   };
   const handleClickPageChange = (page, dataCallFetch) => {
@@ -157,9 +191,7 @@ const usePagingHandler = ({
       return;
     }
     jumpingPageNumberRef.current = page;
-    setTimeout(() => {
-      jumpingPageNumberRef.current = null;
-    }, 1e3);
+    armResetTimer();
     dataCallFetch(page);
   };
   return {
@@ -171,9 +203,10 @@ const usePagingHandler = ({
     handleClickPageChange
   };
 };
-exports.useListPagingForSentinel = useListPagingForSentinel;
-exports.usePaginationViewNumber = usePaginationViewNumber;
-exports.usePagingHandler = usePagingHandler;
-//# sourceMappingURL=useListPaging.cjs.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useListPagingForSentinel,
+  usePaginationViewNumber,
+  usePagingHandler
+});
 //# sourceMappingURL=useListPaging.cjs.map

package/dist/flex-layout/hooks/useListPaging.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/flex-layout/hooks/useListPaging.ts"],"names":["useState","useRef","useCallback","useEffect","observer"],"mappings":"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","file":"useListPaging.cjs","sourcesContent":["import {\r\n\tMutableRefObject,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\nexport type OnReachTerminalType = {\r\n\tisFirst: boolean;\r\n\tisLast: boolean;\r\n\tobserver: IntersectionObserver;\r\n};\r\ninterface UseListPagingForInfinityProps {\r\n\tonReachTerminal?: (onReachTerminalData: OnReachTerminalType) => void;\r\n}\r\nexport const useListPagingForSentinel = <E extends HTMLElement>({\r\n\t//initPageNumber,\r\n\t//initPageSize,\r\n\tonReachTerminal,\r\n}: UseListPagingForInfinityProps): {\r\n\tfirstChildRef: (node: E \| null) => void;\r\n\tlastChildRef: (node: E \| null) => void;\r\n\t//pageNumber: number;\r\n\t//pageSize: number;\r\n\t//setPageNumber: Dispatch<SetStateAction<number>>;\r\n\t//setPageSize: Dispatch<SetStateAction<number>>;\r\n} => {\r\n\tconst [firstChildNode, setFirstChildNode] = useState<E \| null>(null);\r\n\tconst [lastChildNode, setLastChildNode] = useState<E \| null>(null);\r\n\tconst observerRef = useRef<IntersectionObserver \| null>(null);\r\n\r\n\tconst firstChildRef = useCallback((node: E \| null) => {\r\n\t\tsetFirstChildNode(node);\r\n\t}, []);\r\n\r\n\tconst lastChildRef = useCallback((node: E \| null) => {\r\n\t\tsetLastChildNode(node);\r\n\t}, []);\r\n\t// 페이지 번호가 변경될 때마다 데이터 로드를 위한 콜백 호출\r\n\r\n\tuseEffect(() => {\r\n\t\tif (firstChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(firstChildNode);\r\n\t\tif (lastChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(lastChildNode);\r\n\t\tconst handleIntersect: IntersectionObserverCallback = (\r\n\t\t\tentries,\r\n\t\t\tobserver,\r\n\t\t) => {\r\n\t\t\tentries.forEach((entry) => {\r\n\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\tif (entry.target === firstChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: true,\r\n\t\t\t\t\t\t\t\tisLast: false,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif (entry.target === lastChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: false,\r\n\t\t\t\t\t\t\t\tisLast: true,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\tconst observer = new IntersectionObserver(handleIntersect, {\r\n\t\t\tthreshold: 0.1,\r\n\t\t});\r\n\r\n\t\tobserverRef.current = observer;\r\n\r\n\t\tif (firstChildNode) observer.observe(firstChildNode);\r\n\t\tif (lastChildNode) observer.observe(lastChildNode);\r\n\r\n\t\treturn () => {\r\n\t\t\tif (observerRef.current) {\r\n\t\t\t\t// if (firstChildNode)\r\n\t\t\t\t// observerRef.current.unobserve(firstChildNode);\r\n\t\t\t\t// if (lastChildNode) observerRef.current.unobserve(lastChildNode);\r\n\t\t\t\tobserverRef.current.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, [firstChildNode, lastChildNode]);\r\n\r\n\treturn {\r\n\t\tfirstChildRef,\r\n\t\tlastChildRef,\r\n\t};\r\n};\r\n\r\nexport const usePaginationViewNumber = ({\r\n\tinitPageNumber,\r\n}: {\r\n\tinitPageNumber: number;\r\n}) => {\r\n\tconst [showCurrentPageNumber, setShowCurrentPageNumber] =\r\n\t\tuseState<number>(initPageNumber);\r\n\r\n\tconst observerRef = useRef<IntersectionObserver \| null>(null);\r\n\tconst showCurrentPageObserveTarget = useCallback(\r\n\t\t(node: HTMLElement \| null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\t// 아직 observer가 없으면 새로 생성\r\n\t\t\tif (!observerRef.current) {\r\n\t\t\t\tobserverRef.current = new IntersectionObserver(\r\n\t\t\t\t\t(entries) => {\r\n\t\t\t\t\t\tentries.forEach((entry) => {\r\n\t\t\t\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\t\t\t\tconst pageIndexAttr =\r\n\t\t\t\t\t\t\t\t\tentry.target.getAttribute(\r\n\t\t\t\t\t\t\t\t\t\t\"data-page-index\",\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tif (!pageIndexAttr) return;\r\n\t\t\t\t\t\t\t\t// if (!entry.target.hasAttribute('data-is-first'))\r\n\t\t\t\t\t\t\t\t// return;\r\n\t\t\t\t\t\t\t\tconst pageIndex = parseInt(pageIndexAttr, 10);\r\n\t\t\t\t\t\t\t\tsetShowCurrentPageNumber(pageIndex);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t},\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthreshold: 0.1, // 예: 10% 이상 보여야 intersect로 판단\r\n\t\t\t\t\t},\r\n\t\t\t\t);\r\n\t\t\t}\r\n\r\n\t\t\t// 해당 노드를 관찰\r\n\t\t\tobserverRef.current.observe(node);\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst currentObserver = observerRef.current;\r\n\t\treturn () => {\r\n\t\t\tif (currentObserver) {\r\n\t\t\t\tcurrentObserver.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\treturn {\r\n\t\tshowCurrentPageNumber,\r\n\t\tshowCurrentPageObserveTarget,\r\n\t};\r\n};\r\n\r\nexport const usePagingHandler = <T>({\r\n\tlastCallPageNumber,\r\n\tdataListRef,\r\n}: {\r\n\tlastCallPageNumber: number;\r\n\tdataListRef: MutableRefObject<Array<T[] \| null>>;\r\n}) => {\r\n\tconst jumpingPageNumberRef = useRef<number \| null>(lastCallPageNumber);\r\n\tuseEffect(() => {\r\n\t\tif (jumpingPageNumberRef.current) {\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}, 1000);\r\n\t\t}\r\n\t}, [jumpingPageNumberRef]);\r\n\tconst paginationScrollIntoViewTarget = useRef<\r\n\t\tRecord<number, HTMLDivElement \| null>\r\n\t>({});\r\n\tconst pageNumberRef = useRef<number>(lastCallPageNumber);\r\n\r\n\tconst setPaginationRef = useCallback(\r\n\t\t(i: number) => (node: HTMLDivElement \| null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\tpaginationScrollIntoViewTarget.current[i] = node;\r\n\r\n\t\t\t// jumpingPageNumberRef에 값이 있고, 그 값이 현재 i와 같으면 스크롤\r\n\t\t\tif (\r\n\t\t\t\tjumpingPageNumberRef.current !== null &&\r\n\t\t\t\ti === jumpingPageNumberRef.current\r\n\t\t\t) {\r\n\t\t\t\tnode.scrollIntoView({\r\n\t\t\t\t\tbehavior: \"instant\", // 필요한 경우 'smooth' 등으로 수정 가능\r\n\t\t\t\t\tblock: \"start\",\r\n\t\t\t\t});\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\r\n\t//스크롤이 “첫 아이템” 혹은 “마지막 아이템”에 닿을 때 호출\r\n\tconst handleReachTerminal = (\r\n\t\t{ isFirst, isLast, observer }: OnReachTerminalType,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// 이미 다른 페이지로 점프 중이면, 중복 호출 방지\r\n\t\tif (dataListRef.current.length === 0) return;\r\n\t\tif (jumpingPageNumberRef.current != null) return;\r\n\t\tif (!isFirst && !isLast) return;\r\n\r\n\t\tconst callPageNumber = isFirst\r\n\t\t\t? Math.max(pageNumberRef.current - 1, 0)\r\n\t\t\t: pageNumberRef.current + 1;\r\n\r\n\t\tif (\r\n\t\t\tdataListRef.current[callPageNumber] != null &&\r\n\t\t\t(dataListRef.current[callPageNumber]?.length \|\| 0) > 0\r\n\t\t)\r\n\t\t\treturn;\r\n\t\tjumpingPageNumberRef.current = callPageNumber;\r\n\t\tsetTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t}, 1000);\r\n\t\tdataCallFetch(callPageNumber);\r\n\t};\r\n\r\n\t//페이지네이션에서 페이지 번호를 직접 클릭했을 시\r\n\tconst handleClickPageChange = (\r\n\t\tpage: number,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// PaginationLayer는 1-based, 내부 로직은 0-based\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tconst pageData = dataListRef.current[page];\r\n\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tif (\r\n\t\t\tpageData != null &&\r\n\t\t\tArray.isArray(pageData) &&\r\n\t\t\tpageData.length > 0\r\n\t\t) {\r\n\t\t\tpaginationScrollIntoViewTarget.current[page]?.scrollIntoView({\r\n\t\t\t\tbehavior: \"smooth\",\r\n\t\t\t\tblock: \"start\",\r\n\t\t\t});\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tjumpingPageNumberRef.current = page;\r\n\t\tsetTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t}, 1000);\r\n\t\tdataCallFetch(page);\r\n\t};\r\n\treturn {\r\n\t\tjumpingPageNumberRef,\r\n\t\tpaginationScrollIntoViewTarget,\r\n\t\tpageNumberRef,\r\n\t\tsetPaginationRef,\r\n\t\thandleReachTerminal,\r\n\t\thandleClickPageChange,\r\n\t};\r\n};\r\n"]}
1	+ {"version":3,"sources":["../../../src/flex-layout/hooks/useListPaging.ts"],"sourcesContent":["import {\r\n\tMutableRefObject,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\nexport type OnReachTerminalType = {\r\n\tisFirst: boolean;\r\n\tisLast: boolean;\r\n\tobserver: IntersectionObserver;\r\n};\r\ninterface UseListPagingForInfinityProps {\r\n\tonReachTerminal?: (onReachTerminalData: OnReachTerminalType) => void;\r\n}\r\nexport const useListPagingForSentinel = <E extends HTMLElement>({\r\n\t//initPageNumber,\r\n\t//initPageSize,\r\n\tonReachTerminal,\r\n}: UseListPagingForInfinityProps): {\r\n\tfirstChildRef: (node: E \| null) => void;\r\n\tlastChildRef: (node: E \| null) => void;\r\n\t//pageNumber: number;\r\n\t//pageSize: number;\r\n\t//setPageNumber: Dispatch<SetStateAction<number>>;\r\n\t//setPageSize: Dispatch<SetStateAction<number>>;\r\n} => {\r\n\tconst [firstChildNode, setFirstChildNode] = useState<E \| null>(null);\r\n\tconst [lastChildNode, setLastChildNode] = useState<E \| null>(null);\r\n\tconst observerRef = useRef<IntersectionObserver \| null>(null);\r\n\r\n\tconst firstChildRef = useCallback((node: E \| null) => {\r\n\t\tsetFirstChildNode(node);\r\n\t}, []);\r\n\r\n\tconst lastChildRef = useCallback((node: E \| null) => {\r\n\t\tsetLastChildNode(node);\r\n\t}, []);\r\n\t// 페이지 번호가 변경될 때마다 데이터 로드를 위한 콜백 호출\r\n\r\n\tuseEffect(() => {\r\n\t\tif (firstChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(firstChildNode);\r\n\t\tif (lastChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(lastChildNode);\r\n\t\tconst handleIntersect: IntersectionObserverCallback = (\r\n\t\t\tentries,\r\n\t\t\tobserver,\r\n\t\t) => {\r\n\t\t\tentries.forEach((entry) => {\r\n\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\tif (entry.target === firstChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: true,\r\n\t\t\t\t\t\t\t\tisLast: false,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif (entry.target === lastChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: false,\r\n\t\t\t\t\t\t\t\tisLast: true,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\tconst observer = new IntersectionObserver(handleIntersect, {\r\n\t\t\tthreshold: 0.1,\r\n\t\t});\r\n\r\n\t\tobserverRef.current = observer;\r\n\r\n\t\tif (firstChildNode) observer.observe(firstChildNode);\r\n\t\tif (lastChildNode) observer.observe(lastChildNode);\r\n\r\n\t\treturn () => {\r\n\t\t\tif (observerRef.current) {\r\n\t\t\t\t// if (firstChildNode)\r\n\t\t\t\t// observerRef.current.unobserve(firstChildNode);\r\n\t\t\t\t// if (lastChildNode) observerRef.current.unobserve(lastChildNode);\r\n\t\t\t\tobserverRef.current.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, [firstChildNode, lastChildNode]);\r\n\r\n\treturn {\r\n\t\tfirstChildRef,\r\n\t\tlastChildRef,\r\n\t};\r\n};\r\n\r\nexport const usePaginationViewNumber = ({\r\n\tinitPageNumber,\r\n}: {\r\n\tinitPageNumber: number;\r\n}) => {\r\n\tconst [showCurrentPageNumber, setShowCurrentPageNumber] =\r\n\t\tuseState<number>(initPageNumber);\r\n\r\n\tconst observerRef = useRef<IntersectionObserver \| null>(null);\r\n\tconst showCurrentPageObserveTarget = useCallback(\r\n\t\t(node: HTMLElement \| null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\t// 아직 observer가 없으면 새로 생성\r\n\t\t\tif (!observerRef.current) {\r\n\t\t\t\tobserverRef.current = new IntersectionObserver(\r\n\t\t\t\t\t(entries) => {\r\n\t\t\t\t\t\tentries.forEach((entry) => {\r\n\t\t\t\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\t\t\t\tconst pageIndexAttr =\r\n\t\t\t\t\t\t\t\t\tentry.target.getAttribute(\r\n\t\t\t\t\t\t\t\t\t\t\"data-page-index\",\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tif (!pageIndexAttr) return;\r\n\t\t\t\t\t\t\t\t// if (!entry.target.hasAttribute('data-is-first'))\r\n\t\t\t\t\t\t\t\t// return;\r\n\t\t\t\t\t\t\t\tconst pageIndex = parseInt(pageIndexAttr, 10);\r\n\t\t\t\t\t\t\t\tsetShowCurrentPageNumber(pageIndex);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t},\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthreshold: 0.1, // 예: 10% 이상 보여야 intersect로 판단\r\n\t\t\t\t\t},\r\n\t\t\t\t);\r\n\t\t\t}\r\n\r\n\t\t\t// 해당 노드를 관찰\r\n\t\t\tobserverRef.current.observe(node);\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst currentObserver = observerRef.current;\r\n\t\treturn () => {\r\n\t\t\tif (currentObserver) {\r\n\t\t\t\tcurrentObserver.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\treturn {\r\n\t\tshowCurrentPageNumber,\r\n\t\tshowCurrentPageObserveTarget,\r\n\t};\r\n};\r\n\r\nexport const usePagingHandler = <T>({\r\n\tlastCallPageNumber,\r\n\tdataListRef,\r\n}: {\r\n\tlastCallPageNumber: number;\r\n\tdataListRef: MutableRefObject<Array<T[] \| null>>;\r\n}) => {\r\n\tconst jumpingPageNumberRef = useRef<number \| null>(lastCallPageNumber);\r\n\r\n\tconst paginationScrollIntoViewTarget = useRef<\r\n\t\tRecord<number, HTMLDivElement \| null>\r\n\t>({});\r\n\tconst pageNumberRef = useRef<number>(lastCallPageNumber);\r\n\r\n\tconst resetJumpTimerIdRef = useRef<ReturnType<typeof setTimeout> \| null>(\r\n\t\tnull,\r\n\t);\r\n\r\n\tconst clearResetTimer = useCallback(() => {\r\n\t\tif (resetJumpTimerIdRef.current !== null) {\r\n\t\t\twindow.clearTimeout(resetJumpTimerIdRef.current);\r\n\t\t\tresetJumpTimerIdRef.current = null;\r\n\t\t}\r\n\t}, []);\r\n\r\n\tconst armResetTimer = useCallback(() => {\r\n\t\tclearResetTimer();\r\n\t\tresetJumpTimerIdRef.current = window.setTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\tresetJumpTimerIdRef.current = null;\r\n\t\t}, 1000);\r\n\t}, [clearResetTimer]);\r\n\r\n\tuseEffect(() => {\r\n\t\treturn () => {\r\n\t\t\tclearResetTimer();\r\n\t\t};\r\n\t}, [clearResetTimer]);\r\n\r\n\tconst setPaginationRef = useCallback(\r\n\t\t(i: number) => (node: HTMLDivElement \| null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\tpaginationScrollIntoViewTarget.current[i] = node;\r\n\r\n\t\t\t// jumpingPageNumberRef에 값이 있고, 그 값이 현재 i와 같으면 스크롤\r\n\t\t\tif (\r\n\t\t\t\tjumpingPageNumberRef.current !== null &&\r\n\t\t\t\ti === jumpingPageNumberRef.current\r\n\t\t\t) {\r\n\t\t\t\tnode.scrollIntoView({\r\n\t\t\t\t\tbehavior: \"instant\", // 필요한 경우 'smooth' 등으로 수정 가능\r\n\t\t\t\t\tblock: \"start\",\r\n\t\t\t\t});\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\r\n\t//스크롤이 “첫 아이템” 혹은 “마지막 아이템”에 닿을 때 호출\r\n\tconst handleReachTerminal = (\r\n\t\t{ isFirst, isLast, observer }: OnReachTerminalType,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// 이미 다른 페이지로 점프 중이면, 중복 호출 방지\r\n\t\tif (dataListRef.current.length === 0) return;\r\n\t\tif (jumpingPageNumberRef.current != null) return;\r\n\t\tif (!isFirst && !isLast) return;\r\n\r\n\t\tconst callPageNumber = isFirst\r\n\t\t\t? Math.max(pageNumberRef.current - 1, 0)\r\n\t\t\t: pageNumberRef.current + 1;\r\n\r\n\t\tif (\r\n\t\t\tdataListRef.current[callPageNumber] != null &&\r\n\t\t\t(dataListRef.current[callPageNumber]?.length \|\| 0) > 0\r\n\t\t)\r\n\t\t\treturn;\r\n\t\tjumpingPageNumberRef.current = callPageNumber;\r\n\t\tarmResetTimer();\r\n\t\tdataCallFetch(callPageNumber);\r\n\t};\r\n\r\n\t//페이지네이션에서 페이지 번호를 직접 클릭했을 시\r\n\tconst handleClickPageChange = (\r\n\t\tpage: number,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// PaginationLayer는 1-based, 내부 로직은 0-based\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tconst pageData = dataListRef.current[page];\r\n\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tif (\r\n\t\t\tpageData != null &&\r\n\t\t\tArray.isArray(pageData) &&\r\n\t\t\tpageData.length > 0\r\n\t\t) {\r\n\t\t\tpaginationScrollIntoViewTarget.current[page]?.scrollIntoView({\r\n\t\t\t\tbehavior: \"smooth\",\r\n\t\t\t\tblock: \"start\",\r\n\t\t\t});\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tjumpingPageNumberRef.current = page;\r\n\t\tarmResetTimer();\r\n\t\tdataCallFetch(page);\r\n\t};\r\n\treturn {\r\n\t\tjumpingPageNumberRef,\r\n\t\tpaginationScrollIntoViewTarget,\r\n\t\tpageNumberRef,\r\n\t\tsetPaginationRef,\r\n\t\thandleReachTerminal,\r\n\t\thandleClickPageChange,\r\n\t};\r\n};\r\n"],"mappings":"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","names":["observer"]}

package/dist/flex-layout/hooks/useListPaging.js CHANGED Viewed

@@ -1,5 +1,9 @@
-import { useState, useRef, useCallback, useEffect } from 'react';
+import {
+  useCallback,
+  useEffect,
+  useRef,
+  useState
+} from "react";
 const useListPagingForSentinel = ({
   //initPageNumber,
   //initPageSize,
@@ -108,15 +112,29 @@ const usePagingHandler = ({
   dataListRef
 }) => {
   const jumpingPageNumberRef = useRef(lastCallPageNumber);
-  useEffect(() => {
-    if (jumpingPageNumberRef.current) {
-      setTimeout(() => {
-        jumpingPageNumberRef.current = null;
-      }, 1e3);
-    }
-  }, [jumpingPageNumberRef]);
   const paginationScrollIntoViewTarget = useRef({});
   const pageNumberRef = useRef(lastCallPageNumber);
+  const resetJumpTimerIdRef = useRef(
+    null
+  );
+  const clearResetTimer = useCallback(() => {
+    if (resetJumpTimerIdRef.current !== null) {
+      window.clearTimeout(resetJumpTimerIdRef.current);
+      resetJumpTimerIdRef.current = null;
+    }
+  }, []);
+  const armResetTimer = useCallback(() => {
+    clearResetTimer();
+    resetJumpTimerIdRef.current = window.setTimeout(() => {
+      jumpingPageNumberRef.current = null;
+      resetJumpTimerIdRef.current = null;
+    }, 1e3);
+  }, [clearResetTimer]);
+  useEffect(() => {
+    return () => {
+      clearResetTimer();
+    };
+  }, [clearResetTimer]);
   const setPaginationRef = useCallback(
     (i) => (node) => {
       if (!node) return;
@@ -140,9 +158,7 @@ const usePagingHandler = ({
     if (dataListRef.current[callPageNumber] != null && (dataListRef.current[callPageNumber]?.length || 0) > 0)
       return;
     jumpingPageNumberRef.current = callPageNumber;
-    setTimeout(() => {
-      jumpingPageNumberRef.current = null;
-    }, 1e3);
+    armResetTimer();
     dataCallFetch(callPageNumber);
   };
   const handleClickPageChange = (page, dataCallFetch) => {
@@ -155,9 +171,7 @@ const usePagingHandler = ({
       return;
     }
     jumpingPageNumberRef.current = page;
-    setTimeout(() => {
-      jumpingPageNumberRef.current = null;
-    }, 1e3);
+    armResetTimer();
     dataCallFetch(page);
   };
   return {
@@ -169,7 +183,9 @@ const usePagingHandler = ({
     handleClickPageChange
   };
 };
-export { useListPagingForSentinel, usePaginationViewNumber, usePagingHandler };
-//# sourceMappingURL=useListPaging.js.map
+export {
+  useListPagingForSentinel,
+  usePaginationViewNumber,
+  usePagingHandler
+};
 //# sourceMappingURL=useListPaging.js.map