@npm_leadtech/legal-contracts-ui 0.68.0 → 0.68.2

package/dist/components/AllDocumentsTemplate.d.ts

@@ -54,11 +54,11 @@ export interface DefaultSubtypeDocumentProps extends BaseSubtypeDocumentProps {
 
 export interface DocumentCategoriesProps {
     title: string;
-    categories: Array<{
+    categories: {
         id: string;
         title: string;
         icon: ReactNode;
-    }>;
+    }[];
 }
 
 export interface DocumentItemProps {

package/dist/components/AllDocumentsTemplate.js

@@ -1,30 +1,30 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { JumboCard as i } from "./JumboCard.js";
-import { Breadcrumb as s } from "./Breadcrumb.js";
-import { DocumentCategories as x } from "./DocumentCategories.js";
-import { DocumentSection as n } from "./DocumentSection.js";
-import { ContentItem as f } from "./ContentItem.js";
-import { FaqSection as u } from "./FaqSection.js";
-const v = ({
-  jumbo: r,
-  breadcrumb: a,
-  categories: o,
-  documentSections: t,
-  contentItems: p,
-  faqSection: c
-}) => /* @__PURE__ */ l("main", { className: "mx-auto flex-1 px-6 py-8 lg:px-8 xl:max-w-300 xl:px-0", children: [
-  /* @__PURE__ */ e(i, { ...r }),
-  /* @__PURE__ */ e(s, { ...a, className: "pb-4" }),
-  /* @__PURE__ */ l("div", { className: "mx-auto flex flex-col justify-center gap-30 text-neutral-800 lg:flex-row", children: [
-    /* @__PURE__ */ e(x, { ...o }),
-    /* @__PURE__ */ l("div", { className: "flex flex-col gap-10 pb-15.5", children: [
-      t.map((m) => /* @__PURE__ */ e(n, { ...m }, m.id)),
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { JumboCard as p } from "./JumboCard.js";
+import { Breadcrumb as c } from "./Breadcrumb.js";
+import { DocumentCategories as n } from "./DocumentCategories.js";
+import { DocumentSection as x } from "./DocumentSection.js";
+import { ContentItem as d } from "./ContentItem.js";
+import { FaqSection as f } from "./FaqSection.js";
+const w = ({
+  jumbo: l,
+  breadcrumb: r,
+  categories: t,
+  documentSections: o,
+  contentItems: s,
+  faqSection: i
+}) => /* @__PURE__ */ m("main", { className: "mx-auto flex-1 px-6 py-8 lg:px-8 xl:max-w-300 xl:px-0", children: [
+  /* @__PURE__ */ e(p, { ...l }),
+  /* @__PURE__ */ e(c, { ...r, className: "pb-4" }),
+  /* @__PURE__ */ m("div", { className: "mx-auto flex justify-center gap-4 text-neutral-800 lg:gap-26.5 xl:gap-31.5", children: [
+    /* @__PURE__ */ e("aside", { className: "sticky top-14 hidden self-start md:block", children: /* @__PURE__ */ e(n, { ...t }) }),
+    /* @__PURE__ */ m("div", { className: "flex flex-col gap-10", children: [
+      o.map((a) => /* @__PURE__ */ e(x, { ...a }, a.id)),
       /* @__PURE__ */ e("span", { className: "h-px w-full bg-neutral-200" }),
-      /* @__PURE__ */ e("div", { className: "w-full", children: p.map((m) => /* @__PURE__ */ e(f, { ...m }, m.id)) }),
-      /* @__PURE__ */ e(u, { ...c })
+      /* @__PURE__ */ e("div", { className: "w-full", children: s.map((a) => /* @__PURE__ */ e(d, { ...a }, a.id)) }),
+      /* @__PURE__ */ e(f, { ...i })
     ] })
   ] })
 ] });
 export {
-  v as AllDocumentsTemplate
+  w as AllDocumentsTemplate
 };

package/dist/components/CategoryProductTemplate.d.ts

@@ -66,11 +66,11 @@ export interface DefaultSubtypeDocumentProps extends BaseSubtypeDocumentProps {
 
 export interface DocumentCategoriesProps {
     title: string;
-    categories: Array<{
+    categories: {
         id: string;
         title: string;
         icon: ReactNode;
-    }>;
+    }[];
 }
 
 export interface DocumentItemProps {

package/dist/components/DocumentCategories.d.ts

@@ -5,10 +5,10 @@ export declare const DocumentCategories: FC<DocumentCategoriesProps>;
 
 export declare interface DocumentCategoriesProps {
     title: string;
-    categories: Array<{
+    categories: {
         id: string;
         title: string;
         icon: ReactNode;
-    }>;
+    }[];
 }
 

package/dist/components/DocumentCategories.js

@@ -1,28 +1,48 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-const d = ({ categories: t, title: n }) => t.length === 0 ? null : /* @__PURE__ */ l("div", { className: "top-28 flex min-w-72 flex-col gap-6 rounded bg-white py-6 md:sticky", children: [
-  /* @__PURE__ */ l("div", { children: [
-    /* @__PURE__ */ e("p", { className: "text-big font-bold text-neutral-800", children: n }),
-    /* @__PURE__ */ e("div", { className: "mt-4 h-px w-full bg-neutral-200", "aria-hidden": !0 })
-  ] }),
-  /* @__PURE__ */ e("ul", { className: "flex flex-col gap-3", children: t.map((r, i) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ l(
-    "a",
-    {
-      href: `#${r.id}`,
-      className: `text-small flex items-center gap-4 rounded px-2 py-2 transition-colors ${i === 0 ? "bg-primary-50 text-primary-700 font-bold" : "hover:text-primary-700 text-neutral-800"}`,
-      children: [
-        /* @__PURE__ */ e(
-          "span",
-          {
-            className: `flex h-10 w-10 items-center justify-center rounded border ${i === 0 ? "border-primary-500 bg-white" : "border-neutral-200"}`,
-            "aria-hidden": !0,
-            children: r.icon
-          }
-        ),
-        /* @__PURE__ */ e("span", { className: "flex-1", children: r.title })
-      ]
-    }
-  ) }, r.id)) })
-] });
+"use client";
+import { jsxs as s, jsx as n } from "react/jsx-runtime";
+import { useState as d, useEffect as f } from "react";
+import m from "clsx";
+const p = ({ categories: t, title: a }) => {
+  const [c, o] = d(t[0]?.id || "");
+  return f(() => {
+    if (t.length === 0) return;
+    const e = new IntersectionObserver(
+      (l) => {
+        l.forEach((i) => {
+          i.isIntersecting && o(i.target.id);
+        });
+      },
+      { rootMargin: "-10% 0px -80% 0px", threshold: 0.1 }
+    );
+    return t.forEach((l) => {
+      const i = l.id, r = document.getElementById(i);
+      r && e.observe(r);
+    }), () => {
+      e.disconnect();
+    };
+  }, [t]), t.length === 0 ? null : /* @__PURE__ */ s("div", { className: "flex w-full max-w-71 min-w-65 flex-col gap-4 rounded bg-white", children: [
+    /* @__PURE__ */ n("p", { className: "text-big font-bold text-neutral-800", children: a }),
+    /* @__PURE__ */ n("span", { className: "h-px w-full bg-neutral-200", "aria-hidden": !0 }),
+    /* @__PURE__ */ n("ul", { className: "flex flex-col gap-4", children: t.map((e) => {
+      const l = c === e.id;
+      return /* @__PURE__ */ n("li", { children: /* @__PURE__ */ s(
+        "a",
+        {
+          href: `#${e.id}`,
+          className: m(
+            "text-small flex items-center gap-4 text-neutral-800 transition-all",
+            l && "font-bold"
+          ),
+          children: [
+            e.icon,
+            /* @__PURE__ */ n("span", { className: "flex-1", children: e.title })
+          ]
+        }
+      ) }, e.id);
+    }) }),
+    /* @__PURE__ */ n("span", { className: "h-px w-full bg-neutral-200", "aria-hidden": !0 })
+  ] });
+};
 export {
-  d as DocumentCategories
+  p as DocumentCategories
 };

package/dist/components/DocumentSection.js

@@ -1,6 +1,6 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import { DocumentItem as i } from "./DocumentItem.js";
-const o = ({ id: r, title: s, description: t, icon: c, documents: m }) => /* @__PURE__ */ l("article", { id: r, className: "flex max-w-198 scroll-mt-25 flex-col gap-6", children: [
+const o = ({ id: r, title: s, description: t, icon: c, documents: m }) => /* @__PURE__ */ l("article", { id: r, className: "flex max-w-198 scroll-mt-14 flex-col gap-6", children: [
   /* @__PURE__ */ l("div", { className: "flex gap-4 rounded bg-neutral-50 p-6", children: [
     c,
     /* @__PURE__ */ l("div", { className: "flex flex-1 flex-col gap-2 text-neutral-800", children: [
@@ -8,7 +8,7 @@ const o = ({ id: r, title: s, description: t, icon: c, documents: m }) => /* @__
       /* @__PURE__ */ e("p", { className: "text-medium", children: t })
     ] })
   ] }),
-  /* @__PURE__ */ e("div", { className: "flex flex-wrap justify-between gap-6", children: m.map((a) => /* @__PURE__ */ e(i, { ...a, className: "w-full md:w-48/100" }, a.id)) })
+  /* @__PURE__ */ e("div", { className: "flex flex-wrap justify-between gap-6", children: m.map((a) => /* @__PURE__ */ e(i, { ...a, className: "w-full lg:w-47/100" }, a.id)) })
 ] });
 export {
   o as DocumentSection