@npm_leadtech/legal-lib-components 5.9.3 → 5.9.4

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

@@ -0,0 +1,45 @@
+import { device } from '../../../globalStyles/breakpoints';
+import styled from 'styled-components';
+export const MobileBottomBarStyled = styled.div `
+  background: var(--others-white);
+  position: fixed;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  bottom: 0;
+  height: 3.25rem;
+  width: 100%;
+  box-shadow: var(--box-shadow-container);
+  z-index: 1;
+
+  @media ${device['portrait-tablets']} {
+    display: none;
+  }
+
+  .mobile-bottom-bar--active {
+    display: flex;
+  }
+
+  .e-button {
+    max-height: 2.8rem;
+    margin: 0 0.5rem;
+    width: 2.75rem;
+    min-width: 2.75rem;
+    padding: 0;
+    outline: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: var(--primary-main);
+    border-color: var(--primary-main);
+
+    &:hover {
+      cursor: pointer;
+    }
+
+    svg {
+      width: 24px;
+      margin: 0;
+    }
+  }
+`;

package/dist/src/components/organisms/MobileBottomBar/{MobileBottomBar.scss → MobileBottomBar.styled.ts}

@@ -1,7 +1,7 @@
-@import '../../../globalStyles/variables.scss';
-@import '../../../globalStyles/mediaqueries.scss';
+import { device } from '../../../globalStyles/breakpoints'
+import styled from 'styled-components'
 
-.mobile-bottom-bar {
+export const MobileBottomBarStyled = styled.div`
   background: var(--others-white);
   position: fixed;
   display: flex;
@@ -13,11 +13,11 @@
   box-shadow: var(--box-shadow-container);
   z-index: 1;
 
-  @include portrait-tablets {
+  @media ${device['portrait-tablets']} {
     display: none;
   }
 
-  &--active {
+  .mobile-bottom-bar--active {
     display: flex;
   }
 
@@ -43,4 +43,4 @@
       margin: 0;
     }
   }
-}
+`

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

@@ -1,23 +1,18 @@
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 import React, { type FC } from 'react'
-import classNames from 'classnames'
 
 import { Button, SidemenuTab } from '../../atoms'
 import { type MobileBottomBarProps } from './MobileBottomBarProps.types'
-// import './MobileBottomBar.scss'
+import { MobileBottomBarStyled } from './MobileBottomBar.styled'
 
-const MobileBottomBar: FC<MobileBottomBarProps> = ({ children, list, active }) => {
+const MobileBottomBar: FC<MobileBottomBarProps> = ({ children, list }) => {
   if (children === undefined && list?.length === 0) return null
 
-  const classnames = classNames('mobile-bottom-bar', {
-    'mobile-bottom-bar--active': active
-  })
-
-  if (children !== undefined) return <div className={classnames}>{children}</div>
+  if (children !== undefined) return <MobileBottomBarStyled>{children}</MobileBottomBarStyled>
   if (list === undefined) return null
 
   return (
-    <div className={classnames}>
+    <MobileBottomBarStyled>
       {list.map((tab, index) => {
         if (tab.type === 'button') {
           return (
@@ -28,7 +23,7 @@ const MobileBottomBar: FC<MobileBottomBarProps> = ({ children, list, active }) =
         }
         return <SidemenuTab key={index} mobile={true} {...tab} />
       })}
-    </div>
+    </MobileBottomBarStyled>
   )
 }
 

package/dist/src/components/organisms/MobileBottomBar/MobileBottomBarProps.types.d.ts

@@ -1,5 +1,4 @@
 export interface MobileBottomBarProps {
-    active?: boolean;
     list?: any[];
     children?: React.ReactNode;
 }

package/dist/src/components/organisms/MobileBottomBar/MobileBottomBarProps.types.ts

@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 export interface MobileBottomBarProps {
-  active?: boolean
   list?: any[]
   children?: React.ReactNode
 }

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

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { StepRatafiaCardList } from '../../molecules';
-// import './StepsRatafiaContent.scss'
+import { StepsRatafiaContentStyled } from './StepsRatafiaContent.styled';
 const StepsRatafiaContent = ({ title, steps }) => {
-    return (_jsxs("div", { className: 'steps-ratafia-content', children: [_jsx("h2", { className: 'sans-serif --super-large --bold-weight steps-ratafia-content__title', children: title }), _jsx(StepRatafiaCardList, { steps: steps })] }));
+    return (_jsxs(StepsRatafiaContentStyled, { children: [_jsx("h2", { className: 'sans-serif --super-large --bold-weight steps-ratafia-content__title', children: title }), _jsx(StepRatafiaCardList, { steps: steps })] }));
 };
 export default StepsRatafiaContent;

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

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

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

@@ -0,0 +1,11 @@
+import styled from 'styled-components';
+export const StepsRatafiaContentStyled = styled.div `
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+
+  .steps-ratafia-content__title {
+    color: var(--neutral-neutral-1);
+  }
+`;

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

@@ -0,0 +1,12 @@
+import styled from 'styled-components'
+
+export const StepsRatafiaContentStyled = styled.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+
+  .steps-ratafia-content__title {
+    color: var(--neutral-neutral-1);
+  }
+`

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

@@ -2,14 +2,14 @@ import React, { type FC } from 'react'
 
 import { StepRatafiaCardList } from '../../molecules'
 import { type StepsRatafiaContentProps } from './StepsRatafiaContentProps.types'
-// import './StepsRatafiaContent.scss'
+import { StepsRatafiaContentStyled } from './StepsRatafiaContent.styled'
 
 const StepsRatafiaContent: FC<StepsRatafiaContentProps> = ({ title, steps }) => {
   return (
-    <div className='steps-ratafia-content'>
+    <StepsRatafiaContentStyled>
       <h2 className='sans-serif --super-large --bold-weight steps-ratafia-content__title'>{title}</h2>
       <StepRatafiaCardList steps={steps} />
-    </div>
+    </StepsRatafiaContentStyled>
   )
 }
 

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

@@ -1,7 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { RichTextInner } from '../../atoms';
-// import './TryOurFreeLegalBlogsContent.scss'
+import { TryOurFreeLegalBlogsContentStyled } from './TryOurFreeLegalBlogsContent.styled';
 const TryOurFreeLegalBlogsContent = ({ title, image, children }) => {
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: 'try-our-free-legal-blogs-section__texts', children: [_jsx("h2", { className: 'try-our-free-legal-blogs-section__texts__title', children: title }), _jsx(RichTextInner, { customClass: 'try-our-free-legal-blogs-section__texts__body', children: children })] }), _jsx("div", { className: 'try-our-free-legal-blogs-section__image', children: image })] }));
+    return (_jsxs(TryOurFreeLegalBlogsContentStyled, { children: [_jsxs("div", { className: 'try-our-free-legal-blogs-section__texts', children: [_jsx("h2", { className: 'try-our-free-legal-blogs-section__texts__title', children: title }), _jsx(RichTextInner, { customClass: 'try-our-free-legal-blogs-section__texts__body', children: children })] }), _jsx("div", { className: 'try-our-free-legal-blogs-section__image', children: image })] }));
 };
 export default TryOurFreeLegalBlogsContent;

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

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

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

@@ -0,0 +1,49 @@
+import { device } from '../../../globalStyles/breakpoints';
+import styled from 'styled-components';
+export const TryOurFreeLegalBlogsContentStyled = styled.div `
+  .try-our-free-legal-blogs-section__texts {
+    flex-basis: 50%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-bottom: 1rem;
+    margin-right: 0;
+    color: var(--neutral-neutral-1);
+    font-style: normal;
+    font-weight: 400;
+    letter-spacing: -0.3px;
+
+    @media ${device['landscape-tablets']} {
+      margin-right: 3rem;
+      margin-bottom: 0;
+    }
+
+    &__title {
+      font-family: var(--font-serif);
+      font-size: 32px;
+      line-height: 42px;
+      margin-bottom: 2rem;
+      text-align: center;
+      font-weight: 400;
+
+      @media ${device['landscape-tablets']} {
+        text-align: left;
+      }
+    }
+
+    &__body {
+      font-family: var(--font-sans);
+      font-size: 16px;
+      line-height: 22px;
+
+      a {
+        color: var(--primary-main-light-1);
+        font-weight: 400 !important;
+      }
+    }
+  }
+
+  .try-our-free-legal-blogs-section__image {
+    flex-basis: 50%;
+  }
+`;

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

@@ -0,0 +1,50 @@
+import { device } from '../../../globalStyles/breakpoints'
+import styled from 'styled-components'
+
+export const TryOurFreeLegalBlogsContentStyled = styled.div`
+  .try-our-free-legal-blogs-section__texts {
+    flex-basis: 50%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-bottom: 1rem;
+    margin-right: 0;
+    color: var(--neutral-neutral-1);
+    font-style: normal;
+    font-weight: 400;
+    letter-spacing: -0.3px;
+
+    @media ${device['landscape-tablets']} {
+      margin-right: 3rem;
+      margin-bottom: 0;
+    }
+
+    &__title {
+      font-family: var(--font-serif);
+      font-size: 32px;
+      line-height: 42px;
+      margin-bottom: 2rem;
+      text-align: center;
+      font-weight: 400;
+
+      @media ${device['landscape-tablets']} {
+        text-align: left;
+      }
+    }
+
+    &__body {
+      font-family: var(--font-sans);
+      font-size: 16px;
+      line-height: 22px;
+
+      a {
+        color: var(--primary-main-light-1);
+        font-weight: 400 !important;
+      }
+    }
+  }
+
+  .try-our-free-legal-blogs-section__image {
+    flex-basis: 50%;
+  }
+`

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

@@ -2,17 +2,17 @@ import React, { type FC } from 'react'
 
 import { RichTextInner } from '../../atoms'
 import { type TryOurFreeLegalBlogsContentProps } from './TryOurFreeLegalBlogsContentProps.types'
-// import './TryOurFreeLegalBlogsContent.scss'
+import { TryOurFreeLegalBlogsContentStyled } from './TryOurFreeLegalBlogsContent.styled'
 
 const TryOurFreeLegalBlogsContent: FC<TryOurFreeLegalBlogsContentProps> = ({ title, image, children }) => {
   return (
-    <>
+    <TryOurFreeLegalBlogsContentStyled>
       <div className='try-our-free-legal-blogs-section__texts'>
         <h2 className='try-our-free-legal-blogs-section__texts__title'>{title}</h2>
         <RichTextInner customClass='try-our-free-legal-blogs-section__texts__body'>{children}</RichTextInner>
       </div>
       <div className='try-our-free-legal-blogs-section__image'>{image}</div>
-    </>
+    </TryOurFreeLegalBlogsContentStyled>
   )
 }
 

package/dist/src/components/sections/BlogSection/BlogSection.js

@@ -1,12 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, RichTextStrapi } from '../../atoms';
 import { ArticlesList } from '../../organisms';
 import { BlogSectionStyled } from './BlogSection.styled';
+import { Button } from '../../atoms';
 // import './BlogSection.scss'
-const BlogSection = ({ blogTitle, blogCta = null, blogDescription = null, articles }) => {
+const BlogSection = ({ blogTitle, blogCta, articles }) => {
     if (articles.articles?.length === 0)
-        return;
-    const categoryProductTitle = !!blogDescription;
-    return (_jsxs(BlogSectionStyled, { className: 'blog', children: [_jsx("h2", { className: `serif --super-large blog__title ${categoryProductTitle ? 'category-product-title' : ''}`, children: blogTitle }), blogDescription && _jsx(RichTextStrapi, { className: 'blog__description', html: blogDescription }), _jsx(ArticlesList, { articles: articles.articles, isCategoryProductPage: categoryProductTitle }), blogCta && _jsx(Button, { dataQa: '', color: 'secondary', label: blogCta, givenClass: 'cta-button', link: '/articles' })] }));
+        return null;
+    return (_jsxs(BlogSectionStyled, { className: 'blog', children: [_jsx("h2", { className: 'serif --super-large blog__title', children: blogTitle }), _jsx(ArticlesList, { articles: articles.articles }), _jsx(Button, { dataQa: '', color: 'secondary', label: blogCta, givenClass: 'cta-button', link: '/articles' })] }));
 };
 export default BlogSection;

package/dist/src/components/sections/BlogSection/BlogSection.styled.js

@@ -19,27 +19,6 @@ export const BlogSectionStyled = styled.div `
     @media ${device.laptop} {
       margin-bottom: 3rem;
     }
-
-    &.category-product-title {
-      margin-bottom: 0;
-      font-family: var(--font-sans);
-      font-size: 28px;
-      font-weight: 700;
-      line-height: 32px;
-      letter-spacing: -0.3px;
-      text-align: left;
-    }
-  }
-
-  .blog__description {
-    font-family: var(--font-sans);
-    font-size: 16px;
-    font-weight: 400;
-    line-height: 22px;
-    letter-spacing: -0.3px;
-    text-align: left;
-    color: #3d4042;
-    margin: 1rem 0 1.5rem 0;
   }
 
   .cta-button {

package/dist/src/components/sections/BlogSection/BlogSection.styled.ts

@@ -20,27 +20,6 @@ export const BlogSectionStyled = styled.div`
     @media ${device.laptop} {
       margin-bottom: 3rem;
     }
-
-    &.category-product-title {
-      margin-bottom: 0;
-      font-family: var(--font-sans);
-      font-size: 28px;
-      font-weight: 700;
-      line-height: 32px;
-      letter-spacing: -0.3px;
-      text-align: left;
-    }
-  }
-
-  .blog__description {
-    font-family: var(--font-sans);
-    font-size: 16px;
-    font-weight: 400;
-    line-height: 22px;
-    letter-spacing: -0.3px;
-    text-align: left;
-    color: #3d4042;
-    margin: 1rem 0 1.5rem 0;
   }
 
   .cta-button {

package/dist/src/components/sections/BlogSection/BlogSection.tsx

@@ -1,24 +1,20 @@
 /* eslint-disable @typescript-eslint/no-unnecessary-condition */
 import React, { type FC } from 'react'
 
-import { Button, RichTextStrapi } from '../../atoms'
 import { ArticlesList } from '../../organisms'
 import { type BlogSectionProps } from './BlogSectionProps.types'
 import { BlogSectionStyled } from './BlogSection.styled'
+import { Button } from '../../atoms'
 // import './BlogSection.scss'
 
-const BlogSection: FC<BlogSectionProps> = ({ blogTitle, blogCta = null, blogDescription = null, articles }) => {
-  if (articles.articles?.length === 0) return
-  const categoryProductTitle = !!blogDescription
+const BlogSection: FC<BlogSectionProps> = ({ blogTitle, blogCta, articles }) => {
+  if (articles.articles?.length === 0) return null
 
   return (
     <BlogSectionStyled className={'blog'}>
-      <h2 className={`serif --super-large blog__title ${categoryProductTitle ? 'category-product-title' : ''}`}>
-        {blogTitle}
-      </h2>
-      {blogDescription && <RichTextStrapi className='blog__description' html={blogDescription} />}
-      <ArticlesList articles={articles.articles} isCategoryProductPage={categoryProductTitle} />
-      {blogCta && <Button dataQa='' color='secondary' label={blogCta} givenClass='cta-button' link={'/articles'} />}
+      <h2 className={'serif --super-large blog__title'}>{blogTitle}</h2>
+      <ArticlesList articles={articles.articles} />
+      <Button dataQa='' color='secondary' label={blogCta} givenClass='cta-button' link={'/articles'} />
     </BlogSectionStyled>
   )
 }

package/dist/src/components/sections/BlogSection/BlogSectionProps.types.d.ts

@@ -1,7 +1,6 @@
 import { type ArticlesListProps } from '../../organisms';
 export interface BlogSectionProps {
     blogTitle: string;
-    blogCta?: string | null;
-    blogDescription?: string | null;
+    blogCta: string;
     articles: ArticlesListProps;
 }

package/dist/src/components/sections/BlogSection/BlogSectionProps.types.ts

@@ -2,7 +2,6 @@ import { type ArticlesListProps } from '../../organisms'
 
 export interface BlogSectionProps {
   blogTitle: string
-  blogCta?: string | null
-  blogDescription?: string | null
+  blogCta: string
   articles: ArticlesListProps
 }

package/dist/src/custom.d.ts

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 declare module '*.svg' {
-  const content: string
+  const content: any
   export default content
 }
 

package/dist/src/globalStyles/styles.scss

@@ -18,27 +18,5 @@
 @import 'tippy.js/dist/tippy.css';
 @import '../components/atoms/Tooltip/Tooltip.scss';
 
-@import '../components/organisms/AboutUsContent/AboutUsContent.scss';
-@import '../components/organisms/Accordion/Accordion.scss';
-@import '../components/organisms/ArticlesList/ArticlesList.scss';
-@import '../components/organisms/AsSeeInContent/AsSeeInContent.scss';
-@import '../components/organisms/CardFunctionality/CardFunctionality.scss';
-@import '../components/organisms/ContactJumbotron/ContactJumbotron.scss';
-@import '../components/organisms/CookiePolicyBar/CookiePolicyBar.scss';
-@import '../components/organisms/ErrorContentRatafia/ErrorContentRatafia.scss';
-@import '../components/organisms/FaqGroup/FaqGroup.scss';
-@import '../components/organisms/FeaturesRatafiaContent/FeaturesRatafiaContent.scss';
-@import '../components/organisms/GuidelinesContent/GuidelinesContent.scss';
-@import '../components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.scss';
-@import '../components/organisms/KeyFactsLoadingContentRatafia/KeyFactsLoadingContentRatafia.scss';
-@import '../components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.scss';
-@import '../components/organisms/LanguageSelectorMobile/LanguageSelectorMobile.scss';
-@import '../components/organisms/LayoutRatafia/LayoutRatafia.scss';
-@import '../components/organisms/ListStepsGetForm/ListStepsGetForm.scss';
-@import '../components/organisms/LoginRatafiaContent/LoginRatafiaContent.scss';
-@import '../components/organisms/MobileBottomBar/MobileBottomBar.scss';
-@import '../components/organisms/StepsRatafiaContent/StepsRatafiaContent.scss';
-@import '../components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.scss';
-
 @import '../components/molecules/TextInput/TextInput.scss';
 @import '../components/molecules/TooltipMenu/TooltipMenu.scss';