publ-echo-test 0.0.184 → 0.0.185

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.
@@ -5,5 +5,6 @@ declare const GroupItem: ({ children, ...props }: PropsWithChildren<GridItemProp
5
5
  onContextGroup: (e: React.MouseEvent) => void;
6
6
  zOrder: number;
7
7
  zOrderInternal: string;
8
+ minZ?: number | undefined;
8
9
  }>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
9
10
  export default GroupItem;
@@ -29,7 +29,7 @@ import { perc, setTopLeft, setTransform, } from '../GridLayoutEditor/utils/rende
29
29
  var GroupItem = function (_a) {
30
30
  var _b;
31
31
  var children = _a.children, props = __rest(_a, ["children"]);
32
- 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, onContextGroup = props.onContextGroup;
32
+ 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;
33
33
  var _l = useState(), resizing = _l[0], setResizing = _l[1];
34
34
  var _m = useState(), dragging = _m[0], setDragging = _m[1];
35
35
  var _o = useState(), dragStart = _o[0], setDragStart = _o[1];
@@ -419,6 +419,7 @@ var GroupItem = function (_a) {
419
419
  'data-z-index': z,
420
420
  'data-z-order': zOrder,
421
421
  'data-z-order-internal': zOrderInternal,
422
+ 'data-min-z': minZ,
422
423
  className: classNames('react-group-block', child.props.className, className, {
423
424
  static: props.static,
424
425
  isResizing: Boolean(resizing) &&
@@ -9,6 +9,7 @@ var OutsideClickHandler = function (_a) {
9
9
  width: '0',
10
10
  height: '0'
11
11
  }), childDimensions = _b[0], setChildDimensions = _b[1];
12
+ var _c = useState(0), zIndex = _c[0], setZIndex = _c[1];
12
13
  useEffect(function () {
13
14
  var handleClickOutside = function (e) {
14
15
  var target = e.target;
@@ -31,7 +32,6 @@ var OutsideClickHandler = function (_a) {
31
32
  // Get computed style of the child element
32
33
  var computedStyle = window.getComputedStyle(childElement);
33
34
  if (childElement.dataset['groupBlockId'] !== 'BULK') {
34
- console.log(childElement);
35
35
  return;
36
36
  }
37
37
  setChildDimensions({
@@ -39,6 +39,9 @@ var OutsideClickHandler = function (_a) {
39
39
  width: computedStyle.width,
40
40
  height: computedStyle.height
41
41
  });
42
+ if (childElement.dataset['minZ']) {
43
+ setZIndex(Number(childElement.dataset['minZ']));
44
+ }
42
45
  }
43
46
  return function () {
44
47
  setChildDimensions({
@@ -46,6 +49,7 @@ var OutsideClickHandler = function (_a) {
46
49
  width: '0',
47
50
  height: '0'
48
51
  });
52
+ setZIndex(0);
49
53
  };
50
54
  }, [children, wrapperRef.current]);
51
55
  // Parse dimensions to numbers for calculations
@@ -62,7 +66,7 @@ var OutsideClickHandler = function (_a) {
62
66
  marginLeft: "-".concat(shadowOffset, "px"),
63
67
  marginTop: "-".concat(shadowOffset, "px"),
64
68
  pointerEvents: 'none',
65
- zIndex: zIndexMap.BULK
69
+ zIndex: zIndexMap.EDITING_GROUP + zIndex
66
70
  } }), _jsx("div", { className: "border-right", style: {
67
71
  position: 'absolute',
68
72
  transform: childDimensions.transform,
@@ -72,7 +76,7 @@ var OutsideClickHandler = function (_a) {
72
76
  marginLeft: "".concat(width + shadowOffset - borderThickness, "px"),
73
77
  marginTop: "-".concat(shadowOffset, "px"),
74
78
  pointerEvents: 'none',
75
- zIndex: zIndexMap.BULK
79
+ zIndex: zIndexMap.EDITING_GROUP + zIndex
76
80
  } }), _jsx("div", { className: "border-bottom", style: {
77
81
  position: 'absolute',
78
82
  transform: childDimensions.transform,
@@ -82,7 +86,7 @@ var OutsideClickHandler = function (_a) {
82
86
  marginLeft: "-".concat(shadowOffset, "px"),
83
87
  marginTop: "".concat(height + shadowOffset - borderThickness, "px"),
84
88
  pointerEvents: 'none',
85
- zIndex: zIndexMap.BULK
89
+ zIndex: zIndexMap.EDITING_GROUP + zIndex
86
90
  } }), _jsx("div", { className: "border-left", style: {
87
91
  position: 'absolute',
88
92
  transform: childDimensions.transform,
@@ -92,7 +96,7 @@ var OutsideClickHandler = function (_a) {
92
96
  marginLeft: "-".concat(shadowOffset, "px"),
93
97
  marginTop: "-".concat(shadowOffset, "px"),
94
98
  pointerEvents: 'none',
95
- zIndex: zIndexMap.BULK
99
+ zIndex: zIndexMap.EDITING_GROUP + zIndex
96
100
  } })] }))] }));
97
101
  };
98
102
  export default OutsideClickHandler;
@@ -721,7 +721,7 @@ var ReactGridLayout = function (_a) {
721
721
  'grid-bulk-block': block.blockId === 'BULK',
722
722
  editing: editingGroupBlock === block.blockId,
723
723
  selected: selectedGroupBlock === block.blockId,
724
- }), z: zIndex, zOrder: zOrder, zOrderInternal: parent
724
+ }), z: zIndex, minZ: groupItem.minZ, zOrder: zOrder, zOrderInternal: parent
725
725
  ? "".concat(parent[device === 'DESKTOP'
726
726
  ? 'zOrderDesktopInternal'
727
727
  : 'zOrderMobileInternal'], " > ").concat(zOrder)
@@ -169,4 +169,5 @@ export declare function getBoundingArea(layout: Layout, ids: string[]): {
169
169
  w: number;
170
170
  h: number;
171
171
  z: number;
172
+ minZ: number;
172
173
  } | null;
@@ -576,10 +576,11 @@ export function getBoundingArea(layout, ids) {
576
576
  w: layoutItems[0].w,
577
577
  h: layoutItems[0].h,
578
578
  z: layoutItems[0].z,
579
+ minZ: layoutItems[0].z,
579
580
  };
580
581
  }
581
582
  var _a = layoutItems.reduce(function (acc, elem, idx, arr) {
582
- var _a, _b;
583
+ var _a, _b, _c, _d;
583
584
  if (idx === arr.length - 1) {
584
585
  return acc;
585
586
  }
@@ -592,13 +593,15 @@ export function getBoundingArea(layout, ids) {
592
593
  var elem1H = elem1.y - minY + elem1.h;
593
594
  var elem2H = elem2.y - minY + elem2.h;
594
595
  var maxZ = Math.max((_a = elem1 === null || elem1 === void 0 ? void 0 : elem1.z) !== null && _a !== void 0 ? _a : 0, (_b = elem2 === null || elem2 === void 0 ? void 0 : elem2.z) !== null && _b !== void 0 ? _b : 0);
596
+ var minZ = Math.min((_c = elem1 === null || elem1 === void 0 ? void 0 : elem1.z) !== null && _c !== void 0 ? _c : 0, (_d = elem2 === null || elem2 === void 0 ? void 0 : elem2.z) !== null && _d !== void 0 ? _d : 0);
595
597
  return {
596
598
  x: Math.min(elem1.x, elem2.x),
597
599
  y: Math.min(elem1.y, elem2.y),
598
600
  w: Math.max(elem1W, elem2W),
599
601
  h: Math.max(elem1H, elem2H),
600
- z: maxZ
602
+ z: maxZ,
603
+ minZ: minZ,
601
604
  };
602
- }, { x: 0, y: 0, w: 0, h: 0, z: 0 }), minX = _a.x, minY = _a.y, maxW = _a.w, maxH = _a.h, maxZ = _a.z;
603
- return { x: minX, y: minY, w: maxW, h: maxH, z: maxZ };
605
+ }, { x: 0, y: 0, w: 0, h: 0, z: 0, minZ: 0 }), minX = _a.x, minY = _a.y, maxW = _a.w, maxH = _a.h, maxZ = _a.z, minZ = _a.minZ;
606
+ return { x: minX, y: minY, w: maxW, h: maxH, z: maxZ, minZ: minZ };
604
607
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "publ-echo-test",
3
- "version": "0.0.184",
3
+ "version": "0.0.185",
4
4
  "private": false,
5
5
  "main": "dist/lib/index.js",
6
6
  "types": "dist/lib/index.d.js",