@npm_leadtech/legal-contracts-ui 0.98.0 → 0.99.0

package/dist/components/AboutUsTemplate.d.ts

@@ -42,8 +42,12 @@ export interface ContactUsSectionProps {
 
 export interface CtaSectionProps {
     title: string;
+    paragraph?: ReactNode;
     cta: ButtonProps;
-    children: ReactNode;
+    children?: ReactNode;
+    className?: string;
+    contentClassName?: string;
+    childrenClassName?: string;
 }
 
 export interface ExpertsSectionProps {

package/dist/components/CtaSection.d.ts

@@ -13,14 +13,36 @@ 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 const CtaFeatureTag: FC<CtaFeatureTagProps>;
+
+export declare interface CtaFeatureTagProps {
+    icon: string;
+    text: string;
+    className?: string;
+}
+
+export declare const CtaSample: FC<CtaSampleProps>;
+
+export declare interface CtaSampleProps {
+    image: ReactNode;
+    children?: ReactNode;
+    className?: string;
+}
+
 export declare const CtaSection: FC<CtaSectionProps>;
 
 export declare interface CtaSectionProps {
     title: string;
+    paragraph?: ReactNode;
     cta: ButtonProps;
-    children: ReactNode;
+    children?: ReactNode;
+    className?: string;
+    contentClassName?: string;
+    childrenClassName?: string;
 }
 
+export declare const CtaSummarizedTag: FC<CtaFeatureTagProps>;
+
 export type IconPosition = 'left' | 'right' | 'top';
 
 export type ResponsiveButtonVariant = ButtonVariant | {

package/dist/components/CtaSection.js

@@ -1,12 +1,53 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { Button as t } from "./Button.js";
-const d = ({ title: r, cta: l, children: s }) => /* @__PURE__ */ e("section", { className: "px-4 py-16", children: /* @__PURE__ */ a("div", { className: "bg-primary-50 mx-auto max-w-6xl rounded-3xl p-10 shadow-sm lg:flex lg:items-center lg:gap-10", children: [
-  /* @__PURE__ */ a("div", { className: "flex-1 space-y-6", children: [
-    /* @__PURE__ */ e("p", { className: "text-super-large text-primary-900 font-bold", children: r }),
-    /* @__PURE__ */ e(t, { size: "large", variant: "primary-darkgreen", ...l })
-  ] }),
-  /* @__PURE__ */ e("div", { className: "mt-10 lg:mt-0", children: /* @__PURE__ */ e("div", { className: "relative rounded-3xl bg-white shadow-lg", children: s }) })
-] }) });
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { Button as c } from "./Button.js";
+const p = ({
+  title: a,
+  paragraph: l,
+  cta: t,
+  children: s,
+  className: m = "",
+  contentClassName: i = "",
+  childrenClassName: d = "hidden lg:flex"
+}) => /* @__PURE__ */ e("section", { className: `flex w-full justify-center px-6 py-8 md:px-8 md:py-12 ${m}`, children: /* @__PURE__ */ r(
+  "div",
+  {
+    className: `bg-primary-50 mx-auto flex w-full max-w-6xl flex-col items-center rounded-[1.25rem] px-8 pt-8 pb-0 md:px-16 md:pt-12 md:pb-0 lg:flex-row lg:items-stretch lg:gap-20 xl:pr-20 xl:pl-16 ${i}`,
+    children: [
+      /* @__PURE__ */ r("div", { className: "flex flex-1 flex-col items-start justify-center gap-8 pb-8 md:pb-12 lg:pb-[3rem]", children: [
+        /* @__PURE__ */ r("div", { className: "flex flex-col items-start gap-4", children: [
+          /* @__PURE__ */ e("h2", { className: "text-primary-900 text-[28px] leading-[32px] font-bold tracking-tight", children: a }),
+          !!l && /* @__PURE__ */ e("div", { className: "text-super-medium text-neutral-500", children: l })
+        ] }),
+        /* @__PURE__ */ e(c, { size: "large", variant: "primary-darkgreen", className: "px-4 py-2.5", ...t })
+      ] }),
+      !!s && /* @__PURE__ */ e("div", { className: `w-full justify-center lg:w-auto lg:items-end ${d}`, children: s })
+    ]
+  }
+) }), o = ({ image: a, children: l, className: t = "" }) => /* @__PURE__ */ r("div", { className: `relative flex items-end ${t}`, children: [
+  /* @__PURE__ */ e("div", { className: "[&_img]:rounded-t-[0.75rem] [&_img]:shadow-[0px_-2px_6px_0px_rgba(2,55,74,0.15)] md:[&_img]:max-w-[25rem] lg:[&_img]:max-h-[30rem]", children: a }),
+  l
+] }), g = ({ icon: a, text: l, className: t = "" }) => /* @__PURE__ */ r(
+  "div",
+  {
+    className: `bg-primary-50 border-primary-200 shadow-small absolute flex items-center justify-center gap-1 rounded-md border p-1 ${t}`,
+    children: [
+      /* @__PURE__ */ e("img", { src: a, alt: "", role: "img", className: "h-4 w-4" }),
+      /* @__PURE__ */ e("span", { className: "text-primary-900 text-small font-bold", children: l })
+    ]
+  }
+), u = ({ icon: a, text: l, className: t = "" }) => /* @__PURE__ */ r(
+  "div",
+  {
+    className: `shadow-small absolute flex items-center justify-center gap-1 rounded-md bg-neutral-50 p-2 ${t}`,
+    children: [
+      /* @__PURE__ */ e("img", { src: a, alt: "", role: "img", className: "h-5 w-5" }),
+      /* @__PURE__ */ e("span", { className: "text-small text-neutral-500", children: l })
+    ]
+  }
+);
 export {
-  d as CtaSection
+  u as CtaFeatureTag,
+  o as CtaSample,
+  p as CtaSection,
+  g as CtaSummarizedTag
 };