@npm_leadtech/legal-contracts-ui 0.80.2 → 0.80.4

package/dist/components/AiLegalDocumentReviewerTemplate.d.ts

@@ -89,20 +89,31 @@ export interface FastAndSimpleSectionProps {
     variant?: 'default' | 'lawgeniusDark';
 }
 
-export type Hero2Highlight = {
+export type Hero2Highlight = string | {
     id: string;
     label: string;
     icon: ReactNode;
 };
 
 export interface Hero2SectionProps {
-    bgLeft: ReactNode | null;
-    bgRight: ReactNode | null;
+    backgroundRight?: string;
+    backgroundLeft?: string;
+    subtitle?: string;
     title: string;
     description: string;
     highlights: Hero2Highlight[];
-    variant: 'esign' | 'ratafia';
-    uploadZone: UploadZoneProps;
+    /** Light (e-sign): default pills with chevron. Dark (Lawgenius): gradient hero, optional icon pills */
+    theme?: 'light' | 'dark';
+    /** Shown under highlight pills (e.g. Lawgenius) */
+    footnote?: string;
+    addDocumentIcon?: string;
+    uploadPromptText?: string;
+    addDocumentLabel?: string;
+    fileSizeText?: string;
+    disclaimer?: ReactNode;
+    onAddDocument?: () => void;
+    /** Replaces the default upload card (e.g. wrap `DocumentReviewUploadCard`) */
+    uploadSlot?: ReactNode;
 }
 
 export interface HowItWorksSectionProps {
@@ -176,14 +187,4 @@ export interface TrustpilotSectionProps {
     header: SectionHeadingProps;
     children: ReactNode;
 }
-
-export interface UploadZoneProps {
-    uploadPromptText: string;
-    addDocumentLabel: string;
-    fileSizeText: string;
-    disclaimer: string;
-    containerClassName?: string;
-    onAddDocument?: () => void;
-    onDropDocument?: () => void;
-}
 

package/dist/components/AiLegalDocumentReviewerTemplate.js

@@ -1,50 +1,50 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
-import { AiLegalDocumentInsightsSection as x } from "./AiLegalDocumentInsightsSection.js";
-import { DocumentReviewUploadCard as S } from "./DocumentReviewUploadCard.js";
-import { FaqSection as w } from "./FaqSection.js";
+import { jsxs as x, jsx as o } from "react/jsx-runtime";
+import { AiLegalDocumentInsightsSection as w } from "./AiLegalDocumentInsightsSection.js";
+import { DocumentReviewUploadCard as t } from "./DocumentReviewUploadCard.js";
+import { FaqSection as h } from "./FaqSection.js";
 import { FastAndSimpleSection as k } from "./FastAndSimpleSection.js";
 import { Hero2Section as D } from "./Hero2Section.js";
-import { HowItWorksSection as h } from "./HowItWorksSection.js";
-import { LawgeniusAskQuestionsSection as v } from "./LawgeniusAskQuestionsSection.js";
-import { LawgeniusFloatingTagsIllustration as A } from "./LawgeniusFloatingTagsIllustration.js";
-import { SignAndSendSection as R } from "./SignAndSendSection.js";
-import { TrustpilotSection as I } from "./TrustpilotSection.js";
-const O = ({
-  hero: t,
-  howItWorks: i,
-  fastAndSimple: e,
-  insights: r,
-  signAndSend: n,
-  trustpilot: a,
-  askQuestions: s,
+import { HowItWorksSection as v } from "./HowItWorksSection.js";
+import { LawgeniusAskQuestionsSection as A } from "./LawgeniusAskQuestionsSection.js";
+import { LawgeniusFloatingTagsIllustration as R } from "./LawgeniusFloatingTagsIllustration.js";
+import { SignAndSendSection as I } from "./SignAndSendSection.js";
+import { TrustpilotSection as L } from "./TrustpilotSection.js";
+const P = ({
+  hero: i,
+  howItWorks: e,
+  fastAndSimple: r,
+  insights: n,
+  signAndSend: a,
+  trustpilot: s,
+  askQuestions: l,
   faq: m
 }) => {
-  const { ...l } = t, { upload: c, leadingIcon: p, ...u } = n, { illustration: g, ...f } = s;
-  return /* @__PURE__ */ d("main", { className: "flex w-full flex-col", children: [
-    /* @__PURE__ */ o(D, { ...l }),
-    /* @__PURE__ */ o(h, { ...i }),
-    /* @__PURE__ */ o(k, { ...e, variant: "lawgeniusDark" }),
-    /* @__PURE__ */ o(x, { ...r }),
+  const { upload: p, ...c } = i, { upload: u, leadingIcon: d, ...g } = a, { illustration: f, ...S } = l;
+  return /* @__PURE__ */ x("main", { className: "flex w-full flex-col", children: [
+    /* @__PURE__ */ o(D, { ...c, uploadSlot: /* @__PURE__ */ o(t, { ...p }) }),
+    /* @__PURE__ */ o(v, { ...e }),
+    /* @__PURE__ */ o(k, { ...r, variant: "lawgeniusDark" }),
+    /* @__PURE__ */ o(w, { ...n }),
     /* @__PURE__ */ o(
-      R,
+      I,
       {
-        ...u,
+        ...g,
         variant: "lawgeniusDark",
-        leadingIcon: p,
-        rightColumn: /* @__PURE__ */ o(S, { ...c, variant: "embeddedOnDark" })
+        leadingIcon: d,
+        rightColumn: /* @__PURE__ */ o(t, { ...u, variant: "embeddedOnDark" })
       }
     ),
-    /* @__PURE__ */ o(I, { ...a }),
+    /* @__PURE__ */ o(L, { ...s }),
     /* @__PURE__ */ o(
-      v,
+      A,
       {
-        ...f,
-        illustration: /* @__PURE__ */ o(A, { ...g })
+        ...S,
+        illustration: /* @__PURE__ */ o(R, { ...f })
       }
     ),
-    /* @__PURE__ */ o("section", { className: "bg-neutral-25 px-6 py-16 sm:px-10 lg:px-32", children: /* @__PURE__ */ o(w, { ...m, className: "mx-auto max-w-6xl space-y-6" }) })
+    /* @__PURE__ */ o("section", { className: "bg-neutral-25 px-6 py-16 sm:px-10 lg:px-32", children: /* @__PURE__ */ o(h, { ...m, className: "mx-auto max-w-6xl space-y-6" }) })
   ] });
 };
 export {
-  O as AiLegalDocumentReviewerTemplate
+  P as AiLegalDocumentReviewerTemplate
 };

package/dist/components/BlogSection.d.ts

@@ -13,6 +13,7 @@ export declare interface BlogSectionProps {
     }[];
     cta: ReactNode | null;
     className?: string;
+    variant?: 'column' | 'row';
 }
 
 export interface SectionHeadingProps {

package/dist/components/BlogSection.js

@@ -1,20 +1,40 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
 import "react";
-import t from "clsx";
-import { SectionHeading as a } from "./SectionHeading.js";
-import { LinkWrapper as d } from "./LinkWrapper.js";
-const p = ({ header: m, articles: r, cta: o, className: n = "" }) => r.length === 0 ? null : /* @__PURE__ */ e("section", { className: t("mx-auto px-8 lg:px-12 xl:max-w-300 xl:px-0", n), children: /* @__PURE__ */ i("div", { className: "mx-auto flex flex-col items-center gap-8", children: [
-  m && /* @__PURE__ */ e(a, { ...m }),
-  /* @__PURE__ */ e("div", { className: "grid gap-6 lg:grid-cols-2", children: r.map((l) => /* @__PURE__ */ i("article", { className: "flex flex-col rounded-sm bg-white shadow md:flex-row", children: [
-    /* @__PURE__ */ e("div", { className: "relative h-42 shrink-0 overflow-hidden rounded-t-sm md:h-full md:max-w-51 md:rounded-t-none md:rounded-l-sm [&_img]:h-full [&_img]:w-full [&_img]:object-cover", children: l.image }),
-    /* @__PURE__ */ i("div", { className: "flex flex-col gap-4 p-6 text-neutral-800", children: [
-      /* @__PURE__ */ e("h3", { className: "text-big font-semibold", children: l.title }),
-      /* @__PURE__ */ e("p", { className: "text-medium", children: l.description }),
-      /* @__PURE__ */ e(d, { className: "w-fit", variant: "tertiary-bold", children: l.cta })
-    ] })
-  ] }, l.title)) }),
-  !!o && /* @__PURE__ */ e(d, { className: "w-full md:w-fit", variant: "secondary-green", children: o })
-] }) });
+import o from "clsx";
+import { SectionHeading as c } from "./SectionHeading.js";
+import { LinkWrapper as t } from "./LinkWrapper.js";
+const u = ({ header: r, articles: m, cta: d, className: s = "", variant: a = "row" }) => {
+  if (m.length === 0) return null;
+  const n = a === "row";
+  return /* @__PURE__ */ e("section", { className: o("mx-auto px-8 lg:px-12 xl:max-w-300 xl:px-0", s), children: /* @__PURE__ */ i("div", { className: "mx-auto flex flex-col items-center gap-8", children: [
+    r && /* @__PURE__ */ e(c, { ...r }),
+    /* @__PURE__ */ e("div", { className: "grid gap-6 lg:grid-cols-2", children: m.map((l) => /* @__PURE__ */ i(
+      "article",
+      {
+        className: o("flex flex-col rounded-sm bg-white shadow", n && "md:flex-row"),
+        children: [
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: o(
+                "relative h-42 shrink-0 overflow-hidden rounded-t-sm [&_img]:h-full [&_img]:w-full [&_img]:object-cover",
+                n && "md:h-full md:max-w-51 md:rounded-t-none md:rounded-l-sm"
+              ),
+              children: l.image
+            }
+          ),
+          /* @__PURE__ */ i("div", { className: "flex flex-col gap-4 p-6 text-neutral-800", children: [
+            /* @__PURE__ */ e("h3", { className: "text-big font-semibold", children: l.title }),
+            /* @__PURE__ */ e("p", { className: "text-medium", children: l.description }),
+            /* @__PURE__ */ e(t, { className: "w-fit", variant: "tertiary-bold", children: l.cta })
+          ] })
+        ]
+      },
+      l.title
+    )) }),
+    !!d && /* @__PURE__ */ e(t, { className: "w-full md:w-fit", variant: "secondary-green", children: d })
+  ] }) });
+};
 export {
-  p as BlogSection
+  u as BlogSection
 };

package/dist/components/CategoryProductTemplate.d.ts

@@ -11,6 +11,7 @@ export interface BlogSectionProps {
     }[];
     cta: ReactNode | null;
     className?: string;
+    variant?: 'column' | 'row';
 }
 
 export interface BreadcrumbProps {

package/dist/components/CategoryProductTemplate.js

@@ -5,7 +5,7 @@ import { DocumentSection as n } from "./DocumentSection.js";
 import { Breadcrumb as x } from "./Breadcrumb.js";
 import { FaqSection as f } from "./FaqSection.js";
 import { BlogSection as d } from "./BlogSection.js";
-const w = ({
+const v = ({
   jumbo: r,
   breadcrumb: o,
   categories: m,
@@ -25,6 +25,8 @@ const w = ({
         d,
         {
           ...a,
+          className: "px-0!",
+          variant: "column",
           header: a.header ? {
             ...a.header,
             align: "start",
@@ -37,5 +39,5 @@ const w = ({
   ] })
 ] });
 export {
-  w as CategoryProductTemplate
+  v as CategoryProductTemplate
 };

package/dist/components/DocEditFillIcon.js

@@ -1,12 +1,12 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as l } from "react/jsx-runtime";
 import "react";
-const o = (l) => /* @__PURE__ */ i("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", fill: "none", viewBox: "0 0 32 32", ...l, children: /* @__PURE__ */ i(
+const i = (o) => /* @__PURE__ */ l("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", fill: "none", viewBox: "0 0 32 32", ...o, children: /* @__PURE__ */ l(
   "path",
   {
-    fill: l.fill ?? "var(--color-primary-700)",
+    fill: "var(--color-primary-700)",
     d: "M8 29.333a2.57 2.57 0 0 1-1.883-.783 2.57 2.57 0 0 1-.784-1.884V5.334q0-1.099.784-1.883A2.57 2.57 0 0 1 8 2.666h9.567a2.63 2.63 0 0 1 1.866.767L25.9 9.9q.367.367.567.85.2.482.2 1.017v2.1a.97.97 0 0 1-.217.633 1.33 1.33 0 0 1-.55.4 5 5 0 0 0-1.016.516 5.5 5.5 0 0 0-.884.717l-7.2 7.2a2.8 2.8 0 0 0-.583.85A2.5 2.5 0 0 0 16 25.2V28q0 .566-.383.95a1.3 1.3 0 0 1-.95.383zM18.667 28v-2.2q0-.267.1-.517t.3-.45l6.967-6.933q.3-.3.666-.433.368-.134.733-.134a2 2 0 0 1 1.434.6l1.233 1.233q.267.3.417.667t.15.734-.134.75A1.8 1.8 0 0 1 30.1 22l-6.933 6.933a1.3 1.3 0 0 1-.45.3 1.4 1.4 0 0 1-.517.1H20a1.3 1.3 0 0 1-.95-.383 1.3 1.3 0 0 1-.383-.95m8.766-6.134 1.234-1.3-1.234-1.233-1.266 1.267zM18.667 12H24l-6.666-6.667v5.333q0 .567.383.95.383.384.95.384"
   }
 ) });
 export {
-  o as DocEditFillIcon
+  i as DocEditFillIcon
 };

package/dist/components/ElectronicSignatureTemplate.d.ts

@@ -52,20 +52,31 @@ export interface FastAndSimpleSectionProps {
     variant?: 'default' | 'lawgeniusDark';
 }
 
-export type Hero2Highlight = {
+export type Hero2Highlight = string | {
     id: string;
     label: string;
     icon: ReactNode;
 };
 
 export interface Hero2SectionProps {
-    bgLeft: ReactNode | null;
-    bgRight: ReactNode | null;
+    backgroundRight?: string;
+    backgroundLeft?: string;
+    subtitle?: string;
     title: string;
     description: string;
     highlights: Hero2Highlight[];
-    variant: 'esign' | 'ratafia';
-    uploadZone: UploadZoneProps;
+    /** Light (e-sign): default pills with chevron. Dark (Lawgenius): gradient hero, optional icon pills */
+    theme?: 'light' | 'dark';
+    /** Shown under highlight pills (e.g. Lawgenius) */
+    footnote?: string;
+    addDocumentIcon?: string;
+    uploadPromptText?: string;
+    addDocumentLabel?: string;
+    fileSizeText?: string;
+    disclaimer?: ReactNode;
+    onAddDocument?: () => void;
+    /** Replaces the default upload card (e.g. wrap `DocumentReviewUploadCard`) */
+    uploadSlot?: ReactNode;
 }
 
 export interface HowItWorksSectionProps {
@@ -121,14 +132,4 @@ export interface TrustpilotSectionProps {
     header: SectionHeadingProps;
     children: ReactNode;
 }
-
-export interface UploadZoneProps {
-    uploadPromptText: string;
-    addDocumentLabel: string;
-    fileSizeText: string;
-    disclaimer: string;
-    containerClassName?: string;
-    onAddDocument?: () => void;
-    onDropDocument?: () => void;
-}
 

package/dist/components/Hero2Section.d.ts

@@ -1,7 +1,7 @@
 import { FC } from 'react';
 import { ReactNode } from 'react';
 
-export declare type Hero2Highlight = {
+export declare type Hero2Highlight = string | {
     id: string;
     label: string;
     icon: ReactNode;
@@ -10,22 +10,23 @@ export declare type Hero2Highlight = {
 export declare const Hero2Section: FC<Hero2SectionProps>;
 
 export declare interface Hero2SectionProps {
-    bgLeft: ReactNode | null;
-    bgRight: ReactNode | null;
+    backgroundRight?: string;
+    backgroundLeft?: string;
+    subtitle?: string;
     title: string;
     description: string;
     highlights: Hero2Highlight[];
-    variant: 'esign' | 'ratafia';
-    uploadZone: UploadZoneProps;
-}
-
-export interface UploadZoneProps {
-    uploadPromptText: string;
-    addDocumentLabel: string;
-    fileSizeText: string;
-    disclaimer: string;
-    containerClassName?: string;
+    /** Light (e-sign): default pills with chevron. Dark (Lawgenius): gradient hero, optional icon pills */
+    theme?: 'light' | 'dark';
+    /** Shown under highlight pills (e.g. Lawgenius) */
+    footnote?: string;
+    addDocumentIcon?: string;
+    uploadPromptText?: string;
+    addDocumentLabel?: string;
+    fileSizeText?: string;
+    disclaimer?: ReactNode;
     onAddDocument?: () => void;
-    onDropDocument?: () => void;
+    /** Replaces the default upload card (e.g. wrap `DocumentReviewUploadCard`) */
+    uploadSlot?: ReactNode;
 }
 

package/dist/components/Hero2Section.js

@@ -1,75 +1,137 @@
-import { jsxs as l, jsx as a, Fragment as d } from "react/jsx-runtime";
-import { UploadZone as p } from "./UploadZone.js";
-import t from "clsx";
-import { Markdown as h } from "./Markdown.js";
-const u = ({
-  title: n,
-  description: m,
-  highlights: o,
-  variant: x,
-  uploadZone: c,
-  bgLeft: r,
-  bgRight: s
+import { jsxs as l, jsx as e, Fragment as w } from "react/jsx-runtime";
+import { ChevronRightIcon as v } from "./ChevronRightIcon.js";
+import { Button as N } from "./Button.js";
+const B = ({
+  backgroundRight: s = "",
+  backgroundLeft: n = "",
+  subtitle: i,
+  title: p,
+  description: u,
+  highlights: g,
+  theme: f = "light",
+  footnote: r,
+  addDocumentIcon: m,
+  uploadPromptText: d,
+  addDocumentLabel: c,
+  fileSizeText: x,
+  disclaimer: o,
+  onAddDocument: y,
+  uploadSlot: h
 }) => {
-  const e = x === "ratafia";
+  const t = f === "dark", b = h == null && m != null && d != null && c != null && x != null && o != null;
   return /* @__PURE__ */ l(
     "section",
     {
-      className: t(
-        "relative flex justify-center overflow-hidden",
-        e && "bg-primary-900 isolate px-6 py-16 text-white sm:px-10 lg:px-24",
-        !e && "bg-neutral-50"
-      ),
+      className: t ? "bg-primary-900 relative isolate overflow-hidden px-6 py-16 text-white sm:px-10 lg:px-24" : "relative overflow-hidden bg-neutral-50",
       children: [
-        e ? /* @__PURE__ */ l("div", { className: "pointer-events-none absolute inset-0", children: [
-          /* @__PURE__ */ a("div", { className: "from-primary-800/70 via-primary-900 to-primary-900 absolute inset-0 bg-linear-to-br" }),
-          /* @__PURE__ */ a("div", { className: "absolute inset-0 bg-white/10 mix-blend-lighten" })
-        ] }) : /* @__PURE__ */ l(d, { children: [
-          !!r && /* @__PURE__ */ a("div", { className: "absolute -left-25 hidden lg:block xl:left-0", children: r }),
-          !!s && /* @__PURE__ */ a("div", { className: "absolute -right-15 bottom-0 xl:right-5", children: s })
+        t ? /* @__PURE__ */ l("div", { className: "pointer-events-none absolute inset-0", children: [
+          /* @__PURE__ */ e("div", { className: "from-primary-800/70 via-primary-900 to-primary-900 absolute inset-0 bg-gradient-to-br" }),
+          /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-white/10 mix-blend-lighten" })
+        ] }) : /* @__PURE__ */ l(w, { children: [
+          s !== "" && /* @__PURE__ */ e(
+            "img",
+            {
+              src: s,
+              alt: "",
+              width: 400,
+              height: 400,
+              className: "pointer-events-none absolute top-8 -right-20 z-0 hidden opacity-40 mix-blend-luminosity lg:block",
+              "aria-hidden": !0
+            }
+          ),
+          n !== "" && /* @__PURE__ */ e(
+            "img",
+            {
+              src: n,
+              alt: "",
+              width: 420,
+              height: 420,
+              className: "pointer-events-none absolute -top-20 -left-40 z-0 hidden opacity-40 mix-blend-luminosity lg:block",
+              "aria-hidden": !0
+            }
+          )
         ] }),
-        /* @__PURE__ */ l("div", { className: "mx-auto flex max-w-300 shrink flex-col gap-10 px-6 pt-10 pb-20 md:flex-row md:items-center md:pb-26 lg:px-8 lg:pt-20 xl:gap-20 xl:px-0", children: [
-          /* @__PURE__ */ l("div", { className: "flex flex-col gap-4", children: [
-            /* @__PURE__ */ a(
-              "h1",
-              {
-                className: t(
-                  "text-extra-large leading-tight font-bold",
-                  e && "text-white",
-                  !e && "text-primary-900"
-                ),
-                children: n
-              }
-            ),
-            /* @__PURE__ */ a(
-              h,
-              {
-                className: t("text-medium [&_p:last-child]:mb-0", e ? "text-white" : "text-neutral-800"),
-                content: m
-              }
-            ),
-            /* @__PURE__ */ a("div", { className: "flex gap-4", children: o.map((i) => /* @__PURE__ */ l(
-              "span",
-              {
-                className: t(
-                  "text-small flex flex-nowrap items-center gap-1 rounded p-1",
-                  e && "bg-primary-50 text-primary-800 font-semibold",
-                  !e && "bg-primary-800 text-primary-50"
-                ),
-                children: [
-                  i.icon,
-                  i.label
-                ]
-              },
-              i.id
-            )) })
-          ] }),
-          /* @__PURE__ */ a(p, { ...c, containerClassName: "md:min-w-85 lg:min-w-115 xl:min-w-140" })
-        ] })
+        /* @__PURE__ */ l(
+          "div",
+          {
+            className: t ? "relative mx-auto grid max-w-6xl gap-12 lg:grid-cols-2" : "relative z-10 mx-auto flex w-full max-w-6xl flex-col gap-12 px-4 py-12 lg:flex-row lg:items-center lg:gap-16 lg:py-16",
+            children: [
+              /* @__PURE__ */ l("div", { className: `space-y-6 ${t ? "" : "flex-1"}`, children: [
+                /* @__PURE__ */ l("div", { className: "space-y-2", children: [
+                  i != null && i !== "" && /* @__PURE__ */ e(
+                    "p",
+                    {
+                      className: t ? "text-small text-secondary-300 font-semibold tracking-[0.3em] uppercase" : "text-extra-small font-bold tracking-[0.2em] text-neutral-600 uppercase",
+                      children: i
+                    }
+                  ),
+                  /* @__PURE__ */ e(
+                    "h1",
+                    {
+                      className: t ? "text-4xl leading-tight font-semibold text-white sm:text-5xl lg:text-6xl" : "font-lora text-extra-large text-primary-900 md:text-hero",
+                      children: p
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ e("p", { className: t ? "text-medium text-white/80" : "text-medium text-neutral-800", children: u }),
+                /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-3", children: g.map(
+                  (a) => typeof a == "string" ? /* @__PURE__ */ l(
+                    "span",
+                    {
+                      className: "bg-primary-800 text-small text-primary-50 inline-flex items-center gap-2 rounded-md px-3 py-1 font-semibold",
+                      children: [
+                        /* @__PURE__ */ e(v, { className: "text-primary-50 h-4 w-4", "aria-hidden": !0 }),
+                        a
+                      ]
+                    },
+                    a
+                  ) : /* @__PURE__ */ l(
+                    "span",
+                    {
+                      className: "text-small inline-flex items-center gap-2 rounded-full bg-white/10 px-4 py-2 font-semibold text-white",
+                      children: [
+                        a.icon,
+                        a.label
+                      ]
+                    },
+                    a.id
+                  )
+                ) }),
+                r != null && r !== "" && /* @__PURE__ */ e("p", { className: t ? "text-small text-white/80" : "text-small text-neutral-700", children: r })
+              ] }),
+              /* @__PURE__ */ e("div", { className: t ? "" : "flex flex-1 justify-center", children: h ?? (b ? /* @__PURE__ */ e("div", { className: "flex flex-1 justify-center", children: /* @__PURE__ */ e(
+                "div",
+                {
+                  className: "relative w-full max-w-xl rounded-3xl bg-white/70 p-4 backdrop-blur",
+                  style: { boxShadow: "var(--shadow-medium)" },
+                  children: /* @__PURE__ */ l("div", { className: "rounded-2xl bg-white p-8 text-center shadow-lg", children: [
+                    /* @__PURE__ */ e("p", { className: "text-medium text-neutral-400", children: d }),
+                    /* @__PURE__ */ l(
+                      N,
+                      {
+                        size: "large",
+                        variant: "primary-white",
+                        className: "bg-primary-700 hover:bg-primary-600 focus-visible:outline-primary-700 mt-6 w-full justify-center text-white",
+                        onClick: y,
+                        type: "button",
+                        children: [
+                          /* @__PURE__ */ e("img", { src: m, alt: "", width: 24, height: 24 }),
+                          /* @__PURE__ */ e("span", { className: "text-medium font-bold", children: c })
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ e("p", { className: "text-extra-small mt-6 text-neutral-400", children: x }),
+                    /* @__PURE__ */ e("p", { className: "text-tiny mt-2 text-neutral-400", children: o })
+                  ] })
+                }
+              ) }) : null) })
+            ]
+          }
+        )
       ]
     }
   );
 };
 export {
-  u as Hero2Section
+  B as Hero2Section
 };

package/dist/components/HomeTemplate.d.ts

@@ -11,6 +11,7 @@ export interface BlogSectionProps {
     }[];
     cta: ReactNode | null;
     className?: string;
+    variant?: 'column' | 'row';
 }
 
 export interface CategoriesSectionProps {

package/dist/components/index.d.ts

@@ -113,6 +113,7 @@ export declare interface BlogSectionProps {
     }[];
     cta: ReactNode | null;
     className?: string;
+    variant?: 'column' | 'row';
 }
 
 export declare const Breadcrumb: FC<BreadcrumbProps>;
@@ -459,7 +460,7 @@ export declare interface HeaderProps {
 
 export declare const HelpGuideIcon: React_2.FC<React_2.SVGProps<SVGSVGElement>>;
 
-export declare type Hero2Highlight = {
+export declare type Hero2Highlight = string | {
     id: string;
     label: string;
     icon: ReactNode;
@@ -468,13 +469,24 @@ export declare type Hero2Highlight = {
 export declare const Hero2Section: FC<Hero2SectionProps>;
 
 export declare interface Hero2SectionProps {
-    bgLeft: ReactNode | null;
-    bgRight: ReactNode | null;
+    backgroundRight?: string;
+    backgroundLeft?: string;
+    subtitle?: string;
     title: string;
     description: string;
     highlights: Hero2Highlight[];
-    variant: 'esign' | 'ratafia';
-    uploadZone: UploadZoneProps;
+    /** Light (e-sign): default pills with chevron. Dark (Lawgenius): gradient hero, optional icon pills */
+    theme?: 'light' | 'dark';
+    /** Shown under highlight pills (e.g. Lawgenius) */
+    footnote?: string;
+    addDocumentIcon?: string;
+    uploadPromptText?: string;
+    addDocumentLabel?: string;
+    fileSizeText?: string;
+    disclaimer?: ReactNode;
+    onAddDocument?: () => void;
+    /** Replaces the default upload card (e.g. wrap `DocumentReviewUploadCard`) */
+    uploadSlot?: ReactNode;
 }
 
 export declare const HeroSection: FC<HeroSectionProps>;
@@ -1183,16 +1195,6 @@ export declare interface UnsubscribeSectionProps {
     children: ReactNode;
 }
 
-export interface UploadZoneProps {
-    uploadPromptText: string;
-    addDocumentLabel: string;
-    fileSizeText: string;
-    disclaimer: string;
-    containerClassName?: string;
-    onAddDocument?: () => void;
-    onDropDocument?: () => void;
-}
-
 export declare const UsFlagIcon: React_2.FC<React_2.SVGProps<SVGSVGElement>>;
 
 export declare const ValuesSection: FC<ValuesSectionProps>;