publ-echo-test 0.0.344 → 0.0.346

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

@@ -9,5 +9,6 @@ type PlaceholderProps = {
     activeDrag: LayoutItem;
     selectedBlockId: string | null;
 };
-export declare function GridBackgroundPlaceholder({ margin, width, rowHeight, colWidth, backgroundWidth, backgroundHeight, activeDrag, selectedBlockId, }: PlaceholderProps): import("react/jsx-runtime").JSX.Element;
+export declare function GridBackgroundPlaceholder({ margin, width, rowHeight, colWidth, backgroundWidth, backgroundHeight, // 부모로부터 "1500px" 같은 정확한 값을 받음
+activeDrag, selectedBlockId, }: PlaceholderProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/lib/GridLayoutEditor/Placeholder.js

@@ -1,24 +1,26 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function GridBackgroundPlaceholder(_a) {
-    var margin = _a.margin, width = _a.width, rowHeight = _a.rowHeight, colWidth = _a.colWidth, backgroundWidth = _a.backgroundWidth, backgroundHeight = _a.backgroundHeight, activeDrag = _a.activeDrag, selectedBlockId = _a.selectedBlockId;
-    // 1. 활성화된 행(row) 인덱스 배열 (이건 그대로 사용)
+    var margin = _a.margin, width = _a.width, rowHeight = _a.rowHeight, colWidth = _a.colWidth, backgroundWidth = _a.backgroundWidth, backgroundHeight = _a.backgroundHeight, // 부모로부터 "1500px" 같은 정확한 값을 받음
+    activeDrag = _a.activeDrag, selectedBlockId = _a.selectedBlockId;
+    // 활성화된 행(row) 인덱스 배열
     var activeRows = Array.from({ length: activeDrag.h }, function (_, i) { return activeDrag.y + i; });
+    // 활성화된 열(column) 인덱스 배열 (24개 하드코딩)
     var activeCols = Array.from({ length: 24 }, function (_, i) { return 0 + i; });
+    var textPadding = 10;
+    console.log("bg-width", backgroundWidth);
     return (_jsx("div", { className: "grid-placeholder", style: {
             marginTop: margin[1] + "px",
             marginBottom: margin[1] + "px",
             marginLeft: margin[0] + "px",
             marginRight: margin[0] + "px",
-        }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: backgroundWidth, height: backgroundHeight, children: [_jsx("defs", { children: _jsx("pattern", { id: "grid-pattern", height: rowHeight + margin[1], width: colWidth + margin[0], patternUnits: "userSpaceOnUse", children: _jsx("rect", { x: 0.5, y: 0.5, className: "grid-pattern-rect" // 기본 그리드 셀 스타일
+        }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: backgroundWidth, height: backgroundHeight, overflow: "visible", children: [_jsx("defs", { children: _jsx("pattern", { id: "grid-pattern", height: rowHeight + margin[1], width: colWidth + margin[0], patternUnits: "userSpaceOnUse", children: _jsx("rect", { x: 0.5, y: 0.5, className: "grid-pattern-rect" // 기본 셀 스타일
                             , height: rowHeight, width: colWidth }) }) }), _jsx("rect", { width: width, height: "100%", fill: "url(#grid-pattern)" }), activeDrag &&
                     activeRows.map(function (row) {
-                        return activeCols.map(function (col) {
-                            // 각 셀의 정확한 x, y 위치 계산
-                            var x = col * (colWidth + margin[0]) + 0.5;
-                            var y = row * (rowHeight + margin[1]) + 0.5;
-                            return (_jsx("rect", { x: x, y: y, width: colWidth, height: rowHeight, 
-                                // 이 클래스에 다른 배경색을 지정하세요.
-                                className: "grid-active-cell-placeholder" }, "".concat(row, "-").concat(col)));
-                        });
+                        var y_top = row * (rowHeight + margin[1]) + 0.5;
+                        var y_center = y_top + rowHeight / 2;
+                        return (_jsxs("g", { children: [activeCols.map(function (col) {
+                                    var x = col * (colWidth + margin[0]) + 0.5;
+                                    return (_jsx("rect", { x: x, y: y_top, width: colWidth, height: rowHeight, className: "grid-active-cell-placeholder" }, "active-".concat(row, "-").concat(col)));
+                                }), _jsx("text", { x: width + textPadding, y: y_center, className: "grid-indicator-text", children: "\u2195 \uAC00\uBCC0" })] }, "active-row-".concat(row)));
                     })] }) }));
 }

package/dist/lib/GridLayoutEditor/ReactGridLayout.js

@@ -67,7 +67,6 @@ var ReactGridLayout = function (_a) {
     var selectedBlock = blockStructure && selectedBlockId
         ? findBlockByBlockId(blockStructure, selectedBlockId)
         : null;
-    console.log("selectedBlockId:", selectedBlock);
     var editingGroupAllChildren = blockStructure && editingGroupBlock
         ? findAllChildrenCbIds(blockStructure, editingGroupBlock).map(function (i) {
             return i.toString();

package/package.json

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