@npm_leadtech/legal-contracts-ui 0.52.0 → 0.52.2

package/dist/components/Header.d.ts

@@ -14,15 +14,10 @@ export declare const Header: FC<HeaderProps>;
 export declare interface HeaderProps {
     logo: ReactNode;
     navMenu: NavMenuProps;
-    seeAll: ReactNode;
     searchBarProps: SearchBarProps;
     languageSelectorProps?: LanguageSelectorProps;
     userActions: ReactNode;
-    isMobileMenuOpen?: boolean;
-    onOpenMobileMenu?: () => void;
-    onCloseMobileMenu?: () => void;
-    mobileMenuSections?: MobileMenuSection[];
-    mobileContactInfo?: MobileContactInfo;
+    mobileMenu: MobileMenuProps;
 }
 
 export interface LanguageSelectorProps {
@@ -35,20 +30,33 @@ export interface LanguageSelectorProps {
 
 export type LanguageSelectorVariant = 'default' | 'compact';
 
-export declare interface MobileContactInfo {
+export interface MobileContactInfo {
     phoneNumber: string;
     contactHoursLabel?: string;
     contactHours?: string;
 }
 
-export declare interface MobileMenuSection {
+export interface MobileMenuProps {
+    isOpen: boolean;
+    onOpen: () => void;
+    onClose: () => void;
+    logo: ReactNode;
+    userActions: ReactNode;
+    searchBarProps: SearchBarProps;
+    sections?: MobileMenuSection[];
+    contactInfo?: MobileContactInfo;
+}
+
+export interface MobileMenuSection {
+    id?: string;
     title?: string;
-    icon?: ReactNode;
-    items: {
+    icon: ReactNode | null;
+    items?: {
         label: string;
         href?: string;
     }[];
-    seeAll?: ReactNode;
+    seeAll?: ReactNode | null;
+    content?: ReactNode | null;
 }
 
 export interface NavMenuItemProps {
@@ -59,10 +67,12 @@ export interface NavMenuItemProps {
     dropdownContent?: ReactNode;
     tag?: string;
     isNested?: boolean;
+    bold?: boolean;
 }
 
 export interface NavMenuProps {
     navItems: NavMenuItemProps[];
+    className?: string;
 }
 
 export interface SearchBarProps {

package/dist/components/Header.js

@@ -1,112 +1,41 @@
-import { jsxs as l, Fragment as N, jsx as e } from "react/jsx-runtime";
+import { jsxs as r, Fragment as d, jsx as e } from "react/jsx-runtime";
 import "react";
-import { NavMenu as b } from "./NavMenu.js";
+import { MobileMenu as c } from "./MobileMenu.js";
+import { NavMenu as s } from "./NavMenu.js";
+import { LanguageSelector as p } from "./LanguageSelector.js";
+import { HamburgerIcon as o } from "./HamburgerIcon.js";
 import { SearchBar as x } from "./SearchBar.js";
-import { LanguageSelector as v } from "./LanguageSelector.js";
-import { HamburgerIcon as y } from "./HamburgerIcon.js";
-import { PhoneTalkIcon as g } from "./PhoneTalkIcon.js";
-import { CloseIcon as j } from "./CloseIcon.js";
-const S = ({
-  logo: i,
-  navMenu: p,
-  seeAll: f,
-  searchBarProps: c,
-  languageSelectorProps: s,
-  userActions: n,
-  isMobileMenuOpen: d,
-  onOpenMobileMenu: h,
-  onCloseMobileMenu: m,
-  mobileMenuSections: o = [],
-  mobileContactInfo: a
-}) => /* @__PURE__ */ l(N, { children: [
-  /* @__PURE__ */ e("header", { className: "bg-primary-50", children: /* @__PURE__ */ l("div", { className: "flex w-full items-center justify-between px-4 py-4 text-neutral-800 md:px-8", children: [
-    /* @__PURE__ */ l("div", { className: "flex flex-1 items-center gap-8", children: [
-      i,
-      /* @__PURE__ */ e("div", { className: "hidden lg:block", children: /* @__PURE__ */ e(b, { ...p }) })
+const j = ({
+  logo: a,
+  navMenu: m,
+  searchBarProps: l,
+  languageSelectorProps: n,
+  userActions: t,
+  mobileMenu: i
+}) => /* @__PURE__ */ r(d, { children: [
+  /* @__PURE__ */ e("header", { className: "bg-primary-50", children: /* @__PURE__ */ r("div", { className: "flex w-full items-center justify-between px-4 py-4 text-neutral-800 md:px-8", children: [
+    /* @__PURE__ */ r("div", { className: "flex flex-1 items-center gap-8", children: [
+      a,
+      /* @__PURE__ */ e(s, { className: "hidden lg:block", ...m })
     ] }),
-    /* @__PURE__ */ l("div", { className: "text-medium hidden flex-wrap items-center gap-4 lg:flex xl:gap-6", children: [
-      /* @__PURE__ */ e(x, { ...c }),
-      s && /* @__PURE__ */ e("div", { className: "hidden xl:block", children: /* @__PURE__ */ e(v, { ...s }) }),
-      n
+    /* @__PURE__ */ r("div", { className: "text-medium hidden flex-wrap items-center gap-4 lg:flex xl:gap-6", children: [
+      /* @__PURE__ */ e(x, { ...l }),
+      n && /* @__PURE__ */ e("div", { className: "hidden xl:block", children: /* @__PURE__ */ e(p, { ...n }) }),
+      t
     ] }),
     /* @__PURE__ */ e(
       "button",
       {
         className: "flex cursor-pointer items-center justify-center p-2 lg:hidden",
-        onClick: h,
+        onClick: i.onOpen,
         "aria-label": "Open menu",
-        "aria-expanded": d,
-        children: /* @__PURE__ */ e(y, {})
+        "aria-expanded": i.isOpen,
+        children: /* @__PURE__ */ e(o, {})
       }
     )
   ] }) }),
-  d && /* @__PURE__ */ l("div", { className: "fixed inset-0 z-50 flex flex-col overflow-y-auto bg-white lg:hidden", children: [
-    /* @__PURE__ */ l("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      i,
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "flex cursor-pointer items-center justify-center p-2",
-          onClick: m,
-          "aria-label": "Close menu",
-          children: /* @__PURE__ */ e(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__ */ e("div", { className: "flex items-center gap-4", children: n }),
-        /* @__PURE__ */ e(x, { ...c })
-      ] }),
-      /* @__PURE__ */ e("nav", { className: "flex-1", children: o.map((r, u) => /* @__PURE__ */ l(
-        "div",
-        {
-          className: `py-4 ${r.icon == null && r.title ? "border-t border-b border-neutral-200" : ""}`,
-          children: [
-            r.title && /* @__PURE__ */ l("div", { className: `flex items-start px-6 ${r.icon == null ? "py-2" : "bg-neutral-50 py-4"}`, children: [
-              r.icon !== null && /* @__PURE__ */ e("span", { className: "text-primary-700 mr-4", children: r.icon }),
-              /* @__PURE__ */ e("h4", { className: "text-base font-semibold text-neutral-800", children: r.title })
-            ] }),
-            /* @__PURE__ */ l("div", { className: "", children: [
-              /* @__PURE__ */ e("ul", { className: "mt-3 flex flex-col", children: r.items.map((t) => /* @__PURE__ */ e("li", { className: "hover:bg-primary-100 py-3 pl-6", children: /* @__PURE__ */ e(
-                "a",
-                {
-                  href: t.href ?? "#",
-                  className: "hover:text-primary-700 text-base transition-colors",
-                  onClick: m,
-                  children: t.label
-                }
-              ) }, t.label)) }),
-              r.seeAll
-            ] })
-          ]
-        },
-        r.title ?? u
-      )) }),
-      /* @__PURE__ */ e("div", { className: "my-4 flex items-center justify-center", children: f }),
-      a && /* @__PURE__ */ l("div", { className: "mt-auto flex flex-col items-center justify-center border-t border-neutral-100 p-6", children: [
-        /* @__PURE__ */ l(
-          "a",
-          {
-            href: `tel:${a.phoneNumber.replaceAll(" ", "")}`,
-            className: "bg-primary-700 flex w-full items-center justify-center gap-2 rounded-md p-3 text-base font-semibold text-white",
-            children: [
-              /* @__PURE__ */ e(g, { fill: "#ffff" }),
-              a.phoneNumber
-            ]
-          }
-        ),
-        a.contactHours && /* @__PURE__ */ l("p", { className: "text-small mt-4 text-base text-neutral-500", children: [
-          a.contactHoursLabel != null && /* @__PURE__ */ l("span", { children: [
-            a.contactHoursLabel,
-            " "
-          ] }),
-          a.contactHours
-        ] })
-      ] })
-    ] })
-  ] })
+  /* @__PURE__ */ e(c, { ...i, logo: a, userActions: t, searchBarProps: l })
 ] });
 export {
-  S as Header
+  j as Header
 };

package/dist/components/MobileMenu.d.ts

@@ -0,0 +1,52 @@
+import { FC } from 'react';
+import * as React_2 from 'react';
+import { ReactNode } from 'react';
+
+export declare interface MobileContactInfo {
+    phoneNumber: string;
+    contactHoursLabel?: string;
+    contactHours?: string;
+}
+
+export declare const MobileMenu: FC<MobileMenuProps>;
+
+export declare interface MobileMenuProps {
+    isOpen: boolean;
+    onOpen: () => void;
+    onClose: () => void;
+    logo: ReactNode;
+    userActions: ReactNode;
+    searchBarProps: SearchBarProps;
+    sections?: MobileMenuSection[];
+    contactInfo?: MobileContactInfo;
+}
+
+export declare interface MobileMenuSection {
+    id?: string;
+    title?: string;
+    icon: ReactNode | null;
+    items?: {
+        label: string;
+        href?: string;
+    }[];
+    seeAll?: ReactNode | null;
+    content?: ReactNode | null;
+}
+
+export interface SearchBarProps {
+    items: SearchItem[];
+    placeholder?: string;
+    isOpen?: boolean;
+    onToggle?: () => void;
+    searchValue?: string;
+    onInputChange?: (e: React_2.ChangeEvent<HTMLInputElement>) => void;
+    onClear?: () => void;
+    noResultsText?: string;
+    allDocumentsItem?: SearchItem;
+}
+
+export interface SearchItem {
+    label: string;
+    href: string;
+}
+

package/dist/components/MobileMenu.js

@@ -0,0 +1,76 @@
+import { jsxs as r, jsx as l } from "react/jsx-runtime";
+import "react";
+import { SearchBar as f } from "./SearchBar.js";
+import { PhoneTalkIcon as o } from "./PhoneTalkIcon.js";
+import { CloseIcon as x } from "./CloseIcon.js";
+const y = ({
+  isOpen: m,
+  onClose: s,
+  logo: c,
+  userActions: d,
+  searchBarProps: p,
+  sections: u = [],
+  contactInfo: t
+}) => m ? /* @__PURE__ */ r("div", { className: "fixed inset-0 z-50 flex flex-col overflow-y-auto bg-white text-neutral-800 lg:hidden", children: [
+  /* @__PURE__ */ r("div", { className: "flex items-center justify-between px-6 py-4", children: [
+    c,
+    /* @__PURE__ */ l(
+      "button",
+      {
+        className: "flex cursor-pointer items-center justify-center p-2",
+        onClick: s,
+        "aria-label": "Close menu",
+        children: /* @__PURE__ */ l(x, {})
+      }
+    )
+  ] }),
+  /* @__PURE__ */ r("div", { className: "flex flex-1 flex-col pb-6", children: [
+    /* @__PURE__ */ r("div", { className: "flex flex-col gap-6 px-6", children: [
+      /* @__PURE__ */ l("div", { className: "flex items-center gap-4", children: d }),
+      /* @__PURE__ */ l(f, { ...p })
+    ] }),
+    /* @__PURE__ */ l("nav", { className: "flex flex-col gap-0", children: u.map((e, n) => {
+      const a = e.icon != null;
+      return e.content != null ? /* @__PURE__ */ l("div", { className: "flex items-center px-6 pb-8", children: e.content }, e.id ?? `custom-${n.toString()}`) : /* @__PURE__ */ r(
+        "div",
+        {
+          className: e.title !== "" && !a ? "border-t border-b border-neutral-200 pt-4" : "",
+          children: [
+            e.title && /* @__PURE__ */ r("div", { className: `flex items-center gap-2 px-6 ${a ? "bg-neutral-50 py-4" : ""}`, children: [
+              e.icon != null && /* @__PURE__ */ l("span", { className: "text-primary-700", children: e.icon }),
+              /* @__PURE__ */ l("h4", { className: "text-medium font-semibold", children: e.title })
+            ] }),
+            e.items != null && /* @__PURE__ */ r("ul", { className: `flex flex-col gap-4 ${a ? "p-6" : "px-6 py-4"}`, children: [
+              e.items.map((i) => /* @__PURE__ */ l("li", { children: /* @__PURE__ */ l("a", { href: i.href ?? "#", className: "text-medium", onClick: s, children: i.label }) }, i.label)),
+              e.seeAll != null && /* @__PURE__ */ l("li", { className: "font-semibold", children: e.seeAll })
+            ] })
+          ]
+        },
+        e.id ?? e.title ?? n.toString()
+      );
+    }) }),
+    t && /* @__PURE__ */ r("div", { className: "mt-auto flex flex-col items-center justify-center border-t border-neutral-100 p-6", children: [
+      /* @__PURE__ */ r(
+        "a",
+        {
+          href: `tel:${t.phoneNumber.replaceAll(" ", "")}`,
+          className: "bg-primary-700 flex w-full items-center justify-center gap-2 rounded-md p-3 text-base font-semibold text-white",
+          children: [
+            /* @__PURE__ */ l(o, { fill: "#ffff" }),
+            t.phoneNumber
+          ]
+        }
+      ),
+      t.contactHours && /* @__PURE__ */ r("p", { className: "text-small mt-4 text-base text-neutral-500", children: [
+        t.contactHoursLabel != null && /* @__PURE__ */ r("span", { children: [
+          t.contactHoursLabel,
+          " "
+        ] }),
+        t.contactHours
+      ] })
+    ] })
+  ] })
+] }) : null;
+export {
+  y as MobileMenu
+};

package/dist/components/NavMenu.d.ts

@@ -11,9 +11,11 @@ export interface NavMenuItemProps {
     dropdownContent?: ReactNode;
     tag?: string;
     isNested?: boolean;
+    bold?: boolean;
 }
 
 export declare interface NavMenuProps {
     navItems: NavMenuItemProps[];
+    className?: string;
 }
 

package/dist/components/NavMenu.js

@@ -1,7 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
 import "react";
-import { NavMenuItem as t } from "./NavMenuItem.js";
-const o = ({ navItems: m }) => /* @__PURE__ */ e("nav", { children: /* @__PURE__ */ e("ul", { className: "text-medium flex flex-wrap items-center xl:gap-4", children: m.map((r) => /* @__PURE__ */ e(t, { ...r }, r.label)) }) });
+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.label)) }) });
 export {
   o as NavMenu
 };

package/dist/components/NavMenuItem.d.ts

@@ -11,5 +11,6 @@ export declare interface NavMenuItemProps {
     dropdownContent?: ReactNode;
     tag?: string;
     isNested?: boolean;
+    bold?: boolean;
 }
 

package/dist/components/NavMenuItem.js

@@ -1,60 +1,62 @@
 import { jsxs as n, jsx as t } from "react/jsx-runtime";
 import "react";
-import { ChevronDownIcon as m } from "./ChevronDownIcon.js";
-import { ChevronRightIcon as f } from "./ChevronRightIcon.js";
-const v = ({
-  label: a,
+import { ChevronDownIcon as f } from "./ChevronDownIcon.js";
+import { ChevronRightIcon as v } from "./ChevronRightIcon.js";
+const h = ({
+  label: l,
   href: c,
-  hasDropdown: e = !1,
   dropdownItems: r,
-  tag: l,
-  isNested: p = !1
+  tag: i,
+  hasDropdown: e = !1,
+  isNested: d = !1,
+  bold: p = !1
 }) => {
-  const d = e && r != null && r.length > 0, u = e ? "span" : "a", s = {
+  const u = e && r != null && r.length > 0, g = e ? "span" : "a", s = {
     topLevel: {
-      liClass: "group relative flex items-center gap-1",
-      triggerClass: "lg:px-2 px-4 py-1 hover:text-neutral-600",
-      dropdownPosition: "top-full left-0 pt-2",
+      liClass: "group relative py-2",
+      triggerClass: "hover:text-neutral-600",
+      dropdownPosition: "top-full left-0",
       dropdownTrigger: "group-hover:pointer-events-auto group-hover:opacity-100",
-      Icon: m,
+      Icon: f,
       iconClass: "transition-transform duration-200 group-hover:rotate-180"
     },
     nested: {
-      liClass: "group/nested relative flex items-center gap-1",
-      triggerClass: "px-5 py-2 hover:bg-primary-100 w-full",
-      dropdownPosition: "top-0 left-full pl-1",
+      liClass: "group/nested relative",
+      triggerClass: "p-1 hover:bg-primary-100 w-full rounded",
+      dropdownPosition: "top-0 left-full -mt-4 pl-6",
       dropdownTrigger: "group-hover/nested:pointer-events-auto group-hover/nested:opacity-100",
-      Icon: f,
+      Icon: v,
       iconClass: ""
     }
-  }, o = p ? s.nested : s.topLevel, g = o.Icon;
-  return /* @__PURE__ */ n("li", { className: o.liClass, children: [
+  }, o = d ? s.nested : s.topLevel, m = o.Icon;
+  return /* @__PURE__ */ n("li", { className: `${o.liClass} `, children: [
     /* @__PURE__ */ n(
-      u,
+      g,
       {
         href: e ? void 0 : c ?? "#",
         role: e ? "button" : void 0,
-        className: `text-small flex w-full items-center justify-between gap-1 font-medium text-neutral-800 transition-colors ${e ? "cursor-pointer" : ""} ${o.triggerClass} `,
+        className: `text-small flex w-full items-center justify-between gap-1 font-medium text-nowrap text-neutral-800 transition-colors ${e ? "cursor-pointer" : ""} ${o.triggerClass} `,
         "aria-haspopup": e ? "menu" : void 0,
         "aria-expanded": e ? "false" : void 0,
+        title: e ? void 0 : l,
         children: [
           /* @__PURE__ */ n("span", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ t("span", { className: "text-base", children: a }),
-            l && /* @__PURE__ */ t("span", { className: "bg-secondary-200 text-extra-small rounded px-1 font-bold", children: l })
+            /* @__PURE__ */ t("span", { className: `text-medium ${p ? "font-bold" : ""}`, children: l }),
+            i && /* @__PURE__ */ t("span", { className: "bg-secondary-200 text-extra-small rounded px-1 font-bold", children: i })
           ] }),
-          e && /* @__PURE__ */ t(g, { className: o.iconClass, fill: "#000", width: 20, height: 20 })
+          e && /* @__PURE__ */ t(m, { className: o.iconClass, fill: "#000", width: 20, height: 20 })
         ]
       }
     ),
-    d && /* @__PURE__ */ t(
+    u && /* @__PURE__ */ t(
       "div",
       {
         className: `pointer-events-none absolute z-50 min-w-48 opacity-0 transition-opacity duration-200 ${o.dropdownPosition} ${o.dropdownTrigger} `,
-        children: /* @__PURE__ */ t("div", { className: "rounded-md border border-neutral-200 bg-white py-2 shadow-lg", children: /* @__PURE__ */ t("ul", { className: "flex flex-col", children: r.map((i) => /* @__PURE__ */ t(v, { ...i, isNested: !0 }, i.label)) }) })
+        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: r.map((a) => /* @__PURE__ */ t(h, { ...a, isNested: !0 }, a.label)) }) })
       }
     )
   ] });
 };
 export {
-  v as NavMenuItem
+  h as NavMenuItem
 };

package/dist/components/SearchBar.js

@@ -74,7 +74,7 @@ const w = ({
       ] })
     ] }),
     /* @__PURE__ */ r("div", { className: "block lg:hidden", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-3 border-b border-neutral-200 bg-white px-4 py-3", children: [
+      /* @__PURE__ */ r("div", { className: "flex items-center gap-3 border-b border-neutral-200 bg-white py-1", children: [
         /* @__PURE__ */ e(
           "input",
           {

package/dist/components/index.d.ts

@@ -360,15 +360,10 @@ export declare const Header: FC<HeaderProps>;
 export declare interface HeaderProps {
     logo: ReactNode;
     navMenu: NavMenuProps;
-    seeAll: ReactNode;
     searchBarProps: SearchBarProps;
     languageSelectorProps?: LanguageSelectorProps;
     userActions: ReactNode;
-    isMobileMenuOpen?: boolean;
-    onOpenMobileMenu?: () => void;
-    onCloseMobileMenu?: () => void;
-    mobileMenuSections?: MobileMenuSection[];
-    mobileContactInfo?: MobileContactInfo;
+    mobileMenu: MobileMenuProps;
 }
 
 export declare const HelpGuideIcon: React_2.FC<React_2.SVGProps<SVGSVGElement>>;
@@ -551,14 +546,29 @@ export declare interface MobileContactInfo {
     contactHours?: string;
 }
 
+export declare const MobileMenu: FC<MobileMenuProps>;
+
+export declare interface MobileMenuProps {
+    isOpen: boolean;
+    onOpen: () => void;
+    onClose: () => void;
+    logo: ReactNode;
+    userActions: ReactNode;
+    searchBarProps: SearchBarProps;
+    sections?: MobileMenuSection[];
+    contactInfo?: MobileContactInfo;
+}
+
 export declare interface MobileMenuSection {
+    id?: string;
     title?: string;
-    icon?: ReactNode;
-    items: {
+    icon: ReactNode | null;
+    items?: {
         label: string;
         href?: string;
     }[];
-    seeAll?: ReactNode;
+    seeAll?: ReactNode | null;
+    content?: ReactNode | null;
 }
 
 export declare const MoreTemplatesSection: FC<PopularDocumentsProps>;
@@ -575,10 +585,12 @@ export declare interface NavMenuItemProps {
     dropdownContent?: ReactNode;
     tag?: string;
     isNested?: boolean;
+    bold?: boolean;
 }
 
 export declare interface NavMenuProps {
     navItems: NavMenuItemProps[];
+    className?: string;
 }
 
 export declare const Note: FC<NoteProps>;