@npm_leadtech/legal-lib-components 7.91.0 → 7.92.0

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

@@ -1,8 +1,8 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from '../Button';
 import { PreFooterStyled } from './PreFooter.styled';
-export const PreFooter = ({ siteName, content, ctaLabel, ctaOnClick, ctaDataQa, ctaLink }) => {
-    return (_jsx(PreFooterStyled, { children: _jsx("div", { className: 'wrapper', children: _jsxs("div", { className: 'prefooter', children: [_jsxs("div", { className: 'serif --hero prefooter__title', children: ["Try ", siteName, " Now"] }), _jsx("div", { className: 'prefooter__columns', children: content.map((text, index) => {
+export const PreFooter = ({ siteTitle, content, ctaLabel, ctaOnClick, ctaDataQa, ctaLink }) => {
+    return (_jsx(PreFooterStyled, { children: _jsx("div", { className: 'wrapper', children: _jsxs("div", { className: 'prefooter', children: [_jsx("div", { className: 'serif --hero prefooter__title', children: siteTitle }), _jsx("div", { className: 'prefooter__columns', children: content.map((text, index) => {
                             return (_jsx("p", { className: 'prefooter__columns__text', children: text }, index));
                         }) }), _jsx(Button, { label: ctaLabel, onClick: ctaOnClick, link: ctaLink, dataQa: ctaDataQa, isExternal: true, hasNoFollow: true })] }) }) }));
 };

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

@@ -5,7 +5,7 @@ import { PreFooterProps } from './PreFooterProps'
 import { PreFooterStyled } from './PreFooter.styled'
 
 export const PreFooter: React.FC<PreFooterProps> = ({
-  siteName,
+  siteTitle,
   content,
   ctaLabel,
   ctaOnClick,
@@ -16,7 +16,7 @@ export const PreFooter: React.FC<PreFooterProps> = ({
     <PreFooterStyled>
       <div className='wrapper'>
         <div className='prefooter'>
-          <div className='serif --hero prefooter__title'>Try {siteName} Now</div>
+          <div className='serif --hero prefooter__title'>{siteTitle}</div>
           <div className='prefooter__columns'>
             {content.map((text, index) => {
               return (

package/dist/src/components/atoms/PreFooter/PreFooterProps.d.ts

@@ -1,5 +1,5 @@
 export interface PreFooterProps {
-    siteName: string;
+    siteTitle: string;
     content: string[];
     ctaLabel: string;
     ctaOnClick: () => void;

package/dist/src/components/atoms/PreFooter/PreFooterProps.ts

@@ -1,5 +1,5 @@
 export interface PreFooterProps {
-  siteName: string
+  siteTitle: string
   content: string[]
   ctaLabel: string
   ctaOnClick: () => void

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

@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 /**
  *  @param {string} props.id, jira task number
  *  @param {function} props.getVariant, function to obtain the url
@@ -13,8 +12,8 @@ export declare const TestAB: {
         defaultValue: any;
     }): any;
     propTypes: {
-        id: PropTypes.Requireable<string>;
-        getVariant: PropTypes.Requireable<(...args: any[]) => any>;
-        defaultValue: PropTypes.Requireable<string>;
+        id: any;
+        getVariant: any;
+        defaultValue: any;
     };
 };

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

@@ -3,5 +3,5 @@ import { SelectorTrustpilotWrapper, TopFooterStyled } from './TopFooter.styled';
 import { ContactInfo } from '../../molecules/ContactInfo/ContactInfo';
 import { FooterMenu } from '../../molecules/FooterMenu/FooterMenu';
 export const TopFooter = ({ menus, contactInfo, trustPilotWidget }) => {
-    return (_jsxs(TopFooterStyled, { className: 'footer__wrapper', children: [menus?.map((menu) => _jsx(FooterMenu, { ...menu }, menu.title)), (contactInfo || Boolean(trustPilotWidget)) && (_jsxs(SelectorTrustpilotWrapper, { children: [contactInfo && _jsx(ContactInfo, { ...contactInfo }), Boolean(trustPilotWidget) && _jsx("div", { children: trustPilotWidget })] }))] }));
+    return (_jsxs(TopFooterStyled, { className: 'footer__wrapper', children: [menus?.map((menu) => (_jsx(FooterMenu, { ...menu }, menu.title))), (contactInfo || Boolean(trustPilotWidget)) && (_jsxs(SelectorTrustpilotWrapper, { children: [contactInfo && _jsx(ContactInfo, { ...contactInfo }), Boolean(trustPilotWidget) && _jsx("div", { children: trustPilotWidget })] }))] }));
 };

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

@@ -7,7 +7,9 @@ import { TopFooterProps } from './TopFooterProps.types'
 export const TopFooter: React.FC<TopFooterProps> = ({ menus, contactInfo, trustPilotWidget }) => {
   return (
     <TopFooterStyled className='footer__wrapper'>
-      {menus?.map((menu) => <FooterMenu key={menu.title} {...menu} />)}
+      {menus?.map((menu) => (
+        <FooterMenu key={menu.title} {...menu} />
+      ))}
 
       {(contactInfo || Boolean(trustPilotWidget)) && (
         <SelectorTrustpilotWrapper>

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { CardBoxFeaturedSectionStyled, CardBoxMinimalSectionStyled } from './CardBoxSection.styled';
 import { CardBox } from '../../atoms';
 export const CardBoxMinimalSection = ({ cards }) => {
-    return (_jsx(CardBoxMinimalSectionStyled, { children: cards?.map(({ text, icon, id }) => _jsx(CardBox, { text: text, icon: icon }, id)) }));
+    return (_jsx(CardBoxMinimalSectionStyled, { children: cards?.map(({ text, icon, id }) => (_jsx(CardBox, { text: text, icon: icon }, id))) }));
 };
 export const CardBoxFeaturedSection = ({ cards }) => {
     return (_jsx(CardBoxFeaturedSectionStyled, { children: cards?.map(({ text, icon, id }) => (_jsx(CardBox, { text: text, icon: icon, padding: '16px', gap: '0.5rem', borderRadius: '8px' }, id))) }));

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

@@ -7,7 +7,9 @@ import { type CardBoxSectionProps } from './CardBoxSectionProps'
 export const CardBoxMinimalSection: React.FC<CardBoxSectionProps> = ({ cards }) => {
   return (
     <CardBoxMinimalSectionStyled>
-      {cards?.map(({ text, icon, id }) => <CardBox key={id} text={text} icon={icon} />)}
+      {cards?.map(({ text, icon, id }) => (
+        <CardBox key={id} text={text} icon={icon} />
+      ))}
     </CardBoxMinimalSectionStyled>
   )
 }

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

@@ -6,5 +6,5 @@ export const FaqSection = ({ groups, givenClass }) => {
     if (!groups?.length)
         return null;
     const classnames = classNames(`faqSection ${givenClass ?? ''}`);
-    return (_jsx(FaqSectionStyled, { className: classnames, itemScope: true, itemType: 'https://www.schema.org/FAQPage', children: groups?.map((group) => _jsx(FaqGroup, { ...group }, group.id)) }));
+    return (_jsx(FaqSectionStyled, { className: classnames, itemScope: true, itemType: 'https://www.schema.org/FAQPage', children: groups?.map((group) => (_jsx(FaqGroup, { ...group }, group.id))) }));
 };

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

@@ -11,7 +11,9 @@ export const FaqSection: React.FC<FaqSectionProps> = ({ groups, givenClass }) =>
 
   return (
     <FaqSectionStyled className={classnames} itemScope itemType='https://www.schema.org/FAQPage'>
-      {groups?.map((group) => <FaqGroup key={group.id} {...group} />)}
+      {groups?.map((group) => (
+        <FaqGroup key={group.id} {...group} />
+      ))}
     </FaqSectionStyled>
   )
 }

package/dist/src/globalStyles/animations.scss

@@ -55,11 +55,8 @@
 }
 
 .background-ratafia-animation {
-  background: radial-gradient(
-      90.31% 103.09% at 74.2% -62.04%,
-      var(--primary-main-dark-2) 0%,
-      var(--primary-main-dark-1) 100%
-    ),
+  background:
+    radial-gradient(90.31% 103.09% at 74.2% -62.04%, var(--primary-main-dark-2) 0%, var(--primary-main-dark-1) 100%),
     radial-gradient(80.63% 44.37% at 73.54% 70.76%, var(--primary-main) 0%, var(--primary-main-dark-2) 100%),
     radial-gradient(92.19% 33.51% at 0% 0%, var(--primary-main) 0%, var(--primary-main-dark-1) 100%),
     var(--primary-main-dark-2);

package/dist/src/globalStyles/variables.scss

@@ -1,6 +1,10 @@
 @use 'sass:math';
 
-// Breakpoints
+// =============================================================================
+// Figma tokens reference: figma-tokens/
+// =============================================================================
+
+// Breakpoints (relate to figma-tokens/grids/Mode 1.tokens.json: grid-xl, grid-l, grid-m, grid-s)
 $xl: 1600px;
 $lg: 1200px;
 $md: 960px;
@@ -8,48 +12,63 @@ $sm: 720px;
 $xs: 575px;
 $xxs: 328px;
 
-// Colors
+// Colors — figma-tokens/color (Legalfinity.tokens.json | Lawdistrict.tokens.json)
+// primary.* ↔ primary/50 … primary/900 | secondary.* ↔ secondary/50 … secondary/700
+// neutral.* ↔ neutral/25, 50, 200, 400, 600, 800, 900, white | error.* ↔ error/20, 200, 500
+// others.* ↔ others/black, others/disabled
 $colors: (
   primary: (
     main-light-6: var(--primary-main-light-6),
+    // ~ primary/50–100
     main-light-5: var(--primary-main-light-5),
     main-light-4: var(--primary-main-light-4),
     main-light-3: var(--primary-main-light-3),
     main-light-2: var(--primary-main-light-2),
     main-light-1: var(--primary-main-light-1),
     main: var(--primary-main),
+    // ~ primary/500
     main-dark-1: var(--primary-main-dark-1),
     main-dark-1-rgb: var(--primary-main-dark-1-rgb),
-    main-dark-2: var(--primary-main-dark-2)
+    main-dark-2: var(--primary-main-dark-2) // ~ primary/800–900
   ),
   secondary: (
     main-light-5: var(--secondary-main-light-5),
+    // ~ secondary/50–100
     main-light-4: var(--secondary-main-light-4),
     main-light-3: var(--secondary-main-light-3),
     main-light-2: var(--secondary-main-light-2),
     main-light-1: var(--secondary-main-light-1),
     main: var(--secondary-main),
+    // ~ secondary/400–500
     main-dark-1: var(--secondary-main-dark-1),
-    main-dark-2: var(--secondary-main-dark-2)
+    main-dark-2: var(--secondary-main-dark-2) // ~ secondary/600–700
   ),
   neutral: (
     main: var(--neutral-main),
+    // ~ neutral/600–800
     neutral-1: var(--neutral-neutral-1),
+    // ~ neutral/25
     neutral-2: var(--neutral-neutral-2),
+    // ~ neutral/50–200
     neutral-3: var(--neutral-neutral-3),
     neutral-4: var(--neutral-neutral-4),
+    // ~ neutral/400
     neutral-5: var(--neutral-neutral-5),
-    neutral-6: var(--neutral-neutral-6)
+    neutral-6: var(--neutral-neutral-6) // ~ neutral/800–900
   ),
   error: (
     main: var(--error-main),
+    // ~ error/500
     error-2: var(--error-error-2),
+    // ~ error/200
     error-3: var(--error-error-3)
   ),
   others: (
     white: var(--others-white),
+    // ~ neutral/white
     disabled: var(--others-disabled),
-    black: var(--others-black)
+    // others/disabled
+    black: var(--others-black) // others/black
   )
 );
 
@@ -58,19 +77,19 @@ $colors: (
   @return $color;
 }
 
-// Box shadow
+// Box shadow — figma-tokens/box-shadow/value.tokens.json (small | medium)
 $box-shadow-small: var(--box-shadow-small);
 $box-shadow-medium: var(--box-shadow-medium);
 $box-shadow-menu: var(--box-shadow-menu);
 $box-shadow-tippy-box: var(--box-shadow-tippy-box);
 $box-shadow-container: var(--box-shadow-container);
 
-// Fonts
-$font-sans: 'Inter', sans-serif;
-$font-serif: 'Lora', serif;
+// Fonts — figma-tokens/font (font-family/primary, font-family/secondary; Lawdistrict: Inter + Lora)
+$font-sans: 'Inter', sans-serif; // font-family/primary (Lawdistrict)
+$font-serif: 'Lora', serif; // font-family/secondary (Lawdistrict)
 
-// Layout
+// Layout (max-width aligns with breakpoints; spacing scale in figma-tokens/border-and-spacing/Mode 1.tokens.json)
 $max-width: $lg;
 
-//menu
+// menu
 $menu-height-mobile: 3.25rem;

package/dist/src/globalStyles/variablesCss.scss

@@ -1,20 +1,30 @@
+// =============================================================================
+// Figma tokens reference: figma-tokens/
+// =============================================================================
+
 html {
+  // figma-tokens/font: font-family/primary, font-family/secondary (Lawdistrict: Inter, Lora)
   --font-sans: 'Inter', sans-serif;
   --font-serif: 'Lora', serif;
 
+  // figma-tokens/border-and-spacing/Mode 1.tokens.json: border-radius/sm (4px), border-radius/md (8px), border-radius/l (16px)
   --s-border-radius: 0.25rem;
   --m-border-radius: 0.5rem;
   --l-border-radius: 1rem;
 
+  // figma-tokens/box-shadow/value.tokens.json:
+  // small, medium (color uses primary dark; menu/tippy/container are variants)
   --box-shadow-small: 0 0.125rem 0.375rem 0 rgba(var(--primary-main-dark-1-rgb), 0.25);
   --box-shadow-medium: 0 0.25rem 0.5rem 0 rgba(var(--primary-main-dark-1-rgb), 0.2);
   --box-shadow-menu: 0 0.25rem 0.5rem -0.5rem rgba(var(--primary-main-dark-1-rgb), 0.2);
   --box-shadow-tippy-box: 0 0.25rem 0.5rem 0.25rem rgba(var(--primary-main-dark-1-rgb), 0.2);
   --box-shadow-container: 0px 2px 6px 0px rgba(var(--primary-main-dark-1-rgb), 0.25);
 
+  // figma-tokens/border-and-spacing/Mode 1.tokens.json: spacing scale (e.g. spacing/sm 16px → 1rem)
   --global-gap: 1rem;
 }
 
+// Theme: Legalfinity — figma-tokens/font/Legalfinity.tokens.json (font-family/primary, secondary → Poppins)
 html[data-theme='primaryblue'] {
   --font-sans: 'Poppins', sans-serif;
   --font-serif: 'Poppins', serif;