@harshit-wander/component-lib 1.1.0 → 1.1.2

package/dist/index.cjs

@@ -240,7 +240,7 @@ function FieldShell({
     children
   ] }) });
 }
-var cardClass = "shrink-0 flex flex-col items-center gap-sm w-[88px] no-underline text-inherit focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2 focus-visible:rounded-md";
+var cardClass = "shrink-0 flex flex-col items-center gap-sm w-[66px] no-underline text-inherit focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2 focus-visible:rounded-md";
 var DestinationCard = react.forwardRef(
   ({ image, alt, label, href, className, ...rest }, ref) => {
     const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -249,7 +249,7 @@ var DestinationCard = react.forwardRef(
         {
           src: image,
           alt,
-          className: "w-[88px] h-[88px] rounded-full object-cover bg-border"
+          className: "w-[66px] h-[66px] rounded-full object-cover bg-border"
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium leading-5 text-secondary text-center whitespace-nowrap", children: label })
@@ -682,7 +682,7 @@ var PackageCard = react.forwardRef(
       ),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative inline-flex items-center self-start gap-xs py-[4px] px-md bg-accent border border-surface rounded-full", children: [
         originalPrice ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative text-2xs font-normal leading-18 text-strike after:content-[''] after:absolute after:left-[-2px] after:right-[-2px] after:top-1/2 after:h-px after:bg-strike after:rotate-[-8deg]", children: originalPrice }) : null,
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold leading-4 text-text-deep", children: currentPrice }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold leading-4 text-text-deep", children: currentPrice }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-normal leading-4 text-text-deep", children: priceSuffix })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-md text-on-image", children: [
@@ -1317,7 +1317,7 @@ var CategoryNavbar = react.forwardRef(
               {
                 href: logoHref,
                 "aria-label": "Home",
-                className: "inline-flex items-center no-underline text-inherit h-10 shrink-0 [&>img]:h-full [&>img]:w-auto [&>img]:object-contain [&>svg]:h-full [&>svg]:w-auto [&>svg]:object-contain",
+                className: "inline-flex items-center no-underline text-inherit h-[50px] shrink-0 [&>img]:h-full [&>img]:w-auto [&>img]:object-contain [&>svg]:h-full [&>svg]:w-auto [&>svg]:object-contain",
                 children: typeof logo === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: "" }) : logo
               }
             ) }),
@@ -1476,7 +1476,7 @@ var ContactSection = react.forwardRef(
       ref,
       className: cn(
         "flex w-full justify-center",
-        "lg:items-center lg:justify-between lg:gap-xl lg:py-xl lg:bg-primary lg:rounded-lg lg:shadow-card",
+        "lg:items-center lg:gap-xl lg:px-xl lg:py-xl lg:bg-primary lg:rounded-lg lg:shadow-card",
         className
       ),
       ...rest,
@@ -1619,7 +1619,10 @@ var useScrollSnap = (itemCount) => {
   const scrollNext = react.useCallback(() => {
     elRef.current?.scrollBy({ left: elRef.current.clientWidth, behavior: "smooth" });
   }, []);
-  return { ref: setRef, scrollPrev, scrollNext, canPrev, canNext, activeIndex, scrollProgress };
+  const scrollToStart = react.useCallback(() => {
+    elRef.current?.scrollTo({ left: 0, behavior: "smooth" });
+  }, []);
+  return { ref: setRef, scrollPrev, scrollNext, scrollToStart, canPrev, canNext, activeIndex, scrollProgress };
 };
 var ChevronLeft = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
@@ -1648,10 +1651,26 @@ var EventCarousel = react.forwardRef(
       ref: trackRef,
       scrollPrev,
       scrollNext,
+      scrollToStart,
       canPrev,
       canNext,
       activeIndex
     } = useScrollSnap(events.length);
+    const canNextRef = react.useRef(canNext);
+    react.useEffect(() => {
+      canNextRef.current = canNext;
+    }, [canNext]);
+    react.useEffect(() => {
+      if (events.length <= 1) return;
+      const id = setInterval(() => {
+        if (canNextRef.current) {
+          scrollNext();
+        } else {
+          scrollToStart();
+        }
+      }, 3e3);
+      return () => clearInterval(id);
+    }, [events.length, scrollNext, scrollToStart]);
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "section",
       {
@@ -2589,6 +2608,7 @@ var TestimonialsCarousel = react.forwardRef(
     const isControlled = activeIndex !== void 0;
     const [internalIndex, setInternalIndex] = react.useState(defaultIndex);
     const currentIndex = isControlled ? activeIndex : internalIndex;
+    const touchStartX = react.useRef(null);
     const setIndex = (next) => {
       if (!isControlled) setInternalIndex(next);
       onActiveIndexChange?.(next);
@@ -2597,11 +2617,27 @@ var TestimonialsCarousel = react.forwardRef(
     if (!current) return null;
     const isFirst = currentIndex <= 0;
     const isLast = currentIndex >= testimonials.length - 1;
+    const handleTouchStart = (e) => {
+      touchStartX.current = e.touches[0]?.clientX ?? null;
+    };
+    const handleTouchEnd = (e) => {
+      if (touchStartX.current === null) return;
+      const endX = e.changedTouches[0]?.clientX;
+      if (endX === void 0) return;
+      const delta = touchStartX.current - endX;
+      if (Math.abs(delta) > 40) {
+        if (delta > 0 && !isLast) setIndex(currentIndex + 1);
+        else if (delta < 0 && !isFirst) setIndex(currentIndex - 1);
+      }
+      touchStartX.current = null;
+    };
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "section",
       {
         ref,
         className: cn("flex flex-col items-center gap-[28px] bg-surface", className),
+        onTouchStart: handleTouchStart,
+        onTouchEnd: handleTouchEnd,
         ...rest,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -2807,6 +2843,94 @@ var TripsCategorySection = react.forwardRef(
   }
 );
 TripsCategorySection.displayName = "TripsCategorySection";
+var UCT_VIDEO_DEFAULT = "https://wanderon-video.gumlet.io/upcoming-community-trips-a.mp4";
+var UCT_POSTER_DEFAULT = "https://wanderon-images.gumlet.io/uct-thumbnail.jpg?updatedAt=1739361886945";
+var UctMobileBanner = react.forwardRef(
+  ({
+    href,
+    videoUrl = UCT_VIDEO_DEFAULT,
+    posterUrl = UCT_POSTER_DEFAULT,
+    LinkComponent,
+    className,
+    ...rest
+  }, ref) => {
+    const Link = LinkComponent ?? "a";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Link,
+      {
+        ref,
+        href,
+        className: cn(
+          "flex justify-center no-underline outline-none select-none [-webkit-tap-highlight-color:transparent]",
+          className
+        ),
+        ...rest,
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-full mx-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[-15px] left-[10px] w-[51px] h-[50px] rounded-full z-[6] [box-shadow:0px_4px_10px_0px_rgba(254,230,11,0.2)]", children: /* @__PURE__ */ jsxRuntime.jsx(
+            "video",
+            {
+              src: videoUrl,
+              poster: posterUrl,
+              muted: true,
+              loop: true,
+              autoPlay: true,
+              playsInline: true,
+              className: "w-full h-full object-cover rounded-full"
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: "relative flex items-center justify-between overflow-hidden h-[60px] pl-[70px] pr-[10px] py-[10px] rounded-xl cursor-pointer",
+              style: {
+                background: "linear-gradient(90deg, #015f74 0%, #02b3da 100%)",
+                boxShadow: "0px 4px 4px 0px rgba(1, 95, 116, 0.3) inset"
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[#f5fdff] text-base font-medium leading-7 font-[inherit]", children: "Upcoming Community Trips" }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: "inline-flex",
+                    style: { animation: "uct-move-arrow 1.5s infinite" },
+                    children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+                      "path",
+                      {
+                        d: "M13 6L19 12L13 18M5 6L11 12L5 18",
+                        stroke: "white",
+                        strokeWidth: "1.5",
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round"
+                      }
+                    ) })
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-[300px] h-[250px] pointer-events-none", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full border border-[#ababab] w-0 h-0",
+                      style: { animation: "uct-pulse-one 2s infinite 0s ease-in-out" }
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full border border-[#ababab] w-0 h-0",
+                      style: { animation: "uct-pulse-two 2s infinite 1s ease-in-out" }
+                    }
+                  )
+                ] })
+              ]
+            }
+          )
+        ] })
+      }
+    );
+  }
+);
+UctMobileBanner.displayName = "UctMobileBanner";
 var ValuesSection = react.forwardRef(
   ({ heading: heading2, subheading, values, singleOpen = false, className, ...rest }, ref) => {
     const [openIndex, setOpenIndex] = react.useState(null);
@@ -3028,6 +3152,7 @@ exports.TestimonialsCarousel = TestimonialsCarousel;
 exports.TextSection = TextSection;
 exports.TripCategoryCard = TripCategoryCard;
 exports.TripsCategorySection = TripsCategorySection;
+exports.UctMobileBanner = UctMobileBanner;
 exports.ValuesSection = ValuesSection;
 exports.WarriorCard = WarriorCard;
 exports.WarriorsSection = WarriorsSection;