@anker-in/ui 0.1.10 → 0.1.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/demo-room.js +208 -177
  2. package/dist/demo-room.js.map +1 -1
  3. package/dist/demo-room.mjs +208 -177
  4. package/dist/demo-room.mjs.map +1 -1
  5. package/dist/index.d.mts +8 -3
  6. package/dist/index.d.ts +8 -3
  7. package/dist/index.js +518 -431
  8. package/dist/index.js.map +1 -1
  9. package/dist/index.mjs +518 -431
  10. package/dist/index.mjs.map +1 -1
  11. package/package.json +3 -4
package/dist/index.mjs CHANGED
@@ -13,13 +13,11 @@ import dayLocaleData from 'dayjs/plugin/localeData';
13
13
  import weekday from 'dayjs/plugin/weekday';
14
14
  import weekOfYear from 'dayjs/plugin/weekOfYear';
15
15
  import { Swiper, SwiperSlide } from 'swiper/react';
16
+ import { Navigation, Pagination, Autoplay } from 'swiper/modules';
17
+ import 'swiper/css';
18
+ import 'swiper/css/navigation';
19
+ import 'swiper/css/pagination';
16
20
 
17
- var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
18
- get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
19
- }) : x)(function(x) {
20
- if (typeof require !== "undefined") return require.apply(this, arguments);
21
- throw Error('Dynamic require of "' + x + '" is not supported');
22
- });
23
21
  function cn(...inputs) {
24
22
  return twMerge(clsx(inputs));
25
23
  }
@@ -62,7 +60,7 @@ var StudioCard = ({
62
60
  {
63
61
  ...props,
64
62
  className: cn(
65
- "p-6 cursor-pointer transition-colors duration-200",
63
+ "p-6 cursor-pointer transition-colors duration-200 border-b border-[#E4E5E6] last:border-b-0",
66
64
  className
67
65
  ),
68
66
  style: {
@@ -79,8 +77,8 @@ var StudioCard = ({
79
77
  },
80
78
  children: [
81
79
  /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between mb-4", children: [
82
- /* @__PURE__ */ jsx("h3", { className: "text-xl font-semibold text-gray-900", children: name }),
83
- distance !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-sm font-medium text-[#2E8B57] bg-[#E8F5E9] px-3 py-1 rounded-full whitespace-nowrap ml-2", children: [
80
+ /* @__PURE__ */ jsx("h3", { className: "text-[24px] l:text-[20px] font-bold text-[#080A0F]", children: name }),
81
+ distance !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-[16px] l:text-[14px] font-medium text-[#2E8B57] bg-[#E8F5E9] px-3 py-1 rounded-full whitespace-nowrap ml-2", children: [
84
82
  formatDistance(distance),
85
83
  " ",
86
84
  pageData.away
@@ -139,7 +137,7 @@ var StudioCard = ({
139
137
  ]
140
138
  }
141
139
  ),
142
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-600", children: [
140
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("p", { className: "text-[16px] l:text-[12px] text-[#2A2C32]", children: [
143
141
  availableTime === pageData.noAvailableTime ? "" : pageData.available,
144
142
  " ",
145
143
  availableTime
@@ -175,7 +173,7 @@ var StudioCard = ({
175
173
  ]
176
174
  }
177
175
  ),
178
- /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600 break-words", children: address }) })
176
+ /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("p", { className: "text-[16px] l:text-[14px] text-[#2A2C32] break-words", children: address }) })
179
177
  ] }),
180
178
  /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 mb-6", children: [
181
179
  /* @__PURE__ */ jsxs(
@@ -183,55 +181,44 @@ var StudioCard = ({
183
181
  {
184
182
  width: "20",
185
183
  height: "20",
186
- viewBox: "0 0 20 20",
184
+ viewBox: "0 0 24 24",
187
185
  fill: "none",
188
186
  xmlns: "http://www.w3.org/2000/svg",
189
187
  className: "flex-shrink-0 mt-0.5",
190
188
  children: [
191
- /* @__PURE__ */ jsx(
192
- "rect",
193
- {
194
- x: "3",
195
- y: "5",
196
- width: "14",
197
- height: "10",
198
- rx: "1.5",
199
- stroke: "currentColor",
200
- strokeWidth: "1.5"
201
- }
202
- ),
203
189
  /* @__PURE__ */ jsx(
204
190
  "path",
205
191
  {
206
- d: "M7 15V17",
192
+ d: "M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z",
207
193
  stroke: "currentColor",
208
- strokeWidth: "1.5",
209
- strokeLinecap: "round"
194
+ strokeWidth: "2",
195
+ strokeLinecap: "round",
196
+ strokeLinejoin: "round"
210
197
  }
211
198
  ),
212
199
  /* @__PURE__ */ jsx(
213
200
  "path",
214
201
  {
215
- d: "M13 15V17",
202
+ d: "M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325",
216
203
  stroke: "currentColor",
217
- strokeWidth: "1.5",
218
- strokeLinecap: "round"
204
+ strokeWidth: "2",
205
+ strokeLinecap: "round",
206
+ strokeLinejoin: "round"
219
207
  }
220
- ),
221
- /* @__PURE__ */ jsx("circle", { cx: "10", cy: "10", r: "1.5", fill: "currentColor" })
208
+ )
222
209
  ]
223
210
  }
224
211
  ),
225
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600", children: euifyMakeModel }) })
212
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-[16px] l:text-[14px] text-[#2A2C32]", children: euifyMakeModel }) })
226
213
  ] }),
227
214
  /* @__PURE__ */ jsx(
228
215
  "button",
229
216
  {
230
217
  onClick: handleScheduleClick,
231
218
  className: cn(
232
- "w-full px-6 py-3 rounded-full",
233
- "bg-white text-gray-900 border border-gray-900",
234
- "font-medium text-sm",
219
+ "w-fit px-[28px] l:px-[20px] l:py-[8px] py-3 rounded-full",
220
+ "bg-white text-gray-900 border-2 border-gray-900",
221
+ "font-bold text-[16px] l:text-[14px]",
235
222
  "hover:bg-gray-900 hover:text-white",
236
223
  "transition-all duration-200"
237
224
  ),
@@ -369,41 +356,53 @@ var StudioMap = ({
369
356
  marker.addListener("click", () => {
370
357
  setSelectedLocation(location);
371
358
  const content = `
372
- <div style="padding: 16px; max-width: 300px; font-family: system-ui, sans-serif;">
373
- <h3 style="margin: 0 0 12px 0; font-size: 18px; font-weight: 600;">${location.name}</h3>
374
- ${location.availableTime ? `<div style="margin-bottom: 8px; color: #666;">
375
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
376
- <path d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"/>
359
+ <div style="padding: 0 16px 16px 16px; font-weight: 700; font-family: 'MontForAnker'; max-width: 420px;">
360
+ <h3 style="margin: 0 0 16px 0; font-size: 24px; color: #080A0F;">${location.name}</h3>
361
+ ${location.availableTime ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
362
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
363
+ <rect x="3" y="4" width="14" height="13" rx="2" stroke="currentColor" stroke-width="1.5"/>
364
+ <path d="M3 8H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
365
+ <path d="M6 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
366
+ <path d="M14 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
377
367
  </svg>
378
- <span style="vertical-align: middle;"> ${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</span>
368
+ <div>
369
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</p>
370
+ </div>
379
371
  </div>` : ""}
380
- <div style="margin-bottom: 8px; color: #666;">
381
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
382
- <path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"/>
372
+ <div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
373
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
374
+ <path d="M10 10C11.1046 10 12 9.10457 12 8C12 6.89543 11.1046 6 10 6C8.89543 6 8 6.89543 8 8C8 9.10457 8.89543 10 10 10Z" stroke="currentColor" stroke-width="1.5"/>
375
+ <path d="M10 18C10 18 16 13 16 8C16 4.68629 13.3137 2 10 2C6.68629 2 4 4.68629 4 8C4 13 10 18 10 18Z" stroke="currentColor" stroke-width="1.5"/>
383
376
  </svg>
384
- <span style="vertical-align: middle;">${location.address}</span>
377
+ <div style="flex: 1;">
378
+ <p style="margin: 0; font-size: 16px; color: #2A2C32; word-wrap: break-word;">${location.address}</p>
379
+ </div>
385
380
  </div>
386
- ${location.euifyMakeModel ? `<div style="margin-bottom: 12px; color: #666;">
387
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
388
- <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
381
+ ${location.euifyMakeModel ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px;">
382
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
383
+ <path d="M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
384
+ <path d="M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
389
385
  </svg>
390
- <span style="vertical-align: middle;">${location.euifyMakeModel}</span>
386
+ <div>
387
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.euifyMakeModel}</p>
388
+ </div>
391
389
  </div>` : ""}
392
390
  <button
393
391
  id="schedule-btn-${location.id}"
394
392
  style="
395
- width: 100%;
396
- padding: 10px 16px;
397
- background: #000;
398
- color: #fff;
399
- border: none;
400
- border-radius: 6px;
401
- font-weight: 500;
393
+ width: fit-content;
394
+ padding: 12px 28px;
395
+ background: #fff;
396
+ color: #111827;
397
+ border: 2px solid #111827;
398
+ border-radius: 9999px;
399
+ font-weight: 700;
402
400
  cursor: pointer;
403
- font-size: 14px;
401
+ font-size: 16px;
402
+ transition: all 0.2s;
404
403
  "
405
- onmouseover="this.style.background='#333'"
406
- onmouseout="this.style.background='#000'"
404
+ onmouseover="this.style.background='#111827'; this.style.color='#fff';"
405
+ onmouseout="this.style.background='#fff'; this.style.color='#111827';"
407
406
  >
408
407
  ${pageData.scheduleNow}
409
408
  </button>
@@ -455,41 +454,53 @@ var StudioMap = ({
455
454
  const marker = markersRef.current[markerIndex];
456
455
  if (location && marker) {
457
456
  const content = `
458
- <div style="padding: 16px; max-width: 300px; font-family: system-ui, sans-serif;">
459
- <h3 style="margin: 0 0 12px 0; font-size: 18px; font-weight: 600;">${location.name}</h3>
460
- ${location.availableTime ? `<div style="margin-bottom: 8px; color: #666;">
461
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
462
- <path d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"/>
457
+ <div style="padding: 0 16px 16px 16px; font-weight: 700; font-family: 'MontForAnker'; max-width: 420px;">
458
+ <h3 style="margin: 0 0 16px 0; font-size: 24px; color: #080A0F;">${location.name}</h3>
459
+ ${location.availableTime ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
460
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
461
+ <rect x="3" y="4" width="14" height="13" rx="2" stroke="currentColor" stroke-width="1.5"/>
462
+ <path d="M3 8H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
463
+ <path d="M6 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
464
+ <path d="M14 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
463
465
  </svg>
464
- <span style="vertical-align: middle;">${pageData.available} ${location.availableTime}</span>
466
+ <div>
467
+ <p style="margin: 0;font-size: 16px; color: #2A2C32;">${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</p>
468
+ </div>
465
469
  </div>` : ""}
466
- <div style="margin-bottom: 8px; color: #666;">
467
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
468
- <path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"/>
470
+ <div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
471
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
472
+ <path d="M10 10C11.1046 10 12 9.10457 12 8C12 6.89543 11.1046 6 10 6C8.89543 6 8 6.89543 8 8C8 9.10457 8.89543 10 10 10Z" stroke="currentColor" stroke-width="1.5"/>
473
+ <path d="M10 18C10 18 16 13 16 8C16 4.68629 13.3137 2 10 2C6.68629 2 4 4.68629 4 8C4 13 10 18 10 18Z" stroke="currentColor" stroke-width="1.5"/>
469
474
  </svg>
470
- <span style="vertical-align: middle;">${location.address}</span>
475
+ <div style="flex: 1;">
476
+ <p style="margin: 0; font-size: 16px; color: #2A2C32; word-wrap: break-word;">${location.address}</p>
477
+ </div>
471
478
  </div>
472
- ${location.euifyMakeModel ? `<div style="margin-bottom: 12px; color: #666;">
473
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
474
- <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
479
+ ${location.euifyMakeModel ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px;">
480
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
481
+ <path d="M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
482
+ <path d="M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
475
483
  </svg>
476
- <span style="vertical-align: middle;">${location.euifyMakeModel}</span>
484
+ <div>
485
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.euifyMakeModel}</p>
486
+ </div>
477
487
  </div>` : ""}
478
488
  <button
479
489
  id="schedule-btn-hover-${location.id}"
480
490
  style="
481
- width: 100%;
482
- padding: 10px 16px;
483
- background: #000;
484
- color: #fff;
485
- border: none;
486
- border-radius: 6px;
487
- font-weight: 500;
491
+ width: fit-content;
492
+ padding: 12px 28px;
493
+ background: #fff;
494
+ color: #111827;
495
+ border: 2px solid #111827;
496
+ border-radius: 9999px;
497
+ font-weight: 700;
488
498
  cursor: pointer;
489
- font-size: 14px;
499
+ font-size: 16px;
500
+ transition: all 0.2s;
490
501
  "
491
- onmouseover="this.style.background='#333'"
492
- onmouseout="this.style.background='#000'"
502
+ onmouseover="this.style.background='#111827'; this.style.color='#fff';"
503
+ onmouseout="this.style.background='#fff'; this.style.color='#111827';"
493
504
  >
494
505
  ${pageData.scheduleNow}
495
506
  </button>
@@ -522,7 +533,7 @@ var StudioMap = ({
522
533
  "div",
523
534
  {
524
535
  className: cn(
525
- "flex items-center justify-center bg-gray-100 rounded-lg",
536
+ "flex items-center overflow-hidden justify-center bg-gray-100 rounded-[16px]",
526
537
  className
527
538
  ),
528
539
  style: { height: mapHeight },
@@ -534,7 +545,7 @@ var StudioMap = ({
534
545
  return /* @__PURE__ */ jsxs(
535
546
  "div",
536
547
  {
537
- className: cn("relative w-full rounded-lg overflow-hidden", className),
548
+ className: cn("relative w-full rounded-[16px] overflow-hidden", className),
538
549
  ...props,
539
550
  children: [
540
551
  /* @__PURE__ */ jsx("div", { ref: mapRef, style: { height: mapHeight } }),
@@ -939,6 +950,29 @@ var LocationFilter = ({
939
950
  );
940
951
  const showIndexBar = filteredItems.length >= 10;
941
952
  const handleItemClick = (item) => {
953
+ if (item.code === "__all__") {
954
+ if (currentLevel === "country") {
955
+ onSelect?.({
956
+ level: "country"
957
+ });
958
+ onClose?.();
959
+ } else if (currentLevel === "state") {
960
+ onSelect?.({
961
+ level: "state",
962
+ country: selectedCountry
963
+ });
964
+ onClose?.();
965
+ } else if (currentLevel === "city") {
966
+ const parts = selectedState?.split("/") || [];
967
+ onSelect?.({
968
+ level: "city",
969
+ country: parts[0],
970
+ state: parts[1]
971
+ });
972
+ onClose?.();
973
+ }
974
+ return;
975
+ }
942
976
  if (currentLevel === "country") {
943
977
  setSelectedCountry(item.code);
944
978
  setCurrentLevel("state");
@@ -969,104 +1003,104 @@ var LocationFilter = ({
969
1003
  return /* @__PURE__ */ jsxs(
970
1004
  "div",
971
1005
  {
972
- style: { height: "794px" },
1006
+ style: { height: "724px" },
973
1007
  className: cn(
974
- "w-full rounded-[12px] absolute z-10 top-0 left-0 bg-white border border-[#E4E5E6]",
1008
+ "w-full rounded-b-[12px] absolute z-10 bottom-[-2px] left-0 bg-white border border-[#E4E5E6]",
975
1009
  RoomsList_default.antdMobileScope
976
1010
  ),
977
1011
  children: [
978
- /* @__PURE__ */ jsxs(
1012
+ /* @__PURE__ */ jsx(
979
1013
  "div",
980
1014
  {
981
1015
  style: { background: "#F8F8F8" },
982
- className: "rounded-[12px] rounded-b-none h-[72px] font-bold text-[14px] flex flex-col",
983
- children: [
984
- /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end px-[20px] pt-[12px] pb-[8px]", children: /* @__PURE__ */ jsx(
1016
+ className: "h-[76px] font-bold text-[14px] flex flex-col",
1017
+ children: /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[16px] px-[20px] gap-[16px] py-[24px]", children: [
1018
+ /* @__PURE__ */ jsx(
985
1019
  "button",
986
1020
  {
987
- onClick: onClose,
988
- className: "ml-[12px] w-[24px] h-[24px] flex items-center justify-end",
989
- children: /* @__PURE__ */ jsx(
990
- "svg",
991
- {
992
- xmlns: "http://www.w3.org/2000/svg",
993
- width: "24",
994
- height: "24",
995
- viewBox: "0 0 24 24",
996
- fill: "none",
997
- children: /* @__PURE__ */ jsx(
998
- "path",
999
- {
1000
- d: "M6.4 19L5 17.6L10.6 12L5 6.4L6.4 5L12 10.6L17.6 5L19 6.4L13.4 12L19 17.6L17.6 19L12 13.4L6.4 19Z",
1001
- fill: "#1D1D1F"
1002
- }
1003
- )
1004
- }
1005
- )
1021
+ onClick: () => handleTabClick("country"),
1022
+ className: cn(
1023
+ "pb-[4px] transition-colors",
1024
+ currentLevel === "country" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]"
1025
+ ),
1026
+ children: pageData.country
1006
1027
  }
1007
- ) }),
1008
- /* @__PURE__ */ jsxs("div", { className: "flex items-center px-[20px] gap-[16px] pb-[8px]", children: [
1009
- /* @__PURE__ */ jsx(
1010
- "button",
1011
- {
1012
- onClick: () => handleTabClick("country"),
1013
- className: cn(
1014
- "pb-[4px] transition-colors",
1015
- currentLevel === "country" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]"
1016
- ),
1017
- children: pageData.country
1018
- }
1019
- ),
1020
- /* @__PURE__ */ jsx(
1021
- "button",
1022
- {
1023
- onClick: () => handleTabClick("state"),
1024
- disabled: !selectedCountry,
1025
- className: cn(
1026
- "pb-[4px] transition-colors",
1027
- currentLevel === "state" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]",
1028
- !selectedCountry && "opacity-50 cursor-not-allowed"
1029
- ),
1030
- children: pageData.state
1031
- }
1032
- ),
1033
- /* @__PURE__ */ jsx(
1034
- "button",
1035
- {
1036
- onClick: () => handleTabClick("city"),
1037
- disabled: !selectedState,
1038
- className: cn(
1039
- "pb-[4px] transition-colors",
1040
- currentLevel === "city" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]",
1041
- !selectedState && "opacity-50 cursor-not-allowed"
1042
- ),
1043
- children: pageData.city
1044
- }
1045
- )
1046
- ] })
1047
- ]
1028
+ ),
1029
+ /* @__PURE__ */ jsx(
1030
+ "button",
1031
+ {
1032
+ onClick: () => handleTabClick("state"),
1033
+ disabled: !selectedCountry,
1034
+ className: cn(
1035
+ "pb-[4px] transition-colors",
1036
+ currentLevel === "state" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
1037
+ !selectedCountry && "opacity-50 cursor-not-allowed"
1038
+ ),
1039
+ children: pageData.state
1040
+ }
1041
+ ),
1042
+ /* @__PURE__ */ jsx(
1043
+ "button",
1044
+ {
1045
+ onClick: () => handleTabClick("city"),
1046
+ disabled: !selectedState,
1047
+ className: cn(
1048
+ "pb-[4px] transition-colors",
1049
+ currentLevel === "city" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
1050
+ !selectedState && "opacity-50 cursor-not-allowed"
1051
+ ),
1052
+ children: pageData.city
1053
+ }
1054
+ )
1055
+ ] })
1048
1056
  }
1049
1057
  ),
1050
- /* @__PURE__ */ jsx(AntdMobileIsolated, { style: { height: "calc(100% - 72px)" }, children: showIndexBar ? /* @__PURE__ */ jsx(IndexBar, { style: { height: "100%" }, children: groupedItems.map((group) => {
1051
- const { title, items } = group;
1052
- return /* @__PURE__ */ jsx(IndexBar.Panel, { index: title, title, children: /* @__PURE__ */ jsx(List, { children: items.map((item) => /* @__PURE__ */ jsx(
1058
+ /* @__PURE__ */ jsx(AntdMobileIsolated, { style: { height: "calc(100% - 76px)" }, children: showIndexBar ? /* @__PURE__ */ jsxs("div", { style: { height: "100%", display: "flex", flexDirection: "column" }, children: [
1059
+ /* @__PURE__ */ jsx(List, { children: /* @__PURE__ */ jsx(
1060
+ List.Item,
1061
+ {
1062
+ onClick: () => handleItemClick({ code: "__all__", name: pageData.allLocations || "All", count: filteredItems.length }),
1063
+ className: "text-[16px] !pl-[24px] font-bold",
1064
+ style: { cursor: "pointer", borderBottom: "1px solid #E4E5E6" },
1065
+ children: pageData.allLocations
1066
+ },
1067
+ "__all__"
1068
+ ) }),
1069
+ /* @__PURE__ */ jsx(IndexBar, { style: { flex: 1 }, children: groupedItems.map((group) => {
1070
+ const { title, items } = group;
1071
+ return /* @__PURE__ */ jsx(IndexBar.Panel, { index: title, title, children: /* @__PURE__ */ jsx(List, { children: items.map((item) => /* @__PURE__ */ jsx(
1072
+ List.Item,
1073
+ {
1074
+ onClick: () => handleItemClick(item),
1075
+ className: "text-[16px] !pl-[24px]",
1076
+ style: { cursor: "pointer" },
1077
+ children: item.name
1078
+ },
1079
+ item.code
1080
+ )) }) }, title);
1081
+ }) })
1082
+ ] }) : /* @__PURE__ */ jsx("div", { style: { height: "100%", overflow: "auto" }, children: /* @__PURE__ */ jsxs(List, { children: [
1083
+ /* @__PURE__ */ jsx(
1084
+ List.Item,
1085
+ {
1086
+ onClick: () => handleItemClick({ code: "__all__", name: pageData.allLocations || "All", count: filteredItems.length }),
1087
+ className: "text-[16px] !pl-[24px] font-bold",
1088
+ style: { cursor: "pointer", borderBottom: "1px solid #E4E5E6" },
1089
+ children: pageData.allLocations
1090
+ },
1091
+ "__all__"
1092
+ ),
1093
+ filteredItems.map((item) => /* @__PURE__ */ jsx(
1053
1094
  List.Item,
1054
1095
  {
1055
1096
  onClick: () => handleItemClick(item),
1097
+ className: "text-[16px] !pl-[24px]",
1056
1098
  style: { cursor: "pointer" },
1057
1099
  children: item.name
1058
1100
  },
1059
1101
  item.code
1060
- )) }) }, title);
1061
- }) }) : /* @__PURE__ */ jsx("div", { style: { height: "100%", overflow: "auto" }, children: /* @__PURE__ */ jsx(List, { children: filteredItems.map((item) => /* @__PURE__ */ jsx(
1062
- List.Item,
1063
- {
1064
- onClick: () => handleItemClick(item),
1065
- style: { cursor: "pointer" },
1066
- children: item.name
1067
- },
1068
- item.code
1069
- )) }) }) })
1102
+ ))
1103
+ ] }) }) })
1070
1104
  ]
1071
1105
  }
1072
1106
  );
@@ -1262,7 +1296,7 @@ var RoomsList = ({
1262
1296
  lat: Number(room.latitude) || 0,
1263
1297
  lng: Number(room.longitude) || 0,
1264
1298
  availableTime: nextAvailableTimeslot ? `${nextAvailableTimeslot.start_time}` : mergedPageData.noAvailableTime,
1265
- euifyMakeModel: room?.description
1299
+ euifyMakeModel: room?.equipment?.join(", ") || ""
1266
1300
  };
1267
1301
  });
1268
1302
  }, [demoRooms, mergedPageData.defaultCountry, mergedPageData.noAvailableTime]);
@@ -1292,10 +1326,6 @@ var RoomsList = ({
1292
1326
  setSelectedLocation(selection);
1293
1327
  setShowLocationFilter(false);
1294
1328
  };
1295
- const handleClearFilter = () => {
1296
- setSelectedLocation(void 0);
1297
- };
1298
- console.log(filteredStudioLocations);
1299
1329
  return /* @__PURE__ */ jsxs("div", { className, ...props, children: [
1300
1330
  /* @__PURE__ */ jsx(Title, { title: mergedPageData.title }),
1301
1331
  loading && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-[794px]", children: /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx("div", { className: "text-lg font-medium", children: mergedPageData.loadingText }) }) }),
@@ -1310,12 +1340,15 @@ var RoomsList = ({
1310
1340
  className: "flex-none relative w-[420px] l:!w-full",
1311
1341
  style: { height: "794px" },
1312
1342
  children: [
1313
- /* @__PURE__ */ jsx("div", { className: "rounded-[12px] mb-4 bg-white border border-[#E4E5E6] px-[20px] py-[16px]", children: /* @__PURE__ */ jsxs("div", { className: "h-[40px] font-bold text-[16px] gap-10 flex items-center", children: [
1343
+ /* @__PURE__ */ jsx("div", { className: cn(
1344
+ "mb-4 bg-white border border-[#E4E5E6] px-[20px] py-[16px]",
1345
+ showLocationFilter ? "rounded-t-[12px] rounded-b-none" : "rounded-[12px]"
1346
+ ), children: /* @__PURE__ */ jsxs("div", { className: "h-[40px] font-bold text-[16px] l:text-[14px] gap-10 l:gap-4 flex items-center", children: [
1314
1347
  /* @__PURE__ */ jsxs(
1315
1348
  "button",
1316
1349
  {
1317
- className: "flex cursor-pointer items-center hover:text-[#2E8B57] transition-colors",
1318
- onClick: () => setShowLocationFilter(true),
1350
+ className: "flex cursor-pointer items-center hover:text-[#3ADB67] transition-colors",
1351
+ onClick: () => setShowLocationFilter(!showLocationFilter),
1319
1352
  children: [
1320
1353
  /* @__PURE__ */ jsx("span", { className: "mr-1", children: getSelectedLocationName() }),
1321
1354
  /* @__PURE__ */ jsx(
@@ -1326,6 +1359,10 @@ var RoomsList = ({
1326
1359
  height: "24",
1327
1360
  viewBox: "0 0 24 24",
1328
1361
  fill: "none",
1362
+ className: cn(
1363
+ "transition-transform duration-300",
1364
+ showLocationFilter && "rotate-180"
1365
+ ),
1329
1366
  children: /* @__PURE__ */ jsx(
1330
1367
  "path",
1331
1368
  {
@@ -1338,14 +1375,7 @@ var RoomsList = ({
1338
1375
  ]
1339
1376
  }
1340
1377
  ),
1341
- selectedLocation && /* @__PURE__ */ jsx(
1342
- "button",
1343
- {
1344
- onClick: handleClearFilter,
1345
- className: "ml-auto text-[14px] text-[#2E8B57] hover:underline",
1346
- children: mergedPageData.locationFilter.clear
1347
- }
1348
- ),
1378
+ selectedLocation && false,
1349
1379
  /* @__PURE__ */ jsxs("div", { className: "flex text-[#767880] cursor-not-allowed", children: [
1350
1380
  mergedPageData.machine,
1351
1381
  /* @__PURE__ */ jsx(
@@ -1371,7 +1401,7 @@ var RoomsList = ({
1371
1401
  "div",
1372
1402
  {
1373
1403
  style: { maxHeight: "706px", overflow: "auto" },
1374
- className: "rounded-[12px] bg-white border border-[#E4E5E6]",
1404
+ className: "rounded-[12px] bg-white border h-[706px] border-[#E4E5E6]",
1375
1405
  children: filteredStudioLocations.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-[200px] text-[#767880]", children: mergedPageData.locationFilter.noStudiosFound }) : filteredStudioLocations.map((item) => {
1376
1406
  return /* @__PURE__ */ jsx(
1377
1407
  StudioCard,
@@ -1386,7 +1416,6 @@ var RoomsList = ({
1386
1416
  euifyMakeModel: item?.euifyMakeModel || "",
1387
1417
  onSchedule,
1388
1418
  onMouseEnter: () => setHoveredRoomId(item.id),
1389
- onMouseLeave: () => setHoveredRoomId(null),
1390
1419
  pageData: {
1391
1420
  ...mergedPageData.studioCard,
1392
1421
  noAvailableTime: mergedPageData?.noAvailableTime
@@ -1642,6 +1671,7 @@ var QuestionnaireForm = ({
1642
1671
  const [agreements, setAgreements] = useState({});
1643
1672
  const [agreementError, setAgreementError] = useState("");
1644
1673
  const [phoneCountryCodes, setPhoneCountryCodes] = useState({});
1674
+ const [otherInputs, setOtherInputs] = useState({});
1645
1675
  const defaultCountryCodes = [
1646
1676
  { code: "+1", country: "US/CA" },
1647
1677
  { code: "+86", country: "CN" },
@@ -1702,6 +1732,13 @@ var QuestionnaireForm = ({
1702
1732
  setAgreementError("");
1703
1733
  }
1704
1734
  };
1735
+ const handleOtherInputChange = (questionId, value) => {
1736
+ setOtherInputs((prev) => ({
1737
+ ...prev,
1738
+ [questionId]: value
1739
+ }));
1740
+ handleChange(questionId, value);
1741
+ };
1705
1742
  const validateForm = () => {
1706
1743
  const newErrors = {};
1707
1744
  questions.forEach((question) => {
@@ -1764,7 +1801,7 @@ var QuestionnaireForm = ({
1764
1801
  onChange: (e) => handleChange(questionId, e.target.value),
1765
1802
  placeholder: question.placeholder,
1766
1803
  className: cn(
1767
- "w-full px-4 py-3 rounded-lg border text-base",
1804
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1768
1805
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1769
1806
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1770
1807
  )
@@ -1780,7 +1817,7 @@ var QuestionnaireForm = ({
1780
1817
  onBlur: (e) => handleEmailBlur(questionId, e.target.value),
1781
1818
  placeholder: question.placeholder,
1782
1819
  className: cn(
1783
- "w-full px-4 py-3 rounded-lg border text-base",
1820
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1784
1821
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1785
1822
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1786
1823
  )
@@ -1799,6 +1836,7 @@ var QuestionnaireForm = ({
1799
1836
  "appearance-none pl-3 pr-8 py-3 rounded-lg border text-base",
1800
1837
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1801
1838
  "bg-white cursor-pointer w-[80px]",
1839
+ "dark:bg-white dark:text-gray-900",
1802
1840
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1803
1841
  ),
1804
1842
  children: countryCodes.map((item) => /* @__PURE__ */ jsx("option", { value: item.code, children: item.code }, item.code))
@@ -1833,7 +1871,7 @@ var QuestionnaireForm = ({
1833
1871
  onChange: (e) => handleChange(questionId, e.target.value),
1834
1872
  placeholder: question.placeholder,
1835
1873
  className: cn(
1836
- "flex-1 px-4 py-3 rounded-lg border text-base",
1874
+ "flex-1 px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1837
1875
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1838
1876
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1839
1877
  )
@@ -1849,8 +1887,9 @@ var QuestionnaireForm = ({
1849
1887
  placeholder: question.placeholder,
1850
1888
  rows: 4,
1851
1889
  className: cn(
1852
- "w-full px-4 py-3 rounded-lg border text-base resize-none",
1890
+ "w-full px-4 py-3 rounded-lg border text-base resize-none bg-white",
1853
1891
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1892
+ "dark:bg-white dark:text-gray-900",
1854
1893
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1855
1894
  )
1856
1895
  }
@@ -1869,14 +1908,75 @@ var QuestionnaireForm = ({
1869
1908
  value: option.value || option.label,
1870
1909
  checked: responses[questionId] === (option.value || option.label),
1871
1910
  onChange: (e) => handleChange(questionId, e.target.value),
1872
- className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2"
1911
+ className: "w-5 h-5 appearance-none cursor-pointer flex-shrink-0",
1912
+ style: {
1913
+ backgroundImage: responses[questionId] === (option.value || option.label) ? "url(https://cdn.shopify.com/s/files/1/0569/5147/2268/files/SelectBox.png?v=1769507941)" : "url(https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Frame_2121235232_2.png?v=1769507995)",
1914
+ backgroundSize: "contain",
1915
+ backgroundRepeat: "no-repeat",
1916
+ backgroundPosition: "center"
1917
+ }
1873
1918
  }
1874
1919
  ),
1875
- /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 group-hover:text-[#3ADB67] transition-colors", children: option.label })
1920
+ /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1876
1921
  ]
1877
1922
  },
1878
1923
  option.value || option.label
1879
1924
  )) });
1925
+ case "radio_with_other": {
1926
+ const isOtherSelected = responses[questionId] === "__other__" || responses[questionId] && !question?.options?.find(
1927
+ (opt) => (opt.value || opt.label) === responses[questionId]
1928
+ );
1929
+ return /* @__PURE__ */ jsx("div", { className: "space-y-3", children: question?.options?.map((option) => {
1930
+ const optionValue = option.value || option.label;
1931
+ const isOtherOption = optionValue === "__other__";
1932
+ return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
1933
+ /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-3 cursor-pointer group", children: [
1934
+ /* @__PURE__ */ jsx(
1935
+ "input",
1936
+ {
1937
+ type: "radio",
1938
+ name: questionId,
1939
+ value: optionValue,
1940
+ checked: isOtherOption ? isOtherSelected : responses[questionId] === optionValue,
1941
+ onChange: (e) => {
1942
+ if (isOtherOption) {
1943
+ handleChange(questionId, "__other__");
1944
+ setOtherInputs((prev) => ({
1945
+ ...prev,
1946
+ [questionId]: ""
1947
+ }));
1948
+ } else {
1949
+ handleChange(questionId, e.target.value);
1950
+ }
1951
+ },
1952
+ className: "w-5 h-5 appearance-none cursor-pointer flex-shrink-0",
1953
+ style: {
1954
+ backgroundImage: (isOtherOption ? isOtherSelected : responses[questionId] === optionValue) ? "url(https://cdn.shopify.com/s/files/1/0569/5147/2268/files/SelectBox.png?v=1769507941)" : "url(https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Frame_2121235232_2.png?v=1769507995)",
1955
+ backgroundSize: "contain",
1956
+ backgroundRepeat: "no-repeat",
1957
+ backgroundPosition: "center"
1958
+ }
1959
+ }
1960
+ ),
1961
+ /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1962
+ ] }),
1963
+ isOtherOption && isOtherSelected && /* @__PURE__ */ jsx(
1964
+ "input",
1965
+ {
1966
+ type: "text",
1967
+ value: otherInputs[questionId] || "",
1968
+ onChange: (e) => handleOtherInputChange(questionId, e.target.value),
1969
+ placeholder: question.placeholder || "Please specify...",
1970
+ className: cn(
1971
+ "w-full ml-8 px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1972
+ "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1973
+ hasError ? "border-red-500" : "border-[#E4E5E6]"
1974
+ )
1975
+ }
1976
+ )
1977
+ ] }, optionValue);
1978
+ }) });
1979
+ }
1880
1980
  case "checkbox":
1881
1981
  return /* @__PURE__ */ jsx("div", { className: "space-y-3", children: question?.options?.map((option) => {
1882
1982
  const optionValue = option.value || option.label;
@@ -1898,59 +1998,66 @@ var QuestionnaireForm = ({
1898
1998
  optionValue,
1899
1999
  e.target.checked
1900
2000
  ),
1901
- className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2 rounded"
2001
+ className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2 rounded",
2002
+ style: {
2003
+ accentColor: "#3ADB67"
2004
+ }
1902
2005
  }
1903
2006
  ),
1904
- /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 group-hover:text-[#3ADB67] transition-colors", children: option.label })
2007
+ /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1905
2008
  ]
1906
2009
  },
1907
2010
  optionValue
1908
2011
  );
1909
2012
  }) });
1910
2013
  case "select":
1911
- return /* @__PURE__ */ jsxs(
2014
+ return /* @__PURE__ */ jsx(
1912
2015
  "select",
1913
2016
  {
1914
2017
  value: responses[questionId] || "",
1915
2018
  onChange: (e) => handleChange(questionId, e.target.value),
1916
2019
  className: cn(
1917
- "w-full px-4 py-3 rounded-lg border text-base",
2020
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1918
2021
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1919
- "bg-white cursor-pointer",
2022
+ "cursor-pointer",
1920
2023
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1921
2024
  ),
1922
- children: [
1923
- /* @__PURE__ */ jsx("option", { value: "", children: question.placeholder || "Please select..." }),
1924
- question.options?.map((option) => /* @__PURE__ */ jsx(
1925
- "option",
1926
- {
1927
- value: option.value || option.label,
1928
- children: option.label
1929
- },
1930
- option.value || option.label
1931
- ))
1932
- ]
2025
+ children: question.options?.map((option) => /* @__PURE__ */ jsx(
2026
+ "option",
2027
+ {
2028
+ value: option.value || option.label,
2029
+ children: option.label
2030
+ },
2031
+ option.value || option.label
2032
+ ))
1933
2033
  }
1934
2034
  );
1935
2035
  default:
1936
2036
  return null;
1937
2037
  }
1938
2038
  };
1939
- return /* @__PURE__ */ jsxs("div", { className: "pb-[80px]", children: [
1940
- questions && questions.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-white rounded-[12px] border border-[#E4E5E6] p-8", children: /* @__PURE__ */ jsx("form", { onSubmit: handleSubmit, className: cn("space-y-6", className), children: questions.map((question) => {
2039
+ return /* @__PURE__ */ jsxs("div", { className: "pb-[80px] light", children: [
2040
+ questions && questions.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-white rounded-[12px] border border-[#E4E5E6] p-8 dark:bg-white dark:border-[#E4E5E6] l:p-4", children: /* @__PURE__ */ jsx("form", { onSubmit: handleSubmit, className: cn("space-y-6", className), children: questions.map((question) => {
1941
2041
  const questionId = getQuestionId(question);
1942
2042
  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
1943
2043
  /* @__PURE__ */ jsxs("label", { className: "block", children: [
1944
- /* @__PURE__ */ jsxs("span", { className: "text-base font-medium text-gray-900", children: [
2044
+ /* @__PURE__ */ jsxs("span", { className: "text-base font-bold text-gray-900 dark:text-gray-900", children: [
1945
2045
  question.label,
1946
2046
  question.required && /* @__PURE__ */ jsx("span", { className: "text-red-500 ml-1", children: "*" })
1947
2047
  ] }),
1948
- question.description && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 mt-1", children: question.description }),
1949
- question.type === "email" && questionId === "email" && pageData?.emailDescription && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 mt-1", children: pageData.emailDescription })
2048
+ question.description && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 dark:text-gray-600 font-bold mt-1", children: question.description }),
2049
+ question.type === "email" && questionId === "email" && pageData?.emailDescription && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 dark:text-gray-600 font-bold mt-1", children: pageData.emailDescription })
1950
2050
  ] }),
1951
2051
  renderQuestion(question),
1952
- question.hint && !errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: question.hint }),
1953
- errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm", style: { color: "#FF4D4D" }, children: errors[questionId] })
2052
+ question.hint && !errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 dark:text-gray-500 font-bold", children: question.hint }),
2053
+ errors[questionId] && /* @__PURE__ */ jsx(
2054
+ "p",
2055
+ {
2056
+ className: "text-sm font-bold",
2057
+ style: { color: "#FF4D4D" },
2058
+ children: errors[questionId]
2059
+ }
2060
+ )
1954
2061
  ] }, questionId);
1955
2062
  }) }) }),
1956
2063
  !!selectedTimeslotId && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center", children: [
@@ -1963,20 +2070,30 @@ var QuestionnaireForm = ({
1963
2070
  id: `agreement-${index}`,
1964
2071
  checked: agreements[index] || false,
1965
2072
  onChange: (e) => handleAgreementChange(index, e.target.checked),
1966
- className: "w-5 h-5 rounded border-gray-300 text-[#2FC257] focus:ring-[#2FC257] cursor-pointer flex-shrink-0"
2073
+ className: "w-5 h-5 rounded text-[#3ADB67] focus:ring-[#3ADB67] cursor-pointer flex-shrink-0",
2074
+ style: {
2075
+ accentColor: "#3ADB67"
2076
+ }
1967
2077
  }
1968
2078
  ),
1969
2079
  /* @__PURE__ */ jsx(
1970
2080
  "label",
1971
2081
  {
1972
2082
  htmlFor: `agreement-${index}`,
1973
- className: "text-sm text-gray-700 cursor-pointer select-none flex-1 [&_a]:underline [&_a]:text-blue-600 [&_a:hover]:text-blue-700",
2083
+ className: "text-sm text-gray-700 dark:text-gray-700 font-bold cursor-pointer select-none flex-1 [&_a]:underline [&_a]:text-blue-600 [&_a:hover]:text-blue-700",
1974
2084
  dangerouslySetInnerHTML: { __html: agreeContent },
1975
2085
  "aria-label": `Agreement ${index + 1}`
1976
2086
  }
1977
2087
  )
1978
2088
  ] }, index)),
1979
- agreementError && /* @__PURE__ */ jsx("p", { className: "text-sm mt-2", style: { color: "#FF4D4D" }, children: agreementError })
2089
+ agreementError && /* @__PURE__ */ jsx(
2090
+ "p",
2091
+ {
2092
+ className: "text-sm font-bold mt-2",
2093
+ style: { color: "#FF4D4D" },
2094
+ children: agreementError
2095
+ }
2096
+ )
1980
2097
  ] }),
1981
2098
  /* @__PURE__ */ jsx(
1982
2099
  "button",
@@ -1986,7 +2103,7 @@ var QuestionnaireForm = ({
1986
2103
  onClick: handleSubmit,
1987
2104
  className: cn(
1988
2105
  "w-fit mt-6 px-6 py-4 rounded-full",
1989
- "bg-[#080A0F] text-white font-medium text-base",
2106
+ "bg-[#080A0F] text-white font-bold text-base",
1990
2107
  "hover:bg-[#2FC257] transition-colors",
1991
2108
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:ring-offset-2",
1992
2109
  "disabled:opacity-50 disabled:cursor-not-allowed"
@@ -2017,7 +2134,8 @@ var DateTimePicker = ({
2017
2134
  bookingFailed: "Booking failed"
2018
2135
  },
2019
2136
  locale,
2020
- onBookingSuccess
2137
+ onBookingSuccess,
2138
+ onQuestionnaireSubmit
2021
2139
  }) => {
2022
2140
  const { token } = theme.useToken();
2023
2141
  const [selectedDate, setSelectedDate] = useState(null);
@@ -2131,10 +2249,10 @@ var DateTimePicker = ({
2131
2249
  const wrapperStyle = {
2132
2250
  background: "#fff",
2133
2251
  border: `1px solid ${token.colorBorderSecondary}`,
2134
- borderRadius: token.borderRadiusLG
2252
+ borderRadius: 16
2135
2253
  };
2136
2254
  return /* @__PURE__ */ jsxs("div", { children: [
2137
- /* @__PURE__ */ jsx("div", { className: "text-[48px] l:text-[32px] py-[64px] l:py-[24px] font-bold text-center", children: pageData.scheduleYourVisit }),
2255
+ /* @__PURE__ */ jsx("div", { className: "text-[48px] l:text-[32px] py-[64px] l:py-[24px] l:pt-[64px] font-bold text-center", children: pageData.scheduleYourVisit }),
2138
2256
  /* @__PURE__ */ jsxs("div", { className: "flex gap-4 l:flex-col", children: [
2139
2257
  /* @__PURE__ */ jsx(
2140
2258
  ConfigProvider,
@@ -2158,6 +2276,20 @@ var DateTimePicker = ({
2158
2276
  className: "calendar-custom-cell w-[calc(824/1920*100vw)] min-l:max-w-[824px] l:w-full",
2159
2277
  children: [
2160
2278
  /* @__PURE__ */ jsx("style", { children: `
2279
+ .calendar-custom-cell {
2280
+ border-radius: 16px !important;
2281
+ overflow: hidden;
2282
+ padding: 0 24px 16px 24px !important;
2283
+ }
2284
+ .calendar-custom-cell,
2285
+ .calendar-custom-cell *,
2286
+ .calendar-custom-cell .ant-picker-panel,
2287
+ .calendar-custom-cell .ant-picker-calendar,
2288
+ .calendar-custom-cell .ant-picker-content,
2289
+ .calendar-custom-cell .ant-picker-cell,
2290
+ .calendar-custom-cell .ant-picker-calendar-date-value {
2291
+ font-family: 'MontForAnker' !important;
2292
+ }
2161
2293
  .calendar-custom-cell .ant-picker-cell {
2162
2294
  padding: 6px !important;
2163
2295
  text-align: center !important;
@@ -2175,6 +2307,11 @@ var DateTimePicker = ({
2175
2307
  border: 1px solid #E4E5E6 !important;
2176
2308
  aspect-ratio: 1 / 1 !important;
2177
2309
  }
2310
+ .calendar-custom-cell .ant-picker-calendar-date-value {
2311
+ line-height: 38px !important;
2312
+ font-weight: 700 !important;
2313
+ font-size: 14px !important;
2314
+ }
2178
2315
  @media (min-width: 1024px) and (max-width: 1919px) {
2179
2316
  .calendar-custom-cell .ant-picker-cell-inner {
2180
2317
  width: 54px !important;
@@ -2183,6 +2320,8 @@ var DateTimePicker = ({
2183
2320
  }
2184
2321
  .calendar-custom-cell .ant-picker-calendar-date-value {
2185
2322
  line-height: 54px !important;
2323
+ font-weight: 700 !important;
2324
+ font-size: 20px !important;
2186
2325
  }
2187
2326
  }
2188
2327
  @media (min-width: 1920px) {
@@ -2193,17 +2332,19 @@ var DateTimePicker = ({
2193
2332
  }
2194
2333
  .calendar-custom-cell .ant-picker-calendar-date-value {
2195
2334
  line-height: 100px !important;
2335
+ font-weight: 700 !important;
2336
+ font-size: 20px !important;
2196
2337
  }
2197
2338
  }
2198
2339
  .calendar-custom-cell .ant-picker-cell-selected .ant-picker-cell-inner,
2199
2340
  .calendar-custom-cell .ant-picker-cell-selected:not(.ant-picker-cell-disabled) .ant-picker-cell-inner {
2200
2341
  background-color: #3ADB67 !important;
2201
- color: white !important;
2342
+ color: #080A0F !important;
2202
2343
  border-color: #3ADB67 !important;
2203
2344
  }
2204
2345
  .calendar-custom-cell .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner {
2205
2346
  background-color: #3ADB67 !important;
2206
- color: white !important;
2347
+ color: #080A0F !important;
2207
2348
  }
2208
2349
  .calendar-custom-cell .ant-picker-cell-today .ant-picker-cell-inner {
2209
2350
  border-color: #3ADB67 !important;
@@ -2222,25 +2363,24 @@ var DateTimePicker = ({
2222
2363
  .calendar-custom-cell .ant-picker-cell-today .ant-picker-cell-inner::before {
2223
2364
  display: none !important;
2224
2365
  }
2225
- .calendar-custom-cell .ant-picker-calendar-date-value {
2226
- line-height: 38px !important;
2227
- }
2228
2366
  .calendar-custom-cell .ant-picker-content {
2229
2367
  width: 100% !important;
2230
2368
  }
2231
2369
  .calendar-custom-cell .ant-picker-content thead tr th {
2232
2370
  line-height: 48px !important;
2371
+ font-weight: 700 !important;
2372
+ font-size: 18px !important;
2233
2373
  }
2234
2374
  .calendar-custom-cell .ant-picker-cell-disabled .ant-picker-cell-inner {
2235
2375
  background-color: #F5F5F5 !important;
2236
- color: #BDBDBD !important;
2237
- border-color: #E4E5E6 !important;
2376
+ color: #767880 !important;
2377
+ border: none !important;
2238
2378
  cursor: not-allowed !important;
2239
2379
  box-shadow: none !important;
2240
2380
  }
2241
2381
  .calendar-custom-cell .ant-picker-cell-disabled:hover .ant-picker-cell-inner {
2242
2382
  background-color: #F5F5F5 !important;
2243
- border-color: #E4E5E6 !important;
2383
+ border: none !important;
2244
2384
  box-shadow: none !important;
2245
2385
  }
2246
2386
  .calendar-custom-cell .ant-picker-cell-disabled::before {
@@ -2280,7 +2420,7 @@ var DateTimePicker = ({
2280
2420
  className: `ant-picker-cell-inner ${isSelected ? "ant-picker-cell-inner-selected" : ""} ${isToday ? "ant-picker-cell-inner-today" : ""}`,
2281
2421
  style: {
2282
2422
  backgroundColor: isSelected ? "#3ADB67" : void 0,
2283
- color: isSelected ? "white" : isDisabled ? "#BDBDBD" : void 0,
2423
+ color: isSelected ? "#080A0F" : isDisabled ? "#767880" : void 0,
2284
2424
  borderColor: isSelected ? "#3ADB67" : isToday ? "#3ADB67" : void 0
2285
2425
  },
2286
2426
  children: /* @__PURE__ */ jsx("div", { className: "ant-picker-calendar-date-value", children: date.date() })
@@ -2298,7 +2438,7 @@ var DateTimePicker = ({
2298
2438
  label,
2299
2439
  value: index
2300
2440
  }));
2301
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [
2441
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between py-3 l:pb-[0px]", children: [
2302
2442
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
2303
2443
  /* @__PURE__ */ jsx(
2304
2444
  Select,
@@ -2310,14 +2450,15 @@ var DateTimePicker = ({
2310
2450
  onChange(now);
2311
2451
  },
2312
2452
  variant: "borderless",
2313
- className: "text-2xl font-medium",
2453
+ className: "text-[32px] l:text-[20px] font-bold",
2314
2454
  popupMatchSelectWidth: false,
2455
+ suffixIcon: null,
2315
2456
  style: {
2316
- fontSize: "24px",
2317
- fontWeight: 500
2457
+ fontWeight: 700
2318
2458
  }
2319
2459
  }
2320
2460
  ),
2461
+ /* @__PURE__ */ jsx("div", { className: "text-[20px] text-[#E4E5E6]", children: "/" }),
2321
2462
  /* @__PURE__ */ jsx(
2322
2463
  Select,
2323
2464
  {
@@ -2328,11 +2469,11 @@ var DateTimePicker = ({
2328
2469
  onChange(now);
2329
2470
  },
2330
2471
  variant: "borderless",
2331
- className: "text-2xl font-medium",
2472
+ className: "text-[32px] l:text-[20px] font-bold",
2332
2473
  popupMatchSelectWidth: false,
2474
+ suffixIcon: null,
2333
2475
  style: {
2334
- fontSize: "24px",
2335
- fontWeight: 500
2476
+ fontWeight: 700
2336
2477
  }
2337
2478
  }
2338
2479
  )
@@ -2408,10 +2549,10 @@ var DateTimePicker = ({
2408
2549
  )
2409
2550
  }
2410
2551
  ),
2411
- /* @__PURE__ */ jsxs("div", { className: "bg-white p-[24px] rounded-[12px] flex-1", children: [
2412
- /* @__PURE__ */ jsxs("div", { className: "flex justify-between", children: [
2413
- pageData.timeSlot,
2414
- /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
2552
+ /* @__PURE__ */ jsxs("div", { className: "bg-white p-[24px] rounded-[16px] flex-1", children: [
2553
+ /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center", children: [
2554
+ /* @__PURE__ */ jsx("div", { className: "text-[24px] l:text-[16px]", children: pageData.timeSlot }),
2555
+ /* @__PURE__ */ jsxs("div", { className: "flex text-[18px] l:text-[14px] l:gap-1 gap-2", children: [
2415
2556
  /* @__PURE__ */ jsx(
2416
2557
  "button",
2417
2558
  {
@@ -2425,7 +2566,7 @@ var DateTimePicker = ({
2425
2566
  }
2426
2567
  },
2427
2568
  disabled: !selectedDate || selectedDate.isSame(dayjs(), "day") || selectedDate.isBefore(dayjs(), "day"),
2428
- className: "w-10 h-10 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2569
+ className: "w-8 h-8 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2429
2570
  children: /* @__PURE__ */ jsx(
2430
2571
  "svg",
2431
2572
  {
@@ -2445,7 +2586,7 @@ var DateTimePicker = ({
2445
2586
  )
2446
2587
  }
2447
2588
  ),
2448
- /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: selectedDate ? selectedDate.format("MMMM D, YYYY") : "" }),
2589
+ /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: selectedDate ? selectedDate.format("MMMM D") : "" }),
2449
2590
  /* @__PURE__ */ jsx(
2450
2591
  "button",
2451
2592
  {
@@ -2457,7 +2598,7 @@ var DateTimePicker = ({
2457
2598
  }
2458
2599
  },
2459
2600
  disabled: !selectedDate,
2460
- className: "w-10 h-10 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2601
+ className: "w-8 h-8 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2461
2602
  children: /* @__PURE__ */ jsx(
2462
2603
  "svg",
2463
2604
  {
@@ -2479,7 +2620,7 @@ var DateTimePicker = ({
2479
2620
  )
2480
2621
  ] })
2481
2622
  ] }),
2482
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 mt-[40px] gap-4", children: timeslotsLoading ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.loadingTimeSlots }) : timeslotsError ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-red-600 py-8", children: pageData.failedToLoadTimeSlots }) : dayTimeslots.length === 0 ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.noAvailableTimeSlots }) : dayTimeslots.map((slot) => {
2623
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 mt-[40px] gap-4 l:mt-[16px] l:flex l:flex-col l:gap-2", children: timeslotsLoading ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.loadingTimeSlots }) : timeslotsError ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-red-600 py-8", children: pageData.failedToLoadTimeSlots }) : dayTimeslots.length === 0 ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.noAvailableTimeSlots }) : dayTimeslots.map((slot) => {
2483
2624
  const isAvailable = slot.status === "available";
2484
2625
  const isFull = slot.status === "full";
2485
2626
  const isSelected = selectedTimeslotId === slot.id;
@@ -2493,19 +2634,19 @@ var DateTimePicker = ({
2493
2634
  }
2494
2635
  },
2495
2636
  className: `
2496
- rounded-[20px] w-full flex items-center justify-center gap-4 h-[76px]
2637
+ rounded-[20px] w-full text-[18px] l:gap-2 l:text-[16px] flex items-center justify-center gap-4 h-[76px]
2497
2638
  border text-center transition-colors
2498
- ${isSelected ? "border-[#3ADB67] bg-[#3ADB67] text-white cursor-pointer" : isAvailable ? "border-[#E4E5E6] hover:border-[#3ADB67] hover:bg-[#3ADB67] cursor-pointer" : "border-[#E4E5E6] bg-[#F5F5F5] text-[#BDBDBD] cursor-not-allowed"}
2639
+ ${isSelected ? "border-[#3ADB67] bg-[#3ADB67] cursor-pointer" : isAvailable ? "border-[#E4E5E6] hover:border-[#3ADB67] hover:bg-[#3ADB67] cursor-pointer" : "border-[#E4E5E6] bg-[#F5F5F5] text-[#767880] cursor-not-allowed"}
2499
2640
  `,
2500
2641
  children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
2501
2642
  /* @__PURE__ */ jsx("div", { children: formatTimeslot(slot) }),
2502
- isFull && /* @__PURE__ */ jsx("div", { className: "text-xs text-[#BDBDBD] mt-1", children: pageData.full }),
2503
- isAvailable && !isSelected && /* @__PURE__ */ jsxs("div", { className: "text-xs text-[#767880] mt-1", children: [
2643
+ isFull && /* @__PURE__ */ jsx("div", { className: "text-[16px] l:text-[14px] text-[#767880] mt-[2px]", children: pageData.full }),
2644
+ isAvailable && !isSelected && /* @__PURE__ */ jsxs("div", { className: "text-[16px] l:text-[14px] text-[#767880] mt-1", children: [
2504
2645
  slot.capacity - slot.booked_count,
2505
2646
  " ",
2506
2647
  pageData.spotsLeft
2507
2648
  ] }),
2508
- isAvailable && isSelected && /* @__PURE__ */ jsxs("div", { className: "text-xs text-white mt-1", children: [
2649
+ isAvailable && isSelected && /* @__PURE__ */ jsxs("div", { className: "text-[16px] l:text-[14px] mt-1", children: [
2509
2650
  slot.capacity - slot.booked_count,
2510
2651
  " ",
2511
2652
  pageData.spotsLeft
@@ -2515,14 +2656,14 @@ var DateTimePicker = ({
2515
2656
  slot.id
2516
2657
  );
2517
2658
  }) }),
2518
- !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsx("div", { className: "py-4 text-right", children: pageData?.timezone?.replace(
2659
+ !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsx("div", { className: "pt-[24px] text-[#6d6d6F] text-center", children: pageData?.timezone?.replace(
2519
2660
  "{{timezone}}",
2520
2661
  demoRoom?.timezone || timezone || ""
2521
2662
  ) })
2522
2663
  ] })
2523
2664
  ] }),
2524
2665
  /* @__PURE__ */ jsxs("div", { className: "mt-12", children: [
2525
- !!questionnaire?.questions?.length && /* @__PURE__ */ jsx("div", { className: "text-[48px] font-bold text-center mb-8", children: pageData.fillOutForm }),
2666
+ !!questionnaire?.questions?.length && /* @__PURE__ */ jsx("div", { className: "text-[48px] font-bold text-center mb-8 l:mb-[24px] l:text-[32px] l:text-left", children: pageData.fillOutForm }),
2526
2667
  questionnaireLoading ? /* @__PURE__ */ jsx("div", { className: "text-center text-[#767880] py-8", children: pageData.loadingQuestionnaire }) : /* @__PURE__ */ jsx(
2527
2668
  QuestionnaireForm,
2528
2669
  {
@@ -2531,6 +2672,9 @@ var DateTimePicker = ({
2531
2672
  pageData,
2532
2673
  selectedTimeslotId,
2533
2674
  onSubmit: async (responses) => {
2675
+ if (onQuestionnaireSubmit) {
2676
+ await onQuestionnaireSubmit(responses);
2677
+ }
2534
2678
  try {
2535
2679
  const customerName = responses.name || responses.customer_name || "";
2536
2680
  const customerEmail = responses.email || responses.customer_email || "";
@@ -2561,61 +2705,6 @@ var DateTimePicker = ({
2561
2705
  ] });
2562
2706
  };
2563
2707
  var DateTimePicker_default = DateTimePicker;
2564
- var Navigation;
2565
- var Pagination;
2566
- var Autoplay;
2567
- var swiperVersion = "11+";
2568
- try {
2569
- const modules = __require("swiper/modules");
2570
- Navigation = modules.Navigation;
2571
- Pagination = modules.Pagination;
2572
- Autoplay = modules.Autoplay;
2573
- swiperVersion = "11+";
2574
- } catch (e) {
2575
- try {
2576
- const SwiperCore = __require("swiper");
2577
- const SwiperNavigation = __require("swiper/modules/navigation");
2578
- const SwiperPagination = __require("swiper/modules/pagination");
2579
- const SwiperAutoplay = __require("swiper/modules/autoplay");
2580
- const SwiperClass = SwiperCore.default || SwiperCore;
2581
- if (SwiperClass && SwiperClass.use) {
2582
- SwiperClass.use([
2583
- SwiperNavigation.default || SwiperNavigation,
2584
- SwiperPagination.default || SwiperPagination,
2585
- SwiperAutoplay.default || SwiperAutoplay
2586
- ]);
2587
- }
2588
- Navigation = SwiperNavigation.default || SwiperNavigation;
2589
- Pagination = SwiperPagination.default || SwiperPagination;
2590
- Autoplay = SwiperAutoplay.default || SwiperAutoplay;
2591
- swiperVersion = "8";
2592
- } catch (e2) {
2593
- console.warn("Failed to load swiper modules:", e2);
2594
- }
2595
- }
2596
- if (typeof window !== "undefined") {
2597
- try {
2598
- __require("swiper/css");
2599
- __require("swiper/css/navigation");
2600
- __require("swiper/css/pagination");
2601
- } catch (e) {
2602
- try {
2603
- __require("swiper/swiper.min.css");
2604
- __require("swiper/modules/navigation/navigation.min.css");
2605
- __require("swiper/modules/pagination/pagination.min.css");
2606
- } catch (e2) {
2607
- console.warn("Failed to load swiper styles");
2608
- }
2609
- }
2610
- }
2611
- var defaultDescriptions = [
2612
- "Norem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet odio mattis.",
2613
- "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos."
2614
- ];
2615
- var defaultImages = [
2616
- "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638",
2617
- "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638"
2618
- ];
2619
2708
  var DemoRoomDetail = ({
2620
2709
  apiClient,
2621
2710
  demoRoomCode,
@@ -2642,20 +2731,21 @@ var DemoRoomDetail = ({
2642
2731
  } = useDemoRoom(apiClient, demoRoomCode || "", locale, {
2643
2732
  enabled: !!apiClient && !!demoRoomCode
2644
2733
  });
2645
- const title = demoRoom?.name || titleProp || "Design District Demo Room";
2646
- const descriptions = demoRoom?.description ? [demoRoom.description] : descriptionsProp || defaultDescriptions;
2647
- const devices = demoRoom?.description || devicesProp || "eufyMake E1, eufyMake M5";
2648
- const address = demoRoom?.address || addressProp || "1111 8th St, San Francisco, CA United States 94108";
2649
- const images = demoRoom?.images && demoRoom.images.length > 0 ? demoRoom.images : imagesProp || defaultImages;
2734
+ const title = demoRoom?.name || titleProp || "";
2735
+ const descriptions = demoRoom?.description ? [demoRoom.description] : descriptionsProp;
2736
+ const devices = demoRoom?.equipment?.join(", ") || devicesProp || "";
2737
+ const address = demoRoom?.address || addressProp || "";
2738
+ const images = demoRoom?.images && demoRoom.images.length > 0 ? demoRoom.images : imagesProp || [];
2650
2739
  const googleMapsLink = mapsLink || (() => {
2651
2740
  if (demoRoom?.latitude && demoRoom?.longitude) {
2652
2741
  return `https://www.google.com/maps/search/?api=1&query=${demoRoom.latitude},${demoRoom.longitude}`;
2653
- } else {
2742
+ } else if (address) {
2654
2743
  return `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(address)}`;
2655
2744
  }
2745
+ return "#";
2656
2746
  })();
2657
2747
  if (loading && apiClient && demoRoomCode) {
2658
- return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-8 items-start", children: [
2748
+ return /* @__PURE__ */ jsx("div", { className: cn("w-full pb-4", className), ...props, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-8 items-start", children: [
2659
2749
  /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
2660
2750
  /* @__PURE__ */ jsx("div", { className: "h-12 bg-gray-200 rounded animate-pulse" }),
2661
2751
  /* @__PURE__ */ jsx("div", { className: "h-24 bg-gray-200 rounded animate-pulse" }),
@@ -2670,10 +2760,13 @@ var DemoRoomDetail = ({
2670
2760
  /* @__PURE__ */ jsx("p", { className: "text-sm mt-2", children: error.message })
2671
2761
  ] }) });
2672
2762
  }
2673
- return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-8 l:flex l:flex-col items-start py-[24px]", children: [
2674
- /* @__PURE__ */ jsxs("div", { className: "space-y-6 py-[24px]", children: [
2675
- /* @__PURE__ */ jsx("h1", { className: "text-[40px] font-bold text-gray-900 leading-tight", children: title }),
2676
- /* @__PURE__ */ jsx("div", { className: "space-y-4", children: descriptions.map((desc, index) => /* @__PURE__ */ jsx(
2763
+ return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxs("div", { className: cn(
2764
+ "gap-[80px] l:gap-[40px] l:flex l:flex-col-reverse items-start py-[24px] l:pb-[64px]",
2765
+ images.length > 0 ? "grid grid-cols-2" : "flex"
2766
+ ), children: [
2767
+ /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
2768
+ /* @__PURE__ */ jsx("h1", { className: "text-[48px] l:text-[32px] font-bold text-gray-900 leading-tight", children: title }),
2769
+ /* @__PURE__ */ jsx("div", { className: "mt-[20px]", children: descriptions?.map((desc, index) => /* @__PURE__ */ jsx(
2677
2770
  "p",
2678
2771
  {
2679
2772
  className: "text-base text-gray-600 leading-relaxed",
@@ -2692,34 +2785,24 @@ var DemoRoomDetail = ({
2692
2785
  xmlns: "http://www.w3.org/2000/svg",
2693
2786
  className: "flex-shrink-0 mt-0.5",
2694
2787
  children: [
2695
- /* @__PURE__ */ jsx(
2696
- "rect",
2697
- {
2698
- x: "3",
2699
- y: "3",
2700
- width: "18",
2701
- height: "18",
2702
- rx: "2",
2703
- stroke: "currentColor",
2704
- strokeWidth: "2"
2705
- }
2706
- ),
2707
2788
  /* @__PURE__ */ jsx(
2708
2789
  "path",
2709
2790
  {
2710
- d: "M8 10H16",
2791
+ d: "M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z",
2711
2792
  stroke: "currentColor",
2712
2793
  strokeWidth: "2",
2713
- strokeLinecap: "round"
2794
+ strokeLinecap: "round",
2795
+ strokeLinejoin: "round"
2714
2796
  }
2715
2797
  ),
2716
2798
  /* @__PURE__ */ jsx(
2717
2799
  "path",
2718
2800
  {
2719
- d: "M8 14H16",
2801
+ d: "M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325",
2720
2802
  stroke: "currentColor",
2721
2803
  strokeWidth: "2",
2722
- strokeLinecap: "round"
2804
+ strokeLinecap: "round",
2805
+ strokeLinejoin: "round"
2723
2806
  }
2724
2807
  )
2725
2808
  ]
@@ -2798,67 +2881,62 @@ var DemoRoomDetail = ({
2798
2881
  ] })
2799
2882
  ] })
2800
2883
  ] }),
2801
- /* @__PURE__ */ jsx("div", { className: "relative l:w-full h-[400px] rounded-2xl overflow-hidden", children: images.length > 0 ? /* @__PURE__ */ jsx(
2802
- Swiper,
2803
- {
2804
- ...swiperVersion === "11+" && Navigation && Pagination && Autoplay ? { modules: [Navigation, Pagination, Autoplay] } : {},
2805
- spaceBetween: 0,
2806
- slidesPerView: 1,
2807
- navigation: true,
2808
- pagination: { clickable: true },
2809
- autoplay: {
2810
- delay: 3e3,
2811
- disableOnInteraction: false
2812
- },
2813
- loop: true,
2814
- className: "h-full rounded-2xl",
2815
- children: images.map((img, index) => /* @__PURE__ */ jsx(SwiperSlide, { children: /* @__PURE__ */ jsx("div", { className: "relative w-full h-full bg-gray-100", children: /* @__PURE__ */ jsx(
2816
- "img",
2817
- {
2818
- src: img,
2819
- alt: `Demo room view ${index + 1}`,
2820
- className: "w-full h-full object-cover"
2821
- }
2822
- ) }) }, index))
2823
- }
2824
- ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full bg-gradient-to-br from-gray-100 to-gray-200 flex items-center justify-center rounded-2xl", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
2825
- /* @__PURE__ */ jsx("div", { className: "w-16 h-16 mx-auto mb-3 rounded-full bg-white flex items-center justify-center", children: /* @__PURE__ */ jsxs(
2826
- "svg",
2827
- {
2828
- width: "32",
2829
- height: "32",
2830
- viewBox: "0 0 32 32",
2831
- fill: "none",
2832
- xmlns: "http://www.w3.org/2000/svg",
2833
- children: [
2834
- /* @__PURE__ */ jsx(
2835
- "rect",
2836
- {
2837
- x: "4",
2838
- y: "8",
2839
- width: "24",
2840
- height: "16",
2841
- rx: "2",
2842
- stroke: "currentColor",
2843
- strokeWidth: "2"
2884
+ images.length > 0 && /* @__PURE__ */ jsxs("div", { className: "relative l:w-full min-l:h-[400px] rounded-2xl overflow-hidden demo-room-swiper", children: [
2885
+ /* @__PURE__ */ jsx("style", { children: `
2886
+ .demo-room-swiper .swiper-pagination-bullet {
2887
+ background-color: rgba(255, 255, 255, 0.5);
2844
2888
  }
2845
- ),
2846
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "14", r: "2", fill: "currentColor" }),
2847
- /* @__PURE__ */ jsx(
2848
- "path",
2849
- {
2850
- d: "M28 20L22 14L16 20",
2851
- stroke: "currentColor",
2852
- strokeWidth: "2",
2853
- strokeLinecap: "round",
2854
- strokeLinejoin: "round"
2889
+ .demo-room-swiper .swiper-pagination-bullet-active {
2890
+ background-color: #3ADB67 !important;
2855
2891
  }
2856
- )
2857
- ]
2892
+ .demo-room-swiper .swiper-button-prev,
2893
+ .demo-room-swiper .swiper-button-next {
2894
+ width: 48px !important;
2895
+ height: 48px !important;
2896
+ background-size: contain !important;
2897
+ background-repeat: no-repeat !important;
2898
+ background-position: center !important;
2899
+ color: transparent !important;
2900
+ }
2901
+ .demo-room-swiper .swiper-button-prev::after,
2902
+ .demo-room-swiper .swiper-button-next::after {
2903
+ display: none !important;
2904
+ content: '' !important;
2905
+ }
2906
+ .demo-room-swiper .swiper-button-prev {
2907
+ background-image: url('https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Group_2121235586_572f0715-aa60-4188-9591-248f6ac53f40.svg?v=1736951731') !important;
2908
+ left: 16px !important;
2909
+ }
2910
+ .demo-room-swiper .swiper-button-next {
2911
+ background-image: url('https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Group_2121235583_3071dda3-e1ee-4fb8-b488-2402c8ea8018.svg?v=1736951731') !important;
2912
+ right: 16px !important;
2913
+ }
2914
+ ` }),
2915
+ /* @__PURE__ */ jsx(
2916
+ Swiper,
2917
+ {
2918
+ modules: [Navigation, Pagination, Autoplay],
2919
+ spaceBetween: 0,
2920
+ slidesPerView: 1,
2921
+ navigation: images.length > 1,
2922
+ pagination: images.length > 1 ? { clickable: true } : false,
2923
+ autoplay: images.length > 1 ? {
2924
+ delay: 3e3,
2925
+ disableOnInteraction: false
2926
+ } : false,
2927
+ loop: images.length > 1,
2928
+ className: "h-full rounded-2xl",
2929
+ children: images.map((img, index) => /* @__PURE__ */ jsx(SwiperSlide, { children: /* @__PURE__ */ jsx("div", { className: "relative w-full h-full bg-gray-100", children: /* @__PURE__ */ jsx(
2930
+ "img",
2931
+ {
2932
+ src: img,
2933
+ alt: `Demo room view ${index + 1}`,
2934
+ className: "w-full h-full object-cover"
2935
+ }
2936
+ ) }) }, index))
2858
2937
  }
2859
- ) }),
2860
- /* @__PURE__ */ jsx("p", { className: "text-gray-500 text-sm", children: pageData.demoRoomImages })
2861
- ] }) }) })
2938
+ )
2939
+ ] })
2862
2940
  ] }) });
2863
2941
  };
2864
2942
  DemoRoomDetail.displayName = "DemoRoomDetail";
@@ -2870,21 +2948,25 @@ var BookingForm = ({
2870
2948
  pageData,
2871
2949
  timezone,
2872
2950
  handleBookingSuccess,
2951
+ onQuestionnaireSubmit,
2873
2952
  ...props
2874
2953
  }) => {
2875
2954
  const apiClient = useMemo(
2876
2955
  () => createDemoRoomApi(apiConfig),
2877
2956
  [apiConfig]
2878
2957
  );
2879
- const dateTimePickerPageData = useMemo(() => ({
2880
- ...pageData?.dateTimePicker,
2881
- ...pageData?.questionnaireForm
2882
- }), [pageData?.dateTimePicker, pageData?.questionnaireForm]);
2958
+ const dateTimePickerPageData = useMemo(
2959
+ () => ({
2960
+ ...pageData?.dateTimePicker,
2961
+ ...pageData?.questionnaireForm
2962
+ }),
2963
+ [pageData?.dateTimePicker, pageData?.questionnaireForm]
2964
+ );
2883
2965
  return /* @__PURE__ */ jsxs("div", { children: [
2884
2966
  /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsx(
2885
2967
  DemoRoomDetail,
2886
2968
  {
2887
- className: cn("mt-8", layoutClassName),
2969
+ className: cn("min-l:mt-8", layoutClassName),
2888
2970
  apiClient,
2889
2971
  demoRoomCode,
2890
2972
  locale: apiConfig.locale,
@@ -2899,6 +2981,7 @@ var BookingForm = ({
2899
2981
  timezone,
2900
2982
  locale: apiConfig.locale,
2901
2983
  onBookingSuccess: handleBookingSuccess,
2984
+ onQuestionnaireSubmit,
2902
2985
  pageData: dateTimePickerPageData
2903
2986
  }
2904
2987
  ) }) })
@@ -2962,7 +3045,9 @@ var BookingSuccess = ({
2962
3045
  }, [token, apiConfig, initialBookingData]);
2963
3046
  const handleCancelAppointment = async () => {
2964
3047
  if (!token || !apiConfig) {
2965
- setCancelError(pageData.cancelError || "Unable to cancel: Missing token or API configuration");
3048
+ setCancelError(
3049
+ pageData.cancelError || "Unable to cancel: Missing token or API configuration"
3050
+ );
2966
3051
  return;
2967
3052
  }
2968
3053
  setCancelLoading(true);
@@ -2983,13 +3068,15 @@ var BookingSuccess = ({
2983
3068
  }
2984
3069
  } catch (err) {
2985
3070
  console.error("Failed to cancel booking:", err);
2986
- setCancelError(pageData.cancelError || "Failed to cancel appointment. Please try again.");
3071
+ setCancelError(
3072
+ pageData.cancelError || "Failed to cancel appointment. Please try again."
3073
+ );
2987
3074
  } finally {
2988
3075
  setCancelLoading(false);
2989
3076
  }
2990
3077
  };
2991
3078
  if (loading) {
2992
- return /* @__PURE__ */ jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsx("div", { className: "max-w-3xl mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "animate-pulse space-y-6", children: [
3079
+ return /* @__PURE__ */ jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsx("div", { className: "mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "animate-pulse space-y-6", children: [
2993
3080
  /* @__PURE__ */ jsx("div", { className: "h-8 bg-gray-200 rounded w-1/3" }),
2994
3081
  /* @__PURE__ */ jsx("div", { className: "h-24 bg-gray-200 rounded" }),
2995
3082
  /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
@@ -3002,24 +3089,24 @@ var BookingSuccess = ({
3002
3089
  if (!bookingData) {
3003
3090
  return null;
3004
3091
  }
3005
- return /* @__PURE__ */ jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxs("div", { className: "max-w-3xl mx-auto", children: [
3092
+ return /* @__PURE__ */ jsx("div", { className: `min-h-screen l:py-0 l:px-0 py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxs("div", { className: "mx-auto", children: [
3006
3093
  /* @__PURE__ */ jsx("h1", { className: "text-[40px] font-bold text-gray-900 mb-8", children: pageData.yourAppointment }),
3007
- isCancelled && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg p-6 mb-8 flex items-center justify-between", children: [
3094
+ isCancelled && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-[16px] l:items-start p-6 mb-4 l:gap-2 flex l:flex-col items-center justify-between", children: [
3008
3095
  /* @__PURE__ */ jsx("p", { className: "text-base text-gray-700", children: pageData.appointmentCanceled }),
3009
- onScheduleAgain && /* @__PURE__ */ jsx(
3096
+ onScheduleAgain && bookingData && /* @__PURE__ */ jsx(
3010
3097
  "button",
3011
3098
  {
3012
- onClick: onScheduleAgain,
3013
- className: "px-6 py-3 bg-black text-white rounded-full font-medium hover:bg-gray-800 transition-colors whitespace-nowrap",
3099
+ onClick: () => onScheduleAgain(bookingData.demoroom_code),
3100
+ className: "px-6 py-3 bg-black text-white rounded-full hover:bg-gray-800 transition-colors whitespace-nowrap",
3014
3101
  children: pageData.scheduleAgain
3015
3102
  }
3016
3103
  )
3017
3104
  ] }),
3018
- /* @__PURE__ */ jsxs("div", { className: "space-y-8 bg-white px-[48px] py-[32px] rounded-lg", children: [
3105
+ /* @__PURE__ */ jsxs("div", { className: "space-y-8 bg-white px-[48px] l:px-[16px] l:py-[16px] py-[32px] rounded-[16px]", children: [
3019
3106
  /* @__PURE__ */ jsxs("div", { children: [
3020
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.location }),
3107
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.location }),
3021
3108
  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
3022
- bookingData.demoroom_name && /* @__PURE__ */ jsx("p", { className: "text-base font-medium text-gray-900", children: bookingData.demoroom_name }),
3109
+ bookingData.demoroom_name && /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.demoroom_name }),
3023
3110
  bookingData.address && /* @__PURE__ */ jsx("p", { className: "text-base text-gray-600", children: bookingData.address }),
3024
3111
  bookingData.latitude && bookingData.longitude && /* @__PURE__ */ jsx(
3025
3112
  "a",
@@ -3034,7 +3121,7 @@ var BookingSuccess = ({
3034
3121
  ] })
3035
3122
  ] }),
3036
3123
  /* @__PURE__ */ jsxs("div", { children: [
3037
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.dateAndTime }),
3124
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.dateAndTime }),
3038
3125
  /* @__PURE__ */ jsxs("p", { className: "text-base text-gray-900", children: [
3039
3126
  bookingData.booking_date,
3040
3127
  bookingData.time_slot && `, ${bookingData.time_slot}`,
@@ -3042,15 +3129,15 @@ var BookingSuccess = ({
3042
3129
  ] })
3043
3130
  ] }),
3044
3131
  bookingData.equipment && /* @__PURE__ */ jsxs("div", { children: [
3045
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.event }),
3046
- /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.equipment })
3132
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.event }),
3133
+ /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: Array.isArray(bookingData.equipment) ? bookingData.equipment.join(", ") : bookingData.equipment })
3047
3134
  ] }),
3048
3135
  /* @__PURE__ */ jsxs("div", { children: [
3049
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.demoRoom }),
3136
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.demoRoom }),
3050
3137
  /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.demoroom_code })
3051
3138
  ] }),
3052
3139
  /* @__PURE__ */ jsxs("div", { children: [
3053
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.visitorInfo }),
3140
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.visitorInfo }),
3054
3141
  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
3055
3142
  /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.customer_name }),
3056
3143
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-base text-gray-600", children: [
@@ -3108,13 +3195,13 @@ var BookingSuccess = ({
3108
3195
  {
3109
3196
  onClick: () => setShowCancelDialog(true),
3110
3197
  disabled: cancelLoading,
3111
- className: "text-[14px] cursor-pointer w-fit rounded-full text-[#080A0F] border border-[#080A0F] px-[20px] py-[10px] leading-[1] hover:bg-gray-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
3198
+ className: "text-[14px] cursor-pointer w-fit rounded-full text-[#080A0F] border-2 border-[#080A0F] px-[20px] py-[10px] leading-[1] hover:bg-gray-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
3112
3199
  children: pageData.cancelAppointment
3113
3200
  }
3114
3201
  ),
3115
3202
  cancelError && /* @__PURE__ */ jsx("p", { className: "text-sm mt-2", style: { color: "#FF4D4D" }, children: cancelError })
3116
3203
  ] }),
3117
- showCancelDialog && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 px-4", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-[24px] max-w-[400px] p-8 shadow-xl relative", children: [
3204
+ showCancelDialog && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 px-4", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-[24px] max-w-[600px] p-8 shadow-xl relative", children: [
3118
3205
  /* @__PURE__ */ jsx(
3119
3206
  "button",
3120
3207
  {
@@ -3144,28 +3231,28 @@ var BookingSuccess = ({
3144
3231
  )
3145
3232
  }
3146
3233
  ),
3147
- /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsx("div", { className: "w-16 h-16 rounded-full bg-[#F59E0B] flex items-center justify-center", children: /* @__PURE__ */ jsx(
3234
+ /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsx("div", { className: "w-16 h-16 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxs(
3148
3235
  "svg",
3149
3236
  {
3150
- width: "32",
3151
- height: "32",
3152
- viewBox: "0 0 32 32",
3153
- fill: "none",
3154
3237
  xmlns: "http://www.w3.org/2000/svg",
3155
- children: /* @__PURE__ */ jsx(
3156
- "path",
3157
- {
3158
- d: "M16 10V17M16 22H16.01",
3159
- stroke: "white",
3160
- strokeWidth: "3",
3161
- strokeLinecap: "round",
3162
- strokeLinejoin: "round"
3163
- }
3164
- )
3238
+ width: "48",
3239
+ height: "48",
3240
+ viewBox: "0 0 48 48",
3241
+ fill: "none",
3242
+ children: [
3243
+ /* @__PURE__ */ jsx("circle", { cx: "24", cy: "24", r: "21", fill: "#FFC24D" }),
3244
+ /* @__PURE__ */ jsx(
3245
+ "path",
3246
+ {
3247
+ d: "M23.9971 30.5703C25.4881 30.5704 26.6972 31.7795 26.6973 33.2705C26.6973 34.7616 25.4881 35.9706 23.9971 35.9707C22.5059 35.9707 21.2969 34.7617 21.2969 33.2705C21.297 31.7794 22.506 30.5703 23.9971 30.5703ZM23.9961 12.0176C25.2387 12.0176 26.2461 13.0249 26.2461 14.2676V26.2676C26.2461 27.5102 25.2387 28.5176 23.9961 28.5176C22.7535 28.5176 21.7461 27.5102 21.7461 26.2676V14.2676C21.7461 13.0249 22.7535 12.0176 23.9961 12.0176Z",
3248
+ fill: "white"
3249
+ }
3250
+ )
3251
+ ]
3165
3252
  }
3166
3253
  ) }) }),
3167
3254
  /* @__PURE__ */ jsxs("div", { className: "text-center mb-8", children: [
3168
- /* @__PURE__ */ jsx("h3", { className: "text-[18px] font-semibold text-gray-900 mb-2", children: pageData.cancelDialog?.title }),
3255
+ /* @__PURE__ */ jsx("h3", { className: "text-[18px] text-gray-900 mb-2", children: pageData.cancelDialog?.title }),
3169
3256
  /* @__PURE__ */ jsx("p", { className: "text-[14px] text-gray-600", children: pageData.cancelDialog?.description })
3170
3257
  ] }),
3171
3258
  /* @__PURE__ */ jsxs("div", { className: "flex gap-3 justify-center", children: [
@@ -3174,7 +3261,7 @@ var BookingSuccess = ({
3174
3261
  {
3175
3262
  onClick: () => setShowCancelDialog(false),
3176
3263
  disabled: cancelLoading,
3177
- className: "px-8 py-3 border-2 border-black rounded-full text-black font-medium hover:bg-gray-50 transition-colors disabled:opacity-50 min-w-[120px]",
3264
+ className: "px-8 py-3 border-2 border-black rounded-full text-black hover:bg-gray-50 transition-colors disabled:opacity-50 min-w-[120px]",
3178
3265
  children: pageData.cancelDialog?.backButton
3179
3266
  }
3180
3267
  ),
@@ -3183,7 +3270,7 @@ var BookingSuccess = ({
3183
3270
  {
3184
3271
  onClick: handleCancelAppointment,
3185
3272
  disabled: cancelLoading,
3186
- className: "px-8 py-3 bg-black text-white rounded-full font-medium hover:bg-gray-800 transition-colors disabled:opacity-50 flex items-center gap-2 min-w-[180px] justify-center",
3273
+ className: "px-8 py-3 bg-black text-white rounded-full hover:bg-gray-800 transition-colors disabled:opacity-50 flex items-center gap-2 min-w-[180px] justify-center",
3187
3274
  children: cancelLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
3188
3275
  /* @__PURE__ */ jsxs(
3189
3276
  "svg",