@npm_leadtech/legal-contracts-ui 0.53.4 → 0.53.6

package/dist/components/Footer.js

@@ -1,25 +1,27 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import "react";
-import { FooterNav as o } from "./FooterNav.js";
-const N = ({
-  nav: x,
+import { PhoneButton as o } from "./PhoneButton.js";
+import { FooterNav as h } from "./FooterNav.js";
+const v = ({
+  nav: r,
   contactInfo: t,
-  logoGray: m,
-  socialLinks: c,
-  legalLinks: i,
-  disclaimerText: d,
+  logoGray: i,
+  socialLinks: d,
+  legalLinks: c,
+  disclaimerText: x,
   copyrightText: n,
   trustPilotWidget: s,
-  languageSelector: r
+  languageSelector: m
 }) => /* @__PURE__ */ l("footer", { className: "text-neutral-25", 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: [
-    x.map((a) => /* @__PURE__ */ e(o, { ...a }, a.title)),
+    r.map((a) => /* @__PURE__ */ e(h, { ...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-4 xl:hidden", children: !!r && /* @__PURE__ */ e("div", { className: "language-selector-mobile-container", children: r }) }),
+        /* @__PURE__ */ e("div", { className: "mb-4 xl:hidden", children: !!m && /* @__PURE__ */ e("div", { className: "language-selector-mobile-container", children: m }) }),
         /* @__PURE__ */ l("div", { children: [
-          /* @__PURE__ */ e("p", { className: "text-small font-bold text-white", children: t.phoneNumber }),
-          /* @__PURE__ */ l("p", { className: "text-neutral-25 text-center text-[16px] md:text-left md:text-[12px]", 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 }) }),
+          /* @__PURE__ */ l("p", { className: "text-neutral-25 text-medium md:text-small text-center md:text-left", children: [
             t.contactHoursText,
             " ",
             t.contactHours
@@ -31,15 +33,15 @@ const N = ({
   ] }) }),
   /* @__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: [
-      m,
-      /* @__PURE__ */ e("div", { className: "flex gap-4", children: c?.map((a) => a) })
+      i,
+      /* @__PURE__ */ e("div", { className: "flex gap-4", children: d?.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: i?.map((a) => a) }),
-    /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: d }),
+    /* @__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("p", { className: "text-extra-small text-neutral-400", children: n })
   ] }) })
 ] });
 export {
-  N as Footer
+  v as Footer
 };

package/dist/components/Header.d.ts

@@ -56,7 +56,6 @@ export interface MobileMenuSection {
     items?: {
         id: string;
         link: ReactNode;
-        tag?: string;
     }[];
     seeAll?: ReactNode | null;
     content?: ReactNode | null;
@@ -68,9 +67,6 @@ export type NavMenuItemProps = {
     dropdownItems: (NavMenuItemProps | NavMenuLink)[];
     hasDropdown: true;
     isNested?: boolean;
-    onItemClick?: () => void;
-    isOpen?: boolean;
-    onToggle?: (open: boolean) => void;
 };
 
 export type NavMenuLink = {
@@ -80,9 +76,6 @@ export type NavMenuLink = {
     hasDropdown: false;
     isNested?: boolean;
     bold?: boolean;
-    onItemClick?: () => void;
-    isOpen?: boolean;
-    onToggle?: (open: boolean) => void;
 };
 
 export interface NavMenuProps {

package/dist/components/MobileMenu.d.ts

@@ -30,7 +30,6 @@ export declare interface MobileMenuSection {
     items?: {
         id: string;
         link: ReactNode;
-        tag?: string;
     }[];
     seeAll?: ReactNode | null;
     content?: ReactNode | null;

package/dist/components/MobileMenu.js

@@ -1,28 +1,28 @@
 import { jsxs as l, jsx as r } from "react/jsx-runtime";
 import "react";
-import { SearchBar as u } from "./SearchBar.js";
+import { SearchBar as x } from "./SearchBar.js";
 import { PhoneTalkIcon as f } from "./PhoneTalkIcon.js";
 import { CloseIcon as h } from "./CloseIcon.js";
 const j = ({
-  isOpen: n,
-  onClose: m,
-  logo: d,
-  userActions: c,
-  searchBarProps: o,
-  sections: p = [],
+  isOpen: m,
+  onClose: n,
+  logo: c,
+  userActions: d,
+  searchBarProps: p,
+  sections: o = [],
   contactInfo: t,
-  closeText: x
-}) => n ? /* @__PURE__ */ l("div", { className: "fixed inset-0 z-50 flex flex-col overflow-y-auto bg-white text-neutral-800 lg:hidden", children: [
+  closeText: u
+}) => m ? /* @__PURE__ */ l("div", { className: "fixed inset-0 z-50 flex flex-col overflow-y-auto bg-white text-neutral-800 lg:hidden", children: [
   /* @__PURE__ */ l("div", { className: "flex items-center justify-between px-6 py-4", children: [
-    d,
+    c,
     /* @__PURE__ */ l(
       "button",
       {
         className: "text-small text-primary-500 flex cursor-pointer items-center justify-center gap-1 rounded border border-neutral-400 px-2 py-1",
-        onClick: m,
+        onClick: n,
         "aria-label": "Close menu",
         children: [
-          x,
+          u,
           /* @__PURE__ */ r(h, { fill: "var(--primary-500)" })
         ]
       }
@@ -30,31 +30,27 @@ const j = ({
   ] }),
   /* @__PURE__ */ l("div", { className: "flex flex-1 flex-col pb-6", children: [
     /* @__PURE__ */ l("div", { className: "flex flex-col gap-6 px-6", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-4", children: c }),
-      /* @__PURE__ */ r(u, { ...o })
+      /* @__PURE__ */ r("div", { className: "flex items-center gap-4", children: d }),
+      /* @__PURE__ */ r(x, { ...p })
     ] }),
-    /* @__PURE__ */ r("nav", { className: "flex flex-col gap-0", children: p.map((e, s) => {
-      const i = e.icon != null;
-      return e.content != null ? /* @__PURE__ */ r("div", { className: "flex items-center px-6 pb-8", children: e.content }, e.id ?? `custom-${s.toString()}`) : /* @__PURE__ */ l(
+    /* @__PURE__ */ r("nav", { className: "flex flex-col gap-0", children: o.map((e, i) => {
+      const a = e.icon != null;
+      return e.content != null ? /* @__PURE__ */ r("div", { className: "flex items-center px-6 pb-8", children: e.content }, e.id ?? `custom-${i.toString()}`) : /* @__PURE__ */ l(
         "div",
         {
-          className: e.title !== "" && !i ? "border-t border-b border-neutral-200 pt-4" : "",
+          className: e.title !== "" && !a ? "border-t border-b border-neutral-200 pt-4" : "",
           children: [
-            e.title && /* @__PURE__ */ l("div", { className: `flex items-center gap-2 px-6 ${i ? "bg-neutral-50 py-4" : ""}`, children: [
+            e.title && /* @__PURE__ */ l("div", { className: `flex items-center gap-2 px-6 ${a ? "bg-neutral-50 py-4" : ""}`, children: [
               e.icon != null && /* @__PURE__ */ r("span", { className: "text-primary-700", children: e.icon }),
               /* @__PURE__ */ r("h4", { className: "text-medium font-semibold", children: e.title })
             ] }),
-            e.items != null && /* @__PURE__ */ l("ul", { className: `flex flex-col gap-4 ${i ? "p-6" : "px-6 py-4"}`, children: [
-              e.items.map((a) => /* @__PURE__ */ l("li", { className: "text-medium flex items-center gap-1", children: [
-                a.link,
-                " ",
-                a.tag && /* @__PURE__ */ r("span", { className: "bg-secondary-200 text-extra-small flex h-4.5 w-5.25 items-center justify-center rounded align-middle font-bold", children: a.tag })
-              ] }, a.id)),
+            e.items != null && /* @__PURE__ */ l("ul", { className: `flex flex-col gap-4 ${a ? "p-6" : "px-6 py-4"}`, children: [
+              e.items.map((s) => /* @__PURE__ */ r("li", { className: "text-medium", children: s.link }, s.id)),
               e.seeAll != null && /* @__PURE__ */ r("li", { className: "font-semibold", children: e.seeAll })
             ] })
           ]
         },
-        e.id ?? e.title ?? s.toString()
+        e.id ?? e.title ?? i.toString()
       );
     }) }),
     t && /* @__PURE__ */ l("div", { className: "mt-auto flex flex-col items-center justify-center border-t border-neutral-100 p-6", children: [

package/dist/components/NavMenu.d.ts

@@ -9,9 +9,6 @@ export type NavMenuItemProps = {
     dropdownItems: (NavMenuItemProps | NavMenuLink)[];
     hasDropdown: true;
     isNested?: boolean;
-    onItemClick?: () => void;
-    isOpen?: boolean;
-    onToggle?: (open: boolean) => void;
 };
 
 export type NavMenuLink = {
@@ -21,9 +18,6 @@ export type NavMenuLink = {
     hasDropdown: false;
     isNested?: boolean;
     bold?: boolean;
-    onItemClick?: () => void;
-    isOpen?: boolean;
-    onToggle?: (open: boolean) => void;
 };
 
 export declare interface NavMenuProps {

package/dist/components/NavMenu.js

@@ -1,21 +1,7 @@
-"use client";
-import { jsx as r } from "react/jsx-runtime";
-import { useState as m } from "react";
-import { NavMenuItem as n } from "./NavMenuItem.js";
-const c = ({ navItems: l, className: o = "" }) => {
-  const [t, i] = m(null);
-  return /* @__PURE__ */ r("nav", { className: o, children: /* @__PURE__ */ r("ul", { className: "text-medium flex flex-wrap items-center gap-4 xl:gap-8", children: l.map((e) => /* @__PURE__ */ r(
-    n,
-    {
-      ...e,
-      isOpen: t === e.id,
-      onToggle: (p) => {
-        i(p ? e.id : null);
-      }
-    },
-    e.id
-  )) }) });
-};
+import { jsx as e } from "react/jsx-runtime";
+import "react";
+import { NavMenuItem as a } from "./NavMenuItem.js";
+const o = ({ navItems: m, className: t = "" }) => /* @__PURE__ */ e("nav", { className: t, children: /* @__PURE__ */ e("ul", { className: "text-medium flex flex-wrap items-center gap-4 xl:gap-8", children: m.map((r) => /* @__PURE__ */ e(a, { ...r }, r.id)) }) });
 export {
-  c as NavMenu
+  o as NavMenu
 };

package/dist/components/NavMenuItem.d.ts

@@ -9,9 +9,6 @@ export declare type NavMenuItemProps = {
     dropdownItems: (NavMenuItemProps | NavMenuLink)[];
     hasDropdown: true;
     isNested?: boolean;
-    onItemClick?: () => void;
-    isOpen?: boolean;
-    onToggle?: (open: boolean) => void;
 };
 
 export declare type NavMenuLink = {
@@ -21,8 +18,5 @@ export declare type NavMenuLink = {
     hasDropdown: false;
     isNested?: boolean;
     bold?: boolean;
-    onItemClick?: () => void;
-    isOpen?: boolean;
-    onToggle?: (open: boolean) => void;
 };
 

package/dist/components/NavMenuItem.js

@@ -1,104 +1,61 @@
-"use client";
-import { jsxs as d, jsx as t } from "react/jsx-runtime";
-import { useState as p, useCallback as E, useRef as T, useEffect as $ } from "react";
-import { ChevronDownIcon as j } from "./ChevronDownIcon.js";
-import { ChevronRightIcon as P } from "./ChevronRightIcon.js";
-const R = (l) => {
-  const { hasDropdown: g, isNested: w, isOpen: v, onToggle: i } = l, [x, C] = p(!1), [I, u] = p(null), s = v ?? x, n = E(
-    (e) => {
-      e || u(null), i ? i(e) : C(e);
-    },
-    [i]
-  ), r = T(null);
-  $(() => {
-    if (!s) return;
-    const e = (c) => {
-      r.current && !r.current.contains(c.target) && n(!1);
-    };
-    return document.addEventListener("mousedown", e), () => {
-      document.removeEventListener("mousedown", e);
-    };
-  }, [s, n]);
-  const m = {
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import "react";
+import { ChevronDownIcon as g } from "./ChevronDownIcon.js";
+import { ChevronRightIcon as f } from "./ChevronRightIcon.js";
+const h = (o) => {
+  const { hasDropdown: a, isNested: i } = o, n = {
     topLevel: {
-      liClass: "relative py-2",
+      liClass: "group relative py-2",
       triggerClass: "hover:text-neutral-600",
       dropdownPosition: "top-full left-0",
-      Icon: j
+      dropdownTrigger: "group-hover:pointer-events-auto group-hover:opacity-100",
+      Icon: g,
+      iconClass: "transition-transform duration-200 group-hover:rotate-180"
     },
     nested: {
-      liClass: "relative",
+      liClass: "group/nested relative",
       triggerClass: "p-1 hover:bg-primary-100 w-full rounded min-w-48.5",
       dropdownPosition: "top-0 left-full -mt-4 pl-6",
-      Icon: P
+      dropdownTrigger: "group-hover/nested:pointer-events-auto group-hover/nested:opacity-100",
+      Icon: f,
+      iconClass: ""
     }
-  }, o = w ? m.nested : m.topLevel, b = o.Icon, f = () => {
-    n(!1), l.onItemClick && l.onItemClick();
-  }, N = (e) => {
-    e.stopPropagation(), n(!s);
-  }, k = () => {
-    globalThis.window.matchMedia("(hover: hover)").matches && n(!0);
-  }, O = () => {
-    globalThis.window.matchMedia("(hover: hover)").matches && n(!1);
-  };
-  if (g) {
-    const { dropdownItems: e, label: c } = l;
-    return /* @__PURE__ */ d(
-      "li",
-      {
-        ref: r,
-        className: o.liClass,
-        onMouseEnter: k,
-        onMouseLeave: O,
-        children: [
-          /* @__PURE__ */ d(
-            "button",
-            {
-              className: `text-small flex w-full cursor-pointer items-center justify-between gap-1 font-medium text-nowrap text-neutral-800 transition-colors ${o.triggerClass}`,
-              "aria-haspopup": "menu",
-              "aria-expanded": s,
-              onClick: N,
-              children: [
-                /* @__PURE__ */ t("span", { className: "text-medium", children: c }),
-                /* @__PURE__ */ t(b, { fill: "#000", width: 20, height: 20 })
-              ]
-            }
-          ),
-          /* @__PURE__ */ t(
-            "div",
-            {
-              className: `absolute z-50 min-w-48 transition-all duration-200 ${o.dropdownPosition} ${s ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0"}`,
-              children: /* @__PURE__ */ t("div", { className: "rounded-md border border-neutral-200 bg-white p-4 shadow-lg", children: /* @__PURE__ */ t("ul", { className: "flex flex-col gap-2", children: e.map((a) => /* @__PURE__ */ t(
-                R,
-                {
-                  ...a,
-                  isNested: !0,
-                  onItemClick: f,
-                  isOpen: I === a.id,
-                  onToggle: (M) => {
-                    u(M ? a.id : null);
-                  }
-                },
-                a.id
-              )) }) })
-            }
-          )
-        ]
-      }
-    );
+  }, t = i ? n.nested : n.topLevel, d = t.Icon;
+  if (a) {
+    const { dropdownItems: u, label: m } = o;
+    return /* @__PURE__ */ r("li", { className: t.liClass, children: [
+      /* @__PURE__ */ r(
+        "button",
+        {
+          className: `text-small flex w-full cursor-pointer items-center justify-between gap-1 font-medium text-nowrap text-neutral-800 transition-colors ${t.triggerClass} `,
+          "aria-haspopup": "menu",
+          children: [
+            /* @__PURE__ */ e("span", { className: "text-medium", children: m }),
+            /* @__PURE__ */ e(d, { className: t.iconClass, fill: "#000", width: 20, height: 20 })
+          ]
+        }
+      ),
+      /* @__PURE__ */ e(
+        "div",
+        {
+          className: `pointer-events-none absolute z-50 min-w-48 opacity-0 transition-opacity duration-200 ${t.dropdownPosition} ${t.dropdownTrigger} `,
+          children: /* @__PURE__ */ e("div", { className: "rounded-md border border-neutral-200 bg-white p-4 shadow-lg", children: /* @__PURE__ */ e("ul", { className: "flex flex-col gap-2", children: u.map((l) => /* @__PURE__ */ e(h, { ...l, isNested: !0 }, l.id)) }) })
+        }
+      )
+    ] });
   }
-  const { link: y, tag: h, bold: L } = l;
-  return /* @__PURE__ */ t("li", { className: o.liClass, onClick: f, children: /* @__PURE__ */ d(
+  const { link: c, tag: s, bold: p } = o;
+  return /* @__PURE__ */ e("li", { className: t.liClass, children: /* @__PURE__ */ r(
     "span",
     {
-      className: `text-small relative flex w-full items-center gap-1 font-medium text-nowrap text-neutral-800 transition-colors ${o.triggerClass} `,
+      className: `text-small relative flex w-full items-center justify-between gap-1 font-medium text-nowrap text-neutral-800 transition-colors ${t.triggerClass} `,
       children: [
-        /* @__PURE__ */ t("span", { className: `text-medium flex-1 ${L ? "font-bold" : ""} [&_a]:after:absolute [&_a]:after:inset-0`, children: y }),
-        h && /* @__PURE__ */ t("span", { className: "bg-secondary-200 text-extra-small flex h-4.5 w-5.25 items-center justify-center rounded align-middle font-bold", children: h })
+        /* @__PURE__ */ e("span", { className: `text-medium flex-1 ${p ? "font-bold" : ""} [&_a]:after:absolute [&_a]:after:inset-0`, children: c }),
+        s && /* @__PURE__ */ e("span", { className: "bg-secondary-200 text-extra-small rounded px-1 font-bold", children: s })
       ]
     }
   ) });
 };
 export {
-  R as NavMenuItem
+  h as NavMenuItem
 };

package/dist/components/PhoneButton.d.ts

@@ -0,0 +1,9 @@
+import { JSX } from 'react/jsx-runtime';
+
+export declare const PhoneButton: ({ phoneNumber, className }: PhoneButtonProps) => JSX.Element;
+
+export interface PhoneButtonProps {
+    phoneNumber: string;
+    className?: string;
+}
+

package/dist/components/PhoneButton.js

@@ -0,0 +1,16 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { PhoneIcon as r } from "./PhoneIcon.js";
+const h = ({ phoneNumber: t, className: i = "" }) => /* @__PURE__ */ n(
+  "a",
+  {
+    href: `tel:${t}`,
+    className: `bg-primary-700 inline-flex w-full items-center justify-center gap-2 rounded py-2.75 text-[16px] font-bold text-white ${i}`,
+    children: [
+      /* @__PURE__ */ e(r, { fill: "white", width: 20, height: 20 }),
+      /* @__PURE__ */ e("span", { children: t })
+    ]
+  }
+);
+export {
+  h as PhoneButton
+};

package/dist/components/PhoneIcon.d.ts

@@ -0,0 +1,8 @@
+import { default as default_2 } from 'react';
+
+export declare const PhoneIcon: default_2.FC<{
+    width?: number;
+    height?: number;
+    fill?: string;
+}>;
+

package/dist/components/PhoneIcon.js

@@ -0,0 +1,16 @@
+import { jsx as o } from "react/jsx-runtime";
+import "react";
+const p = ({
+  width: n = 24,
+  height: C = 24,
+  fill: r = "none"
+}) => /* @__PURE__ */ o("svg", { viewBox: "0 0 24 24", width: n, height: C, fill: r, xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ o("g", { id: "Icon/Symbol/phone_24px", children: /* @__PURE__ */ o(
+  "path",
+  {
+    id: "path",
+    d: "M20.01 15.38C18.78 15.38 17.59 15.18 16.48 14.82C16.13 14.7 15.74 14.79 15.47 15.06L13.9 17.03C11.07 15.68 8.42 13.13 7.01 10.2L8.96 8.54C9.23 8.26 9.31 7.87 9.2 7.52C8.83 6.41 8.64 5.22 8.64 3.99C8.64 3.45 8.19 3 7.65 3H4.19C3.65 3 3 3.24 3 3.99C3 13.28 10.73 21 20.01 21C20.72 21 21 20.37 21 19.82V16.37C21 15.83 20.55 15.38 20.01 15.38Z"
+  }
+) }) });
+export {
+  p as PhoneIcon
+};