publ-echo-test 0.0.331 → 0.0.332

package/dist/lib/GridItem/GridItem.js

@@ -1,633 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import React, { useEffect, useRef, useState } from "react";
-import { DraggableCore } from "../Draggable";
-import classNames from "../../external-lib/classnames";
-import { calcGridColWidth, calcGridItemPosition, calcGridItemWHPx, calcWH, calcXY, clamp, resolveRowHeight, } from "./utils/calculateUtils";
-import { perc, setTopLeft, setTransform, } from "../GridLayoutEditor/utils/renderHelpers";
-import { Resizable } from "../Resizable";
-var GridItem = function (_a) {
-    var _b;
-    var children = _a.children, props = __rest(_a, ["children"]);
-    var resizeHandle = props.resizeHandle, cols = props.cols, zOrder = props.zOrder, zOrderInternal = props.zOrderInternal, isDraggable = props.isDraggable, _c = props.transformScale, transformScale = _c === void 0 ? 1 : _c, isResizable = props.isResizable, useCSSTransforms = props.useCSSTransforms, className = props.className, _d = props.cancel, cancel = _d === void 0 ? "" : _d, _e = props.handle, handle = _e === void 0 ? "" : _e, x = props.x, y = props.y, z = props.z, w = props.w, h = props.h, _f = props.minH, minH = _f === void 0 ? 1 : _f, _g = props.minW, minW = _g === void 0 ? 1 : _g, _h = props.maxH, maxH = _h === void 0 ? Infinity : _h, _j = props.maxW, maxW = _j === void 0 ? Infinity : _j, i = props.i, _k = props.isHiddenVisibility, isHiddenVisibility = _k === void 0 ? false : _k, containerWidth = props.containerWidth, customColWidth = props.customColWidth, autoResize = props.autoResize;
-    var _l = useState(), resizing = _l[0], setResizing = _l[1];
-    var _m = useState(), dragging = _m[0], setDragging = _m[1];
-    var _o = useState(), dragStart = _o[0], setDragStart = _o[1];
-    var _p = useState(false), isDragging = _p[0], setIsDragging = _p[1];
-    var _q = useState(false), isResizing = _q[0], setIsResizing = _q[1];
-    var elementRef = useRef(null);
-    var isSelected = (_b = elementRef.current) === null || _b === void 0 ? void 0 : _b.classList.contains("react-grid-item-selected");
-    useEffect(function () {
-        var _a;
-        if (!isSelected || !autoResize) {
-            return;
-        }
-        var targetNode = (_a = elementRef.current) === null || _a === void 0 ? void 0 : _a.children[0].children[0].children[0];
-        if (!targetNode || isDragging || isResizing) {
-            return;
-        }
-        console.log("contains?:", targetNode.classList.contains("ccb-layout-box"));
-        if (targetNode.classList.contains("ccb-layout-box")) {
-            return;
-        }
-        var prevPaddingL = parseFloat(getComputedStyle(targetNode).paddingLeft);
-        var prevPaddingR = parseFloat(getComputedStyle(targetNode).paddingRight);
-        var prevPaddingT = parseFloat(getComputedStyle(targetNode).paddingTop);
-        var prevPaddingB = parseFloat(getComputedStyle(targetNode).paddingBottom);
-        // MutationObserver 콜백 함수
-        var callback = function (mutationsList) {
-            for (var _i = 0, mutationsList_1 = mutationsList; _i < mutationsList_1.length; _i++) {
-                var mutation = mutationsList_1[_i];
-                var isCharacterChanged = mutation.type === "characterData";
-                var keepWidth = true;
-                var hasPaddingChanged = false;
-                var height = isCharacterChanged
-                    ? mutation.target.parentNode.clientHeight
-                    : mutation.target.clientHeight;
-                var width = targetNode.clientWidth;
-                if (!isCharacterChanged && mutation.target instanceof Element) {
-                    var styles = getComputedStyle(mutation.target);
-                    var minWidth = parseFloat(styles.minWidth);
-                    if (minWidth > width) {
-                        keepWidth = false;
-                    }
-                    // NOTE: POC
-                    var paddingL = parseFloat(styles.paddingLeft);
-                    var paddingR = parseFloat(styles.paddingRight);
-                    var paddingT = parseFloat(styles.paddingTop);
-                    var paddingB = parseFloat(styles.paddingBottom);
-                    if (prevPaddingL !== paddingL ||
-                        prevPaddingR !== paddingR ||
-                        prevPaddingT !== paddingT ||
-                        prevPaddingB !== paddingB) {
-                        hasPaddingChanged = true;
-                        keepWidth = false;
-                    }
-                }
-                var prevW = props.w;
-                var prevH = props.h;
-                var _a = calcWH(getPositionParams(), {
-                    width: width,
-                    height: height,
-                }, x, y, "e", props.w, props.h, false), w_1 = _a.w, h_1 = _a.h;
-                if (keepWidth) {
-                    w_1 = prevW;
-                }
-                if (prevH > h_1) {
-                    h_1 = prevH;
-                }
-                var _b = getResizableXYPosition("e", w_1, h_1, prevW, prevH), newX = _b.newX, newY = _b.newY;
-                if (prevH === h_1 && prevW === w_1 && newX === x && newY === y) {
-                    return;
-                }
-                props.onFitToContent &&
-                    props.onFitToContent(i, w_1, h_1, newX, newY, { hasPaddingChanged: hasPaddingChanged });
-            }
-        };
-        // MutationObserver 인스턴스 생성
-        var observer = new MutationObserver(callback);
-        // 관찰할 DOM 변이 설정
-        var config = { characterData: true, attributes: true, subtree: true };
-        // 대상 노드와 설정으로 관찰 시작
-        observer.observe(targetNode, config);
-        // 정리 함수에서 MutationObserver 해제
-        return function () {
-            if (targetNode.classList.contains("ccb-layout-box")) {
-                return;
-            }
-            observer.disconnect();
-        };
-    }, [autoResize, isSelected, isDragging, isResizing, props.w, props.h, x, y]);
-    useEffect(function () {
-        var _a;
-        if (!isSelected || !autoResize) {
-            return;
-        }
-        var targetNode = (_a = elementRef.current) === null || _a === void 0 ? void 0 : _a.children[0].children[0].children[0];
-        if (!targetNode || isDragging || isResizing) {
-            return;
-        }
-        console.log("targetNode", targetNode);
-        if (!targetNode.classList.contains("ccb-layout-box")) {
-            return;
-        }
-        console.log("contains?:", targetNode.classList.contains("ccb-layout-box"));
-        var prevPaddingL = parseFloat(getComputedStyle(targetNode).paddingLeft);
-        var prevPaddingR = parseFloat(getComputedStyle(targetNode).paddingRight);
-        var prevPaddingT = parseFloat(getComputedStyle(targetNode).paddingTop);
-        var prevPaddingB = parseFloat(getComputedStyle(targetNode).paddingBottom);
-        // MutationObserver 콜백 함수
-        var callback = function (mutationsList) {
-            for (var _i = 0, mutationsList_2 = mutationsList; _i < mutationsList_2.length; _i++) {
-                var mutation = mutationsList_2[_i];
-                console.log("mutation", mutation);
-                // const isInitial = mutation.attributeName === "data-is-initialized";
-                var isSizeChanged = mutation.attributeName === "data-min-width" ||
-                    mutation.attributeName === "data-min-height";
-                var keepWidth = true;
-                var hasPaddingChanged = true;
-                var layoutBox = targetNode.children[0];
-                var contentsWrapper = layoutBox.children[0];
-                var oneComposition = contentsWrapper.querySelector(".composition-container");
-                console.log("layoutbox", layoutBox);
-                console.log("contentsWrapper", contentsWrapper);
-                console.log("oneComposition", oneComposition);
-                // const insetTop = Number(mutation.target.dataset.insetTop!);
-                // const insetBottom = Number(mutation.target.dataset.insetBottom!);
-                var minWidth = 0;
-                // const minHeight =
-                //   Number(mutation.target.dataset.minHeight) + insetTop + insetBottom;
-                // const contentsWrapper = mutation.target.querySelector(
-                //   ".cb-contentslist-wrapper"
-                // );
-                // const oneComposition = mutation.target.querySelector(
-                //   ".composition-container"
-                // );
-                var minHeight = 0;
-                if (contentsWrapper && oneComposition) {
-                    var minCellWidth = 10;
-                    var numberOfItems = Number(mutation.target.getAttribute("data-number-of-items"));
-                    var numberOfColumns = Number(mutation.target.getAttribute("data-number-of-columns"));
-                    var rowGap = Number(mutation.target.getAttribute("data-row-gap"));
-                    var columnGap = Number(mutation.target.getAttribute("data-column-gap"));
-                    var insetTop = Number(mutation.target.getAttribute("data-inset-top"));
-                    var insetBottom = Number(mutation.target.getAttribute("data-inset-bottom"));
-                    var compositionCols = Number(oneComposition.getAttribute("data-cols"));
-                    // const compositionRows = Number(
-                    //   oneComposition.getAttribute("data-rows")!
-                    // );
-                    var oneCompositionMinWidth = minCellWidth * compositionCols + 20; /* 20px padding */
-                    console.log("compositionCols", compositionCols);
-                    // let oneCompositionMinHeight =
-                    //   minColHeight * compositionRows + 20; /* 20px padding */
-                    if (contentsWrapper) {
-                        var gridWrapperInnerH = contentsWrapper.clientHeight;
-                        var oneCompositionH = oneComposition.clientHeight;
-                        var compositionBGwrapperPaddingT = Number(oneComposition.getAttribute("data-wrapper-paddingt"));
-                        var compositionBGwrapperPaddingB = Number(oneComposition.getAttribute("data-wrapper-paddingb"));
-                        var compositionBGwrapperPaddingL = Number(oneComposition.getAttribute("data-wrapper-paddingl"));
-                        var compositionBGwrapperPaddingR = Number(oneComposition.getAttribute("data-wrapper-paddingr"));
-                        var oneCompositionMinHeight = oneCompositionH +
-                            compositionBGwrapperPaddingT +
-                            compositionBGwrapperPaddingB;
-                        var styles = getComputedStyle(mutation.target);
-                        var paddingL = parseFloat(styles.paddingLeft);
-                        var paddingR = parseFloat(styles.paddingRight);
-                        var paddingT = parseFloat(styles.paddingTop);
-                        var paddingB = parseFloat(styles.paddingBottom);
-                        var paddingLR = paddingL + paddingR;
-                        var paddingTB = paddingT + paddingB;
-                        var compositionWrapperPaddingLR = (compositionBGwrapperPaddingL + compositionBGwrapperPaddingR) *
-                            numberOfColumns;
-                        var numberOfRows = Math.ceil(numberOfItems / numberOfColumns);
-                        var listMinWidth = oneCompositionMinWidth * numberOfColumns +
-                            (numberOfColumns - 1) * columnGap +
-                            paddingLR +
-                            compositionWrapperPaddingLR;
-                        console.log("oneCompositionMinWidth", oneCompositionMinWidth);
-                        console.log("cols", numberOfColumns);
-                        var gridWrapperTotalH = gridWrapperInnerH + insetTop + insetBottom;
-                        var listMinHeight = oneCompositionMinHeight * numberOfRows +
-                            (numberOfRows - 1) * rowGap +
-                            paddingTB +
-                            insetTop +
-                            insetBottom;
-                        if (listMinHeight > gridWrapperTotalH) {
-                            minHeight = listMinHeight;
-                        }
-                        minWidth = listMinWidth;
-                    }
-                }
-                // 필요가 없을 수도.
-                if (isNaN(minWidth) || isNaN(minHeight)) {
-                    return;
-                }
-                var width = targetNode.clientWidth;
-                if (!isSizeChanged && mutation.target instanceof Element) {
-                    var styles = getComputedStyle(mutation.target);
-                    if (minWidth > width) {
-                        keepWidth = false;
-                    }
-                    // NOTE: POC
-                    var paddingL = parseFloat(styles.paddingLeft);
-                    var paddingR = parseFloat(styles.paddingRight);
-                    var paddingT = parseFloat(styles.paddingTop);
-                    var paddingB = parseFloat(styles.paddingBottom);
-                    if (prevPaddingL !== paddingL ||
-                        prevPaddingR !== paddingR ||
-                        prevPaddingT !== paddingT ||
-                        prevPaddingB !== paddingB) {
-                        hasPaddingChanged = true;
-                        keepWidth = false;
-                    }
-                }
-                var prevW = props.w;
-                var prevH = props.h;
-                var _a = calcWH(getPositionParams(), {
-                    width: minWidth,
-                    height: minHeight,
-                }, x, y, "e", props.w, props.h, true), w_2 = _a.w, h_2 = _a.h;
-                if (keepWidth) {
-                    w_2 = prevW;
-                }
-                if (prevH > h_2) {
-                    h_2 = prevH;
-                }
-                var _b = getResizableXYPosition("e", w_2, h_2, prevW, prevH), newX = _b.newX, newY = _b.newY;
-                if (prevH === h_2 && prevW === w_2 && newX === x && newY === y) {
-                    return;
-                }
-                props.onFitToContent &&
-                    props.onFitToContent(i, w_2, h_2, newX, newY, { hasPaddingChanged: hasPaddingChanged });
-            }
-        };
-        var callbackLater = function (mutationsList) {
-            setTimeout(function () {
-                callback(mutationsList);
-            }, 200);
-        };
-        // MutationObserver 인스턴스 생성
-        var observer = new MutationObserver(callbackLater);
-        // 관찰할 DOM 변이 설정
-        var config = { attributes: true, characterData: true };
-        // 대상 노드와 설정으로 관찰 시작
-        observer.observe(targetNode, config);
-        // 정리 함수에서 MutationObserver 해제
-        return function () {
-            if (!targetNode.classList.contains("ccb-layout-box")) {
-                return;
-            }
-            observer.disconnect();
-        };
-    }, [autoResize, isSelected, isDragging, isResizing, props.w, props.h, x, y]);
-    // useEffect(() => {
-    //   if (!isSelected || !autoResize) {
-    //     return;
-    //   }
-    //   const targetNode = elementRef.current?.children[0].children[0].children[0];
-    //   if (!targetNode || isDragging || isResizing) {
-    //     return;
-    //   }
-    //   if (targetNode.id !== "contentslist-box") {
-    //     return;
-    //   }
-    //   const minWidth = Number((targetNode as HTMLElement).dataset?.minWidth ?? 0);
-    //   const minHeight = Number(
-    //     (targetNode as HTMLElement).dataset?.minHeight ?? 0
-    //   );
-    //   const insetTop = Number((targetNode as HTMLElement).dataset.insetTop!);
-    //   const insetBottom = Number(
-    //     (targetNode as HTMLElement).dataset.insetBottom!
-    //   );
-    //   let { w, h } = calcWH(
-    //     getPositionParams(),
-    //     {
-    //       width: minWidth,
-    //       height: minHeight + insetTop + insetBottom,
-    //     },
-    //     x,
-    //     y,
-    //     "e",
-    //     props.w,
-    //     props.h,
-    //     true
-    //   );
-    //   const prevW = props.w;
-    //   const prevH = props.h;
-    //   if (prevW > w) {
-    //     w = prevW;
-    //   }
-    //   if (prevH > h) {
-    //     h = prevH;
-    //   }
-    //   if (prevH === h && prevW === w) {
-    //     console.log("cancelled 3");
-    //     return;
-    //   }
-    //   props.onFitToContent &&
-    //     props.onFitToContent(i, w, h, x, y, { hasPaddingChanged: true });
-    // }, [isSelected, isResizing]);
-    // const moveDroppingItem = (prevProps: GridItemProps) => {
-    //   const { droppingPosition } = props;
-    //   if (!droppingPosition) return;
-    //   const node = elementRef.current;
-    //   // Can't find DOM node (are we unmounted?)
-    //   if (!node) return;
-    //   const prevDroppingPosition = prevProps.droppingPosition || {
-    //     left: 0,
-    //     top: 0,
-    //   };
-    //   const shouldDrag =
-    //     (dragging && droppingPosition.left !== prevDroppingPosition.left) ||
-    //     droppingPosition.top !== prevDroppingPosition.top;
-    //   if (!dragging) {
-    //     onDragStart(droppingPosition.e, {
-    //       node,
-    //       deltaX: droppingPosition.left,
-    //       deltaY: droppingPosition.top,
-    //     });
-    //   } else if (shouldDrag) {
-    //     const deltaX = droppingPosition.left - dragging.left;
-    //     const deltaY = droppingPosition.top - dragging.top;
-    //     onDrag(droppingPosition.e, {
-    //       node,
-    //       deltaX,
-    //       deltaY,
-    //     });
-    //   }
-    // };
-    var getPositionParams = function (prop) {
-        if (prop === void 0) { prop = props; }
-        return {
-            cols: prop.cols,
-            containerPadding: prop.containerPadding,
-            containerWidth: prop.containerWidth,
-            margin: prop.margin,
-            maxRows: prop.maxRows,
-            rowHeight: prop.rowHeight,
-        };
-    };
-    var colWidth = customColWidth !== null && customColWidth !== void 0 ? customColWidth : calcGridColWidth(getPositionParams());
-    var createStyle = function (pos) {
-        var usePercentages = props.usePercentages, containerWidth = props.containerWidth, useCSSTransforms = props.useCSSTransforms;
-        var style;
-        if (useCSSTransforms) {
-            style = setTransform(pos);
-        }
-        else {
-            style = setTopLeft(pos);
-            if (usePercentages) {
-                if (containerWidth == null) {
-                    throw new Error("Container width is missing!");
-                }
-                style.left = perc(pos.left / containerWidth);
-                style.width = perc(pos.width / containerWidth);
-            }
-        }
-        return style;
-    };
-    /**
-     * Mix a Draggable instance into a child.
-     * @param  {Element} child    Child element.
-     * @return {Element}          Child wrapped in Draggable.
-     */
-    var mixinDraggable = function (child, isDraggable) {
-        return (_jsx(DraggableCore, { disabled: !isDraggable, onStart: onDragStart, onDrag: onDrag, onStop: onDragStop, handle: handle, cancel: ".react-resizable-handle" + (cancel ? "," + cancel : ""), scale: transformScale, nodeRef: elementRef, children: child }));
-    };
-    /**
-     * Mix a Resizable instance into a child.
-     * @param  {Element} child    Child element.
-     * @param  {Object} position  Position object (pixel values)
-     * @return {Element}          Child wrapped in Resizable.
-     */
-    var mixinResizable = function (child, position, isResizable) {
-        var positionParams = getPositionParams();
-        // const maxWidth = calcGridItemPosition(
-        //   positionParams,
-        //   x,
-        //   y,
-        //   z,
-        //   cols - x, // TODO - 수정 필요
-        //   h
-        // ).width;
-        var mins = calcGridItemPosition(positionParams, x, y, z, minW, minH);
-        var maxes = calcGridItemPosition(positionParams, x, y, z, maxW, maxH);
-        var minConstraints = [mins.width, mins.height];
-        var maxConstraints = [
-            Math.min(maxes.width, containerWidth),
-            Math.min(maxes.height, Infinity),
-        ];
-        return (_jsx(Resizable, { draggableOpts: {
-                disabled: !isResizable,
-            }, className: isResizable ? undefined : "react-resizable-hide", width: position.width, height: position.height, top: position.top, left: position.left, resizeHandles: props.resizeHandles, onResizeStop: onResizeStop, onResizeStart: onResizeStart, onResize: onResize, minConstraints: minConstraints, maxConstraints: maxConstraints, transformScale: transformScale, handle: resizeHandle, isResizing: isResizing, autoResize: autoResize, colWidth: colWidth, margin: props.margin, children: child }));
-    };
-    /**
-     * onDragStart event handler
-     * @param  {Event}  e             event data
-     * @param  {Object} callbackData  an object with node, delta and position information
-     */
-    var onDragStart = function (e, _a) {
-        var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
-        var newPosition = { top: 0, left: 0 };
-        var offsetParent = node.offsetParent;
-        if (!offsetParent)
-            return;
-        var parentRect = offsetParent.getBoundingClientRect();
-        var clientRect = node.getBoundingClientRect();
-        var cLeft = clientRect.left / transformScale;
-        var pLeft = parentRect.left / transformScale;
-        var cTop = clientRect.top / transformScale;
-        var pTop = parentRect.top / transformScale;
-        newPosition.left = cLeft - pLeft + offsetParent.scrollLeft;
-        newPosition.top = cTop - pTop + offsetParent.scrollTop;
-        setDragging(newPosition);
-        var _b = calcXY(getPositionParams(), newPosition.top, newPosition.left, props.w, props.h), x = _b.x, y = _b.y;
-        setDragStart({ x: x, y: y });
-        props.onDragStart &&
-            props.onDragStart(props.i, x, y, { e: e, node: node, newPosition: newPosition });
-    };
-    /**
-     * onDrag event handler
-     * @param  {Event}  e             event data
-     * @param  {Object} callbackData  an object with node, delta and position information
-     */
-    var onDrag = function (e, _a) {
-        var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
-        if (!dragging) {
-            throw new Error("onDrag called before onDragStart.");
-        }
-        setIsDragging(true);
-        var top = dragging.top + deltaY;
-        var left = dragging.left + deltaX;
-        var isBounded = props.isBounded, i = props.i, w = props.w, h = props.h, containerWidth = props.containerWidth;
-        var positionParams = getPositionParams();
-        if (isBounded) {
-            var offsetParent = node.offsetParent;
-            if (offsetParent) {
-                var margin = props.margin, rowHeight = props.rowHeight;
-                // const colWidth =  calcGridColWidth(positionParams);
-                var rowHeightNumber = resolveRowHeight(rowHeight, colWidth);
-                var bottomBoundary = offsetParent.clientHeight -
-                    calcGridItemWHPx(h, rowHeightNumber, margin[1]);
-                top = clamp(top, 0, bottomBoundary);
-                var rightBoundary = containerWidth - calcGridItemWHPx(w, colWidth, margin[0]);
-                left = clamp(left, 0, rightBoundary);
-            }
-        }
-        var newPosition = { top: top, left: left };
-        setDragging(newPosition);
-        var _b = calcXY(positionParams, top, left, w, h), x = _b.x, y = _b.y;
-        props.onDrag && props.onDrag(i, x, y, { e: e, node: node, newPosition: newPosition });
-    };
-    /**
-     * onDragStop event handler
-     * @param  {Event}  e             event data
-     * @param  {Object} callbackData  an object with node, delta and position information
-     */
-    var onDragStop = function (e, _a) {
-        var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
-        if (!dragging) {
-            throw new Error("onDragEnd called before onDragStart.");
-        }
-        var w = props.w, h = props.h, i = props.i;
-        var left = dragging.left, top = dragging.top;
-        var _b = calcXY(getPositionParams(), top, left, w, h), x = _b.x, y = _b.y;
-        var newPosition = { top: top, left: left };
-        var change = (dragStart === null || dragStart === void 0 ? void 0 : dragStart.x) !== x || (dragStart === null || dragStart === void 0 ? void 0 : dragStart.y) !== y;
-        setDragging(undefined);
-        setDragStart(undefined);
-        setIsDragging(false);
-        props.onDragStop &&
-            props.onDragStop(i, x, y, { e: e, node: node, newPosition: newPosition, change: change });
-    };
-    var getResizableXYPosition = function (handle, width, height, prevW, prevH) {
-        var newX = x;
-        var newY = y;
-        if (handle === "nw") {
-            // NOTE - nw left(X)와 top(Y) 둘다 변경
-            if (width > prevW) {
-                newX = x - (width - prevW);
-            }
-            else {
-                newX = x + (prevW - width);
-            }
-            if (height > prevH) {
-                newY = y - (height - prevH);
-            }
-            else {
-                newY = y + (prevH - height);
-            }
-        }
-        if (handle === "n" || handle === "ne") {
-            // NOTE - n, ne left(X) 고정 & top(Y) 변경
-            if (height > prevH) {
-                newY = y - (height - prevH);
-            }
-            else {
-                newY = y + (prevH - height);
-            }
-        }
-        if (handle === "w" || handle === "sw") {
-            // NOTE - s, sw left(X) 변경 top(Y) 고정
-            if (width > prevW) {
-                newX = x - (width - prevW);
-            }
-            else {
-                newX = x + (prevW - width);
-            }
-        }
-        return { newX: newX, newY: newY };
-    };
-    /**
-     * onResizeStart event handler
-     * @param  {ResizeEventType}  e             event data
-     * @param  {Object} callbackData  an object with node and size information
-     */
-    var onResizeStart = function (e, callbackData) {
-        onResizeHandler(e, callbackData, "onResizeStart");
-    };
-    /**
-     * onResize event handler
-     * @param  {ResizeEventType}  e             event data
-     * @param  {Object} callbackData  an object with node and size information
-     */
-    var onResize = function (e, callbackData) {
-        setIsResizing(true);
-        onResizeHandler(e, callbackData, "onResize");
-    };
-    /**
-     * onResizeStop event handler
-     * @param  {ResizeEventType}  e             event data
-     * @param  {Object} callbackData  an object with node and size information
-     */
-    var onResizeStop = function (e, callbackData) {
-        setIsResizing(false);
-        onResizeHandler(e, callbackData, "onResizeStop");
-    };
-    /**
-     * Wrapper around drag events to provide more useful data.
-     * All drag events call the function with the given handler name,
-     * with the signature (index, x, y).
-     *
-     * @param  {String} handlerName Handler name to wrap.
-     * @return {Function}           Handler function.
-     */
-    var onResizeHandler = function (e, _a, handlerName) {
-        var node = _a.node, size = _a.size, handle = _a.handle, minWidth = _a.minWidth, minHeight = _a.minHeight;
-        var handler = props[handlerName];
-        if (!handler)
-            return;
-        var prevW = props.w, prevH = props.h;
-        // Get new XY
-        var _b = calcWH(getPositionParams(), size, x, y, handle, prevW, prevH, true), w = _b.w, h = _b.h;
-        var tempMinH = minH;
-        if (minWidth) {
-            var _c = calcWH(getPositionParams(), __assign(__assign({}, size), { width: minWidth, height: minHeight !== null && minHeight !== void 0 ? minHeight : 0 }), x, y, handle, prevW, prevH, true), minW_1 = _c.w, newMinH = _c.h;
-            if (minW_1 > w) {
-                w = minW_1;
-            }
-            if (minH > 1) {
-                tempMinH = Math.max(1, newMinH);
-            }
-        }
-        // minW should be at least 1
-        // minW = Math.max(minW, 1);
-        // maxW should be at most (cols - x)
-        // maxW = Math.min(maxW, cols - x);
-        w = clamp(w, minW, maxW);
-        h = clamp(h, tempMinH, maxH);
-        setResizing(handlerName === "onResizeStop" ? undefined : size);
-        var _d = getResizableXYPosition(handle, w, h, prevW, prevH), newX = _d.newX, newY = _d.newY;
-        handler(i, w, h, { e: e, node: node, size: size }, newX, newY);
-    };
-    var pos = calcGridItemPosition(getPositionParams(), x, y, z, w, h, {
-        dragging: dragging,
-        resizing: resizing,
-    }, colWidth);
-    var child = React.Children.only(children);
-    var newChild = React.cloneElement(child, {
-        key: i,
-        ref: elementRef,
-        "data-grid-id": i,
-        "data-z-index": z,
-        "data-z-order": zOrder,
-        "data-z-order-internal": zOrderInternal,
-        className: classNames("react-grid-item", child.props.className, className, {
-            static: props.static,
-            isResizing: Boolean(resizing) && Boolean(isResizing) && Boolean(isHiddenVisibility),
-            resizing: Boolean(resizing),
-            "react-draggable": isDraggable,
-            "editable-grid-item": isResizable && isDraggable,
-            isDragging: Boolean(isDragging) && Boolean(dragging) && Boolean(isHiddenVisibility),
-            "react-draggable-dragging": Boolean(dragging),
-            // dropping: Boolean(droppingPosition),
-            cssTransforms: useCSSTransforms,
-        }),
-        style: __assign(__assign(__assign({}, props.style), child.props.style), createStyle(pos)),
-    });
-    newChild = mixinResizable(newChild, pos, isResizable);
-    newChild = mixinDraggable(newChild, isDraggable);
-    return newChild;
-};
-export default GridItem;

package/dist/lib/GridItem/GridItemCopy.d.ts

@@ -1,5 +0,0 @@
-import React from "react";
-import { GridItemProps } from "./types";
-import { PropsWithChildren } from "../types";
-declare const GridItem: ({ children, ...props }: PropsWithChildren<GridItemProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
-export default GridItem;