@npm_leadtech/legal-lib-components 4.1.6 → 4.1.10

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

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

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

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

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

@@ -1,5 +1,4 @@
 import { type FC } from 'react';
 import { type StepsRatafiaContentProps } from './StepsRatafiaContentProps.types';
-import './StepsRatafiaContent.scss';
 declare const StepsRatafiaContent: FC<StepsRatafiaContentProps>;
 export default StepsRatafiaContent;

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { StepRatafiaCardList } from '../../molecules';
-import './StepsRatafiaContent.scss';
+// import './StepsRatafiaContent.scss'
 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 })] }));
 };

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

@@ -0,0 +1,12 @@
+@import '../../../globalStyles/variables.scss';
+
+.steps-ratafia-content {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+
+  &__title {
+    color: get-color(neutral, neutral-1);
+  }
+}

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

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

package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContentProps.types.ts

@@ -0,0 +1,6 @@
+import { type StepRatafiaCardProps } from '../../atoms'
+
+export interface StepsRatafiaContentProps {
+  title: string
+  steps: StepRatafiaCardProps[]
+}

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

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

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

@@ -1,5 +1,4 @@
 import { type FC } from 'react';
 import { type TryOurFreeLegalBlogsContentProps } from './TryOurFreeLegalBlogsContentProps.types';
-import './TryOurFreeLegalBlogsContent.scss';
 declare const TryOurFreeLegalBlogsContent: FC<TryOurFreeLegalBlogsContentProps>;
 export default TryOurFreeLegalBlogsContent;

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { RichTextInner } from '../../atoms';
-import './TryOurFreeLegalBlogsContent.scss';
+// import './TryOurFreeLegalBlogsContent.scss'
 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 })] }));
 };

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

@@ -0,0 +1,49 @@
+@import '../../../globalStyles/variables.scss';
+@import '../../../globalStyles/mediaqueries.scss';
+
+.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: get-color(neutral, neutral-1);
+    font-style: normal;
+    font-weight: 400;
+    letter-spacing: -0.3px;
+
+    @include landscape-tablets {
+      margin-right: 3rem;
+      margin-bottom: 0;
+    }
+
+    &__title {
+      font-family: $font-serif;
+      font-size: 28px;
+      line-height: 42px;
+      margin-bottom: 2rem;
+      text-align: center;
+
+      @include landscape-tablets {
+        text-align: left;
+      }
+    }
+
+    &__body {
+      font-family: $font-sans;
+      font-size: 16px;
+      line-height: 22px;
+
+      a {
+        color: get-color(primary, main-light-1);
+        font-weight: 400 !important;
+      }
+    }
+  }
+
+  &__image {
+    flex-basis: 50%;
+  }
+}

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

@@ -0,0 +1,19 @@
+import React, { type FC } from 'react'
+
+import { RichTextInner } from '../../atoms'
+import { type TryOurFreeLegalBlogsContentProps } from './TryOurFreeLegalBlogsContentProps.types'
+// import './TryOurFreeLegalBlogsContent.scss'
+
+const TryOurFreeLegalBlogsContent: FC<TryOurFreeLegalBlogsContentProps> = ({ title, image, children }) => {
+  return (
+    <>
+      <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>
+    </>
+  )
+}
+
+export default TryOurFreeLegalBlogsContent

package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContentProps.types.ts

@@ -0,0 +1,5 @@
+export interface TryOurFreeLegalBlogsContentProps {
+  title: string
+  image: React.ReactNode
+  children: React.ReactNode
+}

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

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

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

@@ -0,0 +1,22 @@
+export * from './AboutUsContent'
+export * from './Accordion'
+export * from './ArticlesList'
+export * from './AsSeeInContent'
+export * from './CardFuncionality'
+export * from './ContactJumbotron'
+export * from './CookiePolicyBar'
+export * from './ErrorContentRatafia'
+export * from './FaqGroup'
+export * from './FeaturesRatafiaContent'
+export * from './GuidelinesContent'
+export * from './JumbotronRatafiaContent'
+export * from './KeyFactsLoadingContentRatafia'
+export * from './KeyFactsResultContentRatafia'
+export * from './LanguageSelector'
+export * from './LanguageSelectorMobile'
+export * from './LayoutRatafia'
+export * from './ListStepsGetForm'
+export * from './LoginRatafiaContent'
+export * from './MobileBottomBar'
+export * from './StepsRatafiaContent'
+export * from './TryOurFreeLegalBlogsContent'

package/dist/src/components/pages/AboutUsPage/AboutUsPage.tsx

@@ -0,0 +1,43 @@
+import React from 'react'
+
+import {
+  AboutUsSection,
+  AsSeeInSection,
+  ExpertsSection,
+  GuidelinesSection,
+  PeopleSayAboutUsSection,
+  TryOurFreeLegalBlogsSection,
+  TryUsSection
+} from '../../sections'
+import { type AboutUsPageProps } from './AboutUsPageProps'
+
+export const AboutUsPage: React.FC<AboutUsPageProps> = ({
+  aboutUsSectionProps,
+  tryOurFreeLegalBlogsSectionProps,
+  peopleSayAboutUsSectionProps,
+  guidelinesSectionProps,
+  tryUsSectionProps,
+  expertsSectionProps,
+  asSeeInSectionProps,
+  isJonSnow = false
+}) => {
+  return (
+    <>
+      {aboutUsSectionProps != null && <AboutUsSection {...aboutUsSectionProps} />}
+      {tryOurFreeLegalBlogsSectionProps != null && (
+        <TryOurFreeLegalBlogsSection {...tryOurFreeLegalBlogsSectionProps} />
+      )}
+      {!isJonSnow && peopleSayAboutUsSectionProps != null && (
+        <PeopleSayAboutUsSection {...peopleSayAboutUsSectionProps} />
+      )}
+      {guidelinesSectionProps != null && (
+        <GuidelinesSection {...guidelinesSectionProps}>
+          {guidelinesSectionProps.contentGuidelines?.children}
+        </GuidelinesSection>
+      )}
+      {tryUsSectionProps != null && <TryUsSection {...tryUsSectionProps}>{tryUsSectionProps.children}</TryUsSection>}
+      {expertsSectionProps != null && <ExpertsSection {...expertsSectionProps} />}
+      {!isJonSnow && asSeeInSectionProps != null && <AsSeeInSection {...asSeeInSectionProps} />}
+    </>
+  )
+}

package/dist/src/components/pages/AboutUsPage/AboutUsPageProps.ts

@@ -0,0 +1,20 @@
+import type {
+  AboutUsSectionProps,
+  AsSeeInSectionProps,
+  ExpertsSectionProps,
+  GuidelinesSectionProps,
+  PeopleSayAboutUsSectionProps,
+  TryOurFreeLegalBlogsSectionProps,
+  TryUsSectionProps
+} from '../../sections'
+
+export interface AboutUsPageProps {
+  aboutUsSectionProps?: AboutUsSectionProps
+  tryOurFreeLegalBlogsSectionProps?: TryOurFreeLegalBlogsSectionProps
+  peopleSayAboutUsSectionProps?: PeopleSayAboutUsSectionProps
+  guidelinesSectionProps?: GuidelinesSectionProps
+  tryUsSectionProps?: TryUsSectionProps
+  expertsSectionProps?: ExpertsSectionProps
+  asSeeInSectionProps?: AsSeeInSectionProps
+  isJonSnow?: boolean
+}

package/dist/src/components/pages/AboutUsPage/index.ts

@@ -0,0 +1,2 @@
+export * from './AboutUsPage'
+export * from './AboutUsPageProps'

package/dist/src/components/pages/ContactUsPage/ContactUsPage.tsx

@@ -0,0 +1,20 @@
+import React from 'react'
+
+import { ContactSection, JumbotronSimplifiedSection } from '../../sections'
+import { type ContactUsPageProps } from './ContactUsPageProps'
+import { PhoneContactBoxMobile } from '../../molecules'
+
+export const ContactUsPage: React.FC<ContactUsPageProps> = ({
+  jumbotronSimplifiedSectionProps,
+  phoneContactBox,
+  contactProps,
+  isJonSnow = false
+}) => {
+  return (
+    <>
+      <JumbotronSimplifiedSection {...jumbotronSimplifiedSectionProps} />
+      {!isJonSnow && <PhoneContactBoxMobile {...phoneContactBox} />}
+      <ContactSection {...contactProps} />
+    </>
+  )
+}

package/dist/src/components/pages/ContactUsPage/ContactUsPageProps.ts

@@ -0,0 +1,9 @@
+import { type ContactSectionProps, type JumbotronSimplifiedSectionProps } from '../../sections'
+import { type PhoneContactBoxMobileProps } from '../../molecules'
+
+export interface ContactUsPageProps {
+  jumbotronSimplifiedSectionProps: JumbotronSimplifiedSectionProps
+  phoneContactBox: PhoneContactBoxMobileProps
+  contactProps: ContactSectionProps
+  isJonSnow?: boolean
+}

package/dist/src/components/pages/ContactUsPage/index.ts

@@ -0,0 +1,2 @@
+export * from './ContactUsPage'
+export * from './ContactUsPageProps'

package/dist/src/components/pages/ErrorRatafiaPage/ErrorRatafiaPage.scss

@@ -0,0 +1,32 @@
+@import '../../../globalStyles/variables.scss';
+@import '../../../globalStyles/mediaqueries.scss';
+
+.error-ratafia-page {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  flex: 1 0 0;
+  align-self: stretch;
+  gap: 1.5rem;
+  background-color: get-color(neutral, neutral-6);
+
+  &__ctas {
+    text-align: center;
+    &__button {
+      display: block;
+      width: 100%;
+      &:first-child {
+        margin-bottom: 1rem;
+      }
+
+      @include portrait-tablets {
+        display: inline-grid;
+        width: inherit;
+
+        &:first-child {
+          margin-right: 1rem;
+        }
+      }
+    }
+  }
+}

package/dist/src/components/pages/ErrorRatafiaPage/ErrorRatafiaPage.tsx

@@ -0,0 +1,68 @@
+import React from 'react'
+
+import { Button } from '../../atoms'
+import DisclaimerRatafia from '../../atoms/DisclaimerRatafia/DisclaimerRatafia'
+import { ErrorContentRatafia } from '../../organisms'
+import { type ErrorRatafiaPageProps } from './ErrorRatafiaPageProps.types'
+import { LayoutRatafia } from '../../organisms/LayoutRatafia'
+// import './ErrorRatafiaPage.scss'
+
+export const ErrorRatafiaPage: React.FC<ErrorRatafiaPageProps> = ({
+  header,
+  errorContent,
+  disclaimer,
+  goToDashboardCta,
+  tryAgainCta
+}) => {
+  const ctas = (
+    <div className='error-ratafia-page__ctas'>
+      <Button
+        givenClass='error-ratafia-page__ctas__button'
+        dataQa={tryAgainCta.dataQa}
+        color='primary'
+        label={tryAgainCta.label}
+        onClick={tryAgainCta.handleOnClick}
+        link={tryAgainCta.link}
+      />
+      <Button
+        givenClass='error-ratafia-page__ctas__button'
+        dataQa={goToDashboardCta.dataQa}
+        color='secondary'
+        label={goToDashboardCta.label}
+        onClick={goToDashboardCta.handleOnClick}
+        link={goToDashboardCta.link}
+      />
+    </div>
+  )
+
+  const content = <ErrorContentRatafia title={errorContent.title} errorMessage={errorContent.errorMessage} />
+
+  const footerDesktop = (
+    <DisclaimerRatafia
+      icon={disclaimer.icon}
+      text={disclaimer.text}
+      copyrightText={disclaimer.copyrightText}
+      ctaTextShowDisclaimer={disclaimer.ctaTextShowDisclaimer}
+      ctaTextCloseDisclaimer={disclaimer.ctaTextCloseDisclaimer}
+    />
+  )
+
+  const footerMobile = (
+    <>
+      {footerDesktop}
+      {ctas}
+    </>
+  )
+
+  return (
+    <div className='error-ratafia-page'>
+      <LayoutRatafia
+        header={header}
+        content={content}
+        cta={ctas}
+        footerDesktop={footerDesktop}
+        footerMobile={footerMobile}
+      />
+    </div>
+  )
+}

package/dist/src/components/pages/ErrorRatafiaPage/ErrorRatafiaPageProps.types.ts

@@ -0,0 +1,18 @@
+import type { DisclaimerRatafiaProps } from '../../atoms'
+import { type ErrorContentRatafiaProps } from '../../organisms'
+import { type HeaderRatafiaProps } from '../../molecules'
+
+export interface ErrorRatafiaPageProps {
+  header: HeaderRatafiaProps
+  errorContent: ErrorContentRatafiaProps
+  disclaimer: DisclaimerRatafiaProps
+  tryAgainCta: cta
+  goToDashboardCta: cta
+}
+
+interface cta {
+  label: string
+  link?: string
+  handleOnClick?: (functionParameters?: any) => () => void
+  dataQa: string
+}

package/dist/src/components/pages/ErrorRatafiaPage/index.ts

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

package/dist/src/components/pages/FaqsPage/FaqsPage.d.ts

@@ -1,4 +1,3 @@
 import React from 'react';
 import { type FaqsPageProps } from './FaqsPageProps';
-import './FaqsPage.scss';
 export declare const FaqsPage: React.FC<FaqsPageProps>;

package/dist/src/components/pages/FaqsPage/FaqsPage.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AsideMenuSection, FaqSection } from '../../sections';
-import './FaqsPage.scss';
+// import './FaqsPage.scss'
 export const FaqsPage = ({ title, subtitle, asideMenuSectionProps, faqSectionProps }) => {
     return (_jsxs("div", { className: 'faq-page', children: [_jsxs("div", { className: 'titles', children: [_jsx("h1", { className: 'title', children: title }), _jsx("h2", { className: 'subtitle', children: subtitle })] }), _jsxs("div", { className: 'main-content', children: [_jsx(AsideMenuSection, { ...asideMenuSectionProps }), _jsx(FaqSection, { ...faqSectionProps })] })] }));
 };

package/dist/src/components/pages/FaqsPage/FaqsPage.scss

@@ -0,0 +1,61 @@
+@import '../../../globalStyles/variables.scss';
+@import '../../../globalStyles/mediaqueries.scss';
+
+.faq-page {
+  .titles {
+    display: flex;
+    padding: 40px 24px;
+    flex-direction: column;
+    align-items: center;
+    gap: 8px;
+    background: get-color(primary, main-light-6);
+
+    @include landscape-tablets {
+      padding: 40px 32px 80px 32px;
+    }
+
+    .title {
+      color: get-color(neutral, neutral-2);
+      font-family: $font-sans;
+      font-size: 14px;
+      line-height: 18px;
+      letter-spacing: -0.3px;
+      border-bottom: get-color(neutral, neutral-2) 1px solid;
+      padding-bottom: 8px;
+      margin-bottom: 8px;
+    }
+
+    .subtitle {
+      color: get-color(neutral, main);
+      font-family: $font-serif;
+      font-size: 36px;
+      line-height: 48px;
+      font-weight: 400;
+      letter-spacing: -0.3px;
+
+      @include landscape-tablets {
+        font-size: 48px;
+        line-height: 58px;
+      }
+    }
+  }
+
+  .main-content {
+    display: flex;
+    flex-direction: row;
+    padding: 32px 24px;
+    gap: $global-gap;
+    background: get-color(primary, main-light-6);
+    justify-content: center;
+
+    @include mobile {
+      flex-direction: column;
+      gap: $global-gap * 3;
+    }
+
+    @include landscape-tablets {
+      padding: 32px;
+      gap: 106px;
+    }
+  }
+}

package/dist/src/components/pages/FaqsPage/FaqsPage.tsx

@@ -0,0 +1,20 @@
+import React from 'react'
+
+import { AsideMenuSection, FaqSection } from '../../sections'
+import { type FaqsPageProps } from './FaqsPageProps'
+// import './FaqsPage.scss'
+
+export const FaqsPage: React.FC<FaqsPageProps> = ({ title, subtitle, asideMenuSectionProps, faqSectionProps }) => {
+  return (
+    <div className='faq-page'>
+      <div className='titles'>
+        <h1 className='title'>{title}</h1>
+        <h2 className='subtitle'>{subtitle}</h2>
+      </div>
+      <div className='main-content'>
+        <AsideMenuSection {...asideMenuSectionProps} />
+        <FaqSection {...faqSectionProps} />
+      </div>
+    </div>
+  )
+}

package/dist/src/components/pages/FaqsPage/FaqsPageProps.ts

@@ -0,0 +1,8 @@
+import { type AsideMenuSectionProps, type FaqSectionProps } from '../../sections'
+
+export interface FaqsPageProps {
+  title: string
+  subtitle: string
+  asideMenuSectionProps: AsideMenuSectionProps
+  faqSectionProps: FaqSectionProps
+}

package/dist/src/components/pages/FaqsPage/index.ts

@@ -0,0 +1,2 @@
+export * from './FaqsPage'
+export * from './FaqsPageProps'

package/dist/src/components/pages/KeyFactsResultRatafiaPage/KeyFactsResultRatafiaPage.scss

@@ -0,0 +1,23 @@
+@import '../../../globalStyles/variables.scss';
+@import '../../../globalStyles/mediaqueries.scss';
+
+.key-facts-result-page {
+  background-color: get-color(neutral, neutral-6);
+  &__content {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    flex: 1 0 0;
+    align-self: stretch;
+    gap: 1.5rem;
+
+    &__cta {
+      align-self: start;
+      display: block;
+      width: 100%;
+      @include portrait-tablets {
+        display: inline-block;
+      }
+    }
+  }
+}

package/dist/src/components/pages/KeyFactsResultRatafiaPage/KeyFactsResultRatafiaPage.tsx

@@ -0,0 +1,74 @@
+import React from 'react'
+
+import { KeyFactsLoadingContentRatafia, KeyFactsResultContentRatafia } from '../../organisms'
+import { Button } from '../../atoms'
+import DisclaimerRatafia from '../../atoms/DisclaimerRatafia/DisclaimerRatafia'
+import { type KeyFactsResultRatafiaPageProps } from './KeyFactsResultRatafiaPageProps.types'
+import { LayoutRatafia } from '../../organisms/LayoutRatafia'
+// import './KeyFactsResultRatafiaPage.scss'
+
+export const KeyFactsResultRatafiaPage: React.FC<KeyFactsResultRatafiaPageProps> = ({
+  header,
+  resultContent,
+  reviewContent,
+  disclaimer,
+  cta,
+  loadingIcon,
+  loadingText,
+  isLoading
+}) => {
+  const loadingContent = (
+    <div className='key-facts-result-page__content'>
+      <KeyFactsLoadingContentRatafia documentName={resultContent.documentName} icon={loadingIcon} text={loadingText} />
+    </div>
+  )
+  const loadedContent = (
+    <div className='key-facts-result-page__content'>
+      <KeyFactsResultContentRatafia result={resultContent} review={reviewContent} />
+    </div>
+  )
+
+  const ctaButton = isLoading ? null : (
+    <Button
+      givenClass='key-facts-result-page__content__cta'
+      dataQa={cta.dataQa}
+      color='primary'
+      label={cta.label}
+      onClick={cta.handleOnClick}
+      noLink
+    />
+  )
+
+  const footerDesktop = (
+    <div className='key-facts-result-page__footer-desktop'>
+      <DisclaimerRatafia
+        icon={disclaimer.icon}
+        text={disclaimer.text}
+        copyrightText={disclaimer.copyrightText}
+        ctaTextShowDisclaimer={disclaimer.ctaTextShowDisclaimer}
+        ctaTextCloseDisclaimer={disclaimer.ctaTextCloseDisclaimer}
+      />
+    </div>
+  )
+
+  const footerMobile = (
+    <>
+      {footerDesktop}
+      {ctaButton}
+    </>
+  )
+
+  return (
+    <div className='key-facts-result-page'>
+      <LayoutRatafia
+        header={header}
+        content={isLoading ? loadingContent : loadedContent}
+        cta={ctaButton}
+        footerDesktop={footerDesktop}
+        footerMobile={footerMobile}
+      />
+    </div>
+  )
+}
+
+export default KeyFactsResultRatafiaPage

package/dist/src/components/pages/KeyFactsResultRatafiaPage/KeyFactsResultRatafiaPageProps.types.ts

@@ -0,0 +1,20 @@
+import type { DisclaimerRatafiaProps, ReviewKeyFactsResultRatafiaProps } from '../../atoms'
+import { type HeaderRatafiaProps } from '../../molecules'
+import { type KeyFactsResultProps } from '../../organisms'
+
+export interface KeyFactsResultRatafiaPageProps {
+  header: HeaderRatafiaProps
+  resultContent: KeyFactsResultProps
+  reviewContent: ReviewKeyFactsResultRatafiaProps
+  disclaimer: DisclaimerRatafiaProps
+  cta: KeyFactsResultCta
+  loadingIcon?: React.ReactNode
+  loadingText?: React.ReactNode
+  isLoading: boolean
+}
+
+interface KeyFactsResultCta {
+  label: string
+  handleOnClick?: (functionParameters?: any) => () => void
+  dataQa: string
+}

package/dist/src/components/pages/KeyFactsResultRatafiaPage/index.ts

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