@anker-in/ui 0.1.8 → 0.1.10

package/dist/demo-room.mjs

@@ -48,7 +48,10 @@ var StudioCard = ({
     "div",
     {
       ...props,
-      className: cn("p-6 cursor-pointer transition-colors duration-200", className),
+      className: cn(
+        "p-6 cursor-pointer transition-colors duration-200",
+        className
+      ),
       style: {
         backgroundColor: isHovered ? "#f3f4f6" : "transparent",
         ...style
@@ -70,7 +73,7 @@ var StudioCard = ({
             pageData.away
           ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 mb-3", children: [
+        availableTime && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 mb-3", children: [
           /* @__PURE__ */ jsxs(
             "svg",
             {
@@ -124,7 +127,7 @@ var StudioCard = ({
             }
           ),
           /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-600", children: [
-            pageData.available,
+            availableTime === pageData.noAvailableTime ? "" : pageData.available,
             " ",
             availableTime
           ] }) })
@@ -333,18 +336,22 @@ var StudioMap = ({
     validLocations.forEach((location) => {
       const lat = Number(location.lat);
       const lng = Number(location.lng);
+      const svgIcon = {
+        url: `data:image/svg+xml;charset=UTF-8,${encodeURIComponent(`
+          <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <circle cx="24" cy="24" r="22" fill="#00000010"/>
+            <circle cx="24" cy="24" r="10" fill="#000000"/>
+            <circle cx="24" cy="24" r="5" fill="#3ADB67"/>
+          </svg>
+        `)}`,
+        scaledSize: { width: 48, height: 48 },
+        anchor: { x: 24, y: 24 }
+      };
       const marker = new google.maps.Marker({
         position: { lat, lng },
         map: googleMapRef.current,
         title: location.name,
-        icon: {
-          path: google.maps.SymbolPath.CIRCLE,
-          scale: 10,
-          fillColor: "#000000",
-          fillOpacity: 1,
-          strokeColor: "#ffffff",
-          strokeWeight: 2
-        }
+        icon: svgIcon
       });
       marker.addListener("click", () => {
         setSelectedLocation(location);
@@ -355,7 +362,7 @@ var StudioMap = ({
                     <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
                       <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"/>
                     </svg>
-                    <span style="vertical-align: middle;">${pageData.available} ${location.availableTime}</span>
+                    <span style="vertical-align: middle;"> ${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</span>
                   </div>` : ""}
             <div style="margin-bottom: 8px; color: #666;">
               <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
@@ -860,6 +867,7 @@ var defaultPageData = {
   title: "Find a Studio Near You",
   loadingText: "Loading demo rooms...",
   errorTitle: "Failed to load demo rooms",
+  machine: "eufymake E1",
   locationFilter: {
     allLocations: "All Locations",
     clear: "Clear",
@@ -1042,13 +1050,13 @@ var RoomsList = ({
         state,
         zipCode: "",
         country,
-        lat: Number(room.latitude) || 34.0522,
-        lng: Number(room.longitude) || -118.2437,
+        lat: Number(room.latitude) || 0,
+        lng: Number(room.longitude) || 0,
         availableTime: nextAvailableTimeslot ? `${nextAvailableTimeslot.start_time}` : mergedPageData.noAvailableTime,
         euifyMakeModel: room?.description
       };
     });
-  }, [demoRooms]);
+  }, [demoRooms, mergedPageData.defaultCountry, mergedPageData.noAvailableTime]);
   const filteredStudioLocations = useMemo(() => {
     if (!selectedLocation) return studioLocations;
     return studioLocations.filter((location) => {
@@ -1130,7 +1138,7 @@ var RoomsList = ({
                 }
               ),
               /* @__PURE__ */ jsxs("div", { className: "flex text-[#767880] cursor-not-allowed", children: [
-                "eufymake E1",
+                mergedPageData.machine,
                 /* @__PURE__ */ jsx(
                   "svg",
                   {
@@ -1170,7 +1178,10 @@ var RoomsList = ({
                       onSchedule,
                       onMouseEnter: () => setHoveredRoomId(item.id),
                       onMouseLeave: () => setHoveredRoomId(null),
-                      pageData: mergedPageData.studioCard
+                      pageData: {
+                        ...mergedPageData.studioCard,
+                        noAvailableTime: mergedPageData?.noAvailableTime
+                      }
                     },
                     item.id
                   );
@@ -1203,7 +1214,10 @@ var RoomsList = ({
           hoveredLocationId: hoveredRoomId,
           onSchedule,
           mapHeight: "794px",
-          pageData: mergedPageData.map
+          pageData: {
+            ...mergedPageData.map,
+            noAvailableTime: pageData?.noAvailableTime
+          }
         }
       ) })
     ] })
@@ -1406,207 +1420,7 @@ var DemoRoom = ({
   ) });
 };
 DemoRoom.displayName = "DemoRoom";
-var EventCard = ({
-  title,
-  description,
-  backgroundImage,
-  aspectRatio,
-  variant = "medium",
-  buttons = [],
-  subtitle,
-  className,
-  ...props
-}) => {
-  const isLarge = variant === "large";
-  const isMedium = variant === "medium";
-  const isProduct = variant === "product";
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn("rounded-3xl overflow-hidden relative", className),
-      style: {
-        backgroundImage: backgroundImage ? `url(${backgroundImage})` : void 0,
-        backgroundSize: "cover",
-        backgroundPosition: "center",
-        aspectRatio
-      },
-      ...props,
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "relative h-full flex flex-col",
-            isLarge && "justify-center pl-8",
-            !isLarge && "justify-end pl-8 pb-8"
-          ),
-          children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx(
-                "h3",
-                {
-                  className: cn(
-                    "font-semibold mb-3",
-                    isLarge && "text-3xl text-gray-900",
-                    isMedium && "text-2xl text-white",
-                    isProduct && "text-2xl text-gray-900"
-                  ),
-                  children: title
-                }
-              ),
-              subtitle && isProduct && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600 mb-4", children: subtitle }),
-              description && /* @__PURE__ */ jsx(
-                "p",
-                {
-                  className: cn(
-                    "text-sm leading-relaxed",
-                    isMedium && "text-white/90",
-                    (isLarge || isProduct) && "text-gray-600"
-                  ),
-                  children: description
-                }
-              )
-            ] }),
-            buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex gap-3 mt-6", children: buttons.map((button, index) => /* @__PURE__ */ jsx(
-              "button",
-              {
-                onClick: button.onClick,
-                className: cn(
-                  "px-6 py-3 rounded-full font-medium text-sm transition-all duration-200",
-                  button.variant === "primary" && "bg-gray-900 text-white hover:bg-gray-800",
-                  button.variant === "secondary" && "bg-white text-gray-900 border border-gray-300 hover:bg-gray-50"
-                ),
-                children: button.label
-              },
-              index
-            )) })
-          ]
-        }
-      )
-    }
-  );
-};
-EventCard.displayName = "EventCard";
-var defaultEvents = [
-  {
-    variant: "large",
-    title: "IFA 2025 Event Name Event Name",
-    description: "Corem ipsum dolor sit amet, consectetur adipiscing elit.",
-    backgroundImage: "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638",
-    buttons: [
-      {
-        label: "Schedule Now",
-        variant: "primary"
-      }
-    ],
-    aspectRatio: "1664 / 640"
-  },
-  {
-    variant: "medium",
-    title: "Local Event Name Local Event Name Local Event Name",
-    description: "Norem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet odio mattis.",
-    backgroundImage: "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638",
-    buttons: [
-      {
-        label: "Schedule Now",
-        variant: "primary"
-      }
-    ],
-    aspectRatio: "824 / 640"
-  },
-  {
-    variant: "product",
-    title: "Anker Prime",
-    subtitle: "Anker Prime 240W GaN Desktop Charger (4 Ports) Feb. 5th - 16th",
-    backgroundImage: "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638",
-    buttons: [
-      {
-        label: "Learn More",
-        variant: "secondary"
-      },
-      {
-        label: "Shop Now",
-        variant: "primary"
-      }
-    ],
-    aspectRatio: "824 / 640"
-  },
-  {
-    variant: "medium",
-    title: "Local Event Name Local Event Name Local Event Name",
-    description: "Norem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet odio mattis.",
-    backgroundImage: "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638",
-    buttons: [
-      {
-        label: "Schedule Now",
-        variant: "primary"
-      }
-    ],
-    aspectRatio: "824 / 640"
-  },
-  {
-    variant: "product",
-    title: "Anker Prime",
-    subtitle: "Anker Prime 240W GaN Desktop Charger (4 Ports) Feb. 5th - 16th",
-    backgroundImage: "https://cdn.shopify.com/s/files/1/0569/5147/2268/files/Component_3_1.png?v=1765274638",
-    buttons: [
-      {
-        label: "Learn More",
-        variant: "secondary"
-      },
-      {
-        label: "Shop Now",
-        variant: "primary"
-      }
-    ],
-    aspectRatio: "824 / 640"
-  }
-];
-var UpcomingEvents = ({
-  title = "Upcoming Events",
-  events = defaultEvents,
-  showViewMore = true,
-  onViewMore,
-  className,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsxs("div", { className: cn("w-full", className), ...props, children: [
-    /* @__PURE__ */ jsx(Title, { title }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-6 mb-[64px]", children: events.map((event, index) => /* @__PURE__ */ jsx("div", { className: cn(index === 0 ? "col-span-2" : ""), children: /* @__PURE__ */ jsx(EventCard, { ...event }) }, index)) }),
-    showViewMore && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs(
-      "button",
-      {
-        onClick: onViewMore,
-        className: "inline-flex items-center gap-2 text-gray-700 hover:text-gray-900 transition-colors duration-200",
-        children: [
-          /* @__PURE__ */ jsx("span", { className: "text-base font-bold", children: "View More" }),
-          /* @__PURE__ */ jsx(
-            "svg",
-            {
-              width: "16",
-              height: "16",
-              viewBox: "0 0 16 16",
-              fill: "none",
-              xmlns: "http://www.w3.org/2000/svg",
-              className: "transition-transform duration-200 group-hover:translate-y-0.5",
-              children: /* @__PURE__ */ jsx(
-                "path",
-                {
-                  d: "M8 3L8 13M8 13L12 9M8 13L4 9",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round"
-                }
-              )
-            }
-          )
-        ]
-      }
-    ) })
-  ] });
-};
-UpcomingEvents.displayName = "UpcomingEvents";
 
-export { DemoRoom, EventCard, StudioCard, StudioMap, UpcomingEvents };
+export { DemoRoom, StudioCard, StudioMap };
 //# sourceMappingURL=demo-room.mjs.map
 //# sourceMappingURL=demo-room.mjs.map