@npm_leadtech/legal-lib-components 5.40.0 → 5.40.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/dist/images/svg/jumbo-bckground-l.svg +20 -0
  2. package/dist/images/svg/jumbo-bckground-m.svg +15 -0
  3. package/dist/images/svg/jumbo-bckground-xxl.svg +20 -0
  4. package/dist/src/components/atoms/TagRatafiaItem/TagRatafiaItem.js +1 -1
  5. package/dist/src/components/atoms/TagRatafiaItem/TagRatafiaItem.tsx +1 -1
  6. package/dist/src/components/organisms/FaqGroup/FaqGroup.styled.js +5 -0
  7. package/dist/src/components/organisms/FaqGroup/FaqGroup.styled.ts +5 -0
  8. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.js +1 -1
  9. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.styled.js +25 -0
  10. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.styled.ts +25 -0
  11. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.tsx +2 -2
  12. package/dist/src/components/pages/EsignatureLandingPage/EsignatureLandingPage.js +4 -4
  13. package/dist/src/components/pages/EsignatureLandingPage/EsignatureLandingPage.tsx +16 -8
  14. package/dist/src/components/pages/EsignatureLandingPage/EsignatureLandingPageProps.types.d.ts +4 -4
  15. package/dist/src/components/pages/EsignatureLandingPage/EsignatureLandingPageProps.types.ts +4 -4
  16. package/dist/src/components/sections/JumbotronRatafiaSection/JumbotronRatafiaSection.js +3 -6
  17. package/dist/src/components/sections/JumbotronRatafiaSection/JumbotronRatafiaSection.styled.js +6 -3
  18. package/dist/src/components/sections/JumbotronRatafiaSection/JumbotronRatafiaSection.styled.ts +6 -3
  19. package/dist/src/components/sections/JumbotronRatafiaSection/JumbotronRatafiaSection.tsx +3 -14
  20. package/dist/src/components/sections/JumbotronRatafiaSection/JumbotronRatafiaSectionProps.types.d.ts +2 -2
  21. package/dist/src/components/sections/JumbotronRatafiaSection/JumbotronRatafiaSectionProps.types.ts +2 -2
  22. package/package.json +1 -1
  23. package/dist/images/svg/back-element-sign-01.svg +0 -9
  24. package/dist/images/svg/back-element-sign-02.svg +0 -9
  25. package/dist/images/svg/back-element-sign-03.svg +0 -9
@@ -0,0 +1,20 @@
1
+ <svg width="1024" height="504" viewBox="0 0 1024 504" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_8073_6075)">
3
+ <rect width="1024" height="504" fill="#F3F7FA"/>
4
+ <path d="M1084 571C1084 584.807 1072.81 596 1059 596C1045.19 596 1034 584.807 1034 571H1084ZM895 67V98.5H845V67H895ZM964.5 168H996V218H964.5V168ZM996 344H933V294H996V344ZM933 420H964.5V470H933V420ZM1084 539.5V571H1034V539.5H1084ZM964.5 420C1030.5 420 1084 473.502 1084 539.5H1034C1034 501.116 1002.88 470 964.5 470V420ZM895 382C895 402.987 912.013 420 933 420V470C884.399 470 845 430.601 845 382L895 382ZM933 344C912.013 344 895 361.013 895 382L845 382C845 333.399 884.399 294 933 294V344ZM1084 256C1084 304.601 1044.6 344 996 344V294C1016.99 294 1034 276.987 1034 256H1084ZM996 168C1044.6 168 1084 207.399 1084 256H1034C1034 235.013 1016.99 218 996 218V168ZM895 98.5C895 136.884 926.116 168 964.5 168V218C898.502 218 845 164.498 845 98.5H895Z" fill="url(#paint0_linear_8073_6075)"/>
5
+ <path d="M-303.778 310.488C-311.456 321.964 -308.378 337.491 -296.902 345.169C-285.427 352.847 -269.9 349.769 -262.222 338.293L-303.778 310.488ZM120.481 13.2684L102.498 40.1453L144.053 67.9503L162.037 41.0734L120.481 13.2684ZM7.24905 59.0281L-18.2343 41.9772L-46.0394 83.5329L-20.556 100.584L7.24905 59.0281ZM-116.108 188.253L-65.1414 222.355L-37.3364 180.8L-88.3031 146.698L-116.108 188.253ZM-107.405 285.52L-132.888 268.469L-160.693 310.025L-135.21 327.076L-107.405 285.52ZM-297.498 301.103L-303.778 310.488L-262.222 338.293L-255.942 328.908L-297.498 301.103ZM-132.888 268.469C-187.356 232.025 -261.054 246.635 -297.498 301.103L-255.942 328.908C-234.854 297.391 -192.21 288.937 -160.693 310.025L-132.888 268.469ZM-135.21 327.076C-94.8171 354.103 -40.1623 343.268 -13.1351 302.875L-54.6909 275.069C-66.3617 292.512 -89.9626 297.191 -107.405 285.52L-135.21 327.076ZM-65.1414 222.355C-47.699 234.026 -43.0201 257.627 -54.6909 275.069L-13.1351 302.875C13.892 262.481 3.05668 207.827 -37.3364 180.8L-65.1414 222.355ZM-140.309 66.1783C-167.336 106.571 -156.501 161.226 -116.108 188.253L-88.3031 146.698C-105.746 135.027 -110.424 111.426 -98.7536 93.9834L-140.309 66.1783ZM-18.2343 41.9772C-58.6273 14.9501 -113.282 25.7853 -140.309 66.1783L-98.7536 93.9834C-87.0828 76.5409 -63.4818 71.8621 -46.0394 83.5329L-18.2343 41.9772ZM102.498 40.1453C81.4098 71.6618 38.7656 80.1159 7.24905 59.0281L-20.556 100.584C33.9111 137.028 107.609 122.417 144.053 67.9503L102.498 40.1453Z" fill="url(#paint1_linear_8073_6075)"/>
6
+ </g>
7
+ <defs>
8
+ <linearGradient id="paint0_linear_8073_6075" x1="964.5" y1="570.911" x2="964.5" y2="67.0001" gradientUnits="userSpaceOnUse">
9
+ <stop stop-color="#02374A" stop-opacity="0.2"/>
10
+ <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
11
+ </linearGradient>
12
+ <linearGradient id="paint1_linear_8073_6075" x1="-216.81" y1="393.894" x2="63.4148" y2="-24.9138" gradientUnits="userSpaceOnUse">
13
+ <stop stop-color="#02374A" stop-opacity="0.2"/>
14
+ <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
15
+ </linearGradient>
16
+ <clipPath id="clip0_8073_6075">
17
+ <rect width="1024" height="504" fill="white"/>
18
+ </clipPath>
19
+ </defs>
20
+ </svg>
@@ -0,0 +1,15 @@
1
+ <svg width="768" height="464" viewBox="0 0 768 464" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_8073_6076)">
3
+ <rect width="768" height="464" fill="#F3F7FA"/>
4
+ <path d="M832 539C832 552.807 820.807 564 807 564C793.193 564 782 552.807 782 539H832ZM643 35V66.5H593V35H643ZM712.5 136H744V186H712.5V136ZM744 312H681V262H744V312ZM681 388H712.5V438H681V388ZM832 507.5V539H782V507.5H832ZM712.5 388C778.498 388 832 441.502 832 507.5H782C782 469.116 750.884 438 712.5 438V388ZM643 350C643 370.987 660.013 388 681 388V438C632.399 438 593 398.601 593 350L643 350ZM681 312C660.013 312 643 329.013 643 350L593 350C593 301.399 632.399 262 681 262V312ZM832 224C832 272.601 792.601 312 744 312V262C764.987 262 782 244.987 782 224H832ZM744 136C792.601 136 832 175.399 832 224H782C782 203.013 764.987 186 744 186V136ZM643 66.5C643 104.884 674.116 136 712.5 136V186C646.502 186 593 132.498 593 66.5H643Z" fill="url(#paint0_linear_8073_6076)"/>
5
+ </g>
6
+ <defs>
7
+ <linearGradient id="paint0_linear_8073_6076" x1="712.5" y1="538.911" x2="712.5" y2="35.0001" gradientUnits="userSpaceOnUse">
8
+ <stop stop-color="#02374A" stop-opacity="0.2"/>
9
+ <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
10
+ </linearGradient>
11
+ <clipPath id="clip0_8073_6076">
12
+ <rect width="768" height="464" fill="white"/>
13
+ </clipPath>
14
+ </defs>
15
+ </svg>
@@ -0,0 +1,20 @@
1
+ <svg width="1440" height="504" viewBox="0 0 1440 504" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_8073_6040)">
3
+ <rect width="1440" height="504" fill="#F3F7FA"/>
4
+ <path d="M1423 575C1423 588.807 1411.81 600 1398 600C1384.19 600 1373 588.807 1373 575H1423ZM1234 71V102.5H1184V71H1234ZM1303.5 172H1335V222H1303.5V172ZM1335 348H1272V298H1335V348ZM1272 424H1303.5V474H1272V424ZM1423 543.5V575H1373V543.5H1423ZM1303.5 424C1369.5 424 1423 477.502 1423 543.5H1373C1373 505.116 1341.88 474 1303.5 474V424ZM1234 386C1234 406.987 1251.01 424 1272 424V474C1223.4 474 1184 434.601 1184 386L1234 386ZM1272 348C1251.01 348 1234 365.013 1234 386L1184 386C1184 337.399 1223.4 298 1272 298V348ZM1423 260C1423 308.601 1383.6 348 1335 348V298C1355.99 298 1373 280.987 1373 260H1423ZM1335 172C1383.6 172 1423 211.399 1423 260H1373C1373 239.013 1355.99 222 1335 222V172ZM1234 102.5C1234 140.884 1265.12 172 1303.5 172V222C1237.5 222 1184 168.498 1184 102.5H1234Z" fill="url(#paint0_linear_8073_6040)"/>
5
+ <path d="M-217.15 307.813C-224.828 319.288 -221.75 334.815 -210.274 342.493C-198.799 350.171 -183.272 347.093 -175.594 335.618L-217.15 307.813ZM208.503 11.5252L190.986 37.7053L232.541 65.5104L250.058 39.3303L208.503 11.5252ZM94.574 56.8188L68.3939 39.3016L40.5888 80.8573L66.769 98.3745L94.574 56.8188ZM-29.4799 185.578L22.8803 220.612L50.6854 179.056L-1.67484 144.022L-29.4799 185.578ZM-19.3833 283.777L-45.5635 266.26L-73.3685 307.815L-47.1884 325.333L-19.3833 283.777ZM-211.336 299.124L-217.15 307.813L-175.594 335.618L-169.78 326.929L-211.336 299.124ZM-45.5635 266.26C-100.415 229.558 -174.634 244.272 -211.336 299.124L-169.78 326.929C-148.435 295.027 -105.27 286.47 -73.3685 307.815L-45.5635 266.26ZM-47.1884 325.333C-6.79535 352.36 47.8595 341.524 74.8866 301.131L33.3308 273.326C21.6601 290.769 -1.9409 295.448 -19.3833 283.777L-47.1884 325.333ZM22.8803 220.612C40.3228 232.283 45.0016 255.884 33.3308 273.326L74.8866 301.131C101.914 260.738 91.0784 206.083 50.6854 179.056L22.8803 220.612ZM-53.6811 63.5028C-80.7082 103.896 -69.8729 158.551 -29.4799 185.578L-1.67484 144.022C-19.1173 132.351 -23.7961 108.75 -12.1254 91.3078L-53.6811 63.5028ZM68.3939 39.3016C28.0008 12.2745 -26.654 23.1097 -53.6811 63.5028L-12.1254 91.3078C-0.454562 73.8654 23.1464 69.1865 40.5888 80.8573L68.3939 39.3016ZM190.986 37.7053C169.64 69.6066 126.475 78.164 94.574 56.8188L66.769 98.3745C121.621 135.076 195.84 120.362 232.541 65.5104L190.986 37.7053Z" fill="url(#paint1_linear_8073_6040)"/>
6
+ </g>
7
+ <defs>
8
+ <linearGradient id="paint0_linear_8073_6040" x1="1303.5" y1="574.911" x2="1303.5" y2="71.0001" gradientUnits="userSpaceOnUse">
9
+ <stop stop-color="#02374A" stop-opacity="0.2"/>
10
+ <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
11
+ </linearGradient>
12
+ <linearGradient id="paint1_linear_8073_6040" x1="-129.485" y1="391.684" x2="150.74" y2="-27.1231" gradientUnits="userSpaceOnUse">
13
+ <stop stop-color="#02374A" stop-opacity="0.2"/>
14
+ <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
15
+ </linearGradient>
16
+ <clipPath id="clip0_8073_6040">
17
+ <rect width="1440" height="504" fill="white"/>
18
+ </clipPath>
19
+ </defs>
20
+ </svg>
@@ -6,6 +6,6 @@ export const TagRatafiaItem = ({ icon, description, type = 'ratafia' }) => {
6
6
  ratafia: 'tag-ratafia-item'
7
7
  };
8
8
  const styleClasses = typeClasses[type];
9
- return (_jsxs(TagRatafiaItemStyled, { className: styleClasses, children: [icon !== null && _jsx("div", { className: `${styleClasses}__icon'`, children: icon }), _jsx("span", { className: `sans-serif --small ${styleClasses}__description`, itemProp: 'text', children: description })] }));
9
+ return (_jsxs(TagRatafiaItemStyled, { className: styleClasses, children: [icon !== null && _jsx("div", { className: `tag-ratafia-item__icon'`, children: icon }), _jsx("span", { className: `sans-serif --small ${styleClasses}__description`, itemProp: 'text', children: description })] }));
10
10
  };
11
11
  export default TagRatafiaItem;
@@ -13,7 +13,7 @@ export const TagRatafiaItem: React.FC<TagRatafiaItemProps> = ({ icon, descriptio
13
13
 
14
14
  return (
15
15
  <TagRatafiaItemStyled className={styleClasses}>
16
- {icon !== null && <div className={`${styleClasses}__icon'`}>{icon}</div>}
16
+ {icon !== null && <div className={`tag-ratafia-item__icon'`}>{icon}</div>}
17
17
  <span className={`sans-serif --small ${styleClasses}__description`} itemProp='text'>
18
18
  {description}
19
19
  </span>
@@ -5,6 +5,11 @@ export const FaqGroupStyled = styled.div `
5
5
  align-items: flex-start;
6
6
  gap: 32px;
7
7
 
8
+ &#faq-esignature-ratafia {
9
+ margin: auto;
10
+ width: 100%;
11
+ }
12
+
8
13
  .title {
9
14
  color: var(--neutral-neutral-1);
10
15
  font-size: 28px;
@@ -6,6 +6,11 @@ export const FaqGroupStyled = styled.div`
6
6
  align-items: flex-start;
7
7
  gap: 32px;
8
8
 
9
+ &#faq-esignature-ratafia {
10
+ margin: auto;
11
+ width: 100%;
12
+ }
13
+
9
14
  .title {
10
15
  color: var(--neutral-neutral-1);
11
16
  font-size: 28px;
@@ -2,6 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { JumbotronRatafiaStyled } from './JumbotronRatafiaContent.styled';
3
3
  import { TagsRatafiaList } from '../../molecules';
4
4
  const JumbotronRatafiaContent = ({ title, body, tags, type }) => {
5
- 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, type: type })] }));
5
+ return (_jsxs(JumbotronRatafiaStyled, { children: [_jsx("div", { className: `jumbotron-${type}-content__title`, children: title }), _jsx("span", { className: `sans-serif --medium jumbotron-${type}-content__description`, itemProp: 'text', children: body }), _jsx(TagsRatafiaList, { tags: tags, type: type })] }));
6
6
  };
7
7
  export default JumbotronRatafiaContent;
@@ -23,4 +23,29 @@ export const JumbotronRatafiaStyled = styled.div `
23
23
  .jumbotron-ratafia-content__description {
24
24
  color: var(--others-white);
25
25
  }
26
+
27
+ .jumbotron-esignature-content__title {
28
+ h1 {
29
+ color: var(--primary-main-dark-2);
30
+ }
31
+
32
+ &__text {
33
+ line-height: 2.25rem;
34
+ font-size: 2rem;
35
+ font-family: 'Inter', sans-serif;
36
+ color: var(--primary-main-dark-2);
37
+ font-weight: 700;
38
+ letter-spacing: 0.3rem;
39
+
40
+ &__icon {
41
+ padding: 0 0.6rem;
42
+ border-radius: 4px;
43
+ color: var(--primary-main-dark-2);
44
+ background: var(--secondary-main-light-2);
45
+ }
46
+ }
47
+ }
48
+ .jumbotron-esignature-content__description {
49
+ color: var(--neutral-neutral-1);
50
+ }
26
51
  `;
@@ -24,4 +24,29 @@ export const JumbotronRatafiaStyled = styled.div`
24
24
  .jumbotron-ratafia-content__description {
25
25
  color: var(--others-white);
26
26
  }
27
+
28
+ .jumbotron-esignature-content__title {
29
+ h1 {
30
+ color: var(--primary-main-dark-2);
31
+ }
32
+
33
+ &__text {
34
+ line-height: 2.25rem;
35
+ font-size: 2rem;
36
+ font-family: 'Inter', sans-serif;
37
+ color: var(--primary-main-dark-2);
38
+ font-weight: 700;
39
+ letter-spacing: 0.3rem;
40
+
41
+ &__icon {
42
+ padding: 0 0.6rem;
43
+ border-radius: 4px;
44
+ color: var(--primary-main-dark-2);
45
+ background: var(--secondary-main-light-2);
46
+ }
47
+ }
48
+ }
49
+ .jumbotron-esignature-content__description {
50
+ color: var(--neutral-neutral-1);
51
+ }
27
52
  `
@@ -7,8 +7,8 @@ import { TagsRatafiaList } from '../../molecules'
7
7
  const JumbotronRatafiaContent: FC<JumbotronRatafiaContentProps> = ({ title, body, tags, type }) => {
8
8
  return (
9
9
  <JumbotronRatafiaStyled>
10
- <div className='jumbotron-ratafia-content__title'>{title}</div>
11
- <span className='sans-serif --medium jumbotron-ratafia-content__description' itemProp='text'>
10
+ <div className={`jumbotron-${type}-content__title`}>{title}</div>
11
+ <span className={`sans-serif --medium jumbotron-${type}-content__description`} itemProp='text'>
12
12
  {body}
13
13
  </span>
14
14
  <TagsRatafiaList tags={tags} type={type} />
@@ -1,5 +1,5 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { JumbotronRatafiaSection } from '../../sections';
3
- export const EsignatureLandingPage = ({ jumbotronEsignatureSectionProps }) => {
4
- return (_jsx(JumbotronRatafiaSection, { content: jumbotronEsignatureSectionProps.content, alternativeStyles: jumbotronEsignatureSectionProps.alternativeStyles, children: jumbotronEsignatureSectionProps.children }));
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { FaqSection, JumbotronRatafiaSection } from '../../sections';
3
+ export const EsignatureLandingPage = ({ jumbotronSectionProps, trustPilotBox, faqGroupProps }) => {
4
+ return (_jsxs(_Fragment, { children: [_jsx(JumbotronRatafiaSection, { content: jumbotronSectionProps.content, alternativeStyles: jumbotronSectionProps.alternativeStyles, children: jumbotronSectionProps.children }), trustPilotBox ?? trustPilotBox, _jsx(FaqSection, { groups: faqGroupProps, givenClass: 'faq-ratafia-section' })] }));
5
5
  };
@@ -1,15 +1,23 @@
1
1
  import React from 'react'
2
2
 
3
+ import { FaqSection, JumbotronRatafiaSection } from '../../sections'
3
4
  import { type EsignatureLandingPageProps } from './EsignatureLandingPageProps.types'
4
- import { JumbotronRatafiaSection } from '../../sections'
5
5
 
6
- export const EsignatureLandingPage: React.FC<EsignatureLandingPageProps> = ({ jumbotronEsignatureSectionProps }) => {
6
+ export const EsignatureLandingPage: React.FC<EsignatureLandingPageProps> = ({
7
+ jumbotronSectionProps,
8
+ trustPilotBox,
9
+ faqGroupProps
10
+ }) => {
7
11
  return (
8
- <JumbotronRatafiaSection
9
- content={jumbotronEsignatureSectionProps.content}
10
- alternativeStyles={jumbotronEsignatureSectionProps.alternativeStyles}
11
- >
12
- {jumbotronEsignatureSectionProps.children}
13
- </JumbotronRatafiaSection>
12
+ <>
13
+ <JumbotronRatafiaSection
14
+ content={jumbotronSectionProps.content}
15
+ alternativeStyles={jumbotronSectionProps.alternativeStyles}
16
+ >
17
+ {jumbotronSectionProps.children}
18
+ </JumbotronRatafiaSection>
19
+ {trustPilotBox ?? trustPilotBox}
20
+ <FaqSection groups={faqGroupProps} givenClass='faq-ratafia-section' />
21
+ </>
14
22
  )
15
23
  }
@@ -1,7 +1,7 @@
1
- import { JumbotronEsignatureContentProps } from '../../organisms';
1
+ import type { FaqGroupProps } from '../../organisms';
2
2
  import { JumbotronRatafiaSectionProps } from '../../sections';
3
3
  export interface EsignatureLandingPageProps {
4
- jumbotronEsignatureSectionProps: Omit<JumbotronRatafiaSectionProps, 'content'> & {
5
- content: JumbotronEsignatureContentProps;
6
- };
4
+ jumbotronSectionProps: JumbotronRatafiaSectionProps;
5
+ faqGroupProps: FaqGroupProps[];
6
+ trustPilotBox?: React.ReactNode;
7
7
  }
@@ -1,8 +1,8 @@
1
- import { JumbotronEsignatureContentProps } from '../../organisms'
1
+ import type { FaqGroupProps } from '../../organisms'
2
2
  import { JumbotronRatafiaSectionProps } from '../../sections'
3
3
 
4
4
  export interface EsignatureLandingPageProps {
5
- jumbotronEsignatureSectionProps: Omit<JumbotronRatafiaSectionProps, 'content'> & {
6
- content: JumbotronEsignatureContentProps
7
- }
5
+ jumbotronSectionProps: JumbotronRatafiaSectionProps
6
+ faqGroupProps: FaqGroupProps[]
7
+ trustPilotBox?: React.ReactNode
8
8
  }
@@ -1,25 +1,22 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { JumbotronEsignatureContent } from '../../organisms/JumbotronEsignatureContent';
3
2
  import { JumbotronRatafiaContent } from '../../organisms/JumbotronRatafiaContent';
4
3
  import { JumbotronRatafiaSectionStyled } from './JumbotronRatafiaSection.styled';
5
4
  const styleConfigMap = {
6
5
  ratafia: {
7
6
  backgroundClass: 'background-ratafia-animation',
8
7
  id: 'ratafia-jumbotron',
9
- type: 'ratafia',
10
- ContentComponent: JumbotronRatafiaContent
8
+ type: 'ratafia'
11
9
  },
12
10
  esignature: {
13
11
  backgroundClass: 'background-esignature',
14
12
  id: 'esignature-jumbotron',
15
- type: 'esignature',
16
- ContentComponent: JumbotronEsignatureContent
13
+ type: 'esignature'
17
14
  }
18
15
  };
19
16
  const JumbotronRatafiaSection = ({ content, children, alternativeStyles }) => {
20
17
  const styleConfig = styleConfigMap[alternativeStyles ?? 'ratafia'];
21
18
  const sectionClassName = `jumbotron-ratafia-section ${styleConfig.backgroundClass}`;
22
19
  const sectionId = styleConfig.id;
23
- return (_jsx(JumbotronRatafiaSectionStyled, { className: sectionClassName, id: sectionId, children: _jsxs("div", { className: 'jumbotron-ratafia-section__wrapper', children: [_jsx(styleConfig.ContentComponent, { title: content.title, tags: content.tags, body: content.body, type: styleConfig.type }), _jsx("span", { className: 'jumbotron-ratafia-section__wrapper__children', children: children })] }) }));
20
+ return (_jsx(JumbotronRatafiaSectionStyled, { className: sectionClassName, id: sectionId, children: _jsxs("div", { className: 'jumbotron-ratafia-section__wrapper', children: [_jsx(JumbotronRatafiaContent, { title: content.title, tags: content.tags, body: content.body, type: styleConfig.type }), _jsx("span", { className: 'jumbotron-ratafia-section__wrapper__children', children: children })] }) }));
24
21
  };
25
22
  export default JumbotronRatafiaSection;
@@ -1,3 +1,6 @@
1
+ import backElementSign01 from '../../../../images/svg/jumbo-bckground-m.svg';
2
+ import backElementSign02 from '../../../../images/svg/jumbo-bckground-l.svg';
3
+ import backElementSign03 from '../../../../images/svg/jumbo-bckground-xxl.svg';
1
4
  import { device } from '../../../globalStyles/breakpoints';
2
5
  import styled from 'styled-components';
3
6
  export const JumbotronRatafiaSectionStyled = styled.section `
@@ -16,20 +19,20 @@ export const JumbotronRatafiaSectionStyled = styled.section `
16
19
 
17
20
  &.background-esignature {
18
21
  background-color: #f3f7fa;
19
- background-image: url('../../../../images/svg/back-element-sign-01.svg');
22
+ background-image: url(${backElementSign01});
20
23
  background-size: cover;
21
24
  background-position: center;
22
25
  background-repeat: no-repeat;
23
26
 
24
27
  @media ${device['landscape-tablets']} {
25
- background-image: url('../../../../images/svg/back-element-sign-02.svg');
28
+ background-image: url(${backElementSign02});
26
29
  background-size: cover, cover;
27
30
  background-position: center, center;
28
31
  background-repeat: no-repeat, no-repeat;
29
32
  }
30
33
 
31
34
  @media ${device['desktop-xl']} {
32
- background-image: url('../../../../images/svg/back-element-sign-03.svg');
35
+ background-image: url(${backElementSign03});
33
36
  }
34
37
  }
35
38
 
@@ -1,3 +1,6 @@
1
+ import backElementSign01 from '../../../../images/svg/jumbo-bckground-m.svg'
2
+ import backElementSign02 from '../../../../images/svg/jumbo-bckground-l.svg'
3
+ import backElementSign03 from '../../../../images/svg/jumbo-bckground-xxl.svg'
1
4
  import { device } from '../../../globalStyles/breakpoints'
2
5
  import styled from 'styled-components'
3
6
 
@@ -17,20 +20,20 @@ export const JumbotronRatafiaSectionStyled = styled.section`
17
20
 
18
21
  &.background-esignature {
19
22
  background-color: #f3f7fa;
20
- background-image: url('../../../../images/svg/back-element-sign-01.svg');
23
+ background-image: url(${backElementSign01});
21
24
  background-size: cover;
22
25
  background-position: center;
23
26
  background-repeat: no-repeat;
24
27
 
25
28
  @media ${device['landscape-tablets']} {
26
- background-image: url('../../../../images/svg/back-element-sign-02.svg');
29
+ background-image: url(${backElementSign02});
27
30
  background-size: cover, cover;
28
31
  background-position: center, center;
29
32
  background-repeat: no-repeat, no-repeat;
30
33
  }
31
34
 
32
35
  @media ${device['desktop-xl']} {
33
- background-image: url('../../../../images/svg/back-element-sign-03.svg');
36
+ background-image: url(${backElementSign03});
34
37
  }
35
38
  }
36
39
 
@@ -1,36 +1,25 @@
1
1
  import React, { type FC } from 'react'
2
2
 
3
- import { JumbotronEsignatureContent } from '../../organisms/JumbotronEsignatureContent'
4
3
  import { JumbotronRatafiaContent } from '../../organisms/JumbotronRatafiaContent'
5
4
  import { type JumbotronRatafiaSectionProps } from './JumbotronRatafiaSectionProps.types'
6
5
  import { JumbotronRatafiaSectionStyled } from './JumbotronRatafiaSection.styled'
7
- import { type TagRatafiaItemProps } from '../../atoms'
8
6
 
9
- interface JumbotronContent {
10
- title: React.ReactNode | string
11
- body: React.ReactNode
12
- tags: TagRatafiaItemProps[]
13
- type: string
14
- }
15
7
  interface StyleConfig {
16
8
  backgroundClass: string
17
9
  id: string
18
10
  type: string
19
- ContentComponent: React.ComponentType<JumbotronContent>
20
11
  }
21
12
 
22
13
  const styleConfigMap: Record<string, StyleConfig> = {
23
14
  ratafia: {
24
15
  backgroundClass: 'background-ratafia-animation',
25
16
  id: 'ratafia-jumbotron',
26
- type: 'ratafia',
27
- ContentComponent: JumbotronRatafiaContent
17
+ type: 'ratafia'
28
18
  },
29
19
  esignature: {
30
20
  backgroundClass: 'background-esignature',
31
21
  id: 'esignature-jumbotron',
32
- type: 'esignature',
33
- ContentComponent: JumbotronEsignatureContent
22
+ type: 'esignature'
34
23
  }
35
24
  }
36
25
 
@@ -43,7 +32,7 @@ const JumbotronRatafiaSection: FC<JumbotronRatafiaSectionProps> = ({ content, ch
43
32
  return (
44
33
  <JumbotronRatafiaSectionStyled className={sectionClassName} id={sectionId}>
45
34
  <div className='jumbotron-ratafia-section__wrapper'>
46
- <styleConfig.ContentComponent
35
+ <JumbotronRatafiaContent
47
36
  title={content.title}
48
37
  tags={content.tags}
49
38
  body={content.body}
@@ -1,6 +1,6 @@
1
- import { type JumbotronEsignatureContentProps, type JumbotronRatafiaContentProps } from '../../organisms';
1
+ import { type JumbotronRatafiaContentProps } from '../../organisms';
2
2
  export interface JumbotronRatafiaSectionProps {
3
- content: JumbotronRatafiaContentProps | JumbotronEsignatureContentProps;
3
+ content: JumbotronRatafiaContentProps;
4
4
  children?: React.ReactNode;
5
5
  alternativeStyles?: string;
6
6
  }
@@ -1,7 +1,7 @@
1
- import { type JumbotronEsignatureContentProps, type JumbotronRatafiaContentProps } from '../../organisms'
1
+ import { type JumbotronRatafiaContentProps } from '../../organisms'
2
2
 
3
3
  export interface JumbotronRatafiaSectionProps {
4
- content: JumbotronRatafiaContentProps | JumbotronEsignatureContentProps
4
+ content: JumbotronRatafiaContentProps
5
5
  children?: React.ReactNode
6
6
  alternativeStyles?: string
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-lib-components",
3
- "version": "5.40.0",
3
+ "version": "5.40.1",
4
4
  "license": "ISC",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -1,9 +0,0 @@
1
- <svg width="239" height="433" viewBox="0 0 239 433" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M239 504C239 517.807 227.807 529 214 529C200.193 529 189 517.807 189 504H239ZM50 3.00407e-05V31.5H1.49012e-06V3.00407e-05H50ZM119.5 101H151V151H119.5V101ZM151 277H88V227H151V277ZM88 353H119.5V403H88V353ZM239 472.5V504H189V472.5H239ZM119.5 353C185.498 353 239 406.502 239 472.5H189C189 434.116 157.884 403 119.5 403V353ZM50 315C50 335.987 67.0132 353 88 353V403C39.3989 403 1.49012e-06 363.601 1.49012e-06 315H50ZM88 277C67.0132 277 50 294.013 50 315H1.49012e-06C1.49012e-06 266.399 39.3989 227 88 227V277ZM239 189C239 237.601 199.601 277 151 277V227C171.987 227 189 209.987 189 189H239ZM151 101C199.601 101 239 140.399 239 189H189C189 168.013 171.987 151 151 151V101ZM50 31.5C50 69.8838 81.1162 101 119.5 101V151C53.502 151 1.49012e-06 97.498 1.49012e-06 31.5H50Z" fill="url(#paint0_linear_7620_13777)"/>
3
- <defs>
4
- <linearGradient id="paint0_linear_7620_13777" x1="119.5" y1="503.911" x2="119.5" y2="0.000116057" gradientUnits="userSpaceOnUse">
5
- <stop stop-color="#02374A" stop-opacity="0.2"/>
6
- <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
7
- </linearGradient>
8
- </defs>
9
- </svg>
@@ -1,9 +0,0 @@
1
- <svg width="251" height="336" viewBox="0 0 251 336" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M-217.15 296.813C-224.828 308.288 -221.75 323.815 -210.274 331.493C-198.799 339.171 -183.272 336.093 -175.594 324.618L-217.15 296.813ZM208.503 0.525201L190.986 26.7053L232.541 54.5104L250.058 28.3303L208.503 0.525201ZM94.574 45.8188L68.3939 28.3016L40.5888 69.8573L66.769 87.3745L94.574 45.8188ZM-29.4799 174.578L22.8803 209.612L50.6854 168.056L-1.67484 133.022L-29.4799 174.578ZM-19.3833 272.777L-45.5635 255.26L-73.3685 296.815L-47.1884 314.333L-19.3833 272.777ZM-211.336 288.124L-217.15 296.813L-175.594 324.618L-169.78 315.929L-211.336 288.124ZM-45.5635 255.26C-100.415 218.558 -174.634 233.272 -211.336 288.124L-169.78 315.929C-148.435 284.027 -105.27 275.47 -73.3685 296.815L-45.5635 255.26ZM-47.1884 314.333C-6.79535 341.36 47.8595 330.524 74.8866 290.131L33.3308 262.326C21.6601 279.769 -1.94089 284.448 -19.3833 272.777L-47.1884 314.333ZM22.8803 209.612C40.3228 221.283 45.0016 244.884 33.3308 262.326L74.8866 290.131C101.914 249.738 91.0784 195.083 50.6854 168.056L22.8803 209.612ZM-53.6811 52.5028C-80.7082 92.8958 -69.8729 147.551 -29.4799 174.578L-1.67484 133.022C-19.1173 121.351 -23.7961 97.7503 -12.1254 80.3078L-53.6811 52.5028ZM68.3939 28.3016C28.0008 1.27448 -26.654 12.1097 -53.6811 52.5028L-12.1254 80.3078C-0.454564 62.8654 23.1464 58.1865 40.5888 69.8573L68.3939 28.3016ZM190.986 26.7053C169.64 58.6066 126.475 67.164 94.574 45.8188L66.769 87.3745C121.621 124.076 195.84 109.362 232.541 54.5104L190.986 26.7053Z" fill="url(#paint0_linear_7620_15366)"/>
3
- <defs>
4
- <linearGradient id="paint0_linear_7620_15366" x1="-129.485" y1="380.684" x2="150.74" y2="-38.1231" gradientUnits="userSpaceOnUse">
5
- <stop stop-color="#02374A" stop-opacity="0.2"/>
6
- <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
7
- </linearGradient>
8
- </defs>
9
- </svg>
@@ -1,9 +0,0 @@
1
- <svg width="301" height="397" viewBox="0 0 301 397" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M184.806 -136.303C192.705 -147.627 208.289 -150.403 219.613 -142.504C230.937 -134.604 233.713 -119.021 225.814 -107.697L184.806 -136.303ZM63.5072 367.932L81.5291 342.097L122.537 370.703L104.516 396.538L63.5072 367.932ZM64.2901 245.333L38.4548 227.311L67.061 186.302L92.8963 204.324L64.2901 245.333ZM139.149 82.9614L190.819 119.005L162.213 160.014L110.542 123.97L139.149 82.9614ZM234.301 56.6725L208.465 38.6506L237.072 -2.35778L262.907 15.6641L234.301 56.6725ZM178.824 -127.728L184.806 -136.303L225.814 -107.697L219.833 -99.122L178.824 -127.728ZM208.465 38.6506C154.336 0.891517 141.065 -73.5988 178.824 -127.728L219.833 -99.122C197.872 -67.6409 205.59 -24.3181 237.072 -2.35778L208.465 38.6506ZM262.907 15.6641C302.768 43.47 312.54 98.3248 284.735 138.186L243.726 109.58C255.733 92.3669 251.513 68.6796 234.301 56.6725L262.907 15.6641ZM190.819 119.005C208.032 131.012 231.719 126.792 243.726 109.58L284.735 138.186C256.929 178.047 202.074 187.819 162.213 160.014L190.819 119.005ZM16.627 104.789C44.4329 64.9281 99.2877 55.1555 139.149 82.9614L110.542 123.97C93.3298 111.963 69.6425 116.183 57.6354 133.395L16.627 104.789ZM38.4548 227.311C-1.40616 199.505 -11.1788 144.65 16.627 104.789L57.6354 133.395C45.6283 150.608 49.8483 174.295 67.061 186.302L38.4548 227.311ZM81.5291 342.097C103.489 310.616 95.7712 267.293 64.2901 245.333L92.8963 204.324C147.026 242.083 160.296 316.574 122.537 370.703L81.5291 342.097Z" fill="url(#paint0_linear_7620_15713)"/>
3
- <defs>
4
- <linearGradient id="paint0_linear_7620_15713" x1="294.805" y1="-85.1219" x2="6.50603" y2="328.169" gradientUnits="userSpaceOnUse">
5
- <stop stop-color="#02374A" stop-opacity="0.2"/>
6
- <stop offset="1" stop-color="#02374A" stop-opacity="0"/>
7
- </linearGradient>
8
- </defs>
9
- </svg>