@npm_leadtech/legal-lib-components 5.3.13 → 5.3.14

package/dist/images/svg/arrow-right-24px-outlined.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.70531 0.705315C8.31578 0.31578 7.68422 0.31578 7.29468 0.705316C6.9054 1.0946 6.90511 1.72568 7.29405 2.11531L12.17 7H0.999999C0.447714 7 0 7.44772 0 8C0 8.55229 0.447715 9 1 9H12.17L7.29405 13.8847C6.90511 14.2743 6.9054 14.9054 7.29468 15.2947C7.68422 15.6842 8.31578 15.6842 8.70532 15.2947L15.2929 8.70711C15.6834 8.31658 15.6834 7.68342 15.2929 7.29289L8.70531 0.705315Z" fill="#078080"/>
+</svg>

package/dist/src/components/atoms/ContactCard/ContactCard.d.ts

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

package/dist/src/components/atoms/ContactCard/ContactCard.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ContactCardStyled } from './ContactCard.styled';
+const ContactCard = ({ id, title, image, body = '', url, isClickableOnDesktop = true, dataQa }) => {
+    return (_jsxs(ContactCardStyled, { className: 'contact-card', children: [_jsx("div", { className: 'contact-card__icon', children: isClickableOnDesktop ? (_jsx("a", { className: 'contact-card__icon__image', "data-qa": dataQa, href: url, target: '_self', children: image })) : (_jsxs("div", { children: [_jsx("div", { className: 'contact-card__icon__image contact-card__icon__image-desktop', children: image }), _jsx("a", { className: 'contact-card__icon__image contact-card__icon__image-mobile', "data-qa": dataQa, href: url, children: image })] })) }), _jsx("div", { className: 'contact-card__title', children: title }), _jsx("p", { className: 'contact-card__text', children: body })] }, id));
+};
+export default ContactCard;

package/dist/src/components/{sections/BlogSection/BlogSection.styled.d.ts → atoms/ContactCard/ContactCard.styled.d.ts}

@@ -1 +1 @@
-export declare const BlogSectionStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ContactCardStyled: 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/atoms/ContactCard/ContactCard.styled.js

@@ -0,0 +1,38 @@
+import { device } from '../../../globalStyles/breakpoints';
+import styled from 'styled-components';
+export const ContactCardStyled = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background-color: white;
+  box-shadow: 0 2px 6px 0 rgba(2, 55, 74, 0.25);
+  border-radius: 0.25rem;
+  min-width: 200px;
+  padding: 1rem;
+
+  .contact-card {
+    &__icon {
+      &__image {
+        width: 2rem;
+      }
+      &__image-desktop {
+        display: none;
+        @media ${device.laptop} {
+          display: block;
+        }
+      }
+      &__image-mobile {
+        @media ${device.laptop} {
+          display: none;
+        }
+      }
+    }
+    &__title {
+      margin-top: 1rem;
+      line-height: 1rem;
+    }
+    &__text {
+      font-size: 14px;
+    }
+  }
+`;

package/dist/src/components/atoms/ContactCard/ContactCard.styled.ts

@@ -0,0 +1,39 @@
+import { device } from '../../../globalStyles/breakpoints'
+import styled from 'styled-components'
+
+export const ContactCardStyled = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background-color: white;
+  box-shadow: 0 2px 6px 0 rgba(2, 55, 74, 0.25);
+  border-radius: 0.25rem;
+  min-width: 200px;
+  padding: 1rem;
+
+  .contact-card {
+    &__icon {
+      &__image {
+        width: 2rem;
+      }
+      &__image-desktop {
+        display: none;
+        @media ${device.laptop} {
+          display: block;
+        }
+      }
+      &__image-mobile {
+        @media ${device.laptop} {
+          display: none;
+        }
+      }
+    }
+    &__title {
+      margin-top: 1rem;
+      line-height: 1rem;
+    }
+    &__text {
+      font-size: 14px;
+    }
+  }
+`

package/dist/src/components/atoms/ContactCard/ContactCard.tsx

@@ -0,0 +1,38 @@
+import React, { type FC } from 'react'
+
+import { ContactCardProps } from './ContactCardProps.types'
+
+import { ContactCardStyled } from './ContactCard.styled'
+
+const ContactCard: FC<ContactCardProps> = ({
+  id,
+  title,
+  image,
+  body = '',
+  url,
+  isClickableOnDesktop = true,
+  dataQa
+}) => {
+  return (
+    <ContactCardStyled className='contact-card' key={id}>
+      <div className='contact-card__icon'>
+        {isClickableOnDesktop ? (
+          <a className='contact-card__icon__image' data-qa={dataQa} href={url} target='_self'>
+            {image}
+          </a>
+        ) : (
+          <div>
+            <div className='contact-card__icon__image contact-card__icon__image-desktop'>{image}</div>
+            <a className='contact-card__icon__image contact-card__icon__image-mobile' data-qa={dataQa} href={url}>
+              {image}
+            </a>
+          </div>
+        )}
+      </div>
+      <div className='contact-card__title'>{title}</div>
+      <p className='contact-card__text'>{body}</p>
+    </ContactCardStyled>
+  )
+}
+
+export default ContactCard

package/dist/src/components/atoms/ContactCard/ContactCardProps.types.d.ts

@@ -0,0 +1,9 @@
+export interface ContactCardProps {
+    id: string;
+    image: React.ReactNode;
+    title: string;
+    body?: string;
+    url: string;
+    isClickableOnDesktop?: boolean;
+    dataQa: string;
+}

package/dist/src/components/atoms/ContactCard/ContactCardProps.types.js

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

package/dist/src/components/atoms/ContactCard/ContactCardProps.types.ts

@@ -0,0 +1,9 @@
+export interface ContactCardProps {
+  id: string
+  image: React.ReactNode
+  title: string
+  body?: string
+  url: string
+  isClickableOnDesktop?: boolean
+  dataQa: string
+}

package/dist/src/components/atoms/ContactCard/index.d.ts

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

package/dist/src/components/atoms/ContactCard/index.js

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

package/dist/src/components/atoms/ContactCard/index.ts

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

package/dist/src/components/atoms/index.d.ts

@@ -9,6 +9,7 @@ export * from './Button';
 export * from './ButtonIcon';
 export * from './CardPane';
 export * from './Checkbox';
+export * from './ContactCard';
 export * from './DatePickerCustom';
 export * from './DialogMenuIcon';
 export * from './Disclaimer';

package/dist/src/components/atoms/index.js

@@ -9,6 +9,7 @@ export * from './Button';
 export * from './ButtonIcon';
 export * from './CardPane';
 export * from './Checkbox';
+export * from './ContactCard';
 export * from './DatePickerCustom';
 export * from './DialogMenuIcon';
 export * from './Disclaimer';

package/dist/src/components/atoms/index.ts

@@ -9,6 +9,7 @@ export * from './Button'
 export * from './ButtonIcon'
 export * from './CardPane'
 export * from './Checkbox'
+export * from './ContactCard'
 export * from './DatePickerCustom'
 export * from './DialogMenuIcon'
 export * from './Disclaimer'

package/dist/src/components/molecules/Article/Article.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import ArrowRight from '../../../../images/svg/arrow-right-24px-outlined.svg';
 import { Button } from '../../atoms';
 // import './Article.scss'
-const Article = ({ imageUrl, title, articleUrl, summary }) => {
-    return (_jsxs("div", { className: 'article', children: [_jsx("img", { src: imageUrl, className: 'image', loading: 'lazy', alt: title }), _jsxs("div", { className: 'information', children: [_jsx("a", { href: articleUrl, target: '_blank', rel: 'noreferrer', children: _jsxs("p", { className: 'title sans-serif --big', children: [title, " "] }) }), _jsx("div", { className: 'summary', children: summary }), _jsx(Button, { color: 'tertiary', label: 'Read more', dataQa: 'article-read-more', link: articleUrl, isExternal: true })] })] }));
+const Article = ({ imageUrl, title, articleUrl, summary, isCategoryProductPage }) => {
+    return (_jsxs("div", { className: 'article', children: [_jsx("img", { src: imageUrl, className: 'image', loading: 'lazy', alt: title }), _jsxs("div", { className: 'information', children: [_jsx("a", { href: articleUrl, target: '_blank', rel: 'noreferrer', children: _jsxs("p", { className: 'title sans-serif --big', children: [title, " "] }) }), _jsx("div", { className: 'summary', children: summary }), isCategoryProductPage ? (_jsxs("div", { className: 'button-image-container', children: [_jsx(Button, { givenClass: 'thinner-letter', color: 'tertiary', label: 'Read more', dataQa: 'article-read-more', link: articleUrl, isExternal: true }), _jsx("img", { className: 'article__arrow-right', src: ArrowRight, alt: '' })] })) : (_jsx(Button, { color: 'tertiary', label: 'Read more', dataQa: 'article-read-more', link: articleUrl, isExternal: true }))] })] }));
 };
 export default Article;

package/dist/src/components/molecules/Article/Article.scss

@@ -62,5 +62,22 @@
         margin-top: 0;
       }
     }
+
+    .button-image-container {
+      align-items: center;
+      margin: 1rem 0 2rem 0;
+      display: flex;
+
+      .thinner-letter {
+        font-family: $font-sans;
+        font-size: 16px;
+        font-weight: 400;
+        line-height: 22px;
+        letter-spacing: -0.3px;
+        text-align: left;
+        margin: 0;
+        padding: 0 1rem 0 0;
+      }
+    }
   }
 }

package/dist/src/components/molecules/Article/Article.tsx

@@ -1,10 +1,11 @@
 import React, { type FC } from 'react'
 
+import ArrowRight from '../../../../images/svg/arrow-right-24px-outlined.svg'
 import { type ArticleProps } from './ArticleProps.types'
 import { Button } from '../../atoms'
 // import './Article.scss'
 
-const Article: FC<ArticleProps> = ({ imageUrl, title, articleUrl, summary }) => {
+const Article: FC<ArticleProps> = ({ imageUrl, title, articleUrl, summary, isCategoryProductPage }) => {
   return (
     <div className='article'>
       <img src={imageUrl} className='image' loading='lazy' alt={title} />
@@ -13,7 +14,21 @@ const Article: FC<ArticleProps> = ({ imageUrl, title, articleUrl, summary }) =>
           <p className='title sans-serif --big'>{title} </p>
         </a>
         <div className='summary'>{summary}</div>
-        <Button color='tertiary' label={'Read more'} dataQa='article-read-more' link={articleUrl} isExternal />
+        {isCategoryProductPage ? (
+          <div className='button-image-container'>
+            <Button
+              givenClass='thinner-letter'
+              color='tertiary'
+              label={'Read more'}
+              dataQa='article-read-more'
+              link={articleUrl}
+              isExternal
+            />
+            <img className='article__arrow-right' src={ArrowRight} alt=''></img>
+          </div>
+        ) : (
+          <Button color='tertiary' label={'Read more'} dataQa='article-read-more' link={articleUrl} isExternal />
+        )}
       </div>
     </div>
   )

package/dist/src/components/molecules/Article/ArticleProps.types.d.ts

@@ -4,4 +4,5 @@ export interface ArticleProps {
     articleUrl: string;
     summary: string;
     id: string;
+    isCategoryProductPage: boolean;
 }

package/dist/src/components/molecules/Article/ArticleProps.types.ts

@@ -4,4 +4,5 @@ export interface ArticleProps {
   articleUrl: string
   summary: string
   id: string
+  isCategoryProductPage: boolean
 }

package/dist/src/components/molecules/ContactCardList/ContactCardList.d.ts

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

package/dist/src/components/molecules/ContactCardList/ContactCardList.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ContactCard } from '../../atoms';
+import { ContactCardListStyled } from './ContactCardList.styled';
+const ContactCardList = ({ contactCards = [] }) => {
+    return (_jsx(ContactCardListStyled, { className: 'contact-card-list', children: contactCards.map((contactCard) => (_jsx(ContactCard, { ...contactCard }, contactCard.id))) }));
+};
+export default ContactCardList;

package/dist/src/components/molecules/ContactCardList/ContactCardList.styled.d.ts

@@ -0,0 +1 @@
+export declare const ContactCardListStyled: 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/{sections/FunctionalityCardsSection/FunctionalityCardsSection.styled.js → molecules/ContactCardList/ContactCardList.styled.js}

@@ -1,14 +1,13 @@
 import { device } from '../../../globalStyles/breakpoints';
 import styled from 'styled-components';
-export const FunctionalityCardsSectionStyled = styled.section `
+export const ContactCardListStyled = styled.div `
   display: flex;
+  justify-content: center;
   flex-direction: column;
-  gap: $global-gap;
-  margin-bottom: 2rem;
-  width: 100%;
+  gap: 1rem;
 
   @media ${device.laptop} {
     flex-direction: row;
-    width: 50%;
+    gap: 2.5rem;
   }
 `;

package/dist/src/components/{sections/FunctionalityCardsSection/FunctionalityCardsSection.styled.ts → molecules/ContactCardList/ContactCardList.styled.ts}

@@ -1,15 +1,14 @@
 import { device } from '../../../globalStyles/breakpoints'
 import styled from 'styled-components'
 
-export const FunctionalityCardsSectionStyled = styled.section`
+export const ContactCardListStyled = styled.div`
   display: flex;
+  justify-content: center;
   flex-direction: column;
-  gap: $global-gap;
-  margin-bottom: 2rem;
-  width: 100%;
+  gap: 1rem;
 
   @media ${device.laptop} {
     flex-direction: row;
-    width: 50%;
+    gap: 2.5rem;
   }
 `

package/dist/src/components/molecules/ContactCardList/ContactCardList.tsx

@@ -0,0 +1,17 @@
+import React, { type FC } from 'react'
+
+import { ContactCard } from '../../atoms'
+
+import { type ContactCardListProps } from './ContactCardListProps.types'
+import { ContactCardListStyled } from './ContactCardList.styled'
+
+const ContactCardList: FC<ContactCardListProps> = ({ contactCards = [] }) => {
+  return (
+    <ContactCardListStyled className='contact-card-list'>
+      {contactCards.map((contactCard) => (
+        <ContactCard key={contactCard.id} {...contactCard} />
+      ))}
+    </ContactCardListStyled>
+  )
+}
+export default ContactCardList

package/dist/src/components/molecules/ContactCardList/ContactCardListProps.types.d.ts

@@ -0,0 +1,4 @@
+import { ContactCardProps } from '../../atoms';
+export interface ContactCardListProps {
+    contactCards: ContactCardProps[];
+}

package/dist/src/components/molecules/ContactCardList/ContactCardListProps.types.js

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

package/dist/src/components/molecules/ContactCardList/ContactCardListProps.types.ts

@@ -0,0 +1,5 @@
+import { ContactCardProps } from '../../atoms'
+
+export interface ContactCardListProps {
+  contactCards: ContactCardProps[]
+}

package/dist/src/components/molecules/ContactCardList/index.d.ts

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

package/dist/src/components/molecules/ContactCardList/index.js

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

package/dist/src/components/molecules/ContactCardList/index.ts

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

package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.scss

@@ -64,7 +64,7 @@
   }
 
   &.primary {
-    background-color: var(--neutral-neutral-6);
+    background-color: get-color(neutral, neutral-6);
 
     .icon-svg-with-theme-color {
       background-color: get-color(primary, main-light-1);

package/dist/src/components/molecules/index.d.ts

@@ -9,6 +9,7 @@ export * from './BottomOverlay';
 export * from './BoxForm';
 export * from './Breadcrumb';
 export * from './ContactBox';
+export * from './ContactCardList';
 export * from './ContinueEditingBanner';
 export * from './CountDownMessage';
 export * from './EmailContactBox';

package/dist/src/components/molecules/index.js

@@ -9,6 +9,7 @@ export * from './BottomOverlay';
 export * from './BoxForm';
 export * from './Breadcrumb';
 export * from './ContactBox';
+export * from './ContactCardList';
 export * from './ContinueEditingBanner';
 export * from './CountDownMessage';
 export * from './EmailContactBox';

package/dist/src/components/molecules/index.ts

@@ -9,6 +9,7 @@ export * from './BottomOverlay'
 export * from './BoxForm'
 export * from './Breadcrumb'
 export * from './ContactBox'
+export * from './ContactCardList'
 export * from './ContinueEditingBanner'
 export * from './CountDownMessage'
 export * from './EmailContactBox'

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

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Article } from '../../molecules';
 // import './ArticlesList.scss'
-const ArticlesList = ({ articles = [] }) => {
+const ArticlesList = ({ articles = [], isCategoryProductPage = false }) => {
     if (articles?.length === 0)
         return null;
-    return (_jsx("div", { className: 'articles_wrapper', children: articles.map((article) => (_jsx(Article, { ...article }, `article_${article?.id}`))) }));
+    return (_jsx("div", { className: 'articles_wrapper', children: articles.map((article) => (_jsx(Article, { ...article, isCategoryProductPage: isCategoryProductPage }, `article_${article?.id}`))) }));
 };
 export default ArticlesList;

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

@@ -5,13 +5,13 @@ import { Article, type ArticleProps } from '../../molecules'
 import { type ArticlesListProps } from './ArticlesListProps.types'
 // import './ArticlesList.scss'
 
-const ArticlesList: FC<ArticlesListProps> = ({ articles = [] }) => {
+const ArticlesList: FC<ArticlesListProps> = ({ articles = [], isCategoryProductPage = false }) => {
   if (articles?.length === 0) return null
 
   return (
     <div className='articles_wrapper'>
       {articles.map((article: ArticleProps) => (
-        <Article key={`article_${article?.id}`} {...article} />
+        <Article key={`article_${article?.id}`} {...article} isCategoryProductPage={isCategoryProductPage} />
       ))}
     </div>
   )

package/dist/src/components/organisms/ArticlesList/ArticlesListProps.types.d.ts

@@ -1,4 +1,5 @@
 import { type ArticleProps } from '../../molecules';
 export interface ArticlesListProps {
     articles: ArticleProps[];
+    isCategoryProductPage?: boolean;
 }

package/dist/src/components/organisms/ArticlesList/ArticlesListProps.types.ts

@@ -2,4 +2,5 @@ import { type ArticleProps } from '../../molecules'
 
 export interface ArticlesListProps {
   articles: ArticleProps[]
+  isCategoryProductPage?: boolean
 }

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

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

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

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ContactCardList } from '../../molecules';
+import { ContactContentStyled } from './ContactContent.styled';
+const ContactContent = ({ title, text, contactCards = [] }) => {
+    if (contactCards.length === 0)
+        return null;
+    return (_jsxs(ContactContentStyled, { className: 'contact-content', children: [_jsx("h2", { className: 'contact-content__title', children: title }), _jsx("p", { className: 'contact-content__text', children: text }), _jsx(ContactCardList, { contactCards: contactCards })] }));
+};
+export default ContactContent;

package/dist/src/components/{sections/AboutUsSection/AboutUsSection.styled.d.ts → organisms/ContactContent/ContactContent.styled.d.ts}

@@ -1 +1 @@
-export declare const AboutUsSectionStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ContactContentStyled: 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/ContactContent/ContactContent.styled.js

@@ -0,0 +1,28 @@
+import styled from 'styled-components';
+export const ContactContentStyled = styled.div `
+  display: flex;
+  flex-direction: column;
+  transform: translateY(-5rem);
+  color: var(--neutral-neutral-1);
+  margin-top: 1rem;
+
+  .contact-content {
+    &__title {
+      text-align: center;
+      font-size: 32px;
+      font-family: var(--font-serif);
+      font-style: normal;
+      font-weight: 400;
+      line-height: 42px;
+      letter-spacing: -0.3px;
+      margin: 1rem 0;
+    }
+
+    &__text {
+      text-align: center;
+      font-style: normal;
+      font-weight: 400;
+      margin: 0 0 2rem 0;
+    }
+  }
+`;

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

@@ -0,0 +1,29 @@
+import styled from 'styled-components'
+
+export const ContactContentStyled = styled.div`
+  display: flex;
+  flex-direction: column;
+  transform: translateY(-5rem);
+  color: var(--neutral-neutral-1);
+  margin-top: 1rem;
+
+  .contact-content {
+    &__title {
+      text-align: center;
+      font-size: 32px;
+      font-family: var(--font-serif);
+      font-style: normal;
+      font-weight: 400;
+      line-height: 42px;
+      letter-spacing: -0.3px;
+      margin: 1rem 0;
+    }
+
+    &__text {
+      text-align: center;
+      font-style: normal;
+      font-weight: 400;
+      margin: 0 0 2rem 0;
+    }
+  }
+`

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

@@ -0,0 +1,20 @@
+import React, { type FC } from 'react'
+
+import { ContactCardList } from '../../molecules'
+
+import { ContactContentProps } from './ContactContentProps.types'
+
+import { ContactContentStyled } from './ContactContent.styled'
+
+const ContactContent: FC<ContactContentProps> = ({ title, text, contactCards = [] }) => {
+  if (contactCards.length === 0) return null
+
+  return (
+    <ContactContentStyled className='contact-content'>
+      <h2 className='contact-content__title'>{title}</h2>
+      <p className='contact-content__text'>{text}</p>
+      <ContactCardList contactCards={contactCards} />
+    </ContactContentStyled>
+  )
+}
+export default ContactContent

package/dist/src/components/organisms/ContactContent/ContactContentProps.types.d.ts

@@ -0,0 +1,6 @@
+import { ContactCardProps } from '../../atoms';
+export interface ContactContentProps {
+    title: string;
+    text: string;
+    contactCards?: ContactCardProps[];
+}

package/dist/src/components/organisms/ContactContent/ContactContentProps.types.js

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

package/dist/src/components/organisms/ContactContent/ContactContentProps.types.ts

@@ -0,0 +1,7 @@
+import { ContactCardProps } from '../../atoms'
+
+export interface ContactContentProps {
+  title: string
+  text: string
+  contactCards?: ContactCardProps[]
+}

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

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

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

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

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

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

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

@@ -3,6 +3,7 @@ export * from './Accordion';
 export * from './ArticlesList';
 export * from './AsSeeInContent';
 export * from './CardFunctionality';
+export * from './ContactContent';
 export * from './ContactJumbotron';
 export * from './CookiePolicyBar';
 export * from './ErrorContentRatafia';