@npm_leadtech/legal-contracts-ui 0.124.1 → 0.124.2

package/dist/components/AboutUsTemplate.d.ts

@@ -79,10 +79,10 @@ export interface IntroSectionProps {
 }
 
 export interface Jumbotron2Props {
-    title: string;
+    title: ReactNode;
     subtitle?: string;
     className?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     variant?: 'default' | 'contact';
 }
 

package/dist/components/Anchor.d.ts

@@ -3,6 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 export declare const Anchor: ({ children, variant, className, ...props }: AnchorProps) => JSX.Element;
 
 export interface AnchorProps extends React.ComponentProps<'a'> {
-    variant?: 'default' | 'legal' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
+    variant?: 'default' | 'legal' | 'ratafia' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
 }
 

package/dist/components/Anchor.js

@@ -1,15 +1,16 @@
 import { jsx as d } from "react/jsx-runtime";
 import p from "clsx";
-const v = ({ children: i, variant: c = "default", className: l = "", ...r }) => {
-  const t = r.href || "", s = t.toLowerCase(), u = s.startsWith("mailto:"), n = s.startsWith("tel:"), e = "cursor-pointer text-primary-700", o = {
+const b = ({ children: a, variant: c = "default", className: l = "", ...r }) => {
+  const t = r.href || "", n = t.toLowerCase(), u = n.startsWith("mailto:"), o = n.startsWith("tel:"), e = "cursor-pointer text-primary-700", s = {
     default: "text-neutral-900 underline",
     legal: e,
+    ratafia: "cursor-pointer text-primary-200 underline decoration-white/40 underline-offset-2 hover:text-white",
     "about-us": e,
     pricing: "cursor-pointer text-neutral-900",
     unsubscribe: e,
     cookies: "text-white"
-  }, f = o[c] ?? o.default, a = t.startsWith("http") && !n && !u, h = (() => {
-    if (!n) return t;
+  }, f = s[c] ?? s.default, i = t.startsWith("http") && !o && !u, h = (() => {
+    if (!o) return t;
     try {
       return decodeURIComponent(t).replace(/\s/g, "");
     } catch {
@@ -22,12 +23,12 @@ const v = ({ children: i, variant: c = "default", className: l = "", ...r }) =>
       ...r,
       href: h,
       className: p(l, f),
-      target: a ? "_blank" : void 0,
-      rel: a ? "noopener noreferrer" : void 0,
-      children: i
+      target: i ? "_blank" : void 0,
+      rel: i ? "noopener noreferrer" : void 0,
+      children: a
     }
   );
 };
 export {
-  v as Anchor
+  b as Anchor
 };

package/dist/components/Blockquote.d.ts

@@ -3,6 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 export declare const Blockquote: ({ children, variant }: BlockquoteProps) => JSX.Element;
 
 export interface BlockquoteProps extends React.ComponentProps<'blockquote'> {
-    variant?: 'default' | 'legal' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
+    variant?: 'default' | 'legal' | 'ratafia' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
 }
 

package/dist/components/Blockquote.js

@@ -1,13 +1,13 @@
-import { jsx as o } from "react/jsx-runtime";
-import l from "clsx";
-const b = ({ children: r, variant: e = "default" }) => {
+import { jsx as l } from "react/jsx-runtime";
+import o from "clsx";
+const s = ({ children: r, variant: a = "default" }) => {
   const t = {
-    default: "border-l-4 border-gray-300 pl-4 text-gray-700 ",
-    "about-us": "text-gray-700 bg-neutral-25 pt-4 px-4 pb-0.5",
-    unsubscribe: "border-l-4 border-neutral-300 pl-4 text-neutral-700"
-  }, a = t[e] ?? t.default;
-  return /* @__PURE__ */ o("blockquote", { className: l("my-4 italic", a), children: r });
+    default: "my-4 border-l-4 border-gray-300 pl-4 text-gray-700 italic",
+    "about-us": "my-4 text-gray-700 italic bg-neutral-25 pt-4 px-4 pb-0.5",
+    unsubscribe: "my-4 border-l-4 border-neutral-300 pl-4 text-neutral-700 italic"
+  }, e = t[a] ?? t.default;
+  return /* @__PURE__ */ l("blockquote", { className: o("my-4 italic", e), children: r });
 };
 export {
-  b as Blockquote
+  s as Blockquote
 };

package/dist/components/ContactUsTemplate.d.ts

@@ -101,10 +101,10 @@ export declare interface ContactUsTemplateProps {
 export type IconPosition = 'left' | 'right' | 'top';
 
 export interface Jumbotron2Props {
-    title: string;
+    title: ReactNode;
     subtitle?: string;
     className?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     variant?: 'default' | 'contact';
 }
 

package/dist/components/FaqsTemplate.d.ts

@@ -1,4 +1,5 @@
 import { FC } from 'react';
+import { ReactNode } from 'react';
 
 export interface AsideNavMenuProps {
     menuItems: Array<{
@@ -33,10 +34,10 @@ export declare interface FaqsTemplateProps {
 }
 
 export interface Jumbotron2Props {
-    title: string;
+    title: ReactNode;
     subtitle?: string;
     className?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     variant?: 'default' | 'contact';
 }
 

package/dist/components/Footer.js

@@ -1,23 +1,23 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import "react";
 import { PhoneButton as o } from "./PhoneButton.js";
-import { FooterNav as p } from "./FooterNav.js";
+import { FooterNav as f } from "./FooterNav.js";
 const g = ({
   nav: r,
   contactInfo: t,
-  logoGray: i,
-  socialLinks: d,
-  legalLinks: c,
-  disclaimerText: x,
+  logoGray: d,
+  socialLinks: i,
+  legalLinks: x,
+  disclaimerText: c,
   copyrightText: n,
-  trustPilot: s,
-  languageSelector: m
-}) => /* @__PURE__ */ l("footer", { className: "text-neutral-25", children: [
+  trustPilot: m,
+  languageSelector: s
+}) => /* @__PURE__ */ l("footer", { className: "text-neutral-25 max-w-full overflow-x-hidden", children: [
   /* @__PURE__ */ e("div", { className: "bg-primary-900", children: /* @__PURE__ */ l("div", { className: "mx-auto flex w-full max-w-300 flex-col items-start gap-8 px-6 py-10 md:grid md:grid-cols-3 lg:flex lg:flex-row lg:justify-between", children: [
-    r.map((a) => /* @__PURE__ */ e(p, { ...a }, a.title)),
+    r.map((a) => /* @__PURE__ */ e(f, { ...a }, a.title)),
     /* @__PURE__ */ l("div", { className: "flex flex-col gap-6 max-sm:w-full md:contents lg:flex", children: [
       /* @__PURE__ */ l("div", { className: "", children: [
-        /* @__PURE__ */ e("div", { className: "mb-8 xl:hidden", children: !!m && /* @__PURE__ */ e("div", { className: "language-selector-mobile-container", children: m }) }),
+        /* @__PURE__ */ e("div", { className: "mb-8 xl:hidden", children: !!s && /* @__PURE__ */ e("div", { className: "language-selector-mobile-container", children: s }) }),
         /* @__PURE__ */ l("div", { children: [
           /* @__PURE__ */ e("p", { className: "text-small hidden font-bold text-white sm:block", children: t.phoneNumber }),
           /* @__PURE__ */ e("div", { className: "mb-2 w-full text-center sm:hidden", children: /* @__PURE__ */ e(o, { phoneNumber: t.phoneNumber }) }),
@@ -28,17 +28,17 @@ const g = ({
           ] })
         ] })
       ] }),
-      !!s && /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: s })
+      !!m && /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: m })
     ] })
   ] }) }),
   /* @__PURE__ */ e("div", { className: "bg-neutral-900 px-6 py-8 text-neutral-400", children: /* @__PURE__ */ l("div", { className: "mx-auto flex w-full max-w-300 flex-col gap-6", children: [
     /* @__PURE__ */ l("div", { className: "flex flex-col items-start gap-6 md:flex-row md:justify-between", children: [
-      i,
-      /* @__PURE__ */ e("div", { className: "flex gap-4", children: d?.map((a) => a) })
+      d,
+      /* @__PURE__ */ e("div", { className: "flex gap-4", children: i?.map((a) => a) })
     ] }),
     /* @__PURE__ */ e("div", { className: "h-px w-full bg-neutral-600" }),
-    /* @__PURE__ */ e("div", { className: "text-extra-small flex flex-wrap gap-4", children: c?.map((a) => a) }),
-    /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: x }),
+    /* @__PURE__ */ e("div", { className: "text-extra-small flex flex-wrap gap-4", children: x?.map((a) => a) }),
+    /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: c }),
     /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: n })
   ] }) })
 ] });

package/dist/components/Header2.d.ts

@@ -3,6 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 export declare const Header2: ({ children, variant }: Header2Props) => JSX.Element;
 
 export interface Header2Props extends React.ComponentProps<'h2'> {
-    variant?: 'default' | 'legal' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
+    variant?: 'default' | 'legal' | 'ratafia' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
 }
 

package/dist/components/Header2.js

@@ -1,13 +1,14 @@
 import { jsx as a } from "react/jsx-runtime";
-import s from "clsx";
-const m = ({ children: e, variant: l = "default" }) => {
+import m from "clsx";
+const s = ({ children: e, variant: l = "default" }) => {
   const t = {
     default: "mt-5 mb-3 text-3xl text-gray-900",
     legal: "mt-5 -mx-ds-11xl mb-6 bg-white px-ds-11xl text-left text-neutral-800 text-3xl",
+    ratafia: "mt-4 mb-3 text-left text-xl font-bold text-white lg:text-2xl",
     unsubscribe: "mt-0 mb-0 w-full bg-white pb-4 pt-8 text-left text-3xl leading-tight text-neutral-900 font-sans tracking-tight md:text-4xl md:leading-8"
   }, x = t[l] ?? t.default;
-  return /* @__PURE__ */ a("h2", { className: s("font-bold", x), children: e });
+  return /* @__PURE__ */ a("h2", { className: m("font-bold", x), children: e });
 };
 export {
-  m as Header2
+  s as Header2
 };

package/dist/components/HeroImageShell.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+
+export declare const HeroImageShell: FC<HeroImageShellProps>;
+
+export declare interface HeroImageShellProps {
+    src: string | null;
+    alt: string;
+    priority?: boolean;
+}
+

package/dist/components/HeroImageShell.js

@@ -0,0 +1,15 @@
+import { jsx as e } from "react/jsx-runtime";
+const r = { w: 1200, h: 900 }, h = "relative aspect-[4/3] w-full overflow-hidden rounded-2xl bg-neutral-100 shadow-[0_25px_60px_rgba(3,42,56,0.12)]", t = "relative w-full overflow-hidden rounded-2xl shadow-[0_25px_60px_rgba(3,42,56,0.12)]", a = ({ empty: l, children: o }) => /* @__PURE__ */ e("div", { className: l ? h : t, "aria-hidden": l ? !0 : void 0, children: l ? null : o }), n = ({ src: l, alt: o, priority: d }) => l ? /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(
+  "img",
+  {
+    src: l,
+    alt: o,
+    width: r.w,
+    height: r.h,
+    className: "h-auto w-full max-w-full object-cover",
+    ...d ? { loading: "eager" } : { loading: "lazy" }
+  }
+) }) : /* @__PURE__ */ e(a, { empty: !0 });
+export {
+  n as HeroImageShell
+};

package/dist/components/HomeTemplate.js

@@ -4,10 +4,10 @@ import { HeroSection as n } from "./HeroSection.js";
 import { MoreTemplatesSection as f } from "./MoreTemplatesSection.js";
 import { ProcessSection as l } from "./ProcessSection.js";
 import { CategoriesSection as S } from "./CategoriesSection.js";
-import { RatafiaSection as x } from "./RatafiaSection.js";
-import { TrustSection as T } from "./TrustSection.js";
-import { FaqTeaserSection as b } from "./FaqTeaserSection.js";
-import { BlogSection as g } from "./BlogSection.js";
+import { TrustSection as x } from "./TrustSection.js";
+import { FaqTeaserSection as T } from "./FaqTeaserSection.js";
+import { BlogSection as b } from "./BlogSection.js";
+import { RatafiaSection as g } from "./RatafiaSection.js";
 const M = ({
   hero: t,
   moreTemplates: m,
@@ -22,10 +22,10 @@ const M = ({
   /* @__PURE__ */ o(f, { ...m }),
   /* @__PURE__ */ o(l, { ...e }),
   r && /* @__PURE__ */ o(S, { ...r }),
-  /* @__PURE__ */ o(x, { ...i }),
-  /* @__PURE__ */ o(T, { ...p }),
-  /* @__PURE__ */ o(b, { ...s }),
-  /* @__PURE__ */ o(g, { className: "pt-10 pb-12 lg:pb-14", ...a })
+  /* @__PURE__ */ o(g, { ...i }),
+  /* @__PURE__ */ o(x, { ...p }),
+  /* @__PURE__ */ o(T, { ...s }),
+  /* @__PURE__ */ o(b, { className: "pt-10 pb-12 lg:pb-14", ...a })
 ] });
 export {
   M as HomeTemplate

package/dist/components/HowItWorksLawGeniusSection.d.ts

@@ -0,0 +1,16 @@
+import { FC } from 'react';
+import { ReactNode } from 'react';
+
+export declare const HowItWorksLawGeniusSection: FC<HowItWorksLawGeniusSectionProps>;
+
+export declare interface HowItWorksLawGeniusSectionProps {
+    sectionTitle: string;
+    contentMarkdown: string;
+    descriptionMarkdown: string;
+    steps: ReactNode;
+    belowStepsMarkdown: string;
+    cta: ReactNode;
+    imageUrl: string | null;
+    imageAlt: string;
+}
+

package/dist/components/HowItWorksLawGeniusSection.js

@@ -0,0 +1,41 @@
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { howItWorksLawGeniusBelowStepsMarkdownClassName as h } from "./HowItWorksTemplateTokens.js";
+import { LawGeniusImageShell as p } from "./LawGeniusImageShell.js";
+import { Markdown as t } from "./Markdown.js";
+const v = ({
+  sectionTitle: s,
+  contentMarkdown: m,
+  descriptionMarkdown: a,
+  steps: r,
+  belowStepsMarkdown: i,
+  cta: n,
+  imageUrl: c,
+  imageAlt: x
+}) => {
+  const o = a.trim().length > 0, d = i.trim().length > 0;
+  return /* @__PURE__ */ e("section", { className: "bg-neutral-25 lg:px-ds-10xl px-6 pt-16 pb-12 sm:px-10", children: /* @__PURE__ */ e("div", { className: "bg-law-genius-section mx-auto w-full max-w-6xl rounded-3xl px-8 pt-16 pb-8 text-white shadow-[0_25px_80px_rgba(3,42,56,0.35)] sm:px-10 sm:pt-16 sm:pb-10", children: /* @__PURE__ */ l("div", { className: "flex w-full flex-col gap-8 lg:gap-10", children: [
+    /* @__PURE__ */ l("div", { className: "flex flex-col gap-4 text-center text-white", children: [
+      /* @__PURE__ */ e("h2", { className: "lg:text-super-large text-3xl font-bold lg:leading-tight", children: s }),
+      /* @__PURE__ */ e("div", { className: "[&_p]:text-medium [&_p]:text-white/80 [&_p:last-child]:mb-0", children: /* @__PURE__ */ e(t, { variant: "ratafia", content: m }) }),
+      o && /* @__PURE__ */ e("div", { className: "[&_p]:text-medium [&_p]:text-white/80 [&_p:last-child]:mb-0", children: /* @__PURE__ */ e(t, { variant: "ratafia", content: a }) })
+    ] }),
+    /* @__PURE__ */ l("div", { className: "flex w-full flex-col gap-8 lg:grid lg:grid-cols-[minmax(0,1fr)_minmax(0,1.05fr)] lg:items-stretch lg:gap-10", children: [
+      /* @__PURE__ */ l("div", { className: "flex min-h-0 flex-col gap-6", children: [
+        r,
+        d && /* @__PURE__ */ e(
+          t,
+          {
+            variant: "ratafia",
+            content: i,
+            className: h
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "w-full lg:w-fit", children: n })
+      ] }),
+      /* @__PURE__ */ e("div", { className: "relative z-10 mx-auto flex min-h-0 w-full max-w-77 shrink-0 items-center justify-center overflow-hidden rounded-lg md:mx-0 md:max-w-none", children: /* @__PURE__ */ e(p, { src: c, alt: x }) })
+    ] })
+  ] }) }) });
+};
+export {
+  v as HowItWorksLawGeniusSection
+};

package/dist/components/HowItWorksTemplate.d.ts

@@ -1,17 +1,4 @@
-import { ComponentPropsWithRef } from 'react';
 import { FC } from 'react';
-import { ReactNode } from 'react';
-
-export interface ButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'children'> {
-    children: ReactNode;
-    size?: ButtonSize;
-    variant?: ResponsiveButtonVariant;
-    iconPosition?: IconPosition;
-}
-
-export type ButtonSize = 'small' | 'default' | 'large';
-
-export type ButtonVariant = 'primary-green' | 'primary-darkgreen' | 'primary-yellow' | 'primary-white' | 'secondary-green' | 'secondary-yellow' | 'secondary-red' | 'secondary-black' | 'tertiary-bold' | 'tertiary-thin' | 'tertiary-icon' | 'tertiary-link' | 'icon-black' | 'icon-grey' | 'icon-mobile';
 
 export declare type HowItWorksExamplesProps = {
     eyebrow: string;
@@ -32,18 +19,20 @@ export declare type HowItWorksHeroBullet = {
 export declare type HowItWorksLawGeniusStep = {
     id: string;
     title: string;
-    description: string;
-    icon: ReactNode;
+    descriptionMarkdown: string;
+    iconUrl: string | null;
+    iconAlt?: string;
 };
 
 export declare type HowItWorksProcessStep = {
     id: string;
     title: string;
-    /** Column with text when not reversed; swap with image when `reverse` is true. */
-    body: ReactNode;
-    image: ReactNode;
+    bodyMarkdown: string;
+    imageUrl: string | null;
+    imageAlt: string;
     background: 'bg-white' | 'bg-neutral-25';
     reverse?: boolean;
+    imageFirstOnMobile?: boolean;
 };
 
 export declare const HowItWorksTemplate: FC<HowItWorksTemplateProps>;
@@ -52,37 +41,40 @@ export declare interface HowItWorksTemplateProps {
     hero: {
         eyebrow: string;
         title: string;
-        image: ReactNode;
-        intro: ReactNode;
+        imageUrl: string | null;
+        imageAlt: string;
+        imagePriority?: boolean;
+        introMarkdown: string;
         bullets: HowItWorksHeroBullet[];
-        closing: ReactNode;
-        cta: ButtonProps;
+        closingMarkdown: string;
+        cta: {
+            href: string;
+            label: string;
+        };
     };
     processSteps: HowItWorksProcessStep[];
     lawGenius: {
         title: string;
-        content: string;
+        contentMarkdown: string;
         steps: HowItWorksLawGeniusStep[];
-        belowStepsSlot: ReactNode;
-        cta: ButtonProps;
-        image: ReactNode;
+        belowStepsMarkdown: string;
+        imageUrl: string | null;
+        imageAlt: string;
+        cta: {
+            href: string;
+            label: string;
+        };
         sectionClassName?: string;
     };
     resources: {
         examples: HowItWorksExamplesProps;
-        image: ReactNode;
-        supportBody: ReactNode;
-        cta: ButtonProps;
+        supportBodyMarkdown: string;
+        imageUrl: string | null;
+        imageAlt: string;
+        cta: {
+            href: string;
+            label: string;
+        };
     };
 }
-
-export type IconPosition = 'left' | 'right' | 'top';
-
-export type ResponsiveButtonVariant = ButtonVariant | {
-    initial?: ButtonVariant;
-    sm?: ButtonVariant;
-    md?: ButtonVariant;
-    lg?: ButtonVariant;
-    xl?: ButtonVariant;
-};