@npm_leadtech/legal-lib-components 5.9.3 → 5.9.4

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

@@ -0,0 +1,138 @@
+import { device } from '../../../globalStyles/breakpoints';
+import styled from 'styled-components';
+export const GuideslinesContentStyled = styled.div `
+  .guidelines-section-main {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+    padding: 1.5rem;
+
+    @media ${device.laptop} {
+      flex-direction: row;
+      padding: 0;
+    }
+  }
+
+  .guidelines-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-left: 3rem;
+      margin-bottom: 0;
+    }
+
+    &__title {
+      font-family: var(--font-serif);
+      margin-bottom: 2rem;
+      text-align: center;
+      font-size: 32px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 42px;
+      letter-spacing: -0.3px;
+
+      @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;
+      }
+    }
+  }
+
+  .guidelines-section__image {
+    flex-basis: 50%;
+    margin-bottom: 2rem;
+
+    &.big-devices {
+      display: none;
+
+      @media ${device['landscape-tablets']} {
+        display: flex;
+      }
+    }
+
+    &.is-mobile {
+      display: none;
+
+      @media ${device['landscape-tablets']} {
+        display: none;
+      }
+
+      img {
+        display: none;
+      }
+    }
+  }
+
+  .guidelines-section-detail {
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+    margin: 2rem 0 1rem 0;
+
+    @media ${device.laptop} {
+      flex-direction: row;
+    }
+
+    &__item {
+      display: flex;
+      flex: 1;
+      flex-direction: column;
+      background: var(--others-white);
+      border-radius: 0.5rem;
+      padding: 1.5rem;
+
+      &__image {
+        width: 100%;
+        border-radius: 0.5rem;
+      }
+
+      &__title {
+        font-family: var(--font-serif);
+        font-style: normal;
+        font-weight: 400;
+        font-size: 24px;
+        line-height: 32px;
+        letter-spacing: -0.3px;
+        color: var(--neutral-neutral-1);
+        margin: 1.5rem 0 1rem 0;
+      }
+
+      ul {
+        list-style-type: disc;
+      }
+
+      ol {
+        list-style-type: decimal;
+      }
+
+      ul,
+      ol {
+        margin-left: 1rem;
+        margin-bottom: 1rem;
+
+        li {
+          margin-bottom: 0;
+        }
+      }
+    }
+  }
+`;

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

@@ -1,20 +1,20 @@
-@import '../../../globalStyles/variables.scss';
-@import '../../../globalStyles/mediaqueries.scss';
+import { device } from '../../../globalStyles/breakpoints'
+import styled from 'styled-components'
 
-.guidelines-section {
-  &-main {
+export const GuideslinesContentStyled = styled.div`
+  .guidelines-section-main {
     display: flex;
     flex-direction: column;
     flex-wrap: nowrap;
     padding: 1.5rem;
 
-    @include laptop {
+    @media ${device.laptop} {
       flex-direction: row;
       padding: 0;
     }
   }
 
-  &__texts {
+  .guidelines-section__texts {
     flex-basis: 50%;
     display: flex;
     flex-direction: column;
@@ -26,7 +26,7 @@
     font-weight: 400;
     letter-spacing: -0.3px;
 
-    @include landscape-tablets {
+    @media ${device['landscape-tablets']} {
       margin-left: 3rem;
       margin-bottom: 0;
     }
@@ -41,7 +41,7 @@
       line-height: 42px;
       letter-spacing: -0.3px;
 
-      @include landscape-tablets {
+      @media ${device['landscape-tablets']} {
         text-align: left;
       }
     }
@@ -58,14 +58,14 @@
     }
   }
 
-  &__image {
+  .guidelines-section__image {
     flex-basis: 50%;
     margin-bottom: 2rem;
 
     &.big-devices {
       display: none;
 
-      @include landscape-tablets {
+      @media ${device['landscape-tablets']} {
         display: flex;
       }
     }
@@ -73,7 +73,7 @@
     &.is-mobile {
       display: none;
 
-      @include landscape-tablets {
+      @media ${device['landscape-tablets']} {
         display: none;
       }
 
@@ -83,13 +83,13 @@
     }
   }
 
-  &-detail {
+  .guidelines-section-detail {
     display: flex;
     flex-direction: column;
     gap: 1.5rem;
     margin: 2rem 0 1rem 0;
 
-    @include laptop {
+    @media ${device.laptop} {
       flex-direction: row;
     }
 
@@ -97,7 +97,7 @@
       display: flex;
       flex: 1;
       flex-direction: column;
-      background: get-color(others, white);
+      background: var(--others-white);
       border-radius: 0.5rem;
       padding: 1.5rem;
 
@@ -107,13 +107,13 @@
       }
 
       &__title {
-        font-family: $font-serif;
+        font-family: var(--font-serif);
         font-style: normal;
         font-weight: 400;
         font-size: 24px;
         line-height: 32px;
         letter-spacing: -0.3px;
-        color: get-color(neutral, neutral-1);
+        color: var(--neutral-neutral-1);
         margin: 1.5rem 0 1rem 0;
       }
 
@@ -136,4 +136,4 @@
       }
     }
   }
-}
+`

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

@@ -3,11 +3,11 @@ import React, { type FC } from 'react'
 
 import { RichTextInner, RichTextStrapi } from '../../atoms'
 import { type GuidelinesContentProps } from './GuidelinesContentProps.types'
-// import './GuidelinesContent.scss'
+import { GuideslinesContentStyled } from './GuidelinesContent.styled'
 
 const GuidelinesContent: FC<GuidelinesContentProps> = ({ title, image, detail, children }) => {
   return (
-    <>
+    <GuideslinesContentStyled>
       <div className='guidelines-section-main wrapper'>
         <div className='guidelines-section__image big-devices'>{image}</div>
         <div className='guidelines-section__texts'>
@@ -27,7 +27,7 @@ const GuidelinesContent: FC<GuidelinesContentProps> = ({ title, image, detail, c
           ))}
         </div>
       )}
-    </>
+    </GuideslinesContentStyled>
   )
 }
 

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

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { JumbotronRatafiaStyled } from './JumbotronRatafiaContent.styled';
 import { TagsRatafiaList } from '../../molecules';
-// import './JumbotronRatafiaContent.scss'
 const JumbotronRatafiaContent = ({ title, body, tags }) => {
-    return (_jsxs("div", { className: 'jumbotron-ratafia-content', children: [_jsx("div", { className: 'jumbotron-ratafia-content__title', children: title }), _jsx("span", { className: 'sans-serif --medium jumbotron-ratafia-content__description', itemProp: 'text', children: body }), _jsx(TagsRatafiaList, { tags: tags })] }));
+    return (_jsxs(JumbotronRatafiaStyled, { children: [_jsx("div", { className: 'jumbotron-ratafia-content__title', children: title }), _jsx("span", { className: 'sans-serif --medium jumbotron-ratafia-content__description', itemProp: 'text', children: body }), _jsx(TagsRatafiaList, { tags: tags })] }));
 };
 export default JumbotronRatafiaContent;

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

@@ -0,0 +1 @@
+export declare const JumbotronRatafiaStyled: 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/JumbotronRatafiaContent/JumbotronRatafiaContent.styled.js

@@ -0,0 +1,26 @@
+import styled from 'styled-components';
+export const JumbotronRatafiaStyled = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 1rem;
+
+  .jumbotron-ratafia-content__title {
+    &__text {
+      line-height: 2.25rem;
+      font-size: 2rem;
+      font-family: 'Inter', sans-serif;
+      color: var(--others-white);
+
+      &__icon {
+        padding: 0 0.6rem;
+        border-radius: 4px;
+        color: var(--primary-main-dark-2);
+        background: var(--secondary-main-light-2);
+      }
+    }
+  }
+  .jumbotron-ratafia-content__description {
+    color: var(--others-white);
+  }
+`;

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

@@ -1,13 +1,12 @@
-@import '../../../globalStyles/variables.scss';
-@import '../../../globalStyles/mediaqueries.scss';
+import styled from 'styled-components'
 
-.jumbotron-ratafia-content {
+export const JumbotronRatafiaStyled = styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 1rem;
 
-  &__title {
+  .jumbotron-ratafia-content__title {
     &__text {
       line-height: 2.25rem;
       font-size: 2rem;
@@ -18,11 +17,11 @@
         padding: 0 0.6rem;
         border-radius: 4px;
         color: var(--primary-main-dark-2);
-        background: get-color(secondary, main-light-2);
+        background: var(--secondary-main-light-2);
       }
     }
   }
-  &__description {
+  .jumbotron-ratafia-content__description {
     color: var(--others-white);
   }
-}
+`

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

@@ -1,18 +1,18 @@
 import React, { type FC } from 'react'
 
 import { type JumbotronRatafiaContentProps } from './JumbotronRatafiaContentProps.types'
+import { JumbotronRatafiaStyled } from './JumbotronRatafiaContent.styled'
 import { TagsRatafiaList } from '../../molecules'
-// import './JumbotronRatafiaContent.scss'
 
 const JumbotronRatafiaContent: FC<JumbotronRatafiaContentProps> = ({ title, body, tags }) => {
   return (
-    <div className='jumbotron-ratafia-content'>
+    <JumbotronRatafiaStyled>
       <div className='jumbotron-ratafia-content__title'>{title}</div>
       <span className='sans-serif --medium jumbotron-ratafia-content__description' itemProp='text'>
         {body}
       </span>
       <TagsRatafiaList tags={tags} />
-    </div>
+    </JumbotronRatafiaStyled>
   )
 }
 

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// import './KeyFactsLoadingContentRatafia.scss'
+import { KeyFactsLoadingContentRatafiaStyled } from './KeyFactsLoadingContentRatafia.styled';
 export const KeyFactsLoadingContentRatafia = ({ documentName, icon, text }) => {
-    return (_jsxs("div", { className: 'key-facts-loading-content', children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-loading-content__document-name', children: documentName }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper', children: [_jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-1', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-2', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-5' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-3', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-7' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-4', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-8' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] })] }), _jsxs("div", { className: 'key-facts-loading-content__message', children: [_jsx("div", { className: 'key-facts-loading-content__message__icon', children: icon }), _jsx("span", { className: 'sans-serif --medium key-facts-loading-content__message__text', children: text })] })] }));
+    return (_jsxs(KeyFactsLoadingContentRatafiaStyled, { children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-loading-content__document-name', children: documentName }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper', children: [_jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-1', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-2', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-5' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-3', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-7' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-4', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-8' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] })] }), _jsxs("div", { className: 'key-facts-loading-content__message', children: [_jsx("div", { className: 'key-facts-loading-content__message__icon', children: icon }), _jsx("span", { className: 'sans-serif --medium key-facts-loading-content__message__text', children: text })] })] }));
 };
 export default KeyFactsLoadingContentRatafia;

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

@@ -0,0 +1 @@
+export declare const KeyFactsLoadingContentRatafiaStyled: 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/KeyFactsLoadingContentRatafia/KeyFactsLoadingContentRatafia.styled.js

@@ -0,0 +1,144 @@
+import { device } from '../../../globalStyles/breakpoints';
+import styled from 'styled-components';
+export const KeyFactsLoadingContentRatafiaStyled = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  align-self: stretch;
+  gap: 1rem;
+
+  .key-facts-loading-content__document-name {
+    color: var(--neutral-neutral-2);
+    font-size: 1rem;
+    @media ${device['portrait-tablets']} {
+      font-size: 1.125rem;
+    }
+  }
+
+  .key-facts-loading-content__animation-wrapper {
+    height: calc(0.54 * 100vh);
+
+    align-self: stretch;
+
+    padding: 0 2rem 1.5rem 1.5rem;
+
+    overflow: hidden;
+
+    border-radius: 4px;
+    border-top: 4px solid var(--neutral-neutral-6);
+    border-bottom: 4px solid var(--neutral-neutral-6);
+    background: var(--neutral-neutral-6);
+
+    @media ${device['portrait-tablets']} {
+      height: 490px;
+    }
+
+    &__animation {
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+      justify-content: center;
+
+      gap: 0.8rem;
+
+      padding: 2rem 0;
+
+      border-bottom: 1px solid var(--neutral-neutral-4);
+      &__loader {
+        background: var(--neutral-neutral-4);
+        border-radius: 16px;
+      }
+      .item-1 {
+        height: 10px;
+        width: 45%;
+      }
+      .item-2 {
+        height: 7px;
+        width: 30%;
+      }
+      .item-3 {
+        height: 10px;
+        width: 25%;
+      }
+      .item-4 {
+        height: 7px;
+        width: 70%;
+      }
+      .item-5 {
+        height: 7px;
+        width: 55%;
+      }
+      .item-6 {
+        height: 7px;
+        width: 65%;
+      }
+      .item-7 {
+        height: 7px;
+        width: 90%;
+      }
+      .item-8 {
+        height: 7px;
+        width: 90%;
+      }
+    }
+    .animation-1 {
+      animation:
+        appear 4s ease-in-out 1,
+        fadeInOut 4s ease-in-out infinite 4s;
+    }
+    .animation-2 {
+      animation:
+        appear 5s ease-in-out 1,
+        fadeInOut 4s ease-in-out infinite 4s;
+    }
+    .animation-3 {
+      animation:
+        appear 6s ease-in-out 1,
+        fadeInOut 4s ease-in-out infinite 4s;
+    }
+    .animation-4 {
+      animation:
+        appear 6s ease-in-out 1,
+        fadeInOut 4s ease-in-out infinite 4s;
+    }
+  }
+
+  .key-facts-loading-content__message {
+    display: flex;
+    justify-content: start;
+    align-items: flex-start;
+    align-self: stretch;
+
+    padding: 1rem;
+    gap: 0.5rem;
+
+    border-radius: 4px;
+    background: var(--secondary-main-light-4);
+
+    &__icon img {
+      width: 24px;
+    }
+    &__text {
+      color: var(--neutral-neutral-1);
+    }
+  }
+
+  @keyframes fadeInOut {
+    0%,
+    100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.2;
+    }
+  }
+
+  @keyframes appear {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
+`;

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

@@ -1,23 +1,22 @@
-@import '../../../globalStyles/variables.scss';
-@import '../../../globalStyles/mediaqueries.scss';
+import { device } from '../../../globalStyles/breakpoints'
+import styled from 'styled-components'
 
-.key-facts-loading-content {
+export const KeyFactsLoadingContentRatafiaStyled = styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   align-self: stretch;
-
   gap: 1rem;
 
-  &__document-name {
+  .key-facts-loading-content__document-name {
     color: var(--neutral-neutral-2);
     font-size: 1rem;
-    @include portrait-tablets {
+    @media ${device['portrait-tablets']} {
       font-size: 1.125rem;
     }
   }
 
-  &__animation-wrapper {
+  .key-facts-loading-content__animation-wrapper {
     height: calc(0.54 * 100vh);
 
     align-self: stretch;
@@ -31,7 +30,7 @@
     border-bottom: 4px solid var(--neutral-neutral-6);
     background: var(--neutral-neutral-6);
 
-    @include portrait-tablets {
+    @media ${device['portrait-tablets']} {
       height: 490px;
     }
 
@@ -105,7 +104,7 @@
     }
   }
 
-  &__message {
+  .key-facts-loading-content__message {
     display: flex;
     justify-content: start;
     align-items: flex-start;
@@ -124,23 +123,23 @@
       color: var(--neutral-neutral-1);
     }
   }
-}
 
-@keyframes fadeInOut {
-  0%,
-  100% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.2;
+  @keyframes fadeInOut {
+    0%,
+    100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.2;
+    }
   }
-}
 
-@keyframes appear {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
+  @keyframes appear {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
   }
-}
+`

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

@@ -1,7 +1,7 @@
 import React from 'react'
 
 import { type KeyFactsLoadingContentRatafiaProps } from './KeyFactsLoadingContentRatafiaProps.types'
-// import './KeyFactsLoadingContentRatafia.scss'
+import { KeyFactsLoadingContentRatafiaStyled } from './KeyFactsLoadingContentRatafia.styled'
 
 export const KeyFactsLoadingContentRatafia: React.FC<KeyFactsLoadingContentRatafiaProps> = ({
   documentName,
@@ -9,7 +9,7 @@ export const KeyFactsLoadingContentRatafia: React.FC<KeyFactsLoadingContentRataf
   text
 }) => {
   return (
-    <div className='key-facts-loading-content'>
+    <KeyFactsLoadingContentRatafiaStyled>
       <h2 className='sans-serif --bold-weight key-facts-loading-content__document-name'>{documentName}</h2>
       <div className='key-facts-loading-content__animation-wrapper'>
         <div className='key-facts-loading-content__animation-wrapper__animation animation-1'>
@@ -39,7 +39,7 @@ export const KeyFactsLoadingContentRatafia: React.FC<KeyFactsLoadingContentRataf
         <div className='key-facts-loading-content__message__icon'>{icon}</div>
         <span className='sans-serif --medium key-facts-loading-content__message__text'>{text}</span>
       </div>
-    </div>
+    </KeyFactsLoadingContentRatafiaStyled>
   )
 }
 

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

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { KeyFactCardListRatafia } from '../../molecules';
+import { KeyFactsResultContentRatafiaStyled } from './KeyFactsResultContentRatafia.styled';
 import { ReviewKeyFactsResultRatafia } from '../../atoms';
-// import './KeyFactsResultContentRatafia.scss'
 export const KeyFactsResultContentRatafia = ({ result, review }) => {
-    return (_jsxs("div", { className: 'key-facts-result-content', children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-result-content__document-name', children: result?.documentName }), _jsxs("div", { className: 'key-facts-result-content__content', children: [result !== null && _jsx(KeyFactCardListRatafia, { keyFacts: result.keyFacts }), _jsx(ReviewKeyFactsResultRatafia, { ...review })] })] }));
+    return (_jsxs(KeyFactsResultContentRatafiaStyled, { children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-result-content__document-name', children: result?.documentName }), _jsxs("div", { className: 'key-facts-result-content__content', children: [result !== null && _jsx(KeyFactCardListRatafia, { keyFacts: result.keyFacts }), _jsx(ReviewKeyFactsResultRatafia, { ...review })] })] }));
 };
 export default KeyFactsResultContentRatafia;

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

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