@kvdbil/components 13.9.0 → 13.9.2
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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),n=require("../../typography/Heading/index.js"),r=require("../Button/index.js"),i=require("../../shared/media-queries.js");function
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),n=require("../../typography/Heading/index.js"),r=require("../Button/index.js"),i=require("../../shared/media-queries.js");function a(w){return w&&typeof w=="object"&&"default"in w?w:{default:w}}require("../../theme.js"),require("../Spinner/index.js"),require("../../typography/ButtonText/index.js"),require("../Button/styles.js");var o=a(e),l=a(t);const d=l.default.div`
|
|
2
2
|
position: relative;
|
|
3
3
|
min-height: 440px;
|
|
4
4
|
display: flex;
|
|
@@ -14,38 +14,38 @@
|
|
|
14
14
|
|
|
15
15
|
100% {
|
|
16
16
|
background-color:#f5f5f5;
|
|
17
|
-
}`,
|
|
17
|
+
}`,s=l.default.div`
|
|
18
18
|
width: 100%;
|
|
19
19
|
height: 440px;
|
|
20
20
|
animation: ${u} 2s linear infinite;
|
|
21
|
-
`,
|
|
22
|
-
pointer-events: ${({$pointerEvents:
|
|
21
|
+
`,c=l.default.div`
|
|
22
|
+
pointer-events: ${({$pointerEvents:w})=>w};
|
|
23
23
|
display: flex;
|
|
24
|
-
flex-direction: ${({$direction:
|
|
25
|
-
align-items: ${({$align:
|
|
26
|
-
justify-content: ${({$justify:
|
|
24
|
+
flex-direction: ${({$direction:w})=>w};
|
|
25
|
+
align-items: ${({$align:w})=>w};
|
|
26
|
+
justify-content: ${({$justify:w})=>w};
|
|
27
27
|
padding: 3rem 1.5rem;
|
|
28
28
|
z-index: 1;
|
|
29
29
|
flex: 1;
|
|
30
|
-
|
|
30
|
+
`,p=l.default.iframe`
|
|
31
31
|
position: absolute;
|
|
32
32
|
width: 100%;
|
|
33
33
|
height: 100%;
|
|
34
34
|
top: 0;
|
|
35
35
|
left: 0;
|
|
36
|
-
|
|
36
|
+
`,$=w=>typeof w=="number",m=w=>typeof w=="string",f=l.default.div`
|
|
37
37
|
width: 100%;
|
|
38
38
|
min-height: 440px;
|
|
39
39
|
display: flex;
|
|
40
40
|
flex-direction: column;
|
|
41
41
|
|
|
42
|
-
${({$centered:
|
|
42
|
+
${({$centered:w})=>w&&"justify-content: center;"}
|
|
43
43
|
|
|
44
|
-
${({$url:v
|
|
45
|
-
background: url('${
|
|
44
|
+
${({$url:w,...v})=>w&&`
|
|
45
|
+
background: url('${w}');
|
|
46
46
|
background-repeat: no-repeat;
|
|
47
47
|
background-size: cover;
|
|
48
|
-
background-position: ${(({$positionX:j,$positionY:q})
|
|
48
|
+
background-position: ${(({$positionX:j,$positionY:q})=>$(j)&&$(q)?`${j}% ${q}%`:m(j)&&m(q)?`${j} ${q}`:j||q?`${($(j)?`${j}%`:j)||"50%"} ${($(q)?`${q}%`:q)||"50%"}`:"50% 50%")(v)};
|
|
49
49
|
`}
|
|
50
50
|
`,g=l.default.div`
|
|
51
51
|
padding-left: 1rem;
|
|
@@ -55,46 +55,53 @@
|
|
|
55
55
|
padding-left: 1.5rem;
|
|
56
56
|
padding-right: 1.5rem;
|
|
57
57
|
}
|
|
58
|
-
`,
|
|
59
|
-
${({$centered:
|
|
58
|
+
`,x=l.default.div`
|
|
59
|
+
${({$centered:w})=>!w&&"margin-top: 3rem;"}
|
|
60
60
|
|
|
61
|
-
${({$centered:
|
|
61
|
+
${({$centered:w})=>w&&`
|
|
62
62
|
display: flex;
|
|
63
63
|
flex-direction: column;
|
|
64
64
|
align-items: center;
|
|
65
65
|
text-align: center;
|
|
66
66
|
`}
|
|
67
67
|
|
|
68
|
-
${({$maxWidth:
|
|
68
|
+
${({$maxWidth:w,$dynamicGutter:v})=>!v&&`
|
|
69
69
|
width: 100%;
|
|
70
70
|
margin-left: auto;
|
|
71
71
|
margin-right: auto;
|
|
72
|
-
max-width: ${
|
|
72
|
+
max-width: ${w}rem;
|
|
73
73
|
`}
|
|
74
74
|
|
|
75
|
-
${({$dynamicGutter:
|
|
75
|
+
${({$dynamicGutter:w})=>w&&`
|
|
76
76
|
${i.mq("tablet")} {
|
|
77
|
-
margin-left: ${
|
|
78
|
-
margin-right: ${
|
|
77
|
+
margin-left: ${w.tabletVw}vw;
|
|
78
|
+
margin-right: ${w.tabletVw}vw;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
${i.mq("laptop")} {
|
|
82
|
-
margin-left: ${
|
|
83
|
-
margin-right: ${
|
|
82
|
+
margin-left: ${w.laptopVw}vw;
|
|
83
|
+
margin-right: ${w.laptopVw}vw;
|
|
84
84
|
}
|
|
85
85
|
`}
|
|
86
86
|
|
|
87
87
|
${i.mq("laptop")} {
|
|
88
|
-
${({$centered:
|
|
88
|
+
${({$centered:w})=>!w&&"margin-top: 3.75rem;"}
|
|
89
89
|
}
|
|
90
|
-
`,
|
|
90
|
+
`,h=l.default(n.Display3)`
|
|
91
91
|
margin: 0;
|
|
92
|
-
color: ${({$color:
|
|
93
|
-
|
|
92
|
+
color: ${({$color:w,theme:v})=>v.colors.text[w]};
|
|
93
|
+
|
|
94
|
+
${({shadow:w})=>w&&"text-shadow: 4px 4px 6px rgba(0, 0, 0, 0.2);"}
|
|
95
|
+
`,y=l.default(n.Title)`
|
|
94
96
|
margin: 0.25rem 0;
|
|
95
|
-
color: ${({$color:
|
|
97
|
+
color: ${({$color:w,theme:v})=>v.colors.text[w]};
|
|
98
|
+
|
|
99
|
+
${({shadow:w})=>w&&"text-shadow: 4px 4px 6px rgba(0, 0, 0, 0.2);"}
|
|
96
100
|
`,b=l.default.a`
|
|
97
101
|
display: inline-block;
|
|
98
102
|
margin-top: 3rem;
|
|
99
103
|
text-decoration: none;
|
|
100
|
-
|
|
104
|
+
|
|
105
|
+
${({shadow:w})=>w&&`box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, 0.1),
|
|
106
|
+
0px 3px 14px 0px rgba(0, 0, 0, 0.09), 0px 4px 5px 0px rgba(0, 0, 0, 0.15);`}
|
|
107
|
+
`;exports.colorAnimation=u,exports.default=({imageProps:w,videoProps:v,children:j,align:q,direction:W,justify:B,contentMaxWidth:I=64,heading:k,headingColor:S="dark",subheading:G,buttonProps:E,dynamicGutter:M,isLoading:T=!1,contentCentered:V=!1,containerStyle:X,elementShadow:P=!1})=>{const{autoplay:Y=0,controls:_=0,disablekb:A=0,end:z,loop:D=0,modestbranding:F=1,start:H=0,showInfo:L=0}=(v==null?void 0:v.ytConfig)||{},{link:O,text:J,color:C,...K}=E!=null?E:{};return T?o.default.createElement(s,{"data-testid":"loader"}):o.default.createElement(d,{style:X},v?o.default.createElement(p,{"data-testid":"hero-video",title:"video-frame",src:`${v.src}?disabledkb=${A}&autoplay=${Y}&controls=${_}&loop=${D}&modestbranding=${F}&start=${H}&showInfo=${L}${z?`&end=${z}`:""}`,width:"100%",height:"100%",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0}):o.default.createElement(f,{"data-testid":"hero-image",$positionX:w==null?void 0:w.x,$positionY:w==null?void 0:w.y,$url:w==null?void 0:w.src,$centered:V},o.default.createElement(g,null,(k||G||E)&&o.default.createElement(x,{$maxWidth:I,$dynamicGutter:M,$centered:V},k&&o.default.createElement(h,{as:"h1",$color:S,shadow:P},k),G&&o.default.createElement(y,{$color:S,shadow:P},G),E&&o.default.createElement(b,{href:O,shadow:P},o.default.createElement(r.Button,{size:"large",as:"span",color:C!=null?C:"secondary",...K},J))),j&&o.default.createElement(c,{$pointerEvents:v?"none":"auto",$align:q||"flex-start",$direction:W||"column",$justify:B||"flex-start"},j))))};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./Tab.js"),r=require("styled-components"),l=require("../../shared/media-queries.js"),i=require("react-collapse"),n=require("../../typography/Heading/index.js");function a(
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./Tab.js"),r=require("styled-components"),l=require("../../shared/media-queries.js"),i=require("react-collapse"),n=require("../../typography/Heading/index.js");function a(h){return h&&typeof h=="object"&&"default"in h?h:{default:h}}require("../Button/index.js"),require("../../theme.js"),require("../Spinner/index.js"),require("../../typography/ButtonText/index.js"),require("../Button/styles.js"),require("../../utils/utils.js");var o=a(e),d=a(r);const s=d.default.div`
|
|
2
2
|
.ReactCollapse--collapse {
|
|
3
3
|
transition: height 300ms;
|
|
4
4
|
}
|
|
@@ -8,16 +8,16 @@
|
|
|
8
8
|
margin: 0.5rem 0;
|
|
9
9
|
display: flex;
|
|
10
10
|
flex-direction: row;
|
|
11
|
-
justify-content:
|
|
11
|
+
justify-content: ${({justify:h})=>h};
|
|
12
12
|
align-items: center;
|
|
13
13
|
|
|
14
|
-
${({theme:
|
|
15
|
-
border-bottom: 3px solid ${
|
|
14
|
+
${({theme:h,fullWidthBorder:A,borderColor:x})=>A?`border-bottom: 3px solid ${h.colors.gray[x]};`:`& > li {
|
|
15
|
+
border-bottom: 3px solid ${h.colors.gray[x]};
|
|
16
16
|
}`}
|
|
17
17
|
|
|
18
18
|
${l.mq(null,"mobileL")} {
|
|
19
19
|
flex-direction: column;
|
|
20
|
-
justify-content: ${({justify:
|
|
20
|
+
justify-content: ${({justify:h})=>h};
|
|
21
21
|
}
|
|
22
22
|
`,c=d.default(n.Title)`
|
|
23
23
|
margin: 0;
|
|
@@ -25,4 +25,4 @@
|
|
|
25
25
|
display: flex;
|
|
26
26
|
`,f=d.default.div`
|
|
27
27
|
padding: 0.5rem 0;
|
|
28
|
-
`,b=d.default.div``,m=({activeColor:
|
|
28
|
+
`,b=d.default.div``,m=({activeColor:h="secondary",justify:A="end",activeIndex:x,initalActive:I,children:U=[],kbNavAutoOpen:T=!0,onTabClick:O,fullWidthBorder:_=!0,borderColor:H="light6",headline:R})=>{var W,L;const q=e.Children.map(U,y=>y),[k,D]=e.useState(()=>I!=null?I:q.findIndex(y=>!y.props.isDisabled)),S=e.useRef([]),K=Boolean((L=(W=q[k])==null?void 0:W.props)==null?void 0:L.children);e.useEffect(()=>{x!==void 0&&D(x)},[x]);const M=(y,v)=>{if(y.preventDefault(),y.key!=="Enter"||T||D(v),y.key==="ArrowLeft"||y.key==="ArrowRight"){const g=T?k:v,j=y.key==="ArrowRight",E=j?g+1:0,w=j?q.length:g,$=q.slice(E,w);j||$.reverse();const B=$.findIndex(C=>!C.props.isDisabled);if(B!==-1){const C=j?g+(B+1):g-(B+1);T&&D(C),S.current[C].focus()}}};return o.default.createElement(s,null,o.default.createElement(i.UnmountClosed,{isOpened:!0},o.default.createElement(u,{fullWidthBorder:_,justify:R?"space-between":A,role:"tablist",borderColor:H},R&&o.default.createElement(c,null,R),o.default.createElement(p,null,q.map((y,v)=>{if(!y)return null;const g=k===v;return o.default.createElement(t.default,{key:v,label:y.props.label,isDisabled:y.props.isDisabled,index:v,id:v,isActive:k===v,activeColor:h,onClick:(j,E)=>{var w,$;g||y.props.isDisabled||(($=(w=y.props).onClick)==null||$.call(w,j,E),O==null||O(j,E),((B,C)=>{B.preventDefault(),D(C)})(j,E))},onKeyUp:M,ref:j=>S.current[v]=j})}))),K&&o.default.createElement(f,null,q.map((y,v)=>{const g=y.props.children&&k===v;return o.default.createElement(b,{key:v,id:`tabpanel-${v}`,role:"tabpanel","aria-labelledby":`tab-${v}`,"aria-hidden":g?"false":"true"},g&&y.props.children)}))))};exports.Tabs=m,exports.default=m;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import
|
|
1
|
+
import r from"react";import n,{keyframes as q}from"styled-components";import{Display3 as R,Title as S}from"../../typography/Heading/index.js";import{Button as W}from"../Button/index.js";import{mq as l}from"../../shared/media-queries.js";import"../../theme.js";import"../Spinner/index.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";const _=n.div`
|
|
2
2
|
position: relative;
|
|
3
3
|
min-height: 440px;
|
|
4
4
|
display: flex;
|
|
5
5
|
flex-direction: column;
|
|
6
|
-
`,
|
|
6
|
+
`,u=q`
|
|
7
7
|
0% {
|
|
8
8
|
background-color:#f5f5f5;
|
|
9
9
|
}
|
|
@@ -14,11 +14,11 @@ import n from"react";import r,{keyframes as L}from"styled-components";import{Dis
|
|
|
14
14
|
|
|
15
15
|
100% {
|
|
16
16
|
background-color:#f5f5f5;
|
|
17
|
-
}`,
|
|
17
|
+
}`,A=n.div`
|
|
18
18
|
width: 100%;
|
|
19
19
|
height: 440px;
|
|
20
|
-
animation: ${
|
|
21
|
-
`,
|
|
20
|
+
animation: ${u} 2s linear infinite;
|
|
21
|
+
`,D=n.div`
|
|
22
22
|
pointer-events: ${({$pointerEvents:e})=>e};
|
|
23
23
|
display: flex;
|
|
24
24
|
flex-direction: ${({$direction:e})=>e};
|
|
@@ -27,13 +27,13 @@ import n from"react";import r,{keyframes as L}from"styled-components";import{Dis
|
|
|
27
27
|
padding: 3rem 1.5rem;
|
|
28
28
|
z-index: 1;
|
|
29
29
|
flex: 1;
|
|
30
|
-
`,
|
|
30
|
+
`,F=n.iframe`
|
|
31
31
|
position: absolute;
|
|
32
32
|
width: 100%;
|
|
33
33
|
height: 100%;
|
|
34
34
|
top: 0;
|
|
35
35
|
left: 0;
|
|
36
|
-
`,i=e=>typeof e=="number",$=e=>typeof e=="string",
|
|
36
|
+
`,i=e=>typeof e=="number",$=e=>typeof e=="string",N=({$positionX:e,$positionY:t})=>{if(i(e)&&i(t))return`${e}% ${t}%`;if($(e)&&$(t))return`${e} ${t}`;if(e||t){const o=i(e)?`${e}%`:e,c=i(t)?`${t}%`:t;return`${o||"50%"} ${c||"50%"}`}return"50% 50%"},O=n.div`
|
|
37
37
|
width: 100%;
|
|
38
38
|
min-height: 440px;
|
|
39
39
|
display: flex;
|
|
@@ -45,17 +45,17 @@ import n from"react";import r,{keyframes as L}from"styled-components";import{Dis
|
|
|
45
45
|
background: url('${e}');
|
|
46
46
|
background-repeat: no-repeat;
|
|
47
47
|
background-size: cover;
|
|
48
|
-
background-position: ${
|
|
48
|
+
background-position: ${N(t)};
|
|
49
49
|
`}
|
|
50
|
-
`,
|
|
50
|
+
`,J=n.div`
|
|
51
51
|
padding-left: 1rem;
|
|
52
52
|
padding-right: 1rem;
|
|
53
53
|
|
|
54
|
-
${
|
|
54
|
+
${l("tablet")} {
|
|
55
55
|
padding-left: 1.5rem;
|
|
56
56
|
padding-right: 1.5rem;
|
|
57
57
|
}
|
|
58
|
-
`,
|
|
58
|
+
`,K=n.div`
|
|
59
59
|
${({$centered:e})=>!e&&"margin-top: 3rem;"}
|
|
60
60
|
|
|
61
61
|
${({$centered:e})=>e&&`
|
|
@@ -73,28 +73,35 @@ import n from"react";import r,{keyframes as L}from"styled-components";import{Dis
|
|
|
73
73
|
`}
|
|
74
74
|
|
|
75
75
|
${({$dynamicGutter:e})=>e&&`
|
|
76
|
-
${
|
|
76
|
+
${l("tablet")} {
|
|
77
77
|
margin-left: ${e.tabletVw}vw;
|
|
78
78
|
margin-right: ${e.tabletVw}vw;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
-
${
|
|
81
|
+
${l("laptop")} {
|
|
82
82
|
margin-left: ${e.laptopVw}vw;
|
|
83
83
|
margin-right: ${e.laptopVw}vw;
|
|
84
84
|
}
|
|
85
85
|
`}
|
|
86
86
|
|
|
87
|
-
${
|
|
87
|
+
${l("laptop")} {
|
|
88
88
|
${({$centered:e})=>!e&&"margin-top: 3.75rem;"}
|
|
89
89
|
}
|
|
90
|
-
`,
|
|
90
|
+
`,M=n(R)`
|
|
91
91
|
margin: 0;
|
|
92
92
|
color: ${({$color:e,theme:t})=>t.colors.text[e]};
|
|
93
|
-
|
|
93
|
+
|
|
94
|
+
${({shadow:e})=>e&&"text-shadow: 4px 4px 6px rgba(0, 0, 0, 0.2);"}
|
|
95
|
+
`,Q=n(S)`
|
|
94
96
|
margin: 0.25rem 0;
|
|
95
97
|
color: ${({$color:e,theme:t})=>t.colors.text[e]};
|
|
96
|
-
|
|
98
|
+
|
|
99
|
+
${({shadow:e})=>e&&"text-shadow: 4px 4px 6px rgba(0, 0, 0, 0.2);"}
|
|
100
|
+
`,U=n.a`
|
|
97
101
|
display: inline-block;
|
|
98
102
|
margin-top: 3rem;
|
|
99
103
|
text-decoration: none;
|
|
100
|
-
|
|
104
|
+
|
|
105
|
+
${({shadow:e})=>e&&`box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, 0.1),
|
|
106
|
+
0px 3px 14px 0px rgba(0, 0, 0, 0.09), 0px 4px 5px 0px rgba(0, 0, 0, 0.15);`}
|
|
107
|
+
`,Z=({imageProps:e,videoProps:t,children:o,align:c,direction:h,justify:b,contentMaxWidth:y=64,heading:d,headingColor:p="dark",subheading:s,buttonProps:a,dynamicGutter:w,isLoading:v=!1,contentCentered:f=!1,containerStyle:k,elementShadow:m=!1})=>{const{autoplay:E=0,controls:j=0,disablekb:B=0,end:x,loop:C=0,modestbranding:V=1,start:z=0,showInfo:H=0}=(t==null?void 0:t.ytConfig)||{},{link:I,text:L,color:g,...T}=a!=null?a:{};return v?r.createElement(A,{"data-testid":"loader"}):r.createElement(_,{style:k},t?r.createElement(F,{"data-testid":"hero-video",title:"video-frame",src:`${t.src}?disabledkb=${B}&autoplay=${E}&controls=${j}&loop=${C}&modestbranding=${V}&start=${z}&showInfo=${H}${x?`&end=${x}`:""}`,width:"100%",height:"100%",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0}):r.createElement(O,{"data-testid":"hero-image",$positionX:e==null?void 0:e.x,$positionY:e==null?void 0:e.y,$url:e==null?void 0:e.src,$centered:f},r.createElement(J,null,(d||s||a)&&r.createElement(K,{$maxWidth:y,$dynamicGutter:w,$centered:f},d&&r.createElement(M,{as:"h1",$color:p,shadow:m},d),s&&r.createElement(Q,{$color:p,shadow:m},s),a&&r.createElement(U,{href:I,shadow:m},r.createElement(W,{size:"large",as:"span",color:g!=null?g:"secondary",...T},L))),o&&r.createElement(D,{$pointerEvents:t?"none":"auto",$align:c||"flex-start",$direction:h||"column",$justify:b||"flex-start"},o))))};export{u as colorAnimation,Z as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import o,{Children as A,useState as B,useRef as S,useEffect as H}from"react";import I from"./Tab.js";import a from"styled-components";import{mq as P}from"../../shared/media-queries.js";import{UnmountClosed as U}from"react-collapse";import{Title as q}from"../../typography/Heading/index.js";import"../Button/index.js";import"../../theme.js";import"../Spinner/index.js";import"../../typography/ButtonText/index.js";import"../Button/styles.js";import"../../utils/utils.js";const F=a.div`
|
|
2
2
|
.ReactCollapse--collapse {
|
|
3
3
|
transition: height 300ms;
|
|
4
4
|
}
|
|
@@ -8,16 +8,16 @@ import l,{Children as A,useState as B,useRef as S,useEffect as H}from"react";imp
|
|
|
8
8
|
margin: 0.5rem 0;
|
|
9
9
|
display: flex;
|
|
10
10
|
flex-direction: row;
|
|
11
|
-
justify-content:
|
|
11
|
+
justify-content: ${({justify:s})=>s};
|
|
12
12
|
align-items: center;
|
|
13
13
|
|
|
14
|
-
${({theme:
|
|
15
|
-
border-bottom: 3px solid ${
|
|
14
|
+
${({theme:s,fullWidthBorder:b,borderColor:l})=>b?`border-bottom: 3px solid ${s.colors.gray[l]};`:`& > li {
|
|
15
|
+
border-bottom: 3px solid ${s.colors.gray[l]};
|
|
16
16
|
}`}
|
|
17
17
|
|
|
18
18
|
${P(null,"mobileL")} {
|
|
19
19
|
flex-direction: column;
|
|
20
|
-
justify-content: ${({justify:
|
|
20
|
+
justify-content: ${({justify:s})=>s};
|
|
21
21
|
}
|
|
22
22
|
`,L=a(q)`
|
|
23
23
|
margin: 0;
|
|
@@ -25,4 +25,4 @@ import l,{Children as A,useState as B,useRef as S,useEffect as H}from"react";imp
|
|
|
25
25
|
display: flex;
|
|
26
26
|
`,G=a.div`
|
|
27
27
|
padding: 0.5rem 0;
|
|
28
|
-
`,J=a.div``,D=({activeColor:
|
|
28
|
+
`,J=a.div``,D=({activeColor:s="secondary",justify:b="end",activeIndex:l,initalActive:T,children:$=[],kbNavAutoOpen:y=!0,onTabClick:j,fullWidthBorder:R=!0,borderColor:k="light6",headline:h})=>{var v,E;const i=A.map($,e=>e),[c,m]=B(()=>T!=null?T:i.findIndex(e=>!e.props.isDisabled)),C=S([]),w=Boolean((E=(v=i[c])==null?void 0:v.props)==null?void 0:E.children),_=(e,t)=>{e.preventDefault(),m(t)};H(()=>{typeof l!="undefined"&&m(l)},[l]);const x=(e,t)=>{if(e.preventDefault(),e.key==="Enter"&&!y&&m(t),e.key==="ArrowLeft"||e.key==="ArrowRight"){const n=y?c:t,r=e.key==="ArrowRight",d=r?n+1:0,u=r?i.length:n,p=i.slice(d,u);r||p.reverse();const g=p.findIndex(f=>!f.props.isDisabled);if(g!==-1){const f=r?n+(g+1):n-(g+1);y&&m(f),C.current[f].focus()}}};return o.createElement(F,null,o.createElement(U,{isOpened:!0},o.createElement(K,{fullWidthBorder:R,justify:h?"space-between":b,role:"tablist",borderColor:k},h&&o.createElement(L,null,h),o.createElement(z,null,i.map((e,t)=>{if(!e)return null;const n=c===t;return o.createElement(I,{key:t,label:e.props.label,isDisabled:e.props.isDisabled,index:t,id:t,isActive:c===t,activeColor:s,onClick:(r,d)=>{var u,p;!n&&!e.props.isDisabled&&((p=(u=e.props).onClick)==null||p.call(u,r,d),j==null||j(r,d),_(r,d))},onKeyUp:x,ref:r=>C.current[t]=r})}))),w&&o.createElement(G,null,i.map((e,t)=>{const n=e.props.children&&c===t;return o.createElement(J,{key:t,id:`tabpanel-${t}`,role:"tabpanel","aria-labelledby":`tab-${t}`,"aria-hidden":n?"false":"true"},n&&e.props.children)}))))};export{D as Tabs,D as default};
|
package/package.json
CHANGED
|
@@ -50,6 +50,7 @@ export interface HeroProps {
|
|
|
50
50
|
dynamicGutter?: DynamicGutter;
|
|
51
51
|
isLoading?: boolean;
|
|
52
52
|
contentCentered?: boolean;
|
|
53
|
+
elementShadow?: boolean;
|
|
53
54
|
}
|
|
54
|
-
declare const Hero: ({ imageProps, videoProps, children, align, direction, justify, contentMaxWidth, heading, headingColor, subheading, buttonProps, dynamicGutter, isLoading, contentCentered, containerStyle, }: HeroProps) => JSX.Element;
|
|
55
|
+
declare const Hero: ({ imageProps, videoProps, children, align, direction, justify, contentMaxWidth, heading, headingColor, subheading, buttonProps, dynamicGutter, isLoading, contentCentered, containerStyle, elementShadow, }: HeroProps) => JSX.Element;
|
|
55
56
|
export default Hero;
|