@npm_leadtech/legal-lib-components 7.23.6 → 7.23.51

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 (47) hide show
  1. package/dist/src/components/atoms/DropdownInput/DropdownInput.d.ts +1 -1
  2. package/dist/src/components/atoms/DropdownInput/DropdownInput.js +7 -9
  3. package/dist/src/components/atoms/DropdownInput/DropdownInput.styled.js +35 -52
  4. package/dist/src/components/atoms/DropdownInput/DropdownInput.styled.ts +36 -52
  5. package/dist/src/components/atoms/DropdownInput/DropdownInput.tsx +51 -55
  6. package/dist/src/components/atoms/DropdownInput/DropdownInputProps.types.d.ts +0 -1
  7. package/dist/src/components/atoms/DropdownInput/DropdownInputProps.types.ts +0 -1
  8. package/dist/src/components/atoms/SearchSelect/SearchSelect.js +3 -2
  9. package/dist/src/components/atoms/SearchSelect/SearchSelect.tsx +3 -1
  10. package/dist/src/components/molecules/SearchBar/SearchBar.js +29 -17
  11. package/dist/src/components/molecules/SearchBar/SearchBar.styled.js +55 -4
  12. package/dist/src/components/molecules/SearchBar/SearchBar.styled.ts +55 -4
  13. package/dist/src/components/molecules/SearchBar/SearchBar.tsx +61 -31
  14. package/dist/tsconfig.build.tsbuildinfo +1 -1
  15. package/package.json +1 -1
  16. package/dist/images/componentsSvg/CloseIcon.d.ts +0 -6
  17. package/dist/images/componentsSvg/CloseIcon.js +0 -2
  18. package/dist/images/componentsSvg/CloseIcon.tsx +0 -14
  19. package/dist/images/svg/close-grey-24px.svg +0 -3
  20. package/dist/images/svg/search_24px.svg +0 -3
  21. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBar.d.ts +0 -8
  22. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBar.js +0 -44
  23. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBar.styled.d.ts +0 -1
  24. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBar.styled.js +0 -48
  25. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBar.styled.ts +0 -49
  26. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBar.tsx +0 -77
  27. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBarProps.types.d.ts +0 -37
  28. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBarProps.types.js +0 -1
  29. package/dist/src/components/molecules/DesktopSearchBar/DesktopSearchBarProps.types.ts +0 -40
  30. package/dist/src/components/molecules/DesktopSearchBar/index.d.ts +0 -2
  31. package/dist/src/components/molecules/DesktopSearchBar/index.js +0 -1
  32. package/dist/src/components/molecules/DesktopSearchBar/index.ts +0 -2
  33. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBar.d.ts +0 -3
  34. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBar.js +0 -38
  35. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBar.styled.d.ts +0 -1
  36. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBar.styled.js +0 -17
  37. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBar.styled.ts +0 -18
  38. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBar.tsx +0 -55
  39. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBarProps.types.d.ts +0 -37
  40. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBarProps.types.js +0 -1
  41. package/dist/src/components/molecules/MobileSearchBar/MobileSearchBarProps.types.ts +0 -40
  42. package/dist/src/components/molecules/MobileSearchBar/index.d.ts +0 -2
  43. package/dist/src/components/molecules/MobileSearchBar/index.js +0 -1
  44. package/dist/src/components/molecules/MobileSearchBar/index.ts +0 -2
  45. package/dist/src/hooks/useSearchFunction.d.ts +0 -10
  46. package/dist/src/hooks/useSearchFunction.js +0 -28
  47. package/dist/src/hooks/useSearchFunction.tsx +0 -63
@@ -1,14 +0,0 @@
1
- import React, { FC } from 'react'
2
-
3
- interface Close24Props {
4
- className?: string
5
- }
6
-
7
- export const CloseIcon: FC<Close24Props> = ({ className }: Close24Props): React.ReactElement => (
8
- <svg className={className} width={20} height={20} viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'>
9
- <path
10
- d='M15.2462 5.92913C15.5706 5.60466 15.5706 5.07859 15.2462 4.75413C14.9217 4.42966 14.3956 4.42966 14.0712 4.75413L10.0003 8.82496L5.92949 4.75413C5.60503 4.42966 5.07896 4.42966 4.75449 4.75413C4.43002 5.07859 4.43003 5.60466 4.75449 5.92913L8.82533 9.99996L4.75449 14.0708C4.43003 14.3953 4.43002 14.9213 4.75449 15.2458C5.07896 15.5703 5.60502 15.5703 5.92949 15.2458L10.0003 11.175L14.0712 15.2458C14.3956 15.5703 14.9217 15.5703 15.2462 15.2458C15.5706 14.9213 15.5706 14.3953 15.2462 14.0708L11.1753 9.99996L15.2462 5.92913Z'
11
- fill='#B5BABD'
12
- />
13
- </svg>
14
- )
@@ -1,3 +0,0 @@
1
- <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M15.2462 5.92913C15.5706 5.60466 15.5706 5.07859 15.2462 4.75413C14.9217 4.42966 14.3956 4.42966 14.0712 4.75413L10.0003 8.82496L5.92949 4.75413C5.60503 4.42966 5.07896 4.42966 4.75449 4.75413C4.43002 5.07859 4.43003 5.60466 4.75449 5.92913L8.82533 9.99996L4.75449 14.0708C4.43003 14.3953 4.43002 14.9213 4.75449 15.2458C5.07896 15.5703 5.60502 15.5703 5.92949 15.2458L10.0003 11.175L14.0712 15.2458C14.3956 15.5703 14.9217 15.5703 15.2462 15.2458C15.5706 14.9213 15.5706 14.3953 15.2462 14.0708L11.1753 9.99996L15.2462 5.92913Z" fill="#B5BABD"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M7.83105 13.9947C6.10828 13.9947 4.65024 13.3981 3.45694 12.2048C2.26364 11.0115 1.66699 9.55346 1.66699 7.83069C1.66699 6.10791 2.26364 4.64987 3.45694 3.45657C4.65024 2.26328 6.10828 1.66663 7.83105 1.66663C9.55383 1.66663 11.0119 2.26328 12.2052 3.45657C13.3985 4.64987 13.9951 6.10791 13.9951 7.83069C13.9951 8.52612 13.8845 9.18204 13.6632 9.79844C13.4419 10.4148 13.1416 10.9601 12.7623 11.4343L18.0729 16.7449C18.2467 16.9187 18.3337 17.14 18.3337 17.4087C18.3337 17.6774 18.2467 17.8986 18.0729 18.0725C17.899 18.2464 17.6777 18.3333 17.4091 18.3333C17.1404 18.3333 16.9191 18.2464 16.7452 18.0725L11.4347 12.7619C10.9605 13.1413 10.4152 13.4416 9.79881 13.6628C9.1824 13.8841 8.52648 13.9947 7.83105 13.9947ZM7.83105 12.0981C9.01645 12.0981 10.024 11.6832 10.8538 10.8534C11.6836 10.0237 12.0985 9.01608 12.0985 7.83069C12.0985 6.64529 11.6836 5.6377 10.8538 4.80793C10.024 3.97815 9.01645 3.56326 7.83105 3.56326C6.64566 3.56326 5.63807 3.97815 4.80829 4.80793C3.97851 5.6377 3.56363 6.64529 3.56363 7.83069C3.56363 9.01608 3.97851 10.0237 4.80829 10.8534C5.63807 11.6832 6.64566 12.0981 7.83105 12.0981Z" fill="#078080"/>
3
- </svg>
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { type SearchBarProps } from '../SearchBar/SearchBarProps.types';
3
- interface DesktopSearchBarProps extends SearchBarProps {
4
- isOpen: boolean;
5
- onClose: () => void;
6
- }
7
- export declare const DesktopSearchBar: React.FC<DesktopSearchBarProps>;
8
- export {};
@@ -1,44 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useEffect, useRef } from 'react';
3
- import { CloseIcon } from '../../../../images/componentsSvg/CloseIcon';
4
- import { DesktopSearchBarStyled } from './DesktopSearchBar.styled';
5
- import { DropdownInput } from '../../atoms/DropdownInput/DropdownInput';
6
- import { useSearchFunction } from '../../../hooks/useSearchFunction';
7
- export const DesktopSearchBar = ({ products, searchBarTexts, routes, handleResultClick, isOpen, onClose }) => {
8
- const { results, searchFunction } = useSearchFunction({
9
- products,
10
- searchBarTexts,
11
- routes,
12
- handleResultClick,
13
- onClose
14
- });
15
- const searchInputRef = useRef(null);
16
- const searchBarContainerRef = useRef(null);
17
- useEffect(() => {
18
- const handleKeyDown = (event) => {
19
- if (event.key === 'Escape') {
20
- onClose();
21
- }
22
- };
23
- const handleClickOutside = (event) => {
24
- if (searchBarContainerRef.current && !searchBarContainerRef.current.contains(event.target)) {
25
- onClose();
26
- }
27
- };
28
- if (isOpen) {
29
- document.addEventListener('keydown', handleKeyDown);
30
- document.addEventListener('mousedown', handleClickOutside);
31
- if (searchInputRef.current) {
32
- searchInputRef.current.focus();
33
- }
34
- }
35
- return () => {
36
- document.removeEventListener('keydown', handleKeyDown);
37
- document.removeEventListener('mousedown', handleClickOutside);
38
- };
39
- }, [isOpen, onClose]);
40
- if (!isOpen) {
41
- return null;
42
- }
43
- return (_jsx(DesktopSearchBarStyled, { ref: searchBarContainerRef, className: 'modal_searchbar', children: _jsx("div", { className: 'modal_searchbar__content', children: _jsx(DropdownInput, { ref: searchInputRef, name: 'desktop-search', className: 'search', placeholder: searchBarTexts.placeholder, icon: _jsx(CloseIcon, {}), onChange: searchFunction, results: results, onClose: onClose }) }) }));
44
- };
@@ -1 +0,0 @@
1
- export declare const DesktopSearchBarStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -1,48 +0,0 @@
1
- import { device } from '../../../globalStyles/breakpoints';
2
- import styled from 'styled-components';
3
- export const DesktopSearchBarStyled = styled.div `
4
- display: none;
5
-
6
- @media ${device['landscape-tablets']} {
7
- display: block;
8
- position: absolute;
9
- top: 75px;
10
- left: 0;
11
- z-index: 10000;
12
- width: 400px;
13
- max-width: 90vw;
14
- background: transparent;
15
-
16
- .modal_searchbar__content {
17
- background-color: var(--others-white);
18
- border-radius: 8px;
19
- width: 300px;
20
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
21
-
22
- @media ${device['laptop']} {
23
- padding: 0;
24
- width: 100%;
25
- }
26
- }
27
-
28
- .modal_searchbar__header {
29
- display: flex;
30
- justify-content: space-between;
31
- align-items: center;
32
- margin-bottom: 1rem;
33
- }
34
-
35
- .modal_searchbar__title {
36
- font-size: 1.5rem;
37
- font-weight: bold;
38
- color: var(--others-black);
39
- }
40
-
41
- .dropdown_input {
42
- .search {
43
- width: 100%;
44
- margin: 0;
45
- }
46
- }
47
- }
48
- `;
@@ -1,49 +0,0 @@
1
- import { device } from '../../../globalStyles/breakpoints'
2
- import styled from 'styled-components'
3
-
4
- export const DesktopSearchBarStyled = styled.div`
5
- display: none;
6
-
7
- @media ${device['landscape-tablets']} {
8
- display: block;
9
- position: absolute;
10
- top: 75px;
11
- left: 0;
12
- z-index: 10000;
13
- width: 400px;
14
- max-width: 90vw;
15
- background: transparent;
16
-
17
- .modal_searchbar__content {
18
- background-color: var(--others-white);
19
- border-radius: 8px;
20
- width: 300px;
21
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
22
-
23
- @media ${device['laptop']} {
24
- padding: 0;
25
- width: 100%;
26
- }
27
- }
28
-
29
- .modal_searchbar__header {
30
- display: flex;
31
- justify-content: space-between;
32
- align-items: center;
33
- margin-bottom: 1rem;
34
- }
35
-
36
- .modal_searchbar__title {
37
- font-size: 1.5rem;
38
- font-weight: bold;
39
- color: var(--others-black);
40
- }
41
-
42
- .dropdown_input {
43
- .search {
44
- width: 100%;
45
- margin: 0;
46
- }
47
- }
48
- }
49
- `
@@ -1,77 +0,0 @@
1
- import React, { useEffect, useRef } from 'react'
2
- import { CloseIcon } from '../../../../images/componentsSvg/CloseIcon'
3
- import { DesktopSearchBarStyled } from './DesktopSearchBar.styled'
4
- import { DropdownInput } from '../../atoms/DropdownInput/DropdownInput'
5
- import { type SearchBarProps } from '../SearchBar/SearchBarProps.types'
6
- import { useSearchFunction } from '../../../hooks/useSearchFunction'
7
-
8
- interface DesktopSearchBarProps extends SearchBarProps {
9
- isOpen: boolean
10
- onClose: () => void
11
- }
12
-
13
- export const DesktopSearchBar: React.FC<DesktopSearchBarProps> = ({
14
- products,
15
- searchBarTexts,
16
- routes,
17
- handleResultClick,
18
- isOpen,
19
- onClose
20
- }) => {
21
- const { results, searchFunction } = useSearchFunction({
22
- products,
23
- searchBarTexts,
24
- routes,
25
- handleResultClick,
26
- onClose
27
- })
28
- const searchInputRef = useRef<HTMLInputElement>(null)
29
- const searchBarContainerRef = useRef<HTMLDivElement>(null)
30
-
31
- useEffect(() => {
32
- const handleKeyDown = (event: KeyboardEvent) => {
33
- if (event.key === 'Escape') {
34
- onClose()
35
- }
36
- }
37
- const handleClickOutside = (event: MouseEvent) => {
38
- if (searchBarContainerRef.current && !searchBarContainerRef.current.contains(event.target as Node)) {
39
- onClose()
40
- }
41
- }
42
-
43
- if (isOpen) {
44
- document.addEventListener('keydown', handleKeyDown)
45
- document.addEventListener('mousedown', handleClickOutside)
46
- if (searchInputRef.current) {
47
- searchInputRef.current.focus()
48
- }
49
- }
50
-
51
- return () => {
52
- document.removeEventListener('keydown', handleKeyDown)
53
- document.removeEventListener('mousedown', handleClickOutside)
54
- }
55
- }, [isOpen, onClose])
56
-
57
- if (!isOpen) {
58
- return null
59
- }
60
-
61
- return (
62
- <DesktopSearchBarStyled ref={searchBarContainerRef} className='modal_searchbar'>
63
- <div className='modal_searchbar__content'>
64
- <DropdownInput
65
- ref={searchInputRef}
66
- name='desktop-search'
67
- className='search'
68
- placeholder={searchBarTexts.placeholder}
69
- icon={<CloseIcon />}
70
- onChange={searchFunction}
71
- results={results}
72
- onClose={onClose}
73
- />
74
- </div>
75
- </DesktopSearchBarStyled>
76
- )
77
- }
@@ -1,37 +0,0 @@
1
- export interface Products {
2
- categoryUrl?: string;
3
- isFeatured?: boolean;
4
- popularOrder: number;
5
- jumboTitle: string;
6
- linkText: string;
7
- slug: string;
8
- footerPopularDocument?: boolean;
9
- logoImgBig?: string;
10
- logoImgSmall?: string;
11
- categoryProduct?: {
12
- name: string;
13
- icon: string;
14
- };
15
- }
16
- export interface StrapiSearchBar {
17
- title: string;
18
- placeholder: string;
19
- }
20
- export interface Routes {
21
- CUSTOM_URL_FROM_APP_SUBDOMAIN: (url: string) => string;
22
- CUSTOM_URL_FROM_TARGET_ADDRESS: (url: string) => string;
23
- LEGAL_DOCUMENTS: string;
24
- LEGAL_DOCUMENTS_WITH_HASH: (category: string) => string;
25
- LEGAL_DOCUMENTS_WITH_CATEGORY: (category: string) => string;
26
- LOGIN: string;
27
- MY_DOCUMENTS: string;
28
- REGISTER: string;
29
- RATAFIA_LOGIN: string;
30
- SIGN_EDITOR: string;
31
- }
32
- export interface DesktopSearchBarProps {
33
- products: Products[];
34
- searchBarTexts: StrapiSearchBar;
35
- routes: Routes;
36
- handleResultClick: (product: string, link: string) => void;
37
- }
@@ -1,40 +0,0 @@
1
- export interface Products {
2
- categoryUrl?: string
3
- isFeatured?: boolean
4
- popularOrder: number
5
- jumboTitle: string
6
- linkText: string
7
- slug: string
8
- footerPopularDocument?: boolean
9
- logoImgBig?: string
10
- logoImgSmall?: string
11
- categoryProduct?: {
12
- name: string
13
- icon: string
14
- }
15
- }
16
-
17
- export interface StrapiSearchBar {
18
- title: string
19
- placeholder: string
20
- }
21
-
22
- export interface Routes {
23
- CUSTOM_URL_FROM_APP_SUBDOMAIN: (url: string) => string
24
- CUSTOM_URL_FROM_TARGET_ADDRESS: (url: string) => string
25
- LEGAL_DOCUMENTS: string
26
- LEGAL_DOCUMENTS_WITH_HASH: (category: string) => string
27
- LEGAL_DOCUMENTS_WITH_CATEGORY: (category: string) => string
28
- LOGIN: string
29
- MY_DOCUMENTS: string
30
- REGISTER: string
31
- RATAFIA_LOGIN: string
32
- SIGN_EDITOR: string
33
- }
34
-
35
- export interface DesktopSearchBarProps {
36
- products: Products[]
37
- searchBarTexts: StrapiSearchBar
38
- routes: Routes
39
- handleResultClick: (product: string, link: string) => void
40
- }
@@ -1,2 +0,0 @@
1
- export { DesktopSearchBar } from './DesktopSearchBar';
2
- export { type DesktopSearchBarProps } from './DesktopSearchBarProps.types';
@@ -1 +0,0 @@
1
- export { DesktopSearchBar } from './DesktopSearchBar';
@@ -1,2 +0,0 @@
1
- export { DesktopSearchBar } from './DesktopSearchBar'
2
- export { type DesktopSearchBarProps } from './DesktopSearchBarProps.types'
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- import { type SearchBarProps } from '../SearchBar/SearchBarProps.types';
3
- export declare const MobileSearchBar: React.FC<SearchBarProps>;
@@ -1,38 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useEffect, useRef } from 'react';
3
- import { DropdownInput } from '../../atoms/DropdownInput/DropdownInput';
4
- import { MobileSearchBarStyled } from './MobileSearchBar.styled';
5
- import { SearchIcon } from '../../../../images/componentsSvg/SearchIcon';
6
- import { useSearchFunction } from '../../../hooks/useSearchFunction';
7
- export const MobileSearchBar = ({ products, searchBarTexts, routes, handleResultClick }) => {
8
- const { results, searchFunction } = useSearchFunction({
9
- products,
10
- searchBarTexts,
11
- routes,
12
- handleResultClick
13
- });
14
- const searchInputRef = useRef(null);
15
- const searchBarContainerRef = useRef(null);
16
- const isResultsVisible = Array.isArray(results) && results.length > 0;
17
- useEffect(() => {
18
- const handleKeyDown = (event) => {
19
- if (event.key === 'Escape') {
20
- searchFunction('');
21
- }
22
- };
23
- const handleClickOutside = (event) => {
24
- if (searchBarContainerRef.current && !searchBarContainerRef.current.contains(event.target)) {
25
- searchFunction('');
26
- }
27
- };
28
- if (isResultsVisible) {
29
- document.addEventListener('keydown', handleKeyDown);
30
- document.addEventListener('mousedown', handleClickOutside);
31
- }
32
- return () => {
33
- document.removeEventListener('keydown', handleKeyDown);
34
- document.removeEventListener('mousedown', handleClickOutside);
35
- };
36
- }, [isResultsVisible, searchFunction]);
37
- return (_jsx(MobileSearchBarStyled, { ref: searchBarContainerRef, children: _jsx(DropdownInput, { ref: searchInputRef, name: 'mobile-and-tablet-search', className: 'search', placeholder: searchBarTexts.placeholder, icon: _jsx(SearchIcon, {}), onChange: searchFunction, results: results }) }));
38
- };
@@ -1 +0,0 @@
1
- export declare const MobileSearchBarStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -1,17 +0,0 @@
1
- import { device } from '../../../globalStyles/breakpoints';
2
- import styled from 'styled-components';
3
- export const MobileSearchBarStyled = styled.div `
4
- display: block;
5
- width: 100%;
6
-
7
- @media ${device['landscape-tablets']} {
8
- display: none;
9
- }
10
-
11
- .dropdown_input {
12
- .search {
13
- width: calc(100% - 3rem);
14
- margin: 0 1.5rem;
15
- }
16
- }
17
- `;
@@ -1,18 +0,0 @@
1
- import { device } from '../../../globalStyles/breakpoints'
2
- import styled from 'styled-components'
3
-
4
- export const MobileSearchBarStyled = styled.div`
5
- display: block;
6
- width: 100%;
7
-
8
- @media ${device['landscape-tablets']} {
9
- display: none;
10
- }
11
-
12
- .dropdown_input {
13
- .search {
14
- width: calc(100% - 3rem);
15
- margin: 0 1.5rem;
16
- }
17
- }
18
- `
@@ -1,55 +0,0 @@
1
- import React, { useEffect, useRef } from 'react'
2
- import { DropdownInput } from '../../atoms/DropdownInput/DropdownInput'
3
- import { MobileSearchBarStyled } from './MobileSearchBar.styled'
4
- import { type SearchBarProps } from '../SearchBar/SearchBarProps.types'
5
- import { SearchIcon } from '../../../../images/componentsSvg/SearchIcon'
6
- import { useSearchFunction } from '../../../hooks/useSearchFunction'
7
-
8
- export const MobileSearchBar: React.FC<SearchBarProps> = ({ products, searchBarTexts, routes, handleResultClick }) => {
9
- const { results, searchFunction } = useSearchFunction({
10
- products,
11
- searchBarTexts,
12
- routes,
13
- handleResultClick
14
- })
15
- const searchInputRef = useRef<HTMLInputElement>(null)
16
- const searchBarContainerRef = useRef<HTMLDivElement>(null)
17
- const isResultsVisible = Array.isArray(results) && results.length > 0
18
-
19
- useEffect(() => {
20
- const handleKeyDown = (event: KeyboardEvent) => {
21
- if (event.key === 'Escape') {
22
- searchFunction('')
23
- }
24
- }
25
- const handleClickOutside = (event: MouseEvent) => {
26
- if (searchBarContainerRef.current && !searchBarContainerRef.current.contains(event.target as Node)) {
27
- searchFunction('')
28
- }
29
- }
30
-
31
- if (isResultsVisible) {
32
- document.addEventListener('keydown', handleKeyDown)
33
- document.addEventListener('mousedown', handleClickOutside)
34
- }
35
-
36
- return () => {
37
- document.removeEventListener('keydown', handleKeyDown)
38
- document.removeEventListener('mousedown', handleClickOutside)
39
- }
40
- }, [isResultsVisible, searchFunction])
41
-
42
- return (
43
- <MobileSearchBarStyled ref={searchBarContainerRef}>
44
- <DropdownInput
45
- ref={searchInputRef}
46
- name='mobile-and-tablet-search'
47
- className='search'
48
- placeholder={searchBarTexts.placeholder}
49
- icon={<SearchIcon />}
50
- onChange={searchFunction}
51
- results={results}
52
- />
53
- </MobileSearchBarStyled>
54
- )
55
- }
@@ -1,37 +0,0 @@
1
- export interface Products {
2
- categoryUrl?: string;
3
- isFeatured?: boolean;
4
- popularOrder: number;
5
- jumboTitle: string;
6
- linkText: string;
7
- slug: string;
8
- footerPopularDocument?: boolean;
9
- logoImgBig?: string;
10
- logoImgSmall?: string;
11
- categoryProduct?: {
12
- name: string;
13
- icon: string;
14
- };
15
- }
16
- export interface StrapiSearchBar {
17
- title: string;
18
- placeholder: string;
19
- }
20
- export interface Routes {
21
- CUSTOM_URL_FROM_APP_SUBDOMAIN: (url: string) => string;
22
- CUSTOM_URL_FROM_TARGET_ADDRESS: (url: string) => string;
23
- LEGAL_DOCUMENTS: string;
24
- LEGAL_DOCUMENTS_WITH_HASH: (category: string) => string;
25
- LEGAL_DOCUMENTS_WITH_CATEGORY: (category: string) => string;
26
- LOGIN: string;
27
- MY_DOCUMENTS: string;
28
- REGISTER: string;
29
- RATAFIA_LOGIN: string;
30
- SIGN_EDITOR: string;
31
- }
32
- export interface SearchBarProps {
33
- products: Products[];
34
- searchBarTexts: StrapiSearchBar;
35
- routes: Routes;
36
- handleResultClick: (product: string, link: string) => void;
37
- }
@@ -1,40 +0,0 @@
1
- export interface Products {
2
- categoryUrl?: string
3
- isFeatured?: boolean
4
- popularOrder: number
5
- jumboTitle: string
6
- linkText: string
7
- slug: string
8
- footerPopularDocument?: boolean
9
- logoImgBig?: string
10
- logoImgSmall?: string
11
- categoryProduct?: {
12
- name: string
13
- icon: string
14
- }
15
- }
16
-
17
- export interface StrapiSearchBar {
18
- title: string
19
- placeholder: string
20
- }
21
-
22
- export interface Routes {
23
- CUSTOM_URL_FROM_APP_SUBDOMAIN: (url: string) => string
24
- CUSTOM_URL_FROM_TARGET_ADDRESS: (url: string) => string
25
- LEGAL_DOCUMENTS: string
26
- LEGAL_DOCUMENTS_WITH_HASH: (category: string) => string
27
- LEGAL_DOCUMENTS_WITH_CATEGORY: (category: string) => string
28
- LOGIN: string
29
- MY_DOCUMENTS: string
30
- REGISTER: string
31
- RATAFIA_LOGIN: string
32
- SIGN_EDITOR: string
33
- }
34
-
35
- export interface SearchBarProps {
36
- products: Products[]
37
- searchBarTexts: StrapiSearchBar
38
- routes: Routes
39
- handleResultClick: (product: string, link: string) => void
40
- }
@@ -1,2 +0,0 @@
1
- export { MobileSearchBar } from './MobileSearchBar';
2
- export { type SearchBarProps } from './MobileSearchBarProps.types';
@@ -1 +0,0 @@
1
- export { MobileSearchBar } from './MobileSearchBar';
@@ -1,2 +0,0 @@
1
- export { MobileSearchBar } from './MobileSearchBar'
2
- export { type SearchBarProps } from './MobileSearchBarProps.types'
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- import { type SearchBarProps } from '../components/molecules/SearchBar/SearchBarProps.types';
3
- interface SearchFunctionProps extends SearchBarProps {
4
- onClose?: () => void;
5
- }
6
- export declare const useSearchFunction: (props: SearchFunctionProps) => {
7
- results: React.JSX.Element[];
8
- searchFunction: (text: string) => void;
9
- };
10
- export {};
@@ -1,28 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useState } from 'react';
3
- export const useSearchFunction = (props) => {
4
- const [results, setResults] = useState([]);
5
- const searchFunction = (text) => {
6
- const { products, searchBarTexts, routes, handleResultClick, onClose } = props;
7
- const searchTerm = text.toLowerCase();
8
- const productsFiltered = products.filter((item) => item.linkText.toLowerCase().includes(searchTerm));
9
- const newResults = productsFiltered
10
- .map((item) => {
11
- const product = item.linkText;
12
- const preMatch = product.slice(0, product.toLowerCase().indexOf(searchTerm));
13
- const match = product.slice(product.toLowerCase().indexOf(searchTerm), preMatch.length + searchTerm.length);
14
- const postMatch = product.slice(product.toLowerCase().indexOf(searchTerm) + searchTerm.length, product.length);
15
- const link = item.categoryUrl ? `${item.categoryUrl}/${item.slug}` : item.slug;
16
- return (_jsx("li", { className: 'dropdown_input__item', children: _jsxs("a", { href: routes.CUSTOM_URL_FROM_TARGET_ADDRESS(link), className: 'dropdown_input__link', onClick: (e) => {
17
- e.preventDefault();
18
- handleResultClick(product, routes.CUSTOM_URL_FROM_TARGET_ADDRESS(link));
19
- if (onClose)
20
- onClose();
21
- }, title: product, children: [preMatch, _jsx("strong", { className: 'dropdown_input__link__emphasis', children: match }), postMatch] }) }, item.linkText));
22
- })
23
- .slice(0, 9);
24
- newResults.push(_jsx("li", { className: 'dropdown_input__item', children: _jsx("a", { className: 'dropdown_input__link--all', title: searchBarTexts.title, href: routes.LEGAL_DOCUMENTS, onClick: onClose, children: searchBarTexts.title }) }, searchBarTexts.title));
25
- setResults(newResults);
26
- };
27
- return { results, searchFunction };
28
- };