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

@byeolnaerim/flex-layout 0.0.9 → 0.0.12

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 (132) hide show

package/dist/flex-layout/components/FlexLayoutSplitScreen.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreen.tsx"],"sourcesContent":["\"use client\";\r\nimport {\r\n\tcloneElement,\r\n\tReactElement,\r\n\tRefObject,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropPositionOrderName,\r\n\tDropTargetComponent,\r\n} from \"../hooks/useDrag\";\r\nimport { useFlexLayoutSplitScreen } from \"../hooks/useFlexLayoutSplitScreen\";\r\nimport {\r\n\tgetCurrentSplitScreenComponents,\r\n\tgetSplitScreen,\r\n\tremoveRootSplitScreen,\r\n\tremoveSplitScreenChild,\r\n\tresetRootSplitScreen,\r\n\tsetSplitScreen,\r\n} from \"../store/FlexLayoutContainerStore\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport FlexLayout from \"./FlexLayout\";\r\nimport FlexLayoutContainer from \"./FlexLayoutContainer\";\r\nimport FlexLayoutSplitScreenDragBox, {\r\n\tDropDocumentOutsideOption,\r\n} from \"./FlexLayoutSplitScreenDragBox\";\r\n\r\nimport equal from \"fast-deep-equal\";\r\nimport { distinctUntilChanged, take } from \"rxjs\";\r\nimport FlexLayoutSplitScreenDragBoxContainer from \"./FlexLayoutSplitScreenDragBoxContainer\";\r\nimport FlexLayoutSplitScreenDragBoxItem from \"./FlexLayoutSplitScreenDragBoxItem\";\r\nimport FlexLayoutSplitScreenDragBoxTitleMore from \"./FlexLayoutSplitScreenDragBoxTitleMore\";\r\nimport FlexLayoutSplitScreenScrollBox from \"./FlexLayoutSplitScreenScrollBox\";\r\n\r\nfunction isOverDrop({\r\n\tx,\r\n\ty,\r\n\telement,\r\n}: {\r\n\tx: number;\r\n\ty: number;\r\n\telement: HTMLDivElement;\r\n}) {\r\n\tconst {\r\n\t\tx: elementX,\r\n\t\ty: elementY,\r\n\t\tright: elementRight,\r\n\t\tbottom: elementBottom,\r\n\t} = element.getBoundingClientRect();\r\n\tconst isElementOver =\r\n\t\tx < elementX || x > elementRight || y < elementY || y > elementBottom;\r\n\treturn isElementOver;\r\n}\r\nfunction isInnerDrop({\r\n\tx,\r\n\ty,\r\n\telement,\r\n}: {\r\n\tx: number;\r\n\ty: number;\r\n\telement: HTMLDivElement;\r\n}) {\r\n\tconst {\r\n\t\tx: elementX,\r\n\t\ty: elementY,\r\n\t\tright: elementRight,\r\n\t\tbottom: elementBottom,\r\n\t} = element.getBoundingClientRect();\r\n\tconst isElementInner =\r\n\t\tx >= elementX &&\r\n\t\tx <= elementRight &&\r\n\t\ty >= elementY &&\r\n\t\ty <= elementBottom;\r\n\treturn isElementInner;\r\n}\r\n\r\nconst handleUpdateDropTargetComponents = ({\r\n\torderName,\r\n\tparentOrderName,\r\n\tcontainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n\tdropComponent,\r\n\tnavigationTitle,\r\n\tnextContainerName,\r\n\tisUsePrefix = true,\r\n\tbeforeDropTargetComponent,\r\n\tafterDropTargetComponent,\r\n\tcenterDropTargetComponent,\r\n\tdropDocumentOutsideOption,\r\n\tscreenKey = Array.from(\r\n\t\twindow.crypto.getRandomValues(new Uint32Array(16)),\r\n\t\t(e) => e.toString(32).padStart(2, \"0\"),\r\n\t).join(\"\"),\r\n}: {\r\n\torderName: DropPositionOrderName;\r\n\tparentOrderName?: DropPositionOrderName;\r\n\tcontainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n\tdropComponent: ReactElement;\r\n\tnavigationTitle?: string;\r\n\tnextContainerName?: string;\r\n\tisUsePrefix?: boolean;\r\n\tbeforeDropTargetComponent: DropTargetComponent[];\r\n\tafterDropTargetComponent: DropTargetComponent[];\r\n\tcenterDropTargetComponent: DropTargetComponent[];\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey?: string;\r\n}) => {\r\n\tconst nextContainerNameOrderName = parentOrderName\r\n\t\t? parentOrderName\r\n\t\t: orderName;\r\n\r\n\tlet listMap: Record<string, DropTargetComponent[]>;\r\n\tlet list: DropTargetComponent[];\r\n\tlet key: string;\r\n\tif (\r\n\t\tnextContainerNameOrderName === orderName ||\r\n\t\tnextContainerNameOrderName === \"center\"\r\n\t) {\r\n\t\tlistMap =\r\n\t\t\torderName === \"before\"\r\n\t\t\t\t? { beforeDropTargetComponent }\r\n\t\t\t\t: orderName === \"after\"\r\n\t\t\t\t\t? { afterDropTargetComponent }\r\n\t\t\t\t\t: {\r\n\t\t\t\t\t\t\tcenterDropTargetComponent:\r\n\t\t\t\t\t\t\t\tcenterDropTargetComponent.filter(\r\n\t\t\t\t\t\t\t\t\t(e) =>\r\n\t\t\t\t\t\t\t\t\t\t!e.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t.split(\"_\")\r\n\t\t\t\t\t\t\t\t\t\t\t.at(0)!\r\n\t\t\t\t\t\t\t\t\t\t\t.startsWith(\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName.split(\"_\").at(0)!,\r\n\t\t\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t};\r\n\t} else {\r\n\t\tlistMap =\r\n\t\t\tnextContainerNameOrderName === \"before\"\r\n\t\t\t\t? { beforeDropTargetComponent }\r\n\t\t\t\t: { afterDropTargetComponent };\r\n\t}\r\n\tconst entries = Object.entries(listMap)[0];\r\n\tkey = entries[0];\r\n\tlist = entries[1];\r\n\t/*\r\n nextContainerNameOrderName이 after고 orderName이 before면 setAfterDropTargetComponent에서 nextContainerName의 뒤에 넣는다.\r\n nextContainerNameOrderName이 before고 orderName이 after면 setBeforeDropTargetComponent에서 nextContainerName 앞에 넣는다. \r\n nextContainerNameOrderName이 center고 orderName이 after면 리스트의 첫번째에 넣는다.\r\n nextContainerNameOrderName이 center고 orderName이 before면 리스트의 마지막에 넣는다.\r\n nextContainerNameOrderName === orderName가 같고 orderName이 after나 center면 list에서 nextContainerName 앞에 넣는다.\r\n nextContainerNameOrderName === orderName가 같고 orderName이 before면 list에서 nextContainerName 뒤에 넣는다.\r\n */\r\n\r\n\tconst newComponent = {\r\n\t\tcontainerName: `${containerName + \"_\" + layoutName}${isUsePrefix ? \"_\" + orderName + \"-\" + list.length : \"\"}`,\r\n\t\tcomponent: cloneElement(\r\n\t\t\tdropComponent as ReactElement<{ screenKey: string }>,\r\n\t\t\t{ key: screenKey, screenKey },\r\n\t\t),\r\n\t\tnavigationTitle,\r\n\t\tdropDocumentOutsideOption,\r\n\t\tscreenKey:\r\n\t\t\tscreenKey ||\r\n\t\t\tArray.from(\r\n\t\t\t\twindow.crypto.getRandomValues(new Uint32Array(16)),\r\n\t\t\t\t(e) => e.toString(32).padStart(2, \"0\"),\r\n\t\t\t).join(\"\"),\r\n\t};\r\n\tlet allComponents;\r\n\r\n\tif (nextContainerName) {\r\n\t\t// nextContainerName이 존재할 때\r\n\t\tconst index = list.findIndex(\r\n\t\t\t(item) => item.containerName === nextContainerName,\r\n\t\t);\r\n\t\tif (index !== -1) {\r\n\t\t\tif (nextContainerNameOrderName === orderName) {\r\n\t\t\t\tif (orderName === \"before\") {\r\n\t\t\t\t\t// nextContainerNameOrderName === orderName가 같고\r\n\t\t\t\t\t// orderName이 before면 list에서 nextContainerName 뒤에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index),\r\n\t\t\t\t\t];\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// nextContainerNameOrderName === orderName가 같고\r\n\t\t\t\t\t// orderName이 after나 center면 list에서 nextContainerName 앞에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index + 1),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index + 1),\r\n\t\t\t\t\t];\r\n\t\t\t\t}\r\n\t\t\t} else {\r\n\t\t\t\tif (\r\n\t\t\t\t\tnextContainerNameOrderName === \"after\" &&\r\n\t\t\t\t\torderName === \"before\"\r\n\t\t\t\t) {\r\n\t\t\t\t\t// nextContainerNameOrderName이 after고 orderName이 before면\r\n\t\t\t\t\t// setAfterDropTargetComponent에서 nextContainerName의 뒤에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index),\r\n\t\t\t\t\t];\r\n\t\t\t\t} else if (\r\n\t\t\t\t\tnextContainerNameOrderName === \"before\" &&\r\n\t\t\t\t\torderName === \"after\"\r\n\t\t\t\t) {\r\n\t\t\t\t\t// nextContainerNameOrderName이 before고 orderName이 after면\r\n\t\t\t\t\t// setBeforeDropTargetComponent에서 nextContainerName 앞에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index + 1),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index + 1),\r\n\t\t\t\t\t];\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// 기타 경우 기존 로직 유지\r\n\t\t\t\t\tif (orderName === \"before\") {\r\n\t\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t\t...list.slice(0, index),\r\n\t\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t\t...list.slice(index),\r\n\t\t\t\t\t\t];\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t\t...list.slice(0, index + 1),\r\n\t\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t\t...list.slice(index + 1),\r\n\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} else {\r\n\t\t\tif (\r\n\t\t\t\tnextContainerNameOrderName === \"center\" &&\r\n\t\t\t\torderName === \"after\"\r\n\t\t\t) {\r\n\t\t\t\t// nextContainerNameOrderName이 center고 orderName이 after면\r\n\t\t\t\t// setAfterDropTargetComponent에서 첫번째에 넣는다.\r\n\t\t\t\tallComponents = [newComponent, ...list];\r\n\t\t\t} else if (\r\n\t\t\t\tnextContainerNameOrderName === \"center\" &&\r\n\t\t\t\torderName === \"before\"\r\n\t\t\t) {\r\n\t\t\t\t// nextContainerNameOrderName이 center고 orderName이 before면\r\n\t\t\t\t// setBeforeDropTargetComponent에서 마지막에 넣는다.\r\n\r\n\t\t\t\tallComponents = [...list, newComponent];\r\n\t\t\t} else {\r\n\t\t\t\t// nextContainerName을 찾지 못했을 경우 기존 로직 유지\r\n\t\t\t\tallComponents =\r\n\t\t\t\t\torderName === \"before\"\r\n\t\t\t\t\t\t? [newComponent, ...list]\r\n\t\t\t\t\t\t: [...list, newComponent];\r\n\t\t\t}\r\n\t\t}\r\n\t} else {\r\n\t\t// nextContainerName이 존재하지 않을 때 기존 로직 유지\r\n\t\tallComponents =\r\n\t\t\torderName === \"before\"\r\n\t\t\t\t? [newComponent, ...list]\r\n\t\t\t\t: [...list, newComponent];\r\n\t}\r\n\r\n\tconst seen = new Set<string>();\r\n\r\n\tconst result = allComponents.filter((item) => {\r\n\t\tif (seen.has(item.containerName)) {\r\n\t\t\treturn false; // 이미 본 containerName은 제거\r\n\t\t}\r\n\t\tseen.add(item.containerName);\r\n\t\treturn true;\r\n\t});\r\n\tdropMovementEventSubject.next({\r\n\t\tstate: \"append\",\r\n\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\ttargetLayoutName: layoutName,\r\n\t\ttargetContainerName: containerName,\r\n\t\torderName: orderName,\r\n\t});\r\n\treturn { [key]: result };\r\n};\r\n\r\nconst handleRemove = (\r\n\tlist: DropTargetComponent[],\r\n\ttargetContainerName: string,\r\n\torderNameSetter: (removeCount: number) => void,\r\n) => {\r\n\tconst result = list.filter((e) => e.containerName !== targetContainerName);\r\n\tif (result.length != list.length)\r\n\t\torderNameSetter(list.length - result.length);\r\n\treturn result;\r\n};\r\n\r\nfunction getAdjacentItem<T>(items: T[], currentIndex: number) {\r\n\tif (currentIndex + 1 < items.length) {\r\n\t\treturn {\r\n\t\t\tadjacentItem: items[currentIndex + 1],\r\n\t\t\tadjacentIndex: currentIndex + 1,\r\n\t\t};\r\n\t} else if (currentIndex - 1 >= 0) {\r\n\t\treturn {\r\n\t\t\tadjacentItem: items[currentIndex - 1],\r\n\t\t\tadjacentIndex: currentIndex - 1,\r\n\t\t};\r\n\t}\r\n\treturn { adjacentItem: null, adjacentIndex: currentIndex };\r\n}\r\n\r\nconst getSelfOrderName = (\r\n\tcontainerName: string,\r\n): DropPositionOrderName | undefined => {\r\n\tconst result = containerName\r\n\t\t.split(\"_\")\r\n\t\t.at(-1)\r\n\t\t?.split(\"-\")\r\n\t\t.at(0)\r\n\t\t?.split(\"=\")\r\n\t\t.at(0);\r\n\tif ([\"before\", \"center\", \"after\"].some((e) => e === result)) {\r\n\t\treturn result as DropPositionOrderName;\r\n\t} else {\r\n\t\treturn;\r\n\t}\r\n};\r\n\r\nexport type FlexLayoutSplitScreenProps = {\r\n\tlayoutName: string;\r\n\tcontainerName: string;\r\n\tchildren: ReactElement; //ComponentType | ReactElement;\r\n\tnavigationTitle: string;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey?: string;\r\n};\r\n\r\nexport default function FlexLayoutSplitScreen({\r\n\tchildren,\r\n\tcontainerName,\r\n\tlayoutName,\r\n\tnavigationTitle,\r\n\tdropDocumentOutsideOption,\r\n\tscreenKey,\r\n}: FlexLayoutSplitScreenProps) {\r\n\tconst {\r\n\t\tdirection,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\tlayoutRef,\r\n\t\tsetIsSplit,\r\n\t\tsetDirection,\r\n\t} = useFlexLayoutSplitScreen({\r\n\t\tisSplitInitial: false,\r\n\t\tdirectionInitial: \"row\",\r\n\t\tselfContainerName: containerName,\r\n\t\tparentLayoutName: \"\",\r\n\t\tlayoutName: layoutName,\r\n\t});\r\n\r\n\tuseEffect(() => {\r\n\t\tresetRootSplitScreen(layoutName);\r\n\t\tconst subscribe = getSplitScreen(layoutName, layoutName)\r\n\t\t\t//.pipe(take(1))\r\n\t\t\t.subscribe((layoutInfo) => {\r\n\t\t\t\tif (layoutInfo) {\r\n\t\t\t\t\t// console.log(\r\n\t\t\t\t\t// 'layoutInfo:::',\r\n\t\t\t\t\t// layoutInfo,\r\n\t\t\t\t\t// layoutName,\r\n\t\t\t\t\t// containerName\r\n\t\t\t\t\t// );\r\n\t\t\t\t\tsetBeforeDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.beforeDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetAfterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.afterDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetCenterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.centerDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetDirection(layoutInfo.direction);\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutInfo.beforeDropTargetComponent.length !== 0 ||\r\n\t\t\t\t\t\tlayoutInfo.afterDropTargetComponent.length !== 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t}\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// const screenKey = Array.from(\r\n\t\t\t\t\t// window.crypto.getRandomValues(new Uint32Array(16)),\r\n\t\t\t\t\t// e => e.toString(32).padStart(2, '0')\r\n\t\t\t\t\t// ).join('');\r\n\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\tafterDropTargetComponent: [],\r\n\t\t\t\t\t\tbeforeDropTargetComponent: [],\r\n\t\t\t\t\t\tcenterDropTargetComponent: [\r\n\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\t\t\tcomponent: children,\r\n\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\tscreenKey: screenKey\r\n\t\t\t\t\t\t\t\t\t? screenKey\r\n\t\t\t\t\t\t\t\t\t: Array.from(\r\n\t\t\t\t\t\t\t\t\t\t\twindow.crypto.getRandomValues(\r\n\t\t\t\t\t\t\t\t\t\t\t\tnew Uint32Array(16),\r\n\t\t\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t\t\t\t(e) =>\r\n\t\t\t\t\t\t\t\t\t\t\t\te.toString(32).padStart(2, \"0\"),\r\n\t\t\t\t\t\t\t\t\t\t).join(\"\"),\r\n\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t],\r\n\t\t\t\t\t\tdirection: direction,\r\n\t\t\t\t\t});\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t\tremoveRootSplitScreen(layoutName);\r\n\t\t};\r\n\t}, [layoutName, screenKey, navigationTitle, children, direction]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscribe = dropMovementEventSubject\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged((prev, curr) => {\r\n\t\t\t\t\t// 이전 상태와 현재 상태를 비교하여 동일하면 필터링\r\n\t\t\t\t\tconst filterChildren = (obj: any) => {\r\n\t\t\t\t\t\t// 객체 복사 후 children 속성 제거\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tchildren,\r\n\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t...rest\r\n\t\t\t\t\t\t} = obj || {};\r\n\t\t\t\t\t\treturn rest;\r\n\t\t\t\t\t};\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((event) => {\r\n\t\t\t\tif (event.state === \"remove\") {\r\n\t\t\t\t\t// 렌더링 중에 바로 setRemoveContainerName을 호출하지 않고\r\n\t\t\t\t\t// requestAnimationFrame으로 감싸 렌더 후에 실행되도록 한다.\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tevent.targetParentLayoutName === layoutName ||\r\n\t\t\t\t\t\t(event.targetParentLayoutName === \"\" &&\r\n\t\t\t\t\t\t\tevent.targetLayoutName === layoutName)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\trequestAnimationFrame(() => {\r\n\t\t\t\t\t\t\tlet removeCallback = (\r\n\t\t\t\t\t\t\t\tremoveOrderName: DropPositionOrderName,\r\n\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t// removeSplitScreenChild(\r\n\t\t\t\t\t\t\t\t// layoutName,\r\n\t\t\t\t\t\t\t\t// event.targetLayoutName\r\n\t\t\t\t\t\t\t\t// );\r\n\t\t\t\t\t\t\t\t//탭 이동이고 현재 활성화 된 탭인 경우\r\n\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\tevent.nextContainerName &&\r\n\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent &&\r\n\t\t\t\t\t\t\t\t\tevent.targetComponent\r\n\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\t\torderName: removeOrderName,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\t\tparentLayoutName: \"\",\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tdropComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.targetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent!\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.navigationTitle!,\r\n\t\t\t\t\t\t\t\t\t\t\tisUsePrefix: true,\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.screenKey,\r\n\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\t\t\t\t\t...(getCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t\tconst currentComponents =\r\n\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst afterList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.afterDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"after\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst beforList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.beforeDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"before\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst centerList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.centerDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"center\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\t\t\tafterDropTargetComponent: afterList,\r\n\t\t\t\t\t\t\t\tbeforeDropTargetComponent: beforList,\r\n\t\t\t\t\t\t\t\tcenterDropTargetComponent: centerList,\r\n\t\t\t\t\t\t\t\tdirection,\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} else if (event.state === \"append\") {\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\tx,\r\n\t\t\t\t\t\ty,\r\n\t\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\t\tdropTargetComponentEvent,\r\n\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t\ttargetLayoutName,\r\n\t\t\t\t\t\ttargetParentLayoutName,\r\n\t\t\t\t\t\ttargetContainerName,\r\n\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\tnextContainerName,\r\n\t\t\t\t\t} = event;\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutRef.current &&\r\n\t\t\t\t\t\torderName &&\r\n\t\t\t\t\t\tx &&\r\n\t\t\t\t\t\ty &&\r\n\t\t\t\t\t\ttargetComponent &&\r\n\t\t\t\t\t\tdropTargetComponentEvent &&\r\n\t\t\t\t\t\ttargetLayoutName === layoutName &&\r\n\t\t\t\t\t\tisInnerDrop({ x, y, element: layoutRef.current })\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t} = dropTargetComponentEvent;\r\n\r\n\t\t\t\t\t\tconst isOrderNameNotCenter = orderName !== \"center\";\r\n\t\t\t\t\t\tconst isOrderNameCenterAndFirstScreen =\r\n\t\t\t\t\t\t\torderName === \"center\" &&\r\n\t\t\t\t\t\t\tcenterDropTargetComponent.length <= 1;\r\n\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\tisOrderNameNotCenter ||\r\n\t\t\t\t\t\t\tisOrderNameCenterAndFirstScreen\r\n\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t\t\tif (isOrderNameNotCenter) {\r\n\t\t\t\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t\t\t\t\t\tcontainerName: targetContainerName,\r\n\t\t\t\t\t\t\t\t\t\tnextContainerName: nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\tdropComponent: targetComponent,\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName: \"\",\r\n\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tisUsePrefix: true,\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t});\r\n\r\n\t\t\t\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\t\t\t\t...{\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t...{ direction: dropDirection },\r\n\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\tdropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\tdropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\tconst childScreenInfo =\r\n\t\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t`${layoutName}_center=${centerDropTargetComponent[0].screenKey}`,\r\n\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent: [],\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent: [],\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent: [],\r\n\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t`${layoutName}_center=${centerDropTargetComponent[0].screenKey}`,\r\n\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t...childScreenInfo,\r\n\t\t\t\t\t\t\t\t\t\t...{\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent: [\r\n\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0],\r\n\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: `${targetContainerName}_${layoutName}_${orderName}`,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent: targetComponent!,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropTargetComponentEvent.screenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t],\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t);\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}\r\n\t\t\t});\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [\r\n\t\tdirection,\r\n\t\tlayoutName,\r\n\t\tisSplit,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t]);\r\n\r\n\treturn (\r\n\t\t<div className={`${styles[\"flex-split-screen\"]}`} ref={layoutRef}>\r\n\t\t\t<FlexLayout\r\n\t\t\t\tdirection={direction}\r\n\t\t\t\tlayoutName={layoutName}\r\n\t\t\t\tdata-is_split={isSplit}\r\n\t\t\t\tpanelMovementMode=\"bulldozer\"\r\n\t\t\t>\r\n\t\t\t\t{beforeDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t<>\r\n\t\t\t\t\t\t{beforeDropTargetComponent.map(\r\n\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\tisResizePanel\r\n\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_before`}\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\tdepth={1}\r\n\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\trootRef={layoutRef}\r\n\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\trootName={layoutName}\r\n\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t</FlexLayoutContainer>\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) : (\r\n\t\t\t\t\t<div></div>\r\n\t\t\t\t)}\r\n\t\t\t\t{centerDropTargetComponent.length === 0 ? (\r\n\t\t\t\t\t<div></div>\r\n\t\t\t\t) : (\r\n\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\tcontainerName={`${centerDropTargetComponent[0].containerName}`}\r\n\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\tisResizePanel={isSplit}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{isSplit ? (\r\n\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_center`}\r\n\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\tcontainerName={`${centerDropTargetComponent[0].containerName}`}\r\n\t\t\t\t\t\t\t\tdepth={0}\r\n\t\t\t\t\t\t\t\trootRef={layoutRef}\r\n\t\t\t\t\t\t\t\tscreenKey={\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0].screenKey\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.navigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tcomponent:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.component,\r\n\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.containerName,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.dropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.screenKey,\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\trootName={layoutName}\r\n\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<FlexLayoutSplitScreenScrollBox\r\n\t\t\t\t\t\t\t\tkeyName={\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0].containerName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\tisDefaultScrollStyle={true}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{centerDropTargetComponent[0].component}\r\n\t\t\t\t\t\t\t</FlexLayoutSplitScreenScrollBox>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t)}\r\n\t\t\t\t{afterDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t<>\r\n\t\t\t\t\t\t{afterDropTargetComponent.map(\r\n\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\tisResizePanel={\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent.length - 1 !==\r\n\t\t\t\t\t\t\t\t\t\ti\r\n\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_after`}\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\tdepth={1}\r\n\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\trootRef={layoutRef}\r\n\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\trootName={layoutName}\r\n\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t</FlexLayoutContainer>\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) : (\r\n\t\t\t\t\t<div></div>\r\n\t\t\t\t)}\r\n\t\t\t</FlexLayout>\r\n\t\t\t{boundaryContainerSize && (\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName={`${styles[\"flex-split-screen-boundary-container\"]}`}\r\n\t\t\t\t\tstyle={{ ...boundaryContainerSize }}\r\n\t\t\t\t>\r\n\t\t\t\t\t⬇️드롭하면 화면이 분할됩니다.\r\n\t\t\t\t</div>\r\n\t\t\t)}\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nfunction FlexLayoutSplitScreenChild({\r\n\tcontainerName,\r\n\tlayoutName,\r\n\tparentLayoutName,\r\n\tparentDirection,\r\n\tdepth,\r\n\t//isSplit: isSplitInitial,\r\n\trootRef,\r\n\trootName,\r\n\tinitialCenterComponents,\r\n\tscreenKey,\r\n}: {\r\n\tlayoutName: string;\r\n\tparentLayoutName: string;\r\n\tcontainerName: string;\r\n\tparentDirection: \"row\" | \"column\";\r\n\tdepth: number;\r\n\t//isSplit: boolean;\r\n\trootRef: RefObject<HTMLDivElement | null>;\r\n\trootName: string;\r\n\tinitialCenterComponents?: DropTargetComponent[];\r\n\tscreenKey: string;\r\n}) {\r\n\t// const memoizedChildren = useMemo(\r\n\t// () => <MemoizedChildren>{children}</MemoizedChildren>,\r\n\t// [children]\r\n\t// );\r\n\tconst {\r\n\t\tdirection,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\tlayoutRef,\r\n\t\tsetIsSplit,\r\n\t\tsetDirection,\r\n\t} = useFlexLayoutSplitScreen({\r\n\t\tisSplitInitial: false,\r\n\t\tdirectionInitial: \"row\",\r\n\t\tparentDirection,\r\n\t\tselfContainerName: containerName,\r\n\t\tparentLayoutName: parentLayoutName,\r\n\t\tlayoutName: layoutName,\r\n\t});\r\n\r\n\tconst [isEmptyContent, setIsEmptyContent] = useState<boolean>(false);\r\n\tconst [activeIndex, setActiveIndex] = useState<number>(0);\r\n\tconst centerDropTargetComponentRef = useRef(centerDropTargetComponent);\r\n\tconst initialCenterRef = useRef<DropTargetComponent[]>(\r\n\t\tinitialCenterComponents ?? [],\r\n\t);\r\n\r\n\tconst activeIndexRef = useRef(activeIndex);\r\n\tuseEffect(() => {\r\n\t\tconst storeKey = `${layoutName}=${screenKey}`;\r\n\r\n\t\tconst subscribe = getSplitScreen(rootName, storeKey)\r\n\t\t\t.pipe(take(1))\r\n\t\t\t.subscribe((layoutInfo) => {\r\n\t\t\t\tif (layoutInfo) return;\r\n\r\n\t\t\t\tsetSplitScreen(rootName, storeKey, {\r\n\t\t\t\t\tafterDropTargetComponent: [],\r\n\t\t\t\t\tbeforeDropTargetComponent: [],\r\n\t\t\t\t\tcenterDropTargetComponent: initialCenterRef.current,\r\n\t\t\t\t\tdirection,\r\n\t\t\t\t});\r\n\t\t\t});\r\n\t\treturn () => {\r\n\t\t\tremoveSplitScreenChild(rootName, `${layoutName}=${screenKey}`);\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [rootName, layoutName, screenKey]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscribe = getSplitScreen(rootName, `${layoutName}=${screenKey}`)\r\n\t\t\t//.pipe(take(1))\r\n\t\t\t.subscribe((layoutInfo) => {\r\n\t\t\t\tif (layoutInfo) {\r\n\t\t\t\t\t// console.log(\r\n\t\t\t\t\t// 'layoutInfo:::',\r\n\t\t\t\t\t// layoutInfo,\r\n\t\t\t\t\t// layoutName,\r\n\t\t\t\t\t// containerName\r\n\t\t\t\t\t// );\r\n\t\t\t\t\tsetBeforeDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.beforeDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetAfterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.afterDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetCenterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.centerDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetDirection(layoutInfo.direction);\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutInfo.beforeDropTargetComponent.length !== 0 ||\r\n\t\t\t\t\t\tlayoutInfo.afterDropTargetComponent.length !== 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t} else if (\r\n\t\t\t\t\t\tlayoutInfo.beforeDropTargetComponent.length === 0 &&\r\n\t\t\t\t\t\tlayoutInfo.centerDropTargetComponent.length === 0 &&\r\n\t\t\t\t\t\tlayoutInfo.afterDropTargetComponent.length === 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\t\t\ttargetParentLayoutName: \"\",\r\n\t\t\t\t\t\t\ttargetLayoutName: parentLayoutName,\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\tsetIsEmptyContent(true);\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t\tremoveRootSplitScreen(layoutName);\r\n\t\t};\r\n\t}, [rootName, layoutName]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscribe = dropMovementEventSubject\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged((prev, curr) => {\r\n\t\t\t\t\t// 이전 상태와 현재 상태를 비교하여 동일하면 필터링\r\n\t\t\t\t\tconst filterChildren = (obj: any) => {\r\n\t\t\t\t\t\t// 객체 복사 후 children 속성 제거\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tchildren,\r\n\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t...rest\r\n\t\t\t\t\t\t} = obj || {};\r\n\t\t\t\t\t\treturn rest;\r\n\t\t\t\t\t};\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((event) => {\r\n\t\t\t\tif (event.state === \"remove\") {\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tevent.targetParentLayoutName === layoutName ||\r\n\t\t\t\t\t\t(event.targetParentLayoutName === \"\" &&\r\n\t\t\t\t\t\t\tevent.targetLayoutName === layoutName)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\trequestAnimationFrame(() => {\r\n\t\t\t\t\t\t\tlet removeCallback = (\r\n\t\t\t\t\t\t\t\tremoveOrderName: DropPositionOrderName,\r\n\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t// removeSplitScreenChild(\r\n\t\t\t\t\t\t\t\t// rootName,\r\n\t\t\t\t\t\t\t\t// event.targetLayoutName\r\n\t\t\t\t\t\t\t\t// );\r\n\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\tevent.nextContainerName &&\r\n\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent &&\r\n\t\t\t\t\t\t\t\t\tevent.targetComponent\r\n\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\t\torderName: removeOrderName,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tdropComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.targetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.navigationTitle!,\r\n\t\t\t\t\t\t\t\t\t\t\tisUsePrefix: true,\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.screenKey,\r\n\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t...(getCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t\tconst currentComponents =\r\n\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst afterList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.afterDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"after\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst beforList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.beforeDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"before\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst centerList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.centerDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"center\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\tafterDropTargetComponent: afterList,\r\n\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent: beforList,\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent: centerList,\r\n\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t},\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} else if (event.state === \"append\") {\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\tx,\r\n\t\t\t\t\t\ty,\r\n\t\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\t\tdropTargetComponentEvent,\r\n\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\ttargetLayoutName,\r\n\t\t\t\t\t\ttargetParentLayoutName,\r\n\t\t\t\t\t\ttargetContainerName,\r\n\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\tnextContainerName,\r\n\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t} = event;\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutRef.current &&\r\n\t\t\t\t\t\torderName &&\r\n\t\t\t\t\t\tx &&\r\n\t\t\t\t\t\ty &&\r\n\t\t\t\t\t\tdropTargetComponentEvent &&\r\n\t\t\t\t\t\tisInnerDrop({ x, y, element: layoutRef.current })\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\tscreenKey: containerScreenKey,\r\n\t\t\t\t\t\t} = dropTargetComponentEvent;\r\n\r\n\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t//orderName !== 'center' &&\r\n\t\t\t\t\t\t\ttargetLayoutName === layoutName &&\r\n\t\t\t\t\t\t\ttargetComponent\r\n\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t//드래그앤드롭으로 추가되었을 때\r\n\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\tdropDirection === parentDirection &&\r\n\t\t\t\t\t\t\t\torderName !== \"center\"\r\n\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\t\t\t\t\ttargetContainerName: targetContainerName,\r\n\t\t\t\t\t\t\t\t\ttargetParentLayoutName: \"\",\r\n\t\t\t\t\t\t\t\t\ttargetLayoutName: parentLayoutName,\r\n\t\t\t\t\t\t\t\t\ttargetComponent: targetComponent,\r\n\t\t\t\t\t\t\t\t\tnextContainerName: containerName,\r\n\t\t\t\t\t\t\t\t\tparentOrderName:\r\n\t\t\t\t\t\t\t\t\t\tgetSelfOrderName(layoutName) ||\r\n\t\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\tdirection: parentDirection,\r\n\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\tif (orderName !== \"center\") {\r\n\t\t\t\t\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t\t\t\t\t\tcontainerName: targetContainerName,\r\n\t\t\t\t\t\t\t\t\t\tnextContainerName: nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\tdropComponent: targetComponent,\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tisUsePrefix: orderName !== \"center\",\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t...(getCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t\t...{ direction: dropDirection },\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t//else if (dropDirection === direction) {\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t//console.log('1111:::', layoutName, parentLayoutName, event);\r\n\t\t\t\t//setRemoveContainerName(event.targetContainerName);\r\n\t\t\t});\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [\r\n\t\tdirection,\r\n\t\tparentDirection,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t]);\r\n\r\n\tuseEffect(() => {\r\n\t\tcenterDropTargetComponentRef.current = centerDropTargetComponent;\r\n\t}, [centerDropTargetComponent]);\r\n\tuseEffect(() => {\r\n\t\tactiveIndexRef.current = activeIndex;\r\n\t}, [activeIndex]);\r\n\r\n\t// useEffect(() => {\r\n\t// const subscribe = getSplitScreen(\r\n\t// rootName,\r\n\t// `${layoutName}=${screenKey}`\r\n\t// ).subscribe(layoutInfo => {\r\n\t// if (\r\n\t// beforeDropTargetComponent.length === 0 &&\r\n\t// centerDropTargetComponent.length === 0 &&\r\n\t// afterDropTargetComponent.length === 0 &&\r\n\t// (layoutInfo?.beforeDropTargetComponent || []).length === 0 &&\r\n\t// (layoutInfo?.centerDropTargetComponent || []).length === 0 &&\r\n\t// (layoutInfo?.afterDropTargetComponent || []).length === 0\r\n\t// ) {\r\n\t// console.log(\r\n\t// 'remove ::: ',\r\n\t// parentLayoutName,\r\n\t// layoutName,\r\n\t// initialCenterComponents\r\n\t// );\r\n\t// dropMovementEventSubject.next({\r\n\t// state: 'remove',\r\n\t// targetContainerName: containerName,\r\n\t// targetParentLayoutName: '',\r\n\t// targetLayoutName: parentLayoutName,\r\n\t// });\r\n\t// setIsEmptyContent(true);\r\n\t// }\r\n\t// return () => {\r\n\t// subscribe.unsubscribe();\r\n\t// };\r\n\t// });\r\n\t// }, [\r\n\t// layoutName,\r\n\t// beforeDropTargetComponent,\r\n\t// afterDropTargetComponent,\r\n\t// centerDropTargetComponent,\r\n\t// ]);\r\n\tconst [isOnlyOneScreen, setIsOnlyOneScreen] = useState<boolean>(false);\r\n\t// useEffect(() => {\r\n\t// const subscribe = allSplitScreenCount.subscribe(allSplitScreenCount => {\r\n\t// setIsOnlyOneScreen(allSplitScreenCount === 1);\r\n\t// });\r\n\t// return () => subscribe.unsubscribe();\r\n\t// }, []);\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t{!isEmptyContent && (\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName={`${styles[\"flex-split-screen\"]}`}\r\n\t\t\t\t\tref={layoutRef}\r\n\t\t\t\t>\r\n\t\t\t\t\t<FlexLayout\r\n\t\t\t\t\t\tdirection={direction}\r\n\t\t\t\t\t\tlayoutName={`${layoutName}`}\r\n\t\t\t\t\t\tpanelMovementMode=\"bulldozer\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{beforeDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t\t{beforeDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\t\t\tisResizePanel\r\n\t\t\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_before-${depth}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tdepth={depth + 1}\r\n\t\t\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootRef={rootRef}\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName={rootName}\r\n\t\t\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<div></div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t{centerDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\tcontainerName={`${(centerDropTargetComponent[activeIndex] || centerDropTargetComponent[0]).containerName}`}\r\n\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\tisResizePanel={isSplit}\r\n\t\t\t\t\t\t\t\t\tkey={\r\n\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[\r\n\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex\r\n\t\t\t\t\t\t\t\t\t\t\t] || centerDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t).containerName\r\n\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t{isSplit ? (\r\n\t\t\t\t\t\t\t\t\t\t<div data-key={screenKey}>\r\n\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_center-${depth}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={`${(centerDropTargetComponent[activeIndex] || centerDropTargetComponent[0]).containerName}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tdepth={depth + 1}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootRef={rootRef}\r\n\t\t\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={centerDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterScreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t}) => ({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterScreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName={rootName}\r\n\t\t\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenScrollBox\r\n\t\t\t\t\t\t\t\t\t\t\tkeyName={\r\n\t\t\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t] ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t).containerName\r\n\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\tisDefaultScrollStyle={true}\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t{!isOnlyOneScreen && (\r\n\t\t\t\t\t\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-wrapper-sticky\"]}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-is_split={isSplit}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-layout_name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-parent_layout_name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-container_name={`${(centerDropTargetComponent[activeIndex] || centerDropTargetComponent[0]).containerName}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-wrapper\"]}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBoxContainer\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-layout_name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{centerDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBoxItem\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose={(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent.length ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropMovementEventSubject.next(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetParentLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent.length ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current +\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetActiveIndex(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current -\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetCenterDropTargetComponent(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst next =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\thandleRemove(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t() => {},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t// store도 같이 업데이트 (닫힌 탭의 ReactElement 참조를 store에서 제거)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst key = `${layoutName}=${screenKey}`;\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst current =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t};\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnext,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn next;\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.navigationTitle +\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName +\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisActive={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBox\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.screenKey\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetActiveIndex(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.dropDocumentOutsideOption\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetComponent={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.component\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.navigationTitle\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-container-name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-layout-name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-parent-layout-name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropEndCallback={({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tappendContainerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}) =>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//isDroppedInValidArea: boolean\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!rootRef.current ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!layoutRef.current\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst isRootOver =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisOverDrop(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\telement:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trootRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst isLayoutInner =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisInnerDrop(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\telement:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(!isRootOver &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!isLayoutInner) ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(!isRootOver &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisLayoutInner &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponentRef\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.current\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.length >\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst option =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{};\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponentRef\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.current\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.length >\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentIndex,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgetAdjacentItem(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponentRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//탭 이동이고 현재 활성화 된 탭인 경우우\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.component,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnextContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\torderName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"center\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropTargetComponentEvent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.navigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.dropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t0\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//이동하려는 탭이 첫번째일 때 (position = center)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropMovementEventSubject.next(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetParentLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//이동하려는 탭이 첫번째가 아닐 때 (position = center > center)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropMovementEventSubject.next(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetParentLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.navigationTitle\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenDragBox>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenDragBoxItem>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenDragBoxContainer>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBoxTitleMore></FlexLayoutSplitScreenDragBoxTitleMore>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t\t\t\t{(() => {\r\n\t\t\t\t\t\t\t\t\t\t\t\tconst target =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t] ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0];\r\n\t\t\t\t\t\t\t\t\t\t\t\treturn target.component;\r\n\t\t\t\t\t\t\t\t\t\t\t})()}\r\n\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenScrollBox>\r\n\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t\t\t\t</>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<div></div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t{afterDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t\t{afterDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\t\t\tisResizePanel={\r\n\t\t\t\t\t\t\t\t\t\t\t\ti !==\r\n\t\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent.length -\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_after-${depth}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tdepth={depth + 1}\r\n\t\t\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootRef={rootRef}\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName={rootName}\r\n\t\t\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<div></div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</FlexLayout>\r\n\t\t\t\t\t{boundaryContainerSize && (\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclassName={`${styles[\"flex-split-screen-boundary-container\"]}`}\r\n\t\t\t\t\t\t\tstyle={{ ...boundaryContainerSize }}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t⬇️드롭하면 화면이 분할됩니다.\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t)}\r\n\t\t</>\r\n\t);\r\n}\r\n"],"mappings":"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","names":["import_FlexLayout","children","equal","navigationTitle","dropDocumentOutsideOption","styles","FlexLayout","screenKey","FlexLayoutContainer","FlexLayoutSplitScreenScrollBox","FlexLayoutSplitScreenDragBoxContainer","FlexLayoutSplitScreenDragBoxItem","FlexLayoutSplitScreenDragBox","FlexLayoutSplitScreenDragBoxTitleMore"]}

package/dist/flex-layout/components/FlexLayoutSplitScreen.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreen.tsx"],"sourcesContent":["\"use client\";\r\nimport {\r\n\tcloneElement,\r\n\tReactElement,\r\n\tRefObject,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropPositionOrderName,\r\n\tDropTargetComponent,\r\n} from \"../hooks/useDrag\";\r\nimport { useFlexLayoutSplitScreen } from \"../hooks/useFlexLayoutSplitScreen\";\r\nimport {\r\n\tgetCurrentSplitScreenComponents,\r\n\tgetSplitScreen,\r\n\tremoveRootSplitScreen,\r\n\tremoveSplitScreenChild,\r\n\tresetRootSplitScreen,\r\n\tsetSplitScreen,\r\n} from \"../store/FlexLayoutContainerStore\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport FlexLayout from \"./FlexLayout\";\r\nimport FlexLayoutContainer from \"./FlexLayoutContainer\";\r\nimport FlexLayoutSplitScreenDragBox, {\r\n\tDropDocumentOutsideOption,\r\n} from \"./FlexLayoutSplitScreenDragBox\";\r\n\r\nimport equal from \"fast-deep-equal\";\r\nimport { distinctUntilChanged, take } from \"rxjs\";\r\nimport FlexLayoutSplitScreenDragBoxContainer from \"./FlexLayoutSplitScreenDragBoxContainer\";\r\nimport FlexLayoutSplitScreenDragBoxItem from \"./FlexLayoutSplitScreenDragBoxItem\";\r\nimport FlexLayoutSplitScreenDragBoxTitleMore from \"./FlexLayoutSplitScreenDragBoxTitleMore\";\r\nimport FlexLayoutSplitScreenScrollBox from \"./FlexLayoutSplitScreenScrollBox\";\r\n\r\nfunction isOverDrop({\r\n\tx,\r\n\ty,\r\n\telement,\r\n}: {\r\n\tx: number;\r\n\ty: number;\r\n\telement: HTMLDivElement;\r\n}) {\r\n\tconst {\r\n\t\tx: elementX,\r\n\t\ty: elementY,\r\n\t\tright: elementRight,\r\n\t\tbottom: elementBottom,\r\n\t} = element.getBoundingClientRect();\r\n\tconst isElementOver =\r\n\t\tx < elementX || x > elementRight || y < elementY || y > elementBottom;\r\n\treturn isElementOver;\r\n}\r\nfunction isInnerDrop({\r\n\tx,\r\n\ty,\r\n\telement,\r\n}: {\r\n\tx: number;\r\n\ty: number;\r\n\telement: HTMLDivElement;\r\n}) {\r\n\tconst {\r\n\t\tx: elementX,\r\n\t\ty: elementY,\r\n\t\tright: elementRight,\r\n\t\tbottom: elementBottom,\r\n\t} = element.getBoundingClientRect();\r\n\tconst isElementInner =\r\n\t\tx >= elementX &&\r\n\t\tx <= elementRight &&\r\n\t\ty >= elementY &&\r\n\t\ty <= elementBottom;\r\n\treturn isElementInner;\r\n}\r\n\r\nconst handleUpdateDropTargetComponents = ({\r\n\torderName,\r\n\tparentOrderName,\r\n\tcontainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n\tdropComponent,\r\n\tnavigationTitle,\r\n\tnextContainerName,\r\n\tisUsePrefix = true,\r\n\tbeforeDropTargetComponent,\r\n\tafterDropTargetComponent,\r\n\tcenterDropTargetComponent,\r\n\tdropDocumentOutsideOption,\r\n\tscreenKey = Array.from(\r\n\t\twindow.crypto.getRandomValues(new Uint32Array(16)),\r\n\t\t(e) => e.toString(32).padStart(2, \"0\"),\r\n\t).join(\"\"),\r\n}: {\r\n\torderName: DropPositionOrderName;\r\n\tparentOrderName?: DropPositionOrderName;\r\n\tcontainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n\tdropComponent: ReactElement;\r\n\tnavigationTitle?: string;\r\n\tnextContainerName?: string;\r\n\tisUsePrefix?: boolean;\r\n\tbeforeDropTargetComponent: DropTargetComponent[];\r\n\tafterDropTargetComponent: DropTargetComponent[];\r\n\tcenterDropTargetComponent: DropTargetComponent[];\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey?: string;\r\n}) => {\r\n\tconst nextContainerNameOrderName = parentOrderName\r\n\t\t? parentOrderName\r\n\t\t: orderName;\r\n\r\n\tlet listMap: Record<string, DropTargetComponent[]>;\r\n\tlet list: DropTargetComponent[];\r\n\tlet key: string;\r\n\tif (\r\n\t\tnextContainerNameOrderName === orderName ||\r\n\t\tnextContainerNameOrderName === \"center\"\r\n\t) {\r\n\t\tlistMap =\r\n\t\t\torderName === \"before\"\r\n\t\t\t\t? { beforeDropTargetComponent }\r\n\t\t\t\t: orderName === \"after\"\r\n\t\t\t\t\t? { afterDropTargetComponent }\r\n\t\t\t\t\t: {\r\n\t\t\t\t\t\t\tcenterDropTargetComponent:\r\n\t\t\t\t\t\t\t\tcenterDropTargetComponent.filter(\r\n\t\t\t\t\t\t\t\t\t(e) =>\r\n\t\t\t\t\t\t\t\t\t\t!e.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t.split(\"_\")\r\n\t\t\t\t\t\t\t\t\t\t\t.at(0)!\r\n\t\t\t\t\t\t\t\t\t\t\t.startsWith(\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName.split(\"_\").at(0)!,\r\n\t\t\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t};\r\n\t} else {\r\n\t\tlistMap =\r\n\t\t\tnextContainerNameOrderName === \"before\"\r\n\t\t\t\t? { beforeDropTargetComponent }\r\n\t\t\t\t: { afterDropTargetComponent };\r\n\t}\r\n\tconst entries = Object.entries(listMap)[0];\r\n\tkey = entries[0];\r\n\tlist = entries[1];\r\n\t/*\r\n nextContainerNameOrderName이 after고 orderName이 before면 setAfterDropTargetComponent에서 nextContainerName의 뒤에 넣는다.\r\n nextContainerNameOrderName이 before고 orderName이 after면 setBeforeDropTargetComponent에서 nextContainerName 앞에 넣는다. \r\n nextContainerNameOrderName이 center고 orderName이 after면 리스트의 첫번째에 넣는다.\r\n nextContainerNameOrderName이 center고 orderName이 before면 리스트의 마지막에 넣는다.\r\n nextContainerNameOrderName === orderName가 같고 orderName이 after나 center면 list에서 nextContainerName 앞에 넣는다.\r\n nextContainerNameOrderName === orderName가 같고 orderName이 before면 list에서 nextContainerName 뒤에 넣는다.\r\n */\r\n\r\n\tconst newComponent = {\r\n\t\tcontainerName: `${containerName + \"_\" + layoutName}${isUsePrefix ? \"_\" + orderName + \"-\" + list.length : \"\"}`,\r\n\t\tcomponent: cloneElement(\r\n\t\t\tdropComponent as ReactElement<{ screenKey: string }>,\r\n\t\t\t{ key: screenKey, screenKey },\r\n\t\t),\r\n\t\tnavigationTitle,\r\n\t\tdropDocumentOutsideOption,\r\n\t\tscreenKey:\r\n\t\t\tscreenKey ||\r\n\t\t\tArray.from(\r\n\t\t\t\twindow.crypto.getRandomValues(new Uint32Array(16)),\r\n\t\t\t\t(e) => e.toString(32).padStart(2, \"0\"),\r\n\t\t\t).join(\"\"),\r\n\t};\r\n\tlet allComponents;\r\n\r\n\tif (nextContainerName) {\r\n\t\t// nextContainerName이 존재할 때\r\n\t\tconst index = list.findIndex(\r\n\t\t\t(item) => item.containerName === nextContainerName,\r\n\t\t);\r\n\t\tif (index !== -1) {\r\n\t\t\tif (nextContainerNameOrderName === orderName) {\r\n\t\t\t\tif (orderName === \"before\") {\r\n\t\t\t\t\t// nextContainerNameOrderName === orderName가 같고\r\n\t\t\t\t\t// orderName이 before면 list에서 nextContainerName 뒤에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index),\r\n\t\t\t\t\t];\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// nextContainerNameOrderName === orderName가 같고\r\n\t\t\t\t\t// orderName이 after나 center면 list에서 nextContainerName 앞에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index + 1),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index + 1),\r\n\t\t\t\t\t];\r\n\t\t\t\t}\r\n\t\t\t} else {\r\n\t\t\t\tif (\r\n\t\t\t\t\tnextContainerNameOrderName === \"after\" &&\r\n\t\t\t\t\torderName === \"before\"\r\n\t\t\t\t) {\r\n\t\t\t\t\t// nextContainerNameOrderName이 after고 orderName이 before면\r\n\t\t\t\t\t// setAfterDropTargetComponent에서 nextContainerName의 뒤에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index),\r\n\t\t\t\t\t];\r\n\t\t\t\t} else if (\r\n\t\t\t\t\tnextContainerNameOrderName === \"before\" &&\r\n\t\t\t\t\torderName === \"after\"\r\n\t\t\t\t) {\r\n\t\t\t\t\t// nextContainerNameOrderName이 before고 orderName이 after면\r\n\t\t\t\t\t// setBeforeDropTargetComponent에서 nextContainerName 앞에 넣는다.\r\n\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t...list.slice(0, index + 1),\r\n\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t...list.slice(index + 1),\r\n\t\t\t\t\t];\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// 기타 경우 기존 로직 유지\r\n\t\t\t\t\tif (orderName === \"before\") {\r\n\t\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t\t...list.slice(0, index),\r\n\t\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t\t...list.slice(index),\r\n\t\t\t\t\t\t];\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tallComponents = [\r\n\t\t\t\t\t\t\t...list.slice(0, index + 1),\r\n\t\t\t\t\t\t\tnewComponent,\r\n\t\t\t\t\t\t\t...list.slice(index + 1),\r\n\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} else {\r\n\t\t\tif (\r\n\t\t\t\tnextContainerNameOrderName === \"center\" &&\r\n\t\t\t\torderName === \"after\"\r\n\t\t\t) {\r\n\t\t\t\t// nextContainerNameOrderName이 center고 orderName이 after면\r\n\t\t\t\t// setAfterDropTargetComponent에서 첫번째에 넣는다.\r\n\t\t\t\tallComponents = [newComponent, ...list];\r\n\t\t\t} else if (\r\n\t\t\t\tnextContainerNameOrderName === \"center\" &&\r\n\t\t\t\torderName === \"before\"\r\n\t\t\t) {\r\n\t\t\t\t// nextContainerNameOrderName이 center고 orderName이 before면\r\n\t\t\t\t// setBeforeDropTargetComponent에서 마지막에 넣는다.\r\n\r\n\t\t\t\tallComponents = [...list, newComponent];\r\n\t\t\t} else {\r\n\t\t\t\t// nextContainerName을 찾지 못했을 경우 기존 로직 유지\r\n\t\t\t\tallComponents =\r\n\t\t\t\t\torderName === \"before\"\r\n\t\t\t\t\t\t? [newComponent, ...list]\r\n\t\t\t\t\t\t: [...list, newComponent];\r\n\t\t\t}\r\n\t\t}\r\n\t} else {\r\n\t\t// nextContainerName이 존재하지 않을 때 기존 로직 유지\r\n\t\tallComponents =\r\n\t\t\torderName === \"before\"\r\n\t\t\t\t? [newComponent, ...list]\r\n\t\t\t\t: [...list, newComponent];\r\n\t}\r\n\r\n\tconst seen = new Set<string>();\r\n\r\n\tconst result = allComponents.filter((item) => {\r\n\t\tif (seen.has(item.containerName)) {\r\n\t\t\treturn false; // 이미 본 containerName은 제거\r\n\t\t}\r\n\t\tseen.add(item.containerName);\r\n\t\treturn true;\r\n\t});\r\n\tdropMovementEventSubject.next({\r\n\t\tstate: \"append\",\r\n\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\ttargetLayoutName: layoutName,\r\n\t\ttargetContainerName: containerName,\r\n\t\torderName: orderName,\r\n\t});\r\n\treturn { [key]: result };\r\n};\r\n\r\nconst handleRemove = (\r\n\tlist: DropTargetComponent[],\r\n\ttargetContainerName: string,\r\n\torderNameSetter: (removeCount: number) => void,\r\n) => {\r\n\tconst result = list.filter((e) => e.containerName !== targetContainerName);\r\n\tif (result.length != list.length)\r\n\t\torderNameSetter(list.length - result.length);\r\n\treturn result;\r\n};\r\n\r\nfunction getAdjacentItem<T>(items: T[], currentIndex: number) {\r\n\tif (currentIndex + 1 < items.length) {\r\n\t\treturn {\r\n\t\t\tadjacentItem: items[currentIndex + 1],\r\n\t\t\tadjacentIndex: currentIndex + 1,\r\n\t\t};\r\n\t} else if (currentIndex - 1 >= 0) {\r\n\t\treturn {\r\n\t\t\tadjacentItem: items[currentIndex - 1],\r\n\t\t\tadjacentIndex: currentIndex - 1,\r\n\t\t};\r\n\t}\r\n\treturn { adjacentItem: null, adjacentIndex: currentIndex };\r\n}\r\n\r\nconst getSelfOrderName = (\r\n\tcontainerName: string,\r\n): DropPositionOrderName | undefined => {\r\n\tconst result = containerName\r\n\t\t.split(\"_\")\r\n\t\t.at(-1)\r\n\t\t?.split(\"-\")\r\n\t\t.at(0)\r\n\t\t?.split(\"=\")\r\n\t\t.at(0);\r\n\tif ([\"before\", \"center\", \"after\"].some((e) => e === result)) {\r\n\t\treturn result as DropPositionOrderName;\r\n\t} else {\r\n\t\treturn;\r\n\t}\r\n};\r\n\r\nexport type FlexLayoutSplitScreenProps = {\r\n\tlayoutName: string;\r\n\tcontainerName: string;\r\n\tchildren: ReactElement; //ComponentType | ReactElement;\r\n\tnavigationTitle: string;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey?: string;\r\n};\r\n\r\nexport default function FlexLayoutSplitScreen({\r\n\tchildren,\r\n\tcontainerName,\r\n\tlayoutName,\r\n\tnavigationTitle,\r\n\tdropDocumentOutsideOption,\r\n\tscreenKey,\r\n}: FlexLayoutSplitScreenProps) {\r\n\tconst {\r\n\t\tdirection,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\tlayoutRef,\r\n\t\tsetIsSplit,\r\n\t\tsetDirection,\r\n\t} = useFlexLayoutSplitScreen({\r\n\t\tisSplitInitial: false,\r\n\t\tdirectionInitial: \"row\",\r\n\t\tselfContainerName: containerName,\r\n\t\tparentLayoutName: \"\",\r\n\t\tlayoutName: layoutName,\r\n\t});\r\n\r\n\tuseEffect(() => {\r\n\t\tresetRootSplitScreen(layoutName);\r\n\t\tconst subscribe = getSplitScreen(layoutName, layoutName)\r\n\t\t\t//.pipe(take(1))\r\n\t\t\t.subscribe((layoutInfo) => {\r\n\t\t\t\tif (layoutInfo) {\r\n\t\t\t\t\t// console.log(\r\n\t\t\t\t\t// 'layoutInfo:::',\r\n\t\t\t\t\t// layoutInfo,\r\n\t\t\t\t\t// layoutName,\r\n\t\t\t\t\t// containerName\r\n\t\t\t\t\t// );\r\n\t\t\t\t\tsetBeforeDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.beforeDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetAfterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.afterDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetCenterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.centerDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetDirection(layoutInfo.direction);\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutInfo.beforeDropTargetComponent.length !== 0 ||\r\n\t\t\t\t\t\tlayoutInfo.afterDropTargetComponent.length !== 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t}\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// const screenKey = Array.from(\r\n\t\t\t\t\t// window.crypto.getRandomValues(new Uint32Array(16)),\r\n\t\t\t\t\t// e => e.toString(32).padStart(2, '0')\r\n\t\t\t\t\t// ).join('');\r\n\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\tafterDropTargetComponent: [],\r\n\t\t\t\t\t\tbeforeDropTargetComponent: [],\r\n\t\t\t\t\t\tcenterDropTargetComponent: [\r\n\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\t\t\tcomponent: children,\r\n\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\tscreenKey: screenKey\r\n\t\t\t\t\t\t\t\t\t? screenKey\r\n\t\t\t\t\t\t\t\t\t: Array.from(\r\n\t\t\t\t\t\t\t\t\t\t\twindow.crypto.getRandomValues(\r\n\t\t\t\t\t\t\t\t\t\t\t\tnew Uint32Array(16),\r\n\t\t\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t\t\t\t(e) =>\r\n\t\t\t\t\t\t\t\t\t\t\t\te.toString(32).padStart(2, \"0\"),\r\n\t\t\t\t\t\t\t\t\t\t).join(\"\"),\r\n\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t],\r\n\t\t\t\t\t\tdirection: direction,\r\n\t\t\t\t\t});\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t\tremoveRootSplitScreen(layoutName);\r\n\t\t};\r\n\t}, [layoutName, screenKey, navigationTitle, children, direction]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscribe = dropMovementEventSubject\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged((prev, curr) => {\r\n\t\t\t\t\t// 이전 상태와 현재 상태를 비교하여 동일하면 필터링\r\n\t\t\t\t\tconst filterChildren = (obj: any) => {\r\n\t\t\t\t\t\t// 객체 복사 후 children 속성 제거\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tchildren,\r\n\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t...rest\r\n\t\t\t\t\t\t} = obj || {};\r\n\t\t\t\t\t\treturn rest;\r\n\t\t\t\t\t};\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((event) => {\r\n\t\t\t\tif (event.state === \"remove\") {\r\n\t\t\t\t\t// 렌더링 중에 바로 setRemoveContainerName을 호출하지 않고\r\n\t\t\t\t\t// requestAnimationFrame으로 감싸 렌더 후에 실행되도록 한다.\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tevent.targetParentLayoutName === layoutName ||\r\n\t\t\t\t\t\t(event.targetParentLayoutName === \"\" &&\r\n\t\t\t\t\t\t\tevent.targetLayoutName === layoutName)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\trequestAnimationFrame(() => {\r\n\t\t\t\t\t\t\tlet removeCallback = (\r\n\t\t\t\t\t\t\t\tremoveOrderName: DropPositionOrderName,\r\n\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t// removeSplitScreenChild(\r\n\t\t\t\t\t\t\t\t// layoutName,\r\n\t\t\t\t\t\t\t\t// event.targetLayoutName\r\n\t\t\t\t\t\t\t\t// );\r\n\t\t\t\t\t\t\t\t//탭 이동이고 현재 활성화 된 탭인 경우\r\n\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\tevent.nextContainerName &&\r\n\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent &&\r\n\t\t\t\t\t\t\t\t\tevent.targetComponent\r\n\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\t\torderName: removeOrderName,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\t\tparentLayoutName: \"\",\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tdropComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.targetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent!\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.navigationTitle!,\r\n\t\t\t\t\t\t\t\t\t\t\tisUsePrefix: true,\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.screenKey,\r\n\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\t\t\t\t\t...(getCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t\tconst currentComponents =\r\n\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst afterList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.afterDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"after\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst beforList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.beforeDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"before\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst centerList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.centerDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"center\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\t\t\tafterDropTargetComponent: afterList,\r\n\t\t\t\t\t\t\t\tbeforeDropTargetComponent: beforList,\r\n\t\t\t\t\t\t\t\tcenterDropTargetComponent: centerList,\r\n\t\t\t\t\t\t\t\tdirection,\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} else if (event.state === \"append\") {\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\tx,\r\n\t\t\t\t\t\ty,\r\n\t\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\t\tdropTargetComponentEvent,\r\n\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t\ttargetLayoutName,\r\n\t\t\t\t\t\ttargetParentLayoutName,\r\n\t\t\t\t\t\ttargetContainerName,\r\n\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\tnextContainerName,\r\n\t\t\t\t\t} = event;\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutRef.current &&\r\n\t\t\t\t\t\torderName &&\r\n\t\t\t\t\t\tx &&\r\n\t\t\t\t\t\ty &&\r\n\t\t\t\t\t\ttargetComponent &&\r\n\t\t\t\t\t\tdropTargetComponentEvent &&\r\n\t\t\t\t\t\ttargetLayoutName === layoutName &&\r\n\t\t\t\t\t\tisInnerDrop({ x, y, element: layoutRef.current })\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t} = dropTargetComponentEvent;\r\n\r\n\t\t\t\t\t\tconst isOrderNameNotCenter = orderName !== \"center\";\r\n\t\t\t\t\t\tconst isOrderNameCenterAndFirstScreen =\r\n\t\t\t\t\t\t\torderName === \"center\" &&\r\n\t\t\t\t\t\t\tcenterDropTargetComponent.length <= 1;\r\n\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\tisOrderNameNotCenter ||\r\n\t\t\t\t\t\t\tisOrderNameCenterAndFirstScreen\r\n\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t\t\tif (isOrderNameNotCenter) {\r\n\t\t\t\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t\t\t\t\t\tcontainerName: targetContainerName,\r\n\t\t\t\t\t\t\t\t\t\tnextContainerName: nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\tdropComponent: targetComponent,\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName: \"\",\r\n\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tisUsePrefix: true,\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t});\r\n\r\n\t\t\t\t\t\t\t\tsetSplitScreen(layoutName, layoutName, {\r\n\t\t\t\t\t\t\t\t\t...{\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t...{ direction: dropDirection },\r\n\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\tdropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\tdropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\tconst childScreenInfo =\r\n\t\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t`${layoutName}_center=${centerDropTargetComponent[0].screenKey}`,\r\n\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent: [],\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent: [],\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent: [],\r\n\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t`${layoutName}_center=${centerDropTargetComponent[0].screenKey}`,\r\n\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t...childScreenInfo,\r\n\t\t\t\t\t\t\t\t\t\t...{\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent: [\r\n\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0],\r\n\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: `${targetContainerName}_${layoutName}_${orderName}`,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent: targetComponent!,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropTargetComponentEvent.screenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t],\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t);\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}\r\n\t\t\t});\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [\r\n\t\tdirection,\r\n\t\tlayoutName,\r\n\t\tisSplit,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t]);\r\n\r\n\treturn (\r\n\t\t<div className={`${styles[\"flex-split-screen\"]}`} ref={layoutRef}>\r\n\t\t\t<FlexLayout\r\n\t\t\t\tdirection={direction}\r\n\t\t\t\tlayoutName={layoutName}\r\n\t\t\t\tdata-is_split={isSplit}\r\n\t\t\t\tpanelMovementMode=\"bulldozer\"\r\n\t\t\t>\r\n\t\t\t\t{beforeDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t<>\r\n\t\t\t\t\t\t{beforeDropTargetComponent.map(\r\n\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\tisResizePanel\r\n\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_before`}\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\tdepth={1}\r\n\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\trootRef={layoutRef}\r\n\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\trootName={layoutName}\r\n\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t</FlexLayoutContainer>\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) : (\r\n\t\t\t\t\t<div></div>\r\n\t\t\t\t)}\r\n\t\t\t\t{centerDropTargetComponent.length === 0 ? (\r\n\t\t\t\t\t<div></div>\r\n\t\t\t\t) : (\r\n\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\tcontainerName={`${centerDropTargetComponent[0].containerName}`}\r\n\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\tisResizePanel={isSplit}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{isSplit ? (\r\n\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_center`}\r\n\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\tcontainerName={`${centerDropTargetComponent[0].containerName}`}\r\n\t\t\t\t\t\t\t\tdepth={0}\r\n\t\t\t\t\t\t\t\trootRef={layoutRef}\r\n\t\t\t\t\t\t\t\tscreenKey={\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0].screenKey\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.navigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tcomponent:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.component,\r\n\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.containerName,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.dropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t.screenKey,\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\trootName={layoutName}\r\n\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<FlexLayoutSplitScreenScrollBox\r\n\t\t\t\t\t\t\t\tkeyName={\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0].containerName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\tisDefaultScrollStyle={true}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{centerDropTargetComponent[0].component}\r\n\t\t\t\t\t\t\t</FlexLayoutSplitScreenScrollBox>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t)}\r\n\t\t\t\t{afterDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t<>\r\n\t\t\t\t\t\t{afterDropTargetComponent.map(\r\n\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\tisResizePanel={\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent.length - 1 !==\r\n\t\t\t\t\t\t\t\t\t\ti\r\n\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_after`}\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\tdepth={1}\r\n\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\trootRef={layoutRef}\r\n\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\trootName={layoutName}\r\n\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t</FlexLayoutContainer>\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) : (\r\n\t\t\t\t\t<div></div>\r\n\t\t\t\t)}\r\n\t\t\t</FlexLayout>\r\n\t\t\t{boundaryContainerSize && (\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName={`${styles[\"flex-split-screen-boundary-container\"]}`}\r\n\t\t\t\t\tstyle={{ ...boundaryContainerSize }}\r\n\t\t\t\t>\r\n\t\t\t\t\t⬇️드롭하면 화면이 분할됩니다.\r\n\t\t\t\t</div>\r\n\t\t\t)}\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nfunction FlexLayoutSplitScreenChild({\r\n\tcontainerName,\r\n\tlayoutName,\r\n\tparentLayoutName,\r\n\tparentDirection,\r\n\tdepth,\r\n\t//isSplit: isSplitInitial,\r\n\trootRef,\r\n\trootName,\r\n\tinitialCenterComponents,\r\n\tscreenKey,\r\n}: {\r\n\tlayoutName: string;\r\n\tparentLayoutName: string;\r\n\tcontainerName: string;\r\n\tparentDirection: \"row\" | \"column\";\r\n\tdepth: number;\r\n\t//isSplit: boolean;\r\n\trootRef: RefObject<HTMLDivElement | null>;\r\n\trootName: string;\r\n\tinitialCenterComponents?: DropTargetComponent[];\r\n\tscreenKey: string;\r\n}) {\r\n\t// const memoizedChildren = useMemo(\r\n\t// () => <MemoizedChildren>{children}</MemoizedChildren>,\r\n\t// [children]\r\n\t// );\r\n\tconst {\r\n\t\tdirection,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\tlayoutRef,\r\n\t\tsetIsSplit,\r\n\t\tsetDirection,\r\n\t} = useFlexLayoutSplitScreen({\r\n\t\tisSplitInitial: false,\r\n\t\tdirectionInitial: \"row\",\r\n\t\tparentDirection,\r\n\t\tselfContainerName: containerName,\r\n\t\tparentLayoutName: parentLayoutName,\r\n\t\tlayoutName: layoutName,\r\n\t});\r\n\r\n\tconst [isEmptyContent, setIsEmptyContent] = useState<boolean>(false);\r\n\tconst [activeIndex, setActiveIndex] = useState<number>(0);\r\n\tconst centerDropTargetComponentRef = useRef(centerDropTargetComponent);\r\n\tconst initialCenterRef = useRef<DropTargetComponent[]>(\r\n\t\tinitialCenterComponents ?? [],\r\n\t);\r\n\r\n\tconst activeIndexRef = useRef(activeIndex);\r\n\tuseEffect(() => {\r\n\t\tconst storeKey = `${layoutName}=${screenKey}`;\r\n\r\n\t\tconst subscribe = getSplitScreen(rootName, storeKey)\r\n\t\t\t.pipe(take(1))\r\n\t\t\t.subscribe((layoutInfo) => {\r\n\t\t\t\tif (layoutInfo) return;\r\n\r\n\t\t\t\tsetSplitScreen(rootName, storeKey, {\r\n\t\t\t\t\tafterDropTargetComponent: [],\r\n\t\t\t\t\tbeforeDropTargetComponent: [],\r\n\t\t\t\t\tcenterDropTargetComponent: initialCenterRef.current,\r\n\t\t\t\t\tdirection,\r\n\t\t\t\t});\r\n\t\t\t});\r\n\t\treturn () => {\r\n\t\t\tremoveSplitScreenChild(rootName, `${layoutName}=${screenKey}`);\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [rootName, layoutName, screenKey]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscribe = getSplitScreen(rootName, `${layoutName}=${screenKey}`)\r\n\t\t\t//.pipe(take(1))\r\n\t\t\t.subscribe((layoutInfo) => {\r\n\t\t\t\tif (layoutInfo) {\r\n\t\t\t\t\t// console.log(\r\n\t\t\t\t\t// 'layoutInfo:::',\r\n\t\t\t\t\t// layoutInfo,\r\n\t\t\t\t\t// layoutName,\r\n\t\t\t\t\t// containerName\r\n\t\t\t\t\t// );\r\n\t\t\t\t\tsetBeforeDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.beforeDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetAfterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.afterDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetCenterDropTargetComponent([\r\n\t\t\t\t\t\t...layoutInfo.centerDropTargetComponent,\r\n\t\t\t\t\t]);\r\n\t\t\t\t\tsetDirection(layoutInfo.direction);\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutInfo.beforeDropTargetComponent.length !== 0 ||\r\n\t\t\t\t\t\tlayoutInfo.afterDropTargetComponent.length !== 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t} else if (\r\n\t\t\t\t\t\tlayoutInfo.beforeDropTargetComponent.length === 0 &&\r\n\t\t\t\t\t\tlayoutInfo.centerDropTargetComponent.length === 0 &&\r\n\t\t\t\t\t\tlayoutInfo.afterDropTargetComponent.length === 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\t\t\ttargetParentLayoutName: \"\",\r\n\t\t\t\t\t\t\ttargetLayoutName: parentLayoutName,\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\tsetIsEmptyContent(true);\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t\tremoveRootSplitScreen(layoutName);\r\n\t\t};\r\n\t}, [rootName, layoutName]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscribe = dropMovementEventSubject\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged((prev, curr) => {\r\n\t\t\t\t\t// 이전 상태와 현재 상태를 비교하여 동일하면 필터링\r\n\t\t\t\t\tconst filterChildren = (obj: any) => {\r\n\t\t\t\t\t\t// 객체 복사 후 children 속성 제거\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tchildren,\r\n\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t...rest\r\n\t\t\t\t\t\t} = obj || {};\r\n\t\t\t\t\t\treturn rest;\r\n\t\t\t\t\t};\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((event) => {\r\n\t\t\t\tif (event.state === \"remove\") {\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tevent.targetParentLayoutName === layoutName ||\r\n\t\t\t\t\t\t(event.targetParentLayoutName === \"\" &&\r\n\t\t\t\t\t\t\tevent.targetLayoutName === layoutName)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\trequestAnimationFrame(() => {\r\n\t\t\t\t\t\t\tlet removeCallback = (\r\n\t\t\t\t\t\t\t\tremoveOrderName: DropPositionOrderName,\r\n\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t// removeSplitScreenChild(\r\n\t\t\t\t\t\t\t\t// rootName,\r\n\t\t\t\t\t\t\t\t// event.targetLayoutName\r\n\t\t\t\t\t\t\t\t// );\r\n\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\tevent.nextContainerName &&\r\n\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent &&\r\n\t\t\t\t\t\t\t\t\tevent.targetComponent\r\n\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\t\torderName: removeOrderName,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\tdropComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.targetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.navigationTitle!,\r\n\t\t\t\t\t\t\t\t\t\t\tisUsePrefix: true,\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\tevent.dropTargetComponentEvent\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t.screenKey,\r\n\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t...(getCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t\tconst currentComponents =\r\n\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst afterList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.afterDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"after\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst beforList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.beforeDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"before\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tconst centerList = handleRemove(\r\n\t\t\t\t\t\t\t\tcurrentComponents?.centerDropTargetComponent ||\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\tevent.targetContainerName,\r\n\t\t\t\t\t\t\t\t() => removeCallback(\"center\"),\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\tafterDropTargetComponent: afterList,\r\n\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent: beforList,\r\n\t\t\t\t\t\t\t\t\tcenterDropTargetComponent: centerList,\r\n\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t},\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} else if (event.state === \"append\") {\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\tx,\r\n\t\t\t\t\t\ty,\r\n\t\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\t\tdropTargetComponentEvent,\r\n\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\ttargetLayoutName,\r\n\t\t\t\t\t\ttargetParentLayoutName,\r\n\t\t\t\t\t\ttargetContainerName,\r\n\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\tnextContainerName,\r\n\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t} = event;\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tlayoutRef.current &&\r\n\t\t\t\t\t\torderName &&\r\n\t\t\t\t\t\tx &&\r\n\t\t\t\t\t\ty &&\r\n\t\t\t\t\t\tdropTargetComponentEvent &&\r\n\t\t\t\t\t\tisInnerDrop({ x, y, element: layoutRef.current })\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\tscreenKey: containerScreenKey,\r\n\t\t\t\t\t\t} = dropTargetComponentEvent;\r\n\r\n\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t//orderName !== 'center' &&\r\n\t\t\t\t\t\t\ttargetLayoutName === layoutName &&\r\n\t\t\t\t\t\t\ttargetComponent\r\n\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t//드래그앤드롭으로 추가되었을 때\r\n\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\tdropDirection === parentDirection &&\r\n\t\t\t\t\t\t\t\torderName !== \"center\"\r\n\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\t\t\t\t\ttargetContainerName: targetContainerName,\r\n\t\t\t\t\t\t\t\t\ttargetParentLayoutName: \"\",\r\n\t\t\t\t\t\t\t\t\ttargetLayoutName: parentLayoutName,\r\n\t\t\t\t\t\t\t\t\ttargetComponent: targetComponent,\r\n\t\t\t\t\t\t\t\t\tnextContainerName: containerName,\r\n\t\t\t\t\t\t\t\t\tparentOrderName:\r\n\t\t\t\t\t\t\t\t\t\tgetSelfOrderName(layoutName) ||\r\n\t\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\tdirection: parentDirection,\r\n\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\tif (orderName !== \"center\") {\r\n\t\t\t\t\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\tconst targetComponentsMap =\r\n\t\t\t\t\t\t\t\t\thandleUpdateDropTargetComponents({\r\n\t\t\t\t\t\t\t\t\t\torderName,\r\n\t\t\t\t\t\t\t\t\t\tparentOrderName,\r\n\t\t\t\t\t\t\t\t\t\tcontainerName: targetContainerName,\r\n\t\t\t\t\t\t\t\t\t\tnextContainerName: nextContainerName,\r\n\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\tdropComponent: targetComponent,\r\n\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\tisUsePrefix: orderName !== \"center\",\r\n\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t...(getCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t`${layoutName}=${screenKey}`,\r\n\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t...targetComponentsMap,\r\n\t\t\t\t\t\t\t\t\t\t...{ direction: dropDirection },\r\n\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tPromise.resolve().then(\r\n\t\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback &&\r\n\t\t\t\t\t\t\t\t\t\tevent.dropEndCallback({\r\n\t\t\t\t\t\t\t\t\t\t\tx: event.x!,\r\n\t\t\t\t\t\t\t\t\t\t\ty: event.y!,\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: containerName,\r\n\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t//else if (dropDirection === direction) {\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t//console.log('1111:::', layoutName, parentLayoutName, event);\r\n\t\t\t\t//setRemoveContainerName(event.targetContainerName);\r\n\t\t\t});\r\n\t\treturn () => {\r\n\t\t\tsubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [\r\n\t\tdirection,\r\n\t\tparentDirection,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tcenterDropTargetComponent,\r\n\t]);\r\n\r\n\tuseEffect(() => {\r\n\t\tcenterDropTargetComponentRef.current = centerDropTargetComponent;\r\n\t}, [centerDropTargetComponent]);\r\n\tuseEffect(() => {\r\n\t\tactiveIndexRef.current = activeIndex;\r\n\t}, [activeIndex]);\r\n\r\n\t// useEffect(() => {\r\n\t// const subscribe = getSplitScreen(\r\n\t// rootName,\r\n\t// `${layoutName}=${screenKey}`\r\n\t// ).subscribe(layoutInfo => {\r\n\t// if (\r\n\t// beforeDropTargetComponent.length === 0 &&\r\n\t// centerDropTargetComponent.length === 0 &&\r\n\t// afterDropTargetComponent.length === 0 &&\r\n\t// (layoutInfo?.beforeDropTargetComponent || []).length === 0 &&\r\n\t// (layoutInfo?.centerDropTargetComponent || []).length === 0 &&\r\n\t// (layoutInfo?.afterDropTargetComponent || []).length === 0\r\n\t// ) {\r\n\t// console.log(\r\n\t// 'remove ::: ',\r\n\t// parentLayoutName,\r\n\t// layoutName,\r\n\t// initialCenterComponents\r\n\t// );\r\n\t// dropMovementEventSubject.next({\r\n\t// state: 'remove',\r\n\t// targetContainerName: containerName,\r\n\t// targetParentLayoutName: '',\r\n\t// targetLayoutName: parentLayoutName,\r\n\t// });\r\n\t// setIsEmptyContent(true);\r\n\t// }\r\n\t// return () => {\r\n\t// subscribe.unsubscribe();\r\n\t// };\r\n\t// });\r\n\t// }, [\r\n\t// layoutName,\r\n\t// beforeDropTargetComponent,\r\n\t// afterDropTargetComponent,\r\n\t// centerDropTargetComponent,\r\n\t// ]);\r\n\tconst [isOnlyOneScreen, setIsOnlyOneScreen] = useState<boolean>(false);\r\n\t// useEffect(() => {\r\n\t// const subscribe = allSplitScreenCount.subscribe(allSplitScreenCount => {\r\n\t// setIsOnlyOneScreen(allSplitScreenCount === 1);\r\n\t// });\r\n\t// return () => subscribe.unsubscribe();\r\n\t// }, []);\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t{!isEmptyContent && (\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName={`${styles[\"flex-split-screen\"]}`}\r\n\t\t\t\t\tref={layoutRef}\r\n\t\t\t\t>\r\n\t\t\t\t\t<FlexLayout\r\n\t\t\t\t\t\tdirection={direction}\r\n\t\t\t\t\t\tlayoutName={`${layoutName}`}\r\n\t\t\t\t\t\tpanelMovementMode=\"bulldozer\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{beforeDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t\t{beforeDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\t\t\tisResizePanel\r\n\t\t\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_before-${depth}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tdepth={depth + 1}\r\n\t\t\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootRef={rootRef}\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName={rootName}\r\n\t\t\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<div></div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t{centerDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\tcontainerName={`${(centerDropTargetComponent[activeIndex] || centerDropTargetComponent[0]).containerName}`}\r\n\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\tisResizePanel={isSplit}\r\n\t\t\t\t\t\t\t\t\tkey={\r\n\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[\r\n\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex\r\n\t\t\t\t\t\t\t\t\t\t\t] || centerDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t).containerName\r\n\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t{isSplit ? (\r\n\t\t\t\t\t\t\t\t\t\t<div data-key={screenKey}>\r\n\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_center-${depth}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={`${(centerDropTargetComponent[activeIndex] || centerDropTargetComponent[0]).containerName}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tdepth={depth + 1}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootRef={rootRef}\r\n\t\t\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={centerDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterScreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t}) => ({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterScreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t}),\r\n\t\t\t\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName={rootName}\r\n\t\t\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenScrollBox\r\n\t\t\t\t\t\t\t\t\t\t\tkeyName={\r\n\t\t\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t] ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0]\r\n\t\t\t\t\t\t\t\t\t\t\t\t).containerName\r\n\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\tisDefaultScrollStyle={true}\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t{!isOnlyOneScreen && (\r\n\t\t\t\t\t\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-wrapper-sticky\"]}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-is_split={isSplit}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-layout_name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-parent_layout_name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-container_name={`${(centerDropTargetComponent[activeIndex] || centerDropTargetComponent[0]).containerName}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-wrapper\"]}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBoxContainer\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-layout_name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{centerDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBoxItem\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose={(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent.length ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropMovementEventSubject.next(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetParentLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent.length ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current +\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetActiveIndex(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current -\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetCenterDropTargetComponent(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) => {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst next =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\thandleRemove(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t() => {},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t// store도 같이 업데이트 (닫힌 탭의 ReactElement 참조를 store에서 제거)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst key = `${layoutName}=${screenKey}`;\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst current =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgetCurrentSplitScreenComponents(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) || {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbeforeDropTargetComponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprev,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t};\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetSplitScreen(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trootName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnext,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn next;\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.navigationTitle +\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName +\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisActive={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBox\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.screenKey\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetActiveIndex(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.dropDocumentOutsideOption\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetComponent={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.component\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.navigationTitle\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-container-name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-layout-name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-parent-layout-name={\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropEndCallback={({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tappendContainerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}) =>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//isDroppedInValidArea: boolean\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!rootRef.current ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!layoutRef.current\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst isRootOver =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisOverDrop(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\telement:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trootRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst isLayoutInner =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisInnerDrop(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\telement:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(!isRootOver &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!isLayoutInner) ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(!isRootOver &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisLayoutInner &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponentRef\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.current\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.length >\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst option =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{};\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponentRef\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.current\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.length >\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentIndex,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgetAdjacentItem(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponentRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem &&\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndexRef.current ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//탭 이동이고 현재 활성화 된 탭인 경우우\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetComponent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.component,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnextContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\torderName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"center\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropTargetComponentEvent:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.navigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tadjacentItem.dropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex ===\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t0\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//이동하려는 탭이 첫번째일 때 (position = center)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropMovementEventSubject.next(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetParentLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t//이동하려는 탭이 첫번째가 아닐 때 (position = center > center)\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropMovementEventSubject.next(\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstate: \"remove\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetContainerName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.containerName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetParentLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttargetLayoutName:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlayoutName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.navigationTitle\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenDragBox>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenDragBoxItem>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenDragBoxContainer>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenDragBoxTitleMore></FlexLayoutSplitScreenDragBoxTitleMore>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t\t\t\t{(() => {\r\n\t\t\t\t\t\t\t\t\t\t\t\tconst target =\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveIndex\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t] ||\r\n\t\t\t\t\t\t\t\t\t\t\t\t\tcenterDropTargetComponent[0];\r\n\t\t\t\t\t\t\t\t\t\t\t\treturn target.component;\r\n\t\t\t\t\t\t\t\t\t\t\t})()}\r\n\t\t\t\t\t\t\t\t\t\t</FlexLayoutSplitScreenScrollBox>\r\n\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t\t\t\t</>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<div></div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t{afterDropTargetComponent.length != 0 ? (\r\n\t\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t\t{afterDropTargetComponent.map(\r\n\t\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t\t\t) => (\r\n\t\t\t\t\t\t\t\t\t\t<FlexLayoutContainer\r\n\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\tisInitialResizable\r\n\t\t\t\t\t\t\t\t\t\t\tisResizePanel={\r\n\t\t\t\t\t\t\t\t\t\t\t\ti !==\r\n\t\t\t\t\t\t\t\t\t\t\t\tafterDropTargetComponent.length -\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t1\r\n\t\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t\tkey={cName}\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t<FlexLayoutSplitScreenChild\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentDirection={direction}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlayoutName={`${layoutName}_after-${depth}`}\r\n\t\t\t\t\t\t\t\t\t\t\t\tparentLayoutName={layoutName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tcontainerName={cName}\r\n\t\t\t\t\t\t\t\t\t\t\t\tdepth={depth + 1}\r\n\t\t\t\t\t\t\t\t\t\t\t\t//isSplit={isSplit}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootRef={rootRef}\r\n\t\t\t\t\t\t\t\t\t\t\t\tscreenKey={screenKey}\r\n\t\t\t\t\t\t\t\t\t\t\t\tinitialCenterComponents={[\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcomponent,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontainerName: cName,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t\t\t\t\t\t\t]}\r\n\t\t\t\t\t\t\t\t\t\t\t\trootName={rootName}\r\n\t\t\t\t\t\t\t\t\t\t\t></FlexLayoutSplitScreenChild>\r\n\t\t\t\t\t\t\t\t\t\t</FlexLayoutContainer>\r\n\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<div></div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</FlexLayout>\r\n\t\t\t\t\t{boundaryContainerSize && (\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclassName={`${styles[\"flex-split-screen-boundary-container\"]}`}\r\n\t\t\t\t\t\t\tstyle={{ ...boundaryContainerSize }}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t⬇️드롭하면 화면이 분할됩니다.\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t)}\r\n\t\t</>\r\n\t);\r\n}\r\n"],"mappings":"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","names":["children","navigationTitle","dropDocumentOutsideOption","screenKey"]}

package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBox.tsx"],"sourcesContent":["\"use client\";\r\nimport {\r\n\tCSSProperties,\r\n\tHTMLAttributes,\r\n\tMouseEvent,\r\n\tReactElement,\r\n\tReactNode,\r\n\tRefObject,\r\n\tTouchEvent,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport {\r\n\tdragStateSubject,\r\n\tDragStateType,\r\n\tuseDragEvents,\r\n} from \"../hooks/useDrag\";\r\n\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport { isDocumentOut } from \"../utils/FlexLayoutUtils\";\r\nimport { FlexLayoutIFramePane } from \"./FlexLayoutIFramePane\";\r\n\r\nconst MAX_STEP = 18;\r\n\r\nfunction shouldAllowViewportScroll(x: number, y: number) {\r\n\tconst w = window.innerWidth;\r\n\tconst h = window.innerHeight;\r\n\tconst marginX = w * 0.15;\r\n\tconst marginY = h * 0.15;\r\n\treturn (\r\n\t\tx < marginX || // 왼쪽 15 %\r\n\t\tx > w - marginX || // 오른쪽 15 %\r\n\t\ty < marginY || // 상단 15 %\r\n\t\ty > h - marginY // 하단 15 %\r\n\t);\r\n}\r\n\r\nfunction edgeVelocity(x: number, y: number) {\r\n\tconst w = window.innerWidth,\r\n\t\th = window.innerHeight;\r\n\tconst mx = w * 0.15,\r\n\t\tmy = h * 0.15;\r\n\r\n\t/* X 축 */\r\n\tlet vx = 0;\r\n\tif (x < mx)\r\n\t\t// ← 왼쪽\r\n\t\tvx = -((mx - x) / mx) * MAX_STEP;\r\n\telse if (x > w - mx)\r\n\t\t// → 오른쪽\r\n\t\tvx = ((x - (w - mx)) / mx) * MAX_STEP;\r\n\r\n\t/* Y 축 */\r\n\tlet vy = 0;\r\n\tif (y < my)\r\n\t\t// ↑ 상단\r\n\t\tvy = -((my - y) / my) * MAX_STEP;\r\n\telse if (y > h - my)\r\n\t\t// ↓ 하단\r\n\t\tvy = ((y - (h - my)) / my) * MAX_STEP;\r\n\r\n\treturn { vx, vy };\r\n}\r\n\r\nfunction calcVelocity(dx: number, dy: number, x: number, y: number) {\r\n\tconst w = window.innerWidth,\r\n\t\th = window.innerHeight;\r\n\tconst marginX = w * 0.15,\r\n\t\tmarginY = h * 0.15;\r\n\r\n\t/* 거리가 0(가장자리)~margin 사이면 1~4 배 가중치 */\r\n\tconst multX =\r\n\t\tx < marginX\r\n\t\t\t? 1 + ((marginX - x) / marginX) * 3\r\n\t\t\t: x > w - marginX\r\n\t\t\t\t? 1 + ((x - (w - marginX)) / marginX) * 3\r\n\t\t\t\t: 1;\r\n\r\n\tconst multY =\r\n\t\ty < marginY\r\n\t\t\t? 1 + ((marginY - y) / marginY) * 3\r\n\t\t\t: y > h - marginY\r\n\t\t\t\t? 1 + ((y - (h - marginY)) / marginY) * 3\r\n\t\t\t\t: 1;\r\n\r\n\t/* ←→·↑↓ **반대 방향**으로 스크롤 */\r\n\treturn { vx: -dx * multX, vy: -dy * multY };\r\n}\r\n\r\nfunction createScreenKey() {\r\n\tconst c = globalThis.crypto as Crypto | undefined;\r\n\r\n\tif (c?.randomUUID) return c.randomUUID();\r\n\r\n\tif (c?.getRandomValues) {\r\n\t\treturn Array.from(c.getRandomValues(new Uint32Array(16)), (e) =>\r\n\t\t\te.toString(32).padStart(2, \"0\"),\r\n\t\t).join(\"\");\r\n\t}\r\n\r\n\t// 폴백\r\n\treturn `${Date.now().toString(32)}-${Math.random().toString(32).slice(2)}`;\r\n}\r\n\r\nfunction getFallbackElement(targetComponent?: ReactElement, url?: string) {\r\n\tif (targetComponent) return targetComponent;\r\n\tif (url) return <FlexLayoutIFramePane url={url} />;\r\n\treturn undefined;\r\n}\r\n\r\nfunction titleFromUrl(url?: string) {\r\n\tif (!url) return undefined;\r\n\ttry {\r\n\t\tconst u = new URL(url);\r\n\t\treturn u.hostname;\r\n\t} catch {\r\n\t\treturn url;\r\n\t}\r\n}\r\n\r\nexport interface FlexLayoutSplitScreenDragBoxProps<\r\n\tE extends HTMLElement = HTMLElement,\r\n> extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\r\n\tonMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;\r\n\tonTouchStart?: (event: TouchEvent<HTMLDivElement>) => void;\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\tstyle?: CSSProperties;\r\n\tnavigationTitle?: string;\r\n\ttargetComponent?: ReactElement;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tchildren: ReactNode;\r\n\tcontainerName: string;\r\n\tscreenKey?: string;\r\n\tisBlockingActiveInput?: boolean;\r\n\tcustomData?: Record<string, string | number | boolean | undefined>;\r\n\tscrollTargetRef?: RefObject<E>;\r\n}\r\n\r\nexport interface DropDocumentOutsideOption {\r\n\topenUrl: string;\r\n\twidthRatio?: number;\r\n\theightRatio?: number;\r\n\tisNewTap?: boolean;\r\n}\r\n\r\nexport default function FlexLayoutSplitScreenDragBox<E extends HTMLElement>({\r\n\tonMouseDown,\r\n\tonTouchStart,\r\n\tdropEndCallback,\r\n\tstyle,\r\n\tnavigationTitle,\r\n\ttargetComponent,\r\n\tcontainerName,\r\n\tchildren,\r\n\tclassName,\r\n\tdropDocumentOutsideOption,\r\n\tscreenKey: _screenKey,\r\n\tisBlockingActiveInput = false,\r\n\tcustomData = {},\r\n\tscrollTargetRef,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxProps) {\r\n\tconst [screenKey, setScreenKey] = useState<string>();\r\n\tuseEffect(() => {\r\n\t\tif (!_screenKey) setScreenKey(createScreenKey());\r\n\t\telse setScreenKey(_screenKey);\r\n\t}, [_screenKey]);\r\n\tconst scrollRAF = useRef<number | null>(null); // 애니메이션 루프 id\r\n\tconst velocity = useRef<{ vx: number; vy: number }>({ vx: 0, vy: 0 });\r\n\tconst ref = useRef<HTMLDivElement>(null);\r\n\tconst clonedNodeRef = useRef<HTMLDivElement | null>(null);\r\n\tconst clonedWidth = useRef<number | null>(null);\r\n\tconst clonedHeight = useRef<number | null>(null);\r\n\tconst hrefUrlRef = useRef<string>(\"\");\r\n\r\n\tconst rafId = useRef<number | null>(null);\r\n\tconst pending = useRef<DragStateType | null>(null);\r\n\r\n\tconst lastPointRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\r\n\tconst escCanceledRef = useRef(false);\r\n\r\n\tconst emitDragState = (v: DragStateType) => {\r\n\t\tpending.current = v;\r\n\t\tif (rafId.current != null) return;\r\n\r\n\t\trafId.current = requestAnimationFrame(() => {\r\n\t\t\tif (pending.current) dragStateSubject.next(pending.current);\r\n\t\t\tpending.current = null;\r\n\t\t\trafId.current = null;\r\n\t\t});\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\treturn () => {\r\n\t\t\tif (rafId.current != null) cancelAnimationFrame(rafId.current);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tconst { handleStart, handleMove, handleEnd } = useDragEvents({\r\n\t\tisBlockingActiveInput,\r\n\t});\r\n\r\n\tconst handleMoveWrapper = (event: Event) => {\r\n\t\tlet allowScrollEdge = false;\r\n\t\tlet x = 0;\r\n\t\tlet y = 0;\r\n\r\n\t\tif (event.type === \"touchmove\") {\r\n\t\t\tconst t = (event as globalThis.TouchEvent).touches[0];\r\n\t\t\tx = t.clientX;\r\n\t\t\ty = t.clientY;\r\n\t\t} else {\r\n\t\t\tconst m = event as globalThis.MouseEvent;\r\n\t\t\tx = m.clientX;\r\n\t\t\ty = m.clientY;\r\n\t\t}\r\n\t\tconst { vx, vy } = edgeVelocity(x, y);\r\n\t\tconst inEdge = vx !== 0 || vy !== 0;\r\n\r\n\t\tallowScrollEdge = shouldAllowViewportScroll(x, y);\r\n\t\t/* 중앙 영역이면 스크롤 막음, 가장자리면 허용 */\r\n\t\tif (clonedNodeRef.current?.isConnected && !inEdge) {\r\n\t\t\tevent.preventDefault(); // 화면 고정\r\n\t\t\tif (scrollRAF.current) {\r\n\t\t\t\tcancelAnimationFrame(scrollRAF.current);\r\n\t\t\t\tscrollRAF.current = null;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif (clonedNodeRef.current?.isConnected && inEdge) {\r\n\t\t\tevent.preventDefault();\r\n\t\t\tvelocity.current = { vx, vy }; // ← X·Y 둘 다 들어갈 수 있음\r\n\r\n\t\t\tif (!scrollRAF.current) {\r\n\t\t\t\tconst step = () => {\r\n\t\t\t\t\tconst target =\r\n\t\t\t\t\t\tscrollTargetRef?.current ??\r\n\t\t\t\t\t\t(document.scrollingElement as HTMLElement | null);\r\n\r\n\t\t\t\t\tif (target?.scrollBy) {\r\n\t\t\t\t\t\ttarget.scrollBy(\r\n\t\t\t\t\t\t\tvelocity.current.vx,\r\n\t\t\t\t\t\t\tvelocity.current.vy,\r\n\t\t\t\t\t\t);\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\twindow.scrollBy(\r\n\t\t\t\t\t\t\tvelocity.current.vx,\r\n\t\t\t\t\t\t\tvelocity.current.vy,\r\n\t\t\t\t\t\t);\r\n\t\t\t\t\t}\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tvelocity.current.vx === 0 &&\r\n\t\t\t\t\t\tvelocity.current.vy === 0\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tscrollRAF.current = null;\r\n\t\t\t\t\t\treturn;\r\n\t\t\t\t\t}\r\n\t\t\t\t\tscrollRAF.current = requestAnimationFrame(step);\r\n\t\t\t\t};\r\n\t\t\t\tscrollRAF.current = requestAnimationFrame(step);\r\n\t\t\t}\r\n\t\t}\r\n\t\tif (event.type !== \"touchmove\") {\r\n\t\t\t/* 마우스 · 펜 → 항상 고정 */\r\n\t\t\tevent.preventDefault();\r\n\t\t}\r\n\t\thandleMove({\r\n\t\t\tevent,\r\n\t\t\tnotDragCallback: ({ x, y }) => {\r\n\t\t\t\tif (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t\t},\r\n\t\t\tdragStartCallback: ({ x, y }) => {\r\n\t\t\t\tif (!clonedNodeRef.current) return;\r\n\r\n\t\t\t\tnavigator.vibrate(100);\r\n\t\t\t\tclonedNodeRef.current.style.transform = `translate3d(${x - (clonedWidth.current || 0) / 2}px, ${y - (clonedHeight.current || 0) / 2}px, 0)`;\r\n\t\t\t},\r\n\t\t\tmoveingCallback: ({ x, y }) => {\r\n\t\t\t\tlastPointRef.current = { x, y };\r\n\t\t\t\tif (clonedNodeRef.current?.isConnected) {\r\n\t\t\t\t\tclonedNodeRef.current.style.transform = `translate3d(${x - (clonedWidth.current || 0) / 2}px, ${y - (clonedHeight.current || 0) / 2}px, 0)`;\r\n\t\t\t\t\t// clonedNodeRef.current.style.left = `${x - (clonedWidth.current || 0) / 2}px`;\r\n\t\t\t\t\t// clonedNodeRef.current.style.top = `${y - (clonedHeight.current || 0) / 2}px`;\r\n\t\t\t\t}\r\n\r\n\t\t\t\temitDragState({\r\n\t\t\t\t\tisDragging: true,\r\n\t\t\t\t\tisDrop: false,\r\n\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\tnavigationTitle ??\r\n\t\t\t\t\t\ttitleFromUrl(dropDocumentOutsideOption?.openUrl),\r\n\t\t\t\t\tchildren: getFallbackElement(\r\n\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t),\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tcontainerName,\r\n\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\tcustomData,\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t});\r\n\t};\r\n\r\n\tconst handleEndWrapper = (event: Event) => {\r\n\t\t// 안전장치로 RAF 취소\r\n\t\tif (scrollRAF.current !== null) {\r\n\t\t\tcancelAnimationFrame(scrollRAF.current);\r\n\t\t\tscrollRAF.current = null;\r\n\t\t}\r\n\t\tvelocity.current = { vx: 0, vy: 0 };\r\n\r\n\t\t// 추가 안전장치 blur나 cancel 이벤트 발생 시 Clone 노드를 강제 정리\r\n\t\tif (\r\n\t\t\tevent.type === \"blur\" ||\r\n\t\t\tevent.type === \"touchcancel\" ||\r\n\t\t\tevent.type === \"pointercancel\"\r\n\t\t) {\r\n\t\t\tif (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t}\r\n\r\n\t\thandleEnd({\r\n\t\t\tevent,\r\n\t\t\tdragEndCallback: ({ x, y }) => {\r\n\t\t\t\tif (escCanceledRef.current) {\r\n\t\t\t\t\tescCanceledRef.current = false;\r\n\t\t\t\t\tif (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\r\n\t\t\t\t\temitDragState({\r\n\t\t\t\t\t\tisDragging: false,\r\n\t\t\t\t\t\tisDrop: false,\r\n\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\tnavigationTitle ??\r\n\t\t\t\t\t\t\ttitleFromUrl(dropDocumentOutsideOption?.openUrl),\r\n\t\t\t\t\t\tchildren: getFallbackElement(\r\n\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t\t),\r\n\t\t\t\t\t\tx,\r\n\t\t\t\t\t\ty,\r\n\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\tcustomData,\r\n\t\t\t\t\t});\r\n\t\t\t\t\treturn;\r\n\t\t\t\t}\r\n\r\n\t\t\t\tconst href = hrefUrlRef.current;\r\n\t\t\t\tif (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t\t\tif (dropDocumentOutsideOption && isDocumentOut({ x, y })) {\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tdropDocumentOutsideOption.isNewTap ||\r\n\t\t\t\t\t\t(!dropDocumentOutsideOption.widthRatio &&\r\n\t\t\t\t\t\t\t!dropDocumentOutsideOption.heightRatio)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\twindow.open(href, \"_blank\");\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tconst width =\r\n\t\t\t\t\t\t\twindow.innerWidth *\r\n\t\t\t\t\t\t\t(dropDocumentOutsideOption.widthRatio || 1);\r\n\t\t\t\t\t\tconst height =\r\n\t\t\t\t\t\t\twindow.innerHeight *\r\n\t\t\t\t\t\t\t(dropDocumentOutsideOption.heightRatio || 1);\r\n\t\t\t\t\t\twindow.open(\r\n\t\t\t\t\t\t\thref,\r\n\t\t\t\t\t\t\t\"_blank\",\r\n\t\t\t\t\t\t\t`width=${width},height=${height},left=${window.screenLeft - x * -1 - width},top=${window.screenTop + y}`,\r\n\t\t\t\t\t\t);\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\temitDragState({\r\n\t\t\t\t\tisDragging: false,\r\n\t\t\t\t\tisDrop: true,\r\n\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\tnavigationTitle ??\r\n\t\t\t\t\t\ttitleFromUrl(dropDocumentOutsideOption?.openUrl),\r\n\t\t\t\t\tchildren: getFallbackElement(\r\n\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t),\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tcontainerName,\r\n\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tscreenKey,\r\n\t\t\t\t\tcustomData,\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t});\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tif (ref.current) {\r\n\t\t\tconst clone = ref.current.cloneNode(true) as HTMLDivElement;\r\n\t\t\tconst originRect = ref.current.getBoundingClientRect();\r\n\t\t\tclone.style.width = originRect.width + \"px\";\r\n\t\t\tclone.style.height = originRect.height + \"px\";\r\n\t\t\tclone.style.opacity = \"0.3\";\r\n\t\t\tclone.style.backdropFilter = \"blur(6px)\";\r\n\t\t\tclonedWidth.current = originRect.width;\r\n\t\t\tclonedHeight.current = originRect.height;\r\n\t\t\tif (dropDocumentOutsideOption?.openUrl) {\r\n\t\t\t\threfUrlRef.current = dropDocumentOutsideOption!.openUrl;\r\n\t\t\t\tconst href = document.createElement(\"span\");\r\n\t\t\t\thref.textContent = hrefUrlRef.current;\r\n\t\t\t\tclone.prepend(href);\r\n\t\t\t}\r\n\r\n\t\t\tconst title = document.createElement(\"span\");\r\n\t\t\ttitle.textContent =\r\n\t\t\t\tnavigationTitle ??\r\n\t\t\t\ttitleFromUrl(dropDocumentOutsideOption?.openUrl) ??\r\n\t\t\t\t\"\";\r\n\t\t\tclone.prepend(title);\r\n\r\n\t\t\tclone.style.position = \"fixed\";\r\n\t\t\tclone.style.left = \"0px\";\r\n\t\t\tclone.style.top = \"0px\";\r\n\t\t\tclone.style.margin = \"0px\";\r\n\t\t\tclone.style.willChange = \"transform\";\r\n\t\t\tclone.style.transform = \"translate3d(-9999px, -9999px, 0)\";\r\n\t\t\tclone.style.pointerEvents = \"none\";\r\n\r\n\t\t\tclonedNodeRef.current = clone;\r\n\t\t\tclonedNodeRef.current.classList.add(\r\n\t\t\t\tstyles[\"flex-split-screen-drag-box-clone\"],\r\n\t\t\t);\r\n\t\t}\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst moveEvents: Array<keyof WindowEventMap> = [\r\n\t\t\t\"mousemove\",\r\n\t\t\t\"touchmove\",\r\n\t\t];\r\n\r\n\t\t// 드래그 상태가 붕괴되거나 좀비 상태가 될 수 있는 예외 케이스들을 모두 포함\r\n\t\tconst endEvents: Array<keyof WindowEventMap> = [\r\n\t\t\t\"mouseup\",\r\n\t\t\t\"touchend\",\r\n\t\t\t\"touchcancel\", // 터치 제스처 시스템 인터럽트\r\n\t\t\t\"pointerup\", // 범용 포인터 이벤트\r\n\t\t\t\"pointercancel\",\r\n\t\t\t\"blur\", // 윈도우 포커스 아웃 (Alt+Tab 등)\r\n\t\t];\r\n\r\n\t\tmoveEvents.forEach((eventName) => {\r\n\t\t\twindow.addEventListener(eventName, handleMoveWrapper, {\r\n\t\t\t\tpassive: false,\r\n\t\t\t});\r\n\t\t});\r\n\t\tendEvents.forEach((eventName) => {\r\n\t\t\twindow.addEventListener(eventName, handleEndWrapper);\r\n\t\t});\r\n\t\treturn () => {\r\n\t\t\tmoveEvents.forEach((eventName) => {\r\n\t\t\t\twindow.removeEventListener(eventName, handleMoveWrapper);\r\n\t\t\t});\r\n\t\t\tendEvents.forEach((eventName) => {\r\n\t\t\t\twindow.removeEventListener(eventName, handleEndWrapper);\r\n\t\t\t});\r\n\t\t};\r\n\t}, [\r\n\t\tcustomData,\r\n\t\ttargetComponent,\r\n\t\tdropDocumentOutsideOption,\r\n\t\tscreenKey,\r\n\t\tisBlockingActiveInput,\r\n\t\tcontainerName,\r\n\t\tnavigationTitle,\r\n\t\tdropEndCallback,\r\n\t]);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst el = ref.current;\r\n\t\tif (!el) return;\r\n\r\n\t\tconst onCtx = (e: Event) => e.preventDefault();\r\n\r\n\t\tel.addEventListener(\"contextmenu\", onCtx);\r\n\r\n\t\treturn () => {\r\n\t\t\tel.removeEventListener(\"contextmenu\", onCtx);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\treturn () => {\r\n\t\t\tif (scrollRAF.current !== null) {\r\n\t\t\t\tcancelAnimationFrame(scrollRAF.current);\r\n\t\t\t\tscrollRAF.current = null;\r\n\t\t\t}\r\n\t\t\tvelocity.current = { vx: 0, vy: 0 };\r\n\t\t\tclonedNodeRef.current?.remove();\r\n\t\t};\r\n\t}, []);\r\n\r\n\t//취소 이벤트\r\n\tuseEffect(() => {\r\n\t\tconst onKeyDown = (e: KeyboardEvent) => {\r\n\t\t\tif (e.key !== \"Escape\") return;\r\n\r\n\t\t\t// 드래그가 실제로 시작된 상태에서만 (clone이 body에 붙어있는 상태)\r\n\t\t\tif (!clonedNodeRef.current?.isConnected) return;\r\n\r\n\t\t\te.preventDefault();\r\n\t\t\te.stopPropagation();\r\n\r\n\t\t\t// 다음 mouseup이 와도 drop 로직 안 타게\r\n\t\t\tescCanceledRef.current = true;\r\n\r\n\t\t\t// 스크롤/RAF 정리\r\n\t\t\tif (scrollRAF.current !== null) {\r\n\t\t\t\tcancelAnimationFrame(scrollRAF.current);\r\n\t\t\t\tscrollRAF.current = null;\r\n\t\t\t}\r\n\t\t\tvelocity.current = { vx: 0, vy: 0 };\r\n\r\n\t\t\t// clone 제거\r\n\t\t\tclonedNodeRef.current?.remove();\r\n\r\n\t\t\t// useDragEvents 내부 상태도 \"끝\"으로 만들어 좀비 드래그 방지\r\n\t\t\t// (좌표는 hook이 마지막 좌표를 들고 있거나, 아래 emit에선 lastPointRef를 사용)\r\n\t\t\thandleEnd({\r\n\t\t\t\tevent: new Event(\"pointercancel\"),\r\n\t\t\t\tdragEndCallback: () => {},\r\n\t\t\t});\r\n\r\n\t\t\t// overlay 등 외부 UI도 즉시 종료시키기\r\n\t\t\tconst { x, y } = lastPointRef.current;\r\n\t\t\temitDragState({\r\n\t\t\t\tisDragging: false,\r\n\t\t\t\tisDrop: false,\r\n\t\t\t\tnavigationTitle:\r\n\t\t\t\t\tnavigationTitle ??\r\n\t\t\t\t\ttitleFromUrl(dropDocumentOutsideOption?.openUrl),\r\n\t\t\t\tchildren: getFallbackElement(\r\n\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t),\r\n\t\t\t\tx,\r\n\t\t\t\ty,\r\n\t\t\t\tcontainerName,\r\n\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\tcustomData,\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\twindow.addEventListener(\"keydown\", onKeyDown, true);\r\n\t\treturn () => window.removeEventListener(\"keydown\", onKeyDown, true);\r\n\t}, [\r\n\t\thandleEnd,\r\n\t\tcontainerName,\r\n\t\tnavigationTitle,\r\n\t\tdropDocumentOutsideOption,\r\n\t\ttargetComponent,\r\n\t\tcustomData,\r\n\t]);\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t<div\r\n\t\t\t\tclassName={`${className || \"\"} ${styles[\"flex-split-screen-drag-box\"]}`}\r\n\t\t\t\tref={ref}\r\n\t\t\t\tonContextMenu={(e) => e.preventDefault()}\r\n\t\t\t\tonMouseDown={(ev) => {\r\n\t\t\t\t\tif (onMouseDown) {\r\n\t\t\t\t\t\tPromise.resolve().then(() => onMouseDown(ev));\r\n\t\t\t\t\t}\r\n\t\t\t\t\thandleStart({\r\n\t\t\t\t\t\tevent: ev,\r\n\t\t\t\t\t\tdragStartCallback: ({ x, y }) => {\r\n\t\t\t\t\t\t\tlastPointRef.current = { x, y };\r\n\t\t\t\t\t\t\tif (clonedNodeRef.current) {\r\n\t\t\t\t\t\t\t\tdocument.body.appendChild(\r\n\t\t\t\t\t\t\t\t\tclonedNodeRef.current,\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tif (ref.current) {\r\n\t\t\t\t\t\t\t\t\tconst originRect =\r\n\t\t\t\t\t\t\t\t\t\tref.current.getBoundingClientRect();\r\n\t\t\t\t\t\t\t\t\tclonedNodeRef.current.style.width =\r\n\t\t\t\t\t\t\t\t\t\toriginRect.width + \"px\";\r\n\t\t\t\t\t\t\t\t\tclonedNodeRef.current.style.height =\r\n\t\t\t\t\t\t\t\t\t\toriginRect.height + \"px\";\r\n\r\n\t\t\t\t\t\t\t\t\tclonedWidth.current = originRect.width;\r\n\t\t\t\t\t\t\t\t\tclonedHeight.current = originRect.height;\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t\tif (clonedNodeRef.current?.isConnected) {\r\n\t\t\t\t\t\t\t\tnavigator.vibrate(100);\r\n\r\n\t\t\t\t\t\t\t\tclonedNodeRef.current.style.transform = `translate3d(${x - (clonedWidth.current || 0) / 2}px, ${y - (clonedHeight.current || 0) / 2}px, 0)`;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\temitDragState({\r\n\t\t\t\t\t\t\t\tisDragging: true,\r\n\t\t\t\t\t\t\t\tisDrop: false,\r\n\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\tnavigationTitle ??\r\n\t\t\t\t\t\t\t\t\ttitleFromUrl(\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\tchildren: getFallbackElement(\r\n\t\t\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\tcustomData,\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}}\r\n\t\t\t\tonTouchStart={(ev) => {\r\n\t\t\t\t\tif (onTouchStart) {\r\n\t\t\t\t\t\tPromise.resolve().then(() => onTouchStart(ev));\r\n\t\t\t\t\t}\r\n\t\t\t\t\thandleStart({\r\n\t\t\t\t\t\tevent: ev,\r\n\t\t\t\t\t\tdragStartCallback: ({ x, y }) => {\r\n\t\t\t\t\t\t\tif (clonedNodeRef.current) {\r\n\t\t\t\t\t\t\t\tdocument.body.appendChild(\r\n\t\t\t\t\t\t\t\t\tclonedNodeRef.current,\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tif (ref.current) {\r\n\t\t\t\t\t\t\t\t\tconst originRect =\r\n\t\t\t\t\t\t\t\t\t\tref.current.getBoundingClientRect();\r\n\t\t\t\t\t\t\t\t\tclonedNodeRef.current.style.width =\r\n\t\t\t\t\t\t\t\t\t\toriginRect.width + \"px\";\r\n\t\t\t\t\t\t\t\t\tclonedNodeRef.current.style.height =\r\n\t\t\t\t\t\t\t\t\t\toriginRect.height + \"px\";\r\n\r\n\t\t\t\t\t\t\t\t\tclonedWidth.current = originRect.width;\r\n\t\t\t\t\t\t\t\t\tclonedHeight.current = originRect.height;\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\tif (clonedNodeRef.current?.isConnected) {\r\n\t\t\t\t\t\t\t\tnavigator.vibrate(100);\r\n\t\t\t\t\t\t\t\tclonedNodeRef.current.style.transform = `translate3d(${x - (clonedWidth.current || 0) / 2}px, ${y - (clonedHeight.current || 0) / 2}px, 0)`;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\temitDragState({\r\n\t\t\t\t\t\t\t\tisDragging: true,\r\n\t\t\t\t\t\t\t\tisDrop: false,\r\n\t\t\t\t\t\t\t\tnavigationTitle:\r\n\t\t\t\t\t\t\t\t\tnavigationTitle ??\r\n\t\t\t\t\t\t\t\t\ttitleFromUrl(\r\n\t\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\tchildren: getFallbackElement(\r\n\t\t\t\t\t\t\t\t\ttargetComponent,\r\n\t\t\t\t\t\t\t\t\tdropDocumentOutsideOption?.openUrl,\r\n\t\t\t\t\t\t\t\t),\r\n\t\t\t\t\t\t\t\tx,\r\n\t\t\t\t\t\t\t\ty,\r\n\t\t\t\t\t\t\t\tcontainerName,\r\n\t\t\t\t\t\t\t\tdropDocumentOutsideOption,\r\n\t\t\t\t\t\t\t\tcustomData,\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}}\r\n\t\t\t\tstyle={{ ...style }}\r\n\t\t\t\t{...props}\r\n\t\t\t>\r\n\t\t\t\t{children}\r\n\t\t\t</div>\r\n\t\t\t{}\r\n\t\t</>\r\n\t);\r\n}\r\n"],"mappings":"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","names":["x","y","styles"]}