@harshit-wander/component-lib 1.0.1 → 1.1.1

package/dist/index.d.cts

@@ -638,6 +638,15 @@ interface TripsCategorySectionProps extends HTMLAttributes<HTMLElement> {
 
 declare const TripsCategorySection: react.ForwardRefExoticComponent<TripsCategorySectionProps & react.RefAttributes<HTMLElement>>;
 
+interface UctMobileBannerProps extends Omit<HTMLAttributes<HTMLAnchorElement>, 'href'> {
+    href: string;
+    videoUrl?: string | undefined;
+    posterUrl?: string | undefined;
+    LinkComponent?: ElementType | undefined;
+}
+
+declare const UctMobileBanner: react.ForwardRefExoticComponent<UctMobileBannerProps & react.RefAttributes<HTMLAnchorElement>>;
+
 interface ValuesSectionProps extends HTMLAttributes<HTMLElement> {
     heading: string;
     subheading?: string | undefined;
@@ -723,4 +732,4 @@ declare const theme: {
 };
 type Theme = typeof theme;
 
-export { BottomNav, type BottomNavItem, type BottomNavProps, type Brand, BrandLogo, type BrandLogoProps, BrandsSection, type BrandsSectionProps, CategoryNavbar, type CategoryNavbarProps, ContactForm, type ContactFormCountryCode, type ContactFormDestination, type ContactFormProps, type ContactFormValues, ContactSection, type ContactSectionProps, CtaBanner, type CtaBannerCta, type CtaBannerProps, DestinationCard, type DestinationCardProps, type DestinationItem, DestinationsSection, type DestinationsSectionProps, EventBanner, type EventBannerProps, EventCarousel, type EventCarouselImageItem, type EventCarouselProps, type EventCarouselVideoItem, EventVideoBanner, type EventVideoBannerProps, ExpandableValueCard, type ExpandableValueCardProps, ExploreCard, type ExploreCardProps, type ExploreItem, ExploreSection, type ExploreSectionProps, FaqExpandable, type FaqExpandableProps, type FaqItem, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, Footer, type FooterColumn, type FooterContact, type FooterLink, type FooterProps, type FooterSocialLink, GalleryPhoto, type GalleryPhotoData, type GalleryPhotoProps, GallerySection, type GallerySectionProps, Hero, type HeroProps, type HeroReview, type HeroVariant, HomeHero, type HomeHeroProps, type HomeHeroReview, type HomeHeroTypewriterOptions, LocationCard, type LocationCardProps, type LocationItem, type MonthTab, MonthTabs, type MonthTabsProps, type NavCategory, type NavCategoryItem, type NavLink, Navbar, type NavbarProps, OfficesSection, type OfficesSectionProps, PackageCard, type PackageCardProps, type PackageItem, PackagesCarousel, type PackagesCarouselProps, SectionHeader, type SectionHeaderAlign, type SectionHeaderProps, SiteHeader, type SiteHeaderProps, TeamInfoCard, type TeamInfoCardProps, type TeamMember, TeamSection, type TeamSectionProps, type TeamSocialLink, TestimonialCard, type TestimonialCardProps, type TestimonialItem, TestimonialsCarousel, type TestimonialsCarouselProps, TextSection, type TextSectionAlign, type TextSectionProps, type Theme, TripCategoryCard, type TripCategoryCardProps, type TripsCategoryItem, TripsCategorySection, type TripsCategorySectionCta, type TripsCategorySectionProps, type ValueItem, ValuesSection, type ValuesSectionProps, type Warrior, WarriorCard, type WarriorCardProps, WarriorsSection, type WarriorsSectionProps, type WhyChooseFeature, WhyChooseSection, type WhyChooseSectionProps, theme };
+export { BottomNav, type BottomNavItem, type BottomNavProps, type Brand, BrandLogo, type BrandLogoProps, BrandsSection, type BrandsSectionProps, CategoryNavbar, type CategoryNavbarProps, ContactForm, type ContactFormCountryCode, type ContactFormDestination, type ContactFormProps, type ContactFormValues, ContactSection, type ContactSectionProps, CtaBanner, type CtaBannerCta, type CtaBannerProps, DestinationCard, type DestinationCardProps, type DestinationItem, DestinationsSection, type DestinationsSectionProps, EventBanner, type EventBannerProps, EventCarousel, type EventCarouselImageItem, type EventCarouselProps, type EventCarouselVideoItem, EventVideoBanner, type EventVideoBannerProps, ExpandableValueCard, type ExpandableValueCardProps, ExploreCard, type ExploreCardProps, type ExploreItem, ExploreSection, type ExploreSectionProps, FaqExpandable, type FaqExpandableProps, type FaqItem, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, Footer, type FooterColumn, type FooterContact, type FooterLink, type FooterProps, type FooterSocialLink, GalleryPhoto, type GalleryPhotoData, type GalleryPhotoProps, GallerySection, type GallerySectionProps, Hero, type HeroProps, type HeroReview, type HeroVariant, HomeHero, type HomeHeroProps, type HomeHeroReview, type HomeHeroTypewriterOptions, LocationCard, type LocationCardProps, type LocationItem, type MonthTab, MonthTabs, type MonthTabsProps, type NavCategory, type NavCategoryItem, type NavLink, Navbar, type NavbarProps, OfficesSection, type OfficesSectionProps, PackageCard, type PackageCardProps, type PackageItem, PackagesCarousel, type PackagesCarouselProps, SectionHeader, type SectionHeaderAlign, type SectionHeaderProps, SiteHeader, type SiteHeaderProps, TeamInfoCard, type TeamInfoCardProps, type TeamMember, TeamSection, type TeamSectionProps, type TeamSocialLink, TestimonialCard, type TestimonialCardProps, type TestimonialItem, TestimonialsCarousel, type TestimonialsCarouselProps, TextSection, type TextSectionAlign, type TextSectionProps, type Theme, TripCategoryCard, type TripCategoryCardProps, type TripsCategoryItem, TripsCategorySection, type TripsCategorySectionCta, type TripsCategorySectionProps, UctMobileBanner, type UctMobileBannerProps, type ValueItem, ValuesSection, type ValuesSectionProps, type Warrior, WarriorCard, type WarriorCardProps, WarriorsSection, type WarriorsSectionProps, type WhyChooseFeature, WhyChooseSection, type WhyChooseSectionProps, theme };

package/dist/index.d.ts

@@ -638,6 +638,15 @@ interface TripsCategorySectionProps extends HTMLAttributes<HTMLElement> {
 
 declare const TripsCategorySection: react.ForwardRefExoticComponent<TripsCategorySectionProps & react.RefAttributes<HTMLElement>>;
 
+interface UctMobileBannerProps extends Omit<HTMLAttributes<HTMLAnchorElement>, 'href'> {
+    href: string;
+    videoUrl?: string | undefined;
+    posterUrl?: string | undefined;
+    LinkComponent?: ElementType | undefined;
+}
+
+declare const UctMobileBanner: react.ForwardRefExoticComponent<UctMobileBannerProps & react.RefAttributes<HTMLAnchorElement>>;
+
 interface ValuesSectionProps extends HTMLAttributes<HTMLElement> {
     heading: string;
     subheading?: string | undefined;
@@ -723,4 +732,4 @@ declare const theme: {
 };
 type Theme = typeof theme;
 
-export { BottomNav, type BottomNavItem, type BottomNavProps, type Brand, BrandLogo, type BrandLogoProps, BrandsSection, type BrandsSectionProps, CategoryNavbar, type CategoryNavbarProps, ContactForm, type ContactFormCountryCode, type ContactFormDestination, type ContactFormProps, type ContactFormValues, ContactSection, type ContactSectionProps, CtaBanner, type CtaBannerCta, type CtaBannerProps, DestinationCard, type DestinationCardProps, type DestinationItem, DestinationsSection, type DestinationsSectionProps, EventBanner, type EventBannerProps, EventCarousel, type EventCarouselImageItem, type EventCarouselProps, type EventCarouselVideoItem, EventVideoBanner, type EventVideoBannerProps, ExpandableValueCard, type ExpandableValueCardProps, ExploreCard, type ExploreCardProps, type ExploreItem, ExploreSection, type ExploreSectionProps, FaqExpandable, type FaqExpandableProps, type FaqItem, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, Footer, type FooterColumn, type FooterContact, type FooterLink, type FooterProps, type FooterSocialLink, GalleryPhoto, type GalleryPhotoData, type GalleryPhotoProps, GallerySection, type GallerySectionProps, Hero, type HeroProps, type HeroReview, type HeroVariant, HomeHero, type HomeHeroProps, type HomeHeroReview, type HomeHeroTypewriterOptions, LocationCard, type LocationCardProps, type LocationItem, type MonthTab, MonthTabs, type MonthTabsProps, type NavCategory, type NavCategoryItem, type NavLink, Navbar, type NavbarProps, OfficesSection, type OfficesSectionProps, PackageCard, type PackageCardProps, type PackageItem, PackagesCarousel, type PackagesCarouselProps, SectionHeader, type SectionHeaderAlign, type SectionHeaderProps, SiteHeader, type SiteHeaderProps, TeamInfoCard, type TeamInfoCardProps, type TeamMember, TeamSection, type TeamSectionProps, type TeamSocialLink, TestimonialCard, type TestimonialCardProps, type TestimonialItem, TestimonialsCarousel, type TestimonialsCarouselProps, TextSection, type TextSectionAlign, type TextSectionProps, type Theme, TripCategoryCard, type TripCategoryCardProps, type TripsCategoryItem, TripsCategorySection, type TripsCategorySectionCta, type TripsCategorySectionProps, type ValueItem, ValuesSection, type ValuesSectionProps, type Warrior, WarriorCard, type WarriorCardProps, WarriorsSection, type WarriorsSectionProps, type WhyChooseFeature, WhyChooseSection, type WhyChooseSectionProps, theme };
+export { BottomNav, type BottomNavItem, type BottomNavProps, type Brand, BrandLogo, type BrandLogoProps, BrandsSection, type BrandsSectionProps, CategoryNavbar, type CategoryNavbarProps, ContactForm, type ContactFormCountryCode, type ContactFormDestination, type ContactFormProps, type ContactFormValues, ContactSection, type ContactSectionProps, CtaBanner, type CtaBannerCta, type CtaBannerProps, DestinationCard, type DestinationCardProps, type DestinationItem, DestinationsSection, type DestinationsSectionProps, EventBanner, type EventBannerProps, EventCarousel, type EventCarouselImageItem, type EventCarouselProps, type EventCarouselVideoItem, EventVideoBanner, type EventVideoBannerProps, ExpandableValueCard, type ExpandableValueCardProps, ExploreCard, type ExploreCardProps, type ExploreItem, ExploreSection, type ExploreSectionProps, FaqExpandable, type FaqExpandableProps, type FaqItem, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, Footer, type FooterColumn, type FooterContact, type FooterLink, type FooterProps, type FooterSocialLink, GalleryPhoto, type GalleryPhotoData, type GalleryPhotoProps, GallerySection, type GallerySectionProps, Hero, type HeroProps, type HeroReview, type HeroVariant, HomeHero, type HomeHeroProps, type HomeHeroReview, type HomeHeroTypewriterOptions, LocationCard, type LocationCardProps, type LocationItem, type MonthTab, MonthTabs, type MonthTabsProps, type NavCategory, type NavCategoryItem, type NavLink, Navbar, type NavbarProps, OfficesSection, type OfficesSectionProps, PackageCard, type PackageCardProps, type PackageItem, PackagesCarousel, type PackagesCarouselProps, SectionHeader, type SectionHeaderAlign, type SectionHeaderProps, SiteHeader, type SiteHeaderProps, TeamInfoCard, type TeamInfoCardProps, type TeamMember, TeamSection, type TeamSectionProps, type TeamSocialLink, TestimonialCard, type TestimonialCardProps, type TestimonialItem, TestimonialsCarousel, type TestimonialsCarouselProps, TextSection, type TextSectionAlign, type TextSectionProps, type Theme, TripCategoryCard, type TripCategoryCardProps, type TripsCategoryItem, TripsCategorySection, type TripsCategorySectionCta, type TripsCategorySectionProps, UctMobileBanner, type UctMobileBannerProps, type ValueItem, ValuesSection, type ValuesSectionProps, type Warrior, WarriorCard, type WarriorCardProps, WarriorsSection, type WarriorsSectionProps, type WhyChooseFeature, WhyChooseSection, type WhyChooseSectionProps, theme };

package/dist/index.js

@@ -276,33 +276,50 @@ EventBanner.displayName = "EventBanner";
 var frameClass2 = "block w-full h-[300px] overflow-hidden rounded-md no-underline text-inherit focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2";
 var videoClass = "block w-full h-full object-cover";
 var EventVideoBanner = forwardRef(
-  ({ posterUrl, videoUrl, alt, href, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("shrink-0 w-full snap-start", className), ...rest, children: href ? /* @__PURE__ */ jsx("a", { href, className: frameClass2, children: /* @__PURE__ */ jsx(
-    "video",
-    {
-      src: videoUrl,
-      poster: posterUrl,
-      "aria-label": alt,
-      muted: true,
-      autoPlay: true,
-      loop: true,
-      playsInline: true,
-      preload: "metadata",
-      className: videoClass
-    }
-  ) }) : /* @__PURE__ */ jsx("div", { className: frameClass2, children: /* @__PURE__ */ jsx(
-    "video",
-    {
-      src: videoUrl,
-      poster: posterUrl,
-      "aria-label": alt,
-      muted: true,
-      autoPlay: true,
-      loop: true,
-      playsInline: true,
-      preload: "metadata",
-      className: videoClass
-    }
-  ) }) })
+  ({ posterUrl, videoUrl, alt, href, className, ...rest }, ref) => {
+    const videoRef = useRef(null);
+    useEffect(() => {
+      const video = videoRef.current;
+      if (!video || !videoUrl) return;
+      if (!videoUrl.includes(".m3u8")) {
+        video.src = videoUrl;
+        return;
+      }
+      if (video.canPlayType("application/vnd.apple.mpegurl")) {
+        video.src = videoUrl;
+        return;
+      }
+      let cancelled = false;
+      import('hls.js').then(({ default: Hls }) => {
+        if (cancelled || !Hls.isSupported()) return;
+        const hls = new Hls({ autoStartLoad: true, startLevel: -1 });
+        hls.loadSource(videoUrl);
+        hls.attachMedia(video);
+        video._hls = hls;
+      });
+      return () => {
+        cancelled = true;
+        const stored = video._hls;
+        stored?.destroy();
+      };
+    }, [videoUrl]);
+    const videoEl = /* @__PURE__ */ jsx(
+      "video",
+      {
+        ref: videoRef,
+        src: videoUrl?.includes(".m3u8") ? void 0 : videoUrl,
+        poster: posterUrl,
+        "aria-label": alt,
+        muted: true,
+        autoPlay: true,
+        loop: true,
+        playsInline: true,
+        preload: "metadata",
+        className: videoClass
+      }
+    );
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("shrink-0 w-full snap-start", className), ...rest, children: href ? /* @__PURE__ */ jsx("a", { href, className: frameClass2, children: videoEl }) : /* @__PURE__ */ jsx("div", { className: frameClass2, children: videoEl }) });
+  }
 );
 EventVideoBanner.displayName = "EventVideoBanner";
 var ExpandableValueCard = forwardRef(
@@ -2788,6 +2805,94 @@ var TripsCategorySection = 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 = forwardRef(
+  ({
+    href,
+    videoUrl = UCT_VIDEO_DEFAULT,
+    posterUrl = UCT_POSTER_DEFAULT,
+    LinkComponent,
+    className,
+    ...rest
+  }, ref) => {
+    const Link = LinkComponent ?? "a";
+    return /* @__PURE__ */ jsx(
+      Link,
+      {
+        ref,
+        href,
+        className: cn(
+          "flex justify-center no-underline outline-none select-none [-webkit-tap-highlight-color:transparent]",
+          className
+        ),
+        ...rest,
+        children: /* @__PURE__ */ jsxs("div", { className: "relative w-full mx-4", children: [
+          /* @__PURE__ */ 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__ */ jsx(
+            "video",
+            {
+              src: videoUrl,
+              poster: posterUrl,
+              muted: true,
+              loop: true,
+              autoPlay: true,
+              playsInline: true,
+              className: "w-full h-full object-cover rounded-full"
+            }
+          ) }),
+          /* @__PURE__ */ 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__ */ jsx("span", { className: "text-[#f5fdff] text-base font-medium leading-7 font-[inherit]", children: "Upcoming Community Trips" }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: "inline-flex",
+                    style: { animation: "uct-move-arrow 1.5s infinite" },
+                    children: /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: /* @__PURE__ */ jsx(
+                      "path",
+                      {
+                        d: "M13 6L19 12L13 18M5 6L11 12L5 18",
+                        stroke: "white",
+                        strokeWidth: "1.5",
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round"
+                      }
+                    ) })
+                  }
+                ),
+                /* @__PURE__ */ 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__ */ 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__ */ 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 = forwardRef(
   ({ heading: heading2, subheading, values, singleOpen = false, className, ...rest }, ref) => {
     const [openIndex, setOpenIndex] = useState(null);
@@ -2971,6 +3076,6 @@ var theme = {
   layout
 };
 
-export { BottomNav, BrandLogo, BrandsSection, CategoryNavbar, ContactForm, ContactSection, CtaBanner, DestinationCard, DestinationsSection, EventBanner, EventCarousel, EventVideoBanner, ExpandableValueCard, ExploreCard, ExploreSection, FaqExpandable, FaqSection, FeatureCard, Footer, GalleryPhoto, GallerySection, Hero, HomeHero, LocationCard, MonthTabs, Navbar, OfficesSection, PackageCard, PackagesCarousel, SectionHeader, SiteHeader, TeamInfoCard, TeamSection, TestimonialCard, TestimonialsCarousel, TextSection, TripCategoryCard, TripsCategorySection, ValuesSection, WarriorCard, WarriorsSection, WhyChooseSection, theme };
+export { BottomNav, BrandLogo, BrandsSection, CategoryNavbar, ContactForm, ContactSection, CtaBanner, DestinationCard, DestinationsSection, EventBanner, EventCarousel, EventVideoBanner, ExpandableValueCard, ExploreCard, ExploreSection, FaqExpandable, FaqSection, FeatureCard, Footer, GalleryPhoto, GallerySection, Hero, HomeHero, LocationCard, MonthTabs, Navbar, OfficesSection, PackageCard, PackagesCarousel, SectionHeader, SiteHeader, TeamInfoCard, TeamSection, TestimonialCard, TestimonialsCarousel, TextSection, TripCategoryCard, TripsCategorySection, UctMobileBanner, ValuesSection, WarriorCard, WarriorsSection, WhyChooseSection, theme };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map