seat-editor 3.5.12 → 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 (9) 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/features/board-v3/index.js +10 -6
  4. package/dist/features/board-v3/index.jsx +10 -6
  5. package/dist/features/board-v3/resize-element.d.ts +1 -0
  6. package/dist/features/board-v3/resize-element.js +2 -1
  7. package/dist/features/board-v3/utils.d.ts +4 -5
  8. package/dist/features/board-v3/utils.js +14 -3
  9. 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/features/board-v3/index.js CHANGED
@@ -828,7 +828,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
828
828
  updateSelectionBox(svg, resultSelection);
829
829
  const scaleX = resultSelection.width / oldSel.width;
830
830
  const scaleY = resultSelection.height / oldSel.height;
831
- allGroupsAttribute.forEach(({ g, element, seatGroup, seats }, i) => {
831
+ allGroupsAttribute.forEach(({ g, element, seatGroup, seats, text }, i) => {
832
832
  var _a, _b;
833
833
  const activeId = JSON.parse(g === null || g === void 0 ? void 0 : g.getAttribute("data-id"));
834
834
  const elementOld = allDataRealSelection === null || allDataRealSelection === void 0 ? void 0 : allDataRealSelection.find((el) => el.id == activeId);
@@ -856,6 +856,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
856
856
  width: newWidth,
857
857
  height: newHeight,
858
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,
859
861
  };
860
862
  if (seats.length !== 0) {
861
863
  const seatsPositions = elementOld === null || elementOld === void 0 ? void 0 : elementOld.seatPositions;
@@ -911,7 +913,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
911
913
  });
912
914
  }
913
915
  }
914
- applyResizeToSvgElement(element, g, newElement);
916
+ applyResizeToSvgElement(element, g, newElement, text);
915
917
  });
916
918
  };
917
919
  if (downAtResizePositionAndHasSelectionBox)
@@ -1054,7 +1056,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1054
1056
  var _a, _b;
1055
1057
  const activeId = selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id;
1056
1058
  const svg = svgRef.current;
1057
- const { g, element, seats, seatGroup } = getAttributeElement(svg, activeId);
1059
+ const { g, element, seats, seatGroup, text } = getAttributeElement(svg, activeId);
1058
1060
  const isZeroRotate = (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.rotation) === 0 &&
1059
1061
  !(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape.includes("circle"));
1060
1062
  const elementSelect = {
@@ -1066,6 +1068,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1066
1068
  seatCount: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.seatCount,
1067
1069
  openSpace: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.openSpace,
1068
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,
1069
1073
  };
1070
1074
  const oldSel = {
1071
1075
  x: selectedLines === null || selectedLines === void 0 ? void 0 : selectedLines.x,
@@ -1136,6 +1140,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1136
1140
  width: newWidth,
1137
1141
  height: newHeight,
1138
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,
1139
1145
  };
1140
1146
  if (seats.length !== 0) {
1141
1147
  if ((selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "table-seat-circle") {
@@ -1189,7 +1195,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1189
1195
  });
1190
1196
  }
1191
1197
  }
1192
- applyResizeToSvgElement(element, g, newElement);
1198
+ applyResizeToSvgElement(element, g, newElement, text);
1193
1199
  isResizeRef.current = true;
1194
1200
  };
1195
1201
  // const hasSelectedOneElement =
@@ -1806,8 +1812,6 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1806
1812
  });
1807
1813
  }
1808
1814
  };
1809
- const singleSelectionTable = useAppSelector((state) => state.panel.selectedComponent);
1810
- const groupSelection = useAppSelector((state) => state.panel.selectedGroup);
1811
1815
  const footerInfoList = useMemo(() => {
1812
1816
  return [
1813
1817
  {
package/dist/features/board-v3/index.jsx CHANGED
@@ -827,7 +827,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
827
827
  updateSelectionBox(svg, resultSelection);
828
828
  const scaleX = resultSelection.width / oldSel.width;
829
829
  const scaleY = resultSelection.height / oldSel.height;
830
- allGroupsAttribute.forEach(({ g, element, seatGroup, seats }, i) => {
830
+ allGroupsAttribute.forEach(({ g, element, seatGroup, seats, text }, i) => {
831
831
  var _a, _b;
832
832
  const activeId = JSON.parse(g === null || g === void 0 ? void 0 : g.getAttribute("data-id"));
833
833
  const elementOld = allDataRealSelection === null || allDataRealSelection === void 0 ? void 0 : allDataRealSelection.find((el) => el.id == activeId);
@@ -855,6 +855,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
855
855
  width: newWidth,
856
856
  height: newHeight,
857
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,
858
860
  };
859
861
  if (seats.length !== 0) {
860
862
  const seatsPositions = elementOld === null || elementOld === void 0 ? void 0 : elementOld.seatPositions;
@@ -910,7 +912,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
910
912
  });
911
913
  }
912
914
  }
913
- applyResizeToSvgElement(element, g, newElement);
915
+ applyResizeToSvgElement(element, g, newElement, text);
914
916
  });
915
917
  };
916
918
  if (downAtResizePositionAndHasSelectionBox)
@@ -1053,7 +1055,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1053
1055
  var _a, _b;
1054
1056
  const activeId = selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id;
1055
1057
  const svg = svgRef.current;
1056
- const { g, element, seats, seatGroup } = getAttributeElement(svg, activeId);
1058
+ const { g, element, seats, seatGroup, text } = getAttributeElement(svg, activeId);
1057
1059
  const isZeroRotate = (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.rotation) === 0 &&
1058
1060
  !(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape.includes("circle"));
1059
1061
  const elementSelect = {
@@ -1065,6 +1067,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1065
1067
  seatCount: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.seatCount,
1066
1068
  openSpace: selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.openSpace,
1067
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,
1068
1072
  };
1069
1073
  const oldSel = {
1070
1074
  x: selectedLines === null || selectedLines === void 0 ? void 0 : selectedLines.x,
@@ -1135,6 +1139,8 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1135
1139
  width: newWidth,
1136
1140
  height: newHeight,
1137
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,
1138
1144
  };
1139
1145
  if (seats.length !== 0) {
1140
1146
  if ((selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "table-seat-circle") {
@@ -1188,7 +1194,7 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1188
1194
  });
1189
1195
  }
1190
1196
  }
1191
- applyResizeToSvgElement(element, g, newElement);
1197
+ applyResizeToSvgElement(element, g, newElement, text);
1192
1198
  isResizeRef.current = true;
1193
1199
  };
1194
1200
  // const hasSelectedOneElement =
@@ -1805,8 +1811,6 @@ const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
1805
1811
  });
1806
1812
  }
1807
1813
  };
1808
- const singleSelectionTable = useAppSelector((state) => state.panel.selectedComponent);
1809
- const groupSelection = useAppSelector((state) => state.panel.selectedGroup);
1810
1814
  const footerInfoList = useMemo(() => {
1811
1815
  return [
1812
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.12",
3
+ "version": "3.5.13",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",