@happychef/reservation-sidebar 2.0.7 → 2.0.9
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.
- package/dist/index.js +133 -127
- package/dist/index.mjs +101 -95
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var React4 = require('react');
|
|
4
4
|
var algorithm = require('@happychef/algorithm');
|
|
5
5
|
var Lottie = require('lottie-react');
|
|
6
6
|
var fa = require('react-icons/fa');
|
|
@@ -9,7 +9,7 @@ var moment2 = require('moment-timezone');
|
|
|
9
9
|
|
|
10
10
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var React4__default = /*#__PURE__*/_interopDefault(React4);
|
|
13
13
|
var Lottie__default = /*#__PURE__*/_interopDefault(Lottie);
|
|
14
14
|
var axios__default = /*#__PURE__*/_interopDefault(axios);
|
|
15
15
|
var moment2__default = /*#__PURE__*/_interopDefault(moment2);
|
|
@@ -4170,18 +4170,17 @@ var ReservationStepOne = ({
|
|
|
4170
4170
|
errors,
|
|
4171
4171
|
handleChange,
|
|
4172
4172
|
setFormData,
|
|
4173
|
-
timeblocks,
|
|
4174
|
-
loadingTimeblocks,
|
|
4175
|
-
timeblocksError,
|
|
4176
4173
|
restaurantData,
|
|
4177
4174
|
reservations = []
|
|
4178
4175
|
}) => {
|
|
4179
|
-
const [availableTables, setAvailableTables] =
|
|
4180
|
-
const [isFetchingTables, setIsFetchingTables] =
|
|
4181
|
-
|
|
4182
|
-
|
|
4183
|
-
|
|
4184
|
-
|
|
4176
|
+
const [availableTables, setAvailableTables] = React4.useState([]);
|
|
4177
|
+
const [isFetchingTables, setIsFetchingTables] = React4.useState(false);
|
|
4178
|
+
const tableSettings = restaurantData?.["table-settings"] || {};
|
|
4179
|
+
const seatSelectionEnabled = !!restaurantData?.["general-settings"]?.seatSelectionEnabled;
|
|
4180
|
+
const seatOptions = ["Terras", "Restaurant"];
|
|
4181
|
+
React4.useEffect(() => {
|
|
4182
|
+
const isAutomaticAssignment = tableSettings.isInstalled === true && tableSettings.assignmentMode === "automatic";
|
|
4183
|
+
if (isAutomaticAssignment && formData.date && formData.time && formData.guests > 0) {
|
|
4185
4184
|
setIsFetchingTables(true);
|
|
4186
4185
|
const available = algorithm.getAvailableTablesForTime(
|
|
4187
4186
|
restaurantData,
|
|
@@ -4191,47 +4190,38 @@ var ReservationStepOne = ({
|
|
|
4191
4190
|
reservations
|
|
4192
4191
|
);
|
|
4193
4192
|
setAvailableTables(available);
|
|
4194
|
-
const
|
|
4195
|
-
const
|
|
4196
|
-
const
|
|
4197
|
-
const
|
|
4198
|
-
|
|
4199
|
-
const
|
|
4200
|
-
|
|
4201
|
-
|
|
4202
|
-
|
|
4203
|
-
stillAvailableSelectedNumbers.push(num);
|
|
4204
|
-
stillAvailableSelectedIds.push(correspondingTable.tableId);
|
|
4193
|
+
const selectedNumbers = formData.selectedTableNumbers || [];
|
|
4194
|
+
const selectedIds = formData.selectedTableIds || [];
|
|
4195
|
+
const stillAvailableNumbers = [];
|
|
4196
|
+
const stillAvailableIds = [];
|
|
4197
|
+
selectedNumbers.forEach((num) => {
|
|
4198
|
+
const table = available.find((t) => t.tableNumber === num);
|
|
4199
|
+
if (table && selectedIds.includes(table.tableId)) {
|
|
4200
|
+
stillAvailableNumbers.push(num);
|
|
4201
|
+
stillAvailableIds.push(table.tableId);
|
|
4205
4202
|
}
|
|
4206
4203
|
});
|
|
4207
|
-
if (
|
|
4208
|
-
|
|
4209
|
-
|
|
4210
|
-
|
|
4211
|
-
|
|
4212
|
-
|
|
4213
|
-
|
|
4214
|
-
selectedTableIds: stillAvailableSelectedIds
|
|
4215
|
-
}
|
|
4204
|
+
if (stillAvailableNumbers.length !== selectedNumbers.length || stillAvailableIds.length !== selectedIds.length) {
|
|
4205
|
+
handleChange({
|
|
4206
|
+
target: {
|
|
4207
|
+
multiple: true,
|
|
4208
|
+
updates: {
|
|
4209
|
+
selectedTableNumbers: stillAvailableNumbers,
|
|
4210
|
+
selectedTableIds: stillAvailableIds
|
|
4216
4211
|
}
|
|
4217
|
-
}
|
|
4218
|
-
}
|
|
4212
|
+
}
|
|
4213
|
+
});
|
|
4219
4214
|
}
|
|
4220
4215
|
setIsFetchingTables(false);
|
|
4221
4216
|
} else {
|
|
4222
4217
|
setAvailableTables([]);
|
|
4223
|
-
if (formData.selectedTableNumbers?.length > 0 || formData.selectedTableIds?.length > 0) {
|
|
4224
|
-
|
|
4225
|
-
|
|
4226
|
-
|
|
4227
|
-
|
|
4228
|
-
|
|
4229
|
-
|
|
4230
|
-
selectedTableIds: []
|
|
4231
|
-
}
|
|
4232
|
-
}
|
|
4233
|
-
});
|
|
4234
|
-
}, 0);
|
|
4218
|
+
if ((formData.selectedTableNumbers?.length || 0) > 0 || (formData.selectedTableIds?.length || 0) > 0) {
|
|
4219
|
+
handleChange({
|
|
4220
|
+
target: {
|
|
4221
|
+
multiple: true,
|
|
4222
|
+
updates: { selectedTableNumbers: [], selectedTableIds: [] }
|
|
4223
|
+
}
|
|
4224
|
+
});
|
|
4235
4225
|
}
|
|
4236
4226
|
}
|
|
4237
4227
|
}, [
|
|
@@ -4242,42 +4232,58 @@ var ReservationStepOne = ({
|
|
|
4242
4232
|
reservations,
|
|
4243
4233
|
formData.selectedTableNumbers,
|
|
4244
4234
|
formData.selectedTableIds,
|
|
4245
|
-
handleChange
|
|
4235
|
+
handleChange,
|
|
4236
|
+
tableSettings.assignmentMode,
|
|
4237
|
+
tableSettings.isInstalled
|
|
4246
4238
|
]);
|
|
4247
|
-
|
|
4248
|
-
|
|
4249
|
-
|
|
4250
|
-
|
|
4251
|
-
|
|
4252
|
-
|
|
4253
|
-
|
|
4254
|
-
|
|
4255
|
-
|
|
4239
|
+
const handleGuestChange = (e) => {
|
|
4240
|
+
parseInt(e.target.value, 10) || 1;
|
|
4241
|
+
handleChange(e);
|
|
4242
|
+
setFormData((prev) => ({
|
|
4243
|
+
...prev,
|
|
4244
|
+
selectedTableNumbers: [],
|
|
4245
|
+
selectedTableIds: []
|
|
4246
|
+
}));
|
|
4247
|
+
};
|
|
4248
|
+
const handleSeatPick = (seat) => {
|
|
4249
|
+
setFormData((prev) => ({ ...prev, zitplaats: seat }));
|
|
4250
|
+
};
|
|
4251
|
+
const showTableSelector = tableSettings.isInstalled === true && tableSettings.assignmentMode === "automatic" && availableTables.length > 0 && formData.date && formData.time && formData.guests > 0;
|
|
4252
|
+
return /* @__PURE__ */ React4__default.default.createElement("div", { className: "reservation-step-one-placeholder" }, /* @__PURE__ */ React4__default.default.createElement("h3", null, "Reservation"), /* @__PURE__ */ React4__default.default.createElement("div", null, /* @__PURE__ */ React4__default.default.createElement("label", null, "Guests:", /* @__PURE__ */ React4__default.default.createElement(
|
|
4256
4253
|
"input",
|
|
4257
4254
|
{
|
|
4258
4255
|
type: "number",
|
|
4256
|
+
min: "1",
|
|
4259
4257
|
name: "guests",
|
|
4260
|
-
value: formData.guests,
|
|
4261
|
-
onChange:
|
|
4262
|
-
min: "1"
|
|
4258
|
+
value: formData.guests || 1,
|
|
4259
|
+
onChange: handleGuestChange
|
|
4263
4260
|
}
|
|
4264
|
-
)), errors.guests && /* @__PURE__ */
|
|
4261
|
+
)), errors.guests && /* @__PURE__ */ React4__default.default.createElement("span", { className: "error" }, errors.guests)), /* @__PURE__ */ React4__default.default.createElement("div", null, /* @__PURE__ */ React4__default.default.createElement("label", null, "Date:", /* @__PURE__ */ React4__default.default.createElement(
|
|
4265
4262
|
"input",
|
|
4266
4263
|
{
|
|
4267
4264
|
type: "date",
|
|
4268
4265
|
name: "date",
|
|
4269
|
-
value: formData.date,
|
|
4266
|
+
value: formData.date || "",
|
|
4270
4267
|
onChange: handleChange
|
|
4271
4268
|
}
|
|
4272
|
-
)), errors.date && /* @__PURE__ */
|
|
4269
|
+
)), errors.date && /* @__PURE__ */ React4__default.default.createElement("span", { className: "error" }, errors.date)), /* @__PURE__ */ React4__default.default.createElement("div", null, /* @__PURE__ */ React4__default.default.createElement("label", null, "Time:", /* @__PURE__ */ React4__default.default.createElement(
|
|
4273
4270
|
"input",
|
|
4274
4271
|
{
|
|
4275
4272
|
type: "time",
|
|
4276
4273
|
name: "time",
|
|
4277
|
-
value: formData.time,
|
|
4274
|
+
value: formData.time || "",
|
|
4278
4275
|
onChange: handleChange
|
|
4279
4276
|
}
|
|
4280
|
-
)), errors.time && /* @__PURE__ */
|
|
4277
|
+
)), errors.time && /* @__PURE__ */ React4__default.default.createElement("span", { className: "error" }, errors.time)), seatSelectionEnabled && /* @__PURE__ */ React4__default.default.createElement("div", { className: "seat-selection" }, seatOptions.map((seat) => /* @__PURE__ */ React4__default.default.createElement(
|
|
4278
|
+
"button",
|
|
4279
|
+
{
|
|
4280
|
+
key: seat,
|
|
4281
|
+
type: "button",
|
|
4282
|
+
className: formData.zitplaats === seat ? "active" : "",
|
|
4283
|
+
onClick: () => handleSeatPick(seat)
|
|
4284
|
+
},
|
|
4285
|
+
seat
|
|
4286
|
+
))), isFetchingTables && /* @__PURE__ */ React4__default.default.createElement("p", null, "Calculating table availability..."), showTableSelector && /* @__PURE__ */ React4__default.default.createElement("div", { className: "available-tables" }, /* @__PURE__ */ React4__default.default.createElement("h4", null, "Available Tables (", availableTables.length, ")"), /* @__PURE__ */ React4__default.default.createElement("ul", null, availableTables.map((table) => /* @__PURE__ */ React4__default.default.createElement("li", { key: table.tableId }, "Table ", table.tableNumber, " - Capacity: ", table.capacity)))));
|
|
4281
4287
|
};
|
|
4282
4288
|
var ReservationStepOne_default = ReservationStepOne;
|
|
4283
4289
|
|
|
@@ -4348,12 +4354,12 @@ var FormField = ({
|
|
|
4348
4354
|
}) => {
|
|
4349
4355
|
const t = getSection(translations_default, "formField");
|
|
4350
4356
|
const selectPlaceholderText = selectPlaceholder || t.selectPlaceholder;
|
|
4351
|
-
const [showTooltip, setShowTooltip] =
|
|
4352
|
-
const tooltipRef =
|
|
4353
|
-
const timerRef =
|
|
4357
|
+
const [showTooltip, setShowTooltip] = React4.useState(false);
|
|
4358
|
+
const tooltipRef = React4.useRef(null);
|
|
4359
|
+
const timerRef = React4.useRef(null);
|
|
4354
4360
|
const RightIconComponent = rightIcon2;
|
|
4355
4361
|
const Icon = icon;
|
|
4356
|
-
|
|
4362
|
+
React4.useEffect(() => {
|
|
4357
4363
|
const handleClickOutside = (e) => {
|
|
4358
4364
|
if (tooltipRef.current && !tooltipRef.current.contains(e.target)) {
|
|
4359
4365
|
if (timerRef.current) clearTimeout(timerRef.current);
|
|
@@ -4373,19 +4379,19 @@ var FormField = ({
|
|
|
4373
4379
|
};
|
|
4374
4380
|
const renderControl = () => {
|
|
4375
4381
|
if (type === "select") {
|
|
4376
|
-
return /* @__PURE__ */
|
|
4382
|
+
return /* @__PURE__ */ React4__default.default.createElement("select", { ...baseControlProps }, /* @__PURE__ */ React4__default.default.createElement("option", { value: "" }, selectPlaceholderText), options.map((opt) => /* @__PURE__ */ React4__default.default.createElement("option", { key: opt.value, value: opt.value }, opt.label)));
|
|
4377
4383
|
}
|
|
4378
4384
|
if (type === "textarea")
|
|
4379
|
-
return /* @__PURE__ */
|
|
4380
|
-
return /* @__PURE__ */
|
|
4385
|
+
return /* @__PURE__ */ React4__default.default.createElement("textarea", { ...baseControlProps, placeholder });
|
|
4386
|
+
return /* @__PURE__ */ React4__default.default.createElement("input", { type, ...baseControlProps, placeholder });
|
|
4381
4387
|
};
|
|
4382
|
-
return /* @__PURE__ */
|
|
4388
|
+
return /* @__PURE__ */ React4__default.default.createElement(
|
|
4383
4389
|
"div",
|
|
4384
4390
|
{
|
|
4385
4391
|
className: `form-group ${halfWidth ? "half-width" : ""}`,
|
|
4386
4392
|
style: { position: "relative" }
|
|
4387
4393
|
},
|
|
4388
|
-
/* @__PURE__ */
|
|
4394
|
+
/* @__PURE__ */ React4__default.default.createElement("div", { className: "input-container" }, Icon && /* @__PURE__ */ React4__default.default.createElement(Icon, { className: "input-icon" }), renderControl(), RightIconComponent && /* @__PURE__ */ React4__default.default.createElement(
|
|
4389
4395
|
"div",
|
|
4390
4396
|
{
|
|
4391
4397
|
className: "magic-wand-container",
|
|
@@ -4405,14 +4411,14 @@ var FormField = ({
|
|
|
4405
4411
|
cursor: "pointer"
|
|
4406
4412
|
}
|
|
4407
4413
|
},
|
|
4408
|
-
/* @__PURE__ */
|
|
4414
|
+
/* @__PURE__ */ React4__default.default.createElement(
|
|
4409
4415
|
RightIconComponent,
|
|
4410
4416
|
{
|
|
4411
4417
|
className: "magic-wand-icon",
|
|
4412
4418
|
style: { color: "#B567C2" }
|
|
4413
4419
|
}
|
|
4414
4420
|
),
|
|
4415
|
-
showTooltip && tooltipContent && /* @__PURE__ */
|
|
4421
|
+
showTooltip && tooltipContent && /* @__PURE__ */ React4__default.default.createElement(
|
|
4416
4422
|
"div",
|
|
4417
4423
|
{
|
|
4418
4424
|
ref: tooltipRef,
|
|
@@ -4432,7 +4438,7 @@ var FormField = ({
|
|
|
4432
4438
|
overflow: "hidden"
|
|
4433
4439
|
}
|
|
4434
4440
|
},
|
|
4435
|
-
/* @__PURE__ */
|
|
4441
|
+
/* @__PURE__ */ React4__default.default.createElement(
|
|
4436
4442
|
"div",
|
|
4437
4443
|
{
|
|
4438
4444
|
className: "lottie-container",
|
|
@@ -4447,7 +4453,7 @@ var FormField = ({
|
|
|
4447
4453
|
zIndex: 1
|
|
4448
4454
|
}
|
|
4449
4455
|
},
|
|
4450
|
-
/* @__PURE__ */
|
|
4456
|
+
/* @__PURE__ */ React4__default.default.createElement(
|
|
4451
4457
|
Lottie__default.default,
|
|
4452
4458
|
{
|
|
4453
4459
|
animationData: magicAnimation_default,
|
|
@@ -4456,7 +4462,7 @@ var FormField = ({
|
|
|
4456
4462
|
}
|
|
4457
4463
|
)
|
|
4458
4464
|
),
|
|
4459
|
-
/* @__PURE__ */
|
|
4465
|
+
/* @__PURE__ */ React4__default.default.createElement("div", { style: { position: "relative", zIndex: 2, padding: "12px 20px" } }, /* @__PURE__ */ React4__default.default.createElement(
|
|
4460
4466
|
"div",
|
|
4461
4467
|
{
|
|
4462
4468
|
style: {
|
|
@@ -4466,7 +4472,7 @@ var FormField = ({
|
|
|
4466
4472
|
}
|
|
4467
4473
|
},
|
|
4468
4474
|
tooltipContent
|
|
4469
|
-
), /* @__PURE__ */
|
|
4475
|
+
), /* @__PURE__ */ React4__default.default.createElement(
|
|
4470
4476
|
"div",
|
|
4471
4477
|
{
|
|
4472
4478
|
style: {
|
|
@@ -4477,7 +4483,7 @@ var FormField = ({
|
|
|
4477
4483
|
}
|
|
4478
4484
|
},
|
|
4479
4485
|
t.tooltip?.confirm
|
|
4480
|
-
), /* @__PURE__ */
|
|
4486
|
+
), /* @__PURE__ */ React4__default.default.createElement(
|
|
4481
4487
|
"div",
|
|
4482
4488
|
{
|
|
4483
4489
|
style: {
|
|
@@ -4491,7 +4497,7 @@ var FormField = ({
|
|
|
4491
4497
|
))
|
|
4492
4498
|
)
|
|
4493
4499
|
)),
|
|
4494
|
-
error && /* @__PURE__ */
|
|
4500
|
+
error && /* @__PURE__ */ React4__default.default.createElement("p", { className: "form-error" }, error)
|
|
4495
4501
|
);
|
|
4496
4502
|
};
|
|
4497
4503
|
var FormField_default = FormField;
|
|
@@ -4500,10 +4506,10 @@ var FormField_default = FormField;
|
|
|
4500
4506
|
var import_moment = __toESM(require_moment());
|
|
4501
4507
|
__toESM(require_nl());
|
|
4502
4508
|
var useApi = () => {
|
|
4503
|
-
const getJwtToken =
|
|
4509
|
+
const getJwtToken = React4.useCallback(() => {
|
|
4504
4510
|
return localStorage.getItem("accessToken");
|
|
4505
4511
|
}, []);
|
|
4506
|
-
const get =
|
|
4512
|
+
const get = React4.useCallback(
|
|
4507
4513
|
(endpoint, config = {}) => {
|
|
4508
4514
|
const { params, ...axiosConfig } = config;
|
|
4509
4515
|
const token = getJwtToken();
|
|
@@ -4521,7 +4527,7 @@ var useApi = () => {
|
|
|
4521
4527
|
},
|
|
4522
4528
|
[getJwtToken]
|
|
4523
4529
|
);
|
|
4524
|
-
const mutate =
|
|
4530
|
+
const mutate = React4.useCallback(
|
|
4525
4531
|
(method, endpoint, data = null, config = {}) => {
|
|
4526
4532
|
const token = getJwtToken();
|
|
4527
4533
|
return axios__default.default({
|
|
@@ -4540,7 +4546,7 @@ var useApi = () => {
|
|
|
4540
4546
|
},
|
|
4541
4547
|
[getJwtToken]
|
|
4542
4548
|
);
|
|
4543
|
-
const apiMethods =
|
|
4549
|
+
const apiMethods = React4.useMemo(
|
|
4544
4550
|
() => ({
|
|
4545
4551
|
get,
|
|
4546
4552
|
post: (endpoint, data, config) => mutate("POST", endpoint, data, config),
|
|
@@ -4691,11 +4697,11 @@ var ReservationStepTwo = ({
|
|
|
4691
4697
|
}) => {
|
|
4692
4698
|
const lang = getPreferredLanguage();
|
|
4693
4699
|
const t = getSection(translations_default2, "reservationStepTwoFiltering");
|
|
4694
|
-
const [availableMenus, setAvailableMenus] =
|
|
4695
|
-
const [hasAutofilled, setHasAutofilled] =
|
|
4696
|
-
const [pendingAutofill, setPendingAutofill] =
|
|
4700
|
+
const [availableMenus, setAvailableMenus] = React4.useState([]);
|
|
4701
|
+
const [hasAutofilled, setHasAutofilled] = React4.useState(false);
|
|
4702
|
+
const [pendingAutofill, setPendingAutofill] = React4.useState(null);
|
|
4697
4703
|
const api = useApi_default();
|
|
4698
|
-
|
|
4704
|
+
React4.useEffect(() => {
|
|
4699
4705
|
import_moment.default.locale(lang);
|
|
4700
4706
|
if (!formData.date || !formData.time || !menuData.length) return setAvailableMenus([]);
|
|
4701
4707
|
const sel = (0, import_moment.default)(`${formData.date} ${formData.time}`, "YYYY-MM-DD HH:mm");
|
|
@@ -4741,10 +4747,10 @@ var ReservationStepTwo = ({
|
|
|
4741
4747
|
console.error("Autofill error");
|
|
4742
4748
|
}
|
|
4743
4749
|
};
|
|
4744
|
-
|
|
4750
|
+
React4.useEffect(() => {
|
|
4745
4751
|
tryAutofill();
|
|
4746
4752
|
}, [formData.email, formData.phone]);
|
|
4747
|
-
const magicProps =
|
|
4753
|
+
const magicProps = React4.useMemo(() => {
|
|
4748
4754
|
if (!pendingAutofill)
|
|
4749
4755
|
return { email: {}, phone: {} };
|
|
4750
4756
|
const emailActive = pendingAutofill.sources.includes("email") && (formData.email || "").trim().toLowerCase() === pendingAutofill.email.trim().toLowerCase();
|
|
@@ -4756,15 +4762,15 @@ var ReservationStepTwo = ({
|
|
|
4756
4762
|
return {
|
|
4757
4763
|
email: emailActive ? {
|
|
4758
4764
|
...common,
|
|
4759
|
-
tooltipContent: /* @__PURE__ */
|
|
4765
|
+
tooltipContent: /* @__PURE__ */ React4__default.default.createElement("div", null, /* @__PURE__ */ React4__default.default.createElement("div", { style: { textAlign: "center", fontWeight: "bold" } }, t.magic?.title), /* @__PURE__ */ React4__default.default.createElement("div", null, pendingAutofill.firstName, " ", pendingAutofill.lastName), /* @__PURE__ */ React4__default.default.createElement("div", null, pendingAutofill.phone))
|
|
4760
4766
|
} : {},
|
|
4761
4767
|
phone: phoneActive ? {
|
|
4762
4768
|
...common,
|
|
4763
|
-
tooltipContent: /* @__PURE__ */
|
|
4769
|
+
tooltipContent: /* @__PURE__ */ React4__default.default.createElement("div", null, /* @__PURE__ */ React4__default.default.createElement("div", { style: { textAlign: "center", fontWeight: "bold" } }, t.magic?.title), /* @__PURE__ */ React4__default.default.createElement("div", null, pendingAutofill.firstName, " ", pendingAutofill.lastName), /* @__PURE__ */ React4__default.default.createElement("div", null, pendingAutofill.email))
|
|
4764
4770
|
} : {}
|
|
4765
4771
|
};
|
|
4766
4772
|
}, [pendingAutofill, formData.email, formData.phone, t.magic?.title]);
|
|
4767
|
-
return /* @__PURE__ */
|
|
4773
|
+
return /* @__PURE__ */ React4__default.default.createElement("div", { className: "reservation-step-two" }, /* @__PURE__ */ React4__default.default.createElement("div", { className: "account-manage-form" }, availableMenus.length > 0 && /* @__PURE__ */ React4__default.default.createElement(
|
|
4768
4774
|
FormField_default,
|
|
4769
4775
|
{
|
|
4770
4776
|
label: t.labels?.menu || "Menu",
|
|
@@ -4775,7 +4781,7 @@ var ReservationStepTwo = ({
|
|
|
4775
4781
|
onChange: handleChange,
|
|
4776
4782
|
error: errors.menu
|
|
4777
4783
|
}
|
|
4778
|
-
), /* @__PURE__ */
|
|
4784
|
+
), /* @__PURE__ */ React4__default.default.createElement("div", { className: "name-fields" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
4779
4785
|
FormField_default,
|
|
4780
4786
|
{
|
|
4781
4787
|
label: t.labels?.firstName || "Voornaam",
|
|
@@ -4786,7 +4792,7 @@ var ReservationStepTwo = ({
|
|
|
4786
4792
|
error: errors.firstName,
|
|
4787
4793
|
icon: fa.FaUser
|
|
4788
4794
|
}
|
|
4789
|
-
), /* @__PURE__ */
|
|
4795
|
+
), /* @__PURE__ */ React4__default.default.createElement(
|
|
4790
4796
|
FormField_default,
|
|
4791
4797
|
{
|
|
4792
4798
|
label: t.labels?.lastName || "Achternaam",
|
|
@@ -4797,7 +4803,7 @@ var ReservationStepTwo = ({
|
|
|
4797
4803
|
error: errors.lastName,
|
|
4798
4804
|
icon: fa.FaUser
|
|
4799
4805
|
}
|
|
4800
|
-
)), /* @__PURE__ */
|
|
4806
|
+
)), /* @__PURE__ */ React4__default.default.createElement(
|
|
4801
4807
|
FormField_default,
|
|
4802
4808
|
{
|
|
4803
4809
|
label: t.labels?.email || "Email",
|
|
@@ -4811,7 +4817,7 @@ var ReservationStepTwo = ({
|
|
|
4811
4817
|
icon: fa.FaEnvelope,
|
|
4812
4818
|
...magicProps.email
|
|
4813
4819
|
}
|
|
4814
|
-
), /* @__PURE__ */
|
|
4820
|
+
), /* @__PURE__ */ React4__default.default.createElement(
|
|
4815
4821
|
FormField_default,
|
|
4816
4822
|
{
|
|
4817
4823
|
label: t.labels?.phone || "Telefoon",
|
|
@@ -4825,7 +4831,7 @@ var ReservationStepTwo = ({
|
|
|
4825
4831
|
icon: fa.FaPhone,
|
|
4826
4832
|
...magicProps.phone
|
|
4827
4833
|
}
|
|
4828
|
-
), /* @__PURE__ */
|
|
4834
|
+
), /* @__PURE__ */ React4__default.default.createElement(
|
|
4829
4835
|
FormField_default,
|
|
4830
4836
|
{
|
|
4831
4837
|
label: t.labels?.extraInfo || "Extra info",
|
|
@@ -4974,7 +4980,7 @@ var ReservationSummary = ({
|
|
|
4974
4980
|
onNewReservation
|
|
4975
4981
|
}) => {
|
|
4976
4982
|
const t = getSection(translations_default3, "reservationSummary");
|
|
4977
|
-
return /* @__PURE__ */
|
|
4983
|
+
return /* @__PURE__ */ React4__default.default.createElement("div", { className: "reservation-summary" }, /* @__PURE__ */ React4__default.default.createElement("ul", { className: "reservation-details" }, /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.title)), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.guests, ":"), " ", formData.guests), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.date, ":"), " ", formData.date), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.time, ":"), " ", formData.time), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.firstName, ":"), " ", formData.firstName), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.lastName, ":"), " ", formData.lastName), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.email, ":"), " ", formData.email), /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.phone, ":"), " ", formData.phone), formData.menu && /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.menu, ":"), " ", formData.menu), formData.personeel && /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.staff, ":"), " ", formData.personeel), formData.giftcard && /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.giftcard, ":"), " ", formData.giftcard), formData.extraInfo && /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.extraInfo, ":"), " ", formData.extraInfo), formData.zitplaats && /* @__PURE__ */ React4__default.default.createElement("li", null, /* @__PURE__ */ React4__default.default.createElement("strong", null, t.seatPlace, ":"), " ", formData.zitplaats)), /* @__PURE__ */ React4__default.default.createElement("button", { className: "button-style-3", onClick: onNewReservation }, t.newReservationButton));
|
|
4978
4984
|
};
|
|
4979
4985
|
var ReservationSummary_default = ReservationSummary;
|
|
4980
4986
|
|
|
@@ -5023,8 +5029,8 @@ var GiftcardSelection = ({
|
|
|
5023
5029
|
resetFormDataFields
|
|
5024
5030
|
}) => {
|
|
5025
5031
|
const t = getSection(translations_default4, "giftcardSelection");
|
|
5026
|
-
const [availableGiftcards, setAvailableGiftcards] =
|
|
5027
|
-
|
|
5032
|
+
const [availableGiftcards, setAvailableGiftcards] = React4.useState([]);
|
|
5033
|
+
React4.useEffect(() => {
|
|
5028
5034
|
if (!restaurantData) return;
|
|
5029
5035
|
const periods = ["breakfast", "lunch", "dinner"];
|
|
5030
5036
|
const cards = /* @__PURE__ */ new Set();
|
|
@@ -5044,7 +5050,7 @@ var GiftcardSelection = ({
|
|
|
5044
5050
|
handleChange({ target: { name: "giftcard", value: e.target.value } });
|
|
5045
5051
|
resetFormDataFields(["date", "time"]);
|
|
5046
5052
|
};
|
|
5047
|
-
return /* @__PURE__ */
|
|
5053
|
+
return /* @__PURE__ */ React4__default.default.createElement("div", { className: "giftcard-selection" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5048
5054
|
FormField_default,
|
|
5049
5055
|
{
|
|
5050
5056
|
label: t.labels?.giftcard || "Giftcard",
|
|
@@ -5103,9 +5109,9 @@ var ZitplaatsSelection = ({
|
|
|
5103
5109
|
handleChange,
|
|
5104
5110
|
resetFormDataFields
|
|
5105
5111
|
}) => {
|
|
5106
|
-
const [availableZitplaatsen, setAvailableZitplaatsen] =
|
|
5112
|
+
const [availableZitplaatsen, setAvailableZitplaatsen] = React4.useState([]);
|
|
5107
5113
|
const t = getSection(translations_default5, "zitplaatsSelection");
|
|
5108
|
-
|
|
5114
|
+
React4.useEffect(() => {
|
|
5109
5115
|
if (!restaurantData?.floors || !Array.isArray(restaurantData.floors)) return;
|
|
5110
5116
|
const set = /* @__PURE__ */ new Set();
|
|
5111
5117
|
restaurantData.floors.forEach(
|
|
@@ -5121,7 +5127,7 @@ var ZitplaatsSelection = ({
|
|
|
5121
5127
|
const tableSettings = restaurantData?.["table-settings"] || {};
|
|
5122
5128
|
const isTableAssignmentEnabled = tableSettings.isInstalled === true && tableSettings.assignmentMode === "automatic";
|
|
5123
5129
|
if (!isTableAssignmentEnabled || availableZitplaatsen.length === 0) return null;
|
|
5124
|
-
return /* @__PURE__ */
|
|
5130
|
+
return /* @__PURE__ */ React4__default.default.createElement("div", { className: "zitplaats-selection" }, /* @__PURE__ */ React4__default.default.createElement("label", { htmlFor: "zitplaats", className: "form-label" }, t.labels?.seating || "Zitplaats"), /* @__PURE__ */ React4__default.default.createElement("div", { className: "input-container select-field" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5125
5131
|
"select",
|
|
5126
5132
|
{
|
|
5127
5133
|
id: "zitplaats",
|
|
@@ -5129,8 +5135,8 @@ var ZitplaatsSelection = ({
|
|
|
5129
5135
|
value: formData.zitplaats || "",
|
|
5130
5136
|
onChange: handleZitplaatsChange
|
|
5131
5137
|
},
|
|
5132
|
-
/* @__PURE__ */
|
|
5133
|
-
availableZitplaatsen.map((zitplaats) => /* @__PURE__ */
|
|
5138
|
+
/* @__PURE__ */ React4__default.default.createElement("option", { value: "" }, t.options?.noPreference || "Geen voorkeur"),
|
|
5139
|
+
availableZitplaatsen.map((zitplaats) => /* @__PURE__ */ React4__default.default.createElement(
|
|
5134
5140
|
"option",
|
|
5135
5141
|
{
|
|
5136
5142
|
key: zitplaats,
|
|
@@ -5183,20 +5189,20 @@ var ReservationSidebar = ({
|
|
|
5183
5189
|
onNewReservation,
|
|
5184
5190
|
apiBaseDomain
|
|
5185
5191
|
}) => {
|
|
5186
|
-
|
|
5192
|
+
React4.useEffect(() => {
|
|
5187
5193
|
if (apiBaseDomain && !window.baseDomain) {
|
|
5188
5194
|
window.baseDomain = apiBaseDomain;
|
|
5189
5195
|
}
|
|
5190
5196
|
}, [apiBaseDomain]);
|
|
5191
5197
|
const api = useApi_default();
|
|
5192
|
-
const [timeblocks, setTimeblocks] =
|
|
5193
|
-
const [loadingTimeblocks, setLoadingTimeblocks] =
|
|
5194
|
-
const [timeblocksError, setTimeblocksError] =
|
|
5195
|
-
const [menuData, setMenuData] =
|
|
5196
|
-
const [restaurantData, setRestaurantData] =
|
|
5197
|
-
const [availablePersoneel, setAvailablePersoneel] =
|
|
5198
|
+
const [timeblocks, setTimeblocks] = React4.useState([]);
|
|
5199
|
+
const [loadingTimeblocks, setLoadingTimeblocks] = React4.useState(false);
|
|
5200
|
+
const [timeblocksError, setTimeblocksError] = React4.useState(null);
|
|
5201
|
+
const [menuData, setMenuData] = React4.useState([]);
|
|
5202
|
+
const [restaurantData, setRestaurantData] = React4.useState({});
|
|
5203
|
+
const [availablePersoneel, setAvailablePersoneel] = React4.useState([]);
|
|
5198
5204
|
const t = getSection(translationsReservationSidebar_default, "reservationSidebar");
|
|
5199
|
-
const resetFormDataFields =
|
|
5205
|
+
const resetFormDataFields = React4.useCallback(
|
|
5200
5206
|
(fieldsToReset) => {
|
|
5201
5207
|
setFormData((prev) => {
|
|
5202
5208
|
const next = { ...prev };
|
|
@@ -5208,7 +5214,7 @@ var ReservationSidebar = ({
|
|
|
5208
5214
|
},
|
|
5209
5215
|
[setFormData]
|
|
5210
5216
|
);
|
|
5211
|
-
|
|
5217
|
+
React4.useEffect(() => {
|
|
5212
5218
|
if (!isOpen) return;
|
|
5213
5219
|
setLoadingTimeblocks(true);
|
|
5214
5220
|
const fetchData = async () => {
|
|
@@ -5239,7 +5245,7 @@ var ReservationSidebar = ({
|
|
|
5239
5245
|
};
|
|
5240
5246
|
fetchData();
|
|
5241
5247
|
}, [isOpen, api]);
|
|
5242
|
-
const handleNewReservationClick =
|
|
5248
|
+
const handleNewReservationClick = React4.useCallback(() => {
|
|
5243
5249
|
setFormData({
|
|
5244
5250
|
guests,
|
|
5245
5251
|
date: "",
|
|
@@ -5260,21 +5266,21 @@ var ReservationSidebar = ({
|
|
|
5260
5266
|
onNewReservation();
|
|
5261
5267
|
}, [onNewReservation, setFormData]);
|
|
5262
5268
|
const seatSelectionEnabled = !!restaurantData?.["general-settings"]?.seatSelectionEnabled;
|
|
5263
|
-
return /* @__PURE__ */
|
|
5269
|
+
return /* @__PURE__ */ React4__default.default.createElement("div", { className: `reservation-sidebar-component ${isOpen ? "open" : ""}` }, /* @__PURE__ */ React4__default.default.createElement("div", { className: "reservation-sidebar-content" }, /* @__PURE__ */ React4__default.default.createElement("h2", { className: "admin-title" }, "Admin Reservatie"), /* @__PURE__ */ React4__default.default.createElement(
|
|
5264
5270
|
"button",
|
|
5265
5271
|
{
|
|
5266
5272
|
className: "close-sidebar-button",
|
|
5267
5273
|
onClick: onClose,
|
|
5268
5274
|
"aria-label": "Sluiten"
|
|
5269
5275
|
},
|
|
5270
|
-
/* @__PURE__ */
|
|
5271
|
-
), reservationSubmitted ? /* @__PURE__ */
|
|
5276
|
+
/* @__PURE__ */ React4__default.default.createElement(fa.FaTimes, { size: 20, color: "#000" })
|
|
5277
|
+
), reservationSubmitted ? /* @__PURE__ */ React4__default.default.createElement(
|
|
5272
5278
|
ReservationSummary_default,
|
|
5273
5279
|
{
|
|
5274
5280
|
formData,
|
|
5275
5281
|
onNewReservation: handleNewReservationClick
|
|
5276
5282
|
}
|
|
5277
|
-
) : /* @__PURE__ */
|
|
5283
|
+
) : /* @__PURE__ */ React4__default.default.createElement(React4__default.default.Fragment, null, restaurantData && Object.keys(restaurantData).length > 0 && /* @__PURE__ */ React4__default.default.createElement("div", { className: "sidebar-section-giftcard" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5278
5284
|
GiftcardSelection_default,
|
|
5279
5285
|
{
|
|
5280
5286
|
restaurantData,
|
|
@@ -5282,7 +5288,7 @@ var ReservationSidebar = ({
|
|
|
5282
5288
|
handleChange,
|
|
5283
5289
|
resetFormDataFields
|
|
5284
5290
|
}
|
|
5285
|
-
)), restaurantData && Object.keys(restaurantData).length > 0 && seatSelectionEnabled && /* @__PURE__ */
|
|
5291
|
+
)), restaurantData && Object.keys(restaurantData).length > 0 && seatSelectionEnabled && /* @__PURE__ */ React4__default.default.createElement("div", { className: "sidebar-section-zitplaats" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5286
5292
|
ZitplaatsSelection_default,
|
|
5287
5293
|
{
|
|
5288
5294
|
restaurantData,
|
|
@@ -5290,7 +5296,7 @@ var ReservationSidebar = ({
|
|
|
5290
5296
|
handleChange,
|
|
5291
5297
|
resetFormDataFields
|
|
5292
5298
|
}
|
|
5293
|
-
)), availablePersoneel.length > 0 && /* @__PURE__ */
|
|
5299
|
+
)), availablePersoneel.length > 0 && /* @__PURE__ */ React4__default.default.createElement("div", { className: "sidebar-section-personeel" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5294
5300
|
FormField_default,
|
|
5295
5301
|
{
|
|
5296
5302
|
label: "",
|
|
@@ -5298,14 +5304,14 @@ var ReservationSidebar = ({
|
|
|
5298
5304
|
type: "select",
|
|
5299
5305
|
options: availablePersoneel.map((p) => {
|
|
5300
5306
|
const full = `${p.voornaam} ${p.achternaam}`;
|
|
5301
|
-
return { value, label: full };
|
|
5307
|
+
return { value: p.id, label: full };
|
|
5302
5308
|
}),
|
|
5303
5309
|
value: formData.personeel,
|
|
5304
5310
|
onChange: handleChange,
|
|
5305
5311
|
error: errors.personeel,
|
|
5306
5312
|
selectPlaceholder: "Toewijzen aan persoon"
|
|
5307
5313
|
}
|
|
5308
|
-
)), /* @__PURE__ */
|
|
5314
|
+
)), /* @__PURE__ */ React4__default.default.createElement("div", { className: "sidebar-section-one" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5309
5315
|
ReservationStepOne_default,
|
|
5310
5316
|
{
|
|
5311
5317
|
formData,
|
|
@@ -5317,7 +5323,7 @@ var ReservationSidebar = ({
|
|
|
5317
5323
|
timeblocksError,
|
|
5318
5324
|
restaurantData
|
|
5319
5325
|
}
|
|
5320
|
-
)), /* @__PURE__ */
|
|
5326
|
+
)), /* @__PURE__ */ React4__default.default.createElement("div", { className: "sidebar-section-two" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5321
5327
|
ReservationStepTwo_default,
|
|
5322
5328
|
{
|
|
5323
5329
|
formData,
|
|
@@ -5327,7 +5333,7 @@ var ReservationSidebar = ({
|
|
|
5327
5333
|
isSubmitting,
|
|
5328
5334
|
menuData
|
|
5329
5335
|
}
|
|
5330
|
-
)), /* @__PURE__ */
|
|
5336
|
+
)), /* @__PURE__ */ React4__default.default.createElement("div", { className: "reservation-footer" }, /* @__PURE__ */ React4__default.default.createElement(
|
|
5331
5337
|
"button",
|
|
5332
5338
|
{
|
|
5333
5339
|
type: "button",
|
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React4, { useState, useEffect, useRef, useCallback, useMemo } from 'react';
|
|
2
2
|
import { getAvailableTablesForTime } from '@happychef/algorithm';
|
|
3
3
|
import Lottie from 'lottie-react';
|
|
4
4
|
import { FaUser, FaEnvelope, FaPhone, FaInfoCircle, FaTimes } from 'react-icons/fa';
|
|
@@ -4161,18 +4161,17 @@ var ReservationStepOne = ({
|
|
|
4161
4161
|
errors,
|
|
4162
4162
|
handleChange,
|
|
4163
4163
|
setFormData,
|
|
4164
|
-
timeblocks,
|
|
4165
|
-
loadingTimeblocks,
|
|
4166
|
-
timeblocksError,
|
|
4167
4164
|
restaurantData,
|
|
4168
4165
|
reservations = []
|
|
4169
4166
|
}) => {
|
|
4170
4167
|
const [availableTables, setAvailableTables] = useState([]);
|
|
4171
4168
|
const [isFetchingTables, setIsFetchingTables] = useState(false);
|
|
4169
|
+
const tableSettings = restaurantData?.["table-settings"] || {};
|
|
4170
|
+
const seatSelectionEnabled = !!restaurantData?.["general-settings"]?.seatSelectionEnabled;
|
|
4171
|
+
const seatOptions = ["Terras", "Restaurant"];
|
|
4172
4172
|
useEffect(() => {
|
|
4173
|
-
const
|
|
4174
|
-
|
|
4175
|
-
if (isAutomaticAssignment && formData.date && formData.time && formData.guests > 0 && restaurantData && reservations) {
|
|
4173
|
+
const isAutomaticAssignment = tableSettings.isInstalled === true && tableSettings.assignmentMode === "automatic";
|
|
4174
|
+
if (isAutomaticAssignment && formData.date && formData.time && formData.guests > 0) {
|
|
4176
4175
|
setIsFetchingTables(true);
|
|
4177
4176
|
const available = getAvailableTablesForTime(
|
|
4178
4177
|
restaurantData,
|
|
@@ -4182,47 +4181,38 @@ var ReservationStepOne = ({
|
|
|
4182
4181
|
reservations
|
|
4183
4182
|
);
|
|
4184
4183
|
setAvailableTables(available);
|
|
4185
|
-
const
|
|
4186
|
-
const
|
|
4187
|
-
const
|
|
4188
|
-
const
|
|
4189
|
-
|
|
4190
|
-
const
|
|
4191
|
-
|
|
4192
|
-
|
|
4193
|
-
|
|
4194
|
-
stillAvailableSelectedNumbers.push(num);
|
|
4195
|
-
stillAvailableSelectedIds.push(correspondingTable.tableId);
|
|
4184
|
+
const selectedNumbers = formData.selectedTableNumbers || [];
|
|
4185
|
+
const selectedIds = formData.selectedTableIds || [];
|
|
4186
|
+
const stillAvailableNumbers = [];
|
|
4187
|
+
const stillAvailableIds = [];
|
|
4188
|
+
selectedNumbers.forEach((num) => {
|
|
4189
|
+
const table = available.find((t) => t.tableNumber === num);
|
|
4190
|
+
if (table && selectedIds.includes(table.tableId)) {
|
|
4191
|
+
stillAvailableNumbers.push(num);
|
|
4192
|
+
stillAvailableIds.push(table.tableId);
|
|
4196
4193
|
}
|
|
4197
4194
|
});
|
|
4198
|
-
if (
|
|
4199
|
-
|
|
4200
|
-
|
|
4201
|
-
|
|
4202
|
-
|
|
4203
|
-
|
|
4204
|
-
|
|
4205
|
-
selectedTableIds: stillAvailableSelectedIds
|
|
4206
|
-
}
|
|
4195
|
+
if (stillAvailableNumbers.length !== selectedNumbers.length || stillAvailableIds.length !== selectedIds.length) {
|
|
4196
|
+
handleChange({
|
|
4197
|
+
target: {
|
|
4198
|
+
multiple: true,
|
|
4199
|
+
updates: {
|
|
4200
|
+
selectedTableNumbers: stillAvailableNumbers,
|
|
4201
|
+
selectedTableIds: stillAvailableIds
|
|
4207
4202
|
}
|
|
4208
|
-
}
|
|
4209
|
-
}
|
|
4203
|
+
}
|
|
4204
|
+
});
|
|
4210
4205
|
}
|
|
4211
4206
|
setIsFetchingTables(false);
|
|
4212
4207
|
} else {
|
|
4213
4208
|
setAvailableTables([]);
|
|
4214
|
-
if (formData.selectedTableNumbers?.length > 0 || formData.selectedTableIds?.length > 0) {
|
|
4215
|
-
|
|
4216
|
-
|
|
4217
|
-
|
|
4218
|
-
|
|
4219
|
-
|
|
4220
|
-
|
|
4221
|
-
selectedTableIds: []
|
|
4222
|
-
}
|
|
4223
|
-
}
|
|
4224
|
-
});
|
|
4225
|
-
}, 0);
|
|
4209
|
+
if ((formData.selectedTableNumbers?.length || 0) > 0 || (formData.selectedTableIds?.length || 0) > 0) {
|
|
4210
|
+
handleChange({
|
|
4211
|
+
target: {
|
|
4212
|
+
multiple: true,
|
|
4213
|
+
updates: { selectedTableNumbers: [], selectedTableIds: [] }
|
|
4214
|
+
}
|
|
4215
|
+
});
|
|
4226
4216
|
}
|
|
4227
4217
|
}
|
|
4228
4218
|
}, [
|
|
@@ -4233,42 +4223,58 @@ var ReservationStepOne = ({
|
|
|
4233
4223
|
reservations,
|
|
4234
4224
|
formData.selectedTableNumbers,
|
|
4235
4225
|
formData.selectedTableIds,
|
|
4236
|
-
handleChange
|
|
4226
|
+
handleChange,
|
|
4227
|
+
tableSettings.assignmentMode,
|
|
4228
|
+
tableSettings.isInstalled
|
|
4237
4229
|
]);
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4241
|
-
|
|
4242
|
-
|
|
4243
|
-
|
|
4244
|
-
|
|
4245
|
-
|
|
4246
|
-
|
|
4230
|
+
const handleGuestChange = (e) => {
|
|
4231
|
+
parseInt(e.target.value, 10) || 1;
|
|
4232
|
+
handleChange(e);
|
|
4233
|
+
setFormData((prev) => ({
|
|
4234
|
+
...prev,
|
|
4235
|
+
selectedTableNumbers: [],
|
|
4236
|
+
selectedTableIds: []
|
|
4237
|
+
}));
|
|
4238
|
+
};
|
|
4239
|
+
const handleSeatPick = (seat) => {
|
|
4240
|
+
setFormData((prev) => ({ ...prev, zitplaats: seat }));
|
|
4241
|
+
};
|
|
4242
|
+
const showTableSelector = tableSettings.isInstalled === true && tableSettings.assignmentMode === "automatic" && availableTables.length > 0 && formData.date && formData.time && formData.guests > 0;
|
|
4243
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "reservation-step-one-placeholder" }, /* @__PURE__ */ React4.createElement("h3", null, "Reservation"), /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("label", null, "Guests:", /* @__PURE__ */ React4.createElement(
|
|
4247
4244
|
"input",
|
|
4248
4245
|
{
|
|
4249
4246
|
type: "number",
|
|
4247
|
+
min: "1",
|
|
4250
4248
|
name: "guests",
|
|
4251
|
-
value: formData.guests,
|
|
4252
|
-
onChange:
|
|
4253
|
-
min: "1"
|
|
4249
|
+
value: formData.guests || 1,
|
|
4250
|
+
onChange: handleGuestChange
|
|
4254
4251
|
}
|
|
4255
|
-
)), errors.guests && /* @__PURE__ */
|
|
4252
|
+
)), errors.guests && /* @__PURE__ */ React4.createElement("span", { className: "error" }, errors.guests)), /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("label", null, "Date:", /* @__PURE__ */ React4.createElement(
|
|
4256
4253
|
"input",
|
|
4257
4254
|
{
|
|
4258
4255
|
type: "date",
|
|
4259
4256
|
name: "date",
|
|
4260
|
-
value: formData.date,
|
|
4257
|
+
value: formData.date || "",
|
|
4261
4258
|
onChange: handleChange
|
|
4262
4259
|
}
|
|
4263
|
-
)), errors.date && /* @__PURE__ */
|
|
4260
|
+
)), errors.date && /* @__PURE__ */ React4.createElement("span", { className: "error" }, errors.date)), /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("label", null, "Time:", /* @__PURE__ */ React4.createElement(
|
|
4264
4261
|
"input",
|
|
4265
4262
|
{
|
|
4266
4263
|
type: "time",
|
|
4267
4264
|
name: "time",
|
|
4268
|
-
value: formData.time,
|
|
4265
|
+
value: formData.time || "",
|
|
4269
4266
|
onChange: handleChange
|
|
4270
4267
|
}
|
|
4271
|
-
)), errors.time && /* @__PURE__ */
|
|
4268
|
+
)), errors.time && /* @__PURE__ */ React4.createElement("span", { className: "error" }, errors.time)), seatSelectionEnabled && /* @__PURE__ */ React4.createElement("div", { className: "seat-selection" }, seatOptions.map((seat) => /* @__PURE__ */ React4.createElement(
|
|
4269
|
+
"button",
|
|
4270
|
+
{
|
|
4271
|
+
key: seat,
|
|
4272
|
+
type: "button",
|
|
4273
|
+
className: formData.zitplaats === seat ? "active" : "",
|
|
4274
|
+
onClick: () => handleSeatPick(seat)
|
|
4275
|
+
},
|
|
4276
|
+
seat
|
|
4277
|
+
))), isFetchingTables && /* @__PURE__ */ React4.createElement("p", null, "Calculating table availability..."), showTableSelector && /* @__PURE__ */ React4.createElement("div", { className: "available-tables" }, /* @__PURE__ */ React4.createElement("h4", null, "Available Tables (", availableTables.length, ")"), /* @__PURE__ */ React4.createElement("ul", null, availableTables.map((table) => /* @__PURE__ */ React4.createElement("li", { key: table.tableId }, "Table ", table.tableNumber, " - Capacity: ", table.capacity)))));
|
|
4272
4278
|
};
|
|
4273
4279
|
var ReservationStepOne_default = ReservationStepOne;
|
|
4274
4280
|
|
|
@@ -4364,19 +4370,19 @@ var FormField = ({
|
|
|
4364
4370
|
};
|
|
4365
4371
|
const renderControl = () => {
|
|
4366
4372
|
if (type === "select") {
|
|
4367
|
-
return /* @__PURE__ */
|
|
4373
|
+
return /* @__PURE__ */ React4.createElement("select", { ...baseControlProps }, /* @__PURE__ */ React4.createElement("option", { value: "" }, selectPlaceholderText), options.map((opt) => /* @__PURE__ */ React4.createElement("option", { key: opt.value, value: opt.value }, opt.label)));
|
|
4368
4374
|
}
|
|
4369
4375
|
if (type === "textarea")
|
|
4370
|
-
return /* @__PURE__ */
|
|
4371
|
-
return /* @__PURE__ */
|
|
4376
|
+
return /* @__PURE__ */ React4.createElement("textarea", { ...baseControlProps, placeholder });
|
|
4377
|
+
return /* @__PURE__ */ React4.createElement("input", { type, ...baseControlProps, placeholder });
|
|
4372
4378
|
};
|
|
4373
|
-
return /* @__PURE__ */
|
|
4379
|
+
return /* @__PURE__ */ React4.createElement(
|
|
4374
4380
|
"div",
|
|
4375
4381
|
{
|
|
4376
4382
|
className: `form-group ${halfWidth ? "half-width" : ""}`,
|
|
4377
4383
|
style: { position: "relative" }
|
|
4378
4384
|
},
|
|
4379
|
-
/* @__PURE__ */
|
|
4385
|
+
/* @__PURE__ */ React4.createElement("div", { className: "input-container" }, Icon && /* @__PURE__ */ React4.createElement(Icon, { className: "input-icon" }), renderControl(), RightIconComponent && /* @__PURE__ */ React4.createElement(
|
|
4380
4386
|
"div",
|
|
4381
4387
|
{
|
|
4382
4388
|
className: "magic-wand-container",
|
|
@@ -4396,14 +4402,14 @@ var FormField = ({
|
|
|
4396
4402
|
cursor: "pointer"
|
|
4397
4403
|
}
|
|
4398
4404
|
},
|
|
4399
|
-
/* @__PURE__ */
|
|
4405
|
+
/* @__PURE__ */ React4.createElement(
|
|
4400
4406
|
RightIconComponent,
|
|
4401
4407
|
{
|
|
4402
4408
|
className: "magic-wand-icon",
|
|
4403
4409
|
style: { color: "#B567C2" }
|
|
4404
4410
|
}
|
|
4405
4411
|
),
|
|
4406
|
-
showTooltip && tooltipContent && /* @__PURE__ */
|
|
4412
|
+
showTooltip && tooltipContent && /* @__PURE__ */ React4.createElement(
|
|
4407
4413
|
"div",
|
|
4408
4414
|
{
|
|
4409
4415
|
ref: tooltipRef,
|
|
@@ -4423,7 +4429,7 @@ var FormField = ({
|
|
|
4423
4429
|
overflow: "hidden"
|
|
4424
4430
|
}
|
|
4425
4431
|
},
|
|
4426
|
-
/* @__PURE__ */
|
|
4432
|
+
/* @__PURE__ */ React4.createElement(
|
|
4427
4433
|
"div",
|
|
4428
4434
|
{
|
|
4429
4435
|
className: "lottie-container",
|
|
@@ -4438,7 +4444,7 @@ var FormField = ({
|
|
|
4438
4444
|
zIndex: 1
|
|
4439
4445
|
}
|
|
4440
4446
|
},
|
|
4441
|
-
/* @__PURE__ */
|
|
4447
|
+
/* @__PURE__ */ React4.createElement(
|
|
4442
4448
|
Lottie,
|
|
4443
4449
|
{
|
|
4444
4450
|
animationData: magicAnimation_default,
|
|
@@ -4447,7 +4453,7 @@ var FormField = ({
|
|
|
4447
4453
|
}
|
|
4448
4454
|
)
|
|
4449
4455
|
),
|
|
4450
|
-
/* @__PURE__ */
|
|
4456
|
+
/* @__PURE__ */ React4.createElement("div", { style: { position: "relative", zIndex: 2, padding: "12px 20px" } }, /* @__PURE__ */ React4.createElement(
|
|
4451
4457
|
"div",
|
|
4452
4458
|
{
|
|
4453
4459
|
style: {
|
|
@@ -4457,7 +4463,7 @@ var FormField = ({
|
|
|
4457
4463
|
}
|
|
4458
4464
|
},
|
|
4459
4465
|
tooltipContent
|
|
4460
|
-
), /* @__PURE__ */
|
|
4466
|
+
), /* @__PURE__ */ React4.createElement(
|
|
4461
4467
|
"div",
|
|
4462
4468
|
{
|
|
4463
4469
|
style: {
|
|
@@ -4468,7 +4474,7 @@ var FormField = ({
|
|
|
4468
4474
|
}
|
|
4469
4475
|
},
|
|
4470
4476
|
t.tooltip?.confirm
|
|
4471
|
-
), /* @__PURE__ */
|
|
4477
|
+
), /* @__PURE__ */ React4.createElement(
|
|
4472
4478
|
"div",
|
|
4473
4479
|
{
|
|
4474
4480
|
style: {
|
|
@@ -4482,7 +4488,7 @@ var FormField = ({
|
|
|
4482
4488
|
))
|
|
4483
4489
|
)
|
|
4484
4490
|
)),
|
|
4485
|
-
error && /* @__PURE__ */
|
|
4491
|
+
error && /* @__PURE__ */ React4.createElement("p", { className: "form-error" }, error)
|
|
4486
4492
|
);
|
|
4487
4493
|
};
|
|
4488
4494
|
var FormField_default = FormField;
|
|
@@ -4747,15 +4753,15 @@ var ReservationStepTwo = ({
|
|
|
4747
4753
|
return {
|
|
4748
4754
|
email: emailActive ? {
|
|
4749
4755
|
...common,
|
|
4750
|
-
tooltipContent: /* @__PURE__ */
|
|
4756
|
+
tooltipContent: /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("div", { style: { textAlign: "center", fontWeight: "bold" } }, t.magic?.title), /* @__PURE__ */ React4.createElement("div", null, pendingAutofill.firstName, " ", pendingAutofill.lastName), /* @__PURE__ */ React4.createElement("div", null, pendingAutofill.phone))
|
|
4751
4757
|
} : {},
|
|
4752
4758
|
phone: phoneActive ? {
|
|
4753
4759
|
...common,
|
|
4754
|
-
tooltipContent: /* @__PURE__ */
|
|
4760
|
+
tooltipContent: /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("div", { style: { textAlign: "center", fontWeight: "bold" } }, t.magic?.title), /* @__PURE__ */ React4.createElement("div", null, pendingAutofill.firstName, " ", pendingAutofill.lastName), /* @__PURE__ */ React4.createElement("div", null, pendingAutofill.email))
|
|
4755
4761
|
} : {}
|
|
4756
4762
|
};
|
|
4757
4763
|
}, [pendingAutofill, formData.email, formData.phone, t.magic?.title]);
|
|
4758
|
-
return /* @__PURE__ */
|
|
4764
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "reservation-step-two" }, /* @__PURE__ */ React4.createElement("div", { className: "account-manage-form" }, availableMenus.length > 0 && /* @__PURE__ */ React4.createElement(
|
|
4759
4765
|
FormField_default,
|
|
4760
4766
|
{
|
|
4761
4767
|
label: t.labels?.menu || "Menu",
|
|
@@ -4766,7 +4772,7 @@ var ReservationStepTwo = ({
|
|
|
4766
4772
|
onChange: handleChange,
|
|
4767
4773
|
error: errors.menu
|
|
4768
4774
|
}
|
|
4769
|
-
), /* @__PURE__ */
|
|
4775
|
+
), /* @__PURE__ */ React4.createElement("div", { className: "name-fields" }, /* @__PURE__ */ React4.createElement(
|
|
4770
4776
|
FormField_default,
|
|
4771
4777
|
{
|
|
4772
4778
|
label: t.labels?.firstName || "Voornaam",
|
|
@@ -4777,7 +4783,7 @@ var ReservationStepTwo = ({
|
|
|
4777
4783
|
error: errors.firstName,
|
|
4778
4784
|
icon: FaUser
|
|
4779
4785
|
}
|
|
4780
|
-
), /* @__PURE__ */
|
|
4786
|
+
), /* @__PURE__ */ React4.createElement(
|
|
4781
4787
|
FormField_default,
|
|
4782
4788
|
{
|
|
4783
4789
|
label: t.labels?.lastName || "Achternaam",
|
|
@@ -4788,7 +4794,7 @@ var ReservationStepTwo = ({
|
|
|
4788
4794
|
error: errors.lastName,
|
|
4789
4795
|
icon: FaUser
|
|
4790
4796
|
}
|
|
4791
|
-
)), /* @__PURE__ */
|
|
4797
|
+
)), /* @__PURE__ */ React4.createElement(
|
|
4792
4798
|
FormField_default,
|
|
4793
4799
|
{
|
|
4794
4800
|
label: t.labels?.email || "Email",
|
|
@@ -4802,7 +4808,7 @@ var ReservationStepTwo = ({
|
|
|
4802
4808
|
icon: FaEnvelope,
|
|
4803
4809
|
...magicProps.email
|
|
4804
4810
|
}
|
|
4805
|
-
), /* @__PURE__ */
|
|
4811
|
+
), /* @__PURE__ */ React4.createElement(
|
|
4806
4812
|
FormField_default,
|
|
4807
4813
|
{
|
|
4808
4814
|
label: t.labels?.phone || "Telefoon",
|
|
@@ -4816,7 +4822,7 @@ var ReservationStepTwo = ({
|
|
|
4816
4822
|
icon: FaPhone,
|
|
4817
4823
|
...magicProps.phone
|
|
4818
4824
|
}
|
|
4819
|
-
), /* @__PURE__ */
|
|
4825
|
+
), /* @__PURE__ */ React4.createElement(
|
|
4820
4826
|
FormField_default,
|
|
4821
4827
|
{
|
|
4822
4828
|
label: t.labels?.extraInfo || "Extra info",
|
|
@@ -4965,7 +4971,7 @@ var ReservationSummary = ({
|
|
|
4965
4971
|
onNewReservation
|
|
4966
4972
|
}) => {
|
|
4967
4973
|
const t = getSection(translations_default3, "reservationSummary");
|
|
4968
|
-
return /* @__PURE__ */
|
|
4974
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "reservation-summary" }, /* @__PURE__ */ React4.createElement("ul", { className: "reservation-details" }, /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.title)), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.guests, ":"), " ", formData.guests), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.date, ":"), " ", formData.date), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.time, ":"), " ", formData.time), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.firstName, ":"), " ", formData.firstName), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.lastName, ":"), " ", formData.lastName), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.email, ":"), " ", formData.email), /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.phone, ":"), " ", formData.phone), formData.menu && /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.menu, ":"), " ", formData.menu), formData.personeel && /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.staff, ":"), " ", formData.personeel), formData.giftcard && /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.giftcard, ":"), " ", formData.giftcard), formData.extraInfo && /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.extraInfo, ":"), " ", formData.extraInfo), formData.zitplaats && /* @__PURE__ */ React4.createElement("li", null, /* @__PURE__ */ React4.createElement("strong", null, t.seatPlace, ":"), " ", formData.zitplaats)), /* @__PURE__ */ React4.createElement("button", { className: "button-style-3", onClick: onNewReservation }, t.newReservationButton));
|
|
4969
4975
|
};
|
|
4970
4976
|
var ReservationSummary_default = ReservationSummary;
|
|
4971
4977
|
|
|
@@ -5035,7 +5041,7 @@ var GiftcardSelection = ({
|
|
|
5035
5041
|
handleChange({ target: { name: "giftcard", value: e.target.value } });
|
|
5036
5042
|
resetFormDataFields(["date", "time"]);
|
|
5037
5043
|
};
|
|
5038
|
-
return /* @__PURE__ */
|
|
5044
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "giftcard-selection" }, /* @__PURE__ */ React4.createElement(
|
|
5039
5045
|
FormField_default,
|
|
5040
5046
|
{
|
|
5041
5047
|
label: t.labels?.giftcard || "Giftcard",
|
|
@@ -5112,7 +5118,7 @@ var ZitplaatsSelection = ({
|
|
|
5112
5118
|
const tableSettings = restaurantData?.["table-settings"] || {};
|
|
5113
5119
|
const isTableAssignmentEnabled = tableSettings.isInstalled === true && tableSettings.assignmentMode === "automatic";
|
|
5114
5120
|
if (!isTableAssignmentEnabled || availableZitplaatsen.length === 0) return null;
|
|
5115
|
-
return /* @__PURE__ */
|
|
5121
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "zitplaats-selection" }, /* @__PURE__ */ React4.createElement("label", { htmlFor: "zitplaats", className: "form-label" }, t.labels?.seating || "Zitplaats"), /* @__PURE__ */ React4.createElement("div", { className: "input-container select-field" }, /* @__PURE__ */ React4.createElement(
|
|
5116
5122
|
"select",
|
|
5117
5123
|
{
|
|
5118
5124
|
id: "zitplaats",
|
|
@@ -5120,8 +5126,8 @@ var ZitplaatsSelection = ({
|
|
|
5120
5126
|
value: formData.zitplaats || "",
|
|
5121
5127
|
onChange: handleZitplaatsChange
|
|
5122
5128
|
},
|
|
5123
|
-
/* @__PURE__ */
|
|
5124
|
-
availableZitplaatsen.map((zitplaats) => /* @__PURE__ */
|
|
5129
|
+
/* @__PURE__ */ React4.createElement("option", { value: "" }, t.options?.noPreference || "Geen voorkeur"),
|
|
5130
|
+
availableZitplaatsen.map((zitplaats) => /* @__PURE__ */ React4.createElement(
|
|
5125
5131
|
"option",
|
|
5126
5132
|
{
|
|
5127
5133
|
key: zitplaats,
|
|
@@ -5251,21 +5257,21 @@ var ReservationSidebar = ({
|
|
|
5251
5257
|
onNewReservation();
|
|
5252
5258
|
}, [onNewReservation, setFormData]);
|
|
5253
5259
|
const seatSelectionEnabled = !!restaurantData?.["general-settings"]?.seatSelectionEnabled;
|
|
5254
|
-
return /* @__PURE__ */
|
|
5260
|
+
return /* @__PURE__ */ React4.createElement("div", { className: `reservation-sidebar-component ${isOpen ? "open" : ""}` }, /* @__PURE__ */ React4.createElement("div", { className: "reservation-sidebar-content" }, /* @__PURE__ */ React4.createElement("h2", { className: "admin-title" }, "Admin Reservatie"), /* @__PURE__ */ React4.createElement(
|
|
5255
5261
|
"button",
|
|
5256
5262
|
{
|
|
5257
5263
|
className: "close-sidebar-button",
|
|
5258
5264
|
onClick: onClose,
|
|
5259
5265
|
"aria-label": "Sluiten"
|
|
5260
5266
|
},
|
|
5261
|
-
/* @__PURE__ */
|
|
5262
|
-
), reservationSubmitted ? /* @__PURE__ */
|
|
5267
|
+
/* @__PURE__ */ React4.createElement(FaTimes, { size: 20, color: "#000" })
|
|
5268
|
+
), reservationSubmitted ? /* @__PURE__ */ React4.createElement(
|
|
5263
5269
|
ReservationSummary_default,
|
|
5264
5270
|
{
|
|
5265
5271
|
formData,
|
|
5266
5272
|
onNewReservation: handleNewReservationClick
|
|
5267
5273
|
}
|
|
5268
|
-
) : /* @__PURE__ */
|
|
5274
|
+
) : /* @__PURE__ */ React4.createElement(React4.Fragment, null, restaurantData && Object.keys(restaurantData).length > 0 && /* @__PURE__ */ React4.createElement("div", { className: "sidebar-section-giftcard" }, /* @__PURE__ */ React4.createElement(
|
|
5269
5275
|
GiftcardSelection_default,
|
|
5270
5276
|
{
|
|
5271
5277
|
restaurantData,
|
|
@@ -5273,7 +5279,7 @@ var ReservationSidebar = ({
|
|
|
5273
5279
|
handleChange,
|
|
5274
5280
|
resetFormDataFields
|
|
5275
5281
|
}
|
|
5276
|
-
)), restaurantData && Object.keys(restaurantData).length > 0 && seatSelectionEnabled && /* @__PURE__ */
|
|
5282
|
+
)), restaurantData && Object.keys(restaurantData).length > 0 && seatSelectionEnabled && /* @__PURE__ */ React4.createElement("div", { className: "sidebar-section-zitplaats" }, /* @__PURE__ */ React4.createElement(
|
|
5277
5283
|
ZitplaatsSelection_default,
|
|
5278
5284
|
{
|
|
5279
5285
|
restaurantData,
|
|
@@ -5281,7 +5287,7 @@ var ReservationSidebar = ({
|
|
|
5281
5287
|
handleChange,
|
|
5282
5288
|
resetFormDataFields
|
|
5283
5289
|
}
|
|
5284
|
-
)), availablePersoneel.length > 0 && /* @__PURE__ */
|
|
5290
|
+
)), availablePersoneel.length > 0 && /* @__PURE__ */ React4.createElement("div", { className: "sidebar-section-personeel" }, /* @__PURE__ */ React4.createElement(
|
|
5285
5291
|
FormField_default,
|
|
5286
5292
|
{
|
|
5287
5293
|
label: "",
|
|
@@ -5289,14 +5295,14 @@ var ReservationSidebar = ({
|
|
|
5289
5295
|
type: "select",
|
|
5290
5296
|
options: availablePersoneel.map((p) => {
|
|
5291
5297
|
const full = `${p.voornaam} ${p.achternaam}`;
|
|
5292
|
-
return { value, label: full };
|
|
5298
|
+
return { value: p.id, label: full };
|
|
5293
5299
|
}),
|
|
5294
5300
|
value: formData.personeel,
|
|
5295
5301
|
onChange: handleChange,
|
|
5296
5302
|
error: errors.personeel,
|
|
5297
5303
|
selectPlaceholder: "Toewijzen aan persoon"
|
|
5298
5304
|
}
|
|
5299
|
-
)), /* @__PURE__ */
|
|
5305
|
+
)), /* @__PURE__ */ React4.createElement("div", { className: "sidebar-section-one" }, /* @__PURE__ */ React4.createElement(
|
|
5300
5306
|
ReservationStepOne_default,
|
|
5301
5307
|
{
|
|
5302
5308
|
formData,
|
|
@@ -5308,7 +5314,7 @@ var ReservationSidebar = ({
|
|
|
5308
5314
|
timeblocksError,
|
|
5309
5315
|
restaurantData
|
|
5310
5316
|
}
|
|
5311
|
-
)), /* @__PURE__ */
|
|
5317
|
+
)), /* @__PURE__ */ React4.createElement("div", { className: "sidebar-section-two" }, /* @__PURE__ */ React4.createElement(
|
|
5312
5318
|
ReservationStepTwo_default,
|
|
5313
5319
|
{
|
|
5314
5320
|
formData,
|
|
@@ -5318,7 +5324,7 @@ var ReservationSidebar = ({
|
|
|
5318
5324
|
isSubmitting,
|
|
5319
5325
|
menuData
|
|
5320
5326
|
}
|
|
5321
|
-
)), /* @__PURE__ */
|
|
5327
|
+
)), /* @__PURE__ */ React4.createElement("div", { className: "reservation-footer" }, /* @__PURE__ */ React4.createElement(
|
|
5322
5328
|
"button",
|
|
5323
5329
|
{
|
|
5324
5330
|
type: "button",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@happychef/reservation-sidebar",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.9",
|
|
4
4
|
"description": "A compound component for managing restaurant reservations - JavaScript version with independent styles",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.mjs",
|