@luxonis/component-lib 1.0.12 → 1.1.1

package/dist/index.js

@@ -45,9 +45,12 @@ __export(index_exports, {
   ChatButton: () => ChatButton,
   Checkbox: () => Checkbox,
   CodeBlock: () => CodeBlock,
+  ContactUsForm: () => ContactUsForm,
+  ContactUsSection: () => ContactUsSection,
   Copyright: () => Copyright,
   Description: () => Description,
   DualRangeSlider: () => DualRangeSlider,
+  EdgeSlideshow: () => EdgeSlideshow,
   FrostedCard: () => FrostedCard,
   Hero: () => Hero,
   HoverCard: () => HoverCard,
@@ -55,6 +58,7 @@ __export(index_exports, {
   HoverCardTrigger: () => HoverCardTrigger,
   Input: () => Input,
   Label: () => Label,
+  Progress: () => Progress,
   SearchBar: () => SearchBar,
   Select: () => Select,
   SelectContent: () => SelectContent,
@@ -66,6 +70,8 @@ __export(index_exports, {
   SelectSeparator: () => SelectSeparator,
   SelectTrigger: () => SelectTrigger,
   SelectValue: () => SelectValue,
+  StereoDepthCalibration: () => StereoDepthCalibration,
+  Support: () => Support,
   Switch: () => Switch,
   Table: () => Table,
   TableBody: () => TableBody,
@@ -79,6 +85,7 @@ __export(index_exports, {
   TabsContent: () => TabsContent,
   TabsList: () => TabsList,
   TabsTrigger: () => TabsTrigger,
+  TalkToSalesButton: () => TalkToSalesButton,
   Text: () => Text,
   Textarea: () => Textarea,
   Tooltip: () => Tooltip,
@@ -86,9 +93,56 @@ __export(index_exports, {
   TooltipProvider: () => TooltipProvider,
   TooltipTrigger: () => TooltipTrigger,
   Video: () => Video,
+  aboutUs: () => aboutUs,
+  accessoriesProducts: () => accessoriesProducts,
+  applyMail: () => applyMail,
+  applyMailClean: () => applyMailClean,
   badgeVariants: () => badgeVariants,
+  blog: () => blog,
+  bloomberg: () => bloomberg,
   buttonVariants: () => buttonVariants,
-  parseNewLines: () => parseNewLines
+  camerasProducts: () => camerasProducts,
+  careers: () => careers,
+  certificates: () => certificates,
+  contactLink: () => contactLink,
+  depthaiHardwareProject: () => depthaiHardwareProject,
+  discord: () => discord,
+  distributorForm: () => distributorForm,
+  distributors: () => distributors,
+  docs: () => docs,
+  earlyAccessProducts: () => earlyAccessProducts,
+  forbes: () => forbes,
+  forum: () => forum,
+  getStoreSearchLink: () => getStoreSearchLink,
+  github: () => github,
+  kickstarter: () => kickstarter,
+  linkedin: () => linkedin,
+  marketing: () => marketing,
+  modulesProducts: () => modulesProducts,
+  oakRealsenseDocs: () => oakRealsenseDocs,
+  parseNewLines: () => parseNewLines,
+  privacy: () => privacy,
+  raeStorepage: () => raeStorepage,
+  replayInstructions: () => replayInstructions,
+  robothub: () => robothub,
+  robothubInternal: () => robothubInternal,
+  salesMail: () => salesMail,
+  salesMailClean: () => salesMailClean,
+  services: () => services,
+  servicesMeetLink: () => servicesMeetLink,
+  showcase: () => showcase,
+  showcaseMail: () => showcaseMail,
+  showcaseMailClean: () => showcaseMailClean,
+  status: () => status,
+  store: () => store,
+  supportForm: () => supportForm,
+  supportMail: () => supportMail,
+  supportMailClean: () => supportMailClean,
+  techcrunch: () => techcrunch,
+  termsOfService: () => termsOfService,
+  twitter: () => twitter,
+  useRudderStackAnalytics: () => useRudderStackAnalytics,
+  youtube: () => youtube
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -672,6 +726,7 @@ var DescriptionRecepie = (0, import_class_variance_authority7.cva)("flex flex-co
       center: "items-start sm:items-center",
       allwayscenter: "items-center",
       left: "items-start",
+      right: "items-end",
       leftCenterMobile: "items-start sm:items-center",
       desktopCenterMobileLeft: "w-full items-start !text-left sm:items-center sm:!text-center",
       desktopLeftMobileCenter: "w-full items-center !text-center lg:items-start lg:!text-left"
@@ -713,7 +768,7 @@ var Description = (props) => {
     descriptionStyle,
     wrapperClassName
   } = props;
-  const alingText = align === "left" || align === "desktopLeftMobileCenter" ? "left" : "center";
+  const alingText = align === "left" || align === "desktopLeftMobileCenter" ? "left" : align === "right" ? "right" : "center";
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: (0, import_class_variance_authority7.cx)(DescriptionRecepie({ align, gap }), className), children: [
     /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: (0, import_class_variance_authority7.cx)(`flex flex-col gap-4 sm:gap-6 w-full`, wrapperClassName ?? "", InnerGap({ innerGap })), children: [
       subTitle && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
@@ -1638,6 +1693,687 @@ var TabsContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+// src/ProgressBar.tsx
+var React16 = __toESM(require("react"));
+var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"));
+var import_class_variance_authority22 = require("class-variance-authority");
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var Progress = React16.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+  ProgressPrimitive.Root,
+  {
+    ref,
+    className: (0, import_class_variance_authority22.cx)("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className),
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+      ProgressPrimitive.Indicator,
+      {
+        className: "size-full flex-1 bg-primary transition-all",
+        style: { transform: `translateX(-${100 - (value || 0)}%)` }
+      }
+    )
+  }
+));
+Progress.displayName = ProgressPrimitive.Root.displayName;
+
+// src/EdgeSlideshow.tsx
+var import_react14 = require("react");
+var import_react_intersection_observer = require("react-intersection-observer");
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var slides = [
+  "ai-performance",
+  //'stereo-depth',
+  //'video-streaming',
+  "processing-efficiency",
+  "custom-vision"
+];
+function getNextSlide(currentSlide) {
+  const currentIndex = slides.indexOf(currentSlide);
+  const nextIndex = (currentIndex + 1) % slides.length;
+  return slides[nextIndex];
+}
+function getSlideInfo(slide) {
+  switch (slide) {
+    case "ai-performance":
+      return {
+        title: "AI Performance",
+        imageUrl: "ai-performance.webp",
+        imageAlt: "AI Performance",
+        content: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "48 TOPS INT8 / 12 TOPS FP16:",
+              description: "Handle complex neural models effortlessly, from object detection to segmentation."
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "Run YOLO, ResNet, MobileNet (90+Models):",
+              description: "Optimized for high throughput and low latency."
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "Inference Speed:",
+              description: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("article", { className: "flex flex-row flex-wrap items-start gap-2 lg:items-center", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowTextPointButton, { text: "YOLOv5m: 280 FPS" }),
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowTextPointButton, { text: "ResNet-50: 934 FPS" }),
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowTextPointButton, { text: "BiseNetv1-MBNV2: 647 FPS" })
+              ] })
+            }
+          )
+        ] })
+      };
+    //case 'stereo-depth':
+    //  return {
+    //    title: 'Stereo Depth Precision',
+    //    imageUrl: 'stereo-depth.webp',
+    //    imageAlt: 'Stereo Depth',
+    //    content: (
+    //      <>
+    //        <EdgeSlideshowTextPoint
+    //          title="Subpixel Accuracy:"
+    //          description="Up to 1/32 subpixel, enabling precise depth maps for real-world applications."
+    //        />
+    //        <EdgeSlideshowTextPoint
+    //          title="High Resolution:"
+    //          description="Stereo depth at 720p @ 60 FPS with configurable disparity ranges."
+    //        />
+    //        <EdgeSlideshowTextPoint
+    //          title="Advanced Features:"
+    //          description="Confidence mapping, neural network based depth matching, and fine-tuning parameters tailored to any environment."
+    //        />
+    //      </>
+    //    ),
+    //  };
+    //case 'video-streaming':
+    //  return {
+    //    title: 'Video Streaming',
+    //    imageUrl: 'video-streaming.webp',
+    //    imageAlt: 'Video Streaming',
+    //    content: (
+    //      <>
+    //        <EdgeSlideshowTextPoint
+    //          title="Encoding:"
+    //          description={<EdgeSlideshowTextPointButton text={'4K @ 120 FPS (H.264/H.265)'} />}
+    //        />
+    //        <EdgeSlideshowTextPoint
+    //          title="Decoding:"
+    //          description={<EdgeSlideshowTextPointButton text={'4K @ 240 FPS, with VP9 and AV1 support'} />}
+    //        />
+    //        <EdgeSlideshowTextPoint
+    //          title="ISP:"
+    //          description={
+    //            <article className="flex flex-row flex-wrap gap-2 items-start lg:items-center">
+    //              <EdgeSlideshowTextPointButton text={'5 camera streams'} />
+    //              <EdgeSlideshowTextPointButton text={'HDR'} />
+    //              <EdgeSlideshowTextPointButton text={'EIS'} />
+    //              <EdgeSlideshowTextPointButton text={'3A'} />
+    //              <EdgeSlideshowTextPointButton text={'up to 3x 8K @ 30FPS'} />
+    //            </article>
+    //          }
+    //        />
+    //      </>
+    //    ),
+    //  };
+    case "processing-efficiency":
+      return {
+        title: "Processing Efficiency",
+        imageUrl: "processing-efficiency.webp",
+        imageAlt: "Processing Efficiency",
+        content: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "Power Consumption:",
+              description: "Average 10\u201315W, balancing performance and energy efficiency for edge deployments."
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "Compact Design:",
+              description: "Fully integrated processing in a device that fits in your hand."
+            }
+          )
+        ] })
+      };
+    case "custom-vision":
+      return {
+        title: "Custom Vision Engines",
+        imageUrl: "custom-vision.webp",
+        imageAlt: "Custom Vision",
+        content: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "Processing:",
+              description: "Stereo depth, optical flow, and feature detection are processed in parallel on dedicated hardware blocks."
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowTextPoint,
+            {
+              title: "Throughput:",
+              description: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("article", { className: "flex flex-col items-start gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowTextPointButton, { text: "Optical Flow:\nFull-dense at VGA @ 60 FPS" }),
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowTextPointButton, { text: "Template Matching:\n 1080p with 1.2 ms for 500 templates" })
+              ] })
+            }
+          )
+        ] })
+      };
+  }
+}
+function EdgeSlideshowTextPointButton(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    Button,
+    {
+      variant: "primaryAlt",
+      className: "min-h-fit cursor-default whitespace-pre-line rounded-md !p-4 text-start",
+      animate: false,
+      children: props.text
+    }
+  );
+}
+function EdgeSlideshowImage(props) {
+  const { imageAlt, imageUrl } = getSlideInfo(props.activeSlide);
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    "img",
+    {
+      src: `/assets/edge-interference/slideshow/${imageUrl}`,
+      alt: imageAlt,
+      className: "size-full max-w-[1/2] rounded-lg object-cover"
+    }
+  );
+}
+function EdgeSlideshowHeader() {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("header", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text, { text: "The Benchmark for Edge AI", size: "h2", color: "default" }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      Text,
+      {
+        text: "Luxonis devices deliver unparalleled AI performance at the edge, combining neural inference, stereo depth, and real-time vision in one compact package.",
+        size: "lg",
+        color: "default"
+      }
+    )
+  ] });
+}
+function EdgeSlideshowNav(props) {
+  const { activeSlide, setActiveSlide, autoscrolling, inView } = props;
+  const [progress, setProgress] = (0, import_react14.useState)(0);
+  (0, import_react14.useEffect)(() => {
+    let intervalId;
+    const startTime = Date.now();
+    if (autoscrolling && inView) {
+      intervalId = window.setInterval(() => {
+        const elapsed = Date.now() - startTime;
+        const newProgress = Math.min(elapsed / 1e4 * 100, 100);
+        setProgress(newProgress);
+        if (newProgress >= 100) {
+          clearInterval(intervalId);
+          setProgress(0);
+        }
+      }, 100);
+    }
+    return () => {
+      if (intervalId !== void 0) {
+        clearInterval(intervalId);
+      }
+    };
+  }, [autoscrolling, activeSlide, inView]);
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("nav", { className: "flex flex-row items-center gap-3", children: slides.map(
+    (slide, index) => autoscrolling && slides.indexOf(slide) === slides.indexOf(activeSlide) ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      Progress,
+      {
+        onClick: () => setActiveSlide(slide),
+        value: progress,
+        max: 100,
+        className: "!h-3 w-16 cursor-pointer select-none"
+      },
+      index
+    ) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      Badge,
+      {
+        onClick: () => setActiveSlide(slide),
+        variant: activeSlide === slide ? "default" : "secondary",
+        className: "h-3  w-16 cursor-pointer select-none"
+      },
+      slide
+    )
+  ) });
+}
+function EdgeSlideshowTextPoint(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("article", { className: `flex flex-col items-start gap-2`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text, { text: props.title, size: "md", color: "default", weight: "bold" }),
+    typeof props.description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text, { text: props.description, size: "md", color: "default" }) : props.description
+  ] });
+}
+function EdgeSlideshowText(props) {
+  const { activeSlide, setActiveSlide, autoscrolling, inView } = props;
+  const slideInfo = getSlideInfo(activeSlide);
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("section", { className: "flex size-full flex-col justify-between gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("section", { className: "hidden xl:flex", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowHeader, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("article", { className: "flex flex-col items-start gap-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Text, { text: slideInfo.title, size: "h4", color: "primary" }),
+      slideInfo.content,
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        EdgeSlideshowNav,
+        {
+          activeSlide,
+          autoscrolling,
+          inView,
+          setActiveSlide
+        }
+      )
+    ] })
+  ] });
+}
+function EdgeSlideshow() {
+  const [activeSlide, setActiveSlide] = (0, import_react14.useState)("ai-performance");
+  const [autoscrolling, setAutoscrolling] = (0, import_react14.useState)(true);
+  const { ref, inView } = (0, import_react_intersection_observer.useInView)({});
+  (0, import_react14.useEffect)(() => {
+    let intervalId;
+    if (inView) {
+      intervalId = window.setInterval(() => {
+        setActiveSlide(getNextSlide(activeSlide));
+        setAutoscrolling(true);
+      }, 1e4);
+    }
+    return () => {
+      if (intervalId !== void 0) {
+        clearInterval(intervalId);
+      }
+    };
+  }, [inView, activeSlide, setActiveSlide]);
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("section", { className: "page-card  page-padding bg-white", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("section", { className: "flex pb-8  xl:hidden", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowHeader, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+      "div",
+      {
+        ref,
+        className: "page-card-content grid grid-cols-1 items-center justify-center gap-8 lg:justify-around lg:gap-24 xl:grid-cols-2 ",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(EdgeSlideshowImage, { activeSlide }),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            EdgeSlideshowText,
+            {
+              inView,
+              activeSlide,
+              setActiveSlide,
+              autoscrolling
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+
+// src/StereoDepthCalibration.tsx
+var import_react15 = require("@iconify/react");
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var cards = [
+  {
+    title: "Extreme Precision",
+    text: "Alignment on 42 key metrics ensures unparalleled accuracy across stereo pairs.",
+    icon: "uil:crosshair"
+  },
+  {
+    title: "Wide Lens Compatibility",
+    text: "Accommodates a variety of lenses, including super wide-angle optics.",
+    icon: "mage:lens-fill"
+  },
+  {
+    title: "Temperature Compensation",
+    text: "Calibrated for stability across temperature fluctuations.",
+    icon: "fluent:temperature-16-regular"
+  },
+  {
+    title: "Housing Calibration",
+    text: "Fine-tuned for alignment between the camera and its physical enclosure.",
+    icon: "f7:gear-alt-fill"
+  }
+];
+function StereoDepthCalibrationWrapper() {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("section", { className: "page-card-content relative flex size-full flex-col items-center justify-center gap-8 overflow-hidden rounded-lg  bg-black", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      "img",
+      {
+        alt: "Stereo Depth Calibration Background Overlay",
+        src: "https://www.luxonis.com/assets/stereo-depth/stereo-depth-calibration-bg.webp",
+        className: "absolute size-full bg-cover bg-center bg-no-repeat object-cover md:h-5/6"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StereoDepthCalibrationBody, {})
+  ] });
+}
+function StereoDepthCalibrationHeader() {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("header", { className: "flex flex-col items-center justify-center gap-4 pt-6 text-center lg:w-1/2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text, { text: "Rail Calibration", size: "md", color: "muted", className: "uppercase" }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text, { text: "Starting on the Right Track", size: "h2", color: "white" }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      Text,
+      {
+        text: "Our patent pending rail calibration process guarantees unmatched consistency.",
+        size: "lg",
+        color: "white"
+      }
+    )
+  ] });
+}
+function StereoDepthCalibrationFooter() {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("footer", { className: "mt-10 flex flex-col items-start gap-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      Text,
+      {
+        text: "From lenses to housing, every component is precisely aligned for dependable performance.",
+        size: "h4",
+        color: "white",
+        className: "w-full lg:w-2/5"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StereoDepthCalibrationFooterCards, {})
+  ] });
+}
+function StereoDepthCalibrationFooterCard(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(FrostedCard, { className: "flex h-full flex-col items-start justify-start gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react15.Icon, { icon: props.icon, width: 32, height: 32, className: "card-icon" }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text, { text: props.title, size: "lg", color: "white", weight: "semibold" }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text, { text: props.text, size: "sm", color: "white" })
+  ] });
+}
+function StereoDepthCalibrationFooterCards() {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("section", { className: "grid size-full grid-cols-1 items-center justify-center gap-8 md:grid-cols-2 xl:grid-cols-4", children: cards.map((card) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StereoDepthCalibrationFooterCard, { ...card }, card.title)) });
+}
+function StereoDepthCalibrationBody() {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("section", { className: " z-[1] flex size-full flex-col items-center justify-start overflow-hidden rounded-lg p-4 lg:p-12", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StereoDepthCalibrationHeader, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StereoDepthCalibrationFooter, {})
+  ] });
+}
+function StereoDepthCalibration() {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("section", { className: "page-card page-padding bg-white", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StereoDepthCalibrationWrapper, {}) });
+}
+
+// src/Support.tsx
+var import_class_variance_authority23 = require("class-variance-authority");
+
+// src/links.ts
+var github = "https://github.com/luxonis/";
+var twitter = "https://twitter.com/luxonis";
+var linkedin = "https://www.linkedin.com/company/luxonis/";
+var youtube = "https://www.youtube.com/c/Luxonis";
+var discord = "https://www.luxonis.com/discord";
+var docs = "https://docs.luxonis.com/en/latest/";
+var forum = "https://discuss.luxonis.com/";
+var status = "https://status.luxonis.com/";
+var store = "https://shop.luxonis.com/";
+var oakRealsenseDocs = "https://docs.luxonis.com/projects/hardware/en/latest/pages/guides/realsense_comparison.html";
+var distributorForm = "https://docs.google.com/forms/d/e/1FAIpQLSeVo9QREQxPsIxiHCAfyEgnI2kK88W4r6dUkCTbYfH_R5emAQ/viewform?vc=0&c=0&w=1&flr=0";
+var kickstarter = "https://www.kickstarter.com/projects/opencv/rae-0";
+var raeStorepage = "https://shop.luxonis.com/collections/early-access/products/rae";
+var robothub = "https://hub.luxonis.com/join";
+var depthaiHardwareProject = "https://github.com/luxonis/depthai-hardware/tree/master/DM1095_OAK-D-LITE-DEV_DepthAI_USB3C";
+var getStoreSearchLink = (search) => {
+  return `https://shop.luxonis.com/search?q=${search}`;
+};
+var supportMail = "mailto:support@luxonis.com";
+var supportMailClean = "support@luxonis.com";
+var salesMail = "mailto:orders@luxonis.com";
+var salesMailClean = "orders@luxonis.com";
+var applyMail = "mailto:careers@luxonis.com";
+var applyMailClean = "careers@luxonis.com";
+var showcaseMail = "mailto:support@luxonis.com";
+var showcaseMailClean = "support@luxonis.com";
+var blog = "https://discuss.luxonis.com/blog";
+var privacy = "/privacy";
+var termsOfService = "/terms-of-service";
+var aboutUs = "/about-us";
+var showcase = "/solutions";
+var careers = "/careers";
+var distributors = "/distributors";
+var marketing = "/marketing";
+var robothubInternal = "/hub";
+var certificates = "/certificates";
+var services = "/services";
+var bloomberg = "https://www.bloomberg.com/news/articles/2021-03-11/oak-d-device-paves-the-way-for-future-spatial-ai";
+var forbes = "https://www.forbes.com/sites/gusalexiou/2021/03/24/cutting-edge-intel-ai-powered-backpack-could-replace-a-guide-dog-for-blind-people/?sh=70bb63d01b36";
+var techcrunch = "https://techcrunch.com/2020/07/14/opencv-ai-kit-aims-to-do-for-computer-vision-what-raspberry-pi-did-for-hobbyist-hardware/";
+var camerasProducts = "https://shop.luxonis.com/collections/oak-cameras-1";
+var modulesProducts = "https://shop.luxonis.com/collections/oak-modules";
+var accessoriesProducts = "https://shop.luxonis.com/collections/accessories";
+var earlyAccessProducts = "https://shop.luxonis.com/collections/early-access";
+var supportForm = "https://share-eu1.hsforms.com/1qY1TD1LgRU27qYXxzRyHNgf2chh";
+var servicesMeetLink = "https://meetings-eu1.hubspot.com/bradley1/luxonis-services-";
+var replayInstructions = "https://docs-beta.luxonis.com/cloud/perception-apps/robothub-library/replay/";
+var contactLink = "https://meetings-eu1.hubspot.com/cj-mann/cj-demo";
+
+// src/TalkToSalesButton.tsx
+var import_jsx_runtime29 = require("react/jsx-runtime");
+function TalkToSalesButton() {
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("a", { href: contactLink, target: "_blank", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button, { variant: "secondary", color: "white", role: "continue", children: "Talk to Sales" }) });
+}
+
+// src/ContactUsForm.tsx
+var import_zod = require("zod");
+var import_react17 = __toESM(require("react"));
+
+// src/useRudderAnalytics.ts
+var import_react16 = require("react");
+var useRudderStackAnalytics = () => {
+  const [analytics, setAnalytics] = (0, import_react16.useState)();
+  (0, import_react16.useEffect)(() => {
+    if (!analytics) {
+      const initialize = async () => {
+        const { RudderAnalytics } = await import("@rudderstack/analytics-js");
+        const analyticsInstance = new RudderAnalytics();
+        if (!process.env.NEXT_PUBLIC_RUDDERSTACK_WRITE_KEY || !process.env.NEXT_PUBLIC_RUDDERSTACK_DATAPLANE) {
+          console.warn("RudderStack not configured");
+          return;
+        }
+        analyticsInstance.load(
+          process.env.NEXT_PUBLIC_RUDDERSTACK_WRITE_KEY,
+          process.env.NEXT_PUBLIC_RUDDERSTACK_DATAPLANE,
+          {
+            storage: { type: "memoryStorage" }
+          }
+          // Disables storage of events in local storage or cookies
+        );
+        window.rudderanalytics = analyticsInstance;
+        setAnalytics(analyticsInstance);
+      };
+      initialize().catch((e) => console.log(e));
+    }
+  }, [analytics]);
+  return analytics;
+};
+
+// src/ContactUsForm.tsx
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var formSchema = import_zod.z.object({
+  name: import_zod.z.string().min(1),
+  company: import_zod.z.string().min(1),
+  email: import_zod.z.string().email(),
+  message: import_zod.z.string().min(1),
+  inquiry: import_zod.z.string().min(1)
+});
+function ContactUsForm() {
+  const [formSubmitted, setFormSubmitted] = import_react17.default.useState(false);
+  const [formHasError, setFormHasError] = import_react17.default.useState(false);
+  const [formIsLoading, setFormIsLoading] = import_react17.default.useState(false);
+  const analytics = useRudderStackAnalytics();
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    setFormIsLoading(true);
+    const [nameInput, companyInput, emailInput, inquiryInput, messageInput] = [
+      document.getElementById("name"),
+      document.getElementById("company"),
+      document.getElementById("email"),
+      document.getElementById("inquiry"),
+      document.getElementById("message")
+    ];
+    const formData = {
+      name: nameInput.value,
+      company: companyInput.value,
+      email: emailInput.value,
+      inquiry: inquiryInput.textContent,
+      message: messageInput.value
+    };
+    setFormHasError(false);
+    const parsedData = formSchema.safeParse(formData);
+    if (parsedData.error || !parsedData.data) {
+      console.warn("Form contains errors!", parsedData.error);
+      setFormHasError(true);
+      setFormIsLoading(false);
+      return;
+    }
+    if (!analytics) {
+      console.warn("Rudder Stack not running");
+      setFormIsLoading(false);
+      return;
+    }
+    analytics.identify(
+      parsedData.data.email,
+      {
+        ...parsedData
+      },
+      () => {
+        console.debug("User identified.");
+      }
+    );
+    analytics.track(
+      "Contact Form Submitted",
+      {
+        message: "Message from contact form",
+        reasonForContact: parsedData.data,
+        privacyPolicyAccepted: true,
+        formData
+      },
+      () => {
+        setFormIsLoading(false);
+        console.debug("Form submission event tracked.");
+      }
+    );
+    setFormSubmitted(true);
+  };
+  if (formSubmitted) {
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "m-auto flex size-full  h-[456px]  flex-col items-center justify-center px-4", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      Text,
+      {
+        size: "h4",
+        text: "Thank you for your message. We will get back to you soon.",
+        color: "white",
+        className: "my-auto text-center"
+      }
+    ) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("form", { id: "contact-form-anchor", className: "flex w-full flex-col gap-6  text-white", onSubmit: handleSubmit, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex w-full flex-col gap-6 lg:flex-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "font-normal", htmlFor: "name", children: "Name *" }),
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Input, { type: "text", id: "name", placeholder: "E.g. Hanna Johns" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "font-normal", htmlFor: "Company", children: "Company *" }),
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Input, { type: "text", id: "company", placeholder: "E.g. Hanna" })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "font-normal", htmlFor: "email", children: "E-mail *" }),
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Input, { type: "email", id: "email", placeholder: "E.g. info@email.com" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "font-normal", htmlFor: "inquiry", children: "Type of Inquiry *" }),
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Select, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectTrigger, { className: "h-[48px] bg-white text-black ", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectValue, { id: "inquiry", placeholder: "Select..." }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(SelectContent, { className: "bg-white", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectItem, { value: "Hub assistance", children: "Hub assistance" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectItem, { value: "hardware-issue", children: "Hardware issue" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectItem, { value: "support", children: "Support" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectItem, { value: "training", children: "Training" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectItem, { value: "other", children: "Other" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "font-normal", htmlFor: "message", children: "Message *" }),
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Input, { type: "text", id: "message", placeholder: "Type..." })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-row items-center justify-start gap-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Button, { type: "submit", variant: "secondary", size: "lg", role: "continue", className: "w-fit", children: formIsLoading ? "Submitting..." : "Submit" }),
+      formHasError && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Text, { text: "Please fill out all fields", color: "error", size: "xl" })
+    ] })
+  ] });
+}
+
+// src/Support.tsx
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var Support = (props) => {
+  const { variant = "fullpage", text } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "page-card page-padding", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+    Card,
+    {
+      variant,
+      outerStyles: "h-full",
+      className: (0, import_class_variance_authority23.cx)(
+        "page-card-content mx-auto flex w-full h-full flex-col gap-x-20 gap-y-4 justify-between overflow-hidden bg-gradient-stereo-depth pt-12  xl:p-8  xl:flex-row"
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex w-full flex-col items-center gap-8 px-4 text-white xl:w-fit xl:items-start xl:gap-10 xl:px-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex w-full flex-col items-center gap-4 text-white xl:items-start xl:gap-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Text, { size: "h2", text: text ?? "Need More Help?", className: "max-w-[650px] text-center xl:text-left" }),
+            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+              Text,
+              {
+                size: "lg",
+                text: "Our dedicated team is available for technical support, business solutions, and more. Let us provide the help you need.",
+                className: "w-full max-w-105 text-center xl:text-left"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex w-fit flex-col gap-4 md:flex-row", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TalkToSalesButton, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("a", { href: "https://chat.luxonis.com", target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Button, { size: "lg", variant: "secondary", role: "continue", children: "Get Instant Support" }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "w-full p-4 xl:p-0", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(FrostedCard, { className: "h-full", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ContactUsForm, {}) }) })
+      ]
+    }
+  ) });
+};
+
+// src/ContactUs.tsx
+var import_jsx_runtime32 = require("react/jsx-runtime");
+var ContactUsSection = (props) => {
+  const {
+    title = "Let\u2019s Build \n the Future of \n Vision Together",
+    description = "Our dedicated team is available for technical support, business solutions, and more. Let us provide the help you need."
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("section", { id: "contact-us", className: "page-card page-padding", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("section", { className: "page-card-content flex flex-col gap-8 rounded-lg p-4 pt-12 [background:radial-gradient(416.66%_106.71%_at_76.3%_37.11%,#5724E8_0%,#000_100%),#000] md:p-12 lg:flex-row  lg:justify-between", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      Description,
+      {
+        title,
+        align: "left",
+        textStyle: "max-w-none w-fit lg:max-w-auto  lg:justify-start justify-center lg:text-left text-center",
+        wrapperClassName: "lg:items-start items-center lg:text-left text-center flex",
+        description,
+        className: "text-white ",
+        children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex w-full max-w-[500px] flex-col flex-wrap items-center gap-4 lg:flex-row lg:justify-start", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("a", { href: "https://hub.luxonis.com", target: "_blank", className: "w-fit", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Button, { variant: "secondary", size: "lg", role: "continue", className: "w-full", children: "Start for Free" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(TalkToSalesButton, {})
+        ] })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(FrostedCard, { className: "!p-6", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ContactUsForm, {}) })
+  ] }) });
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Accordion,
@@ -1655,9 +2391,12 @@ TabsContent.displayName = TabsPrimitive.Content.displayName;
   ChatButton,
   Checkbox,
   CodeBlock,
+  ContactUsForm,
+  ContactUsSection,
   Copyright,
   Description,
   DualRangeSlider,
+  EdgeSlideshow,
   FrostedCard,
   Hero,
   HoverCard,
@@ -1665,6 +2404,7 @@ TabsContent.displayName = TabsPrimitive.Content.displayName;
   HoverCardTrigger,
   Input,
   Label,
+  Progress,
   SearchBar,
   Select,
   SelectContent,
@@ -1676,6 +2416,8 @@ TabsContent.displayName = TabsPrimitive.Content.displayName;
   SelectSeparator,
   SelectTrigger,
   SelectValue,
+  StereoDepthCalibration,
+  Support,
   Switch,
   Table,
   TableBody,
@@ -1689,6 +2431,7 @@ TabsContent.displayName = TabsPrimitive.Content.displayName;
   TabsContent,
   TabsList,
   TabsTrigger,
+  TalkToSalesButton,
   Text,
   Textarea,
   Tooltip,
@@ -1696,7 +2439,54 @@ TabsContent.displayName = TabsPrimitive.Content.displayName;
   TooltipProvider,
   TooltipTrigger,
   Video,
+  aboutUs,
+  accessoriesProducts,
+  applyMail,
+  applyMailClean,
   badgeVariants,
+  blog,
+  bloomberg,
   buttonVariants,
-  parseNewLines
+  camerasProducts,
+  careers,
+  certificates,
+  contactLink,
+  depthaiHardwareProject,
+  discord,
+  distributorForm,
+  distributors,
+  docs,
+  earlyAccessProducts,
+  forbes,
+  forum,
+  getStoreSearchLink,
+  github,
+  kickstarter,
+  linkedin,
+  marketing,
+  modulesProducts,
+  oakRealsenseDocs,
+  parseNewLines,
+  privacy,
+  raeStorepage,
+  replayInstructions,
+  robothub,
+  robothubInternal,
+  salesMail,
+  salesMailClean,
+  services,
+  servicesMeetLink,
+  showcase,
+  showcaseMail,
+  showcaseMailClean,
+  status,
+  store,
+  supportForm,
+  supportMail,
+  supportMailClean,
+  techcrunch,
+  termsOfService,
+  twitter,
+  useRudderStackAnalytics,
+  youtube
 });