seat-editor 3.5.34 → 3.5.45

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.
@@ -205,10 +205,18 @@ const TouchScrollDetect = () => {
205
205
  event: "dragenter",
206
206
  properties: { strokeWidth: 5 },
207
207
  },
208
+ // {
209
+ // event: "selected",
210
+ // properties: { strokeWidth: 5 },
211
+ // },
208
212
  {
209
- event: "selected",
210
- properties: { strokeWidth: 5 },
213
+ event: "hoverdragontable",
214
+ properties: {
215
+ strokeWidth: 5,
216
+ filter: "drop-shadow(0px 0px 5px red)",
217
+ },
211
218
  },
219
+ // hoverdragontable
212
220
  ], iconTags: [
213
221
  {
214
222
  icon: _jsx(ChairIcon, {}),
@@ -229,10 +229,18 @@ const TouchScrollDetect = () => {
229
229
  event: "dragenter",
230
230
  properties: { strokeWidth: 5 },
231
231
  },
232
+ // {
233
+ // event: "selected",
234
+ // properties: { strokeWidth: 5 },
235
+ // },
232
236
  {
233
- event: "selected",
234
- properties: { strokeWidth: 5 },
237
+ event: "hoverdragontable",
238
+ properties: {
239
+ strokeWidth: 5,
240
+ filter: "drop-shadow(0px 0px 5px red)",
241
+ },
235
242
  },
243
+ // hoverdragontable
236
244
  ]} iconTags={[
237
245
  {
238
246
  icon: <ChairIcon />,
@@ -1 +1 @@
1
- export type EventHandleType = "dragover" | "dragleave" | "drop" | "dragend" | "mousemove" | "mouseleave" | "mouseenter" | "dragleave" | "dragenter" | "pointerover" | "mousedown" | "pointerup" | "pointerdown" | "pointermove" | "pointerup" | "touchstart" | "touchmove" | "touchend" | "selected";
1
+ export type EventHandleType = "dragover" | "dragleave" | "drop" | "dragend" | "mousemove" | "mouseleave" | "mouseenter" | "dragleave" | "dragenter" | "pointerover" | "mousedown" | "pointerup" | "pointerdown" | "pointermove" | "pointerup" | "touchstart" | "touchmove" | "touchend" | "selected" | "hoverdragontable";
@@ -317,6 +317,8 @@ const LayerView = (props) => {
317
317
  console.error("Invalid data-id JSON:", err);
318
318
  }
319
319
  };
320
+ const dataBeforeHoverRef = useRef([]);
321
+ let dataBeforeHoveredUnderGhost = [];
320
322
  const getSvgCoords = (e) => {
321
323
  var _a;
322
324
  const svg = svgRef.current;
@@ -383,7 +385,7 @@ const LayerView = (props) => {
383
385
  y: y - startBox.y,
384
386
  };
385
387
  const pointerMoveGhost = (ev) => {
386
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
388
+ var _a;
387
389
  if (allowedDrag) {
388
390
  isDragging.current = true;
389
391
  const p = svg.createSVGPoint();
@@ -406,21 +408,43 @@ const LayerView = (props) => {
406
408
  const hoveredGroup = elemUnderPointer === null || elemUnderPointer === void 0 ? void 0 : elemUnderPointer.closest("g[data-id]");
407
409
  const dataHoveredGhostId = JSON.parse((hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.getAttribute("data-id")) || "{}");
408
410
  const dataGhostId = JSON.parse(ghost.getAttribute("data-id") || "{}");
409
- if (dataHoveredGhostId === hoverUnderghostId.current) {
410
- (_c = (_b = (_a = hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute("opacity", "1");
411
+ const findEvent = eventMatchTable === null || eventMatchTable === void 0 ? void 0 : eventMatchTable.find((item) => item.event === "hoverdragontable");
412
+ if (dataHoveredGhostId === hoverUnderghostId.current && findEvent) {
413
+ const allKeyEvent = Object.keys(findEvent.properties);
414
+ dataBeforeHoveredUnderGhost = allKeyEvent.map((key) => {
415
+ return {
416
+ key,
417
+ value: hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.getAttribute(key)
418
+ };
419
+ });
420
+ Object.entries(findEvent.properties).forEach(([key, value]) => {
421
+ var _a, _b, _c;
422
+ (_c = (_b = (_a = hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute(key, value);
423
+ });
411
424
  }
412
425
  if (dataHoveredGhostId !== hoverUnderghostId.current) {
413
426
  const dataPreview = hoverUnderghostId.current;
414
427
  const hoveredBefore = svg.querySelector(`g[data-id="${dataPreview}"]`);
415
428
  if (hoveredBefore) {
416
- (_f = (_e = (_d = hoveredBefore.firstChild) === null || _d === void 0 ? void 0 : _d.children) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.setAttribute("opacity", "0.5");
429
+ dataBeforeHoveredUnderGhost.forEach((item) => {
430
+ var _a, _b, _c;
431
+ (_c = (_b = (_a = hoveredBefore.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute(item.key, item.value);
432
+ });
417
433
  }
418
434
  }
419
- (_j = (_h = (_g = targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.firstChild) === null || _g === void 0 ? void 0 : _g.children) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.setAttribute("opacity", "1");
435
+ if (findEvent && targetGroup) {
436
+ // console
437
+ const idTarget = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
438
+ const targetElement = svg.querySelector(`g[data-id="${idTarget}"]`);
439
+ Object.entries(findEvent.properties).forEach(([key, value]) => {
440
+ var _a, _b, _c;
441
+ (_c = (_b = (_a = targetElement === null || targetElement === void 0 ? void 0 : targetElement.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute(key, value);
442
+ });
443
+ }
420
444
  if (dataHoveredGhostId !== dataGhostId) {
421
445
  hoverUnderghostId.current = dataHoveredGhostId;
422
446
  }
423
- const posSVG = p.matrixTransform((_k = svg.getScreenCTM()) === null || _k === void 0 ? void 0 : _k.inverse());
447
+ const posSVG = p.matrixTransform((_a = svg.getScreenCTM()) === null || _a === void 0 ? void 0 : _a.inverse());
424
448
  // posisi awal ghost di bawah kursor tanpa matrix dulu
425
449
  const newX = posSVG.x - offset.x;
426
450
  const newY = posSVG.y - offset.y;
@@ -316,6 +316,8 @@ const LayerView = (props) => {
316
316
  console.error("Invalid data-id JSON:", err);
317
317
  }
318
318
  };
319
+ const dataBeforeHoverRef = useRef([]);
320
+ let dataBeforeHoveredUnderGhost = [];
319
321
  const getSvgCoords = (e) => {
320
322
  var _a;
321
323
  const svg = svgRef.current;
@@ -382,7 +384,7 @@ const LayerView = (props) => {
382
384
  y: y - startBox.y,
383
385
  };
384
386
  const pointerMoveGhost = (ev) => {
385
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
387
+ var _a;
386
388
  if (allowedDrag) {
387
389
  isDragging.current = true;
388
390
  const p = svg.createSVGPoint();
@@ -405,21 +407,43 @@ const LayerView = (props) => {
405
407
  const hoveredGroup = elemUnderPointer === null || elemUnderPointer === void 0 ? void 0 : elemUnderPointer.closest("g[data-id]");
406
408
  const dataHoveredGhostId = JSON.parse((hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.getAttribute("data-id")) || "{}");
407
409
  const dataGhostId = JSON.parse(ghost.getAttribute("data-id") || "{}");
408
- if (dataHoveredGhostId === hoverUnderghostId.current) {
409
- (_c = (_b = (_a = hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute("opacity", "1");
410
+ const findEvent = eventMatchTable === null || eventMatchTable === void 0 ? void 0 : eventMatchTable.find((item) => item.event === "hoverdragontable");
411
+ if (dataHoveredGhostId === hoverUnderghostId.current && findEvent) {
412
+ const allKeyEvent = Object.keys(findEvent.properties);
413
+ dataBeforeHoveredUnderGhost = allKeyEvent.map((key) => {
414
+ return {
415
+ key,
416
+ value: hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.getAttribute(key)
417
+ };
418
+ });
419
+ Object.entries(findEvent.properties).forEach(([key, value]) => {
420
+ var _a, _b, _c;
421
+ (_c = (_b = (_a = hoveredGroup === null || hoveredGroup === void 0 ? void 0 : hoveredGroup.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute(key, value);
422
+ });
410
423
  }
411
424
  if (dataHoveredGhostId !== hoverUnderghostId.current) {
412
425
  const dataPreview = hoverUnderghostId.current;
413
426
  const hoveredBefore = svg.querySelector(`g[data-id="${dataPreview}"]`);
414
427
  if (hoveredBefore) {
415
- (_f = (_e = (_d = hoveredBefore.firstChild) === null || _d === void 0 ? void 0 : _d.children) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.setAttribute("opacity", "0.5");
428
+ dataBeforeHoveredUnderGhost.forEach((item) => {
429
+ var _a, _b, _c;
430
+ (_c = (_b = (_a = hoveredBefore.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute(item.key, item.value);
431
+ });
416
432
  }
417
433
  }
418
- (_j = (_h = (_g = targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.firstChild) === null || _g === void 0 ? void 0 : _g.children) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.setAttribute("opacity", "1");
434
+ if (findEvent && targetGroup) {
435
+ // console
436
+ const idTarget = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
437
+ const targetElement = svg.querySelector(`g[data-id="${idTarget}"]`);
438
+ Object.entries(findEvent.properties).forEach(([key, value]) => {
439
+ var _a, _b, _c;
440
+ (_c = (_b = (_a = targetElement === null || targetElement === void 0 ? void 0 : targetElement.firstChild) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.setAttribute(key, value);
441
+ });
442
+ }
419
443
  if (dataHoveredGhostId !== dataGhostId) {
420
444
  hoverUnderghostId.current = dataHoveredGhostId;
421
445
  }
422
- const posSVG = p.matrixTransform((_k = svg.getScreenCTM()) === null || _k === void 0 ? void 0 : _k.inverse());
446
+ const posSVG = p.matrixTransform((_a = svg.getScreenCTM()) === null || _a === void 0 ? void 0 : _a.inverse());
423
447
  // posisi awal ghost di bawah kursor tanpa matrix dulu
424
448
  const newX = posSVG.x - offset.x;
425
449
  const newY = posSVG.y - offset.y;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "seat-editor",
3
- "version": "3.5.34",
3
+ "version": "3.5.45",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",