publ-echo-test 0.0.387 → 0.0.389

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

@@ -12,7 +12,9 @@ type PlaceholderProps = {
     totalCols: number;
     activeRows: number[];
     activeBlock?: ComponentBlock | GroupBlock | null;
+    layout: LayoutItem[];
 };
 export declare function GridBackgroundPlaceholder({ device, margin, rowHeight, colWidth, backgroundWidth, backgroundHeight, activeDrag, selectedBlockId, activeRows, totalCols, // 💡 새로 받은 totalCols 사용
-activeBlock, }: PlaceholderProps): import("react/jsx-runtime").JSX.Element;
+activeBlock, layout, }: PlaceholderProps): import("react/jsx-runtime").JSX.Element;
+export declare function getShowActiveRows(block: ComponentBlock | GroupBlock, layout: LayoutItem[]): boolean;
 export {};

package/dist/lib/GridLayoutEditor/Placeholder.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getLayoutItem } from "./utils/renderHelpers";
 export function GridBackgroundPlaceholder(_a) {
     // 활성화된 행(row) 인덱스 배열
     // const activeRows = Array.from(
@@ -8,7 +9,7 @@ export function GridBackgroundPlaceholder(_a) {
     var device = _a.device, margin = _a.margin, 
     // width, // 🚨 제거
     rowHeight = _a.rowHeight, colWidth = _a.colWidth, backgroundWidth = _a.backgroundWidth, backgroundHeight = _a.backgroundHeight, activeDrag = _a.activeDrag, selectedBlockId = _a.selectedBlockId, activeRows = _a.activeRows, totalCols = _a.totalCols, // 💡 새로 받은 totalCols 사용
-    activeBlock = _a.activeBlock;
+    activeBlock = _a.activeBlock, layout = _a.layout;
     // 🚨 activeCols도 totalCols prop으로 받아서 사용
     // const activeCols = Array.from({ length: 24 }, (_, i) => 0 + i);
     var activeCols = Array.from({ length: totalCols }, function (_, i) { return 0 + i; });
@@ -21,8 +22,10 @@ export function GridBackgroundPlaceholder(_a) {
     var isHeightVariable = device === "DESKTOP"
         ? !!(activeBlock === null || activeBlock === void 0 ? void 0 : activeBlock.isHeightVariableDesktop)
         : !!(activeBlock === null || activeBlock === void 0 ? void 0 : activeBlock.isHeightVariableMobile);
-    var showActiveRows = !!activeDrag.heightFitContent || isHeightVariable;
-    console.log("activeBlock", activeBlock);
+    // const showActiveRows = !!activeDrag.heightFitContent || isHeightVariable;
+    var showActiveRows = activeBlock && activeBlock.type === "GROUP_BLOCK"
+        ? getShowActiveRows(activeBlock, layout)
+        : !!activeDrag.heightFitContent || isHeightVariable;
     return (_jsx("div", { className: "grid-placeholder", style: {
             marginTop: margin[1] + "px",
             marginBottom: margin[1] + "px",
@@ -41,3 +44,19 @@ export function GridBackgroundPlaceholder(_a) {
                                 }), _jsx("foreignObject", { x: gridContentWidth + textPadding, y: y_top, width: colWidth, height: rowHeight, style: { overflow: "visible" }, children: _jsx("div", { className: "grid-indicator-text" }) })] }, "active-row-".concat(row)));
                     })] }) }));
 }
+export function getShowActiveRows(block, layout) {
+    if (block.type === "GROUP_BLOCK") {
+        var hasFitContentCB = block.children.some(function (child) {
+            if (child.type === "COMPONENT_BLOCK") {
+                var item = getLayoutItem(layout, child.componentBlockId.toString());
+                return (item === null || item === void 0 ? void 0 : item.heightFitContent) || false;
+            }
+            if (child.type === "GROUP_BLOCK") {
+                return getShowActiveRows(child, layout);
+            }
+            return false;
+        });
+        return hasFitContentCB;
+    }
+    return false;
+}

package/dist/lib/GridLayoutEditor/ReactGridLayout.js

@@ -41,7 +41,7 @@ import isEqual from "../../external-lib/lodash.isEqual";
 import { findAllChildrenCbIds, findBlockByBlockId, findDirectChildrenBlockIds, findDirectChildrenCbIds, findGroupBlocks, findParentGroupBlock, formatCbIdToBlockId, getBlockIdKind, getBlockSpecificType, zIndexMap, } from "./group";
 import GroupItem from "../GridItem/GroupItem";
 import OutsideClickHandler from "../GridItem/OutsideClickHandler";
-import { GridBackgroundPlaceholder } from "./Placeholder";
+import { getShowActiveRows, GridBackgroundPlaceholder } from "./Placeholder";
 var layoutClassName = "react-grid-layout";
 var ReactGridLayout = function (_a) {
     var children = _a.children, props = __rest(_a, ["children"]);
@@ -573,11 +573,19 @@ var ReactGridLayout = function (_a) {
         var zIndex = editorMode === "EDIT" ? editorZIndex : z;
         // Check if a layout item overlaps any of the activeRows (vertical overlap)
         var isOverlappingActiveRows = function (item) {
-            if ((parsedSelectedBlockId === null || parsedSelectedBlockId === void 0 ? void 0 : parsedSelectedBlockId.cbId) === item.i) {
-                return false;
+            if ((activeBlock === null || activeBlock === void 0 ? void 0 : activeBlock.type) === "COMPONENT_BLOCK") {
+                if ((parsedSelectedBlockId === null || parsedSelectedBlockId === void 0 ? void 0 : parsedSelectedBlockId.cbId) === item.i) {
+                    return false;
+                }
+                if (!(activeDragItemOrSelectedItem === null || activeDragItemOrSelectedItem === void 0 ? void 0 : activeDragItemOrSelectedItem.heightFitContent)) {
+                    return false;
+                }
             }
-            if (!(activeDragItemOrSelectedItem === null || activeDragItemOrSelectedItem === void 0 ? void 0 : activeDragItemOrSelectedItem.heightFitContent)) {
-                return false;
+            if ((activeBlock === null || activeBlock === void 0 ? void 0 : activeBlock.type) === "GROUP_BLOCK") {
+                var hasFitContentCB = getShowActiveRows(activeBlock, layout);
+                if (!hasFitContentCB) {
+                    return false;
+                }
             }
             if (!activeRows || activeRows.length === 0) {
                 return false;
@@ -786,6 +794,6 @@ var ReactGridLayout = function (_a) {
         : activeRows;
     return (_jsxs("div", { ref: innerRef, className: mergedClassName, style: mergedStyle, onDrop: isDroppable ? onDropHandler : noop, onDragLeave: isDroppable ? onDragLeaveHandler : noop, onDragEnter: isDroppable ? onDragEnterHandler : noop, onDragOver: isDroppable ? onDragOverHandler : noop, "data-grid-row-height": rowHeight, "data-grid-cols": cols, "data-section-id": sectionId, children: [currentGroupBlocks.map(function (each) { return processGroup(each); }), React.Children.map(children, function (child) { return processGridItem(child); }), placeholder(), activeDrag && _jsx("div", { className: "grid-guide-line-center" }), activeDragItemOrSelectedItem && (_jsx(GridBackgroundPlaceholder, { device: device, backgroundWidth: getBackgroundWidth(), backgroundHeight: getBackgroundHeight(), margin: margin, 
                 // width={width}
-                rowHeight: rowHeight, activeRows: activeRowsFiltered !== null && activeRowsFiltered !== void 0 ? activeRowsFiltered : [], colWidth: colWidth, activeDrag: activeDragItemOrSelectedItem, activeBlock: activeBlock, selectedBlockId: selectedBlockId, totalCols: cols }))] }));
+                rowHeight: rowHeight, activeRows: activeRowsFiltered !== null && activeRowsFiltered !== void 0 ? activeRowsFiltered : [], colWidth: colWidth, activeDrag: activeDragItemOrSelectedItem, activeBlock: activeBlock, selectedBlockId: selectedBlockId, totalCols: cols, layout: layout }))] }));
 };
 export default ReactGridLayout;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "publ-echo-test",
-  "version": "0.0.387",
+  "version": "0.0.389",
   "private": false,
   "main": "dist/lib/index.js",
   "types": "dist/lib/index.d.js",