@anker-in/ui 0.2.0 → 0.2.2

package/dist/index.mjs

@@ -6,14 +6,14 @@ import IndexBar from 'antd-mobile/es/components/index-bar';
 import List from 'antd-mobile/es/components/list';
 import 'antd-mobile/es/components/index-bar/index-bar.css';
 import 'antd-mobile/es/components/list/list.css';
-import dayjs from 'dayjs';
+import dayjs2 from 'dayjs';
+import utc from 'dayjs/plugin/utc';
+import timezone from 'dayjs/plugin/timezone';
 import 'dayjs/locale/zh-cn';
 import { theme, ConfigProvider, Calendar, Select } from 'antd';
 import dayLocaleData from 'dayjs/plugin/localeData';
 import weekday from 'dayjs/plugin/weekday';
 import weekOfYear from 'dayjs/plugin/weekOfYear';
-import timezone from 'dayjs/plugin/timezone';
-import utc from 'dayjs/plugin/utc';
 
 function cn(...inputs) {
   return twMerge(clsx(inputs));
@@ -1103,6 +1103,8 @@ var LocationFilter = ({
   );
 };
 LocationFilter.displayName = "LocationFilter";
+dayjs2.extend(utc);
+dayjs2.extend(timezone);
 var defaultPageData = {
   title: "Find a Studio Near You",
   loadingText: "Loading demo rooms...",
@@ -1282,6 +1284,20 @@ var RoomsList = ({
       const city = room.location?.city || "";
       const addressParts = [room.address, city, state, country].filter(Boolean);
       const fullAddress = addressParts.join(", ");
+      let formattedTime = mergedPageData.noAvailableTime;
+      if (nextAvailableTimeslot) {
+        try {
+          const timeInZone = dayjs2(nextAvailableTimeslot.start_time).tz(
+            room.timezone || "America/Los_Angeles"
+          );
+          const month = timeInZone.format("MMM");
+          const day = timeInZone.format("D");
+          const time = timeInZone.format("h:mm A");
+          formattedTime = `${month}.${day}, ${time}`;
+        } catch (error2) {
+          formattedTime = nextAvailableTimeslot.start_time;
+        }
+      }
       return {
         id: room.code,
         name: room.name,
@@ -1292,7 +1308,7 @@ var RoomsList = ({
         country,
         lat: Number(room.latitude) || 0,
         lng: Number(room.longitude) || 0,
-        availableTime: nextAvailableTimeslot ? `${nextAvailableTimeslot.start_time}` : mergedPageData.noAvailableTime,
+        availableTime: formattedTime,
         euifyMakeModel: room?.equipment?.join(", ") || ""
       };
     });
@@ -1671,7 +1687,12 @@ var QuestionnaireForm = ({
   const [phoneCountryCodes, setPhoneCountryCodes] = useState({});
   const [otherInputs, setOtherInputs] = useState({});
   const prevHasBookedBeforeRef = useRef(false);
-  const hasBookedBefore = responses["has_booked_before"] === "option2";
+  const hasBookedBeforeInitialized = useRef(false);
+  const hasBookedBeforeQuestion = questions.find(
+    (q) => (q.key || q.id) === "has_booked_before"
+  );
+  const hasBookedBeforeQuestionId = hasBookedBeforeQuestion ? hasBookedBeforeQuestion.key || hasBookedBeforeQuestion.id || "" : "has_booked_before";
+  const hasBookedBefore = responses[hasBookedBeforeQuestionId] === "option2";
   const hiddenQuestionIds = useMemo(() => {
     if (!hasBookedBefore) return [];
     return questions.filter((q) => q.is_default === false).map((q) => q.key || q.id || "");
@@ -1684,6 +1705,21 @@ var QuestionnaireForm = ({
       return true;
     });
   }, [questions, hasBookedBefore]);
+  useEffect(() => {
+    if (hasBookedBeforeInitialized.current) return;
+    if (hasBookedBeforeQuestion && hasBookedBeforeQuestionId) {
+      setResponses((prev) => {
+        if (!prev[hasBookedBeforeQuestionId]) {
+          return {
+            ...prev,
+            [hasBookedBeforeQuestionId]: "option1"
+          };
+        }
+        return prev;
+      });
+      hasBookedBeforeInitialized.current = true;
+    }
+  }, [hasBookedBeforeQuestion, hasBookedBeforeQuestionId]);
   useEffect(() => {
     if (hasBookedBefore && !prevHasBookedBeforeRef.current) {
       if (hiddenQuestionIds.length > 0) {
@@ -2181,15 +2217,15 @@ var QuestionnaireForm = ({
     ] })
   ] });
 };
-dayjs.extend(dayLocaleData);
-dayjs.extend(weekday);
-dayjs.extend(weekOfYear);
-dayjs.extend(utc);
-dayjs.extend(timezone);
+dayjs2.extend(dayLocaleData);
+dayjs2.extend(weekday);
+dayjs2.extend(weekOfYear);
+dayjs2.extend(utc);
+dayjs2.extend(timezone);
 var DateTimePicker = ({
   apiClient,
   demoRoomCode,
-  timezone: timezone2,
+  timezone: timezone3,
   pageData = {
     scheduleYourVisit: "Schedule Your Visit",
     timeSlot: "Time Slot",
@@ -2208,7 +2244,7 @@ var DateTimePicker = ({
 }) => {
   const { token } = theme.useToken();
   const [selectedDate, setSelectedDate] = useState(null);
-  const [calendarValue, setCalendarValue] = useState(dayjs());
+  const [calendarValue, setCalendarValue] = useState(dayjs2());
   const [selectedTimeslotId, setSelectedTimeslotId] = useState(
     null
   );
@@ -2243,47 +2279,47 @@ var DateTimePicker = ({
     {
       start_date: startDate,
       end_date: endDate,
-      timezone: timezone2
+      timezone: timezone3
     },
     { enabled: !!demoRoomCode }
   );
   const dayTimeslots = useMemo(() => {
     if (!timeslotsData?.timeslots || !selectedDate) return [];
-    const tz = demoRoom?.timezone || timezone2;
+    const tz = demoRoom?.timezone || timezone3;
     const selectedDateStr = selectedDate.format("YYYY-MM-DD");
     return timeslotsData.timeslots.filter((slot) => {
-      const slotDate = tz ? dayjs(slot.start_time).tz(tz).format("YYYY-MM-DD") : dayjs(slot.start_time).format("YYYY-MM-DD");
+      const slotDate = tz ? dayjs2(slot.start_time).tz(tz).format("YYYY-MM-DD") : dayjs2(slot.start_time).format("YYYY-MM-DD");
       return slotDate === selectedDateStr;
     });
-  }, [timeslotsData, selectedDate, demoRoom?.timezone, timezone2]);
+  }, [timeslotsData, selectedDate, demoRoom?.timezone, timezone3]);
   const availableDates = useMemo(() => {
     if (!timeslotsData?.timeslots) return /* @__PURE__ */ new Set();
-    const tz = demoRoom?.timezone || timezone2;
+    const tz = demoRoom?.timezone || timezone3;
     const dates = /* @__PURE__ */ new Set();
     timeslotsData.timeslots.forEach((slot) => {
       if (slot.status === "available") {
-        const dateStr = tz ? dayjs(slot.start_time).tz(tz).format("YYYY-MM-DD") : dayjs(slot.start_time).format("YYYY-MM-DD");
+        const dateStr = tz ? dayjs2(slot.start_time).tz(tz).format("YYYY-MM-DD") : dayjs2(slot.start_time).format("YYYY-MM-DD");
         dates.add(dateStr);
       }
     });
     return dates;
-  }, [timeslotsData, demoRoom?.timezone, timezone2]);
+  }, [timeslotsData, demoRoom?.timezone, timezone3]);
   useEffect(() => {
     if (!timeslotsData?.timeslots || isInitialized) return;
-    const tz = demoRoom?.timezone || timezone2;
-    const now2 = tz ? dayjs().tz(tz) : dayjs();
+    const tz = demoRoom?.timezone || timezone3;
+    const now2 = tz ? dayjs2().tz(tz) : dayjs2();
     const availableTimeslots = timeslotsData.timeslots.filter((slot) => {
-      const slotTime = tz ? dayjs(slot.start_time).tz(tz) : dayjs(slot.start_time);
+      const slotTime = tz ? dayjs2(slot.start_time).tz(tz) : dayjs2(slot.start_time);
       return slot.status === "available" && slotTime.isAfter(now2);
     });
     if (availableTimeslots.length > 0) {
       const sortedSlots = [...availableTimeslots].sort((a, b) => {
-        const timeA = tz ? dayjs(a.start_time).tz(tz) : dayjs(a.start_time);
-        const timeB = tz ? dayjs(b.start_time).tz(tz) : dayjs(b.start_time);
+        const timeA = tz ? dayjs2(a.start_time).tz(tz) : dayjs2(a.start_time);
+        const timeB = tz ? dayjs2(b.start_time).tz(tz) : dayjs2(b.start_time);
         return timeA.unix() - timeB.unix();
       });
       const nearestSlot = sortedSlots[0];
-      const nearestDate = tz ? dayjs(nearestSlot.start_time).tz(tz) : dayjs(nearestSlot.start_time);
+      const nearestDate = tz ? dayjs2(nearestSlot.start_time).tz(tz) : dayjs2(nearestSlot.start_time);
       setSelectedDate(nearestDate);
       setCalendarValue(nearestDate);
       setSelectedTimeslotId(nearestSlot.id);
@@ -2293,28 +2329,28 @@ var DateTimePicker = ({
       setCalendarValue(now2);
       setIsInitialized(true);
     }
-  }, [timeslotsData, isInitialized, selectedDate, demoRoom?.timezone, timezone2]);
+  }, [timeslotsData, isInitialized, selectedDate, demoRoom?.timezone, timezone3]);
   useEffect(() => {
     if (!timeslotsData?.timeslots || !isInitialized) return;
     if (selectedDate && selectedDate.isSame(calendarValue, "month")) {
       return;
     }
-    const tz = demoRoom?.timezone || timezone2;
+    const tz = demoRoom?.timezone || timezone3;
     const currentMonthStart = calendarValue.startOf("month");
     const currentMonthEnd = calendarValue.endOf("month");
-    const now2 = tz ? dayjs().tz(tz) : dayjs();
+    const now2 = tz ? dayjs2().tz(tz) : dayjs2();
     const availableTimeslots = timeslotsData.timeslots.filter((slot) => {
-      const slotDate = tz ? dayjs(slot.start_time).tz(tz) : dayjs(slot.start_time);
+      const slotDate = tz ? dayjs2(slot.start_time).tz(tz) : dayjs2(slot.start_time);
       return slot.status === "available" && slotDate.isAfter(now2) && (slotDate.isAfter(currentMonthStart) || slotDate.isSame(currentMonthStart, "day")) && (slotDate.isBefore(currentMonthEnd) || slotDate.isSame(currentMonthEnd, "day"));
     });
     if (availableTimeslots.length > 0) {
       const sortedSlots = [...availableTimeslots].sort((a, b) => {
-        const timeA = tz ? dayjs(a.start_time).tz(tz) : dayjs(a.start_time);
-        const timeB = tz ? dayjs(b.start_time).tz(tz) : dayjs(b.start_time);
+        const timeA = tz ? dayjs2(a.start_time).tz(tz) : dayjs2(a.start_time);
+        const timeB = tz ? dayjs2(b.start_time).tz(tz) : dayjs2(b.start_time);
         return timeA.unix() - timeB.unix();
       });
       const firstSlot = sortedSlots[0];
-      const firstDate = tz ? dayjs(firstSlot.start_time).tz(tz) : dayjs(firstSlot.start_time);
+      const firstDate = tz ? dayjs2(firstSlot.start_time).tz(tz) : dayjs2(firstSlot.start_time);
       setSelectedDate(firstDate);
       setSelectedTimeslotId(firstSlot.id);
     }
@@ -2324,12 +2360,12 @@ var DateTimePicker = ({
     isInitialized,
     selectedDate,
     demoRoom?.timezone,
-    timezone2
+    timezone3
   ]);
   const formatTimeslot = (slot) => {
-    const tz = demoRoom?.timezone || timezone2;
-    const start = tz ? dayjs(slot.start_time).tz(tz).format("h:mm A") : dayjs(slot.start_time).format("h:mm A");
-    const end = tz ? dayjs(slot.end_time).tz(tz).format("h:mm A") : dayjs(slot.end_time).format("h:mm A");
+    const tz = demoRoom?.timezone || timezone3;
+    const start = tz ? dayjs2(slot.start_time).tz(tz).format("h:mm A") : dayjs2(slot.start_time).format("h:mm A");
+    const end = tz ? dayjs2(slot.end_time).tz(tz).format("h:mm A") : dayjs2(slot.end_time).format("h:mm A");
     return `${start} - ${end}`;
   };
   const wrapperStyle = {
@@ -2490,16 +2526,16 @@ var DateTimePicker = ({
                     },
                     disabledDate: (current) => {
                       if (!current) return false;
-                      if (current.isSame(dayjs(), "day")) return false;
-                      if (current.isBefore(dayjs(), "day")) return true;
+                      if (current.isSame(dayjs2(), "day")) return false;
+                      if (current.isBefore(dayjs2(), "day")) return true;
                       const dateStr = current.format("YYYY-MM-DD");
                       return !availableDates.has(dateStr);
                     },
                     fullCellRender: (date) => {
                       const isSelected = selectedDate && date.isSame(selectedDate, "day");
-                      const isToday = date.isSame(dayjs(), "day");
+                      const isToday = date.isSame(dayjs2(), "day");
                       const dateStr = date.format("YYYY-MM-DD");
-                      const isDisabled = !isToday && (date.isBefore(dayjs(), "day") || !availableDates.has(dateStr));
+                      const isDisabled = !isToday && (date.isBefore(dayjs2(), "day") || !availableDates.has(dateStr));
                       return /* @__PURE__ */ jsx(
                         "div",
                         {
@@ -2645,13 +2681,13 @@ var DateTimePicker = ({
                 onClick: () => {
                   if (selectedDate) {
                     const newDate = selectedDate.subtract(1, "day");
-                    if (!newDate.isBefore(dayjs(), "day")) {
+                    if (!newDate.isBefore(dayjs2(), "day")) {
                       setSelectedDate(newDate);
                       setCalendarValue(newDate);
                     }
                   }
                 },
-                disabled: !selectedDate || selectedDate.isSame(dayjs(), "day") || selectedDate.isBefore(dayjs(), "day"),
+                disabled: !selectedDate || selectedDate.isSame(dayjs2(), "day") || selectedDate.isBefore(dayjs2(), "day"),
                 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",
                 children: /* @__PURE__ */ jsx(
                   "svg",
@@ -2744,7 +2780,7 @@ var DateTimePicker = ({
         }) }),
         !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsx("div", { className: "pt-[24px] text-[#6d6d6F] text-center", children: pageData?.timezone?.replace(
           "{{timezone}}",
-          demoRoom?.timezone || timezone2 || ""
+          demoRoom?.timezone || timezone3 || ""
         ) })
       ] })
     ] }),
@@ -8848,7 +8884,7 @@ var BookingForm = ({
   apiConfig,
   demoRoomCode,
   pageData,
-  timezone: timezone2,
+  timezone: timezone3,
   handleBookingSuccess,
   onQuestionnaireSubmit,
   ...props
@@ -8880,7 +8916,7 @@ var BookingForm = ({
       {
         apiClient,
         demoRoomCode,
-        timezone: timezone2,
+        timezone: timezone3,
         locale: apiConfig.locale,
         onBookingSuccess: handleBookingSuccess,
         onQuestionnaireSubmit,