@burdenoff/website-sdk 2026.522.3 → 2026.522.5

package/dist/index.mjs

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { createContext, useMemo, useContext, useState, useCallback, useLayoutEffect, useRef, useEffect } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Instagram, Youtube, Facebook, Github, Linkedin, Twitter, Mail, Phone, MapPin, Clock, Send, FileText, Download } from 'lucide-react';
-import ReCAPTCHA2 from 'react-google-recaptcha';
+import { Instagram, Youtube, Facebook, Github, Linkedin, Twitter, Mail, Phone, MapPin, Clock, Send, CheckCircle, Upload, FileText, Download } from 'lucide-react';
+import ReCAPTCHA3 from 'react-google-recaptcha';
 import { toast } from 'sonner';
 import { Helmet } from 'react-helmet-async';
 import { Slot } from '@radix-ui/react-slot';
@@ -910,7 +910,7 @@ function ContactPage({
               ] }),
               /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
                 effectiveRecaptchaSiteKey && /* @__PURE__ */ jsx("div", { className: "flex justify-center sm:justify-start", children: /* @__PURE__ */ jsx(
-                  ReCAPTCHA2,
+                  ReCAPTCHA3,
                   {
                     ref: recaptchaRef,
                     sitekey: effectiveRecaptchaSiteKey
@@ -1489,6 +1489,401 @@ function PartnersPage(props) {
     )
   ] });
 }
+var ALLOWED_RESUME_TYPES = {
+  "application/pdf": "PDF",
+  "application/msword": "DOC",
+  "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "DOCX"
+};
+var EXT_TO_MIME = {
+  pdf: "application/pdf",
+  doc: "application/msword",
+  docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+};
+var DEFAULT_MAX_RESUME_BYTES = 10 * 1024 * 1024;
+function resolveResumeType(file) {
+  if (ALLOWED_RESUME_TYPES[file.type]) return file.type;
+  const ext = file.name.split(".").pop()?.toLowerCase();
+  return ext && EXT_TO_MIME[ext] ? EXT_TO_MIME[ext] : null;
+}
+var SUBMIT_JOB_APPLICATION_MUTATION = (
+  /* GraphQL */
+  `
+  mutation SubmitJobApplication($input: SubmitJobApplicationInput!) {
+    submitJobApplication(input: $input) {
+      success
+      message
+    }
+  }
+`
+);
+function fileToBase64(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => {
+      const result = typeof reader.result === "string" ? reader.result : "";
+      const comma = result.indexOf(",");
+      resolve(comma >= 0 ? result.slice(comma + 1) : result);
+    };
+    reader.onerror = () => reject(new Error("Failed to read the resume file"));
+    reader.readAsDataURL(file);
+  });
+}
+async function submitApplication(client, data, productId) {
+  try {
+    const result = await client.mutate(SUBMIT_JOB_APPLICATION_MUTATION, {
+      input: {
+        firstName: data.firstName,
+        lastName: data.lastName,
+        email: data.email.trim().toLowerCase(),
+        position: data.position,
+        resumeBase64: data.resumeBase64,
+        resumeFileName: data.resumeFileName,
+        resumeContentType: data.resumeContentType,
+        productId,
+        ...data.phone ? { phone: data.phone } : {},
+        ...data.linkedinUrl ? { linkedinUrl: data.linkedinUrl } : {},
+        ...data.portfolioUrl ? { portfolioUrl: data.portfolioUrl } : {},
+        ...data.coverLetter ? { coverLetter: data.coverLetter } : {},
+        ...data.recaptchaToken ? { recaptchaToken: data.recaptchaToken } : {}
+      }
+    });
+    if (result.errors?.length) {
+      return {
+        success: false,
+        message: result.errors[0]?.message ?? "Failed to submit application"
+      };
+    }
+    const response = result.data?.submitJobApplication;
+    return response?.success ? { success: true, message: response.message || "Application submitted!" } : {
+      success: false,
+      message: response?.message || "Failed to submit application"
+    };
+  } catch (error) {
+    console.error("Job application submission error:", error);
+    return { success: false, message: "Network error. Please try again." };
+  }
+}
+function CareersApplyForm({
+  productName,
+  recaptchaSiteKey,
+  positions = [],
+  heroTitle = "Become a part of the team",
+  heroDescription = "Tell us about yourself and upload your resume \u2014 we'll be in touch.",
+  headingLevel = 1,
+  maxResumeBytes = DEFAULT_MAX_RESUME_BYTES,
+  className,
+  seo
+}) {
+  const client = useWebSDK();
+  const config = useWebSDKConfig();
+  const { product } = useProduct();
+  const resolvedProductId = product?.id || config.productId;
+  const displayName = productName ?? product?.name ?? config.productId;
+  const effectiveRecaptchaSiteKey = recaptchaSiteKey ?? config.recaptchaSiteKey ?? "";
+  const recaptchaRef = useRef(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [submitted, setSubmitted] = useState(false);
+  const [resumeFile, setResumeFile] = useState(null);
+  const [resumeType, setResumeType] = useState(null);
+  const [resumeError, setResumeError] = useState(null);
+  const maxMb = Math.floor(maxResumeBytes / (1024 * 1024));
+  const clearResume = () => {
+    setResumeFile(null);
+    setResumeType(null);
+  };
+  const handleFileChange = (e) => {
+    setResumeError(null);
+    const file = e.target.files?.[0] ?? null;
+    if (!file) {
+      clearResume();
+      return;
+    }
+    const type = resolveResumeType(file);
+    if (!type) {
+      clearResume();
+      setResumeError("Resume must be a PDF, DOC, or DOCX file.");
+      return;
+    }
+    if (file.size > maxResumeBytes) {
+      clearResume();
+      setResumeError(`Resume must be ${maxMb}MB or smaller.`);
+      return;
+    }
+    setResumeFile(file);
+    setResumeType(type);
+  };
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    const recaptchaToken = recaptchaRef.current?.getValue() ?? "";
+    if (effectiveRecaptchaSiteKey && !recaptchaToken) {
+      toast.error("Please complete the reCAPTCHA verification");
+      return;
+    }
+    if (!resumeFile) {
+      setResumeError("Please attach your resume (PDF, DOC, or DOCX).");
+      return;
+    }
+    if (!resolvedProductId) {
+      console.warn(
+        "[CareersApplyForm] No productId resolved \u2014 submission will not be attributed to a product."
+      );
+    }
+    const form = e.currentTarget;
+    setIsSubmitting(true);
+    try {
+      const formData = new FormData(form);
+      const resumeBase64 = await fileToBase64(resumeFile);
+      const result = await submitApplication(
+        client,
+        {
+          firstName: formData.get("firstName") ?? "",
+          lastName: formData.get("lastName") ?? "",
+          email: formData.get("email") ?? "",
+          phone: formData.get("phone") || void 0,
+          position: formData.get("position") ?? "",
+          linkedinUrl: formData.get("linkedinUrl") || void 0,
+          portfolioUrl: formData.get("portfolioUrl") || void 0,
+          coverLetter: formData.get("coverLetter") || void 0,
+          resumeBase64,
+          resumeFileName: resumeFile.name,
+          // Use the resolved type (handles browsers that report an empty
+          // file.type for .doc/.docx).
+          resumeContentType: resumeType ?? resumeFile.type,
+          recaptchaToken
+        },
+        resolvedProductId
+      );
+      if (result.success) {
+        setSubmitted(true);
+        toast.success(result.message ?? "Application submitted!");
+      } else {
+        toast.error(result.message ?? "Failed to submit application");
+        recaptchaRef.current?.reset();
+      }
+    } catch (err) {
+      console.error("Careers form error:", err);
+      toast.error("Something went wrong. Please try again.");
+      recaptchaRef.current?.reset();
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+  const Heading = headingLevel === 2 ? "h2" : "h1";
+  const headingClass = headingLevel === 2 ? "text-2xl md:text-3xl font-bold mb-3" : "text-3xl sm:text-4xl md:text-5xl font-bold mb-4 sm:mb-6";
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    seo && /* @__PURE__ */ jsx(
+      PageHead,
+      {
+        title: seo.title ?? `Careers \u2014 ${displayName}`,
+        description: seo.description ?? heroDescription,
+        keywords: seo.keywords
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "section",
+      {
+        className: headingLevel === 2 ? "py-12 md:py-16" : "bg-gradient-to-b from-background to-muted/20 py-12 sm:py-16 md:py-20 lg:py-24",
+        children: /* @__PURE__ */ jsxs("div", { className: "max-w-3xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+          /* @__PURE__ */ jsxs("div", { className: "text-center mb-8 sm:mb-10", children: [
+            /* @__PURE__ */ jsx(Heading, { className: headingClass, children: heroTitle }),
+            /* @__PURE__ */ jsx("p", { className: "text-lg text-muted-foreground leading-relaxed", children: heroDescription })
+          ] }),
+          submitted ? /* @__PURE__ */ jsxs("div", { className: "text-center rounded-xl border border-border bg-card p-10", children: [
+            /* @__PURE__ */ jsx(CheckCircle, { className: "mx-auto mb-4 h-12 w-12 text-accent" }),
+            /* @__PURE__ */ jsx("h3", { className: "text-xl font-semibold text-foreground mb-2", children: "Application received" }),
+            /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground", children: [
+              "Thanks for applying to ",
+              displayName,
+              ". We've emailed you a confirmation and our team will be in touch."
+            ] })
+          ] }) : /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-5", children: [
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-5", children: [
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "firstName", children: "First name *" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "firstName",
+                    name: "firstName",
+                    required: true,
+                    placeholder: "Ada"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "lastName", children: "Last name *" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "lastName",
+                    name: "lastName",
+                    required: true,
+                    placeholder: "Lovelace"
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-5", children: [
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "Email *" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "email",
+                    name: "email",
+                    type: "email",
+                    required: true,
+                    placeholder: "ada@example.com"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "phone", children: "Phone" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "phone",
+                    name: "phone",
+                    placeholder: "+1 555 010 0100"
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: "position", children: "Position *" }),
+              positions.length > 0 ? /* @__PURE__ */ jsxs(
+                "select",
+                {
+                  id: "position",
+                  name: "position",
+                  required: true,
+                  defaultValue: "",
+                  className: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring",
+                  children: [
+                    /* @__PURE__ */ jsx("option", { value: "", disabled: true, children: "Select a role" }),
+                    positions.map((p) => /* @__PURE__ */ jsx("option", { value: p, children: p }, p))
+                  ]
+                }
+              ) : /* @__PURE__ */ jsx(
+                Input,
+                {
+                  id: "position",
+                  name: "position",
+                  required: true,
+                  placeholder: "Role you're applying for"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-5", children: [
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "linkedinUrl", children: "LinkedIn" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "linkedinUrl",
+                    name: "linkedinUrl",
+                    type: "url",
+                    placeholder: "https://linkedin.com/in/\u2026"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "portfolioUrl", children: "Portfolio / GitHub" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "portfolioUrl",
+                    name: "portfolioUrl",
+                    type: "url",
+                    placeholder: "https://\u2026"
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: "coverLetter", children: "Cover letter" }),
+              /* @__PURE__ */ jsx(
+                Textarea,
+                {
+                  id: "coverLetter",
+                  name: "coverLetter",
+                  rows: 5,
+                  placeholder: "Tell us why you'd be a great fit\u2026"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs(Label, { htmlFor: "resume", children: [
+                "Resume * (PDF, DOC, or DOCX \u2014 max ",
+                maxMb,
+                "MB)"
+              ] }),
+              /* @__PURE__ */ jsxs(
+                "label",
+                {
+                  htmlFor: "resume",
+                  className: "mt-1 flex cursor-pointer items-center gap-3 rounded-md border border-dashed border-input bg-background px-4 py-3 text-sm hover:bg-muted/40 transition-colors",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Upload,
+                      {
+                        className: "h-5 w-5 text-muted-foreground",
+                        "aria-hidden": "true"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("span", { className: "text-foreground", children: resumeFile ? resumeFile.name : "Choose a file\u2026" }),
+                    /* @__PURE__ */ jsx(
+                      "input",
+                      {
+                        id: "resume",
+                        name: "resume",
+                        type: "file",
+                        accept: ".pdf,.doc,.docx,application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+                        className: "sr-only",
+                        "aria-describedby": resumeError ? "resume-error" : void 0,
+                        "aria-invalid": resumeError ? true : void 0,
+                        onChange: handleFileChange
+                      }
+                    )
+                  ]
+                }
+              ),
+              resumeError && /* @__PURE__ */ jsx(
+                "p",
+                {
+                  id: "resume-error",
+                  role: "alert",
+                  className: "mt-1 text-sm text-destructive",
+                  children: resumeError
+                }
+              )
+            ] }),
+            effectiveRecaptchaSiteKey && /* @__PURE__ */ jsx(
+              ReCAPTCHA3,
+              {
+                ref: recaptchaRef,
+                sitekey: effectiveRecaptchaSiteKey
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "submit",
+                size: "lg",
+                disabled: isSubmitting,
+                className: "w-full sm:w-auto",
+                children: isSubmitting ? "Submitting\u2026" : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(Send, { className: "mr-2 h-4 w-4" }),
+                  " Submit application"
+                ] })
+              }
+            )
+          ] })
+        ] })
+      }
+    )
+  ] });
+}
 var newsletterSchema = z.object({
   email: z.string().email("Please enter a valid email address")
 });
@@ -1778,7 +2173,7 @@ function NewsletterPage({
             errors.email && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: errors.email.message })
           ] }),
           effectiveRecaptchaSiteKey && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
-            ReCAPTCHA2,
+            ReCAPTCHA3,
             {
               ref: recaptchaRef,
               sitekey: effectiveRecaptchaSiteKey
@@ -1830,7 +2225,7 @@ function NewsletterPage({
               errors.email && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: errors.email.message })
             ] }),
             effectiveRecaptchaSiteKey && /* @__PURE__ */ jsx("div", { className: "flex justify-center sm:justify-start", children: /* @__PURE__ */ jsx(
-              ReCAPTCHA2,
+              ReCAPTCHA3,
               {
                 ref: recaptchaRef,
                 sitekey: effectiveRecaptchaSiteKey
@@ -1999,7 +2394,7 @@ function NewsletterForm({
               }
             ` }),
             /* @__PURE__ */ jsx("div", { style: { position: "relative", zIndex: 50 }, children: /* @__PURE__ */ jsx(
-              ReCAPTCHA2,
+              ReCAPTCHA3,
               {
                 ref: recaptchaRef,
                 sitekey: effectiveRecaptchaSiteKey,
@@ -4496,6 +4891,6 @@ function PressKitPage(props) {
   ] });
 }
 
-export { BlogListPage, BlogPostPage, Button, ContactPage, ContentRenderer, DEFAULT_CONTACT_CATEGORIES, Input, Label, NewsletterForm, NewsletterPage, PageHead, PartnersPage, PressKitPage, PricingPage, PricingSection, ProductProvider, ResourceLinks, RybbitAnalytics, Select, SocialLinks, Textarea, UnsubscribePage, WaitlistForm, WaitlistPage, WebSDKClient, WebSDKProvider, buttonVariants, cn, useContentPage, useContentPages, useProduct, useProductConfig, useWebSDK, useWebSDKConfig };
+export { BlogListPage, BlogPostPage, Button, CareersApplyForm, ContactPage, ContentRenderer, DEFAULT_CONTACT_CATEGORIES, Input, Label, NewsletterForm, NewsletterPage, PageHead, PartnersPage, PressKitPage, PricingPage, PricingSection, ProductProvider, ResourceLinks, RybbitAnalytics, Select, SocialLinks, Textarea, UnsubscribePage, WaitlistForm, WaitlistPage, WebSDKClient, WebSDKProvider, buttonVariants, cn, useContentPage, useContentPages, useProduct, useProductConfig, useWebSDK, useWebSDKConfig };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map