@npm_leadtech/legal-lib-components 7.15.0 → 7.16.1

package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenu.styled.js

@@ -0,0 +1,94 @@
+import styled from 'styled-components';
+export const DocumentMainMenuStyled = styled.div `
+  border-radius: var(--s-border-radius);
+  padding: 0.75rem 1rem;
+  display: flex;
+  background: var(--others-white);
+  transition: all 0.1s ease;
+  box-shadow: var(--box-shadow-medium);
+  min-width: max-content;
+  flex-flow: column wrap;
+  position: absolute;
+  left: 0;
+
+  & > .menu-items-li {
+    display: flex;
+    justify-content: space-between;
+    padding-right: 0.5rem;
+    width: 100%;
+    margin: 0.25rem 2.5rem 0.25rem 0;
+    border-radius: 4px;
+    transition: all 0.3s ease;
+    padding: 0.25rem;
+    position: relative;
+    cursor: pointer;
+    align-items: baseline;
+
+    &.all-item {
+      font-weight: bold;
+      &:before {
+        content: none;
+      }
+    }
+
+    .icon-arrow {
+      width: 0.625rem;
+      height: 0.813rem;
+      &:before,
+      &:after {
+        width: 0.125rem;
+        background-color: var(--neutral-neutral-1);
+      }
+    }
+
+    &::marker {
+      content: none;
+    }
+
+    &:hover {
+      background-color: var(--primary-main-light-5);
+
+      .submenu__list {
+        opacity: 1;
+        visibility: visible;
+        margin-left: 1.5rem;
+        transition: all 0.4s ease;
+      }
+      .icon-arrow {
+        &:before,
+        &:after {
+          background-color: var(--primary-main);
+        }
+      }
+    }
+
+    .submenu__list {
+      border-radius: var(--s-border-radius);
+      padding: 0.75rem 1rem;
+      display: flex;
+      visibility: hidden;
+      opacity: 0;
+      margin-left: 1rem;
+      background: var(--others-white);
+      box-shadow: 0 0.125rem 0.5rem 0 #02374a40;
+      transition: all 0.1s ease;
+      min-width: max-content;
+      flex-flow: column wrap;
+      position: absolute;
+      left: 100%;
+      top: -1rem;
+    }
+
+    .submenu__list {
+      .all-item {
+        font-weight: bold;
+        margin: 0.25rem 3rem 0.25rem 0;
+        padding: 0.25rem;
+
+        &:hover {
+          background-color: var(--primary-main-light-5);
+        }
+      }
+    }
+  }
+`;

package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenu.styled.ts

@@ -0,0 +1,95 @@
+import styled from 'styled-components'
+
+export const DocumentMainMenuStyled = styled.div`
+  border-radius: var(--s-border-radius);
+  padding: 0.75rem 1rem;
+  display: flex;
+  background: var(--others-white);
+  transition: all 0.1s ease;
+  box-shadow: var(--box-shadow-medium);
+  min-width: max-content;
+  flex-flow: column wrap;
+  position: absolute;
+  left: 0;
+
+  & > .menu-items-li {
+    display: flex;
+    justify-content: space-between;
+    padding-right: 0.5rem;
+    width: 100%;
+    margin: 0.25rem 2.5rem 0.25rem 0;
+    border-radius: 4px;
+    transition: all 0.3s ease;
+    padding: 0.25rem;
+    position: relative;
+    cursor: pointer;
+    align-items: baseline;
+
+    &.all-item {
+      font-weight: bold;
+      &:before {
+        content: none;
+      }
+    }
+
+    .icon-arrow {
+      width: 0.625rem;
+      height: 0.813rem;
+      &:before,
+      &:after {
+        width: 0.125rem;
+        background-color: var(--neutral-neutral-1);
+      }
+    }
+
+    &::marker {
+      content: none;
+    }
+
+    &:hover {
+      background-color: var(--primary-main-light-5);
+
+      .submenu__list {
+        opacity: 1;
+        visibility: visible;
+        margin-left: 1.5rem;
+        transition: all 0.4s ease;
+      }
+      .icon-arrow {
+        &:before,
+        &:after {
+          background-color: var(--primary-main);
+        }
+      }
+    }
+
+    .submenu__list {
+      border-radius: var(--s-border-radius);
+      padding: 0.75rem 1rem;
+      display: flex;
+      visibility: hidden;
+      opacity: 0;
+      margin-left: 1rem;
+      background: var(--others-white);
+      box-shadow: 0 0.125rem 0.5rem 0 #02374a40;
+      transition: all 0.1s ease;
+      min-width: max-content;
+      flex-flow: column wrap;
+      position: absolute;
+      left: 100%;
+      top: -1rem;
+    }
+
+    .submenu__list {
+      .all-item {
+        font-weight: bold;
+        margin: 0.25rem 3rem 0.25rem 0;
+        padding: 0.25rem;
+
+        &:hover {
+          background-color: var(--primary-main-light-5);
+        }
+      }
+    }
+  }
+`

package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenu.tsx

@@ -0,0 +1,59 @@
+import React from 'react'
+
+import { ArrowRight } from '../../../../images/componentsSvg/ArrowRight'
+import { type DocumentMainMenuProps } from '../DocumentMainMenu/DocumentMainMenuProps.types'
+import { DocumentMainMenuStyled } from './DocumentMainMenu.styled'
+import DocumentSubMenu from '../DocumentSubMenu/DocumentSubMenu'
+
+export const DocumentMainMenu: React.FC<DocumentMainMenuProps> = ({
+  seeAllTypeDocs,
+  allLegalDocs,
+  allTypeDocs,
+  setCookiePolicyFunc,
+  routes,
+  hasSubCategoryPage,
+  finalMenu
+}) => {
+  return (
+    <DocumentMainMenuStyled>
+      {finalMenu.map((item, index) => (
+        <li className='menu-items-li' key={index}>
+          {item.type}
+          <div className='icon-arrow'>
+            <ArrowRight />
+          </div>
+          <ul className={'submenu__list'} key={index}>
+            {item.products.map((product, index) => (
+              <DocumentSubMenu
+                product={product}
+                key={index}
+                setCookiePolicyFunc={setCookiePolicyFunc}
+                routes={routes}
+              />
+            ))}
+            <li className='menu-items-li all-item'>
+              <a
+                title={seeAllTypeDocs.replace(/{{type}}/g, item.type)}
+                data-qa={`Header_Menu__${item.slug}_all-documents`}
+                href={
+                  hasSubCategoryPage
+                    ? routes.LEGAL_DOCUMENTS_WITH_CATEGORY(item.slug)
+                    : routes.LEGAL_DOCUMENTS_WITH_HASH(item.type)
+                }
+              >
+                {item.type.includes('Documents')
+                  ? allTypeDocs.replace(/{{type}}/g, item.type).replace('Documents', '')
+                  : allTypeDocs.replace(/{{type}}/g, item.type)}
+              </a>
+            </li>
+          </ul>
+        </li>
+      ))}
+      <li className='menu-items-li all-item'>
+        <a title={allLegalDocs} data-qa='Header_Menu_Document_List_All_Documents' href={routes.LEGAL_DOCUMENTS}>
+          {allLegalDocs}
+        </a>
+      </li>
+    </DocumentMainMenuStyled>
+  )
+}

package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenuProps.types.d.ts

@@ -0,0 +1,22 @@
+import { Routes } from '../../sections/Header/HeaderProps.types';
+export interface ProductListMenuProps {
+    slug: string;
+    linkText: string;
+    categoryUrl?: string;
+}
+export interface DocumentListMenuSectionProps {
+    icon: React.ReactNode;
+    type: string;
+    products: ProductListMenuProps[];
+    slug: string;
+    seeAllTypeDocs: string;
+}
+export interface DocumentMainMenuProps {
+    seeAllTypeDocs: string;
+    allLegalDocs: string;
+    allTypeDocs: string;
+    setCookiePolicyFunc: (url?: string, setCookiePolicyAccepted?: boolean) => void;
+    routes: Routes;
+    hasSubCategoryPage: boolean;
+    finalMenu: DocumentListMenuSectionProps[];
+}

package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenuProps.types.js

@@ -0,0 +1 @@
+export {};

package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenuProps.types.ts

@@ -0,0 +1,25 @@
+import { Routes } from '../../sections/Header/HeaderProps.types'
+
+export interface ProductListMenuProps {
+  slug: string
+  linkText: string
+  categoryUrl?: string
+}
+
+export interface DocumentListMenuSectionProps {
+  icon: React.ReactNode
+  type: string
+  products: ProductListMenuProps[]
+  slug: string
+  seeAllTypeDocs: string
+}
+
+export interface DocumentMainMenuProps {
+  seeAllTypeDocs: string
+  allLegalDocs: string
+  allTypeDocs: string
+  setCookiePolicyFunc: (url?: string, setCookiePolicyAccepted?: boolean) => void
+  routes: Routes
+  hasSubCategoryPage: boolean
+  finalMenu: DocumentListMenuSectionProps[]
+}

package/dist/src/components/organisms/DocumentMainMenu/index.d.ts

@@ -0,0 +1,2 @@
+export { DocumentMainMenu } from './DocumentMainMenu';
+export { type DocumentMainMenuProps } from './DocumentMainMenuProps.types';

package/dist/src/components/organisms/DocumentMainMenu/index.js

@@ -0,0 +1 @@
+export { DocumentMainMenu } from './DocumentMainMenu';

package/dist/src/components/organisms/DocumentMainMenu/index.ts

@@ -0,0 +1,2 @@
+export { DocumentMainMenu } from './DocumentMainMenu'
+export { type DocumentMainMenuProps } from './DocumentMainMenuProps.types'

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenu.d.ts

@@ -0,0 +1,4 @@
+import { type DocumentSubMenuProps } from './DocumentSubMenuProps.types';
+import React from 'react';
+declare const DocumentSubMenu: React.FC<DocumentSubMenuProps>;
+export default DocumentSubMenu;

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenu.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DocumentSubMenuStyled } from './DocumentSubMenu.styled';
+const DocumentSubMenu = ({ product, setCookiePolicyFunc, routes }) => {
+    const productLink = product.categoryUrl ? `${product.categoryUrl}/${product.slug}` : product.slug;
+    return (_jsx(DocumentSubMenuStyled, { className: 'menu-items-li', children: _jsx("a", { title: product.linkText, "data-qa": `Header_Menu_${product.slug}_Document_List`, onClick: () => setCookiePolicyFunc, href: routes.CUSTOM_URL_FROM_TARGET_ADDRESS(productLink), children: product.linkText }) }));
+};
+export default DocumentSubMenu;

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenu.styled.d.ts

@@ -0,0 +1 @@
+export declare const DocumentSubMenuStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenu.styled.js

@@ -0,0 +1,27 @@
+import styled from 'styled-components';
+export const DocumentSubMenuStyled = styled.li `
+  list-style: none;
+  display: flex;
+  justify-content: space-between;
+  padding-right: 0.5rem;
+  width: 100%;
+  margin: 0.25rem 2.5rem 0.25rem 0;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  padding: 0.25rem;
+  position: relative;
+  cursor: pointer;
+  align-items: baseline;
+
+  &.all-item {
+    font-weight: bold;
+
+    &:before {
+      content: none;
+    }
+  }
+
+  &:hover {
+    background-color: var(--primary-main-light-5);
+  }
+`;

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenu.styled.ts

@@ -0,0 +1,28 @@
+import styled from 'styled-components'
+
+export const DocumentSubMenuStyled = styled.li`
+  list-style: none;
+  display: flex;
+  justify-content: space-between;
+  padding-right: 0.5rem;
+  width: 100%;
+  margin: 0.25rem 2.5rem 0.25rem 0;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  padding: 0.25rem;
+  position: relative;
+  cursor: pointer;
+  align-items: baseline;
+
+  &.all-item {
+    font-weight: bold;
+
+    &:before {
+      content: none;
+    }
+  }
+
+  &:hover {
+    background-color: var(--primary-main-light-5);
+  }
+`

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenu.tsx

@@ -0,0 +1,21 @@
+import { type DocumentSubMenuProps } from './DocumentSubMenuProps.types'
+import { DocumentSubMenuStyled } from './DocumentSubMenu.styled'
+import React from 'react'
+
+const DocumentSubMenu: React.FC<DocumentSubMenuProps> = ({ product, setCookiePolicyFunc, routes }) => {
+  const productLink = product.categoryUrl ? `${product.categoryUrl}/${product.slug}` : product.slug
+  return (
+    <DocumentSubMenuStyled className='menu-items-li'>
+      <a
+        title={product.linkText}
+        data-qa={`Header_Menu_${product.slug}_Document_List`}
+        onClick={() => setCookiePolicyFunc}
+        href={routes.CUSTOM_URL_FROM_TARGET_ADDRESS(productLink)}
+      >
+        {product.linkText}
+      </a>
+    </DocumentSubMenuStyled>
+  )
+}
+
+export default DocumentSubMenu

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenuProps.types.d.ts

@@ -0,0 +1,7 @@
+import { ProductListMenuProps } from '../DocumentMainMenu/DocumentMainMenuProps.types';
+import { Routes } from 'src/components/sections/Header/HeaderProps.types';
+export interface DocumentSubMenuProps {
+    product: ProductListMenuProps;
+    setCookiePolicyFunc: (url?: string, setCookiePolicyAccepted?: boolean) => void;
+    routes: Routes;
+}

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenuProps.types.js

@@ -0,0 +1 @@
+export {};

package/dist/src/components/organisms/DocumentSubMenu/DocumentSubMenuProps.types.ts

@@ -0,0 +1,8 @@
+import { ProductListMenuProps } from '../DocumentMainMenu/DocumentMainMenuProps.types'
+import { Routes } from 'src/components/sections/Header/HeaderProps.types'
+
+export interface DocumentSubMenuProps {
+  product: ProductListMenuProps
+  setCookiePolicyFunc: (url?: string, setCookiePolicyAccepted?: boolean) => void
+  routes: Routes
+}

package/dist/src/components/organisms/DocumentSubMenu/index.d.ts

@@ -0,0 +1,2 @@
+export { default as DocumentSubMenu } from './DocumentSubMenu';
+export { type DocumentSubMenuProps } from './DocumentSubMenuProps.types';

package/dist/src/components/organisms/DocumentSubMenu/index.js

@@ -0,0 +1 @@
+export { default as DocumentSubMenu } from './DocumentSubMenu';

package/dist/src/components/organisms/DocumentSubMenu/index.ts

@@ -0,0 +1,2 @@
+export { default as DocumentSubMenu } from './DocumentSubMenu'
+export { type DocumentSubMenuProps } from './DocumentSubMenuProps.types'

package/dist/src/components/organisms/MenuItems/MenuItems.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { type MenuItemsProps } from './MenuItemsProps.types';
+export declare const MenuItems: React.FC<MenuItemsProps>;

package/dist/src/components/organisms/MenuItems/MenuItems.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DocumentListMenu } from '../../../components/organisms/DocumentListMenu/DocumentListMenu';
+import { DocumentMainMenu } from '../../../components/organisms/DocumentMainMenu/DocumentMainMenu';
+import { MenuItemsStyled } from './MenuItems.styled';
+import { RatafiaLandingIcon } from '../../atoms/RatafiaLandingIcon';
+import arrowDown from '../../../../images/svg/arrow-down.svg';
+export const MenuItems = ({ hasProducts, seeAllDocumentsText, setCookiePolicyFunc, routes, finalMenu, isMobile, configVars, navMenuItems, extraMenu }) => {
+    return (_jsxs(MenuItemsStyled, { className: `${isMobile ? 'navigation-pane' : 'left-nav'}`, children: [hasProducts && (_jsxs("div", { className: 'navigation-pane__products', children: [_jsxs("div", { className: 'navigation-pane__products__container', children: [_jsx("p", { className: 'navigation-pane__products__title', children: 'Documents' }), _jsx("img", { src: arrowDown, alt: 'arrow-down' })] }), _jsx("div", { className: 'products__list', children: isMobile ? (_jsx(DocumentListMenu, { routes: routes, seeAllLegalDocs: seeAllDocumentsText?.seeAllLegalDocs ?? '', seeAllTypeDocs: seeAllDocumentsText?.seeAllTypeDocs ?? '', finalMenu: finalMenu, hasSubCategoryPage: configVars.HAS_SUBCATEGORY_PAGE, setCookiePolicyFunc: setCookiePolicyFunc })) : (_jsx(DocumentMainMenu, { seeAllTypeDocs: seeAllDocumentsText?.seeAllTypeDocs ?? '', allLegalDocs: seeAllDocumentsText?.allLegalDocs ?? '', allTypeDocs: seeAllDocumentsText?.allTypeDocs ?? '', setCookiePolicyFunc: setCookiePolicyFunc, routes: routes, hasSubCategoryPage: configVars.HAS_SUBCATEGORY_PAGE, finalMenu: finalMenu })) })] })), !!navMenuItems &&
+                navMenuItems.map((item) => (_jsx("div", { className: `navigation-pane__link`, children: _jsxs("a", { className: `navigation-pane__link__title`, title: item.title, "data-qa": item.dataQa, href: item.href, children: [_jsx("p", { children: item.label }), item.label === 'LawGenius' && _jsx(RatafiaLandingIcon, {})] }) }, item.title))), !!extraMenu && extraMenu?.items?.length > 0 && (_jsxs("div", { className: 'navigation-pane__resources', children: [_jsxs("div", { className: 'navigation-pane__resources__container', children: [_jsx("p", { className: 'navigation-pane__resources__title', children: extraMenu.title }), _jsx("img", { src: arrowDown, alt: 'arrow-down' })] }), _jsx("ul", { className: 'resources__list', children: extraMenu.items.map((item) => (_jsx("li", { className: 'menu-items-li', children: _jsx("a", { title: item.title, "data-qa": item.dataQa, href: item.href, children: item.label }) }, item.title))) })] }))] }));
+};

package/dist/src/components/{atoms → organisms}/MenuItems/MenuItems.styled.d.ts

@@ -1 +1 @@
-export declare const MenuItemsStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
+export declare const MenuItemsStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;