publ-echo-test 0.0.339 → 0.0.341

package/dist/lib/GridItem/GroupItem.js

@@ -21,22 +21,22 @@ var __rest = (this && this.__rest) || function (s, e) {
     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 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";
 var GroupItem = 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, minZ = props.minZ, onContextGroup = props.onContextGroup;
+    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, minZ = props.minZ, onContextGroup = props.onContextGroup;
     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');
+    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) {
@@ -54,7 +54,7 @@ var GroupItem = function (_a) {
         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 isCharacterChanged = mutation.type === "characterData";
                 var keepWidth = true;
                 var hasPaddingChanged = false;
                 var height = isCharacterChanged
@@ -85,14 +85,14 @@ var GroupItem = function (_a) {
                 var _a = calcWH(getPositionParams(), {
                     width: width,
                     height: height,
-                }, x, y, 'e', props.w, props.h, false), w_1 = _a.w, h_1 = _a.h;
+                }, 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;
+                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;
                 }
@@ -162,7 +162,7 @@ var GroupItem = function (_a) {
             style = setTopLeft(pos);
             if (usePercentages) {
                 if (containerWidth == null) {
-                    throw new Error('Container width is missing!');
+                    throw new Error("Container width is missing!");
                 }
                 style.left = perc(pos.left / containerWidth);
                 style.width = perc(pos.width / containerWidth);
@@ -176,7 +176,7 @@ var GroupItem = function (_a) {
      * @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 }));
+        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.
@@ -263,7 +263,7 @@ var GroupItem = function (_a) {
     var onDrag = function (e, _a) {
         var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
         if (!dragging) {
-            throw new Error('onDrag called before onDragStart.');
+            throw new Error("onDrag called before onDragStart.");
         }
         setIsDragging(true);
         var top = dragging.top + deltaY;
@@ -278,7 +278,6 @@ var GroupItem = function (_a) {
                 var rowHeightNumber = resolveRowHeight(rowHeight, colWidth);
                 var bottomBoundary = offsetParent.clientHeight -
                     calcGridItemWHPx(h, rowHeightNumber, margin[1]);
-                console.log('bb', bottomBoundary);
                 top = clamp(top, 0, bottomBoundary);
                 var rightBoundary = containerWidth - calcGridItemWHPx(w, colWidth, margin[0]);
                 left = clamp(left, 0, rightBoundary);
@@ -297,7 +296,7 @@ var GroupItem = function (_a) {
     var onDragStop = function (e, _a) {
         var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
         if (!dragging) {
-            throw new Error('onDragEnd called before onDragStart.');
+            throw new Error("onDragEnd called before onDragStart.");
         }
         var w = props.w, h = props.h, i = props.i;
         var left = dragging.left, top = dragging.top;
@@ -313,7 +312,7 @@ var GroupItem = function (_a) {
     var getResizableXYPosition = function (handle, width, height, prevW, prevH) {
         var newX = x;
         var newY = y;
-        if (handle === 'nw') {
+        if (handle === "nw") {
             // NOTE - nw left(X)와 top(Y) 둘다 변경
             if (width > prevW) {
                 newX = x - (width - prevW);
@@ -328,7 +327,7 @@ var GroupItem = function (_a) {
                 newY = y + (prevH - height);
             }
         }
-        if (handle === 'n' || handle === 'ne') {
+        if (handle === "n" || handle === "ne") {
             // NOTE - n, ne left(X) 고정 & top(Y) 변경
             if (height > prevH) {
                 newY = y - (height - prevH);
@@ -337,7 +336,7 @@ var GroupItem = function (_a) {
                 newY = y + (prevH - height);
             }
         }
-        if (handle === 'w' || handle === 'sw') {
+        if (handle === "w" || handle === "sw") {
             // NOTE - s, sw left(X) 변경 top(Y) 고정
             if (width > prevW) {
                 newX = x - (width - prevW);
@@ -354,7 +353,7 @@ var GroupItem = function (_a) {
      * @param  {Object} callbackData  an object with node and size information
      */
     var onResizeStart = function (e, callbackData) {
-        onResizeHandler(e, callbackData, 'onResizeStart');
+        onResizeHandler(e, callbackData, "onResizeStart");
     };
     /**
      * onResize event handler
@@ -363,7 +362,7 @@ var GroupItem = function (_a) {
      */
     var onResize = function (e, callbackData) {
         setIsResizing(true);
-        onResizeHandler(e, callbackData, 'onResize');
+        onResizeHandler(e, callbackData, "onResize");
     };
     /**
      * onResizeStop event handler
@@ -372,7 +371,7 @@ var GroupItem = function (_a) {
      */
     var onResizeStop = function (e, callbackData) {
         setIsResizing(false);
-        onResizeHandler(e, callbackData, 'onResizeStop');
+        onResizeHandler(e, callbackData, "onResizeStop");
     };
     /**
      * Wrapper around drag events to provide more useful data.
@@ -406,7 +405,7 @@ var GroupItem = function (_a) {
         // maxW = Math.min(maxW, cols - x);
         w = clamp(w, minW, maxW);
         h = clamp(h, tempMinH, maxH);
-        setResizing(handlerName === 'onResizeStop' ? undefined : size);
+        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);
     };
@@ -415,22 +414,22 @@ var GroupItem = function (_a) {
     var newChild = React.cloneElement(child, {
         key: i,
         ref: elementRef,
-        'data-group-block-id': i,
-        'data-z-index': z,
-        'data-z-order': zOrder,
-        'data-z-order-internal': zOrderInternal,
-        'data-min-z': minZ,
-        className: classNames('react-group-block', child.props.className, className, {
+        "data-group-block-id": i,
+        "data-z-index": z,
+        "data-z-order": zOrder,
+        "data-z-order-internal": zOrderInternal,
+        "data-min-z": minZ,
+        className: classNames("react-group-block", child.props.className, className, {
             static: props.static,
             isResizing: Boolean(resizing) &&
                 Boolean(isResizing) &&
                 Boolean(isHiddenVisibility),
             resizing: Boolean(resizing),
-            'react-draggable': isDraggable,
+            "react-draggable": isDraggable,
             isDragging: Boolean(isDragging) &&
                 Boolean(dragging) &&
                 Boolean(isHiddenVisibility),
-            'react-draggable-dragging': Boolean(dragging),
+            "react-draggable-dragging": Boolean(dragging),
             // dropping: Boolean(droppingPosition),
             cssTransforms: useCSSTransforms,
         }),
@@ -444,25 +443,25 @@ var GroupItem = function (_a) {
             }
             // 일시적으로 pointer-events 비활성화
             if (elementRef.current) {
-                elementRef.current.style.pointerEvents = 'none';
+                elementRef.current.style.pointerEvents = "none";
             }
             // 현재 마우스 위치에서 실제 요소 찾기
             var underlyingElement = document.elementFromPoint(e.clientX, e.clientY);
             // pointer-events 복구
             if (elementRef.current) {
-                elementRef.current.style.pointerEvents = 'auto';
+                elementRef.current.style.pointerEvents = "auto";
             }
-            document.querySelectorAll('.cb-layout-box.hovered').forEach(function (el) {
-                el.classList.remove('hovered');
+            document.querySelectorAll(".cb-layout-box.hovered").forEach(function (el) {
+                el.classList.remove("hovered");
             });
             if (underlyingElement &&
-                underlyingElement.classList.contains('cb-layout-box')) {
-                underlyingElement.classList.add('hovered');
+                underlyingElement.classList.contains("cb-layout-box")) {
+                underlyingElement.classList.add("hovered");
             }
         },
         onMouseLeave: function () {
-            document.querySelectorAll('.cb-layout-box.hovered').forEach(function (el) {
-                el.classList.remove('hovered');
+            document.querySelectorAll(".cb-layout-box.hovered").forEach(function (el) {
+                el.classList.remove("hovered");
             });
         },
     });

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

@@ -1,6 +1,6 @@
-import { DragEvent, SyntheticEvent } from 'react';
-import { RowHeight } from '../GridLayoutEditor/types';
-import { ResizeHandleAxis, ResizeHandleType } from '../Resizable/types';
+import { DragEvent, SyntheticEvent } from "react";
+import { RowHeight } from "../GridLayoutEditor/types";
+import { ResizeHandleAxis, ResizeHandleType } from "../Resizable/types";
 export type PartialPosition = {
     top: number;
     left: number;
@@ -83,6 +83,7 @@ export type GridItemProps = {
     autoResize: boolean;
     zOrder?: number;
     zOrderInternal?: string;
+    isPinned: boolean;
 };
 export type GridItemDefaultProps = {
     className: string;
@@ -108,5 +109,5 @@ export type ReactDraggableCallbackData = {
     lastX: number;
     lastY: number;
 };
-export type ResizeHandlerNameType = 'onResizeStart' | 'onResize' | 'onResizeStop';
+export type ResizeHandlerNameType = "onResizeStart" | "onResize" | "onResizeStop";
 export {};

package/dist/lib/GridLayoutEditor/ReactGridLayout.js

@@ -35,6 +35,7 @@ import { useState, useRef, useLayoutEffect } from "react";
 import classNames from "../../external-lib/classnames";
 import { bottom, cloneLayoutItem, compact, getAllCollisions, getBoundingArea, getLayoutItem, moveElement, noop, synchronizeLayoutWithChildren, withLayoutItem, } from "./utils/renderHelpers";
 import { calcGridColWidth, calcXY, resolveRowHeight, } from "../GridItem/utils/calculateUtils";
+// NOTE: 필수 변경하기
 import GridItem from "../GridItem/GridItem";
 import isEqual from "../../external-lib/lodash.isEqual";
 import { findAllChildrenCbIds, findBlockByBlockId, findDirectChildrenBlockIds, findDirectChildrenCbIds, findGroupBlocks, findParentGroupBlock, formatCbIdToBlockId, getBlockSpecificType, zIndexMap, } from "./group";
@@ -59,6 +60,9 @@ var ReactGridLayout = function (_a) {
     var _7 = useState(), droppingPosition = _7[0], setDroppingPosition = _7[1];
     var _8 = useState(false), isMounted = _8[0], setIsMounted = _8[1];
     var editorMode = props.isDraggable && props.isResizable ? "EDIT" : "VIEW";
+    var selectedBlock = blockStructure
+        ? findBlockByBlockId(blockStructure, editingGroupBlock)
+        : null;
     var editableBlockIds = blockStructure
         ? findDirectChildrenCbIds(blockStructure, editingGroupBlock)
         : [];
@@ -528,7 +532,7 @@ var ReactGridLayout = function (_a) {
         if (!item) {
             return null;
         }
-        return (_jsx(GridItem, { w: activeDrag.w, h: activeDrag.h, x: activeDrag.x, y: activeDrag.y, z: zIndexMap.ISDRAGGING, i: activeDrag.i, className: "placeholder", containerWidth: width, cols: cols, margin: margin, containerPadding: containerPadding || margin, maxRows: maxRows, rowHeight: rowHeight, isDraggable: false, isResizable: false, isBounded: false, useCSSTransforms: useCSSTransforms, transformScale: transformScale, autoResize: !!l.autoResize, children: item && item }));
+        return (_jsx(GridItem, { isPinned: false, w: activeDrag.w, h: activeDrag.h, x: activeDrag.x, y: activeDrag.y, z: zIndexMap.ISDRAGGING, i: activeDrag.i, className: "placeholder", containerWidth: width, cols: cols, margin: margin, containerPadding: containerPadding || margin, maxRows: maxRows, rowHeight: rowHeight, isDraggable: false, isResizable: false, isBounded: false, useCSSTransforms: useCSSTransforms, transformScale: transformScale, autoResize: !!l.autoResize, minH: l.minH, minW: l.minW, children: item && item }));
     };
     /**
      * Given a grid item, set its style attributes & surround in a <Draggable>.
@@ -568,7 +572,7 @@ var ReactGridLayout = function (_a) {
         var isInsideOfEditingGroup = editingGroupAllChildren.includes(l.i);
         var editorZIndex = (function () {
             if (isRoot && isInBulk) {
-                return zIndexMap.ROOT + z;
+                return z;
             }
             if (!isRoot && isInsideOfEditingGroup) {
                 return zIndexMap.CB_IN_EDITING_GROUP + z;
@@ -585,9 +589,11 @@ var ReactGridLayout = function (_a) {
             return z;
         })();
         var zIndex = editorMode === "EDIT" ? editorZIndex : z;
-        return (_jsx(GridItem, { className: classNames({
+        return (_jsx(GridItem, { isPinned: device === "DESKTOP"
+                ? !!block.isPinnedDesktop
+                : !!block.isPinnedMobile, className: classNames({
                 "editable-grid-item": !isRoot && editable,
-                "not-editable-grid-item": !editable,
+                "not-editable-grid-item": !isRoot && !editable,
                 "bulk-child-item": isInBulk,
                 "outside-of-editing-group": !isInsideOfEditingGroup,
             }), z: zIndex, zOrder: l.z, zOrderInternal: parent
@@ -696,7 +702,7 @@ var ReactGridLayout = function (_a) {
                 return zIndexMap.EDITABLE_GROUP + internalZOrder;
             }
             if (type === "GROUP_BLOCK") {
-                return zIndexMap.ROOT + internalZOrder;
+                return zIndexMap.GROUP;
             }
             return -1; // NOTE: ERROR
         })();
@@ -714,7 +720,9 @@ var ReactGridLayout = function (_a) {
         var parent = blockStructure
             ? findParentGroupBlock(blockStructure, block.blockId)
             : null;
-        return (_jsx(OutsideClickHandler, { onOutsideClick: onDoubleClickOutsideGroup, children: _jsx(GroupItem, { className: classNames({
+        return (_jsx(OutsideClickHandler, { onOutsideClick: onDoubleClickOutsideGroup, children: _jsx(GroupItem, { isPinned: device === "DESKTOP"
+                    ? !!block.isPinnedDesktop
+                    : !!block.isPinnedMobile, className: classNames({
                     "bulk-child-item": isInBulk,
                     "grid-bulk-block": block.blockId === "BULK",
                     editing: editingGroupBlock === block.blockId,

package/dist/lib/GridLayoutEditor/group.d.ts

@@ -22,6 +22,8 @@ export type ComponentBlock = {
     zOrderDesktopInternal: number | null;
     zOrderMobileInternal: number | null;
     componentBlockId: number;
+    isPinnedDesktop: boolean;
+    isPinnedMobile: boolean;
 };
 export type GroupBlock = {
     blockId: string;
@@ -29,6 +31,8 @@ export type GroupBlock = {
     zOrderDesktopInternal: number | null;
     zOrderMobileInternal: number | null;
     children: (ComponentBlock | GroupBlock)[];
+    isPinnedDesktop: boolean;
+    isPinnedMobile: boolean;
 };
 export type RootBlock = {
     blockId: "ROOT";
@@ -36,6 +40,8 @@ export type RootBlock = {
     zOrderDesktopInternal: number | null;
     zOrderMobileInternal: number | null;
     children: (ComponentBlock | GroupBlock)[];
+    isPinnedDesktop: boolean;
+    isPinnedMobile: boolean;
 };
 export type BulkBlockInternal = {
     blockId: "BULK";
@@ -43,6 +49,8 @@ export type BulkBlockInternal = {
     zOrderDesktopInternal: number;
     zOrderMobileInternal: number;
     children: (ComponentBlock | GroupBlock)[];
+    isPinnedDesktop: boolean;
+    isPinnedMobile: boolean;
 };
 export declare const findBlockByBlockId: (block: Block, blockId: string) => Block | null;
 export declare const findDirectChildrenCbIds: (block: Block, targetId: string) => number[];

package/dist/lib/GridLayoutEditor/group.js

@@ -15,7 +15,7 @@ export var zIndexMap = {
     EDITING_GROUP: 9000,
     GROUP: 5000,
     CB: 0,
-    ROOT: 20000, //?
+    ROOT: 0, //?
 };
 export function getBlockSpecificType(block) {
     if (block.blockId === "ROOT") {
@@ -217,6 +217,8 @@ export var addBulkToTarget = function (block, targetId, bulkBlockIds) {
         zOrderDesktopInternal: zOrderDesktopInternal,
         zOrderMobileInternal: zOrderMobileInternal,
         children: bulkBlocks,
+        isPinnedDesktop: false,
+        isPinnedMobile: false,
     };
     // Add the bulkBlock to the target's children
     targetBlock.children.push(bulkBlock);

package/dist/lib/GridLayoutEditor/types.d.ts

@@ -1,8 +1,8 @@
-import { DragEvent, ReactElement, RefObject } from 'react';
-import { ResizeHandleAxis, ResizeHandleType } from '../Resizable/types';
-import { ResizeEventType } from '../GridItem/types';
-import { Block } from './group';
-export type CompactType = 'vertical' | 'horizontal';
+import { DragEvent, ReactElement, RefObject } from "react";
+import { ResizeHandleAxis, ResizeHandleType } from "../Resizable/types";
+import { ResizeEventType } from "../GridItem/types";
+import { Block } from "./group";
+export type CompactType = "vertical" | "horizontal";
 export type LayoutItem = {
     w: number;
     h: number;
@@ -22,6 +22,7 @@ export type LayoutItem = {
     isBounded?: boolean;
     groupLayouts?: LayoutItem[];
     autoResize?: boolean;
+    isPinned?: boolean;
 };
 export type Layout = LayoutItem[];
 export type DroppedEvent = {
@@ -82,8 +83,8 @@ export type ReactGridLayoutProps = {
     onFitToContent?: OnFitContentCallBack;
     blockStructure?: Block;
     onDoubleClickGroup?: (e: React.MouseEvent, id: string, type: string) => void;
-    selectedGroupBlock?: 'ROOT' | string;
-    editingGroupBlock?: 'ROOT' | string;
+    selectedGroupBlock?: "ROOT" | string;
+    editingGroupBlock?: "ROOT" | string;
     onClickGroup?: (e: React.MouseEvent, id: string, type: string) => void;
     bulkIds?: string[];
     onDoubleClickOutsideGroup: () => void;
@@ -143,7 +144,7 @@ export type ResponsiveGridLayoutStateType = {
     layout: Layout;
     layouts?: ResponsiveLayout<string>;
 };
-type CoreType = Omit<ReactGridLayoutProps, 'cols' | 'layout' | 'margin' | 'containerPadding' | 'transformScale' | 'onLayoutChange' | 'isHiddenVisibility'>;
+type CoreType = Omit<ReactGridLayoutProps, "cols" | "layout" | "margin" | "containerPadding" | "transformScale" | "onLayoutChange" | "isHiddenVisibility">;
 export type ResponsiveGridLayoutProps = {
     breakpoint?: Breakpoint;
     breakpoints?: Breakpoints<Breakpoint>;
@@ -157,7 +158,7 @@ export type ResponsiveGridLayoutProps = {
     zoom?: number;
 } & CoreType;
 export type Breakpoint = string;
-export type DefaultBreakpoints = 'lg' | 'md' | 'sm' | 'xs' | 'xxs';
+export type DefaultBreakpoints = "lg" | "md" | "sm" | "xs" | "xxs";
 export type ResponsiveLayout<T extends Breakpoint> = Record<T, Layout>;
 export type Breakpoints<T extends Breakpoint> = Record<T, number>;
 export type OnLayoutChangeCallback = (properties: {

package/dist/lib/Resizable/Resizable.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import { PropsWithChildren } from '../Draggable/types';
-import { ResizableProps } from './types';
+import React from "react";
+import { PropsWithChildren } from "../Draggable/types";
+import { ResizableProps } from "./types";
 type Props = ResizableProps;
 declare const Resizable: ({ children, axis, handleSize, lockAspectRatio, minConstraints, maxConstraints, resizeHandles, transformScale, isResizing, autoResize, colWidth, margin, ...props }: PropsWithChildren<Props>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 export default Resizable;