@octaviaflow/core 3.1.0-beta.71 → 3.1.0-beta.72

package/dist/marketing.js

@@ -249,11 +249,12 @@ function isValidEmail(value) {
 }
 
 // src/marketing/components/BetaAccessForm/BetaAccessForm.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function BetaAccessForm({
   title = "Request early access",
   subtitle = "CURRENTLY IN PRIVATE BETA \u2014 WE REVIEW ACCESS REQUESTS WEEKLY",
   fields = "email",
+  nameLayout = "single",
   appearance = "card",
   teamSizes,
   plans,
@@ -274,6 +275,8 @@ function BetaAccessForm({
   const [values, setValues] = useState({
     email: "",
     name: "",
+    firstName: "",
+    lastName: "",
     company: "",
     teamSize: "",
     plan: defaultPlan ?? "",
@@ -289,10 +292,14 @@ function BetaAccessForm({
       setError("Please enter a valid work email.");
       return;
     }
-    if (fields === "full" && !values.name?.trim()) {
+    if (fields === "full" && nameLayout === "single" && !values.name?.trim()) {
       setError("Please enter your name.");
       return;
     }
+    if (fields === "full" && nameLayout === "split" && !values.firstName?.trim()) {
+      setError("Please enter your first name.");
+      return;
+    }
     if (fields === "full" && teamSizes?.length && !values.teamSize) {
       setError("Please select your team size.");
       return;
@@ -353,7 +360,7 @@ function BetaAccessForm({
               fields === "full" && "ods-mkt-access__fields--full"
             ),
             children: [
-              fields === "full" && /* @__PURE__ */ jsxs3("div", { className: "ods-mkt-access__field", children: [
+              fields === "full" && nameLayout === "single" && /* @__PURE__ */ jsxs3("div", { className: "ods-mkt-access__field", children: [
                 /* @__PURE__ */ jsx3("label", { className: "ods-mkt-access__label", htmlFor: `${uid}-name`, children: "Full name" }),
                 /* @__PURE__ */ jsx3(
                   Input,
@@ -367,6 +374,36 @@ function BetaAccessForm({
                   }
                 )
               ] }),
+              fields === "full" && nameLayout === "split" && /* @__PURE__ */ jsxs3(Fragment, { children: [
+                /* @__PURE__ */ jsxs3("div", { className: "ods-mkt-access__field", children: [
+                  /* @__PURE__ */ jsx3("label", { className: "ods-mkt-access__label", htmlFor: `${uid}-firstname`, children: "First name" }),
+                  /* @__PURE__ */ jsx3(
+                    Input,
+                    {
+                      id: `${uid}-firstname`,
+                      autoComplete: "given-name",
+                      placeholder: "Ada",
+                      value: values.firstName ?? "",
+                      onChange: (e) => setValues((v) => ({ ...v, firstName: e.target.value })),
+                      disabled: busy
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs3("div", { className: "ods-mkt-access__field", children: [
+                  /* @__PURE__ */ jsx3("label", { className: "ods-mkt-access__label", htmlFor: `${uid}-lastname`, children: "Last name" }),
+                  /* @__PURE__ */ jsx3(
+                    Input,
+                    {
+                      id: `${uid}-lastname`,
+                      autoComplete: "family-name",
+                      placeholder: "Lovelace",
+                      value: values.lastName ?? "",
+                      onChange: (e) => setValues((v) => ({ ...v, lastName: e.target.value })),
+                      disabled: busy
+                    }
+                  )
+                ] })
+              ] }),
               /* @__PURE__ */ jsxs3("div", { className: "ods-mkt-access__field", children: [
                 /* @__PURE__ */ jsx3("label", { className: "ods-mkt-access__label", htmlFor: `${uid}-email`, children: "Work email" }),
                 /* @__PURE__ */ jsx3(
@@ -657,7 +694,7 @@ function ContactForm({
           {
             id: `${uid}-message`,
             "aria-labelledby": `${uid}-message-label`,
-            placeholder: "What are you trying to build?",
+            placeholder: selectedTopic?.messagePlaceholder ?? "What are you trying to build?",
             rows: 4,
             value: values.message,
             onChange: (e) => setValues((v) => ({ ...v, message: e.target.value })),
@@ -779,7 +816,7 @@ function FeatureGrid({
 // src/marketing/components/IntegrationsFinder/IntegrationsFinder.tsx
 import { CheckmarkIcon, SearchIcon } from "@octaviaflow/icons";
 import { useMemo, useState as useState3 } from "react";
-import { Fragment, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function LetterTile({ name }) {
   return /* @__PURE__ */ jsx9("span", { className: "ods-mkt-finder__letter", "aria-hidden": "true", children: name.trim().charAt(0).toUpperCase() });
 }
@@ -901,7 +938,7 @@ function IntegrationsFinder({
       " ",
       /* @__PURE__ */ jsx9("strong", { children: query.trim() }),
       " connector is available."
-    ] }) : /* @__PURE__ */ jsxs8(Fragment, { children: [
+    ] }) : /* @__PURE__ */ jsxs8(Fragment2, { children: [
       /* @__PURE__ */ jsxs8("h3", { className: "ods-mkt-finder__miss-title", children: [
         "No native ",
         /* @__PURE__ */ jsx9("strong", { children: query.trim() }),
@@ -1134,7 +1171,7 @@ function roleGlyph(role, size = 12) {
 }
 
 // src/marketing/components/MarketingFooter/MarketingFooter.tsx
-import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 function MarketingFooter({
   brand,
   tagline,
@@ -1149,7 +1186,7 @@ function MarketingFooter({
   return /* @__PURE__ */ jsxs13("footer", { ...rest, className: cn("ods-mkt-footer", className), children: [
     /* @__PURE__ */ jsxs13("div", { className: "ods-mkt-footer__grid", children: [
       /* @__PURE__ */ jsxs13("div", { className: "ods-mkt-footer__brand-col", children: [
-        /* @__PURE__ */ jsx14("div", { className: "ods-mkt-footer__brand", children: brand ?? /* @__PURE__ */ jsxs13(Fragment2, { children: [
+        /* @__PURE__ */ jsx14("div", { className: "ods-mkt-footer__brand", children: brand ?? /* @__PURE__ */ jsxs13(Fragment3, { children: [
           /* @__PURE__ */ jsx14(BrandMark, { size: 16 }),
           /* @__PURE__ */ jsx14("span", { children: "OctaviaFlow" })
         ] }) }),
@@ -1241,7 +1278,7 @@ function MarketingHero({
 
 // src/marketing/components/MarketingNav/MarketingNav.tsx
 import { useState as useState4 } from "react";
-import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 function BurgerGlyph({ open }) {
   return /* @__PURE__ */ jsx16(
     "svg",
@@ -1269,7 +1306,7 @@ function MarketingNav({
 }) {
   const [mobileOpen, setMobileOpen] = useState4(false);
   return /* @__PURE__ */ jsxs15("header", { ...rest, className: cn("ods-mkt-nav", sticky && "ods-mkt-nav--sticky", className), children: [
-    /* @__PURE__ */ jsx16("a", { className: "ods-mkt-nav__brand", href: brandHref, children: brand ?? /* @__PURE__ */ jsxs15(Fragment3, { children: [
+    /* @__PURE__ */ jsx16("a", { className: "ods-mkt-nav__brand", href: brandHref, children: brand ?? /* @__PURE__ */ jsxs15(Fragment4, { children: [
       /* @__PURE__ */ jsx16(BrandMark, {}),
       /* @__PURE__ */ jsx16("span", { children: "OctaviaFlow" })
     ] }) }),
@@ -1433,7 +1470,7 @@ function PricingTiers({ tiers, note, className, ...rest }) {
 
 // src/marketing/components/StatBand/StatBand.tsx
 import { useReducedMotion as useReducedMotion2 } from "framer-motion";
-import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx20, jsxs as jsxs19 } from "react/jsx-runtime";
 function StatBand({ items, orientation = "column", className, ...rest }) {
   const reducedMotion = useReducedMotion2();
   return /* @__PURE__ */ jsx20(
@@ -1452,7 +1489,7 @@ function StatBand({ items, orientation = "column", className, ...rest }) {
             suffix: item.suffix,
             formatValue: (v) => Math.round(v).toLocaleString("en-US")
           }
-        ) : /* @__PURE__ */ jsxs19(Fragment4, { children: [
+        ) : /* @__PURE__ */ jsxs19(Fragment5, { children: [
           item.prefix,
           item.value,
           item.suffix
@@ -2010,7 +2047,7 @@ function ShowcaseSignup({
 }
 
 // src/marketing/components/WorkflowShowcase/WorkflowShowcase.tsx
-import { Fragment as Fragment5, jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
 var EMPTY_PLAN = { left: [], right: [], all: [], totalSteps: 1 };
 function ConnectorTile({ connector }) {
   return /* @__PURE__ */ jsx24(
@@ -2322,7 +2359,7 @@ function WorkflowShowcase({
                 // biome-ignore lint/suspicious/noArrayIndexKey: segments are positional by nature
                 /* @__PURE__ */ jsx24("span", { children: seg.text }, i)
               )
-            ) : /* @__PURE__ */ jsxs22(Fragment5, { children: [
+            ) : /* @__PURE__ */ jsxs22(Fragment6, { children: [
               /* @__PURE__ */ jsx24("span", { className: "ods-showcase__placeholder", children: "Describe your pipeline \u2014 e.g. " }),
               /* @__PURE__ */ jsx24("span", { className: "ods-showcase__placeholder ods-showcase__placeholder--faint", children: '"Sync Storefront orders to Warehouse hourly, alert sales in Team Chat"' })
             ] }) })
@@ -2440,7 +2477,7 @@ function WorkflowShowcase({
               }
             )
           ] }),
-          swap && swapRole && /* @__PURE__ */ jsxs22(Fragment5, { children: [
+          swap && swapRole && /* @__PURE__ */ jsxs22(Fragment6, { children: [
             /* @__PURE__ */ jsx24(
               "button",
               {