@anker-in/ui 0.2.1 → 0.2.2
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/demo-room.js +23 -1
- package/dist/demo-room.js.map +1 -1
- package/dist/demo-room.mjs +20 -1
- package/dist/demo-room.mjs.map +1 -1
- package/dist/index.js +63 -47
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +60 -44
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -6,14 +6,14 @@ import IndexBar from 'antd-mobile/es/components/index-bar';
|
|
|
6
6
|
import List from 'antd-mobile/es/components/list';
|
|
7
7
|
import 'antd-mobile/es/components/index-bar/index-bar.css';
|
|
8
8
|
import 'antd-mobile/es/components/list/list.css';
|
|
9
|
-
import
|
|
9
|
+
import dayjs2 from 'dayjs';
|
|
10
|
+
import utc from 'dayjs/plugin/utc';
|
|
11
|
+
import timezone from 'dayjs/plugin/timezone';
|
|
10
12
|
import 'dayjs/locale/zh-cn';
|
|
11
13
|
import { theme, ConfigProvider, Calendar, Select } from 'antd';
|
|
12
14
|
import dayLocaleData from 'dayjs/plugin/localeData';
|
|
13
15
|
import weekday from 'dayjs/plugin/weekday';
|
|
14
16
|
import weekOfYear from 'dayjs/plugin/weekOfYear';
|
|
15
|
-
import timezone from 'dayjs/plugin/timezone';
|
|
16
|
-
import utc from 'dayjs/plugin/utc';
|
|
17
17
|
|
|
18
18
|
function cn(...inputs) {
|
|
19
19
|
return twMerge(clsx(inputs));
|
|
@@ -1103,6 +1103,8 @@ var LocationFilter = ({
|
|
|
1103
1103
|
);
|
|
1104
1104
|
};
|
|
1105
1105
|
LocationFilter.displayName = "LocationFilter";
|
|
1106
|
+
dayjs2.extend(utc);
|
|
1107
|
+
dayjs2.extend(timezone);
|
|
1106
1108
|
var defaultPageData = {
|
|
1107
1109
|
title: "Find a Studio Near You",
|
|
1108
1110
|
loadingText: "Loading demo rooms...",
|
|
@@ -1282,6 +1284,20 @@ var RoomsList = ({
|
|
|
1282
1284
|
const city = room.location?.city || "";
|
|
1283
1285
|
const addressParts = [room.address, city, state, country].filter(Boolean);
|
|
1284
1286
|
const fullAddress = addressParts.join(", ");
|
|
1287
|
+
let formattedTime = mergedPageData.noAvailableTime;
|
|
1288
|
+
if (nextAvailableTimeslot) {
|
|
1289
|
+
try {
|
|
1290
|
+
const timeInZone = dayjs2(nextAvailableTimeslot.start_time).tz(
|
|
1291
|
+
room.timezone || "America/Los_Angeles"
|
|
1292
|
+
);
|
|
1293
|
+
const month = timeInZone.format("MMM");
|
|
1294
|
+
const day = timeInZone.format("D");
|
|
1295
|
+
const time = timeInZone.format("h:mm A");
|
|
1296
|
+
formattedTime = `${month}.${day}, ${time}`;
|
|
1297
|
+
} catch (error2) {
|
|
1298
|
+
formattedTime = nextAvailableTimeslot.start_time;
|
|
1299
|
+
}
|
|
1300
|
+
}
|
|
1285
1301
|
return {
|
|
1286
1302
|
id: room.code,
|
|
1287
1303
|
name: room.name,
|
|
@@ -1292,7 +1308,7 @@ var RoomsList = ({
|
|
|
1292
1308
|
country,
|
|
1293
1309
|
lat: Number(room.latitude) || 0,
|
|
1294
1310
|
lng: Number(room.longitude) || 0,
|
|
1295
|
-
availableTime:
|
|
1311
|
+
availableTime: formattedTime,
|
|
1296
1312
|
euifyMakeModel: room?.equipment?.join(", ") || ""
|
|
1297
1313
|
};
|
|
1298
1314
|
});
|
|
@@ -2201,15 +2217,15 @@ var QuestionnaireForm = ({
|
|
|
2201
2217
|
] })
|
|
2202
2218
|
] });
|
|
2203
2219
|
};
|
|
2204
|
-
|
|
2205
|
-
|
|
2206
|
-
|
|
2207
|
-
|
|
2208
|
-
|
|
2220
|
+
dayjs2.extend(dayLocaleData);
|
|
2221
|
+
dayjs2.extend(weekday);
|
|
2222
|
+
dayjs2.extend(weekOfYear);
|
|
2223
|
+
dayjs2.extend(utc);
|
|
2224
|
+
dayjs2.extend(timezone);
|
|
2209
2225
|
var DateTimePicker = ({
|
|
2210
2226
|
apiClient,
|
|
2211
2227
|
demoRoomCode,
|
|
2212
|
-
timezone:
|
|
2228
|
+
timezone: timezone3,
|
|
2213
2229
|
pageData = {
|
|
2214
2230
|
scheduleYourVisit: "Schedule Your Visit",
|
|
2215
2231
|
timeSlot: "Time Slot",
|
|
@@ -2228,7 +2244,7 @@ var DateTimePicker = ({
|
|
|
2228
2244
|
}) => {
|
|
2229
2245
|
const { token } = theme.useToken();
|
|
2230
2246
|
const [selectedDate, setSelectedDate] = useState(null);
|
|
2231
|
-
const [calendarValue, setCalendarValue] = useState(
|
|
2247
|
+
const [calendarValue, setCalendarValue] = useState(dayjs2());
|
|
2232
2248
|
const [selectedTimeslotId, setSelectedTimeslotId] = useState(
|
|
2233
2249
|
null
|
|
2234
2250
|
);
|
|
@@ -2263,47 +2279,47 @@ var DateTimePicker = ({
|
|
|
2263
2279
|
{
|
|
2264
2280
|
start_date: startDate,
|
|
2265
2281
|
end_date: endDate,
|
|
2266
|
-
timezone:
|
|
2282
|
+
timezone: timezone3
|
|
2267
2283
|
},
|
|
2268
2284
|
{ enabled: !!demoRoomCode }
|
|
2269
2285
|
);
|
|
2270
2286
|
const dayTimeslots = useMemo(() => {
|
|
2271
2287
|
if (!timeslotsData?.timeslots || !selectedDate) return [];
|
|
2272
|
-
const tz = demoRoom?.timezone ||
|
|
2288
|
+
const tz = demoRoom?.timezone || timezone3;
|
|
2273
2289
|
const selectedDateStr = selectedDate.format("YYYY-MM-DD");
|
|
2274
2290
|
return timeslotsData.timeslots.filter((slot) => {
|
|
2275
|
-
const slotDate = tz ?
|
|
2291
|
+
const slotDate = tz ? dayjs2(slot.start_time).tz(tz).format("YYYY-MM-DD") : dayjs2(slot.start_time).format("YYYY-MM-DD");
|
|
2276
2292
|
return slotDate === selectedDateStr;
|
|
2277
2293
|
});
|
|
2278
|
-
}, [timeslotsData, selectedDate, demoRoom?.timezone,
|
|
2294
|
+
}, [timeslotsData, selectedDate, demoRoom?.timezone, timezone3]);
|
|
2279
2295
|
const availableDates = useMemo(() => {
|
|
2280
2296
|
if (!timeslotsData?.timeslots) return /* @__PURE__ */ new Set();
|
|
2281
|
-
const tz = demoRoom?.timezone ||
|
|
2297
|
+
const tz = demoRoom?.timezone || timezone3;
|
|
2282
2298
|
const dates = /* @__PURE__ */ new Set();
|
|
2283
2299
|
timeslotsData.timeslots.forEach((slot) => {
|
|
2284
2300
|
if (slot.status === "available") {
|
|
2285
|
-
const dateStr = tz ?
|
|
2301
|
+
const dateStr = tz ? dayjs2(slot.start_time).tz(tz).format("YYYY-MM-DD") : dayjs2(slot.start_time).format("YYYY-MM-DD");
|
|
2286
2302
|
dates.add(dateStr);
|
|
2287
2303
|
}
|
|
2288
2304
|
});
|
|
2289
2305
|
return dates;
|
|
2290
|
-
}, [timeslotsData, demoRoom?.timezone,
|
|
2306
|
+
}, [timeslotsData, demoRoom?.timezone, timezone3]);
|
|
2291
2307
|
useEffect(() => {
|
|
2292
2308
|
if (!timeslotsData?.timeslots || isInitialized) return;
|
|
2293
|
-
const tz = demoRoom?.timezone ||
|
|
2294
|
-
const now2 = tz ?
|
|
2309
|
+
const tz = demoRoom?.timezone || timezone3;
|
|
2310
|
+
const now2 = tz ? dayjs2().tz(tz) : dayjs2();
|
|
2295
2311
|
const availableTimeslots = timeslotsData.timeslots.filter((slot) => {
|
|
2296
|
-
const slotTime = tz ?
|
|
2312
|
+
const slotTime = tz ? dayjs2(slot.start_time).tz(tz) : dayjs2(slot.start_time);
|
|
2297
2313
|
return slot.status === "available" && slotTime.isAfter(now2);
|
|
2298
2314
|
});
|
|
2299
2315
|
if (availableTimeslots.length > 0) {
|
|
2300
2316
|
const sortedSlots = [...availableTimeslots].sort((a, b) => {
|
|
2301
|
-
const timeA = tz ?
|
|
2302
|
-
const timeB = tz ?
|
|
2317
|
+
const timeA = tz ? dayjs2(a.start_time).tz(tz) : dayjs2(a.start_time);
|
|
2318
|
+
const timeB = tz ? dayjs2(b.start_time).tz(tz) : dayjs2(b.start_time);
|
|
2303
2319
|
return timeA.unix() - timeB.unix();
|
|
2304
2320
|
});
|
|
2305
2321
|
const nearestSlot = sortedSlots[0];
|
|
2306
|
-
const nearestDate = tz ?
|
|
2322
|
+
const nearestDate = tz ? dayjs2(nearestSlot.start_time).tz(tz) : dayjs2(nearestSlot.start_time);
|
|
2307
2323
|
setSelectedDate(nearestDate);
|
|
2308
2324
|
setCalendarValue(nearestDate);
|
|
2309
2325
|
setSelectedTimeslotId(nearestSlot.id);
|
|
@@ -2313,28 +2329,28 @@ var DateTimePicker = ({
|
|
|
2313
2329
|
setCalendarValue(now2);
|
|
2314
2330
|
setIsInitialized(true);
|
|
2315
2331
|
}
|
|
2316
|
-
}, [timeslotsData, isInitialized, selectedDate, demoRoom?.timezone,
|
|
2332
|
+
}, [timeslotsData, isInitialized, selectedDate, demoRoom?.timezone, timezone3]);
|
|
2317
2333
|
useEffect(() => {
|
|
2318
2334
|
if (!timeslotsData?.timeslots || !isInitialized) return;
|
|
2319
2335
|
if (selectedDate && selectedDate.isSame(calendarValue, "month")) {
|
|
2320
2336
|
return;
|
|
2321
2337
|
}
|
|
2322
|
-
const tz = demoRoom?.timezone ||
|
|
2338
|
+
const tz = demoRoom?.timezone || timezone3;
|
|
2323
2339
|
const currentMonthStart = calendarValue.startOf("month");
|
|
2324
2340
|
const currentMonthEnd = calendarValue.endOf("month");
|
|
2325
|
-
const now2 = tz ?
|
|
2341
|
+
const now2 = tz ? dayjs2().tz(tz) : dayjs2();
|
|
2326
2342
|
const availableTimeslots = timeslotsData.timeslots.filter((slot) => {
|
|
2327
|
-
const slotDate = tz ?
|
|
2343
|
+
const slotDate = tz ? dayjs2(slot.start_time).tz(tz) : dayjs2(slot.start_time);
|
|
2328
2344
|
return slot.status === "available" && slotDate.isAfter(now2) && (slotDate.isAfter(currentMonthStart) || slotDate.isSame(currentMonthStart, "day")) && (slotDate.isBefore(currentMonthEnd) || slotDate.isSame(currentMonthEnd, "day"));
|
|
2329
2345
|
});
|
|
2330
2346
|
if (availableTimeslots.length > 0) {
|
|
2331
2347
|
const sortedSlots = [...availableTimeslots].sort((a, b) => {
|
|
2332
|
-
const timeA = tz ?
|
|
2333
|
-
const timeB = tz ?
|
|
2348
|
+
const timeA = tz ? dayjs2(a.start_time).tz(tz) : dayjs2(a.start_time);
|
|
2349
|
+
const timeB = tz ? dayjs2(b.start_time).tz(tz) : dayjs2(b.start_time);
|
|
2334
2350
|
return timeA.unix() - timeB.unix();
|
|
2335
2351
|
});
|
|
2336
2352
|
const firstSlot = sortedSlots[0];
|
|
2337
|
-
const firstDate = tz ?
|
|
2353
|
+
const firstDate = tz ? dayjs2(firstSlot.start_time).tz(tz) : dayjs2(firstSlot.start_time);
|
|
2338
2354
|
setSelectedDate(firstDate);
|
|
2339
2355
|
setSelectedTimeslotId(firstSlot.id);
|
|
2340
2356
|
}
|
|
@@ -2344,12 +2360,12 @@ var DateTimePicker = ({
|
|
|
2344
2360
|
isInitialized,
|
|
2345
2361
|
selectedDate,
|
|
2346
2362
|
demoRoom?.timezone,
|
|
2347
|
-
|
|
2363
|
+
timezone3
|
|
2348
2364
|
]);
|
|
2349
2365
|
const formatTimeslot = (slot) => {
|
|
2350
|
-
const tz = demoRoom?.timezone ||
|
|
2351
|
-
const start = tz ?
|
|
2352
|
-
const end = tz ?
|
|
2366
|
+
const tz = demoRoom?.timezone || timezone3;
|
|
2367
|
+
const start = tz ? dayjs2(slot.start_time).tz(tz).format("h:mm A") : dayjs2(slot.start_time).format("h:mm A");
|
|
2368
|
+
const end = tz ? dayjs2(slot.end_time).tz(tz).format("h:mm A") : dayjs2(slot.end_time).format("h:mm A");
|
|
2353
2369
|
return `${start} - ${end}`;
|
|
2354
2370
|
};
|
|
2355
2371
|
const wrapperStyle = {
|
|
@@ -2510,16 +2526,16 @@ var DateTimePicker = ({
|
|
|
2510
2526
|
},
|
|
2511
2527
|
disabledDate: (current) => {
|
|
2512
2528
|
if (!current) return false;
|
|
2513
|
-
if (current.isSame(
|
|
2514
|
-
if (current.isBefore(
|
|
2529
|
+
if (current.isSame(dayjs2(), "day")) return false;
|
|
2530
|
+
if (current.isBefore(dayjs2(), "day")) return true;
|
|
2515
2531
|
const dateStr = current.format("YYYY-MM-DD");
|
|
2516
2532
|
return !availableDates.has(dateStr);
|
|
2517
2533
|
},
|
|
2518
2534
|
fullCellRender: (date) => {
|
|
2519
2535
|
const isSelected = selectedDate && date.isSame(selectedDate, "day");
|
|
2520
|
-
const isToday = date.isSame(
|
|
2536
|
+
const isToday = date.isSame(dayjs2(), "day");
|
|
2521
2537
|
const dateStr = date.format("YYYY-MM-DD");
|
|
2522
|
-
const isDisabled = !isToday && (date.isBefore(
|
|
2538
|
+
const isDisabled = !isToday && (date.isBefore(dayjs2(), "day") || !availableDates.has(dateStr));
|
|
2523
2539
|
return /* @__PURE__ */ jsx(
|
|
2524
2540
|
"div",
|
|
2525
2541
|
{
|
|
@@ -2665,13 +2681,13 @@ var DateTimePicker = ({
|
|
|
2665
2681
|
onClick: () => {
|
|
2666
2682
|
if (selectedDate) {
|
|
2667
2683
|
const newDate = selectedDate.subtract(1, "day");
|
|
2668
|
-
if (!newDate.isBefore(
|
|
2684
|
+
if (!newDate.isBefore(dayjs2(), "day")) {
|
|
2669
2685
|
setSelectedDate(newDate);
|
|
2670
2686
|
setCalendarValue(newDate);
|
|
2671
2687
|
}
|
|
2672
2688
|
}
|
|
2673
2689
|
},
|
|
2674
|
-
disabled: !selectedDate || selectedDate.isSame(
|
|
2690
|
+
disabled: !selectedDate || selectedDate.isSame(dayjs2(), "day") || selectedDate.isBefore(dayjs2(), "day"),
|
|
2675
2691
|
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",
|
|
2676
2692
|
children: /* @__PURE__ */ jsx(
|
|
2677
2693
|
"svg",
|
|
@@ -2764,7 +2780,7 @@ var DateTimePicker = ({
|
|
|
2764
2780
|
}) }),
|
|
2765
2781
|
!timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsx("div", { className: "pt-[24px] text-[#6d6d6F] text-center", children: pageData?.timezone?.replace(
|
|
2766
2782
|
"{{timezone}}",
|
|
2767
|
-
demoRoom?.timezone ||
|
|
2783
|
+
demoRoom?.timezone || timezone3 || ""
|
|
2768
2784
|
) })
|
|
2769
2785
|
] })
|
|
2770
2786
|
] }),
|
|
@@ -8868,7 +8884,7 @@ var BookingForm = ({
|
|
|
8868
8884
|
apiConfig,
|
|
8869
8885
|
demoRoomCode,
|
|
8870
8886
|
pageData,
|
|
8871
|
-
timezone:
|
|
8887
|
+
timezone: timezone3,
|
|
8872
8888
|
handleBookingSuccess,
|
|
8873
8889
|
onQuestionnaireSubmit,
|
|
8874
8890
|
...props
|
|
@@ -8900,7 +8916,7 @@ var BookingForm = ({
|
|
|
8900
8916
|
{
|
|
8901
8917
|
apiClient,
|
|
8902
8918
|
demoRoomCode,
|
|
8903
|
-
timezone:
|
|
8919
|
+
timezone: timezone3,
|
|
8904
8920
|
locale: apiConfig.locale,
|
|
8905
8921
|
onBookingSuccess: handleBookingSuccess,
|
|
8906
8922
|
onQuestionnaireSubmit,
|