iticket-seatingplan-dev 2.0.6 → 2.0.8

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 (7) hide show
  1. package/dist/components/Controls.js +7 -7
  2. package/dist/components/Map.js +7 -7
  3. package/dist/components/SeatingPlan.js +23 -6
  4. package/dist/components/styles/index.css +3 -2
  5. package/package.json +61 -62
  6. package/dist/components/Badge.js +0 -17
  7. package/dist/components/Button.js +0 -21
package/dist/components/Controls.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = Controls;
7
- var _reactLeafletCustomControl = _interopRequireDefault(require("react-leaflet-custom-control"));
7
+ var _Control = _interopRequireDefault(require("./Control"));
8
8
  var _reactLeafletDraw = require("react-leaflet-draw");
9
9
  var _reactLeaflet = require("react-leaflet");
10
10
  var _react = _interopRequireWildcard(require("react"));
@@ -35,7 +35,7 @@ function Controls(_ref) {
35
35
  } = _ref;
36
36
  const [isLegendOpen, setIsLegendOpen] = (0, _react.useState)(true);
37
37
  const map = (0, _reactLeaflet.useMap)();
38
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, preventOrphanedSeats && /*#__PURE__*/_react.default.createElement(_reactLeafletCustomControl.default, {
38
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, preventOrphanedSeats && /*#__PURE__*/_react.default.createElement(_Control.default, {
39
39
  position: "topright"
40
40
  }, /*#__PURE__*/_react.default.createElement("div", {
41
41
  className: "extra-controls seat-quantity-control"
@@ -49,7 +49,7 @@ function Controls(_ref) {
49
49
  height: "16px",
50
50
  width: "16px",
51
51
  strokeWidth: "2"
52
- })))), /*#__PURE__*/_react.default.createElement(_reactLeafletCustomControl.default, {
52
+ })))), /*#__PURE__*/_react.default.createElement(_Control.default, {
53
53
  position: "bottomright"
54
54
  }, /*#__PURE__*/_react.default.createElement("div", {
55
55
  className: "legendBox"
@@ -90,7 +90,7 @@ function Controls(_ref) {
90
90
  src: _encodedSvgs.userIcon,
91
91
  width: 15,
92
92
  height: 15
93
- }), /*#__PURE__*/_react.default.createElement("p", null, "membership seats"))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)))), /*#__PURE__*/_react.default.createElement(_reactLeafletCustomControl.default, {
93
+ }), /*#__PURE__*/_react.default.createElement("p", null, "membership seats"))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)))), /*#__PURE__*/_react.default.createElement(_Control.default, {
94
94
  position: "topleft"
95
95
  }, /*#__PURE__*/_react.default.createElement("div", {
96
96
  className: "extra-controls"
@@ -120,7 +120,7 @@ function Controls(_ref) {
120
120
  style: {
121
121
  height: "17px"
122
122
  }
123
- })))), /*#__PURE__*/_react.default.createElement(_reactLeafletCustomControl.default, {
123
+ })))), /*#__PURE__*/_react.default.createElement(_Control.default, {
124
124
  position: "topleft"
125
125
  }, /*#__PURE__*/_react.default.createElement("div", {
126
126
  className: "extra-controls full-screen-control"
@@ -135,7 +135,7 @@ function Controls(_ref) {
135
135
  style: {
136
136
  height: "24px"
137
137
  }
138
- })))), canMultiSelect && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactLeafletCustomControl.default, {
138
+ })))), canMultiSelect && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Control.default, {
139
139
  position: "bottomleft"
140
140
  }, /*#__PURE__*/_react.default.createElement("div", {
141
141
  className: "extra-controls multi-select-control"
@@ -215,7 +215,7 @@ function Controls(_ref) {
215
215
  onMounted: drawInstance => {
216
216
  drawRef.current = drawInstance;
217
217
  }
218
- }))), /*#__PURE__*/_react.default.createElement(_reactLeafletCustomControl.default, {
218
+ }))), /*#__PURE__*/_react.default.createElement(_Control.default, {
219
219
  position: "topright"
220
220
  }, /*#__PURE__*/_react.default.createElement("button", {
221
221
  title: "Close full screen",
package/dist/components/Map.js CHANGED
@@ -87,7 +87,7 @@ function SeatMap(_ref) {
87
87
  center: latlng
88
88
  })];
89
89
  }));
90
- const isOrphanMode = (seats === null || seats === void 0 ? void 0 : seats.preventOrphanedSeats) && desiredSeatQuantity > 0;
90
+ const isOrphanMode = (seats === null || seats === void 0 ? void 0 : seats.preventOrphanedSeats) && desiredSeatQuantity > 0 && mode === _utils.modes.SINGLE;
91
91
  const isTouchScreen = (0, _utils.getIsTouchScreen)();
92
92
 
93
93
  // L.drawLocal.draw.toolbar.buttons.rectangle = "Box select";
@@ -119,7 +119,7 @@ function SeatMap(_ref) {
119
119
  } else if (mode === _utils.modes.REMOVE) {
120
120
  const seatsToRemove = [];
121
121
  selectedSeats.forEach(seat => {
122
- if (!seatsToRemove.find(s => s.ssId === seat.ssId) && seat.s === _utils.statuses.USER_PENDING) {
122
+ if (!seatsToRemove.some(s => s.ssId === seat.ssId) && seat.s === _utils.statuses.USER_PENDING) {
123
123
  seatsToRemove.push(seat);
124
124
  }
125
125
  });
@@ -223,7 +223,7 @@ function SeatMap(_ref) {
223
223
  lng: seat.x
224
224
  };
225
225
  const latlng = [seatCenter.lat, seatCenter.lng];
226
- if (boxBounds.contains(latlng) && !seatsToBook.find(s => s.ssId === seat.ssId) && seat.s === _utils.statuses.UNSOLD) {
226
+ if (boxBounds.contains(latlng) && !seatsToBook.some(s => s.ssId === seat.ssId) && seat.s === _utils.statuses.UNSOLD) {
227
227
  seatsToBook.push(seat);
228
228
  }
229
229
  });
@@ -324,7 +324,7 @@ function SeatMap(_ref) {
324
324
  }
325
325
  };
326
326
  const onMouseDown = (0, _react.useCallback)((s, hasSeatPrices) => {
327
- if ((mode === _utils.modes.DRAG || mode === _utils.modes.REMOVE) && canMultiSelect && hasSeatPrices && !selectedSeats.find(seat => seat.ssId === s.ssId) && s.s === (mode === _utils.modes.DRAG ? _utils.statuses.UNSOLD : _utils.statuses.USER_PENDING)) {
327
+ if ((mode === _utils.modes.DRAG || mode === _utils.modes.REMOVE) && canMultiSelect && hasSeatPrices && !selectedSeats.some(seat => seat.ssId === s.ssId) && s.s === (mode === _utils.modes.DRAG ? _utils.statuses.UNSOLD : _utils.statuses.USER_PENDING)) {
328
328
  setSelectedSeats(prev => [...prev, s]);
329
329
  }
330
330
  }, [mode, canMultiSelect, selectedSeats, setSelectedSeats]);
@@ -335,7 +335,7 @@ function SeatMap(_ref) {
335
335
  if (hideTooltipTimeoutRef.current) {
336
336
  clearTimeout(hideTooltipTimeoutRef.current);
337
337
  }
338
- if ((mode === _utils.modes.DRAG || mode === _utils.modes.REMOVE) && isDragging && canMultiSelect && hasSeatPrices && !selectedSeats.find(seat => seat.ssId === s.ssId) && s.s === (mode === _utils.modes.DRAG ? _utils.statuses.UNSOLD : _utils.statuses.USER_PENDING)) {
338
+ if ((mode === _utils.modes.DRAG || mode === _utils.modes.REMOVE) && isDragging && canMultiSelect && hasSeatPrices && !selectedSeats.some(seat => seat.ssId === s.ssId) && s.s === (mode === _utils.modes.DRAG ? _utils.statuses.UNSOLD : _utils.statuses.USER_PENDING)) {
339
339
  setSelectedSeats(prev => [...prev, s]);
340
340
  return;
341
341
  }
@@ -367,7 +367,7 @@ function SeatMap(_ref) {
367
367
  infoVisible: false
368
368
  }));
369
369
  }
370
- if ((highlightedSeats === null || highlightedSeats === void 0 ? void 0 : highlightedSeats.length) > 0) {
370
+ if ((highlightedSeats === null || highlightedSeats === void 0 ? void 0 : highlightedSeats.length) > 0 && mode === _utils.modes.SINGLE) {
371
371
  setHighlightedSeats([]);
372
372
  }
373
373
  }, 400);
@@ -477,7 +477,7 @@ function SeatMap(_ref) {
477
477
  zIndex: 10
478
478
  }) : /*#__PURE__*/_react.default.createElement(_reactLeaflet.Circle, {
479
479
  center: [seatCenter.lat, seatCenter.lng],
480
- pathOptions: (0, _utils.getInitialColor)(s, price, s.loading || ticketPopupOpen && (chosenSeat === null || chosenSeat === void 0 || (_chosenSeat$seat3 = chosenSeat.seat) === null || _chosenSeat$seat3 === void 0 ? void 0 : _chosenSeat$seat3.ssId) === s.ssId, !hasSeatPrices, (selectedSeats.some(selectedSeat => selectedSeat.ssId === s.ssId) || highlightedSeats.some(hs => hs.ssId === s.ssId)) && isHoveringOnSeat, greyedOutSeats.some(gs => gs.ssId === s.ssId)),
480
+ pathOptions: (0, _utils.getInitialColor)(s, price, s.loading || ticketPopupOpen && (chosenSeat === null || chosenSeat === void 0 || (_chosenSeat$seat3 = chosenSeat.seat) === null || _chosenSeat$seat3 === void 0 ? void 0 : _chosenSeat$seat3.ssId) === s.ssId, !hasSeatPrices, (selectedSeats.some(selectedSeat => selectedSeat.ssId === s.ssId) || highlightedSeats.some(hs => hs.ssId === s.ssId)) && (isOrphanMode ? isHoveringOnSeat : true), greyedOutSeats.some(gs => gs.ssId === s.ssId)),
481
481
  radius: seatCenter.radius,
482
482
  eventHandlers: eventHandlers
483
483
  }, s.s === _utils.statuses.UNSOLD && hasSeatPrices ? /*#__PURE__*/_react.default.createElement(_reactLeaflet.Popup, {
package/dist/components/SeatingPlan.js CHANGED
@@ -44,7 +44,15 @@ const SeatingPlan = _ref => {
44
44
  connectedShowings,
45
45
  areaName,
46
46
  promoCode,
47
- bookingMode = _utils.bookingModes.SHOPSITE
47
+ bookingMode = _utils.bookingModes.SHOPSITE,
48
+ theme = {
49
+ accent: "#6366f1",
50
+ accentDark: "#3730a3",
51
+ accentLight: "#e0e7ff",
52
+ flexiAccent: "#e32664",
53
+ flexiAccentDark: "#ffd3e2",
54
+ flexiAccentLight: "#be003f"
55
+ }
48
56
  } = _ref;
49
57
  const [initialiseMessage, setInitialiseMessage] = (0, _react.useState)("Initialising seating plan...");
50
58
  const [isReloading, setIsReloading] = (0, _react.useState)(false);
@@ -540,19 +548,28 @@ const SeatingPlan = _ref => {
540
548
  // in full screen mode, render the map in the body, otherwise render in the seating-plan-root div
541
549
  const mapContainer = mounted && (isFullScreen ? (_document = document) === null || _document === void 0 ? void 0 : _document.body : (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.getElementById("seating-plan-root"));
542
550
  const backdropContainer = mounted && ((_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.body);
543
-
544
- // return seating plan
551
+ const themeStyles = {
552
+ "--accent": theme.accent,
553
+ "--accent-dark": theme.accentDark,
554
+ "--accent-light": theme.accentLight,
555
+ "--flexi-accent": theme.flexiAccent,
556
+ "--flexi-accent-light": theme.flexiAccentLight,
557
+ "--flexi-accent-dark": theme.flexiAccentDark
558
+ };
545
559
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
546
560
  className: "seating-plan-root",
547
- id: "seating-plan-root"
561
+ id: "seating-plan-root",
562
+ style: themeStyles
548
563
  }, error ? /*#__PURE__*/_react.default.createElement("div", {
549
564
  className: "loading"
550
565
  }, /*#__PURE__*/_react.default.createElement("h1", null, "OOPS!"), /*#__PURE__*/_react.default.createElement("div", null, error.response.data.message)) : position && area === areaId ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, backdropContainer && /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement("div", {
551
566
  className: "seating-plan-backdrop ".concat(isFullScreen ? "full-screen" : ""),
552
- onClick: () => setIsFullScreen(false)
567
+ onClick: () => setIsFullScreen(false),
568
+ style: themeStyles
553
569
  }), backdropContainer), mapContainer && /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement("div", {
554
570
  className: "seating-plan-container ".concat(isFullScreen ? "full-screen" : ""),
555
- "data-mode": mode
571
+ "data-mode": mode,
572
+ style: themeStyles
556
573
  }, pricingPopupOpen && seats && seats.pricing && (canMultiSelect || seats.preventOrphanedSeats) ? /*#__PURE__*/_react.default.createElement(_PricingPopup.default, {
557
574
  onClose: () => {
558
575
  setPricingPopupOpen(false);
package/dist/components/styles/index.css CHANGED
@@ -27,12 +27,12 @@ button {
27
27
  }
28
28
 
29
29
  .seating-plan-container {
30
- --accent: rgb(99 102 241);
30
+ /* --accent: rgb(99 102 241);
31
31
  --accent-dark: rgb(55 48 163);
32
32
  --accent-light: rgb(224 231 255);
33
33
  --flexi-accent: rgb(227 38 100);
34
34
  --flexi-accent-light: rgb(255 211 226);
35
- --flexi-accent-dark: rgb(190 0 63);
35
+ --flexi-accent-dark: rgb(190 0 63); */
36
36
  font-family: inherit;
37
37
  }
38
38
 
@@ -42,6 +42,7 @@ button {
42
42
  border-radius: 3px;
43
43
  text-align: left;
44
44
  backdrop-filter: blur(2px);
45
+ color: #333;
45
46
  }
46
47
 
47
48
  .legend-header {
package/package.json CHANGED
@@ -1,62 +1,61 @@
1
- {
2
- "name": "iticket-seatingplan-dev",
3
- "description": "Seating plan for external sites",
4
- "author": "gedwyne",
5
- "version": "2.0.6",
6
- "private": false,
7
- "keywords": [
8
- "iticket",
9
- "seatingplan"
10
- ],
11
- "main": "dist/index.js",
12
- "module": "dist/index.js",
13
- "files": [
14
- "dist",
15
- "README.md"
16
- ],
17
- "dependencies": {
18
- "@babel/polyfill": "^7.12.1",
19
- "@types/leaflet": "^1.9.14",
20
- "@types/leaflet-draw": "^1.0.11",
21
- "iticket-seatingplan": "^1.0.19",
22
- "leaflet": "^1.9.4",
23
- "leaflet-draw": "^1.0.4",
24
- "react": "^19.0.0",
25
- "react-dom": "^19.0.0",
26
- "react-leaflet": "^5.0.0-rc.2",
27
- "react-leaflet-draw": "^0.20.4",
28
- "react-scripts": "^5.0.1"
29
- },
30
- "codependencies": {
31
- "@babel/polyfill": "^7.12.1",
32
- "leaflet": "^1.9.3",
33
- "react-leaflet": "^4.2.1"
34
- },
35
- "scripts": {
36
- "build": "babel src/lib --out-dir dist --extensions '.tsx,.ts,.js' --copy-files",
37
- "start": "react-scripts start"
38
- },
39
- "browserslist": {
40
- "production": [
41
- ">0.2%",
42
- "not dead",
43
- "not op_mini all"
44
- ],
45
- "development": [
46
- "last 1 chrome version",
47
- "last 1 firefox version",
48
- "last 1 safari version"
49
- ]
50
- },
51
- "devDependencies": {
52
- "@babel/cli": "^7.22.5",
53
- "@babel/core": "^7.22.5",
54
- "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
55
- "@babel/preset-env": "^7.22.5",
56
- "@babel/preset-react": "^7.22.5",
57
- "@babel/preset-typescript": "^7.26.0",
58
- "@types/react": "^18.3.12",
59
- "@types/react-dom": "^18.3.1",
60
- "typescript": "^5.7.2"
61
- }
62
- }
1
+ {
2
+ "name": "iticket-seatingplan-dev",
3
+ "description": "Seating plan with FLEXi pricing",
4
+ "author": "gedwyne",
5
+ "version": "2.0.8",
6
+ "private": false,
7
+ "keywords": [
8
+ "iticket",
9
+ "seatingplan"
10
+ ],
11
+ "main": "dist/index.js",
12
+ "module": "dist/index.js",
13
+ "files": [
14
+ "dist",
15
+ "README.md"
16
+ ],
17
+ "dependencies": {
18
+ "@babel/polyfill": "^7.12.1",
19
+ "@types/leaflet": "^1.9.14",
20
+ "@types/leaflet-draw": "^1.0.11",
21
+ "leaflet": "^1.9.4",
22
+ "leaflet-draw": "^1.0.4",
23
+ "react": "^19.0.0",
24
+ "react-dom": "^19.0.0",
25
+ "react-leaflet": "^5.0.0-rc.2",
26
+ "react-leaflet-draw": "^0.20.4",
27
+ "react-scripts": "^5.0.1"
28
+ },
29
+ "codependencies": {
30
+ "@babel/polyfill": "^7.12.1",
31
+ "leaflet": "^1.9.3",
32
+ "react-leaflet": "^4.2.1"
33
+ },
34
+ "scripts": {
35
+ "build": "babel src/lib --out-dir dist --extensions '.tsx,.ts,.js' --copy-files",
36
+ "start": "react-scripts start"
37
+ },
38
+ "browserslist": {
39
+ "production": [
40
+ ">0.2%",
41
+ "not dead",
42
+ "not op_mini all"
43
+ ],
44
+ "development": [
45
+ "last 1 chrome version",
46
+ "last 1 firefox version",
47
+ "last 1 safari version"
48
+ ]
49
+ },
50
+ "devDependencies": {
51
+ "@babel/cli": "^7.22.5",
52
+ "@babel/core": "^7.22.5",
53
+ "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
54
+ "@babel/preset-env": "^7.22.5",
55
+ "@babel/preset-react": "^7.22.5",
56
+ "@babel/preset-typescript": "^7.26.0",
57
+ "@types/react": "^18.3.12",
58
+ "@types/react-dom": "^18.3.1",
59
+ "typescript": "^5.7.2"
60
+ }
61
+ }
package/dist/components/Badge.js DELETED
@@ -1,17 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
- const Badge = props => {
10
- return /*#__PURE__*/_react.default.createElement("div", {
11
- className: "badge ".concat(!props.value ? 'badge--none' : '', " ")
12
- }, /*#__PURE__*/_react.default.createElement("h4", {
13
- className: "heavy"
14
- }, props.value || 0));
15
- };
16
- var _default = Badge;
17
- exports.default = _default;
package/dist/components/Button.js DELETED
@@ -1,21 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
- const Button = props => {
10
- return /*#__PURE__*/_react.default.createElement("button", {
11
- className: "btn btn--".concat(props.kind, " CTA"),
12
- "data-id": props.id,
13
- type: props.type,
14
- name: props.name,
15
- value: props.value,
16
- disabled: props.disabled,
17
- onClick: props.handleClick
18
- }, /*#__PURE__*/_react.default.createElement("h4", null, props.label));
19
- };
20
- var _default = Button;
21
- exports.default = _default;