@npm_leadtech/legal-lib-components 7.75.0 → 7.76.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.
- package/dist/src/components/molecules/AccordionItem/AccordionItem.d.ts +1 -1
- package/dist/src/components/molecules/AccordionItem/AccordionItem.js +3 -23
- package/dist/src/components/molecules/AccordionItem/AccordionItem.tsx +2 -23
- package/dist/src/components/molecules/AccordionItem/AccordionItemProps.types.d.ts +0 -1
- package/dist/src/components/molecules/AccordionItem/AccordionItemProps.types.ts +0 -1
- package/dist/src/components/organisms/Accordion/Accordion.d.ts +1 -1
- package/dist/src/components/organisms/Accordion/Accordion.js +2 -2
- package/dist/src/components/organisms/Accordion/Accordion.tsx +1 -7
- package/dist/src/components/organisms/Accordion/AccordionProps.types.d.ts +0 -1
- package/dist/src/components/organisms/Accordion/AccordionProps.types.ts +0 -1
- package/dist/src/components/organisms/DocumentListMenu/DocumentListMenu.js +1 -1
- package/dist/src/components/organisms/DocumentListMenu/DocumentListMenu.tsx +1 -1
- package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenu.js +1 -1
- package/dist/src/components/organisms/DocumentMainMenu/DocumentMainMenu.tsx +1 -1
- package/package.json +1 -1
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type AccordionItemProps } from './AccordionItemProps.types';
|
|
3
|
-
export declare const AccordionItem: ({ accordionRightContent, children, defaultHeightItem, index, isOpen, onClick, title
|
|
3
|
+
export declare const AccordionItem: ({ accordionRightContent, children, defaultHeightItem, index, isOpen, onClick, title }: AccordionItemProps) => React.JSX.Element;
|
|
@@ -1,41 +1,21 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
|
3
|
-
import
|
|
3
|
+
import { useEffect, useRef } from 'react';
|
|
4
4
|
import { useDispatchDataAccordionItem, useStateDataAccordionItem } from '../../organisms/Accordion/Accordion.context';
|
|
5
5
|
import { AccordionItemStyled } from './AccordionItem.styled';
|
|
6
|
-
export const AccordionItem = ({ accordionRightContent, children, defaultHeightItem = 416, index, isOpen, onClick, title
|
|
6
|
+
export const AccordionItem = ({ accordionRightContent, children, defaultHeightItem = 416, index, isOpen, onClick, title }) => {
|
|
7
7
|
const contenReftHeight = useRef(null);
|
|
8
8
|
const { state } = useStateDataAccordionItem(index);
|
|
9
9
|
const { dispatch } = useDispatchDataAccordionItem();
|
|
10
|
-
const [heightAccordionItem, setHeightAccordionItem] = React.useState(defaultHeightItem);
|
|
11
10
|
useEffect(() => {
|
|
12
11
|
if (state.locked.actionType === 'unlocked') {
|
|
13
12
|
onClick();
|
|
14
13
|
dispatch({ type: 'unlocked', accordionItem: index, resetAction: 'default' });
|
|
15
14
|
}
|
|
16
15
|
}, [state.locked.actionType]);
|
|
17
|
-
useEffect(() => {
|
|
18
|
-
let intervalId;
|
|
19
|
-
if (heightAutoChange) {
|
|
20
|
-
intervalId = setInterval(() => {
|
|
21
|
-
const height = contenReftHeight.current?.children[0].getBoundingClientRect().height ?? defaultHeightItem;
|
|
22
|
-
if (heightAccordionItem !== height) {
|
|
23
|
-
setHeightAccordionItem(height);
|
|
24
|
-
}
|
|
25
|
-
}, 500);
|
|
26
|
-
}
|
|
27
|
-
else {
|
|
28
|
-
setHeightAccordionItem(contenReftHeight?.current?.scrollHeight ?? defaultHeightItem);
|
|
29
|
-
}
|
|
30
|
-
return () => {
|
|
31
|
-
if (intervalId !== undefined) {
|
|
32
|
-
clearInterval(intervalId);
|
|
33
|
-
}
|
|
34
|
-
};
|
|
35
|
-
}, []);
|
|
36
16
|
return (_jsxs(AccordionItemStyled, { className: 'accordion__container', children: [_jsxs("button", { className: `accordion__button
|
|
37
17
|
${state.handler === 'success' ? '--success' : ''}
|
|
38
18
|
${state.locked.isLocked ? '--locked' : ''}`, onClick: () => {
|
|
39
19
|
!state.locked.isLocked && onClick();
|
|
40
|
-
}, children: [_jsx("p", { className: `accordion__title ${state.locked.isLocked ? '--locked' : ''}`, children: title }), accordionRightContent] }), _jsx("div", { ref: contenReftHeight, className: `accordion__content ${!isOpen ? '--closed' : ''}`, style: isOpen ? { height:
|
|
20
|
+
}, children: [_jsx("p", { className: `accordion__title ${state.locked.isLocked ? '--locked' : ''}`, children: title }), accordionRightContent] }), _jsx("div", { ref: contenReftHeight, className: `accordion__content ${!isOpen ? '--closed' : ''}`, style: isOpen ? { height: contenReftHeight?.current?.scrollHeight ?? defaultHeightItem } : { height: '0px' }, children: children })] }));
|
|
41
21
|
};
|
|
@@ -12,13 +12,11 @@ export const AccordionItem = ({
|
|
|
12
12
|
index,
|
|
13
13
|
isOpen,
|
|
14
14
|
onClick,
|
|
15
|
-
title
|
|
16
|
-
heightAutoChange = false
|
|
15
|
+
title
|
|
17
16
|
}: AccordionItemProps): React.JSX.Element => {
|
|
18
17
|
const contenReftHeight = useRef<HTMLInputElement>(null)
|
|
19
18
|
const { state } = useStateDataAccordionItem(index)
|
|
20
19
|
const { dispatch } = useDispatchDataAccordionItem()
|
|
21
|
-
const [heightAccordionItem, setHeightAccordionItem] = React.useState<number>(defaultHeightItem)
|
|
22
20
|
|
|
23
21
|
useEffect(() => {
|
|
24
22
|
if (state.locked.actionType === 'unlocked') {
|
|
@@ -27,25 +25,6 @@ export const AccordionItem = ({
|
|
|
27
25
|
}
|
|
28
26
|
}, [state.locked.actionType])
|
|
29
27
|
|
|
30
|
-
useEffect(() => {
|
|
31
|
-
let intervalId: ReturnType<typeof setInterval> | undefined
|
|
32
|
-
if (heightAutoChange) {
|
|
33
|
-
intervalId = setInterval(() => {
|
|
34
|
-
const height = contenReftHeight.current?.children[0].getBoundingClientRect().height ?? defaultHeightItem
|
|
35
|
-
if (heightAccordionItem !== height) {
|
|
36
|
-
setHeightAccordionItem(height)
|
|
37
|
-
}
|
|
38
|
-
}, 500)
|
|
39
|
-
} else {
|
|
40
|
-
setHeightAccordionItem(contenReftHeight?.current?.scrollHeight ?? defaultHeightItem)
|
|
41
|
-
}
|
|
42
|
-
return () => {
|
|
43
|
-
if (intervalId !== undefined) {
|
|
44
|
-
clearInterval(intervalId)
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
}, [])
|
|
48
|
-
|
|
49
28
|
return (
|
|
50
29
|
<AccordionItemStyled className='accordion__container'>
|
|
51
30
|
<button
|
|
@@ -63,7 +42,7 @@ export const AccordionItem = ({
|
|
|
63
42
|
<div
|
|
64
43
|
ref={contenReftHeight}
|
|
65
44
|
className={`accordion__content ${!isOpen ? '--closed' : ''}`}
|
|
66
|
-
style={isOpen ? { height:
|
|
45
|
+
style={isOpen ? { height: contenReftHeight?.current?.scrollHeight ?? defaultHeightItem } : { height: '0px' }}
|
|
67
46
|
>
|
|
68
47
|
{children}
|
|
69
48
|
</div>
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type AccordionProps } from './AccordionProps.types';
|
|
3
|
-
export declare const Accordion: ({ data, defaultActiveIndex, defaultHeightItem
|
|
3
|
+
export declare const Accordion: ({ data, defaultActiveIndex, defaultHeightItem }: AccordionProps) => React.JSX.Element;
|
|
@@ -3,12 +3,12 @@ import { useState } from 'react';
|
|
|
3
3
|
import { AccordionItem } from '../../molecules';
|
|
4
4
|
import { AccordionProvider } from './Accordion.context';
|
|
5
5
|
import { AccordionStyled } from './Accordion.styled';
|
|
6
|
-
export const Accordion = ({ data, defaultActiveIndex = 0, defaultHeightItem
|
|
6
|
+
export const Accordion = ({ data, defaultActiveIndex = 0, defaultHeightItem }) => {
|
|
7
7
|
const [activeIndex, setActiveIndex] = useState(defaultActiveIndex);
|
|
8
8
|
const handleItemClick = (index) => {
|
|
9
9
|
setActiveIndex((prevIndex) => (prevIndex === index ? -1 : index));
|
|
10
10
|
};
|
|
11
|
-
return (_jsx(AccordionProvider, { elements: data.length, children: _jsx(AccordionStyled, { children: data.map((item, index) => (_jsx(AccordionItem, { accordionRightContent: item?.accordionRightContent, defaultHeightItem: defaultHeightItem,
|
|
11
|
+
return (_jsx(AccordionProvider, { elements: data.length, children: _jsx(AccordionStyled, { children: data.map((item, index) => (_jsx(AccordionItem, { accordionRightContent: item?.accordionRightContent, defaultHeightItem: defaultHeightItem, index: index, isOpen: activeIndex === index, onClick: () => {
|
|
12
12
|
handleItemClick(index);
|
|
13
13
|
}, title: item.title, children: item.children }, index))) }) }));
|
|
14
14
|
};
|
|
@@ -4,12 +4,7 @@ import { type AccordionProps } from './AccordionProps.types'
|
|
|
4
4
|
import { AccordionProvider } from './Accordion.context'
|
|
5
5
|
import { AccordionStyled } from './Accordion.styled'
|
|
6
6
|
|
|
7
|
-
export const Accordion = ({
|
|
8
|
-
data,
|
|
9
|
-
defaultActiveIndex = 0,
|
|
10
|
-
defaultHeightItem,
|
|
11
|
-
heightAutoChange = false
|
|
12
|
-
}: AccordionProps): React.JSX.Element => {
|
|
7
|
+
export const Accordion = ({ data, defaultActiveIndex = 0, defaultHeightItem }: AccordionProps): React.JSX.Element => {
|
|
13
8
|
const [activeIndex, setActiveIndex] = useState(defaultActiveIndex)
|
|
14
9
|
|
|
15
10
|
const handleItemClick = (index: number): void => {
|
|
@@ -23,7 +18,6 @@ export const Accordion = ({
|
|
|
23
18
|
<AccordionItem
|
|
24
19
|
accordionRightContent={item?.accordionRightContent}
|
|
25
20
|
defaultHeightItem={defaultHeightItem}
|
|
26
|
-
heightAutoChange={heightAutoChange}
|
|
27
21
|
index={index}
|
|
28
22
|
isOpen={activeIndex === index}
|
|
29
23
|
key={index}
|
|
@@ -3,5 +3,5 @@ import { Button } from '../../atoms/Button';
|
|
|
3
3
|
import { DocumentListMenuSection } from '../../molecules/DocumentListMenuSection';
|
|
4
4
|
import { DocumentListMenuStyled } from './DocumentListMenu.styled';
|
|
5
5
|
export const DocumentListMenu = ({ routes, seeAllLegalDocs, seeAllTypeDocs, finalMenu, hasSubCategoryPage, setCookiePolicyFunc }) => {
|
|
6
|
-
return (_jsxs(DocumentListMenuStyled, { className: 'document-list-menu', children: [_jsx("div", { className: 'documents-wrapper', children: finalMenu.map((item, index) => (_jsx("div", { className: 'products__list__section-container', children: _jsx(DocumentListMenuSection, { products: item.products, type: item.type, icon: item.icon, seeAllTypeDocs: seeAllTypeDocs, slug:
|
|
6
|
+
return (_jsxs(DocumentListMenuStyled, { className: 'document-list-menu', children: [_jsx("div", { className: 'documents-wrapper', children: finalMenu.map((item, index) => (_jsx("div", { className: 'products__list__section-container', children: _jsx(DocumentListMenuSection, { products: item.products, type: item.type, icon: item.icon, seeAllTypeDocs: seeAllTypeDocs, slug: item.slug, hasSubCategoryPage: hasSubCategoryPage, routes: routes, setCookiePolicyFunc: setCookiePolicyFunc }) }, index))) }), _jsx("div", { className: 'all-documents-button-wrapper', children: _jsx(Button, { color: 'transparent', centered: true, size: 'M', givenClass: 'all-documents-button', link: routes.LEGAL_DOCUMENTS, label: seeAllLegalDocs, dataQa: 'button-see-all-documents' }) })] }));
|
|
7
7
|
};
|
|
@@ -23,7 +23,7 @@ export const DocumentListMenu: React.FC<DocumentListMenuProps> = ({
|
|
|
23
23
|
type={item.type}
|
|
24
24
|
icon={item.icon}
|
|
25
25
|
seeAllTypeDocs={seeAllTypeDocs}
|
|
26
|
-
slug={
|
|
26
|
+
slug={item.slug}
|
|
27
27
|
hasSubCategoryPage={hasSubCategoryPage}
|
|
28
28
|
routes={routes}
|
|
29
29
|
setCookiePolicyFunc={setCookiePolicyFunc}
|
|
@@ -5,7 +5,7 @@ import DocumentSubMenu from '../DocumentSubMenu/DocumentSubMenu';
|
|
|
5
5
|
export const DocumentMainMenu = ({ seeAllTypeDocs, allLegalDocs, allTypeDocs, setCookiePolicyFunc, routes, hasSubCategoryPage, finalMenu }) => {
|
|
6
6
|
return (_jsxs(DocumentMainMenuStyled, { children: [finalMenu.map((item, index) => (_jsxs("li", { className: 'menu-items-li', children: [item.type, _jsx("div", { className: 'icon-arrow', children: _jsx(ArrowRight, {}) }), _jsxs("ul", { className: 'submenu__list', children: [item.products.map((product, index) => (_jsx(DocumentSubMenu, { product: product, setCookiePolicyFunc: setCookiePolicyFunc, routes: routes }, index))), _jsx("li", { className: 'menu-items-li all-item', children: _jsx("a", { title: seeAllTypeDocs.replace(/{{type}}/g, item.type), "data-qa": `Header_Menu__${item.slug}_all-documents`, href: hasSubCategoryPage
|
|
7
7
|
? routes.LEGAL_DOCUMENTS_WITH_CATEGORY(item.slug)
|
|
8
|
-
: routes.LEGAL_DOCUMENTS_WITH_HASH(item.
|
|
8
|
+
: routes.LEGAL_DOCUMENTS_WITH_HASH(item.slug), children: item.type.includes('Documents')
|
|
9
9
|
? allTypeDocs.replace(/{{type}}/g, item.type).replace('Documents', '')
|
|
10
10
|
: allTypeDocs.replace(/{{type}}/g, item.type) }) })] }, index)] }, index))), _jsx("li", { className: 'menu-items-li all-item', children: _jsx("a", { title: allLegalDocs, "data-qa": 'Header_Menu_Document_List_All_Documents', href: routes.LEGAL_DOCUMENTS, children: allLegalDocs }) })] }));
|
|
11
11
|
};
|
|
@@ -38,7 +38,7 @@ export const DocumentMainMenu: React.FC<DocumentMainMenuProps> = ({
|
|
|
38
38
|
href={
|
|
39
39
|
hasSubCategoryPage
|
|
40
40
|
? routes.LEGAL_DOCUMENTS_WITH_CATEGORY(item.slug)
|
|
41
|
-
: routes.LEGAL_DOCUMENTS_WITH_HASH(item.
|
|
41
|
+
: routes.LEGAL_DOCUMENTS_WITH_HASH(item.slug)
|
|
42
42
|
}
|
|
43
43
|
>
|
|
44
44
|
{item.type.includes('Documents')
|