@npm_leadtech/legal-contracts-ui 0.84.2 → 0.84.3

package/dist/components/AiLegalDocumentReviewerTemplate.d.ts

@@ -103,17 +103,19 @@ export interface Hero2SectionProps {
 }
 
 export interface HowItWorksSectionProps {
-    media: ReactNode;
+    imageSrc: string;
+    imageAlt: string;
     title: string;
     description: string;
     steps: HowItWorksStep[];
+    /** Optional overlays (badges, labels) absolutely positioned on the media */
+    imageOverlay?: ReactNode;
 }
 
 export interface HowItWorksStep {
-    id: string;
     title: string;
     description: string;
-    icon: ReactNode;
+    icon: string | ReactNode;
 }
 
 export interface LawgeniusAskQuestionsSectionProps {

package/dist/components/ElectronicSignatureTemplate.d.ts

@@ -69,17 +69,19 @@ export interface Hero2SectionProps {
 }
 
 export interface HowItWorksSectionProps {
-    media: ReactNode;
+    imageSrc: string;
+    imageAlt: string;
     title: string;
     description: string;
     steps: HowItWorksStep[];
+    /** Optional overlays (badges, labels) absolutely positioned on the media */
+    imageOverlay?: ReactNode;
 }
 
 export interface HowItWorksStep {
-    id: string;
     title: string;
     description: string;
-    icon: ReactNode;
+    icon: string | ReactNode;
 }
 
 export interface OnlineBenefit {

package/dist/components/HowItWorksSection.d.ts

@@ -4,16 +4,18 @@ import { ReactNode } from 'react';
 export declare const HowItWorksSection: FC<HowItWorksSectionProps>;
 
 export declare interface HowItWorksSectionProps {
-    media: ReactNode;
+    imageSrc: string;
+    imageAlt: string;
     title: string;
     description: string;
     steps: HowItWorksStep[];
+    /** Optional overlays (badges, labels) absolutely positioned on the media */
+    imageOverlay?: ReactNode;
 }
 
 export declare interface HowItWorksStep {
-    id: string;
     title: string;
     description: string;
-    icon: ReactNode;
+    icon: string | ReactNode;
 }
 

package/dist/components/HowItWorksSection.js

@@ -1,22 +1,36 @@
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { Markdown as c } from "./Markdown.js";
-const m = ({ media: a, title: d, description: i, steps: s }) => /* @__PURE__ */ e("section", { className: "bg-white", children: /* @__PURE__ */ l("div", { className: "mx-auto flex w-full flex-col gap-8 px-6 py-8 md:gap-12 lg:px-8 lg:py-12 xl:max-w-300 xl:flex-row xl:items-center xl:px-0", children: [
-  /* @__PURE__ */ e("div", { className: "relative order-2 overflow-hidden rounded-md shadow md:order-1 lg:mx-auto xl:shrink-0", children: a }),
-  /* @__PURE__ */ l("div", { className: "order-1 flex flex-col gap-6 text-neutral-800 md:order-2", children: [
-    /* @__PURE__ */ e("h2", { className: "text-super-large font-bold", children: d }),
-    /* @__PURE__ */ e(c, { className: "text-medium [&_p:last-child]:mb-0", content: i }),
-    /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-4 lg:grid-cols-3 xl:grid-cols-1", children: s.map((r) => /* @__PURE__ */ e("article", { className: "bg-neutral-25 rounded p-6", children: /* @__PURE__ */ l("div", { className: "flex flex-col items-start gap-2", children: [
-      /* @__PURE__ */ l("div", { className: "flex justify-center gap-2", children: [
-        r.icon,
-        /* @__PURE__ */ e("p", { className: "text-medium font-bold", children: r.title })
-      ] }),
-      /* @__PURE__ */ l("p", { className: "text-small", children: [
-        r.description,
-        " "
-      ] })
-    ] }) }, r.id)) })
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { SectionHeading as n } from "./SectionHeading.js";
+const h = ({
+  imageSrc: a,
+  imageAlt: r,
+  title: s,
+  description: t,
+  steps: c,
+  imageOverlay: d
+}) => /* @__PURE__ */ e("section", { className: "bg-white px-4 py-16", children: /* @__PURE__ */ i("div", { className: "mx-auto grid w-full max-w-6xl gap-12 lg:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]", children: [
+  /* @__PURE__ */ i("div", { className: "relative order-2 overflow-hidden rounded-3xl shadow-[0_25px_80px_rgba(3,42,56,0.25)] lg:order-1", children: [
+    /* @__PURE__ */ e("img", { src: a, alt: r, width: 737, height: 524, className: "h-full w-full object-cover" }),
+    d
+  ] }),
+  /* @__PURE__ */ i("div", { className: "order-1 space-y-6 lg:order-2", children: [
+    /* @__PURE__ */ e(n, { title: s, description: t, align: "start" }),
+    /* @__PURE__ */ e("div", { className: "space-y-4", children: c.map((l) => /* @__PURE__ */ e(
+      "article",
+      {
+        className: "bg-neutral-25 rounded-lg p-5",
+        style: { boxShadow: "var(--shadow-small)" },
+        children: /* @__PURE__ */ i("div", { className: "flex items-start gap-3", children: [
+          typeof l.icon == "string" ? /* @__PURE__ */ e("img", { src: l.icon, alt: "", width: 24, height: 24, className: "h-6 w-6" }) : /* @__PURE__ */ e("span", { className: "inline-flex h-6 w-6 shrink-0 items-center justify-center", children: l.icon }),
+          /* @__PURE__ */ i("div", { children: [
+            /* @__PURE__ */ e("p", { className: "text-medium font-bold text-neutral-800", children: l.title }),
+            /* @__PURE__ */ e("p", { className: "text-small text-neutral-800", children: l.description })
+          ] })
+        ] })
+      },
+      l.title
+    )) })
   ] })
 ] }) });
 export {
-  m as HowItWorksSection
+  h as HowItWorksSection
 };

package/dist/components/ValuesSection.js

@@ -1,16 +1,16 @@
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { TwoColumnSection as r } from "./TwoColumnSection.js";
-const i = ({ title: s, children: t, image: a }) => /* @__PURE__ */ e(
-  r,
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { TwoColumnSection as a } from "./TwoColumnSection.js";
+const o = ({ title: s, children: l, image: r }) => /* @__PURE__ */ e(
+  a,
   {
-    containerClassName: "gap-20 items-center",
-    firstColumn: /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e("div", { className: "bg-primary-50 rounded-3xl p-6", children: a }) }),
-    secondColumn: /* @__PURE__ */ l("div", { className: "flex-1 space-y-6 text-neutral-800", children: [
+    containerClassName: "gap-20 items-center flex-col-reverse",
+    firstColumn: /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e("div", { className: "bg-primary-50 rounded-3xl p-6", children: r }) }),
+    secondColumn: /* @__PURE__ */ t("div", { className: "flex-1 space-y-6 text-neutral-800", children: [
       /* @__PURE__ */ e("p", { className: "text-super-large font-bold text-neutral-900", children: s }),
-      /* @__PURE__ */ e("div", { className: "text-medium space-y-4", children: t })
+      /* @__PURE__ */ e("div", { className: "text-medium space-y-4", children: l })
     ] })
   }
 );
 export {
-  i as ValuesSection
+  o as ValuesSection
 };