@byeolnaerim/flex-layout 0.0.8 → 0.0.10
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.
- package/dist/flex-layout/components/FlexLayout.cjs +1 -76
- package/dist/flex-layout/components/FlexLayout.js +1 -70
- package/dist/flex-layout/components/FlexLayoutContainer.cjs +1 -196
- package/dist/flex-layout/components/FlexLayoutContainer.js +1 -189
- package/dist/flex-layout/components/FlexLayoutIFramePane.cjs +1 -0
- package/dist/flex-layout/components/FlexLayoutIFramePane.d.ts +4 -0
- package/dist/flex-layout/components/FlexLayoutIFramePane.js +1 -0
- package/dist/flex-layout/components/FlexLayoutResizePanel.cjs +1 -192
- package/dist/flex-layout/components/FlexLayoutResizePanel.d.ts +1 -1
- package/dist/flex-layout/components/FlexLayoutResizePanel.js +1 -186
- package/dist/flex-layout/components/FlexLayoutSplitScreen.cjs +1 -1211
- package/dist/flex-layout/components/FlexLayoutSplitScreen.js +1 -1197
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.cjs +1 -339
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.d.ts +1 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.js +1 -333
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.cjs +1 -32
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.js +1 -25
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.cjs +1 -40
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.js +1 -34
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.cjs +1 -30
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.js +1 -24
- package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.cjs +1 -109
- package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.js +1 -103
- package/dist/flex-layout/components/FlexLayoutStickyBox.cjs +1 -226
- package/dist/flex-layout/components/FlexLayoutStickyBox.d.ts +1 -0
- package/dist/flex-layout/components/FlexLayoutStickyBox.js +1 -224
- package/dist/flex-layout/components/index.cjs +1 -52
- package/dist/flex-layout/components/index.js +1 -9
- package/dist/flex-layout/hooks/index.cjs +1 -21
- package/dist/flex-layout/hooks/index.js +1 -4
- package/dist/flex-layout/hooks/useDrag.cjs +1 -232
- package/dist/flex-layout/hooks/useDrag.d.ts +20 -0
- package/dist/flex-layout/hooks/useDrag.js +1 -219
- package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.cjs +1 -118
- package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.js +1 -116
- package/dist/flex-layout/hooks/useListPaging.cjs +1 -179
- package/dist/flex-layout/hooks/useListPaging.js +1 -175
- package/dist/flex-layout/hooks/useSizes.cjs +1 -104
- package/dist/flex-layout/hooks/useSizes.js +1 -101
- package/dist/flex-layout/index.cjs +1 -42
- package/dist/flex-layout/index.js +1 -7
- package/dist/flex-layout/providers/FlexLayoutContext.cjs +1 -26
- package/dist/flex-layout/providers/FlexLayoutContext.js +1 -23
- package/dist/flex-layout/providers/FlexLayoutHooks.cjs +1 -247
- package/dist/flex-layout/providers/FlexLayoutHooks.d.ts +5 -1
- package/dist/flex-layout/providers/FlexLayoutHooks.js +1 -238
- package/dist/flex-layout/providers/index.cjs +1 -14
- package/dist/flex-layout/providers/index.js +1 -3
- package/dist/flex-layout/store/FlexLayoutContainerStore.cjs +1 -203
- package/dist/flex-layout/store/FlexLayoutContainerStore.d.ts +1 -0
- package/dist/flex-layout/store/FlexLayoutContainerStore.js +1 -181
- package/dist/flex-layout/store/index.cjs +1 -14
- package/dist/flex-layout/store/index.js +1 -3
- package/dist/flex-layout/styles/FlexLayout.module.css +473 -416
- package/dist/flex-layout/types/FlexDirectionTypes.cjs +1 -4
- package/dist/flex-layout/types/FlexDirectionTypes.js +0 -3
- package/dist/flex-layout/types/FlexLayoutTypes.cjs +1 -4
- package/dist/flex-layout/types/FlexLayoutTypes.d.ts +1 -3
- package/dist/flex-layout/types/FlexLayoutTypes.js +0 -3
- package/dist/flex-layout/utils/FlexLayoutUtils.cjs +1 -208
- package/dist/flex-layout/utils/FlexLayoutUtils.d.ts +4 -4
- package/dist/flex-layout/utils/FlexLayoutUtils.js +1 -196
- package/dist/flex-layout/utils/index.cjs +1 -14
- package/dist/flex-layout/utils/index.js +1 -3
- package/dist/index.cjs +1 -14
- package/dist/index.js +1 -3
- package/dist/types/css.d.cjs +1 -4
- package/dist/types/css.d.js +0 -3
- package/package.json +116 -109
- package/dist/flex-layout/components/FlexLayout.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayout.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutContainer.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutContainer.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutResizePanel.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutResizePanel.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreen.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreen.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.js.map +0 -1
- package/dist/flex-layout/components/FlexLayoutStickyBox.cjs.map +0 -1
- package/dist/flex-layout/components/FlexLayoutStickyBox.js.map +0 -1
- package/dist/flex-layout/components/index.cjs.map +0 -1
- package/dist/flex-layout/components/index.js.map +0 -1
- package/dist/flex-layout/hooks/index.cjs.map +0 -1
- package/dist/flex-layout/hooks/index.js.map +0 -1
- package/dist/flex-layout/hooks/useDrag.cjs.map +0 -1
- package/dist/flex-layout/hooks/useDrag.js.map +0 -1
- package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.cjs.map +0 -1
- package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.js.map +0 -1
- package/dist/flex-layout/hooks/useListPaging.cjs.map +0 -1
- package/dist/flex-layout/hooks/useListPaging.js.map +0 -1
- package/dist/flex-layout/hooks/useSizes.cjs.map +0 -1
- package/dist/flex-layout/hooks/useSizes.js.map +0 -1
- package/dist/flex-layout/index.cjs.map +0 -1
- package/dist/flex-layout/index.js.map +0 -1
- package/dist/flex-layout/providers/FlexLayoutContext.cjs.map +0 -1
- package/dist/flex-layout/providers/FlexLayoutContext.js.map +0 -1
- package/dist/flex-layout/providers/FlexLayoutHooks.cjs.map +0 -1
- package/dist/flex-layout/providers/FlexLayoutHooks.js.map +0 -1
- package/dist/flex-layout/providers/index.cjs.map +0 -1
- package/dist/flex-layout/providers/index.js.map +0 -1
- package/dist/flex-layout/store/FlexLayoutContainerStore.cjs.map +0 -1
- package/dist/flex-layout/store/FlexLayoutContainerStore.js.map +0 -1
- package/dist/flex-layout/store/index.cjs.map +0 -1
- package/dist/flex-layout/store/index.js.map +0 -1
- package/dist/flex-layout/types/FlexDirectionTypes.cjs.map +0 -1
- package/dist/flex-layout/types/FlexDirectionTypes.js.map +0 -1
- package/dist/flex-layout/types/FlexLayoutTypes.cjs.map +0 -1
- package/dist/flex-layout/types/FlexLayoutTypes.js.map +0 -1
- package/dist/flex-layout/utils/FlexLayoutUtils.cjs.map +0 -1
- package/dist/flex-layout/utils/FlexLayoutUtils.js.map +0 -1
- package/dist/flex-layout/utils/index.cjs.map +0 -1
- package/dist/flex-layout/utils/index.js.map +0 -1
- package/dist/index.cjs.map +0 -1
- package/dist/index.js.map +0 -1
- package/dist/types/css.d.cjs.map +0 -1
- package/dist/types/css.d.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBox.tsx"],"names":["x","y"],"mappings":"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","file":"FlexLayoutSplitScreenDragBox.js","sourcesContent":["import {\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} from \"react\";\r\nimport { dragState, useDragEvents } from \"../hooks/useDrag\";\r\n\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport { isDocumentOut } from \"../utils/FlexLayoutUtils\";\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\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\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 = 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\tisBlockingActiveInput = false,\r\n\tcustomData = {},\r\n\tscrollTargetRef,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxProps) {\r\n\t//const lastTouch = useRef<{ x: number; y: number } | null>(null);\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 { handleStart, handleMove, handleEnd } = useDragEvents({\r\n\t\tisBlockingActiveInput,\r\n\t});\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\t// velocity.current = { vx: 0, vy: 0 };\r\n\t\t}\r\n\r\n\t\tif (\r\n\t\t\tclonedNodeRef.current?.isConnected &&\r\n\t\t\tinEdge\r\n\t\t\t//&&lastTouch.current\r\n\t\t) {\r\n\t\t\tevent.preventDefault();\r\n\t\t\t// const dx = x - lastTouch.current.x; // 손가락 이동량\r\n\t\t\t// const dy = y - lastTouch.current.y;\r\n\r\n\t\t\tvelocity.current = { vx, vy }; // ← X·Y 둘 다 들어갈 수 있음\r\n\r\n\t\t\t// const { vx, vy } = calcVelocity(dx, dy, 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\r\n\t\t\t//lastTouch.current = { x, y };\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\t\t\t\tnavigator.vibrate(100);\r\n\t\t\t\tclonedNodeRef.current.style.left = `${x - (clonedWidth.current || 0) / 2}px`;\r\n\t\t\t\tclonedNodeRef.current.style.top = `${y - (clonedHeight.current || 0) / 2}px`;\r\n\t\t\t},\r\n\t\t\tmoveingCallback: ({ x, y }) => {\r\n\t\t\t\tif (clonedNodeRef.current?.isConnected) {\r\n\t\t\t\t\tclonedNodeRef.current.style.left = `${x - (clonedWidth.current || 0) / 2}px`;\r\n\t\t\t\t\tclonedNodeRef.current.style.top = `${y - (clonedHeight.current || 0) / 2}px`;\r\n\t\t\t\t}\r\n\r\n\t\t\t\tdragState.next({\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\tchildren: targetComponent,\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\tconst handleEndWrapper = (event: Event) => {\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\t\t//lastTouch.current = null;\r\n\t\thandleEnd({\r\n\t\t\tevent,\r\n\t\t\tdragEndCallback: ({ x, y }) => {\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\tdragState.next({\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\tchildren: targetComponent,\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\tuseEffect(() => {\r\n\t\tif (ref.current) {\r\n\t\t\tconst clone = ref.current.cloneNode(true) as HTMLDivElement; //document.createElement('div');\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\tif (navigationTitle) {\r\n\t\t\t\tconst title = document.createElement(\"span\");\r\n\t\t\t\ttitle.textContent = navigationTitle;\r\n\t\t\t\tclone.prepend(title);\r\n\t\t\t}\r\n\t\t\tclone.style.position = \"fixed\";\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\t\tconst endEvents: Array<keyof WindowEventMap> = [\"mouseup\", \"touchend\"];\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\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\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\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\t\t\t\t\t\t\t\tclonedNodeRef.current.style.left = `${x - (clonedWidth.current || 0) / 2}px`;\r\n\t\t\t\t\t\t\t\tclonedNodeRef.current.style.top = `${y - (clonedHeight.current || 0) / 2}px`;\r\n\t\t\t\t\t\t\t\t//clonedNodeRef.current.style.left = `${clientX}px`;\r\n\t\t\t\t\t\t\t\t//clonedNodeRef.current.style.top = `${clientY}px`;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\tdragState.next({\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\tchildren: targetComponent,\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.left = `${x - (clonedWidth.current || 0) / 2}px`;\r\n\t\t\t\t\t\t\t\tclonedNodeRef.current.style.top = `${y - (clonedHeight.current || 0) / 2}px`;\r\n\t\t\t\t\t\t\t\t//clonedNodeRef.current.style.left = `${clientX}px`;\r\n\t\t\t\t\t\t\t\t//clonedNodeRef.current.style.top = `${clientY}px`;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\tdragState.next({\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\tchildren: targetComponent,\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"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.tsx"],"names":["jsx","FlexLayoutSplitScreenScrollBox","styles"],"mappings":";;;;;;;;;;;AAQe,SAAR,qCAAA,CAAuD;AAAA,EAC7D,SAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,GAAG;AACJ,CAAA,EAA+C;AAC9C,EAAA,uBACCA,cAAA;AAAA,IAACC,+CAAA;AAAA,IAAA;AAAA,MACA,OAAA,EAAS,UAAA;AAAA,MACT,SAAA,EAAW,CAAA,EAAGC,uBAAA,CAAO,4CAA4C,CAAC,IAAK,SAAA,IAAa,SAAA,KAAc,EAAA,IAAM,SAAA,IAAc,EAAE,CAAA,CAAA;AAAA,MACxH,SAAA,EAAU,GAAA;AAAA,MACT,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACF;AAEF","file":"FlexLayoutSplitScreenDragBoxContainer.cjs","sourcesContent":["\"use client\";\r\nimport { HTMLAttributes } from \"react\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport FlexLayoutSplitScreenScrollBox from \"./FlexLayoutSplitScreenScrollBox\";\r\nexport interface FlexLayoutSplitScreenDragBoxContainerProps extends HTMLAttributes<HTMLDivElement> {\r\n\tlayoutName: string;\r\n}\r\n\r\nexport default function FlexLayoutSplitScreenDragBoxContainer({\r\n\tclassName,\r\n\tchildren,\r\n\tlayoutName,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxContainerProps) {\r\n\treturn (\r\n\t\t<FlexLayoutSplitScreenScrollBox\r\n\t\t\tkeyName={layoutName}\r\n\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-container\"]} ${(className && className !== \"\" && className) || \"\"}`}\r\n\t\t\tdirection=\"x\"\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t</FlexLayoutSplitScreenScrollBox>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.tsx"],"names":[],"mappings":";;;;AAQe,SAAR,qCAAA,CAAuD;AAAA,EAC7D,SAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,GAAG;AACJ,CAAA,EAA+C;AAC9C,EAAA,uBACC,GAAA;AAAA,IAAC,8BAAA;AAAA,IAAA;AAAA,MACA,OAAA,EAAS,UAAA;AAAA,MACT,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,4CAA4C,CAAC,IAAK,SAAA,IAAa,SAAA,KAAc,EAAA,IAAM,SAAA,IAAc,EAAE,CAAA,CAAA;AAAA,MACxH,SAAA,EAAU,GAAA;AAAA,MACT,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACF;AAEF","file":"FlexLayoutSplitScreenDragBoxContainer.js","sourcesContent":["\"use client\";\r\nimport { HTMLAttributes } from \"react\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport FlexLayoutSplitScreenScrollBox from \"./FlexLayoutSplitScreenScrollBox\";\r\nexport interface FlexLayoutSplitScreenDragBoxContainerProps extends HTMLAttributes<HTMLDivElement> {\r\n\tlayoutName: string;\r\n}\r\n\r\nexport default function FlexLayoutSplitScreenDragBoxContainer({\r\n\tclassName,\r\n\tchildren,\r\n\tlayoutName,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxContainerProps) {\r\n\treturn (\r\n\t\t<FlexLayoutSplitScreenScrollBox\r\n\t\t\tkeyName={layoutName}\r\n\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-container\"]} ${(className && className !== \"\" && className) || \"\"}`}\r\n\t\t\tdirection=\"x\"\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t</FlexLayoutSplitScreenScrollBox>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.tsx"],"names":["useEffect","allSplitScreenCount","jsxs","styles","jsx"],"mappings":";;;;;;;;;;;AASe,SAAR,gCAAA,CAAkD;AAAA,EACxD,QAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACJ,CAAA,EAA0C;AACzC,EAAAA,eAAA,CAAU,MAAM;AACf,IAAAC,2BAAA,CAAoB,IAAA,CAAKA,2BAAA,CAAoB,KAAA,GAAQ,CAAC,CAAA;AACtD,IAAA,OAAO,MAAM;AACZ,MAAA,IAAIA,2BAAA,CAAoB,SAAS,CAAA,EAAG;AACpC,MAAAA,2BAAA,CAAoB,IAAA,CAAKA,2BAAA,CAAoB,KAAA,GAAQ,CAAC,CAAA;AAAA,IACvD,CAAA;AAAA,EACD,CAAA,EAAG,EAAE,CAAA;AACL,EAAA,uBACCC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,CAAA,EAAGC,uBAAA,CAAO,uCAAuC,CAAC,IAAI,QAAA,GAAWA,uBAAA,CAAO,QAAQ,CAAA,GAAI,EAAE,CAAA,CAAA;AAAA,MAChG,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBACDC,cAAA,CAAC,QAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,OAAA,EAAS,CAAC,EAAA,KAAO,OAAA,CAAQ,EAAE,CAAA,EAAG,QAAA,EAAA,GAAA,EAEpD;AAAA;AAAA;AAAA,GACD;AAEF","file":"FlexLayoutSplitScreenDragBoxItem.cjs","sourcesContent":["import { MouseEvent, ReactElement, useEffect } from \"react\";\r\nimport { allSplitScreenCount } from \"../hooks/useDrag\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport { FlexLayoutSplitScreenDragBoxProps } from \"./FlexLayoutSplitScreenDragBox\";\r\nexport interface FlexLayoutSplitScreenDragBoxItemProps {\r\n\tchildren: ReactElement<FlexLayoutSplitScreenDragBoxProps>;\r\n\tonClose: (event: MouseEvent<HTMLButtonElement>) => void;\r\n\tisActive: boolean;\r\n}\r\nexport default function FlexLayoutSplitScreenDragBoxItem({\r\n\tchildren,\r\n\tonClose,\r\n\tisActive,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxItemProps) {\r\n\tuseEffect(() => {\r\n\t\tallSplitScreenCount.next(allSplitScreenCount.value + 1);\r\n\t\treturn () => {\r\n\t\t\tif (allSplitScreenCount.value <= 1) return;\r\n\t\t\tallSplitScreenCount.next(allSplitScreenCount.value - 1);\r\n\t\t};\r\n\t}, []);\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-item\"]} ${isActive ? styles[\"active\"] : \"\"}`}\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t\t<button type=\"button\" onClick={(ev) => onClose(ev)}>\r\n\t\t\t\tX\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.tsx"],"names":[],"mappings":";;;;;AASe,SAAR,gCAAA,CAAkD;AAAA,EACxD,QAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACJ,CAAA,EAA0C;AACzC,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,mBAAA,CAAoB,IAAA,CAAK,mBAAA,CAAoB,KAAA,GAAQ,CAAC,CAAA;AACtD,IAAA,OAAO,MAAM;AACZ,MAAA,IAAI,mBAAA,CAAoB,SAAS,CAAA,EAAG;AACpC,MAAA,mBAAA,CAAoB,IAAA,CAAK,mBAAA,CAAoB,KAAA,GAAQ,CAAC,CAAA;AAAA,IACvD,CAAA;AAAA,EACD,CAAA,EAAG,EAAE,CAAA;AACL,EAAA,uBACC,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,uCAAuC,CAAC,IAAI,QAAA,GAAW,MAAA,CAAO,QAAQ,CAAA,GAAI,EAAE,CAAA,CAAA;AAAA,MAChG,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBACD,GAAA,CAAC,QAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,OAAA,EAAS,CAAC,EAAA,KAAO,OAAA,CAAQ,EAAE,CAAA,EAAG,QAAA,EAAA,GAAA,EAEpD;AAAA;AAAA;AAAA,GACD;AAEF","file":"FlexLayoutSplitScreenDragBoxItem.js","sourcesContent":["import { MouseEvent, ReactElement, useEffect } from \"react\";\r\nimport { allSplitScreenCount } from \"../hooks/useDrag\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\nimport { FlexLayoutSplitScreenDragBoxProps } from \"./FlexLayoutSplitScreenDragBox\";\r\nexport interface FlexLayoutSplitScreenDragBoxItemProps {\r\n\tchildren: ReactElement<FlexLayoutSplitScreenDragBoxProps>;\r\n\tonClose: (event: MouseEvent<HTMLButtonElement>) => void;\r\n\tisActive: boolean;\r\n}\r\nexport default function FlexLayoutSplitScreenDragBoxItem({\r\n\tchildren,\r\n\tonClose,\r\n\tisActive,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxItemProps) {\r\n\tuseEffect(() => {\r\n\t\tallSplitScreenCount.next(allSplitScreenCount.value + 1);\r\n\t\treturn () => {\r\n\t\t\tif (allSplitScreenCount.value <= 1) return;\r\n\t\t\tallSplitScreenCount.next(allSplitScreenCount.value - 1);\r\n\t\t};\r\n\t}, []);\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-item\"]} ${isActive ? styles[\"active\"] : \"\"}`}\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t\t<button type=\"button\" onClick={(ev) => onClose(ev)}>\r\n\t\t\t\tX\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.tsx"],"names":["jsxs","styles","jsx"],"mappings":";;;;;;;;;AAOe,SAAR,qCAAA,CAAuD;AAAA,EAC7D,SAAA;AAAA,EACA,GAAG;AACJ,CAAA,EAA+C;AAC9C,EAAA,uBACCA,eAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAG,KAAA;AAAA,MACJ,WAAW,CAAA,EAAGC,uBAAA,CAAO,uCAAuC,CAAC,CAAA,CAAA,EAAI,aAAa,EAAE,CAAA,CAAA;AAAA,MAEhF,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,UAAK,QAAA,EAAA,GAAA,EAAC,CAAA;AAAA,wBACPA,cAAA,CAAC,UAAK,QAAA,EAAA,GAAA,EAAC,CAAA;AAAA,wBACPA,cAAA,CAAC,UAAK,QAAA,EAAA,GAAA,EAAC;AAAA;AAAA;AAAA,GACR;AAEF","file":"FlexLayoutSplitScreenDragBoxTitleMore.cjs","sourcesContent":["import { HTMLAttributes } from \"react\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\n\r\nexport interface FlexLayoutSplitScreenDragBoxTitleMoreProps extends Omit<\r\n\tHTMLAttributes<HTMLButtonElement>,\r\n\t\"children\"\r\n> {}\r\nexport default function FlexLayoutSplitScreenDragBoxTitleMore({\r\n\tclassName,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxTitleMoreProps) {\r\n\treturn (\r\n\t\t<button\r\n\t\t\t{...props}\r\n\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-more\"]} ${className || \"\"}`}\r\n\t\t>\r\n\t\t\t<span>.</span>\r\n\t\t\t<span>.</span>\r\n\t\t\t<span>.</span>\r\n\t\t</button>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.tsx"],"names":[],"mappings":";;;AAOe,SAAR,qCAAA,CAAuD;AAAA,EAC7D,SAAA;AAAA,EACA,GAAG;AACJ,CAAA,EAA+C;AAC9C,EAAA,uBACC,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAG,KAAA;AAAA,MACJ,WAAW,CAAA,EAAG,MAAA,CAAO,uCAAuC,CAAC,CAAA,CAAA,EAAI,aAAa,EAAE,CAAA,CAAA;AAAA,MAEhF,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,UAAK,QAAA,EAAA,GAAA,EAAC,CAAA;AAAA,wBACP,GAAA,CAAC,UAAK,QAAA,EAAA,GAAA,EAAC,CAAA;AAAA,wBACP,GAAA,CAAC,UAAK,QAAA,EAAA,GAAA,EAAC;AAAA;AAAA;AAAA,GACR;AAEF","file":"FlexLayoutSplitScreenDragBoxTitleMore.js","sourcesContent":["import { HTMLAttributes } from \"react\";\r\nimport styles from \"../styles/FlexLayout.module.css\";\r\n\r\nexport interface FlexLayoutSplitScreenDragBoxTitleMoreProps extends Omit<\r\n\tHTMLAttributes<HTMLButtonElement>,\r\n\t\"children\"\r\n> {}\r\nexport default function FlexLayoutSplitScreenDragBoxTitleMore({\r\n\tclassName,\r\n\t...props\r\n}: FlexLayoutSplitScreenDragBoxTitleMoreProps) {\r\n\treturn (\r\n\t\t<button\r\n\t\t\t{...props}\r\n\t\t\tclassName={`${styles[\"flex-split-screen-drag-box-title-more\"]} ${className || \"\"}`}\r\n\t\t>\r\n\t\t\t<span>.</span>\r\n\t\t\t<span>.</span>\r\n\t\t\t<span>.</span>\r\n\t\t</button>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenScrollBox.tsx"],"names":["useRef","useState","Subject","useEffect","fromEvent","throttleTime","setScrollPosition","getScrollPosition","take","removeScrollPosition","jsx","listScroll","memo"],"mappings":"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","file":"FlexLayoutSplitScreenScrollBox.cjs","sourcesContent":["\"use client\";\r\n\r\nimport { FC, HTMLAttributes, memo, useEffect, useRef, useState } from \"react\";\r\nimport { fromEvent, Subject } from \"rxjs\";\r\nimport { take, throttleTime } from \"rxjs/operators\";\r\nimport {\r\n\tgetScrollPosition,\r\n\tremoveScrollPosition,\r\n\tScrollPosition,\r\n\tsetScrollPosition,\r\n} from \"../store/FlexLayoutContainerStore\";\r\nimport listScroll from \"../styles/listScroll.module.css\";\r\n\r\nexport interface FlexLayoutSplitScreenScrollBoxProps extends HTMLAttributes<HTMLDivElement> {\r\n\tkeyName: string;\r\n\tclassName?: string;\r\n\tdirection?: \"x\" | \"y\";\r\n\tisDefaultScrollStyle?: boolean;\r\n}\r\n\r\nconst FlexLayoutSplitScreenScrollBox: FC<\r\n\tFlexLayoutSplitScreenScrollBoxProps\r\n> = ({\r\n\tclassName,\r\n\tchildren,\r\n\tkeyName,\r\n\tdirection,\r\n\tisDefaultScrollStyle = false,\r\n\t...props\r\n}: FlexLayoutSplitScreenScrollBoxProps) => {\r\n\tconst scrollRef = useRef<HTMLDivElement | null>(null);\r\n\tconst [isMouseDown, setIsMouseDown] = useState<boolean>(false);\r\n\tconst scrollEventSubject = useRef(new Subject<ScrollPosition>());\r\n\r\n\t// const handleScroll = throttle(\r\n\t// (newScrollLeft: number, newScrollTop: number) => {\r\n\t// setScrollPosition(layoutName, {\r\n\t// x: newScrollLeft,\r\n\t// y: newScrollTop,\r\n\t// });\r\n\t// },\r\n\t// 100\r\n\t// ); // 100ms 간격으로 호출\r\n\r\n\tuseEffect(() => {\r\n\t\tconst mouseUpSubscribe = fromEvent<MouseEvent>(\r\n\t\t\twindow,\r\n\t\t\t\"mouseup\",\r\n\t\t).subscribe(() => {\r\n\t\t\tsetIsMouseDown(false);\r\n\t\t});\r\n\r\n\t\t// 스크롤 이벤트 throttling 및 상태 업데이트\r\n\t\tconst scrollEventSubscribe = scrollEventSubject.current\r\n\t\t\t.pipe(throttleTime(70)) // 70ms 간격으로 throttling\r\n\t\t\t.subscribe((position) => {\r\n\t\t\t\tsetScrollPosition(keyName, position);\r\n\t\t\t});\r\n\r\n\t\tconst scrollSubscribe = getScrollPosition(keyName)\r\n\t\t\t.pipe(take(1)) // 한 번만 실행\r\n\t\t\t.subscribe((position) => {\r\n\t\t\t\tif (scrollRef.current && position) {\r\n\t\t\t\t\tscrollRef.current.scrollLeft = position.x;\r\n\t\t\t\t\tscrollRef.current.scrollTop = position.y;\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tremoveScrollPosition(keyName);\r\n\t\t\tmouseUpSubscribe.unsubscribe();\r\n\t\t\tscrollSubscribe.unsubscribe();\r\n\t\t\tscrollEventSubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [keyName]);\r\n\tuseEffect(() => {\r\n\t\tif (!scrollRef.current) return;\r\n\r\n\t\tlet animationFrameId: number | null = null;\r\n\t\tconst handleWheel = (event: WheelEvent) => {\r\n\t\t\tif (!scrollRef.current || direction !== \"x\") return;\r\n\t\t\tif (scrollRef.current.matches(\":hover\")) {\r\n\t\t\t\tevent.preventDefault();\r\n\t\t\t\tconst { deltaY } = event;\r\n\t\t\t\tconst newScrollLeft = scrollRef.current.scrollLeft + deltaY;\r\n\r\n\t\t\t\t// 이미 애니메이션이 예약되어 있으면 취소\r\n\t\t\t\tif (animationFrameId) {\r\n\t\t\t\t\tcancelAnimationFrame(animationFrameId);\r\n\t\t\t\t}\r\n\r\n\t\t\t\tanimationFrameId = requestAnimationFrame(() => {\r\n\t\t\t\t\t// 바로 scrollLeft 값을 업데이트 (smooth 대신,\r\n\t\t\t\t\t// 혹은 native 스크롤로 처리)\r\n\t\t\t\t\tscrollRef.current!.scrollLeft = newScrollLeft;\r\n\t\t\t\t\tscrollEventSubject.current.next({\r\n\t\t\t\t\t\tx: newScrollLeft,\r\n\t\t\t\t\t\ty: scrollRef.current!.scrollTop,\r\n\t\t\t\t\t});\r\n\t\t\t\t\tanimationFrameId = null;\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t};\r\n\r\n\t\t// 수동으로 이벤트 리스너 추가\r\n\t\tscrollRef.current.addEventListener(\"wheel\", handleWheel, {\r\n\t\t\tpassive: false,\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\t// 이벤트 리스너 제거\r\n\t\t\tscrollRef.current?.removeEventListener(\"wheel\", handleWheel);\r\n\t\t};\r\n\t}, []);\r\n\treturn (\r\n\t\t<div\r\n\t\t\tref={scrollRef}\r\n\t\t\tonMouseUp={() => setIsMouseDown(false)}\r\n\t\t\tonMouseDown={() => setIsMouseDown(true)}\r\n\t\t\tonMouseMove={(event) => {\r\n\t\t\t\tif (!scrollRef.current || !isMouseDown || direction !== \"x\")\r\n\t\t\t\t\treturn;\r\n\t\t\t\tscrollRef.current.scrollLeft += event.movementX * -1;\r\n\t\t\t\tscrollEventSubject.current.next({\r\n\t\t\t\t\tx: scrollRef.current.scrollLeft,\r\n\t\t\t\t\ty: scrollRef.current.scrollTop,\r\n\t\t\t\t});\r\n\t\t\t}}\r\n\t\t\tonScroll={() => {\r\n\t\t\t\tif (!scrollRef.current) return;\r\n\t\t\t\tscrollEventSubject.current.next({\r\n\t\t\t\t\tx: scrollRef.current.scrollLeft,\r\n\t\t\t\t\ty: scrollRef.current.scrollTop,\r\n\t\t\t\t});\r\n\t\t\t}}\r\n\t\t\tclassName={`${className || \"\"} ${isDefaultScrollStyle ? listScroll[\"default-scroll\"] : listScroll[\"list-scroll\"]} ${direction ? listScroll[direction] : \"\"}`}\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default memo(FlexLayoutSplitScreenScrollBox);\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutSplitScreenScrollBox.tsx"],"names":[],"mappings":"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","file":"FlexLayoutSplitScreenScrollBox.js","sourcesContent":["\"use client\";\r\n\r\nimport { FC, HTMLAttributes, memo, useEffect, useRef, useState } from \"react\";\r\nimport { fromEvent, Subject } from \"rxjs\";\r\nimport { take, throttleTime } from \"rxjs/operators\";\r\nimport {\r\n\tgetScrollPosition,\r\n\tremoveScrollPosition,\r\n\tScrollPosition,\r\n\tsetScrollPosition,\r\n} from \"../store/FlexLayoutContainerStore\";\r\nimport listScroll from \"../styles/listScroll.module.css\";\r\n\r\nexport interface FlexLayoutSplitScreenScrollBoxProps extends HTMLAttributes<HTMLDivElement> {\r\n\tkeyName: string;\r\n\tclassName?: string;\r\n\tdirection?: \"x\" | \"y\";\r\n\tisDefaultScrollStyle?: boolean;\r\n}\r\n\r\nconst FlexLayoutSplitScreenScrollBox: FC<\r\n\tFlexLayoutSplitScreenScrollBoxProps\r\n> = ({\r\n\tclassName,\r\n\tchildren,\r\n\tkeyName,\r\n\tdirection,\r\n\tisDefaultScrollStyle = false,\r\n\t...props\r\n}: FlexLayoutSplitScreenScrollBoxProps) => {\r\n\tconst scrollRef = useRef<HTMLDivElement | null>(null);\r\n\tconst [isMouseDown, setIsMouseDown] = useState<boolean>(false);\r\n\tconst scrollEventSubject = useRef(new Subject<ScrollPosition>());\r\n\r\n\t// const handleScroll = throttle(\r\n\t// (newScrollLeft: number, newScrollTop: number) => {\r\n\t// setScrollPosition(layoutName, {\r\n\t// x: newScrollLeft,\r\n\t// y: newScrollTop,\r\n\t// });\r\n\t// },\r\n\t// 100\r\n\t// ); // 100ms 간격으로 호출\r\n\r\n\tuseEffect(() => {\r\n\t\tconst mouseUpSubscribe = fromEvent<MouseEvent>(\r\n\t\t\twindow,\r\n\t\t\t\"mouseup\",\r\n\t\t).subscribe(() => {\r\n\t\t\tsetIsMouseDown(false);\r\n\t\t});\r\n\r\n\t\t// 스크롤 이벤트 throttling 및 상태 업데이트\r\n\t\tconst scrollEventSubscribe = scrollEventSubject.current\r\n\t\t\t.pipe(throttleTime(70)) // 70ms 간격으로 throttling\r\n\t\t\t.subscribe((position) => {\r\n\t\t\t\tsetScrollPosition(keyName, position);\r\n\t\t\t});\r\n\r\n\t\tconst scrollSubscribe = getScrollPosition(keyName)\r\n\t\t\t.pipe(take(1)) // 한 번만 실행\r\n\t\t\t.subscribe((position) => {\r\n\t\t\t\tif (scrollRef.current && position) {\r\n\t\t\t\t\tscrollRef.current.scrollLeft = position.x;\r\n\t\t\t\t\tscrollRef.current.scrollTop = position.y;\r\n\t\t\t\t}\r\n\t\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tremoveScrollPosition(keyName);\r\n\t\t\tmouseUpSubscribe.unsubscribe();\r\n\t\t\tscrollSubscribe.unsubscribe();\r\n\t\t\tscrollEventSubscribe.unsubscribe();\r\n\t\t};\r\n\t}, [keyName]);\r\n\tuseEffect(() => {\r\n\t\tif (!scrollRef.current) return;\r\n\r\n\t\tlet animationFrameId: number | null = null;\r\n\t\tconst handleWheel = (event: WheelEvent) => {\r\n\t\t\tif (!scrollRef.current || direction !== \"x\") return;\r\n\t\t\tif (scrollRef.current.matches(\":hover\")) {\r\n\t\t\t\tevent.preventDefault();\r\n\t\t\t\tconst { deltaY } = event;\r\n\t\t\t\tconst newScrollLeft = scrollRef.current.scrollLeft + deltaY;\r\n\r\n\t\t\t\t// 이미 애니메이션이 예약되어 있으면 취소\r\n\t\t\t\tif (animationFrameId) {\r\n\t\t\t\t\tcancelAnimationFrame(animationFrameId);\r\n\t\t\t\t}\r\n\r\n\t\t\t\tanimationFrameId = requestAnimationFrame(() => {\r\n\t\t\t\t\t// 바로 scrollLeft 값을 업데이트 (smooth 대신,\r\n\t\t\t\t\t// 혹은 native 스크롤로 처리)\r\n\t\t\t\t\tscrollRef.current!.scrollLeft = newScrollLeft;\r\n\t\t\t\t\tscrollEventSubject.current.next({\r\n\t\t\t\t\t\tx: newScrollLeft,\r\n\t\t\t\t\t\ty: scrollRef.current!.scrollTop,\r\n\t\t\t\t\t});\r\n\t\t\t\t\tanimationFrameId = null;\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t};\r\n\r\n\t\t// 수동으로 이벤트 리스너 추가\r\n\t\tscrollRef.current.addEventListener(\"wheel\", handleWheel, {\r\n\t\t\tpassive: false,\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\t// 이벤트 리스너 제거\r\n\t\t\tscrollRef.current?.removeEventListener(\"wheel\", handleWheel);\r\n\t\t};\r\n\t}, []);\r\n\treturn (\r\n\t\t<div\r\n\t\t\tref={scrollRef}\r\n\t\t\tonMouseUp={() => setIsMouseDown(false)}\r\n\t\t\tonMouseDown={() => setIsMouseDown(true)}\r\n\t\t\tonMouseMove={(event) => {\r\n\t\t\t\tif (!scrollRef.current || !isMouseDown || direction !== \"x\")\r\n\t\t\t\t\treturn;\r\n\t\t\t\tscrollRef.current.scrollLeft += event.movementX * -1;\r\n\t\t\t\tscrollEventSubject.current.next({\r\n\t\t\t\t\tx: scrollRef.current.scrollLeft,\r\n\t\t\t\t\ty: scrollRef.current.scrollTop,\r\n\t\t\t\t});\r\n\t\t\t}}\r\n\t\t\tonScroll={() => {\r\n\t\t\t\tif (!scrollRef.current) return;\r\n\t\t\t\tscrollEventSubject.current.next({\r\n\t\t\t\t\tx: scrollRef.current.scrollLeft,\r\n\t\t\t\t\ty: scrollRef.current.scrollTop,\r\n\t\t\t\t});\r\n\t\t\t}}\r\n\t\t\tclassName={`${className || \"\"} ${isDefaultScrollStyle ? listScroll[\"default-scroll\"] : listScroll[\"list-scroll\"]} ${direction ? listScroll[direction] : \"\"}`}\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default memo(FlexLayoutSplitScreenScrollBox);\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutStickyBox.tsx"],"names":["useRef","useState","useEffect","jsx"],"mappings":"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","file":"FlexLayoutStickyBox.cjs","sourcesContent":["\"use client\";\r\nimport {\r\n\tCSSProperties,\r\n\tFC,\r\n\tHTMLAttributes,\r\n\tReactNode,\r\n\tRefObject,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\ntype Edge = \"auto\" | \"top\" | \"bottom\" | \"left\" | \"right\";\r\n\r\ninterface FlexLayoutStickyBoxProps extends HTMLAttributes<HTMLDivElement> {\r\n\t/** 어느 방향으로 붙일지. 기본은 'auto' (세로 스크롤이면 top, 가로 스크롤이면 left) */\r\n\tedge?: Edge;\r\n\t/** 화면 모서리와의 여백(px). 기본 16 */\r\n\toffset?: number;\r\n\t/** 스크롤 루트. 명시 안 하면 가장 흔한 케이스인 <main> → 없으면 window(=viewport) */\r\n\tscrollRoot?: Element | null;\r\n\t/** 디버그 보조선 표시 */\r\n\tdebug?: boolean;\r\n\t/** 자식 */\r\n\tchildren: ReactNode;\r\n\r\n\tonTranslateChange?: (\r\n\t\tvalue: number,\r\n\t\trootRef: RefObject<HTMLDivElement | null>,\r\n\t\tcontentRef: RefObject<HTMLDivElement | null>,\r\n\t) => void;\r\n}\r\n\r\nfunction clamp(n: number, min: number, max: number) {\r\n\treturn Math.max(min, Math.min(max, n));\r\n}\r\n\r\nfunction pickDefaultScrollRoot(): Element | null {\r\n\tif (typeof document === \"undefined\") return null;\r\n\r\n\tlet el: Element | null = document.body;\r\n\twhile (el && el !== document.documentElement && el !== document.body) {\r\n\t\tconst style = getComputedStyle(el);\r\n\t\tconst oy = style.overflowY;\r\n\t\tconst ox = style.overflowX;\r\n\t\tconst scrollable =\r\n\t\t\toy === \"auto\" ||\r\n\t\t\toy === \"scroll\" ||\r\n\t\t\tox === \"auto\" ||\r\n\t\t\tox === \"scroll\";\r\n\t\tif (scrollable) return el;\r\n\t\tel = el.parentElement;\r\n\t}\r\n\treturn null;\r\n}\r\n\r\nfunction isVerticalScroll(root: Element | null): boolean {\r\n\tif (typeof window == \"undefined\") return true;\r\n\tif (!root) {\r\n\t\treturn document.documentElement.scrollHeight > window.innerHeight + 1;\r\n\t}\r\n\tconst el = root as HTMLElement;\r\n\treturn el.scrollHeight > el.clientHeight + 1;\r\n}\r\n\r\nconst dpr = typeof window != \"undefined\" ? window.devicePixelRatio || 1 : 1;\r\nfunction quantizeToDevicePixel(n: number) {\r\n\treturn Math.round(n * dpr) / dpr;\r\n}\r\n\r\n/**\r\n * FlexLayoutStickyBox\r\n * 부모(실제 경계) 안에서만 움직이며, `transform`을 동적으로 부여해\r\n * “sticky처럼 보이도록” 만든다.\r\n *\r\n * 구조:\r\n * <div data-root> // 이 박스가 부모 경계 안에서 공간을 차지\r\n * <div data-content> // 이 박스가 transform으로 부드럽게 움직임\r\n * {children}\r\n * </div>\r\n * </div>\r\n */\r\nconst FlexLayoutStickyBox: FC<FlexLayoutStickyBoxProps> = ({\r\n\tedge = \"auto\",\r\n\toffset = 16,\r\n\tscrollRoot = null,\r\n\tdebug = false,\r\n\tchildren,\r\n\tstyle,\r\n\tclassName,\r\n\tonTranslateChange = () => {},\r\n\t...rest\r\n}) => {\r\n\tconst offsetRef = useRef(offset);\r\n\tconst rootRef = useRef<HTMLDivElement>(null); // 내가 들어있는 박스(부모의 자식)\r\n\tconst contentRef = useRef<HTMLDivElement>(null); // 실제 내용\r\n\tconst mutatingRef = useRef(false);\r\n\tconst lastOffsetRef = useRef(0);\r\n\tconst [resolvedEdge, setResolvedEdge] = useState<Edge>(\"top\");\r\n\tconst rafId = useRef<number | null>(null);\r\n\r\n\t// 마운트 이후에만(클라이언트에서만) 터치 스타일을 적용\r\n\tconst [contentDynamicStyle, setContentDynamicStyle] =\r\n\t\tuseState<CSSProperties>({});\r\n\tuseEffect(() => {\r\n\t\t// if (\r\n\t\t// typeof navigator !== 'undefined' &&\r\n\t\t// (navigator.maxTouchPoints ?? 0) > 0\r\n\t\t// ) {\r\n\t\tsetContentDynamicStyle({\r\n\t\t\twillChange: \"transform\",\r\n\t\t\ttransition: \"transform 50ms linear\",\r\n\t\t});\r\n\t\t// }\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\toffsetRef.current = offset;\r\n\t\tscheduleUpdate();\r\n\t}, [offset]);\r\n\tconst [ioRoot, setIoRoot] = useState<Element | null>(null);\r\n\tuseEffect(() => {\r\n\t\t// CSR로 전환된 후에 반드시 최신 scroll root를 계산\r\n\t\tconst root = scrollRoot ?? pickDefaultScrollRoot();\r\n\t\tsetResolvedEdge(\r\n\t\t\tedge === \"auto\" ? (isVerticalScroll(root) ? \"top\" : \"left\") : edge,\r\n\t\t);\r\n\r\n\t\tsetIoRoot(root);\r\n\t}, [edge, scrollRoot]);\r\n\tuseEffect(() => {\r\n\t\tif (edge !== \"auto\") {\r\n\t\t\tsetResolvedEdge(edge);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst vertical = isVerticalScroll(ioRoot);\r\n\t\tsetResolvedEdge(vertical ? \"top\" : \"left\");\r\n\t}, [edge, ioRoot]);\r\n\r\n\tuseEffect(() => {}, []);\r\n\r\n\tconst scheduleUpdate = () => {\r\n\t\tif (rafId.current != null) return;\r\n\t\trafId.current = requestAnimationFrame(() => {\r\n\t\t\trafId.current = null;\r\n\t\t\tdoUpdate();\r\n\t\t});\r\n\t};\r\n\r\n\tconst doUpdate = () => {\r\n\t\tif (mutatingRef.current) return;\r\n\t\tmutatingRef.current = true;\r\n\r\n\t\tconst rootEl = rootRef.current;\r\n\t\tconst contentEl = contentRef.current;\r\n\t\tif (!rootEl || !contentEl) {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst parentEl = rootEl.parentElement;\r\n\t\tif (!parentEl) {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst rootBounds =\r\n\t\t\tioRoot && \"getBoundingClientRect\" in ioRoot\r\n\t\t\t\t? (ioRoot as Element).getBoundingClientRect()\r\n\t\t\t\t: new DOMRect(0, 0, window.innerWidth, window.innerHeight);\r\n\r\n\t\tconst parentRect = parentEl.getBoundingClientRect();\r\n\t\tconst contentRect = contentEl.getBoundingClientRect();\r\n\r\n\t\tlet newOffset = 0;\r\n\r\n\t\tif (resolvedEdge === \"top\" || resolvedEdge === \"bottom\") {\r\n\t\t\tconst maxTranslate = Math.max(\r\n\t\t\t\t0,\r\n\t\t\t\tparentRect.height - contentRect.height,\r\n\t\t\t);\r\n\t\t\tlet desiredTop = 0;\r\n\r\n\t\t\tif (resolvedEdge === \"top\") {\r\n\t\t\t\tdesiredTop =\r\n\t\t\t\t\trootBounds.top + offsetRef.current - parentRect.top;\r\n\t\t\t} else {\r\n\t\t\t\t// bottom\r\n\t\t\t\tconst targetBottomFromParentTop =\r\n\t\t\t\t\tMath.min(\r\n\t\t\t\t\t\tparentRect.bottom,\r\n\t\t\t\t\t\trootBounds.bottom - offsetRef.current,\r\n\t\t\t\t\t) - parentRect.top;\r\n\t\t\t\tdesiredTop = targetBottomFromParentTop - contentRect.height;\r\n\t\t\t}\r\n\t\t\tnewOffset = clamp(desiredTop, 0, maxTranslate);\r\n\t\t} else {\r\n\t\t\t// left or right\r\n\t\t\tconst maxTranslate = Math.max(\r\n\t\t\t\t0,\r\n\t\t\t\tparentRect.width - contentRect.width,\r\n\t\t\t);\r\n\t\t\tlet desiredLeft = 0;\r\n\r\n\t\t\tif (resolvedEdge === \"left\") {\r\n\t\t\t\tdesiredLeft =\r\n\t\t\t\t\trootBounds.left + offsetRef.current - parentRect.left;\r\n\t\t\t} else {\r\n\t\t\t\t// right\r\n\t\t\t\tconst targetRightFromParentLeft =\r\n\t\t\t\t\tMath.min(\r\n\t\t\t\t\t\tparentRect.right,\r\n\t\t\t\t\t\trootBounds.right - offsetRef.current,\r\n\t\t\t\t\t) - parentRect.left;\r\n\t\t\t\tdesiredLeft = targetRightFromParentLeft - contentRect.width;\r\n\t\t\t}\r\n\t\t\tnewOffset = clamp(desiredLeft, 0, maxTranslate);\r\n\t\t}\r\n\r\n\t\tconst nextOffset = quantizeToDevicePixel(newOffset);\r\n\r\n\t\t// 변화가 거의 없으면 업데이트 건너뛰기 (미세한 떨림 방지)\r\n\t\tif (Math.abs(lastOffsetRef.current - nextOffset) > 0.5) {\r\n\t\t\tif (resolvedEdge === \"top\" || resolvedEdge === \"bottom\") {\r\n\t\t\t\tcontentEl.style.transform = `translateY(${nextOffset}px)`;\r\n\t\t\t} else {\r\n\t\t\t\tcontentEl.style.transform = `translateX(${nextOffset}px)`;\r\n\t\t\t}\r\n\t\t\tlastOffsetRef.current = nextOffset;\r\n\t\t\tonTranslateChange(nextOffset, rootRef, contentRef);\r\n\t\t}\r\n\r\n\t\tif (debug) {\r\n\t\t\trootEl.style.outline = \"1px dashed rgba(0,0,0,.2)\";\r\n\t\t\tcontentEl.style.outline = \"1px solid rgba(0,128,255,.35)\";\r\n\t\t}\r\n\r\n\t\tqueueMicrotask(() => {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t});\r\n\t};\r\n\r\n\t// IntersectionObserver, ResizeObserver, Event Listeners 설정\r\n\tuseEffect(() => {\r\n\t\tif (typeof window == \"undefined\") return;\r\n\t\tconst rootEl = rootRef.current;\r\n\t\tif (!rootEl) return;\r\n\r\n\t\tconst parentEl = rootEl.parentElement;\r\n\r\n\t\tconsole.log(parentEl);\r\n\t\tif (!parentEl) return;\r\n\r\n\t\tconst targets: Element[] = [parentEl];\r\n\r\n\t\tconst observerCallback = () => {\r\n\t\t\tif (!mutatingRef.current) scheduleUpdate();\r\n\t\t};\r\n\r\n\t\tconst io = new IntersectionObserver(observerCallback, {\r\n\t\t\troot: ioRoot instanceof Element ? ioRoot : null,\r\n\t\t\tthreshold: 0,\r\n\t\t\trootMargin: \"1px\",\r\n\t\t});\r\n\r\n\t\tconst ro = new ResizeObserver(observerCallback);\r\n\r\n\t\ttargets.forEach((t) => io.observe(t));\r\n\t\tro.observe(parentEl);\r\n\t\tif (contentRef.current) {\r\n\t\t\tro.observe(contentRef.current);\r\n\t\t}\r\n\r\n\t\tconst scrollTarget = ioRoot || window;\r\n\t\tscrollTarget.addEventListener(\"scroll\", scheduleUpdate, {\r\n\t\t\tpassive: true,\r\n\t\t});\r\n\t\twindow.addEventListener(\"resize\", scheduleUpdate);\r\n\r\n\t\t// 최초 1회 계산\r\n\t\tscheduleUpdate();\r\n\r\n\t\treturn () => {\r\n\t\t\tio.disconnect();\r\n\t\t\tro.disconnect();\r\n\t\t\tscrollTarget.removeEventListener(\"scroll\", scheduleUpdate);\r\n\t\t\twindow.removeEventListener(\"resize\", scheduleUpdate);\r\n\t\t\tif (rafId.current != null) {\r\n\t\t\t\tcancelAnimationFrame(rafId.current);\r\n\t\t\t\trafId.current = null;\r\n\t\t\t}\r\n\t\t};\r\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\r\n\t}, [ioRoot, resolvedEdge, offset, debug]);\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tref={rootRef}\r\n\t\t\tclassName={className}\r\n\t\t\tstyle={{\r\n\t\t\t\tdisplay: \"block\",\r\n\t\t\t\tminWidth: 0,\r\n\t\t\t\tminHeight: 0,\r\n\t\t\t\theight: \"100%\", // 부모 높이를 채우도록 설정\r\n\t\t\t\t...style,\r\n\t\t\t}}\r\n\t\t\t{...rest}\r\n\t\t>\r\n\t\t\t<div\r\n\t\t\t\tref={contentRef}\r\n\t\t\t\t// SSR/클라이언트 첫 렌더 동일 → 마운트 후에만 스타일 부여\r\n\t\t\t\tstyle={contentDynamicStyle}\r\n\t\t\t>\r\n\t\t\t\t{children}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default FlexLayoutStickyBox;\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutStickyBox.tsx"],"names":[],"mappings":"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","file":"FlexLayoutStickyBox.js","sourcesContent":["\"use client\";\r\nimport {\r\n\tCSSProperties,\r\n\tFC,\r\n\tHTMLAttributes,\r\n\tReactNode,\r\n\tRefObject,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\ntype Edge = \"auto\" | \"top\" | \"bottom\" | \"left\" | \"right\";\r\n\r\ninterface FlexLayoutStickyBoxProps extends HTMLAttributes<HTMLDivElement> {\r\n\t/** 어느 방향으로 붙일지. 기본은 'auto' (세로 스크롤이면 top, 가로 스크롤이면 left) */\r\n\tedge?: Edge;\r\n\t/** 화면 모서리와의 여백(px). 기본 16 */\r\n\toffset?: number;\r\n\t/** 스크롤 루트. 명시 안 하면 가장 흔한 케이스인 <main> → 없으면 window(=viewport) */\r\n\tscrollRoot?: Element | null;\r\n\t/** 디버그 보조선 표시 */\r\n\tdebug?: boolean;\r\n\t/** 자식 */\r\n\tchildren: ReactNode;\r\n\r\n\tonTranslateChange?: (\r\n\t\tvalue: number,\r\n\t\trootRef: RefObject<HTMLDivElement | null>,\r\n\t\tcontentRef: RefObject<HTMLDivElement | null>,\r\n\t) => void;\r\n}\r\n\r\nfunction clamp(n: number, min: number, max: number) {\r\n\treturn Math.max(min, Math.min(max, n));\r\n}\r\n\r\nfunction pickDefaultScrollRoot(): Element | null {\r\n\tif (typeof document === \"undefined\") return null;\r\n\r\n\tlet el: Element | null = document.body;\r\n\twhile (el && el !== document.documentElement && el !== document.body) {\r\n\t\tconst style = getComputedStyle(el);\r\n\t\tconst oy = style.overflowY;\r\n\t\tconst ox = style.overflowX;\r\n\t\tconst scrollable =\r\n\t\t\toy === \"auto\" ||\r\n\t\t\toy === \"scroll\" ||\r\n\t\t\tox === \"auto\" ||\r\n\t\t\tox === \"scroll\";\r\n\t\tif (scrollable) return el;\r\n\t\tel = el.parentElement;\r\n\t}\r\n\treturn null;\r\n}\r\n\r\nfunction isVerticalScroll(root: Element | null): boolean {\r\n\tif (typeof window == \"undefined\") return true;\r\n\tif (!root) {\r\n\t\treturn document.documentElement.scrollHeight > window.innerHeight + 1;\r\n\t}\r\n\tconst el = root as HTMLElement;\r\n\treturn el.scrollHeight > el.clientHeight + 1;\r\n}\r\n\r\nconst dpr = typeof window != \"undefined\" ? window.devicePixelRatio || 1 : 1;\r\nfunction quantizeToDevicePixel(n: number) {\r\n\treturn Math.round(n * dpr) / dpr;\r\n}\r\n\r\n/**\r\n * FlexLayoutStickyBox\r\n * 부모(실제 경계) 안에서만 움직이며, `transform`을 동적으로 부여해\r\n * “sticky처럼 보이도록” 만든다.\r\n *\r\n * 구조:\r\n * <div data-root> // 이 박스가 부모 경계 안에서 공간을 차지\r\n * <div data-content> // 이 박스가 transform으로 부드럽게 움직임\r\n * {children}\r\n * </div>\r\n * </div>\r\n */\r\nconst FlexLayoutStickyBox: FC<FlexLayoutStickyBoxProps> = ({\r\n\tedge = \"auto\",\r\n\toffset = 16,\r\n\tscrollRoot = null,\r\n\tdebug = false,\r\n\tchildren,\r\n\tstyle,\r\n\tclassName,\r\n\tonTranslateChange = () => {},\r\n\t...rest\r\n}) => {\r\n\tconst offsetRef = useRef(offset);\r\n\tconst rootRef = useRef<HTMLDivElement>(null); // 내가 들어있는 박스(부모의 자식)\r\n\tconst contentRef = useRef<HTMLDivElement>(null); // 실제 내용\r\n\tconst mutatingRef = useRef(false);\r\n\tconst lastOffsetRef = useRef(0);\r\n\tconst [resolvedEdge, setResolvedEdge] = useState<Edge>(\"top\");\r\n\tconst rafId = useRef<number | null>(null);\r\n\r\n\t// 마운트 이후에만(클라이언트에서만) 터치 스타일을 적용\r\n\tconst [contentDynamicStyle, setContentDynamicStyle] =\r\n\t\tuseState<CSSProperties>({});\r\n\tuseEffect(() => {\r\n\t\t// if (\r\n\t\t// typeof navigator !== 'undefined' &&\r\n\t\t// (navigator.maxTouchPoints ?? 0) > 0\r\n\t\t// ) {\r\n\t\tsetContentDynamicStyle({\r\n\t\t\twillChange: \"transform\",\r\n\t\t\ttransition: \"transform 50ms linear\",\r\n\t\t});\r\n\t\t// }\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\toffsetRef.current = offset;\r\n\t\tscheduleUpdate();\r\n\t}, [offset]);\r\n\tconst [ioRoot, setIoRoot] = useState<Element | null>(null);\r\n\tuseEffect(() => {\r\n\t\t// CSR로 전환된 후에 반드시 최신 scroll root를 계산\r\n\t\tconst root = scrollRoot ?? pickDefaultScrollRoot();\r\n\t\tsetResolvedEdge(\r\n\t\t\tedge === \"auto\" ? (isVerticalScroll(root) ? \"top\" : \"left\") : edge,\r\n\t\t);\r\n\r\n\t\tsetIoRoot(root);\r\n\t}, [edge, scrollRoot]);\r\n\tuseEffect(() => {\r\n\t\tif (edge !== \"auto\") {\r\n\t\t\tsetResolvedEdge(edge);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst vertical = isVerticalScroll(ioRoot);\r\n\t\tsetResolvedEdge(vertical ? \"top\" : \"left\");\r\n\t}, [edge, ioRoot]);\r\n\r\n\tuseEffect(() => {}, []);\r\n\r\n\tconst scheduleUpdate = () => {\r\n\t\tif (rafId.current != null) return;\r\n\t\trafId.current = requestAnimationFrame(() => {\r\n\t\t\trafId.current = null;\r\n\t\t\tdoUpdate();\r\n\t\t});\r\n\t};\r\n\r\n\tconst doUpdate = () => {\r\n\t\tif (mutatingRef.current) return;\r\n\t\tmutatingRef.current = true;\r\n\r\n\t\tconst rootEl = rootRef.current;\r\n\t\tconst contentEl = contentRef.current;\r\n\t\tif (!rootEl || !contentEl) {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst parentEl = rootEl.parentElement;\r\n\t\tif (!parentEl) {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst rootBounds =\r\n\t\t\tioRoot && \"getBoundingClientRect\" in ioRoot\r\n\t\t\t\t? (ioRoot as Element).getBoundingClientRect()\r\n\t\t\t\t: new DOMRect(0, 0, window.innerWidth, window.innerHeight);\r\n\r\n\t\tconst parentRect = parentEl.getBoundingClientRect();\r\n\t\tconst contentRect = contentEl.getBoundingClientRect();\r\n\r\n\t\tlet newOffset = 0;\r\n\r\n\t\tif (resolvedEdge === \"top\" || resolvedEdge === \"bottom\") {\r\n\t\t\tconst maxTranslate = Math.max(\r\n\t\t\t\t0,\r\n\t\t\t\tparentRect.height - contentRect.height,\r\n\t\t\t);\r\n\t\t\tlet desiredTop = 0;\r\n\r\n\t\t\tif (resolvedEdge === \"top\") {\r\n\t\t\t\tdesiredTop =\r\n\t\t\t\t\trootBounds.top + offsetRef.current - parentRect.top;\r\n\t\t\t} else {\r\n\t\t\t\t// bottom\r\n\t\t\t\tconst targetBottomFromParentTop =\r\n\t\t\t\t\tMath.min(\r\n\t\t\t\t\t\tparentRect.bottom,\r\n\t\t\t\t\t\trootBounds.bottom - offsetRef.current,\r\n\t\t\t\t\t) - parentRect.top;\r\n\t\t\t\tdesiredTop = targetBottomFromParentTop - contentRect.height;\r\n\t\t\t}\r\n\t\t\tnewOffset = clamp(desiredTop, 0, maxTranslate);\r\n\t\t} else {\r\n\t\t\t// left or right\r\n\t\t\tconst maxTranslate = Math.max(\r\n\t\t\t\t0,\r\n\t\t\t\tparentRect.width - contentRect.width,\r\n\t\t\t);\r\n\t\t\tlet desiredLeft = 0;\r\n\r\n\t\t\tif (resolvedEdge === \"left\") {\r\n\t\t\t\tdesiredLeft =\r\n\t\t\t\t\trootBounds.left + offsetRef.current - parentRect.left;\r\n\t\t\t} else {\r\n\t\t\t\t// right\r\n\t\t\t\tconst targetRightFromParentLeft =\r\n\t\t\t\t\tMath.min(\r\n\t\t\t\t\t\tparentRect.right,\r\n\t\t\t\t\t\trootBounds.right - offsetRef.current,\r\n\t\t\t\t\t) - parentRect.left;\r\n\t\t\t\tdesiredLeft = targetRightFromParentLeft - contentRect.width;\r\n\t\t\t}\r\n\t\t\tnewOffset = clamp(desiredLeft, 0, maxTranslate);\r\n\t\t}\r\n\r\n\t\tconst nextOffset = quantizeToDevicePixel(newOffset);\r\n\r\n\t\t// 변화가 거의 없으면 업데이트 건너뛰기 (미세한 떨림 방지)\r\n\t\tif (Math.abs(lastOffsetRef.current - nextOffset) > 0.5) {\r\n\t\t\tif (resolvedEdge === \"top\" || resolvedEdge === \"bottom\") {\r\n\t\t\t\tcontentEl.style.transform = `translateY(${nextOffset}px)`;\r\n\t\t\t} else {\r\n\t\t\t\tcontentEl.style.transform = `translateX(${nextOffset}px)`;\r\n\t\t\t}\r\n\t\t\tlastOffsetRef.current = nextOffset;\r\n\t\t\tonTranslateChange(nextOffset, rootRef, contentRef);\r\n\t\t}\r\n\r\n\t\tif (debug) {\r\n\t\t\trootEl.style.outline = \"1px dashed rgba(0,0,0,.2)\";\r\n\t\t\tcontentEl.style.outline = \"1px solid rgba(0,128,255,.35)\";\r\n\t\t}\r\n\r\n\t\tqueueMicrotask(() => {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t});\r\n\t};\r\n\r\n\t// IntersectionObserver, ResizeObserver, Event Listeners 설정\r\n\tuseEffect(() => {\r\n\t\tif (typeof window == \"undefined\") return;\r\n\t\tconst rootEl = rootRef.current;\r\n\t\tif (!rootEl) return;\r\n\r\n\t\tconst parentEl = rootEl.parentElement;\r\n\r\n\t\tconsole.log(parentEl);\r\n\t\tif (!parentEl) return;\r\n\r\n\t\tconst targets: Element[] = [parentEl];\r\n\r\n\t\tconst observerCallback = () => {\r\n\t\t\tif (!mutatingRef.current) scheduleUpdate();\r\n\t\t};\r\n\r\n\t\tconst io = new IntersectionObserver(observerCallback, {\r\n\t\t\troot: ioRoot instanceof Element ? ioRoot : null,\r\n\t\t\tthreshold: 0,\r\n\t\t\trootMargin: \"1px\",\r\n\t\t});\r\n\r\n\t\tconst ro = new ResizeObserver(observerCallback);\r\n\r\n\t\ttargets.forEach((t) => io.observe(t));\r\n\t\tro.observe(parentEl);\r\n\t\tif (contentRef.current) {\r\n\t\t\tro.observe(contentRef.current);\r\n\t\t}\r\n\r\n\t\tconst scrollTarget = ioRoot || window;\r\n\t\tscrollTarget.addEventListener(\"scroll\", scheduleUpdate, {\r\n\t\t\tpassive: true,\r\n\t\t});\r\n\t\twindow.addEventListener(\"resize\", scheduleUpdate);\r\n\r\n\t\t// 최초 1회 계산\r\n\t\tscheduleUpdate();\r\n\r\n\t\treturn () => {\r\n\t\t\tio.disconnect();\r\n\t\t\tro.disconnect();\r\n\t\t\tscrollTarget.removeEventListener(\"scroll\", scheduleUpdate);\r\n\t\t\twindow.removeEventListener(\"resize\", scheduleUpdate);\r\n\t\t\tif (rafId.current != null) {\r\n\t\t\t\tcancelAnimationFrame(rafId.current);\r\n\t\t\t\trafId.current = null;\r\n\t\t\t}\r\n\t\t};\r\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\r\n\t}, [ioRoot, resolvedEdge, offset, debug]);\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tref={rootRef}\r\n\t\t\tclassName={className}\r\n\t\t\tstyle={{\r\n\t\t\t\tdisplay: \"block\",\r\n\t\t\t\tminWidth: 0,\r\n\t\t\t\tminHeight: 0,\r\n\t\t\t\theight: \"100%\", // 부모 높이를 채우도록 설정\r\n\t\t\t\t...style,\r\n\t\t\t}}\r\n\t\t\t{...rest}\r\n\t\t>\r\n\t\t\t<div\r\n\t\t\t\tref={contentRef}\r\n\t\t\t\t// SSR/클라이언트 첫 렌더 동일 → 마운트 후에만 스타일 부여\r\n\t\t\t\tstyle={contentDynamicStyle}\r\n\t\t\t>\r\n\t\t\t\t{children}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default FlexLayoutStickyBox;\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs","sourcesContent":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs","sourcesContent":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useDrag.ts"],"names":["Subject","useRef","useEffect","map","distinctUntilChanged","equal","useState","BehaviorSubject","useCallback","getClientXy","setFolderEvent"],"mappings":"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","file":"useDrag.cjs","sourcesContent":["import equal from \"fast-deep-equal\";\r\nimport {\r\n\tMouseEvent,\r\n\tReactElement,\r\n\tRefObject,\r\n\tTouchEvent,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport { BehaviorSubject, distinctUntilChanged, map, Subject } from \"rxjs\";\r\nimport { DropDocumentOutsideOption } from \"../components/FlexLayoutSplitScreenDragBox\";\r\nimport { getClientXy } from \"../utils/FlexLayoutUtils\";\r\nexport interface DragStateType {\r\n\tisDragging: boolean;\r\n\tisDrop: boolean;\r\n\tnavigationTitle?: string;\r\n\tchildren?: ReactElement;\r\n\tcontainerName: string;\r\n\tx: number;\r\n\ty: number;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tscreenKey?: string;\r\n\tcustomData?: Record<string, string | number | boolean | undefined>;\r\n}\r\nexport type PositionName =\r\n\t| \"centerBoundary\"\r\n\t| \"leftBoundary\"\r\n\t| \"rightBoundary\"\r\n\t| \"topBoundary\"\r\n\t| \"bottomBoundary\";\r\n\r\nexport interface DragStateResultType extends DragStateType {\r\n\tpositionName: PositionName;\r\n\tisOver: boolean;\r\n}\r\nexport const dragState = new Subject<DragStateType>();\r\nconst filterChildren = (obj: any) => {\r\n\t// 객체 복사 후 children 속성 제거\r\n\tconst { children, ...rest } = obj || {};\r\n\treturn rest;\r\n};\r\n\r\nexport const useDragCapture = (targetRef: RefObject<HTMLElement | null>) => {\r\n\tconst stateRef = useRef<DragStateResultType | null>(null); // 상태를 저장하는 useRef\r\n\tconst forceUpdate = useRef(0); // 강제로 업데이트를 트리거하기 위한 변수\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscription = dragState\r\n\t\t\t.pipe(\r\n\t\t\t\tmap((value) => {\r\n\t\t\t\t\tif (!targetRef || !targetRef.current) return null;\r\n\r\n\t\t\t\t\tconst { x, y } = value;\r\n\t\t\t\t\tconst rect = targetRef.current.getBoundingClientRect();\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\twidth,\r\n\t\t\t\t\t\theight,\r\n\t\t\t\t\t\tx: rectX,\r\n\t\t\t\t\t\ty: rectY,\r\n\t\t\t\t\t\tright,\r\n\t\t\t\t\t\tbottom,\r\n\t\t\t\t\t} = rect;\r\n\r\n\t\t\t\t\tlet isOver = false;\r\n\t\t\t\t\tif (x < rectX || x > right || y < rectY || y > bottom) {\r\n\t\t\t\t\t\tisOver = true;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst leftBoundary = rectX + width * 0.2;\r\n\t\t\t\t\tconst rightBoundary = right - width * 0.2;\r\n\t\t\t\t\tconst topBoundary = rectY + height * 0.2;\r\n\t\t\t\t\tconst bottomBoundary = bottom - height * 0.2;\r\n\r\n\t\t\t\t\tlet position = \"centerBoundary\";\r\n\t\t\t\t\tif (x < leftBoundary) {\r\n\t\t\t\t\t\tposition = \"leftBoundary\";\r\n\t\t\t\t\t} else if (x > rightBoundary) {\r\n\t\t\t\t\t\tposition = \"rightBoundary\";\r\n\t\t\t\t\t} else if (y < topBoundary) {\r\n\t\t\t\t\t\tposition = \"topBoundary\";\r\n\t\t\t\t\t} else if (y > bottomBoundary) {\r\n\t\t\t\t\t\tposition = \"bottomBoundary\";\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\treturn {\r\n\t\t\t\t\t\tpositionName: position as PositionName,\r\n\t\t\t\t\t\tisOver,\r\n\t\t\t\t\t\t...value,\r\n\t\t\t\t\t};\r\n\t\t\t\t}),\r\n\t\t\t\tdistinctUntilChanged((prev, curr) =>\r\n\t\t\t\t\tequal(filterChildren(prev), filterChildren(curr)),\r\n\t\t\t\t),\r\n\t\t\t)\r\n\t\t\t.subscribe({\r\n\t\t\t\tnext: (value) => {\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tvalue &&\r\n\t\t\t\t\t\t!equal(\r\n\t\t\t\t\t\t\tfilterChildren(stateRef.current),\r\n\t\t\t\t\t\t\tfilterChildren(value),\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tstateRef.current = value; // 상태를 업데이트\r\n\t\t\t\t\t\tforceUpdate.current++; // 업데이트 트리거\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\terror: (err) => console.error(err),\r\n\t\t\t});\r\n\r\n\t\treturn () => subscription.unsubscribe();\r\n\t}, [targetRef]);\r\n\r\n\t// 강제 렌더링을 트리거하기 위한 업데이트\r\n\tconst [, rerender] = useState({});\r\n\tuseEffect(() => {\r\n\t\tconst interval = setInterval(() => {\r\n\t\t\trerender({}); // 변경된 ref 상태를 반영\r\n\t\t}, 50); // 50ms 간격으로 렌더링 반영\r\n\t\treturn () => clearInterval(interval);\r\n\t}, []);\r\n\r\n\treturn stateRef.current;\r\n};\r\nexport interface DropTargetComponent {\r\n\tcontainerName: string;\r\n\tcomponent: ReactElement;\r\n\tnavigationTitle?: string;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey: string;\r\n}\r\nexport type DropPositionOrderName = \"before\" | \"center\" | \"after\";\r\n\r\nexport interface DropMovementEventType {\r\n\tstate: \"remove\" | \"append\" | \"change\";\r\n\ttargetParentLayoutName: string;\r\n\ttargetLayoutName: string;\r\n\ttargetContainerName: string;\r\n\ttargetComponent?: ReactElement;\r\n\tnextContainerName?: string;\r\n\tparentOrderName?: DropPositionOrderName;\r\n\torderName?: DropPositionOrderName;\r\n\tx?: number;\r\n\ty?: number;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tdropTargetComponentEvent?: DropTargetComponentEvent;\r\n}\r\nexport interface DropTargetComponentEvent extends Omit<\r\n\tDropTargetComponent,\r\n\t\"containerName\" | \"component\"\r\n> {\r\n\tdirection: \"row\" | \"column\";\r\n}\r\nexport const dropMovementEventSubject = new Subject<DropMovementEventType>();\r\n\r\nexport const allSplitScreenCount = new BehaviorSubject<number>(0);\r\n\r\nexport const useDragEvents = ({\r\n\tisBlockingActiveInput = false,\r\n}: {\r\n\tisBlockingActiveInput?: boolean;\r\n}) => {\r\n\tconst dragResumeTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\r\n\tconst scrollThreshold = 10; // 이동 거리 임계값\r\n\r\n\tconst isScrolling = useRef<boolean>(false);\r\n\tconst isPending = useRef(false);\r\n\tconst isMouseDown = useRef(false);\r\n\tconst isDragging = useRef(false); // 드래그 상태 플래그\r\n\tconst touchStartX = useRef<number>(0);\r\n\tconst touchStartY = useRef<number>(0);\r\n\r\n\tconst handleStart = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragStartCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent | TouchEvent | Event;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\t// 기존 타이머가 있다면 정리\r\n\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t}\r\n\r\n\t\t\tif (\r\n\t\t\t\t(event.target as HTMLElement).contentEditable === \"true\" ||\r\n\t\t\t\t(isBlockingActiveInput &&\r\n\t\t\t\t\tdocument.activeElement === event.target)\r\n\t\t\t) {\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tif (event.cancelable) {\r\n\t\t\t\tevent.preventDefault(); // cancelable=false 면 자동 skip\r\n\t\t\t}\r\n\t\t\tisPending.current = true;\r\n\t\t\tisMouseDown.current = true;\r\n\t\t\tif (event instanceof globalThis.TouchEvent) {\r\n\t\t\t\tconst touch = event.touches[0];\r\n\t\t\t\ttouchStartX.current = touch.clientX;\r\n\t\t\t\ttouchStartY.current = touch.clientY;\r\n\t\t\t} else if (event instanceof globalThis.MouseEvent) {\r\n\t\t\t\ttouchStartX.current = event.clientX;\r\n\t\t\t\ttouchStartY.current = event.clientY;\r\n\t\t\t}\r\n\t\t\t//event.preventDefault();\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tif (!isPending.current || isScrolling.current) return; // 스크롤 중이면 드래그 취소\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\tisDragging.current = true;\r\n\r\n\t\t\t\tconst xy = getClientXy(event);\r\n\t\t\t\tif (!xy) return;\r\n\r\n\t\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t}, 300);\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\tconst handleMove = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tnotDragCallback,\r\n\t\t\tdragStartCallback,\r\n\t\t\tmoveingCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent | TouchEvent | Event;\r\n\t\t\tnotDragCallback?: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tmoveingCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tif (!isMouseDown.current) return;\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\t\t\tconst deltaX = Math.abs(clientX - touchStartX.current);\r\n\t\t\tconst deltaY = Math.abs(clientY - touchStartY.current);\r\n\r\n\t\t\tif (\r\n\t\t\t\tisPending.current &&\r\n\t\t\t\t(deltaX > scrollThreshold || deltaY > scrollThreshold)\r\n\t\t\t) {\r\n\t\t\t\tisScrolling.current = true; // 스크롤 중으로 설정\r\n\t\t\t\tisPending.current = false; // 드래그 취소\r\n\t\t\t\tisDragging.current = false;\r\n\r\n\t\t\t\tif (notDragCallback)\r\n\t\t\t\t\tnotDragCallback({ x: clientX, y: clientY });\r\n\t\t\t\t//if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\r\n\t\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t\t}\r\n\t\t\t\tdragResumeTimer.current = setTimeout(() => {\r\n\t\t\t\t\tif (!isMouseDown.current) return;\r\n\t\t\t\t\tif (dragStartCallback)\r\n\t\t\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t\t\tisPending.current = true;\r\n\t\t\t\t\tisScrolling.current = false;\r\n\t\t\t\t\thandleStart({ event: _event, dragStartCallback });\r\n\t\t\t\t}, 400);\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tif (!isDragging.current || isPending.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tmoveingCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\tconst handleEnd = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragEndCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent | TouchEvent | Event;\r\n\t\t\tdragEndCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tisScrolling.current = false;\r\n\t\t\tisMouseDown.current = false;\r\n\t\t\tif (isPending.current) {\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tif (!isDragging.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tisDragging.current = false; // 드래그 종료\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\tdragEndCallback({ x: clientX, y: clientY });\r\n\t\t\t// const href = hrefUrlRef.current;\r\n\r\n\t\t\t// if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t\t// //console.log(clientX, clientY);\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption &&\r\n\t\t\t// isDocumentOut({ x: clientX, y: clientY })\r\n\t\t\t// ) {\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption.isNewTap ||\r\n\t\t\t// (!dropDocumentOutsideOption.widthRatio &&\r\n\t\t\t// !dropDocumentOutsideOption.heightRatio)\r\n\t\t\t// ) {\r\n\t\t\t// window.open(href, '_blank');\r\n\t\t\t// } else {\r\n\t\t\t// const width =\r\n\t\t\t// window.innerWidth *\r\n\t\t\t// (dropDocumentOutsideOption.widthRatio || 1);\r\n\t\t\t// const height =\r\n\t\t\t// window.innerHeight *\r\n\t\t\t// (dropDocumentOutsideOption.heightRatio || 1);\r\n\t\t\t// window.open(\r\n\t\t\t// href,\r\n\t\t\t// '_blank',\r\n\t\t\t// `width=${width},height=${height},left=${window.screenLeft - clientX * -1 - width},top=${window.screenTop + clientY}`\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t\t// }\r\n\r\n\t\t\t// dragState.next({\r\n\t\t\t// isDragging: false,\r\n\t\t\t// isDrop: true,\r\n\t\t\t// navigationTitle,\r\n\t\t\t// children: targetComponent,\r\n\t\t\t// x: clientX,\r\n\t\t\t// y: clientY,\r\n\t\t\t// containerName,\r\n\t\t\t// dropDocumentOutsideOption,\r\n\t\t\t// dropEndCallback,\r\n\t\t\t// screenKey,\r\n\t\t\t// customData,\r\n\t\t\t// });\r\n\t\t\t//if (dropEndCallback) dropEndCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\treturn {\r\n\t\thandleStart,\r\n\t\thandleMove,\r\n\t\thandleEnd,\r\n\t};\r\n};\r\n\r\nexport type FolderEventType = {\r\n\ttype: \"new\" | \"sort\" | \"title\" | \"delete\" | \"insert\" | \"update\" | \"next\";\r\n\tisFolder: boolean;\r\n\ttitle: string;\r\n\tsort?: number;\r\n\tparentId?: string;\r\n\tid?: string;\r\n\tnewData?: any;\r\n};\r\n\r\nexport const folderEventSubject = new Subject<FolderEventType>();\r\n\r\nexport const setFolderEvent = (newValue: FolderEventType) => {\r\n\tfolderEventSubject.next(newValue);\r\n};\r\n\r\nexport const useFolderEvent = () => {\r\n\tconst [folderEvent, setFolderEvent] = useState<FolderEventType | null>(\r\n\t\tnull,\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst subscription = folderEventSubject.subscribe((e) => {\r\n\t\t\tif (!e) return;\r\n\t\t\tsetFolderEvent(e);\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tif (subscription) {\r\n\t\t\t\tsubscription.unsubscribe();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\r\n\treturn { folderEvent };\r\n};\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useDrag.ts"],"names":["setFolderEvent"],"mappings":"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","file":"useDrag.js","sourcesContent":["import equal from \"fast-deep-equal\";\r\nimport {\r\n\tMouseEvent,\r\n\tReactElement,\r\n\tRefObject,\r\n\tTouchEvent,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\nimport { BehaviorSubject, distinctUntilChanged, map, Subject } from \"rxjs\";\r\nimport { DropDocumentOutsideOption } from \"../components/FlexLayoutSplitScreenDragBox\";\r\nimport { getClientXy } from \"../utils/FlexLayoutUtils\";\r\nexport interface DragStateType {\r\n\tisDragging: boolean;\r\n\tisDrop: boolean;\r\n\tnavigationTitle?: string;\r\n\tchildren?: ReactElement;\r\n\tcontainerName: string;\r\n\tx: number;\r\n\ty: number;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tscreenKey?: string;\r\n\tcustomData?: Record<string, string | number | boolean | undefined>;\r\n}\r\nexport type PositionName =\r\n\t| \"centerBoundary\"\r\n\t| \"leftBoundary\"\r\n\t| \"rightBoundary\"\r\n\t| \"topBoundary\"\r\n\t| \"bottomBoundary\";\r\n\r\nexport interface DragStateResultType extends DragStateType {\r\n\tpositionName: PositionName;\r\n\tisOver: boolean;\r\n}\r\nexport const dragState = new Subject<DragStateType>();\r\nconst filterChildren = (obj: any) => {\r\n\t// 객체 복사 후 children 속성 제거\r\n\tconst { children, ...rest } = obj || {};\r\n\treturn rest;\r\n};\r\n\r\nexport const useDragCapture = (targetRef: RefObject<HTMLElement | null>) => {\r\n\tconst stateRef = useRef<DragStateResultType | null>(null); // 상태를 저장하는 useRef\r\n\tconst forceUpdate = useRef(0); // 강제로 업데이트를 트리거하기 위한 변수\r\n\r\n\tuseEffect(() => {\r\n\t\tconst subscription = dragState\r\n\t\t\t.pipe(\r\n\t\t\t\tmap((value) => {\r\n\t\t\t\t\tif (!targetRef || !targetRef.current) return null;\r\n\r\n\t\t\t\t\tconst { x, y } = value;\r\n\t\t\t\t\tconst rect = targetRef.current.getBoundingClientRect();\r\n\t\t\t\t\tconst {\r\n\t\t\t\t\t\twidth,\r\n\t\t\t\t\t\theight,\r\n\t\t\t\t\t\tx: rectX,\r\n\t\t\t\t\t\ty: rectY,\r\n\t\t\t\t\t\tright,\r\n\t\t\t\t\t\tbottom,\r\n\t\t\t\t\t} = rect;\r\n\r\n\t\t\t\t\tlet isOver = false;\r\n\t\t\t\t\tif (x < rectX || x > right || y < rectY || y > bottom) {\r\n\t\t\t\t\t\tisOver = true;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst leftBoundary = rectX + width * 0.2;\r\n\t\t\t\t\tconst rightBoundary = right - width * 0.2;\r\n\t\t\t\t\tconst topBoundary = rectY + height * 0.2;\r\n\t\t\t\t\tconst bottomBoundary = bottom - height * 0.2;\r\n\r\n\t\t\t\t\tlet position = \"centerBoundary\";\r\n\t\t\t\t\tif (x < leftBoundary) {\r\n\t\t\t\t\t\tposition = \"leftBoundary\";\r\n\t\t\t\t\t} else if (x > rightBoundary) {\r\n\t\t\t\t\t\tposition = \"rightBoundary\";\r\n\t\t\t\t\t} else if (y < topBoundary) {\r\n\t\t\t\t\t\tposition = \"topBoundary\";\r\n\t\t\t\t\t} else if (y > bottomBoundary) {\r\n\t\t\t\t\t\tposition = \"bottomBoundary\";\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\treturn {\r\n\t\t\t\t\t\tpositionName: position as PositionName,\r\n\t\t\t\t\t\tisOver,\r\n\t\t\t\t\t\t...value,\r\n\t\t\t\t\t};\r\n\t\t\t\t}),\r\n\t\t\t\tdistinctUntilChanged((prev, curr) =>\r\n\t\t\t\t\tequal(filterChildren(prev), filterChildren(curr)),\r\n\t\t\t\t),\r\n\t\t\t)\r\n\t\t\t.subscribe({\r\n\t\t\t\tnext: (value) => {\r\n\t\t\t\t\tif (\r\n\t\t\t\t\t\tvalue &&\r\n\t\t\t\t\t\t!equal(\r\n\t\t\t\t\t\t\tfilterChildren(stateRef.current),\r\n\t\t\t\t\t\t\tfilterChildren(value),\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t) {\r\n\t\t\t\t\t\tstateRef.current = value; // 상태를 업데이트\r\n\t\t\t\t\t\tforceUpdate.current++; // 업데이트 트리거\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\terror: (err) => console.error(err),\r\n\t\t\t});\r\n\r\n\t\treturn () => subscription.unsubscribe();\r\n\t}, [targetRef]);\r\n\r\n\t// 강제 렌더링을 트리거하기 위한 업데이트\r\n\tconst [, rerender] = useState({});\r\n\tuseEffect(() => {\r\n\t\tconst interval = setInterval(() => {\r\n\t\t\trerender({}); // 변경된 ref 상태를 반영\r\n\t\t}, 50); // 50ms 간격으로 렌더링 반영\r\n\t\treturn () => clearInterval(interval);\r\n\t}, []);\r\n\r\n\treturn stateRef.current;\r\n};\r\nexport interface DropTargetComponent {\r\n\tcontainerName: string;\r\n\tcomponent: ReactElement;\r\n\tnavigationTitle?: string;\r\n\tdropDocumentOutsideOption?: DropDocumentOutsideOption;\r\n\tscreenKey: string;\r\n}\r\nexport type DropPositionOrderName = \"before\" | \"center\" | \"after\";\r\n\r\nexport interface DropMovementEventType {\r\n\tstate: \"remove\" | \"append\" | \"change\";\r\n\ttargetParentLayoutName: string;\r\n\ttargetLayoutName: string;\r\n\ttargetContainerName: string;\r\n\ttargetComponent?: ReactElement;\r\n\tnextContainerName?: string;\r\n\tparentOrderName?: DropPositionOrderName;\r\n\torderName?: DropPositionOrderName;\r\n\tx?: number;\r\n\ty?: number;\r\n\tdropEndCallback?: ({\r\n\t\tx,\r\n\t\ty,\r\n\t\tcontainerName,\r\n\t}: {\r\n\t\tx: number;\r\n\t\ty: number;\r\n\t\tcontainerName: string;\r\n\t}) => void;\r\n\tdropTargetComponentEvent?: DropTargetComponentEvent;\r\n}\r\nexport interface DropTargetComponentEvent extends Omit<\r\n\tDropTargetComponent,\r\n\t\"containerName\" | \"component\"\r\n> {\r\n\tdirection: \"row\" | \"column\";\r\n}\r\nexport const dropMovementEventSubject = new Subject<DropMovementEventType>();\r\n\r\nexport const allSplitScreenCount = new BehaviorSubject<number>(0);\r\n\r\nexport const useDragEvents = ({\r\n\tisBlockingActiveInput = false,\r\n}: {\r\n\tisBlockingActiveInput?: boolean;\r\n}) => {\r\n\tconst dragResumeTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\r\n\tconst scrollThreshold = 10; // 이동 거리 임계값\r\n\r\n\tconst isScrolling = useRef<boolean>(false);\r\n\tconst isPending = useRef(false);\r\n\tconst isMouseDown = useRef(false);\r\n\tconst isDragging = useRef(false); // 드래그 상태 플래그\r\n\tconst touchStartX = useRef<number>(0);\r\n\tconst touchStartY = useRef<number>(0);\r\n\r\n\tconst handleStart = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragStartCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent | TouchEvent | Event;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\t// 기존 타이머가 있다면 정리\r\n\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t}\r\n\r\n\t\t\tif (\r\n\t\t\t\t(event.target as HTMLElement).contentEditable === \"true\" ||\r\n\t\t\t\t(isBlockingActiveInput &&\r\n\t\t\t\t\tdocument.activeElement === event.target)\r\n\t\t\t) {\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tif (event.cancelable) {\r\n\t\t\t\tevent.preventDefault(); // cancelable=false 면 자동 skip\r\n\t\t\t}\r\n\t\t\tisPending.current = true;\r\n\t\t\tisMouseDown.current = true;\r\n\t\t\tif (event instanceof globalThis.TouchEvent) {\r\n\t\t\t\tconst touch = event.touches[0];\r\n\t\t\t\ttouchStartX.current = touch.clientX;\r\n\t\t\t\ttouchStartY.current = touch.clientY;\r\n\t\t\t} else if (event instanceof globalThis.MouseEvent) {\r\n\t\t\t\ttouchStartX.current = event.clientX;\r\n\t\t\t\ttouchStartY.current = event.clientY;\r\n\t\t\t}\r\n\t\t\t//event.preventDefault();\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tif (!isPending.current || isScrolling.current) return; // 스크롤 중이면 드래그 취소\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\tisDragging.current = true;\r\n\r\n\t\t\t\tconst xy = getClientXy(event);\r\n\t\t\t\tif (!xy) return;\r\n\r\n\t\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t}, 300);\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\tconst handleMove = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tnotDragCallback,\r\n\t\t\tdragStartCallback,\r\n\t\t\tmoveingCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent | TouchEvent | Event;\r\n\t\t\tnotDragCallback?: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tdragStartCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t\tmoveingCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tif (!isMouseDown.current) return;\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\t\t\tconst deltaX = Math.abs(clientX - touchStartX.current);\r\n\t\t\tconst deltaY = Math.abs(clientY - touchStartY.current);\r\n\r\n\t\t\tif (\r\n\t\t\t\tisPending.current &&\r\n\t\t\t\t(deltaX > scrollThreshold || deltaY > scrollThreshold)\r\n\t\t\t) {\r\n\t\t\t\tisScrolling.current = true; // 스크롤 중으로 설정\r\n\t\t\t\tisPending.current = false; // 드래그 취소\r\n\t\t\t\tisDragging.current = false;\r\n\r\n\t\t\t\tif (notDragCallback)\r\n\t\t\t\t\tnotDragCallback({ x: clientX, y: clientY });\r\n\t\t\t\t//if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\r\n\t\t\t\tif (dragResumeTimer.current) {\r\n\t\t\t\t\tclearTimeout(dragResumeTimer.current);\r\n\t\t\t\t\tdragResumeTimer.current = null;\r\n\t\t\t\t}\r\n\t\t\t\tdragResumeTimer.current = setTimeout(() => {\r\n\t\t\t\t\tif (!isMouseDown.current) return;\r\n\t\t\t\t\tif (dragStartCallback)\r\n\t\t\t\t\t\tdragStartCallback({ x: clientX, y: clientY });\r\n\t\t\t\t\tisPending.current = true;\r\n\t\t\t\t\tisScrolling.current = false;\r\n\t\t\t\t\thandleStart({ event: _event, dragStartCallback });\r\n\t\t\t\t}, 400);\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tif (!isDragging.current || isPending.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tmoveingCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\tconst handleEnd = useCallback(\r\n\t\t({\r\n\t\t\tevent: _event,\r\n\t\t\tdragEndCallback,\r\n\t\t}: {\r\n\t\t\tevent: MouseEvent | TouchEvent | Event;\r\n\t\t\tdragEndCallback: ({ x, y }: { x: number; y: number }) => void;\r\n\t\t}) => {\r\n\t\t\tisScrolling.current = false;\r\n\t\t\tisMouseDown.current = false;\r\n\t\t\tif (isPending.current) {\r\n\t\t\t\tisPending.current = false;\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tconst event = _event instanceof Event ? _event : _event.nativeEvent;\r\n\r\n\t\t\tif (!isDragging.current) return; // 드래그 중이 아닐 경우 무시\r\n\r\n\t\t\tisDragging.current = false; // 드래그 종료\r\n\r\n\t\t\tconst xy = getClientXy(event);\r\n\t\t\tif (!xy) return;\r\n\r\n\t\t\tconst { clientX, clientY } = xy;\r\n\r\n\t\t\tdragEndCallback({ x: clientX, y: clientY });\r\n\t\t\t// const href = hrefUrlRef.current;\r\n\r\n\t\t\t// if (clonedNodeRef.current) clonedNodeRef.current.remove();\r\n\t\t\t// //console.log(clientX, clientY);\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption &&\r\n\t\t\t// isDocumentOut({ x: clientX, y: clientY })\r\n\t\t\t// ) {\r\n\t\t\t// if (\r\n\t\t\t// dropDocumentOutsideOption.isNewTap ||\r\n\t\t\t// (!dropDocumentOutsideOption.widthRatio &&\r\n\t\t\t// !dropDocumentOutsideOption.heightRatio)\r\n\t\t\t// ) {\r\n\t\t\t// window.open(href, '_blank');\r\n\t\t\t// } else {\r\n\t\t\t// const width =\r\n\t\t\t// window.innerWidth *\r\n\t\t\t// (dropDocumentOutsideOption.widthRatio || 1);\r\n\t\t\t// const height =\r\n\t\t\t// window.innerHeight *\r\n\t\t\t// (dropDocumentOutsideOption.heightRatio || 1);\r\n\t\t\t// window.open(\r\n\t\t\t// href,\r\n\t\t\t// '_blank',\r\n\t\t\t// `width=${width},height=${height},left=${window.screenLeft - clientX * -1 - width},top=${window.screenTop + clientY}`\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t\t// }\r\n\r\n\t\t\t// dragState.next({\r\n\t\t\t// isDragging: false,\r\n\t\t\t// isDrop: true,\r\n\t\t\t// navigationTitle,\r\n\t\t\t// children: targetComponent,\r\n\t\t\t// x: clientX,\r\n\t\t\t// y: clientY,\r\n\t\t\t// containerName,\r\n\t\t\t// dropDocumentOutsideOption,\r\n\t\t\t// dropEndCallback,\r\n\t\t\t// screenKey,\r\n\t\t\t// customData,\r\n\t\t\t// });\r\n\t\t\t//if (dropEndCallback) dropEndCallback({ x: clientX, y: clientY });\r\n\t\t},\r\n\t\t[isBlockingActiveInput],\r\n\t);\r\n\r\n\treturn {\r\n\t\thandleStart,\r\n\t\thandleMove,\r\n\t\thandleEnd,\r\n\t};\r\n};\r\n\r\nexport type FolderEventType = {\r\n\ttype: \"new\" | \"sort\" | \"title\" | \"delete\" | \"insert\" | \"update\" | \"next\";\r\n\tisFolder: boolean;\r\n\ttitle: string;\r\n\tsort?: number;\r\n\tparentId?: string;\r\n\tid?: string;\r\n\tnewData?: any;\r\n};\r\n\r\nexport const folderEventSubject = new Subject<FolderEventType>();\r\n\r\nexport const setFolderEvent = (newValue: FolderEventType) => {\r\n\tfolderEventSubject.next(newValue);\r\n};\r\n\r\nexport const useFolderEvent = () => {\r\n\tconst [folderEvent, setFolderEvent] = useState<FolderEventType | null>(\r\n\t\tnull,\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst subscription = folderEventSubject.subscribe((e) => {\r\n\t\t\tif (!e) return;\r\n\t\t\tsetFolderEvent(e);\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\tif (subscription) {\r\n\t\t\t\tsubscription.unsubscribe();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\r\n\treturn { folderEvent };\r\n};\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useFlexLayoutSplitScreen.ts"],"names":["useState","useRef","useDragCapture","useEffect","dropMovementEventSubject"],"mappings":"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","file":"useFlexLayoutSplitScreen.cjs","sourcesContent":["// useFlexLayoutSplitScreen.js\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropTargetComponent,\r\n\tuseDragCapture,\r\n} from \"./useDrag\";\r\n\r\nexport function useFlexLayoutSplitScreen({\r\n\tisSplitInitial = false,\r\n\tparentDirection,\r\n\tdirectionInitial = \"row\",\r\n\tselfContainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n}: {\r\n\tisSplitInitial: boolean;\r\n\tparentDirection?: \"row\" | \"column\" | null;\r\n\tdirectionInitial: \"row\" | \"column\";\r\n\tselfContainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n}) {\r\n\tconst [direction, setDirection] = useState<\"row\" | \"column\">(\r\n\t\tdirectionInitial,\r\n\t);\r\n\r\n\tconst [isSplit, setIsSplit] = useState<boolean>(isSplitInitial);\r\n\tconst [boundaryContainerSize, setBoundaryContainerSize] = useState<{\r\n\t\tleft: string;\r\n\t\ttop: string;\r\n\t\twidth: string;\r\n\t\theight: string;\r\n\t} | null>(null);\r\n\tconst [centerDropTargetComponent, setCenterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [afterDropTargetComponent, setAfterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [beforeDropTargetComponent, setBeforeDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst layoutRef = useRef<HTMLDivElement>(null);\r\n\r\n\tconst dragState = useDragCapture(layoutRef);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!dragState) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst {\r\n\t\t\tisDrop,\r\n\t\t\tisDragging,\r\n\t\t\tpositionName,\r\n\t\t\tcontainerName,\r\n\t\t\tchildren: dropComponent,\r\n\t\t\tisOver,\r\n\t\t\tnavigationTitle,\r\n\t\t\tdropEndCallback,\r\n\t\t\tx,\r\n\t\t\ty,\r\n\t\t\tscreenKey,\r\n\t\t} = dragState;\r\n\t\tconst orderName =\r\n\t\t\tpositionName === \"leftBoundary\" || positionName === \"topBoundary\"\r\n\t\t\t\t? \"before\"\r\n\t\t\t\t: positionName === \"rightBoundary\" ||\r\n\t\t\t\t\t positionName === \"bottomBoundary\"\r\n\t\t\t\t\t? \"after\"\r\n\t\t\t\t\t: \"center\";\r\n\t\t// if (selfContainerName === containerName) {\r\n\t\t// setBoundaryContainerSize(null);\r\n\t\t// return;\r\n\t\t// }\r\n\r\n\t\tif ((isOver || isDrop) && boundaryContainerSize) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t}\r\n\r\n\t\tif (selfContainerName.startsWith(containerName)) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (isDrop && screenKey) {\r\n\t\t\t// if (isDuplication) {\r\n\t\t\t// setDuplicationInfo({ isDuplication, containerName });\r\n\t\t\t// }\r\n\t\t\t// console.log('isDuplication:::', isDuplication);\r\n\t\t\tconst dropDirection =\r\n\t\t\t\tpositionName === \"leftBoundary\" ||\r\n\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t? \"row\"\r\n\t\t\t\t\t: \"column\";\r\n\t\t\t// if (!parentDirection) {\r\n\t\t\t// console.log(isSplit, positionName !== 'centerBoundary', isOver);\r\n\t\t\t// }\r\n\t\t\tif (\r\n\t\t\t\t!isSplit &&\r\n\t\t\t\t!isOver\r\n\t\t\t\t//!isDuplication\r\n\t\t\t) {\r\n\t\t\t\t//setDirection(dropDirection);\r\n\t\t\t\t//if (positionName !== 'centerBoundary') {\r\n\t\t\t\tif (\r\n\t\t\t\t\tpositionName !== \"centerBoundary\" &&\r\n\t\t\t\t\tdropDirection !== parentDirection\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t}\r\n\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\t\t\t\ttargetLayoutName: layoutName,\r\n\t\t\t\t\ttargetComponent: dropComponent,\r\n\t\t\t\t\torderName,\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\tdragState?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t\t// } else {\r\n\t\t\t\t// dropMovementEventSubject.next({\r\n\t\t\t\t// state: 'append',\r\n\t\t\t\t// targetContainerName: containerName,\r\n\t\t\t\t// targetParentLayoutName: parentLayoutName,\r\n\t\t\t\t// targetLayoutName: layoutName,\r\n\t\t\t\t// targetComponent: dropComponent,\r\n\t\t\t\t// orderName: orderName,\r\n\t\t\t\t// x,\r\n\t\t\t\t// y,\r\n\t\t\t\t// dropEndCallback,\r\n\t\t\t\t// dropTargetComponentEvent: {\r\n\t\t\t\t// navigationTitle,\r\n\t\t\t\t// dropDocumentOutsideOption:\r\n\t\t\t\t// dragState?.dropDocumentOutsideOption,\r\n\t\t\t\t// direction: direction,\r\n\t\t\t\t// },\r\n\t\t\t\t// });\r\n\t\t\t\t// }\r\n\t\t\t}\r\n\t\t\t// else if (\r\n\t\t\t// isSplit &&\r\n\t\t\t// positionName !== 'centerBoundary' &&\r\n\t\t\t// !isOver\r\n\t\t\t// ) {\r\n\t\t\t// if (!isFirstSplitUpdatedRef.current) {\r\n\t\t\t// isFirstSplitUpdatedRef.current = true;\r\n\t\t\t// return;\r\n\t\t\t// }\r\n\t\t\t// updateDropTargetComponents(\r\n\t\t\t// positionName,\r\n\t\t\t// containerName,\r\n\t\t\t// dropComponent\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t}\r\n\t\tif (isDragging && !isSplit && !isOver) {\r\n\t\t\tconst newSize = {\r\n\t\t\t\tleft: positionName === \"rightBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\ttop: positionName === \"bottomBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\twidth:\r\n\t\t\t\t\tpositionName === \"leftBoundary\" ||\r\n\t\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t\theight:\r\n\t\t\t\t\tpositionName === \"topBoundary\" ||\r\n\t\t\t\t\tpositionName === \"bottomBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t};\r\n\t\t\t// 이전 상태와 비교\r\n\t\t\tif (\r\n\t\t\t\tJSON.stringify(boundaryContainerSize) !==\r\n\t\t\t\tJSON.stringify(newSize)\r\n\t\t\t) {\r\n\t\t\t\tsetBoundaryContainerSize(newSize);\r\n\t\t\t}\r\n\t\t}\r\n\t}, [\r\n\t\tdragState,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tselfContainerName,\r\n\t\tdirection,\r\n\t]);\r\n\treturn {\r\n\t\tdirection,\r\n\t\tsetDirection,\r\n\t\tisSplit,\r\n\t\tsetIsSplit,\r\n\t\tboundaryContainerSize,\r\n\t\t//setBoundaryContainerSize,\r\n\t\tcenterDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\t//dropTargetComponent,\r\n\t\t//setDropTargetComponent,\r\n\t\t//setDropPosition,\r\n\t\tisOver: dragState?.isOver,\r\n\t\tlayoutRef,\r\n\t};\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useFlexLayoutSplitScreen.ts"],"names":[],"mappings":"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","file":"useFlexLayoutSplitScreen.js","sourcesContent":["// useFlexLayoutSplitScreen.js\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n\tdropMovementEventSubject,\r\n\tDropTargetComponent,\r\n\tuseDragCapture,\r\n} from \"./useDrag\";\r\n\r\nexport function useFlexLayoutSplitScreen({\r\n\tisSplitInitial = false,\r\n\tparentDirection,\r\n\tdirectionInitial = \"row\",\r\n\tselfContainerName,\r\n\tparentLayoutName,\r\n\tlayoutName,\r\n}: {\r\n\tisSplitInitial: boolean;\r\n\tparentDirection?: \"row\" | \"column\" | null;\r\n\tdirectionInitial: \"row\" | \"column\";\r\n\tselfContainerName: string;\r\n\tparentLayoutName: string;\r\n\tlayoutName: string;\r\n}) {\r\n\tconst [direction, setDirection] = useState<\"row\" | \"column\">(\r\n\t\tdirectionInitial,\r\n\t);\r\n\r\n\tconst [isSplit, setIsSplit] = useState<boolean>(isSplitInitial);\r\n\tconst [boundaryContainerSize, setBoundaryContainerSize] = useState<{\r\n\t\tleft: string;\r\n\t\ttop: string;\r\n\t\twidth: string;\r\n\t\theight: string;\r\n\t} | null>(null);\r\n\tconst [centerDropTargetComponent, setCenterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [afterDropTargetComponent, setAfterDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst [beforeDropTargetComponent, setBeforeDropTargetComponent] = useState<\r\n\t\tDropTargetComponent[]\r\n\t>([]);\r\n\tconst layoutRef = useRef<HTMLDivElement>(null);\r\n\r\n\tconst dragState = useDragCapture(layoutRef);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!dragState) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst {\r\n\t\t\tisDrop,\r\n\t\t\tisDragging,\r\n\t\t\tpositionName,\r\n\t\t\tcontainerName,\r\n\t\t\tchildren: dropComponent,\r\n\t\t\tisOver,\r\n\t\t\tnavigationTitle,\r\n\t\t\tdropEndCallback,\r\n\t\t\tx,\r\n\t\t\ty,\r\n\t\t\tscreenKey,\r\n\t\t} = dragState;\r\n\t\tconst orderName =\r\n\t\t\tpositionName === \"leftBoundary\" || positionName === \"topBoundary\"\r\n\t\t\t\t? \"before\"\r\n\t\t\t\t: positionName === \"rightBoundary\" ||\r\n\t\t\t\t\t positionName === \"bottomBoundary\"\r\n\t\t\t\t\t? \"after\"\r\n\t\t\t\t\t: \"center\";\r\n\t\t// if (selfContainerName === containerName) {\r\n\t\t// setBoundaryContainerSize(null);\r\n\t\t// return;\r\n\t\t// }\r\n\r\n\t\tif ((isOver || isDrop) && boundaryContainerSize) {\r\n\t\t\tsetBoundaryContainerSize(null);\r\n\t\t}\r\n\r\n\t\tif (selfContainerName.startsWith(containerName)) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (isDrop && screenKey) {\r\n\t\t\t// if (isDuplication) {\r\n\t\t\t// setDuplicationInfo({ isDuplication, containerName });\r\n\t\t\t// }\r\n\t\t\t// console.log('isDuplication:::', isDuplication);\r\n\t\t\tconst dropDirection =\r\n\t\t\t\tpositionName === \"leftBoundary\" ||\r\n\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t? \"row\"\r\n\t\t\t\t\t: \"column\";\r\n\t\t\t// if (!parentDirection) {\r\n\t\t\t// console.log(isSplit, positionName !== 'centerBoundary', isOver);\r\n\t\t\t// }\r\n\t\t\tif (\r\n\t\t\t\t!isSplit &&\r\n\t\t\t\t!isOver\r\n\t\t\t\t//!isDuplication\r\n\t\t\t) {\r\n\t\t\t\t//setDirection(dropDirection);\r\n\t\t\t\t//if (positionName !== 'centerBoundary') {\r\n\t\t\t\tif (\r\n\t\t\t\t\tpositionName !== \"centerBoundary\" &&\r\n\t\t\t\t\tdropDirection !== parentDirection\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetIsSplit(true);\r\n\t\t\t\t\tsetDirection(dropDirection);\r\n\t\t\t\t}\r\n\t\t\t\tdropMovementEventSubject.next({\r\n\t\t\t\t\tstate: \"append\",\r\n\t\t\t\t\ttargetContainerName: containerName,\r\n\t\t\t\t\ttargetParentLayoutName: parentLayoutName,\r\n\t\t\t\t\ttargetLayoutName: layoutName,\r\n\t\t\t\t\ttargetComponent: dropComponent,\r\n\t\t\t\t\torderName,\r\n\t\t\t\t\tx,\r\n\t\t\t\t\ty,\r\n\t\t\t\t\tdropEndCallback,\r\n\t\t\t\t\tdropTargetComponentEvent: {\r\n\t\t\t\t\t\tnavigationTitle,\r\n\t\t\t\t\t\tdropDocumentOutsideOption:\r\n\t\t\t\t\t\t\tdragState?.dropDocumentOutsideOption,\r\n\t\t\t\t\t\tdirection: dropDirection,\r\n\t\t\t\t\t\tscreenKey,\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t\t// } else {\r\n\t\t\t\t// dropMovementEventSubject.next({\r\n\t\t\t\t// state: 'append',\r\n\t\t\t\t// targetContainerName: containerName,\r\n\t\t\t\t// targetParentLayoutName: parentLayoutName,\r\n\t\t\t\t// targetLayoutName: layoutName,\r\n\t\t\t\t// targetComponent: dropComponent,\r\n\t\t\t\t// orderName: orderName,\r\n\t\t\t\t// x,\r\n\t\t\t\t// y,\r\n\t\t\t\t// dropEndCallback,\r\n\t\t\t\t// dropTargetComponentEvent: {\r\n\t\t\t\t// navigationTitle,\r\n\t\t\t\t// dropDocumentOutsideOption:\r\n\t\t\t\t// dragState?.dropDocumentOutsideOption,\r\n\t\t\t\t// direction: direction,\r\n\t\t\t\t// },\r\n\t\t\t\t// });\r\n\t\t\t\t// }\r\n\t\t\t}\r\n\t\t\t// else if (\r\n\t\t\t// isSplit &&\r\n\t\t\t// positionName !== 'centerBoundary' &&\r\n\t\t\t// !isOver\r\n\t\t\t// ) {\r\n\t\t\t// if (!isFirstSplitUpdatedRef.current) {\r\n\t\t\t// isFirstSplitUpdatedRef.current = true;\r\n\t\t\t// return;\r\n\t\t\t// }\r\n\t\t\t// updateDropTargetComponents(\r\n\t\t\t// positionName,\r\n\t\t\t// containerName,\r\n\t\t\t// dropComponent\r\n\t\t\t// );\r\n\t\t\t// }\r\n\t\t}\r\n\t\tif (isDragging && !isSplit && !isOver) {\r\n\t\t\tconst newSize = {\r\n\t\t\t\tleft: positionName === \"rightBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\ttop: positionName === \"bottomBoundary\" ? \"50%\" : \"0\",\r\n\t\t\t\twidth:\r\n\t\t\t\t\tpositionName === \"leftBoundary\" ||\r\n\t\t\t\t\tpositionName === \"rightBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t\theight:\r\n\t\t\t\t\tpositionName === \"topBoundary\" ||\r\n\t\t\t\t\tpositionName === \"bottomBoundary\"\r\n\t\t\t\t\t\t? \"50%\"\r\n\t\t\t\t\t\t: \"100%\",\r\n\t\t\t};\r\n\t\t\t// 이전 상태와 비교\r\n\t\t\tif (\r\n\t\t\t\tJSON.stringify(boundaryContainerSize) !==\r\n\t\t\t\tJSON.stringify(newSize)\r\n\t\t\t) {\r\n\t\t\t\tsetBoundaryContainerSize(newSize);\r\n\t\t\t}\r\n\t\t}\r\n\t}, [\r\n\t\tdragState,\r\n\t\tisSplit,\r\n\t\tboundaryContainerSize,\r\n\t\tparentLayoutName,\r\n\t\tlayoutName,\r\n\t\tselfContainerName,\r\n\t\tdirection,\r\n\t]);\r\n\treturn {\r\n\t\tdirection,\r\n\t\tsetDirection,\r\n\t\tisSplit,\r\n\t\tsetIsSplit,\r\n\t\tboundaryContainerSize,\r\n\t\t//setBoundaryContainerSize,\r\n\t\tcenterDropTargetComponent,\r\n\t\tafterDropTargetComponent,\r\n\t\tbeforeDropTargetComponent,\r\n\t\tsetAfterDropTargetComponent,\r\n\t\tsetBeforeDropTargetComponent,\r\n\t\tsetCenterDropTargetComponent,\r\n\t\t//dropTargetComponent,\r\n\t\t//setDropTargetComponent,\r\n\t\t//setDropPosition,\r\n\t\tisOver: dragState?.isOver,\r\n\t\tlayoutRef,\r\n\t};\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useListPaging.ts"],"names":["useState","useRef","useCallback","useEffect","observer"],"mappings":"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","file":"useListPaging.cjs","sourcesContent":["import {\r\n\tMutableRefObject,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\nexport type OnReachTerminalType = {\r\n\tisFirst: boolean;\r\n\tisLast: boolean;\r\n\tobserver: IntersectionObserver;\r\n};\r\ninterface UseListPagingForInfinityProps {\r\n\tonReachTerminal?: (onReachTerminalData: OnReachTerminalType) => void;\r\n}\r\nexport const useListPagingForSentinel = <E extends HTMLElement>({\r\n\t//initPageNumber,\r\n\t//initPageSize,\r\n\tonReachTerminal,\r\n}: UseListPagingForInfinityProps): {\r\n\tfirstChildRef: (node: E | null) => void;\r\n\tlastChildRef: (node: E | null) => void;\r\n\t//pageNumber: number;\r\n\t//pageSize: number;\r\n\t//setPageNumber: Dispatch<SetStateAction<number>>;\r\n\t//setPageSize: Dispatch<SetStateAction<number>>;\r\n} => {\r\n\tconst [firstChildNode, setFirstChildNode] = useState<E | null>(null);\r\n\tconst [lastChildNode, setLastChildNode] = useState<E | null>(null);\r\n\tconst observerRef = useRef<IntersectionObserver | null>(null);\r\n\r\n\tconst firstChildRef = useCallback((node: E | null) => {\r\n\t\tsetFirstChildNode(node);\r\n\t}, []);\r\n\r\n\tconst lastChildRef = useCallback((node: E | null) => {\r\n\t\tsetLastChildNode(node);\r\n\t}, []);\r\n\t// 페이지 번호가 변경될 때마다 데이터 로드를 위한 콜백 호출\r\n\r\n\tuseEffect(() => {\r\n\t\tif (firstChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(firstChildNode);\r\n\t\tif (lastChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(lastChildNode);\r\n\t\tconst handleIntersect: IntersectionObserverCallback = (\r\n\t\t\tentries,\r\n\t\t\tobserver,\r\n\t\t) => {\r\n\t\t\tentries.forEach((entry) => {\r\n\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\tif (entry.target === firstChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: true,\r\n\t\t\t\t\t\t\t\tisLast: false,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif (entry.target === lastChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: false,\r\n\t\t\t\t\t\t\t\tisLast: true,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\tconst observer = new IntersectionObserver(handleIntersect, {\r\n\t\t\tthreshold: 0.1,\r\n\t\t});\r\n\r\n\t\tobserverRef.current = observer;\r\n\r\n\t\tif (firstChildNode) observer.observe(firstChildNode);\r\n\t\tif (lastChildNode) observer.observe(lastChildNode);\r\n\r\n\t\treturn () => {\r\n\t\t\tif (observerRef.current) {\r\n\t\t\t\t// if (firstChildNode)\r\n\t\t\t\t// observerRef.current.unobserve(firstChildNode);\r\n\t\t\t\t// if (lastChildNode) observerRef.current.unobserve(lastChildNode);\r\n\t\t\t\tobserverRef.current.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, [firstChildNode, lastChildNode]);\r\n\r\n\treturn {\r\n\t\tfirstChildRef,\r\n\t\tlastChildRef,\r\n\t};\r\n};\r\n\r\nexport const usePaginationViewNumber = ({\r\n\tinitPageNumber,\r\n}: {\r\n\tinitPageNumber: number;\r\n}) => {\r\n\tconst [showCurrentPageNumber, setShowCurrentPageNumber] =\r\n\t\tuseState<number>(initPageNumber);\r\n\r\n\tconst observerRef = useRef<IntersectionObserver | null>(null);\r\n\tconst showCurrentPageObserveTarget = useCallback(\r\n\t\t(node: HTMLElement | null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\t// 아직 observer가 없으면 새로 생성\r\n\t\t\tif (!observerRef.current) {\r\n\t\t\t\tobserverRef.current = new IntersectionObserver(\r\n\t\t\t\t\t(entries) => {\r\n\t\t\t\t\t\tentries.forEach((entry) => {\r\n\t\t\t\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\t\t\t\tconst pageIndexAttr =\r\n\t\t\t\t\t\t\t\t\tentry.target.getAttribute(\r\n\t\t\t\t\t\t\t\t\t\t\"data-page-index\",\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tif (!pageIndexAttr) return;\r\n\t\t\t\t\t\t\t\t// if (!entry.target.hasAttribute('data-is-first'))\r\n\t\t\t\t\t\t\t\t// return;\r\n\t\t\t\t\t\t\t\tconst pageIndex = parseInt(pageIndexAttr, 10);\r\n\t\t\t\t\t\t\t\tsetShowCurrentPageNumber(pageIndex);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t},\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthreshold: 0.1, // 예: 10% 이상 보여야 intersect로 판단\r\n\t\t\t\t\t},\r\n\t\t\t\t);\r\n\t\t\t}\r\n\r\n\t\t\t// 해당 노드를 관찰\r\n\t\t\tobserverRef.current.observe(node);\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst currentObserver = observerRef.current;\r\n\t\treturn () => {\r\n\t\t\tif (currentObserver) {\r\n\t\t\t\tcurrentObserver.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\treturn {\r\n\t\tshowCurrentPageNumber,\r\n\t\tshowCurrentPageObserveTarget,\r\n\t};\r\n};\r\n\r\nexport const usePagingHandler = <T>({\r\n\tlastCallPageNumber,\r\n\tdataListRef,\r\n}: {\r\n\tlastCallPageNumber: number;\r\n\tdataListRef: MutableRefObject<Array<T[] | null>>;\r\n}) => {\r\n\tconst jumpingPageNumberRef = useRef<number | null>(lastCallPageNumber);\r\n\tuseEffect(() => {\r\n\t\tif (jumpingPageNumberRef.current) {\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}, 1000);\r\n\t\t}\r\n\t}, [jumpingPageNumberRef]);\r\n\tconst paginationScrollIntoViewTarget = useRef<\r\n\t\tRecord<number, HTMLDivElement | null>\r\n\t>({});\r\n\tconst pageNumberRef = useRef<number>(lastCallPageNumber);\r\n\r\n\tconst setPaginationRef = useCallback(\r\n\t\t(i: number) => (node: HTMLDivElement | null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\tpaginationScrollIntoViewTarget.current[i] = node;\r\n\r\n\t\t\t// jumpingPageNumberRef에 값이 있고, 그 값이 현재 i와 같으면 스크롤\r\n\t\t\tif (\r\n\t\t\t\tjumpingPageNumberRef.current !== null &&\r\n\t\t\t\ti === jumpingPageNumberRef.current\r\n\t\t\t) {\r\n\t\t\t\tnode.scrollIntoView({\r\n\t\t\t\t\tbehavior: \"instant\", // 필요한 경우 'smooth' 등으로 수정 가능\r\n\t\t\t\t\tblock: \"start\",\r\n\t\t\t\t});\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\r\n\t//스크롤이 “첫 아이템” 혹은 “마지막 아이템”에 닿을 때 호출\r\n\tconst handleReachTerminal = (\r\n\t\t{ isFirst, isLast, observer }: OnReachTerminalType,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// 이미 다른 페이지로 점프 중이면, 중복 호출 방지\r\n\t\tif (dataListRef.current.length === 0) return;\r\n\t\tif (jumpingPageNumberRef.current != null) return;\r\n\t\tif (!isFirst && !isLast) return;\r\n\r\n\t\tconst callPageNumber = isFirst\r\n\t\t\t? Math.max(pageNumberRef.current - 1, 0)\r\n\t\t\t: pageNumberRef.current + 1;\r\n\r\n\t\tif (\r\n\t\t\tdataListRef.current[callPageNumber] != null &&\r\n\t\t\t(dataListRef.current[callPageNumber]?.length || 0) > 0\r\n\t\t)\r\n\t\t\treturn;\r\n\t\tjumpingPageNumberRef.current = callPageNumber;\r\n\t\tsetTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t}, 1000);\r\n\t\tdataCallFetch(callPageNumber);\r\n\t};\r\n\r\n\t//페이지네이션에서 페이지 번호를 직접 클릭했을 시\r\n\tconst handleClickPageChange = (\r\n\t\tpage: number,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// PaginationLayer는 1-based, 내부 로직은 0-based\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tconst pageData = dataListRef.current[page];\r\n\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tif (\r\n\t\t\tpageData != null &&\r\n\t\t\tArray.isArray(pageData) &&\r\n\t\t\tpageData.length > 0\r\n\t\t) {\r\n\t\t\tpaginationScrollIntoViewTarget.current[page]?.scrollIntoView({\r\n\t\t\t\tbehavior: \"smooth\",\r\n\t\t\t\tblock: \"start\",\r\n\t\t\t});\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tjumpingPageNumberRef.current = page;\r\n\t\tsetTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t}, 1000);\r\n\t\tdataCallFetch(page);\r\n\t};\r\n\treturn {\r\n\t\tjumpingPageNumberRef,\r\n\t\tpaginationScrollIntoViewTarget,\r\n\t\tpageNumberRef,\r\n\t\tsetPaginationRef,\r\n\t\thandleReachTerminal,\r\n\t\thandleClickPageChange,\r\n\t};\r\n};\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useListPaging.ts"],"names":["observer"],"mappings":"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","file":"useListPaging.js","sourcesContent":["import {\r\n\tMutableRefObject,\r\n\tuseCallback,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\nexport type OnReachTerminalType = {\r\n\tisFirst: boolean;\r\n\tisLast: boolean;\r\n\tobserver: IntersectionObserver;\r\n};\r\ninterface UseListPagingForInfinityProps {\r\n\tonReachTerminal?: (onReachTerminalData: OnReachTerminalType) => void;\r\n}\r\nexport const useListPagingForSentinel = <E extends HTMLElement>({\r\n\t//initPageNumber,\r\n\t//initPageSize,\r\n\tonReachTerminal,\r\n}: UseListPagingForInfinityProps): {\r\n\tfirstChildRef: (node: E | null) => void;\r\n\tlastChildRef: (node: E | null) => void;\r\n\t//pageNumber: number;\r\n\t//pageSize: number;\r\n\t//setPageNumber: Dispatch<SetStateAction<number>>;\r\n\t//setPageSize: Dispatch<SetStateAction<number>>;\r\n} => {\r\n\tconst [firstChildNode, setFirstChildNode] = useState<E | null>(null);\r\n\tconst [lastChildNode, setLastChildNode] = useState<E | null>(null);\r\n\tconst observerRef = useRef<IntersectionObserver | null>(null);\r\n\r\n\tconst firstChildRef = useCallback((node: E | null) => {\r\n\t\tsetFirstChildNode(node);\r\n\t}, []);\r\n\r\n\tconst lastChildRef = useCallback((node: E | null) => {\r\n\t\tsetLastChildNode(node);\r\n\t}, []);\r\n\t// 페이지 번호가 변경될 때마다 데이터 로드를 위한 콜백 호출\r\n\r\n\tuseEffect(() => {\r\n\t\tif (firstChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(firstChildNode);\r\n\t\tif (lastChildNode && observerRef.current)\r\n\t\t\tobserverRef.current.unobserve(lastChildNode);\r\n\t\tconst handleIntersect: IntersectionObserverCallback = (\r\n\t\t\tentries,\r\n\t\t\tobserver,\r\n\t\t) => {\r\n\t\t\tentries.forEach((entry) => {\r\n\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\tif (entry.target === firstChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: true,\r\n\t\t\t\t\t\t\t\tisLast: false,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif (entry.target === lastChildNode) {\r\n\t\t\t\t\t\tif (onReachTerminal)\r\n\t\t\t\t\t\t\tonReachTerminal({\r\n\t\t\t\t\t\t\t\tisFirst: false,\r\n\t\t\t\t\t\t\t\tisLast: true,\r\n\t\t\t\t\t\t\t\tobserver,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\tconst observer = new IntersectionObserver(handleIntersect, {\r\n\t\t\tthreshold: 0.1,\r\n\t\t});\r\n\r\n\t\tobserverRef.current = observer;\r\n\r\n\t\tif (firstChildNode) observer.observe(firstChildNode);\r\n\t\tif (lastChildNode) observer.observe(lastChildNode);\r\n\r\n\t\treturn () => {\r\n\t\t\tif (observerRef.current) {\r\n\t\t\t\t// if (firstChildNode)\r\n\t\t\t\t// observerRef.current.unobserve(firstChildNode);\r\n\t\t\t\t// if (lastChildNode) observerRef.current.unobserve(lastChildNode);\r\n\t\t\t\tobserverRef.current.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, [firstChildNode, lastChildNode]);\r\n\r\n\treturn {\r\n\t\tfirstChildRef,\r\n\t\tlastChildRef,\r\n\t};\r\n};\r\n\r\nexport const usePaginationViewNumber = ({\r\n\tinitPageNumber,\r\n}: {\r\n\tinitPageNumber: number;\r\n}) => {\r\n\tconst [showCurrentPageNumber, setShowCurrentPageNumber] =\r\n\t\tuseState<number>(initPageNumber);\r\n\r\n\tconst observerRef = useRef<IntersectionObserver | null>(null);\r\n\tconst showCurrentPageObserveTarget = useCallback(\r\n\t\t(node: HTMLElement | null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\t// 아직 observer가 없으면 새로 생성\r\n\t\t\tif (!observerRef.current) {\r\n\t\t\t\tobserverRef.current = new IntersectionObserver(\r\n\t\t\t\t\t(entries) => {\r\n\t\t\t\t\t\tentries.forEach((entry) => {\r\n\t\t\t\t\t\t\tif (entry.isIntersecting) {\r\n\t\t\t\t\t\t\t\tconst pageIndexAttr =\r\n\t\t\t\t\t\t\t\t\tentry.target.getAttribute(\r\n\t\t\t\t\t\t\t\t\t\t\"data-page-index\",\r\n\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\tif (!pageIndexAttr) return;\r\n\t\t\t\t\t\t\t\t// if (!entry.target.hasAttribute('data-is-first'))\r\n\t\t\t\t\t\t\t\t// return;\r\n\t\t\t\t\t\t\t\tconst pageIndex = parseInt(pageIndexAttr, 10);\r\n\t\t\t\t\t\t\t\tsetShowCurrentPageNumber(pageIndex);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t},\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthreshold: 0.1, // 예: 10% 이상 보여야 intersect로 판단\r\n\t\t\t\t\t},\r\n\t\t\t\t);\r\n\t\t\t}\r\n\r\n\t\t\t// 해당 노드를 관찰\r\n\t\t\tobserverRef.current.observe(node);\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\tuseEffect(() => {\r\n\t\tconst currentObserver = observerRef.current;\r\n\t\treturn () => {\r\n\t\t\tif (currentObserver) {\r\n\t\t\t\tcurrentObserver.disconnect();\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\treturn {\r\n\t\tshowCurrentPageNumber,\r\n\t\tshowCurrentPageObserveTarget,\r\n\t};\r\n};\r\n\r\nexport const usePagingHandler = <T>({\r\n\tlastCallPageNumber,\r\n\tdataListRef,\r\n}: {\r\n\tlastCallPageNumber: number;\r\n\tdataListRef: MutableRefObject<Array<T[] | null>>;\r\n}) => {\r\n\tconst jumpingPageNumberRef = useRef<number | null>(lastCallPageNumber);\r\n\tuseEffect(() => {\r\n\t\tif (jumpingPageNumberRef.current) {\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}, 1000);\r\n\t\t}\r\n\t}, [jumpingPageNumberRef]);\r\n\tconst paginationScrollIntoViewTarget = useRef<\r\n\t\tRecord<number, HTMLDivElement | null>\r\n\t>({});\r\n\tconst pageNumberRef = useRef<number>(lastCallPageNumber);\r\n\r\n\tconst setPaginationRef = useCallback(\r\n\t\t(i: number) => (node: HTMLDivElement | null) => {\r\n\t\t\tif (!node) return;\r\n\r\n\t\t\tpaginationScrollIntoViewTarget.current[i] = node;\r\n\r\n\t\t\t// jumpingPageNumberRef에 값이 있고, 그 값이 현재 i와 같으면 스크롤\r\n\t\t\tif (\r\n\t\t\t\tjumpingPageNumberRef.current !== null &&\r\n\t\t\t\ti === jumpingPageNumberRef.current\r\n\t\t\t) {\r\n\t\t\t\tnode.scrollIntoView({\r\n\t\t\t\t\tbehavior: \"instant\", // 필요한 경우 'smooth' 등으로 수정 가능\r\n\t\t\t\t\tblock: \"start\",\r\n\t\t\t\t});\r\n\t\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t\t}\r\n\t\t},\r\n\t\t[],\r\n\t);\r\n\r\n\t//스크롤이 “첫 아이템” 혹은 “마지막 아이템”에 닿을 때 호출\r\n\tconst handleReachTerminal = (\r\n\t\t{ isFirst, isLast, observer }: OnReachTerminalType,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// 이미 다른 페이지로 점프 중이면, 중복 호출 방지\r\n\t\tif (dataListRef.current.length === 0) return;\r\n\t\tif (jumpingPageNumberRef.current != null) return;\r\n\t\tif (!isFirst && !isLast) return;\r\n\r\n\t\tconst callPageNumber = isFirst\r\n\t\t\t? Math.max(pageNumberRef.current - 1, 0)\r\n\t\t\t: pageNumberRef.current + 1;\r\n\r\n\t\tif (\r\n\t\t\tdataListRef.current[callPageNumber] != null &&\r\n\t\t\t(dataListRef.current[callPageNumber]?.length || 0) > 0\r\n\t\t)\r\n\t\t\treturn;\r\n\t\tjumpingPageNumberRef.current = callPageNumber;\r\n\t\tsetTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t}, 1000);\r\n\t\tdataCallFetch(callPageNumber);\r\n\t};\r\n\r\n\t//페이지네이션에서 페이지 번호를 직접 클릭했을 시\r\n\tconst handleClickPageChange = (\r\n\t\tpage: number,\r\n\t\tdataCallFetch: (callPageNumber: number) => void,\r\n\t) => {\r\n\t\t// PaginationLayer는 1-based, 내부 로직은 0-based\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tconst pageData = dataListRef.current[page];\r\n\r\n\t\t// 이미 캐싱된 페이지가 있다면, 스크롤만 이동\r\n\t\tif (\r\n\t\t\tpageData != null &&\r\n\t\t\tArray.isArray(pageData) &&\r\n\t\t\tpageData.length > 0\r\n\t\t) {\r\n\t\t\tpaginationScrollIntoViewTarget.current[page]?.scrollIntoView({\r\n\t\t\t\tbehavior: \"smooth\",\r\n\t\t\t\tblock: \"start\",\r\n\t\t\t});\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tjumpingPageNumberRef.current = page;\r\n\t\tsetTimeout(() => {\r\n\t\t\tjumpingPageNumberRef.current = null;\r\n\t\t}, 1000);\r\n\t\tdataCallFetch(page);\r\n\t};\r\n\treturn {\r\n\t\tjumpingPageNumberRef,\r\n\t\tpaginationScrollIntoViewTarget,\r\n\t\tpageNumberRef,\r\n\t\tsetPaginationRef,\r\n\t\thandleReachTerminal,\r\n\t\thandleClickPageChange,\r\n\t};\r\n};\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useSizes.ts"],"names":["useRef","useState","useLayoutEffect","useEffect","fromEvent","distinctUntilChanged","filter","auditTime"],"mappings":"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","file":"useSizes.cjs","sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState } from \"react\";\r\nimport { auditTime, distinctUntilChanged, filter, fromEvent } from \"rxjs\";\r\n\r\nexport const useSize = (sizeName: \"height\" | \"width\") => {\r\n\tconst ref = useRef<HTMLDivElement>(null);\r\n\tconst [size, setSize] = useState<number | undefined>(undefined);\r\n\r\n\tuseLayoutEffect(() => {\r\n\t\tif (!ref.current) return;\r\n\r\n\t\tconst handleResize = () => {\r\n\t\t\tif (ref.current) {\r\n\t\t\t\tconst newSize = ref.current.getBoundingClientRect()[\r\n\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t] as number;\r\n\t\t\t\tsetSize(newSize);\r\n\t\t\t}\r\n\t\t};\r\n\r\n\t\t// 초기 측정\r\n\t\thandleResize();\r\n\r\n\t\t// ResizeObserver 설정\r\n\t\tconst resizeObserver = new ResizeObserver(() => {\r\n\t\t\thandleResize();\r\n\t\t});\r\n\t\tresizeObserver.observe(ref.current);\r\n\r\n\t\t// 윈도우 리사이즈 이벤트도 청취\r\n\t\twindow.addEventListener(\"resize\", handleResize);\r\n\r\n\t\t// 클린업\r\n\t\treturn () => {\r\n\t\t\tresizeObserver.disconnect();\r\n\t\t\twindow.removeEventListener(\"resize\", handleResize);\r\n\t\t};\r\n\t}, [sizeName]);\r\n\r\n\treturn { ref, size };\r\n};\r\nexport const useFirstChildSize = (sizeName: string) => {\r\n\tconst ref = useRef<HTMLDivElement>(null);\r\n\tconst [sizes, setSizes] = useState<Array<number>>();\r\n\tuseEffect(() => {\r\n\t\tif (!ref.current || !ref.current.children[0]) return;\r\n\t\tif (!sizes || sizes.length === 0) {\r\n\t\t\tsetSizes([\r\n\t\t\t\tref.current.getBoundingClientRect()[\r\n\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t] as number,\r\n\t\t\t\tref.current.children[0].getBoundingClientRect()[\r\n\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t] as number,\r\n\t\t\t]);\r\n\t\t}\r\n\t}, []);\r\n\tuseEffect(() => {\r\n\t\tif (!ref.current || !ref.current.children[0]) return;\r\n\t\tconst childrenChangeObserver = new MutationObserver(\r\n\t\t\t(mutationList, observer) => {\r\n\t\t\t\tmutationList.forEach((mutation) => {\r\n\t\t\t\t\tif (!ref.current || !sizes || !ref.current.children[0])\r\n\t\t\t\t\t\treturn;\r\n\t\t\t\t\tconst newSize = ref.current.getBoundingClientRect()[\r\n\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t] as number;\r\n\t\t\t\t\t//if (newSize === sizes[0]) return;\r\n\t\t\t\t\tsetSizes([\r\n\t\t\t\t\t\tnewSize,\r\n\t\t\t\t\t\tref.current.children[0].getBoundingClientRect()[\r\n\t\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t\t] as number,\r\n\t\t\t\t\t]);\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t);\r\n\t\tchildrenChangeObserver.observe(ref.current, {\r\n\t\t\tchildList: true,\r\n\t\t\tsubtree: true,\r\n\t\t});\r\n\t\tlet isFocus = false;\r\n\r\n\t\tconst windowResizeSubscribe = fromEvent<UIEvent>(window, \"resize\")\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged(),\r\n\t\t\t\tfilter(\r\n\t\t\t\t\t() =>\r\n\t\t\t\t\t\tdocument.activeElement?.tagName !== \"INPUT\" && !isFocus,\r\n\t\t\t\t),\r\n\t\t\t)\r\n\t\t\t.subscribe((ev) => {\r\n\t\t\t\tif (!ref.current || !ref.current.children[0]) return;\r\n\t\t\t\tsetSizes([\r\n\t\t\t\t\tref.current.getBoundingClientRect()[\r\n\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t] as number,\r\n\t\t\t\t\tref.current.children[0].getBoundingClientRect()[\r\n\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t] as number,\r\n\t\t\t\t]);\r\n\t\t\t});\r\n\r\n\t\tconst documentFocusoutSubscribe = fromEvent<FocusEvent>(\r\n\t\t\tdocument,\r\n\t\t\t\"focusout\",\r\n\t\t)\r\n\t\t\t.pipe(\r\n\t\t\t\tauditTime(1000),\r\n\t\t\t\tfilter((ev) => document.activeElement?.tagName !== \"INPUT\"),\r\n\t\t\t)\r\n\t\t\t.subscribe({\r\n\t\t\t\tnext: () => {\r\n\t\t\t\t\tif (isFocus) isFocus = false;\r\n\t\t\t\t},\r\n\t\t\t});\r\n\r\n\t\tconst documentFocusinSubscribe = fromEvent<FocusEvent>(\r\n\t\t\tdocument,\r\n\t\t\t\"focusin\",\r\n\t\t).subscribe({\r\n\t\t\tnext: (ev) =>\r\n\t\t\t\t(isFocus = (ev.target as Element).tagName === \"INPUT\"),\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\twindowResizeSubscribe.unsubscribe();\r\n\t\t\tdocumentFocusoutSubscribe.unsubscribe();\r\n\t\t\tdocumentFocusinSubscribe.unsubscribe();\r\n\t\t\tchildrenChangeObserver.disconnect();\r\n\t\t};\r\n\t}, [sizeName, sizes]);\r\n\treturn { ref, sizes };\r\n};\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/hooks/useSizes.ts"],"names":[],"mappings":"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","file":"useSizes.js","sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState } from \"react\";\r\nimport { auditTime, distinctUntilChanged, filter, fromEvent } from \"rxjs\";\r\n\r\nexport const useSize = (sizeName: \"height\" | \"width\") => {\r\n\tconst ref = useRef<HTMLDivElement>(null);\r\n\tconst [size, setSize] = useState<number | undefined>(undefined);\r\n\r\n\tuseLayoutEffect(() => {\r\n\t\tif (!ref.current) return;\r\n\r\n\t\tconst handleResize = () => {\r\n\t\t\tif (ref.current) {\r\n\t\t\t\tconst newSize = ref.current.getBoundingClientRect()[\r\n\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t] as number;\r\n\t\t\t\tsetSize(newSize);\r\n\t\t\t}\r\n\t\t};\r\n\r\n\t\t// 초기 측정\r\n\t\thandleResize();\r\n\r\n\t\t// ResizeObserver 설정\r\n\t\tconst resizeObserver = new ResizeObserver(() => {\r\n\t\t\thandleResize();\r\n\t\t});\r\n\t\tresizeObserver.observe(ref.current);\r\n\r\n\t\t// 윈도우 리사이즈 이벤트도 청취\r\n\t\twindow.addEventListener(\"resize\", handleResize);\r\n\r\n\t\t// 클린업\r\n\t\treturn () => {\r\n\t\t\tresizeObserver.disconnect();\r\n\t\t\twindow.removeEventListener(\"resize\", handleResize);\r\n\t\t};\r\n\t}, [sizeName]);\r\n\r\n\treturn { ref, size };\r\n};\r\nexport const useFirstChildSize = (sizeName: string) => {\r\n\tconst ref = useRef<HTMLDivElement>(null);\r\n\tconst [sizes, setSizes] = useState<Array<number>>();\r\n\tuseEffect(() => {\r\n\t\tif (!ref.current || !ref.current.children[0]) return;\r\n\t\tif (!sizes || sizes.length === 0) {\r\n\t\t\tsetSizes([\r\n\t\t\t\tref.current.getBoundingClientRect()[\r\n\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t] as number,\r\n\t\t\t\tref.current.children[0].getBoundingClientRect()[\r\n\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t] as number,\r\n\t\t\t]);\r\n\t\t}\r\n\t}, []);\r\n\tuseEffect(() => {\r\n\t\tif (!ref.current || !ref.current.children[0]) return;\r\n\t\tconst childrenChangeObserver = new MutationObserver(\r\n\t\t\t(mutationList, observer) => {\r\n\t\t\t\tmutationList.forEach((mutation) => {\r\n\t\t\t\t\tif (!ref.current || !sizes || !ref.current.children[0])\r\n\t\t\t\t\t\treturn;\r\n\t\t\t\t\tconst newSize = ref.current.getBoundingClientRect()[\r\n\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t] as number;\r\n\t\t\t\t\t//if (newSize === sizes[0]) return;\r\n\t\t\t\t\tsetSizes([\r\n\t\t\t\t\t\tnewSize,\r\n\t\t\t\t\t\tref.current.children[0].getBoundingClientRect()[\r\n\t\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t\t] as number,\r\n\t\t\t\t\t]);\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t);\r\n\t\tchildrenChangeObserver.observe(ref.current, {\r\n\t\t\tchildList: true,\r\n\t\t\tsubtree: true,\r\n\t\t});\r\n\t\tlet isFocus = false;\r\n\r\n\t\tconst windowResizeSubscribe = fromEvent<UIEvent>(window, \"resize\")\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged(),\r\n\t\t\t\tfilter(\r\n\t\t\t\t\t() =>\r\n\t\t\t\t\t\tdocument.activeElement?.tagName !== \"INPUT\" && !isFocus,\r\n\t\t\t\t),\r\n\t\t\t)\r\n\t\t\t.subscribe((ev) => {\r\n\t\t\t\tif (!ref.current || !ref.current.children[0]) return;\r\n\t\t\t\tsetSizes([\r\n\t\t\t\t\tref.current.getBoundingClientRect()[\r\n\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t] as number,\r\n\t\t\t\t\tref.current.children[0].getBoundingClientRect()[\r\n\t\t\t\t\t\tsizeName as keyof DOMRect\r\n\t\t\t\t\t] as number,\r\n\t\t\t\t]);\r\n\t\t\t});\r\n\r\n\t\tconst documentFocusoutSubscribe = fromEvent<FocusEvent>(\r\n\t\t\tdocument,\r\n\t\t\t\"focusout\",\r\n\t\t)\r\n\t\t\t.pipe(\r\n\t\t\t\tauditTime(1000),\r\n\t\t\t\tfilter((ev) => document.activeElement?.tagName !== \"INPUT\"),\r\n\t\t\t)\r\n\t\t\t.subscribe({\r\n\t\t\t\tnext: () => {\r\n\t\t\t\t\tif (isFocus) isFocus = false;\r\n\t\t\t\t},\r\n\t\t\t});\r\n\r\n\t\tconst documentFocusinSubscribe = fromEvent<FocusEvent>(\r\n\t\t\tdocument,\r\n\t\t\t\"focusin\",\r\n\t\t).subscribe({\r\n\t\t\tnext: (ev) =>\r\n\t\t\t\t(isFocus = (ev.target as Element).tagName === \"INPUT\"),\r\n\t\t});\r\n\r\n\t\treturn () => {\r\n\t\t\twindowResizeSubscribe.unsubscribe();\r\n\t\t\tdocumentFocusoutSubscribe.unsubscribe();\r\n\t\t\tdocumentFocusinSubscribe.unsubscribe();\r\n\t\t\tchildrenChangeObserver.disconnect();\r\n\t\t};\r\n\t}, [sizeName, sizes]);\r\n\treturn { ref, sizes };\r\n};\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs","sourcesContent":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/providers/FlexLayoutContext.tsx"],"names":["createContext","useContext","jsx"],"mappings":";;;;;AAKA,MAAM,iBAAA,GAAoBA,oBAA6C,IAAI,CAAA;AAGpE,SAAS,oBAAA,GAAuB;AACtC,EAAA,MAAM,OAAA,GAAUC,iBAAW,iBAAiB,CAAA;AAC5C,EAAA,IAAI,CAAC,OAAA,EAAS;AACb,IAAA,MAAM,IAAI,KAAA;AAAA,MACT;AAAA,KACD;AAAA,EACD;AACA,EAAA,OAAO,OAAA;AACR;AAQO,SAAS,kBAAA,CAAmB;AAAA,EAClC,KAAA;AAAA,EACA;AACD,CAAA,EAA4B;AAC3B,EAAA,uBACCC,cAAA,CAAC,iBAAA,CAAkB,QAAA,EAAlB,EAA2B,OAC1B,QAAA,EACF,CAAA;AAEF","file":"FlexLayoutContext.cjs","sourcesContent":["\"use client\";\r\nimport { createContext, ReactNode, useContext } from \"react\";\r\nimport { FlexLayoutContextValue } from \"../types/FlexLayoutTypes\";\r\n\r\n// Context 생성\r\nconst FlexLayoutContext = createContext<FlexLayoutContextValue | null>(null);\r\n\r\n// Context를 사용하기 위한 Custom Hook\r\nexport function useFlexLayoutContext() {\r\n\tconst context = useContext(FlexLayoutContext);\r\n\tif (!context) {\r\n\t\tthrow new Error(\r\n\t\t\t\"useFlexLayoutContext must be used within FlexLayoutContext.Provider\",\r\n\t\t);\r\n\t}\r\n\treturn context;\r\n}\r\n\r\n// Provider 컴포넌트\r\ninterface FlexLayoutProviderProps {\r\n\tvalue: FlexLayoutContextValue;\r\n\tchildren: ReactNode;\r\n}\r\n\r\nexport function FlexLayoutProvider({\r\n\tvalue,\r\n\tchildren,\r\n}: FlexLayoutProviderProps) {\r\n\treturn (\r\n\t\t<FlexLayoutContext.Provider value={value}>\r\n\t\t\t{children}\r\n\t\t</FlexLayoutContext.Provider>\r\n\t);\r\n}\r\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/flex-layout/providers/FlexLayoutContext.tsx"],"names":[],"mappings":";;;AAKA,MAAM,iBAAA,GAAoB,cAA6C,IAAI,CAAA;AAGpE,SAAS,oBAAA,GAAuB;AACtC,EAAA,MAAM,OAAA,GAAU,WAAW,iBAAiB,CAAA;AAC5C,EAAA,IAAI,CAAC,OAAA,EAAS;AACb,IAAA,MAAM,IAAI,KAAA;AAAA,MACT;AAAA,KACD;AAAA,EACD;AACA,EAAA,OAAO,OAAA;AACR;AAQO,SAAS,kBAAA,CAAmB;AAAA,EAClC,KAAA;AAAA,EACA;AACD,CAAA,EAA4B;AAC3B,EAAA,uBACC,GAAA,CAAC,iBAAA,CAAkB,QAAA,EAAlB,EAA2B,OAC1B,QAAA,EACF,CAAA;AAEF","file":"FlexLayoutContext.js","sourcesContent":["\"use client\";\r\nimport { createContext, ReactNode, useContext } from \"react\";\r\nimport { FlexLayoutContextValue } from \"../types/FlexLayoutTypes\";\r\n\r\n// Context 생성\r\nconst FlexLayoutContext = createContext<FlexLayoutContextValue | null>(null);\r\n\r\n// Context를 사용하기 위한 Custom Hook\r\nexport function useFlexLayoutContext() {\r\n\tconst context = useContext(FlexLayoutContext);\r\n\tif (!context) {\r\n\t\tthrow new Error(\r\n\t\t\t\"useFlexLayoutContext must be used within FlexLayoutContext.Provider\",\r\n\t\t);\r\n\t}\r\n\treturn context;\r\n}\r\n\r\n// Provider 컴포넌트\r\ninterface FlexLayoutProviderProps {\r\n\tvalue: FlexLayoutContextValue;\r\n\tchildren: ReactNode;\r\n}\r\n\r\nexport function FlexLayoutProvider({\r\n\tvalue,\r\n\tchildren,\r\n}: FlexLayoutProviderProps) {\r\n\treturn (\r\n\t\t<FlexLayoutContext.Provider value={value}>\r\n\t\t\t{children}\r\n\t\t</FlexLayoutContext.Provider>\r\n\t);\r\n}\r\n"]}
|