@npm_leadtech/legal-contracts-ui 0.124.0 → 0.124.2

package/dist/components/AllDocumentsTemplate.d.ts

@@ -96,6 +96,7 @@ export interface FaqSectionProps {
 export interface ImageWithPreviewProps {
     small: ReactNode;
     large: ReactNode;
+    onZoomClick?: () => void;
 }
 
 export interface JumboCardProps {

package/dist/components/ContentItem.d.ts

@@ -38,6 +38,7 @@ export interface DefaultSubtypeDocumentProps extends BaseSubtypeDocumentProps {
 export interface ImageWithPreviewProps {
     small: ReactNode;
     large: ReactNode;
+    onZoomClick?: () => void;
 }
 
 export interface LinkedProductProps {

package/dist/components/ImageWithPreview.d.ts

@@ -6,5 +6,6 @@ export declare const ImageWithPreview: FC<ImageWithPreviewProps>;
 export declare interface ImageWithPreviewProps {
     small: ReactNode;
     large: ReactNode;
+    onZoomClick?: () => void;
 }
 

package/dist/components/ImageWithPreview.js

@@ -1,15 +1,17 @@
 "use client";
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { useState as s } from "react";
-import { ZoomIcon as a } from "./ZoomIcon.js";
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { useState as n } from "react";
+import { ZoomIcon as c } from "./ZoomIcon.js";
 import { Modal as m } from "./Modal.js";
-const u = ({ small: r, large: i }) => {
-  const [o, t] = s(!1);
-  return /* @__PURE__ */ l("div", { className: "relative aspect-3/4 w-75 self-center overflow-hidden border border-neutral-200", children: [
-    /* @__PURE__ */ e("div", { className: "h-full w-full [&_img]:h-full [&_img]:w-full [&_img]:object-cover", children: r }),
-    /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ e(m, { trigger: /* @__PURE__ */ e(a, { className: "bg-primary-700 size-8 rounded p-2 opacity-80 hover:opacity-100" }), isOpen: o, setIsOpen: t, children: i }) })
+const b = ({ small: l, large: s, onZoomClick: r }) => {
+  const [t, o] = n(!1);
+  return /* @__PURE__ */ a("div", { className: "relative aspect-3/4 w-75 self-center overflow-hidden border border-neutral-200", children: [
+    /* @__PURE__ */ e("div", { className: "h-full w-full [&_img]:h-full [&_img]:w-full [&_img]:object-cover", children: l }),
+    /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ e(m, { trigger: /* @__PURE__ */ e(c, { className: "bg-primary-700 size-8 rounded p-2 opacity-80 hover:opacity-100" }), isOpen: t, setIsOpen: (i) => {
+      o(i), i && r && r();
+    }, children: s }) })
   ] });
 };
 export {
-  u as ImageWithPreview
+  b as ImageWithPreview
 };

package/dist/components/PreviewDownload.d.ts

@@ -4,6 +4,7 @@ import { ReactNode } from 'react';
 export interface ImageWithPreviewProps {
     small: ReactNode;
     large: ReactNode;
+    onZoomClick?: () => void;
 }
 
 export declare const PreviewDownload: FC<PreviewDownloadProps>;
@@ -15,5 +16,6 @@ export declare interface PreviewDownloadProps {
     footerText: string;
     pdfDownload: ReactNode;
     wordDownload: ReactNode;
+    onZoomClick?: () => void;
 }
 

package/dist/components/PreviewDownload.js

@@ -1,38 +1,41 @@
 "use client";
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { useState as f } from "react";
-import { ZoomIcon as u } from "./ZoomIcon.js";
-import { Modal as p } from "./Modal.js";
-import { Markdown as x } from "./Markdown.js";
+import { useState as h } from "react";
+import { ZoomIcon as x } from "./ZoomIcon.js";
+import { Modal as b } from "./Modal.js";
+import { Markdown as w } from "./Markdown.js";
 import { LinkWrapper as r } from "./LinkWrapper.js";
-const y = ({
-  title: t,
-  footerText: s,
+const k = ({
+  title: n,
+  footerText: i,
   preview: a,
-  cta: n,
-  pdfDownload: i,
-  wordDownload: c
+  cta: c,
+  pdfDownload: m,
+  wordDownload: o,
+  onZoomClick: t
 }) => {
-  const [o, m] = f(!1);
+  const [d, f] = h(!1), p = (s) => {
+    f(s), s && t && t();
+  };
   if (!a) return;
-  const d = /* @__PURE__ */ e(u, { className: "bg-primary-700 size-8 rounded p-2 opacity-80 hover:opacity-100" });
+  const u = /* @__PURE__ */ e(x, { className: "bg-primary-700 size-8 rounded p-2 opacity-80 hover:opacity-100" });
   return /* @__PURE__ */ l("div", { className: "bg-neutral-25 relative mt-24 flex flex-col items-center gap-4 rounded border border-neutral-200 p-6 pt-44 lg:max-w-76 xl:max-w-96.5", children: [
     /* @__PURE__ */ l("div", { className: "absolute -top-24 border border-neutral-200 shadow", children: [
       /* @__PURE__ */ e("div", { className: "h-full max-h-64.5 w-full max-w-50 overflow-hidden", children: a.small }),
-      /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ e(p, { trigger: d, isOpen: o, setIsOpen: m, children: a.large }) })
+      /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ e(b, { trigger: u, isOpen: d, setIsOpen: p, children: a.large }) })
     ] }),
-    /* @__PURE__ */ e(x, { className: "text-medium text-center text-neutral-800 [&_p:last-child]:mb-0", content: t }),
-    /* @__PURE__ */ e(r, { className: "w-full", variant: "primary-green", children: n }),
+    /* @__PURE__ */ e(w, { className: "text-medium text-center text-neutral-800 [&_p:last-child]:mb-0", content: n }),
+    /* @__PURE__ */ e(r, { className: "w-full", variant: "primary-green", children: c }),
     /* @__PURE__ */ e("div", { className: "h-px w-full bg-neutral-200" }),
     /* @__PURE__ */ l("div", { className: "flex w-full flex-col items-center gap-6", children: [
-      /* @__PURE__ */ e("p", { className: "text-small text-neutral-800", children: s }),
+      /* @__PURE__ */ e("p", { className: "text-small text-neutral-800", children: i }),
       /* @__PURE__ */ l("div", { className: "flex w-full gap-4", children: [
-        /* @__PURE__ */ e(r, { className: "w-full", variant: "secondary-black", children: i }),
-        /* @__PURE__ */ e(r, { className: "w-full", variant: "secondary-black", children: c })
+        /* @__PURE__ */ e(r, { className: "w-full", variant: "secondary-black", children: m }),
+        /* @__PURE__ */ e(r, { className: "w-full", variant: "secondary-black", children: o })
       ] })
     ] })
   ] });
 };
 export {
-  y as PreviewDownload
+  k as PreviewDownload
 };

package/dist/components/PreviewSection.d.ts

@@ -7,5 +7,6 @@ export declare interface PreviewSectionProps {
     title: string;
     documentPreview: string;
     cta: ReactNode;
+    onPreviewScroll?: () => void;
 }
 

package/dist/components/PreviewSection.js

@@ -1,13 +1,26 @@
-import { jsx as e, jsxs as o } from "react/jsx-runtime";
-import "react";
-import { SectionHeading as a } from "./SectionHeading.js";
-import { Markdown as n } from "./Markdown.js";
-import { LinkWrapper as s } from "./LinkWrapper.js";
-const d = ({ title: t, documentPreview: r, cta: l }) => /* @__PURE__ */ e("section", { className: "bg-secondary-50 px-4 py-10 text-neutral-900 md:px-8 xl:px-30", children: /* @__PURE__ */ o("div", { className: "mx-auto flex w-full max-w-300 flex-col items-center gap-8", children: [
-  /* @__PURE__ */ e(a, { title: t, titleClass: "text-neutral-800 font-bold font-inter text-large" }),
-  /* @__PURE__ */ e("div", { className: "flex max-h-89.75 w-full overflow-auto border border-neutral-200 bg-white px-8 py-8 md:py-16", children: /* @__PURE__ */ e(n, { useCustom: !1, className: "select-none", content: r }) }),
-  /* @__PURE__ */ e(s, { className: "w-full md:w-auto", children: l })
-] }) });
+"use client";
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { useRef as s } from "react";
+import { SectionHeading as c } from "./SectionHeading.js";
+import { Markdown as m } from "./Markdown.js";
+import { LinkWrapper as i } from "./LinkWrapper.js";
+const w = ({ title: l, documentPreview: o, cta: a, onPreviewScroll: r }) => {
+  const t = s(!1);
+  return /* @__PURE__ */ e("section", { className: "bg-secondary-50 px-4 py-10 text-neutral-900 md:px-8 xl:px-30", children: /* @__PURE__ */ n("div", { className: "mx-auto flex w-full max-w-300 flex-col items-center gap-8", children: [
+    /* @__PURE__ */ e(c, { title: l, titleClass: "text-neutral-800 font-bold font-inter text-large" }),
+    /* @__PURE__ */ e(
+      "div",
+      {
+        className: "flex max-h-89.75 w-full overflow-auto border border-neutral-200 bg-white px-8 py-8 md:py-16",
+        onScroll: () => {
+          !t.current && r && (t.current = !0, r());
+        },
+        children: /* @__PURE__ */ e(m, { useCustom: !1, className: "select-none", content: o })
+      }
+    ),
+    /* @__PURE__ */ e(i, { className: "w-full md:w-auto", children: a })
+  ] }) });
+};
 export {
-  d as PreviewSection
+  w as PreviewSection
 };

package/dist/components/ProductTemplate.d.ts

@@ -77,6 +77,7 @@ export interface FreeDocumentModalProps {
 export interface ImageWithPreviewProps {
     small: ReactNode;
     large: ReactNode;
+    onZoomClick?: () => void;
 }
 
 export type InputFieldData = {
@@ -133,12 +134,14 @@ export interface PreviewDownloadProps {
     footerText: string;
     pdfDownload: ReactNode;
     wordDownload: ReactNode;
+    onZoomClick?: () => void;
 }
 
 export interface PreviewSectionProps {
     title: string;
     documentPreview: string;
     cta: ReactNode;
+    onPreviewScroll?: () => void;
 }
 
 export interface ProductInfoProps {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@npm_leadtech/legal-contracts-ui",
-  "version": "0.124.0",
+  "version": "0.124.2",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",