seat-editor 3.5.11 → 3.5.13

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 (11) hide show
  1. package/dist/components/layer-v3/index.js +8 -8
  2. package/dist/components/layer-v3/index.jsx +8 -8
  3. package/dist/components/modal-preview/index.js +9 -0
  4. package/dist/components/modal-preview/index.jsx +9 -0
  5. package/dist/features/board-v3/index.js +10 -7
  6. package/dist/features/board-v3/index.jsx +10 -7
  7. package/dist/features/board-v3/resize-element.d.ts +1 -0
  8. package/dist/features/board-v3/resize-element.js +2 -1
  9. package/dist/features/board-v3/utils.d.ts +4 -5
  10. package/dist/features/board-v3/utils.js +14 -3
  11. package/package.json +1 -1
package/dist/components/layer-v3/index.js CHANGED
@@ -40,7 +40,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
40
40
  }
41
41
  switch (shape) {
42
42
  case "square":
43
- return (_jsx("g", { "data-id": id, id: `${id}`, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_createElement("rect", Object.assign({}, commonProps, { key: id, width: width, height: height, rx: radius })), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
43
+ return (_jsx("g", { "data-id": id, id: `${id}`, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_createElement("rect", Object.assign({}, commonProps, { key: id, width: width, height: height, rx: radius })), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
44
44
  var _a, _b, _c, _d, _e, _f, _g;
45
45
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
46
46
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -74,7 +74,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
74
74
  return (_createElement("text", Object.assign({}, omit(commonProps, ["opacity", "stroke", "strokeWidth"]), { key: `${id}-label-${index}`, x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})` }), _ === null || _ === void 0 ? void 0 : _.label));
75
75
  })] }) }, id));
76
76
  case "circle":
77
- return (_jsx("g", { "data-id": id, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("circle", Object.assign({ cx: width / 2, cy: height / 2, r: Math.min(height, width) / 2, fill: fill }, commonProps), id), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
77
+ return (_jsx("g", { "data-id": id, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("circle", Object.assign({ cx: width / 2, cy: height / 2, r: Math.min(height, width) / 2, fill: fill }, commonProps), id), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
78
78
  var _a, _b, _c, _d, _e, _f, _g;
79
79
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
80
80
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -106,7 +106,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
106
106
  const cy = centerY + (tableRadius + seatRadius) * Math.sin(angle);
107
107
  return { cx, cy };
108
108
  });
109
- return (_jsx("g", { "data-id": id, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("circle", Object.assign({ cx: centerX, cy: centerY, r: tableRadius, fill: fill }, commonProps)), _jsx("g", { "data-seat": `${id}-seats`, children: seatCircles.map(({ cx, cy }, i) => (_jsx("circle", Object.assign({ cx: cx, cy: cy, r: seatRadius, fill: seatFill }, commonProps), `${id}-seat-${i}`))) }), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
109
+ return (_jsx("g", { "data-id": id, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("circle", Object.assign({ cx: centerX, cy: centerY, r: tableRadius, fill: fill }, commonProps)), _jsx("g", { "data-seat": `${id}-seats`, children: seatCircles.map(({ cx, cy }, i) => (_jsx("circle", Object.assign({ cx: cx, cy: cy, r: seatRadius, fill: seatFill }, commonProps), `${id}-seat-${i}`))) }), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
110
110
  var _a, _b, _c, _d, _e, _f, _g;
111
111
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
112
112
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -200,7 +200,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
200
200
  ...leftSeats,
201
201
  ...rightSeats,
202
202
  ];
203
- return (_jsx("g", { transform: `translate(${x}, ${y})`, "data-id": id, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("circle", Object.assign({ cx: width / 2, cy: height / 2, r: tableRadius }, commonProps, { fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, children: seats === null || seats === void 0 ? void 0 : seats.map(({ height, width, x, y, id }, i) => (_jsx("rect", { x: x, y: y, id: `seat-${id}`, height: height, width: width, rx: radius / 4, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
203
+ return (_jsx("g", { transform: `translate(${x}, ${y})`, "data-id": id, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("circle", Object.assign({ cx: width / 2, cy: height / 2, r: tableRadius }, commonProps, { fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, children: seats === null || seats === void 0 ? void 0 : seats.map(({ height, width, x, y, id }, i) => (_jsx("rect", { x: x, y: y, id: `seat-${id}`, height: height, width: width, rx: radius / 4, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
204
204
  var _a, _b, _c, _d, _e, _f, _g;
205
205
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
206
206
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -265,7 +265,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
265
265
  cy,
266
266
  id: "right",
267
267
  }));
268
- return (_jsx("g", { "data-id": id, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("rect", Object.assign({ width: width, height: height }, commonProps, { rx: radius, fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, transform: `translate(${-x}, ${-y})`, children: [...topSeats, ...bottomSeats, ...leftSeats, ...rightSeats].map(({ cx, cy, id }, i) => (_jsx("circle", { id: `seat-${id}`, cx: cx, cy: cy, r: r, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
268
+ return (_jsx("g", { "data-id": id, transform: `translate(${x}, ${y})`, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("rect", Object.assign({ width: width, height: height }, commonProps, { rx: radius, fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, transform: `translate(${-x}, ${-y})`, children: [...topSeats, ...bottomSeats, ...leftSeats, ...rightSeats].map(({ cx, cy, id }, i) => (_jsx("circle", { id: `seat-${id}`, cx: cx, cy: cy, r: r, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
269
269
  var _a, _b, _c, _d, _e, _f, _g;
270
270
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
271
271
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -334,7 +334,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
334
334
  direction: seat.id,
335
335
  fraction: 0.4,
336
336
  }) })));
337
- return (_jsx("g", { transform: `translate(${x}, ${y})`, "data-id": id, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("rect", Object.assign({ width: width, height: height, rx: radius }, commonProps, { fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, children: seats === null || seats === void 0 ? void 0 : seats.map(({ d, id }, i) => (_jsx("path", { id: `seat-${id}`, d: d, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
337
+ return (_jsx("g", { transform: `translate(${x}, ${y})`, "data-id": id, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("rect", Object.assign({ width: width, height: height, rx: radius }, commonProps, { fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, children: seats === null || seats === void 0 ? void 0 : seats.map(({ d, id }, i) => (_jsx("path", { id: `seat-${id}`, d: d, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
338
338
  var _a, _b, _c, _d, _e, _f, _g;
339
339
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
340
340
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -427,7 +427,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
427
427
  ...leftSeats,
428
428
  ...rightSeats,
429
429
  ];
430
- return (_jsx("g", { transform: `translate(${x}, ${y})`, "data-id": id, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("rect", Object.assign({ width: width, height: height, rx: radius }, commonProps, { fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, transform: `translate(${-x}, ${-y})`, children: seats === null || seats === void 0 ? void 0 : seats.map(({ height, width, x, y, id }, i) => (_jsx("rect", { x: x, y: y, id: `seat-${id}`, height: height, width: width, rx: radius / 4, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
430
+ return (_jsx("g", { transform: `translate(${x}, ${y})`, "data-id": id, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("rect", Object.assign({ width: width, height: height, rx: radius }, commonProps, { fill: fill })), _jsx("g", { "data-seat": `${id}-seats`, transform: `translate(${-x}, ${-y})`, children: seats === null || seats === void 0 ? void 0 : seats.map(({ height, width, x, y, id }, i) => (_jsx("rect", { x: x, y: y, id: `seat-${id}`, height: height, width: width, rx: radius / 4, fill: seatFill }, `${id}-seat-${i}`))) }, `${id}-seats`), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
431
431
  var _a, _b, _c, _d, _e, _f, _g;
432
432
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
433
433
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
@@ -444,7 +444,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
444
444
  case "background":
445
445
  return (_jsx("g", { id: `${id}`, "data-id": id, transform: `translate(${x}, ${y})`, style: {
446
446
  pointerEvents: lockBackground ? "none" : "auto",
447
- }, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("image", Object.assign({ href: src, width: width, height: height }, commonProps)), _jsx("g", { transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
447
+ }, children: _jsxs("g", { transform: `rotate(${rotation}, 0, 0)`, children: [_jsx("image", Object.assign({ href: src, width: width, height: height }, commonProps)), _jsx("g", { "data-text": `${id}-text`, transform: `rotate(${-rotation}, ${width / 2}, ${height / 2})`, children: labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
448
448
  var _a, _b, _c, _d, _e, _f, _g;
449
449
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
450
450
  const cy = height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0);
package/dist/components/layer-v3/index.jsx CHANGED
@@ -41,7 +41,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
41
41
  return (<g key={id} data-id={id} id={`${id}`} transform={`translate(${x}, ${y})`}>
42
42
  <g transform={`rotate(${rotation}, 0, 0)`}>
43
43
  <rect {...commonProps} key={id} width={width} height={height} rx={radius}/>
44
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
44
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
45
45
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
46
46
  var _a, _b, _c, _d, _e, _f, _g;
47
47
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -101,7 +101,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
101
101
  return (<g key={id} data-id={id} transform={`translate(${x}, ${y})`}>
102
102
  <g transform={`rotate(${rotation}, 0, 0)`}>
103
103
  <circle key={id} cx={width / 2} cy={height / 2} r={Math.min(height, width) / 2} fill={fill} {...commonProps}/>
104
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
104
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
105
105
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
106
106
  var _a, _b, _c, _d, _e, _f, _g;
107
107
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -153,7 +153,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
153
153
  {seatCircles.map(({ cx, cy }, i) => (<circle key={`${id}-seat-${i}`} cx={cx} cy={cy} r={seatRadius} fill={seatFill} {...commonProps}/>))}
154
154
  </g>
155
155
 
156
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
156
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
157
157
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
158
158
  var _a, _b, _c, _d, _e, _f, _g;
159
159
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -260,7 +260,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
260
260
  <g key={`${id}-seats`} data-seat={`${id}-seats`}>
261
261
  {seats === null || seats === void 0 ? void 0 : seats.map(({ height, width, x, y, id }, i) => (<rect x={x} y={y} key={`${id}-seat-${i}`} id={`seat-${id}`} height={height} width={width} rx={radius / 4} fill={seatFill}/>))}
262
262
  </g>
263
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
263
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
264
264
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
265
265
  var _a, _b, _c, _d, _e, _f, _g;
266
266
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -339,7 +339,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
339
339
  <g key={`${id}-seats`} data-seat={`${id}-seats`} transform={`translate(${-x}, ${-y})`}>
340
340
  {[...topSeats, ...bottomSeats, ...leftSeats, ...rightSeats].map(({ cx, cy, id }, i) => (<circle key={`${id}-seat-${i}`} id={`seat-${id}`} cx={cx} cy={cy} r={r} fill={seatFill}/>))}
341
341
  </g>
342
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
342
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
343
343
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
344
344
  var _a, _b, _c, _d, _e, _f, _g;
345
345
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -421,7 +421,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
421
421
  <g key={`${id}-seats`} data-seat={`${id}-seats`}>
422
422
  {seats === null || seats === void 0 ? void 0 : seats.map(({ d, id }, i) => (<path key={`${id}-seat-${i}`} id={`seat-${id}`} d={d} fill={seatFill}/>))}
423
423
  </g>
424
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
424
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
425
425
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
426
426
  var _a, _b, _c, _d, _e, _f, _g;
427
427
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -527,7 +527,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
527
527
  <g key={`${id}-seats`} data-seat={`${id}-seats`} transform={`translate(${-x}, ${-y})`}>
528
528
  {seats === null || seats === void 0 ? void 0 : seats.map(({ height, width, x, y, id }, i) => (<rect x={x} y={y} key={`${id}-seat-${i}`} id={`seat-${id}`} height={height} width={width} rx={radius / 4} fill={seatFill}/>))}
529
529
  </g>
530
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
530
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
531
531
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
532
532
  var _a, _b, _c, _d, _e, _f, _g;
533
533
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
@@ -560,7 +560,7 @@ const Layers = ({ components, selectedComponent, activeTool, selectionLines, })
560
560
  }}>
561
561
  <g transform={`rotate(${rotation}, 0, 0)`}>
562
562
  <image href={src} width={width} height={height} {...commonProps}/>
563
- <g transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
563
+ <g data-text={`${id}-text`} transform={`rotate(${-rotation}, ${width / 2}, ${height / 2})`}>
564
564
  {labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
565
565
  var _a, _b, _c, _d, _e, _f, _g;
566
566
  const cx = width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0);
package/dist/components/modal-preview/index.js CHANGED
@@ -2,9 +2,18 @@
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import { Modal } from "antd";
4
4
  import { useAppSelector, useAppDispatch } from "../../hooks/use-redux";
5
+ import { useEffect } from "react";
5
6
  const ModalPreview = ({ children }) => {
6
7
  const { isPreview } = useAppSelector((state) => state.tool);
7
8
  const dispatch = useAppDispatch();
9
+ useEffect(() => {
10
+ if (!isPreview) {
11
+ dispatch({
12
+ type: "board/setTagType",
13
+ payload: "default",
14
+ });
15
+ }
16
+ }, [isPreview]);
8
17
  return (_jsx(Modal, { open: isPreview, onCancel: () => dispatch({ type: "tool/setTooglePreview", payload: false }), width: 700, title: "Preview Board", centered: true, footer: null, children: _jsx("div", { className: "flex flex-col p-4 h-[500px]", children: children }) }));
9
18
  };
10
19
  export default ModalPreview;
package/dist/components/modal-preview/index.jsx CHANGED
@@ -1,9 +1,18 @@
1
1
  "use client";
2
2
  import { Modal } from "antd";
3
3
  import { useAppSelector, useAppDispatch } from "../../hooks/use-redux";
4
+ import { useEffect } from "react";
4
5
  const ModalPreview = ({ children }) => {
5
6
  const { isPreview } = useAppSelector((state) => state.tool);
6
7
  const dispatch = useAppDispatch();
8
+ useEffect(() => {
9
+ if (!isPreview) {
10
+ dispatch({
11
+ type: "board/setTagType",
12
+ payload: "default",
13
+ });
14
+ }
15
+ }, [isPreview]);
7
16
  return (<Modal open={isPreview} onCancel={() => dispatch({ type: "tool/setTooglePreview", payload: false })} width={700} title="Preview Board" centered footer={null}>
8
17
  <div className="flex flex-col p-4 h-[500px]">{children}</div>
9
18
  </Modal>);
package/dist/features/board-v3/index.js CHANGED
@@ -122,7 +122,6 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
122
122
  const allBox = groupIdSelection === null || groupIdSelection === void 0 ? void 0 : groupIdSelection.map((id) => {
123
123
  var _a;
124
124
  const { g } = (_a = getAttributeElements(svgRef.current, [String(id)])) === null || _a === void 0 ? void 0 : _a[0];
125
- const translate = getTranslate(g);
126
125
  const size = getGlobalBBox(svgRef.current, g);
127
126
  return Object.assign({}, size);
128
127
  });
@@ -829,7 +828,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
829
828
  updateSelectionBox(svg, resultSelection);
830
829
  const scaleX = resultSelection.width / oldSel.width;
831
830
  const scaleY = resultSelection.height / oldSel.height;
832
- allGroupsAttribute.forEach(({ g, element, seatGroup, seats }, i) => {
831
+ allGroupsAttribute.forEach(({ g, element, seatGroup, seats, text }, i) => {
833
832
  var _a, _b;
834
833
  const activeId = JSON.parse(g === null || g === void 0 ? void 0 : g.getAttribute("data-id"));
835
834
  const elementOld = allDataRealSelection === null || allDataRealSelection === void 0 ? void 0 : allDataRealSelection.find((el) => el.id == activeId);
@@ -857,6 +856,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
857
856
  width: newWidth,
858
857
  height: newHeight,
859
858
  points: relativePoinst,
859
+ rotation: elementOld === null || elementOld === void 0 ? void 0 : elementOld.rotation,
860
+ labels: elementOld === null || elementOld === void 0 ? void 0 : elementOld.labels,
860
861
  };
861
862
  if (seats.length !== 0) {
862
863
  const seatsPositions = elementOld === null || elementOld === void 0 ? void 0 : elementOld.seatPositions;
@@ -912,7 +913,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
912
913
  });
913
914
  }
914
915
  }
915
- applyResizeToSvgElement(element, g, newElement);
916
+ applyResizeToSvgElement(element, g, newElement, text);
916
917
  });
917
918
  };
918
919
  if (downAtResizePositionAndHasSelectionBox)
@@ -1055,7 +1056,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1055
1056
  var _a, _b;
1056
1057
  const activeId = selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id;
1057
1058
  const svg = svgRef.current;
1058
- const { g, element, seats, seatGroup } = getAttributeElement(svg, activeId);
1059
+ const { g, element, seats, seatGroup, text } = getAttributeElement(svg, activeId);
1059
1060
  const isZeroRotate = (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.rotation) === 0 &&
1060
1061
  !(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape.includes("circle"));
1061
1062
  const elementSelect = {
@@ -1067,6 +1068,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1067
1068
  seatCount: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.seatCount,
1068
1069
  openSpace: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.openSpace,
1069
1070
  points: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.points,
1071
+ rotation: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.rotation,
1072
+ labels: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.labels,
1070
1073
  };
1071
1074
  const oldSel = {
1072
1075
  x: selectedLines === null || selectedLines === void 0 ? void 0 : selectedLines.x,
@@ -1137,6 +1140,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1137
1140
  width: newWidth,
1138
1141
  height: newHeight,
1139
1142
  points: relativePoinst,
1143
+ rotation: elementSelect === null || elementSelect === void 0 ? void 0 : elementSelect.rotation,
1144
+ labels: elementSelect === null || elementSelect === void 0 ? void 0 : elementSelect.labels,
1140
1145
  };
1141
1146
  if (seats.length !== 0) {
1142
1147
  if ((selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "table-seat-circle") {
@@ -1190,7 +1195,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1190
1195
  });
1191
1196
  }
1192
1197
  }
1193
- applyResizeToSvgElement(element, g, newElement);
1198
+ applyResizeToSvgElement(element, g, newElement, text);
1194
1199
  isResizeRef.current = true;
1195
1200
  };
1196
1201
  // const hasSelectedOneElement =
@@ -1807,8 +1812,6 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1807
1812
  });
1808
1813
  }
1809
1814
  };
1810
- const singleSelectionTable = useAppSelector((state) => state.panel.selectedComponent);
1811
- const groupSelection = useAppSelector((state) => state.panel.selectedGroup);
1812
1815
  const footerInfoList = useMemo(() => {
1813
1816
  return [
1814
1817
  {
package/dist/features/board-v3/index.jsx CHANGED
@@ -121,7 +121,6 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
121
121
  const allBox = groupIdSelection === null || groupIdSelection === void 0 ? void 0 : groupIdSelection.map((id) => {
122
122
  var _a;
123
123
  const { g } = (_a = getAttributeElements(svgRef.current, [String(id)])) === null || _a === void 0 ? void 0 : _a[0];
124
- const translate = getTranslate(g);
125
124
  const size = getGlobalBBox(svgRef.current, g);
126
125
  return Object.assign({}, size);
127
126
  });
@@ -828,7 +827,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
828
827
  updateSelectionBox(svg, resultSelection);
829
828
  const scaleX = resultSelection.width / oldSel.width;
830
829
  const scaleY = resultSelection.height / oldSel.height;
831
- allGroupsAttribute.forEach(({ g, element, seatGroup, seats }, i) => {
830
+ allGroupsAttribute.forEach(({ g, element, seatGroup, seats, text }, i) => {
832
831
  var _a, _b;
833
832
  const activeId = JSON.parse(g === null || g === void 0 ? void 0 : g.getAttribute("data-id"));
834
833
  const elementOld = allDataRealSelection === null || allDataRealSelection === void 0 ? void 0 : allDataRealSelection.find((el) => el.id == activeId);
@@ -856,6 +855,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
856
855
  width: newWidth,
857
856
  height: newHeight,
858
857
  points: relativePoinst,
858
+ rotation: elementOld === null || elementOld === void 0 ? void 0 : elementOld.rotation,
859
+ labels: elementOld === null || elementOld === void 0 ? void 0 : elementOld.labels,
859
860
  };
860
861
  if (seats.length !== 0) {
861
862
  const seatsPositions = elementOld === null || elementOld === void 0 ? void 0 : elementOld.seatPositions;
@@ -911,7 +912,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
911
912
  });
912
913
  }
913
914
  }
914
- applyResizeToSvgElement(element, g, newElement);
915
+ applyResizeToSvgElement(element, g, newElement, text);
915
916
  });
916
917
  };
917
918
  if (downAtResizePositionAndHasSelectionBox)
@@ -1054,7 +1055,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1054
1055
  var _a, _b;
1055
1056
  const activeId = selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id;
1056
1057
  const svg = svgRef.current;
1057
- const { g, element, seats, seatGroup } = getAttributeElement(svg, activeId);
1058
+ const { g, element, seats, seatGroup, text } = getAttributeElement(svg, activeId);
1058
1059
  const isZeroRotate = (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.rotation) === 0 &&
1059
1060
  !(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape.includes("circle"));
1060
1061
  const elementSelect = {
@@ -1066,6 +1067,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1066
1067
  seatCount: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.seatCount,
1067
1068
  openSpace: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.openSpace,
1068
1069
  points: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.points,
1070
+ rotation: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.rotation,
1071
+ labels: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.labels,
1069
1072
  };
1070
1073
  const oldSel = {
1071
1074
  x: selectedLines === null || selectedLines === void 0 ? void 0 : selectedLines.x,
@@ -1136,6 +1139,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1136
1139
  width: newWidth,
1137
1140
  height: newHeight,
1138
1141
  points: relativePoinst,
1142
+ rotation: elementSelect === null || elementSelect === void 0 ? void 0 : elementSelect.rotation,
1143
+ labels: elementSelect === null || elementSelect === void 0 ? void 0 : elementSelect.labels,
1139
1144
  };
1140
1145
  if (seats.length !== 0) {
1141
1146
  if ((selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "table-seat-circle") {
@@ -1189,7 +1194,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1189
1194
  });
1190
1195
  }
1191
1196
  }
1192
- applyResizeToSvgElement(element, g, newElement);
1197
+ applyResizeToSvgElement(element, g, newElement, text);
1193
1198
  isResizeRef.current = true;
1194
1199
  };
1195
1200
  // const hasSelectedOneElement =
@@ -1806,8 +1811,6 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1806
1811
  });
1807
1812
  }
1808
1813
  };
1809
- const singleSelectionTable = useAppSelector((state) => state.panel.selectedComponent);
1810
- const groupSelection = useAppSelector((state) => state.panel.selectedGroup);
1811
1814
  const footerInfoList = useMemo(() => {
1812
1815
  return [
1813
1816
  {
package/dist/features/board-v3/resize-element.d.ts CHANGED
@@ -6,6 +6,7 @@ interface ResizeTarget {
6
6
  seats?: NodeListOf<SVGGElement>;
7
7
  seatGroup?: SVGGElement;
8
8
  points?: any[];
9
+ text?: SVGGElement | null;
9
10
  }
10
11
  export declare function getAttributeElement(root: SVGSVGElement, id: string): ResizeTarget | null;
11
12
  export declare function getAttributeElements(root: SVGSVGElement, id: string[]): ResizeTarget[];
package/dist/features/board-v3/resize-element.js CHANGED
@@ -5,6 +5,7 @@ export function getAttributeElement(root, id) {
5
5
  const seats = root.querySelectorAll(`g[data-seat="${id}-seats"]`);
6
6
  const seatGroup = root.querySelector(`g[data-seat="${id}-seats"]`);
7
7
  const boundingBox = root.querySelector(`g[data-bounding-box="${id}"]`);
8
+ const text = root === null || root === void 0 ? void 0 : root.querySelector(`g[data-text="${id}-text"]`);
8
9
  if (boundingBox) {
9
10
  const element = boundingBox.querySelector("rect");
10
11
  return { g: boundingBox, inner: null, element, seats, seatGroup };
@@ -41,7 +42,7 @@ export function getAttributeElement(root, id) {
41
42
  }
42
43
  if (!inner || !element)
43
44
  return null;
44
- return { g, inner, element, seats: listSeats, seatGroup, points };
45
+ return { g, inner, element, seats: listSeats, seatGroup, points, text };
45
46
  }
46
47
  export function getAttributeElements(root, id) {
47
48
  return id.map((id) => getAttributeElement(root, id));
package/dist/features/board-v3/utils.d.ts CHANGED
@@ -37,7 +37,7 @@ export declare function getAnchorByHandle(handle: ResizeHandle, box: {
37
37
  ax: number;
38
38
  ay: number;
39
39
  };
40
- import { TableProps } from "../../dto/table";
40
+ import { Label, TableProps } from "../../dto/table";
41
41
  interface ResizeSeatSquare {
42
42
  seatsPositions: {
43
43
  top: number;
@@ -150,11 +150,10 @@ type ResizeResult = {
150
150
  width: number;
151
151
  height: number;
152
152
  points?: Pt[];
153
+ rotation?: number;
154
+ labels?: Label[];
153
155
  };
154
- type ElementComponent = {
155
- fill: string;
156
- };
157
- export declare function applyResizeToSvgElement(element: SVGGraphicsElement, group: SVGGElement, resize: ResizeResult, component?: ElementComponent): void;
156
+ export declare function applyResizeToSvgElement(element: SVGGraphicsElement, group: SVGGElement, resize: ResizeResult, text?: SVGGElement | null): void;
158
157
  type ResizeParams = {
159
158
  element: SVGGraphicsElement;
160
159
  group: SVGGElement;
package/dist/features/board-v3/utils.js CHANGED
@@ -1017,19 +1017,30 @@ const updateSvgAttrs = (el, attrs) => {
1017
1017
  }
1018
1018
  }
1019
1019
  };
1020
- export function applyResizeToSvgElement(element, group, resize, component) {
1020
+ export function applyResizeToSvgElement(element, group, resize, text) {
1021
+ var _a, _b, _c, _d;
1021
1022
  const tagName = element.tagName.toLowerCase();
1022
1023
  switch (tagName) {
1023
1024
  case "rect":
1024
1025
  case "image": {
1026
+ const width = resize.width < MIN_WIDTH ? MIN_WIDTH : Math.round(resize.width);
1027
+ const height = resize.height < MIN_HEIGHT ? MIN_HEIGHT : Math.round(resize.height);
1028
+ const rotation = (_a = resize.rotation) !== null && _a !== void 0 ? _a : 0;
1029
+ const labelsDefault = (_b = resize === null || resize === void 0 ? void 0 : resize.labels) !== null && _b !== void 0 ? _b : [];
1025
1030
  updateSvgAttrs(element, {
1026
- width: resize.width < 60 ? 60 : Math.round(resize.width),
1027
- height: resize.height < MIN_HEIGHT ? MIN_HEIGHT : Math.round(resize.height),
1031
+ width,
1032
+ height,
1028
1033
  // fill: component.fill,
1029
1034
  });
1030
1035
  updateSvgAttrs(group, {
1031
1036
  transform: `translate(${Math.round(resize.x)}, ${Math.round(resize.y)})`,
1032
1037
  });
1038
+ text === null || text === void 0 ? void 0 : text.setAttribute("transform", `rotate(${-rotation}, ${width / 2}, ${height / 2})`);
1039
+ const origintext = text === null || text === void 0 ? void 0 : text.querySelector("text");
1040
+ if (origintext) {
1041
+ origintext.setAttribute("x", String((width / 2) + ((_c = labelsDefault === null || labelsDefault === void 0 ? void 0 : labelsDefault[0]) === null || _c === void 0 ? void 0 : _c.x)));
1042
+ origintext.setAttribute("y", String((height / 2) + ((_d = labelsDefault === null || labelsDefault === void 0 ? void 0 : labelsDefault[0]) === null || _d === void 0 ? void 0 : _d.y)));
1043
+ }
1033
1044
  break;
1034
1045
  }
1035
1046
  case "circle": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "seat-editor",
3
- "version": "3.5.11",
3
+ "version": "3.5.13",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",