@julseb-lib/react 0.0.3 → 0.0.4
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/index.cjs.js +1 -1
- package/dist/index.es.js +3 -3
- package/dist/index.umd.js +1 -1
- package/dist/lib/components/Header/HeaderNav.tsx +13 -11
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -3642,7 +3642,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
3642
3642
|
@media ${I.MOBILE} {
|
|
3643
3643
|
max-width: 100%;
|
|
3644
3644
|
}
|
|
3645
|
-
`;S([t3,m0,s0,S6,I6,N6,E6]);const g1=n.forwardRef(({"data-testid":l,className:e,isOpen:c,navMobileVariant:t,variant:h,burgerColor:d,handleOpen:r,handleClose:i},f)=>{const o=()=>d?typeof d=="string"?d:c?d.open:d.closed:t==="drawer"&&c||h==="primary"||t==="full"||t==="top"&&c&&h==="transparent"?"white":"primary";return a.jsx(s0,{"data-testid":l&&`${l}.HeaderBurger`,ref:f,className:e&&"HeaderBurger",isOpen:c,onClick:()=>{c?i():r()},width:32,height:24,color:o()})});function h3({"data-testid":l,className:e,search:c,handleClose:t}){if(!c)return null;const{maxWidth:h,placeholder:d,iconLeft:r,iconLeftSize:i,iconClear:f,iconClearSize:o,iconBaseUrl:p,inputBackground:z,inputVariant:v,keyboardShortcut:k,showKeys:b,pathname:M,queries:C}=c,x=p2.useNavigate(),[H,$]=n.useState(""),R=V=>$(V.target.value),A=()=>$(""),_=V=>{V.preventDefault(),x({pathname:M,search:p2.createSearchParams({query:H,...Object.fromEntries(C||[])}).toString()}),$(""),t()};return a.jsx(E6,{"data-testid":l&&`${l}.HeaderSearch`,className:e&&"HeaderSearch",onSubmit:_,role:"search",$maxWidth:h,children:a.jsx(x3,{"data-testid":l&&`${l}.SearchInput`,className:e&&"SearchInput",type:"search",clearSearch:A,onChange:R,value:H,placeholder:d,icon:r,iconSize:i,iconClear:f,iconClearSize:o,inputBackground:z,inputVariant:v,focusKeys:k,showKeys:b,iconBaseUrl:p})})}function Ad({"data-testid":l,link:e,className:c}){return e.to?a.jsx(p2.NavLink,{"data-testid":e["data-testid"]||l&&`${l}.NavLink`,className:e.className||c&&"NavLink",id:e.id,ref:e.ref,to:e.to,end:e.end,target:e.blank?"_blank":void 0,rel:e.blank?"noreferrer noopener":void 0,children:e.text}):e.href?a.jsx("a",{"data-testid":e["data-testid"]||l&&`${l}.NavLink`,className:e.className||c&&"NavLink",id:e.id,ref:e.ref,href:e.href,target:e.blank?"_blank":void 0,rel:e.blank?"noreferrer noopener":void 0,children:e.text}):e.onClick?a.jsx("button",{"data-testid":e["data-testid"]||l&&`${l}.NavButton`,className:e.className||c&&"NavButton",id:e.id,ref:e.ref,onClick:e.onClick,disabled:e.disabled,children:e.text}):null}function k1({"data-testid":l,className:e,search:c,isOpen:t,children:h,links:d,headerHeight:r,variant:i,navMobileVariant:f,burgerPosition:o,burgerRef:p,handleClose:z}){const v=R0(600),k=n.useRef(null);N2(k,H=>{var $;($=p==null?void 0:p.current)!=null&&$.contains(H.target)||z()});const b=d||h,M=v&&c?32:0,C=
|
|
3645
|
+
`;S([t3,m0,s0,S6,I6,N6,E6]);const g1=n.forwardRef(({"data-testid":l,className:e,isOpen:c,navMobileVariant:t,variant:h,burgerColor:d,handleOpen:r,handleClose:i},f)=>{const o=()=>d?typeof d=="string"?d:c?d.open:d.closed:t==="drawer"&&c||h==="primary"||t==="full"||t==="top"&&c&&h==="transparent"?"white":"primary";return a.jsx(s0,{"data-testid":l&&`${l}.HeaderBurger`,ref:f,className:e&&"HeaderBurger",isOpen:c,onClick:()=>{c?i():r()},width:32,height:24,color:o()})});function h3({"data-testid":l,className:e,search:c,handleClose:t}){if(!c)return null;const{maxWidth:h,placeholder:d,iconLeft:r,iconLeftSize:i,iconClear:f,iconClearSize:o,iconBaseUrl:p,inputBackground:z,inputVariant:v,keyboardShortcut:k,showKeys:b,pathname:M,queries:C}=c,x=p2.useNavigate(),[H,$]=n.useState(""),R=V=>$(V.target.value),A=()=>$(""),_=V=>{V.preventDefault(),x({pathname:M,search:p2.createSearchParams({query:H,...Object.fromEntries(C||[])}).toString()}),$(""),t()};return a.jsx(E6,{"data-testid":l&&`${l}.HeaderSearch`,className:e&&"HeaderSearch",onSubmit:_,role:"search",$maxWidth:h,children:a.jsx(x3,{"data-testid":l&&`${l}.SearchInput`,className:e&&"SearchInput",type:"search",clearSearch:A,onChange:R,value:H,placeholder:d,icon:r,iconSize:i,iconClear:f,iconClearSize:o,inputBackground:z,inputVariant:v,focusKeys:k,showKeys:b,iconBaseUrl:p})})}function Ad({"data-testid":l,link:e,className:c}){return e.to?a.jsx(p2.NavLink,{"data-testid":e["data-testid"]||l&&`${l}.NavLink`,className:e.className||c&&"NavLink",id:e.id,ref:e.ref,to:e.to,end:e.end,target:e.blank?"_blank":void 0,rel:e.blank?"noreferrer noopener":void 0,children:e.text}):e.href?a.jsx("a",{"data-testid":e["data-testid"]||l&&`${l}.NavLink`,className:e.className||c&&"NavLink",id:e.id,ref:e.ref,href:e.href,target:e.blank?"_blank":void 0,rel:e.blank?"noreferrer noopener":void 0,children:e.text}):e.onClick?a.jsx("button",{"data-testid":e["data-testid"]||l&&`${l}.NavButton`,className:e.className||c&&"NavButton",id:e.id,ref:e.ref,onClick:e.onClick,disabled:e.disabled,children:e.text}):null}function k1({"data-testid":l,className:e,search:c,isOpen:t,children:h,links:d,headerHeight:r,variant:i,navMobileVariant:f,burgerPosition:o,burgerRef:p,handleClose:z}){const v=R0(600),k=n.useRef(null);N2(k,H=>{var $;($=p==null?void 0:p.current)!=null&&$.contains(H.target)||z()});const b=d||h,M=v&&c?32:0,C=d?d.length*24+([...b,M].length-1)*12:56,x=M+C;return a.jsxs(I6,{"data-testid":l&&`${l}.HeaderNav`,ref:k,className:O({HeaderNav:e},{Open:t}),$headerHeight:r,$variant:i,$burgerPosition:o,$navMobileVariant:f,$navHeight:x,children:[v&&c&&a.jsx(h3,{...c,"data-testid":l,className:e,handleClose:z}),d?d.map(H=>a.jsx(Ad,{"data-testid":l,className:e,link:H},y.uuid())):null,h&&h]})}function Ld({"data-testid":l,className:e,logo:c,children:t,isOpen:h}){const{to:d="/",href:r,img:i,imgOpen:f,alt:o="Logo",width:p=100,height:z=30}=c;if(i){const v={"data-testid":l&&`${l}.HeaderLogo.Img`,className:e&&"HeaderLogoImg",src:f&&h?f:i,alt:o,width:p,height:z};return r?a.jsx("a",{href:r,"data-testid":l&&`${l}.HeaderLogo`,className:e&&"HeaderLogo",children:a.jsx(t3,{...v})}):a.jsx(p2.Link,{"data-testid":l&&`${l}.HeaderLogo`,className:e&&"HeaderLogo",to:d,children:a.jsx(t3,{...v})})}return a.jsx(m0,{"data-testid":l&&`${l}.HeaderLogo`,as:r?"a":p2.Link,className:e&&"HeaderLogo",to:d,href:r,translate:"no",children:t})}const V6=n.forwardRef(({"data-testid":l,as:e,children:c,className:t,logo:h,variant:d="primary",burgerPosition:r="right",navDesktopVariant:i="right",navMobileVariant:f="drawer",search:o,position:p="relative",hideOnScroll:z,links:v,enableScrollingOpen:k,...b},M)=>{const[C,x]=n.useState(!1),H=()=>{k||y.disableScroll(),x(!0)},$=()=>{k||y.enableScroll(),setTimeout(()=>x(!1),10)},R=R0(600),A=typeof h=="object"?h:void 0,B=[(A==null?void 0:A.height)||30,32,35].sort(),l2=B[B.length-1]+16*2,[K,Y]=n.useState(!1),F=typeof z=="boolean"?400:z;n.useEffect(()=>{F&&(window.pageYOffset>=F?Y(!0):Y(!1),window.addEventListener("scroll",()=>{window.pageYOffset>=F?Y(!0):Y(!1)}))},[F]);const T=n.useRef(null);a0("Escape",()=>{C&&$()});const X={"data-testid":l,className:t,isOpen:C,navMobileVariant:f,variant:d,ref:T,handleOpen:H,handleClose:$},Q={"data-testid":l,className:t,search:o,isOpen:C,handleClose:$,links:v,children:c,headerHeight:l2,variant:d,navMobileVariant:f,burgerPosition:r,burgerRef:T},i2={"data-testid":l,className:t,search:o,handleClose:$};return a.jsxs(S6,{"data-testid":l,ref:M,as:e,className:O(t,{Hidden:K},{Open:C}),$burgerPosition:r,$headerHeight:l2,$position:p,$variant:d,...b,children:[r==="left"&&a.jsx(g1,{...X}),a.jsx(Ld,{"data-testid":l,className:t,logo:h,isOpen:C,children:typeof h=="object"?h.text:h}),i==="left"&&a.jsx(k1,{...Q}),!R&&i==="right"&&a.jsx(h3,{...i2}),r==="right"&&a.jsx(g1,{...X}),i==="right"&&a.jsx(k1,{...Q}),R&&f==="drawer"&&a.jsx(N6,{onClick:()=>x(!1),className:O({HeaderOverlay:t},{Visible:C})}),!R&&i==="left"&&a.jsx(h3,{...i2})]})}),S2=48,D6=m.nav`
|
|
3646
3646
|
${s.Position};
|
|
3647
3647
|
width: ${S2}px;
|
|
3648
3648
|
height: ${S2}px;
|
package/dist/index.es.js
CHANGED
|
@@ -19895,7 +19895,7 @@ function _1({
|
|
|
19895
19895
|
var $;
|
|
19896
19896
|
($ = o == null ? void 0 : o.current) != null && $.contains(x.target) || p();
|
|
19897
19897
|
});
|
|
19898
|
-
const g = d || h, v = z && e ? 32 : 0, H =
|
|
19898
|
+
const g = d || h, v = z && e ? 32 : 0, H = d ? d.length * 24 + ([...g, v].length - 1) * 12 : 56, w = v + H;
|
|
19899
19899
|
return /* @__PURE__ */ a.jsxs(
|
|
19900
19900
|
C6,
|
|
19901
19901
|
{
|
|
@@ -19917,7 +19917,7 @@ function _1({
|
|
|
19917
19917
|
handleClose: p
|
|
19918
19918
|
}
|
|
19919
19919
|
),
|
|
19920
|
-
d
|
|
19920
|
+
d ? d.map((x) => /* @__PURE__ */ a.jsx(
|
|
19921
19921
|
md,
|
|
19922
19922
|
{
|
|
19923
19923
|
"data-testid": l,
|
|
@@ -19925,7 +19925,7 @@ function _1({
|
|
|
19925
19925
|
link: x
|
|
19926
19926
|
},
|
|
19927
19927
|
J()
|
|
19928
|
-
)),
|
|
19928
|
+
)) : null,
|
|
19929
19929
|
h && h
|
|
19930
19930
|
]
|
|
19931
19931
|
}
|
package/dist/index.umd.js
CHANGED
|
@@ -3642,7 +3642,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
3642
3642
|
@media ${N.MOBILE} {
|
|
3643
3643
|
max-width: 100%;
|
|
3644
3644
|
}
|
|
3645
|
-
`;_([H3,f0,r0,M6,g6,k6,b6]);const w6=n.forwardRef(({"data-testid":l,className:c,isOpen:e,navMobileVariant:t,variant:h,burgerColor:d,handleOpen:f,handleClose:i},r)=>{const o=()=>d?typeof d=="string"?d:e?d.open:d.closed:t==="drawer"&&e||h==="primary"||t==="full"||t==="top"&&e&&h==="transparent"?"white":"primary";return a.jsx(r0,{"data-testid":l&&`${l}.HeaderBurger`,ref:r,className:c&&"HeaderBurger",isOpen:e,onClick:()=>{e?i():f()},width:32,height:24,color:o()})});function C3({"data-testid":l,className:c,search:e,handleClose:t}){if(!e)return null;const{maxWidth:h,placeholder:d,iconLeft:f,iconLeftSize:i,iconClear:r,iconClearSize:o,iconBaseUrl:z,inputBackground:p,inputVariant:v,keyboardShortcut:k,showKeys:b,pathname:g,queries:A}=e,H=z2.useNavigate(),[y,R]=n.useState(""),L=D=>R(D.target.value),$=()=>R(""),I=D=>{D.preventDefault(),H({pathname:g,search:z2.createSearchParams({query:y,...Object.fromEntries(A||[])}).toString()}),R(""),t()};return a.jsx(b6,{"data-testid":l&&`${l}.HeaderSearch`,className:c&&"HeaderSearch",onSubmit:I,role:"search",$maxWidth:h,children:a.jsx(m3,{"data-testid":l&&`${l}.SearchInput`,className:c&&"SearchInput",type:"search",clearSearch:$,onChange:L,value:y,placeholder:d,icon:f,iconSize:i,iconClear:r,iconClearSize:o,inputBackground:p,inputVariant:v,focusKeys:k,showKeys:b,iconBaseUrl:z})})}function R9({"data-testid":l,link:c,className:e}){return c.to?a.jsx(z2.NavLink,{"data-testid":c["data-testid"]||l&&`${l}.NavLink`,className:c.className||e&&"NavLink",id:c.id,ref:c.ref,to:c.to,end:c.end,target:c.blank?"_blank":void 0,rel:c.blank?"noreferrer noopener":void 0,children:c.text}):c.href?a.jsx("a",{"data-testid":c["data-testid"]||l&&`${l}.NavLink`,className:c.className||e&&"NavLink",id:c.id,ref:c.ref,href:c.href,target:c.blank?"_blank":void 0,rel:c.blank?"noreferrer noopener":void 0,children:c.text}):c.onClick?a.jsx("button",{"data-testid":c["data-testid"]||l&&`${l}.NavButton`,className:c.className||e&&"NavButton",id:c.id,ref:c.ref,onClick:c.onClick,disabled:c.disabled,children:c.text}):null}function u6({"data-testid":l,className:c,search:e,isOpen:t,children:h,links:d,headerHeight:f,variant:i,navMobileVariant:r,burgerPosition:o,burgerRef:z,handleClose:p}){const v=u0(600),k=n.useRef(null);_2(k,y=>{var R;(R=z==null?void 0:z.current)!=null&&R.contains(y.target)||p()});const b=d||h,g=v&&e?32:0,A=
|
|
3645
|
+
`;_([H3,f0,r0,M6,g6,k6,b6]);const w6=n.forwardRef(({"data-testid":l,className:c,isOpen:e,navMobileVariant:t,variant:h,burgerColor:d,handleOpen:f,handleClose:i},r)=>{const o=()=>d?typeof d=="string"?d:e?d.open:d.closed:t==="drawer"&&e||h==="primary"||t==="full"||t==="top"&&e&&h==="transparent"?"white":"primary";return a.jsx(r0,{"data-testid":l&&`${l}.HeaderBurger`,ref:r,className:c&&"HeaderBurger",isOpen:e,onClick:()=>{e?i():f()},width:32,height:24,color:o()})});function C3({"data-testid":l,className:c,search:e,handleClose:t}){if(!e)return null;const{maxWidth:h,placeholder:d,iconLeft:f,iconLeftSize:i,iconClear:r,iconClearSize:o,iconBaseUrl:z,inputBackground:p,inputVariant:v,keyboardShortcut:k,showKeys:b,pathname:g,queries:A}=e,H=z2.useNavigate(),[y,R]=n.useState(""),L=D=>R(D.target.value),$=()=>R(""),I=D=>{D.preventDefault(),H({pathname:g,search:z2.createSearchParams({query:y,...Object.fromEntries(A||[])}).toString()}),R(""),t()};return a.jsx(b6,{"data-testid":l&&`${l}.HeaderSearch`,className:c&&"HeaderSearch",onSubmit:I,role:"search",$maxWidth:h,children:a.jsx(m3,{"data-testid":l&&`${l}.SearchInput`,className:c&&"SearchInput",type:"search",clearSearch:$,onChange:L,value:y,placeholder:d,icon:f,iconSize:i,iconClear:r,iconClearSize:o,inputBackground:p,inputVariant:v,focusKeys:k,showKeys:b,iconBaseUrl:z})})}function R9({"data-testid":l,link:c,className:e}){return c.to?a.jsx(z2.NavLink,{"data-testid":c["data-testid"]||l&&`${l}.NavLink`,className:c.className||e&&"NavLink",id:c.id,ref:c.ref,to:c.to,end:c.end,target:c.blank?"_blank":void 0,rel:c.blank?"noreferrer noopener":void 0,children:c.text}):c.href?a.jsx("a",{"data-testid":c["data-testid"]||l&&`${l}.NavLink`,className:c.className||e&&"NavLink",id:c.id,ref:c.ref,href:c.href,target:c.blank?"_blank":void 0,rel:c.blank?"noreferrer noopener":void 0,children:c.text}):c.onClick?a.jsx("button",{"data-testid":c["data-testid"]||l&&`${l}.NavButton`,className:c.className||e&&"NavButton",id:c.id,ref:c.ref,onClick:c.onClick,disabled:c.disabled,children:c.text}):null}function u6({"data-testid":l,className:c,search:e,isOpen:t,children:h,links:d,headerHeight:f,variant:i,navMobileVariant:r,burgerPosition:o,burgerRef:z,handleClose:p}){const v=u0(600),k=n.useRef(null);_2(k,y=>{var R;(R=z==null?void 0:z.current)!=null&&R.contains(y.target)||p()});const b=d||h,g=v&&e?32:0,A=d?d.length*24+([...b,g].length-1)*12:56,H=g+A;return a.jsxs(g6,{"data-testid":l&&`${l}.HeaderNav`,ref:k,className:O({HeaderNav:c},{Open:t}),$headerHeight:f,$variant:i,$burgerPosition:o,$navMobileVariant:r,$navHeight:H,children:[v&&e&&a.jsx(C3,{...e,"data-testid":l,className:c,handleClose:p}),d?d.map(y=>a.jsx(R9,{"data-testid":l,className:c,link:y},C.uuid())):null,h&&h]})}function L9({"data-testid":l,className:c,logo:e,children:t,isOpen:h}){const{to:d="/",href:f,img:i,imgOpen:r,alt:o="Logo",width:z=100,height:p=30}=e;if(i){const v={"data-testid":l&&`${l}.HeaderLogo.Img`,className:c&&"HeaderLogoImg",src:r&&h?r:i,alt:o,width:z,height:p};return f?a.jsx("a",{href:f,"data-testid":l&&`${l}.HeaderLogo`,className:c&&"HeaderLogo",children:a.jsx(H3,{...v})}):a.jsx(z2.Link,{"data-testid":l&&`${l}.HeaderLogo`,className:c&&"HeaderLogo",to:d,children:a.jsx(H3,{...v})})}return a.jsx(f0,{"data-testid":l&&`${l}.HeaderLogo`,as:f?"a":z2.Link,className:c&&"HeaderLogo",to:d,href:f,translate:"no",children:t})}const x6=n.forwardRef(({"data-testid":l,as:c,children:e,className:t,logo:h,variant:d="primary",burgerPosition:f="right",navDesktopVariant:i="right",navMobileVariant:r="drawer",search:o,position:z="relative",hideOnScroll:p,links:v,enableScrollingOpen:k,...b},g)=>{const[A,H]=n.useState(!1),y=()=>{k||C.disableScroll(),H(!0)},R=()=>{k||C.enableScroll(),setTimeout(()=>H(!1),10)},L=u0(600),$=typeof h=="object"?h:void 0,Y=[($==null?void 0:$.height)||30,32,35].sort(),c2=Y[Y.length-1]+16*2,[X,F]=n.useState(!1),U=typeof p=="boolean"?400:p;n.useEffect(()=>{U&&(window.pageYOffset>=U?F(!0):F(!1),window.addEventListener("scroll",()=>{window.pageYOffset>=U?F(!0):F(!1)}))},[U]);const G=n.useRef(null);J2("Escape",()=>{A&&R()});const Q={"data-testid":l,className:t,isOpen:A,navMobileVariant:r,variant:d,ref:G,handleOpen:y,handleClose:R},q={"data-testid":l,className:t,search:o,isOpen:A,handleClose:R,links:v,children:e,headerHeight:c2,variant:d,navMobileVariant:r,burgerPosition:f,burgerRef:G},f2={"data-testid":l,className:t,search:o,handleClose:R};return a.jsxs(M6,{"data-testid":l,ref:g,as:c,className:O(t,{Hidden:X},{Open:A}),$burgerPosition:f,$headerHeight:c2,$position:z,$variant:d,...b,children:[f==="left"&&a.jsx(w6,{...Q}),a.jsx(L9,{"data-testid":l,className:t,logo:h,isOpen:A,children:typeof h=="object"?h.text:h}),i==="left"&&a.jsx(u6,{...q}),!L&&i==="right"&&a.jsx(C3,{...f2}),f==="right"&&a.jsx(w6,{...Q}),i==="right"&&a.jsx(u6,{...q}),L&&r==="drawer"&&a.jsx(k6,{onClick:()=>H(!1),className:O({HeaderOverlay:t},{Visible:A})}),!L&&i==="left"&&a.jsx(C3,{...f2})]})}),D2=48,H6=m.nav`
|
|
3646
3646
|
${s.Position};
|
|
3647
3647
|
width: ${D2}px;
|
|
3648
3648
|
height: ${D2}px;
|
|
@@ -36,8 +36,9 @@ export function HeaderNav({
|
|
|
36
36
|
|
|
37
37
|
const searchHeight = isMobile && !!search ? 32 : 0
|
|
38
38
|
|
|
39
|
-
const linksHeight =
|
|
40
|
-
|
|
39
|
+
const linksHeight = links
|
|
40
|
+
? links.length * 24 + ([...valueArr, searchHeight].length - 1) * 12
|
|
41
|
+
: 56
|
|
41
42
|
|
|
42
43
|
const navHeight = searchHeight + linksHeight
|
|
43
44
|
|
|
@@ -61,15 +62,16 @@ export function HeaderNav({
|
|
|
61
62
|
/>
|
|
62
63
|
)}
|
|
63
64
|
|
|
64
|
-
{links
|
|
65
|
-
links.map(link => (
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
65
|
+
{links
|
|
66
|
+
? links.map(link => (
|
|
67
|
+
<HeaderNavLink
|
|
68
|
+
data-testid={testid}
|
|
69
|
+
className={className}
|
|
70
|
+
link={link}
|
|
71
|
+
key={uuid()}
|
|
72
|
+
/>
|
|
73
|
+
))
|
|
74
|
+
: null}
|
|
73
75
|
|
|
74
76
|
{children && children}
|
|
75
77
|
</Nav>
|