pds-dev-kit-web-test 2.7.101 → 2.7.104

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.
Files changed (4) hide show
  1. package/dist/src/sub/DynamicLayout/GridAutoRowEditor/GridAutoRowEditor.js +1 -1
  2. package/dist/src/sub/DynamicLayout/utils/groupUtils.d.ts +3 -1
  3. package/dist/src/sub/DynamicLayout/utils/groupUtils.js +27 -24
  4. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/GridAutoRowEditor/GridAutoRowEditor.js CHANGED
@@ -265,7 +265,7 @@ var GridAutoRowEditor = (0, react_1.forwardRef)(function CustomSection(props, re
265
265
  backgroundColor: '#e8e1e189',
266
266
  border: '1px solid #6b666688'
267
267
  }, "data-row": rIdx + 1, "data-col": cIdx + 1 }, "bg-grid-item-".concat(rIdx + 1, "-").concat(cIdx + 1))); }) }), "bg-grid-row-".concat(rIdx + 1)));
268
- }), pedigree.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(groupUtils_1.default, { block: child, rowHeight: rowHeight, layoutItems: layouts[device === 'DESKTOP' ? 'lg' : 'sm'], cbs: props.componentBlocks }, child.blockId)); })] })) })) })) }) })) }));
268
+ }), pedigree.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(groupUtils_1.default, { block: child, rowHeight: rowHeight, layoutItems: layouts[device === 'DESKTOP' ? 'lg' : 'sm'], cbs: props.componentBlocks, device: device }, child.blockId)); })] })) })) })) }) })) }));
269
269
  });
270
270
  function GroupBlockRender(_a) {
271
271
  var block = _a.block, layouts = _a.layouts, pedigree = _a.pedigree, isEditing = _a.isEditing, isPinned = _a.isPinned, componentBlocks = _a.componentBlocks, onTogglePinned = _a.onTogglePinned, onDoubleClick = _a.onDoubleClick, onDoubleClickOutside = _a.onDoubleClickOutside;
package/dist/src/sub/DynamicLayout/utils/groupUtils.d.ts CHANGED
@@ -1,13 +1,15 @@
1
1
  /// <reference types="react" />
2
2
  import type { ComponentBlock } from '../sections/CustomSection/types';
3
+ import type { Device } from '../sections/CustomSection/util/types';
3
4
  import type { LayoutItem } from 'publ-echo/dist/lib';
4
5
  import type { Block } from 'publ-echo/dist/lib/GridLayoutEditor/group';
5
6
  export declare function findAllChildrenCbIds(block: Block, targetGroupId: string): number[];
6
- export default function RenderPedigreeRecursively({ block, layoutItems, cbs, parentGroupArea, rowHeight }: {
7
+ export default function RenderPedigreeRecursively({ block, layoutItems, cbs, parentGroupArea, rowHeight, device }: {
7
8
  block: Block;
8
9
  layoutItems: LayoutItem[];
9
10
  cbs: ComponentBlock[];
10
11
  rowHeight: number;
12
+ device: Device;
11
13
  parentGroupArea?: {
12
14
  rowStart: number;
13
15
  colStart: number;
package/dist/src/sub/DynamicLayout/utils/groupUtils.js CHANGED
@@ -78,7 +78,7 @@ function findAllChildrenCbIds(block, targetGroupId) {
78
78
  }
79
79
  exports.findAllChildrenCbIds = findAllChildrenCbIds;
80
80
  function RenderPedigreeRecursively(_a) {
81
- var block = _a.block, layoutItems = _a.layoutItems, cbs = _a.cbs, parentGroupArea = _a.parentGroupArea, rowHeight = _a.rowHeight;
81
+ var block = _a.block, layoutItems = _a.layoutItems, cbs = _a.cbs, parentGroupArea = _a.parentGroupArea, rowHeight = _a.rowHeight, device = _a.device;
82
82
  var type = block.type;
83
83
  if (type === 'GROUP_BLOCK') {
84
84
  var childrenIds = findAllChildrenCbIds(block, block.blockId).map(function (i) { return i.toString(); });
@@ -95,21 +95,13 @@ function RenderPedigreeRecursively(_a) {
95
95
  var relativeGridArea_1 = parentGroupArea
96
96
  ? calculateRelativeGridArea(gridArea_1, parentGroupArea)
97
97
  : gridArea_1;
98
- return ((0, jsx_runtime_1.jsxs)(S_GroupItem, __assign({ cols: bounding.w, sectionRow: bounding.h, rowHeight: rowHeight, selectedRows: [], style: {
98
+ return ((0, jsx_runtime_1.jsx)(S_GroupItem, __assign({ cols: bounding.w, sectionRow: bounding.h, rowHeight: rowHeight, selectedRows: [], style: {
99
99
  gridArea: gridAreaObjToString(relativeGridArea_1),
100
- display: 'grid'
101
- } }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ style: {
102
- position: 'absolute',
103
- top: 4,
104
- left: 4,
105
- background: 'rgba(0,0,0,0.6)',
106
- color: '#fff',
107
- padding: '2px 6px',
108
- borderRadius: '4px',
109
- fontSize: '12px',
110
- zIndex: 1,
111
- pointerEvents: 'none'
112
- } }, { children: block.blockId })), block.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(RenderPedigreeRecursively, { rowHeight: rowHeight, block: child, layoutItems: layoutItems, cbs: cbs, parentGroupArea: gridArea_1 }, child.blockId)); })] })));
100
+ display: 'grid',
101
+ zIndex: device === 'DESKTOP'
102
+ ? block.zOrderDesktopInternal
103
+ : block.zOrderMobileInternal
104
+ } }, { children: block.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(RenderPedigreeRecursively, { rowHeight: rowHeight, block: child, layoutItems: layoutItems, cbs: cbs, parentGroupArea: gridArea_1, device: device }, child.blockId)); }) })));
113
105
  }
114
106
  // default: TYPE === 'COMPONENT_BLOCK'
115
107
  var cbIndex = cbs.findIndex(function (c) { return c.blockId === block.blockId; });
@@ -125,12 +117,24 @@ function RenderPedigreeRecursively(_a) {
125
117
  : originalGridArea;
126
118
  var isEditing = false;
127
119
  var isPinned = false;
128
- return ((0, jsx_runtime_1.jsx)(S_GridItem, __assign({ style: {
129
- gridArea: gridAreaObjToString(relativeGridArea)
130
- }, "data-og-grid-area": originalGridAreaString, "data-rel-grid-area": gridAreaObjToString(relativeGridArea) }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(FlexGridItem_1.default, { cb: cb, index: cbIndex, device: "DESKTOP", rowHeight: 50, zIndex: 0, style: {
131
- pointerEvents: 'none'
132
- // opacity: isEditing ? 1 : 0.3
133
- }, showPinned: isEditing, isParentGroupPinned: isPinned }) }, cb.id) })));
120
+ return (
121
+ // <S_GridItem
122
+ // style={{
123
+ // gridArea: gridAreaObjToString(relativeGridArea)
124
+ // }}
125
+ // data-og-grid-area={originalGridAreaString}
126
+ // data-rel-grid-area={gridAreaObjToString(relativeGridArea)}
127
+ // >
128
+ (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(FlexGridItem_1.default, { cb: cb, index: cbIndex, device: device, rowHeight: 50, zIndex: device === 'DESKTOP'
129
+ ? block.zOrderDesktopInternal
130
+ : block.zOrderMobileInternal, style: {
131
+ pointerEvents: 'none',
132
+ gridArea: gridAreaObjToString(relativeGridArea),
133
+ boxShadow: '0 0 0 2px red'
134
+ // opacity: isEditing ? 1 : 0.3
135
+ }, showPinned: isEditing, isParentGroupPinned: isPinned }) }, cb.id)
136
+ // </S_GridItem>
137
+ );
134
138
  }
135
139
  exports.default = RenderPedigreeRecursively;
136
140
  function clamp(num, min, max) {
@@ -186,8 +190,7 @@ function calculateRelativeGridArea(componentArea, parentArea) {
186
190
  colEnd: componentArea.colEnd - parentArea.colStart + 1
187
191
  };
188
192
  }
189
- var S_GridItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 0 0 2px red;\n height: 100%;\n position: relative;\n width: 100%;\n"], ["\n box-shadow: 0 0 0 2px red;\n height: 100%;\n position: relative;\n width: 100%;\n"])));
190
- var S_GroupItem = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"], ["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"])), function (props) { return props.cols; }, function (props) {
193
+ var S_GroupItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"], ["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"])), function (props) { return props.cols; }, function (props) {
191
194
  // // 전체 행 개수만큼 배열을 생성하여 각 행의 CSS 값을 정의합니다.
192
195
  return Array.from({ length: props.sectionRow })
193
196
  .map(function (_, index) {
@@ -199,4 +202,4 @@ var S_GroupItem = styled_components_1.default.div(templateObject_2 || (templateO
199
202
  )
200
203
  .join(' ');
201
204
  });
202
- var templateObject_1, templateObject_2;
205
+ var templateObject_1;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "2.7.101",
3
+ "version": "2.7.104",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",