@kvdbil/components 9.4.0 → 9.4.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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),l=require("../../shared/media-queries.js"),a=require("../../theme.js"),r=require("../Logo/index.js"),d=require("./Hamburger.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components"),l=require("../../shared/media-queries.js"),a=require("../../theme.js"),r=require("../Logo/index.js"),d=require("./Hamburger.js"),o=require("./Link.js");function n(y){return y&&typeof y=="object"&&"default"in y?y:{default:y}}require("../Logo/LogoSv.js"),require("../Logo/LogoEn.js");var i=n(e),u=n(t);const c=u.default.a`
|
|
2
2
|
cursor: pointer;
|
|
3
3
|
padding: 0 0.625rem;
|
|
4
4
|
width: 100%;
|
|
@@ -33,12 +33,13 @@
|
|
|
33
33
|
flex-direction: row;
|
|
34
34
|
padding: 0em 1.5em;
|
|
35
35
|
}
|
|
36
|
-
`,
|
|
36
|
+
`,p=u.default.div`
|
|
37
37
|
display: flex;
|
|
38
38
|
width: 100%;
|
|
39
|
-
`,
|
|
39
|
+
`,m=u.default.ul`
|
|
40
40
|
display: flex;
|
|
41
41
|
justify-content: space-around;
|
|
42
|
+
flex: 0;
|
|
42
43
|
width: 100%;
|
|
43
44
|
position: relative;
|
|
44
45
|
margin: 0;
|
|
@@ -50,7 +51,7 @@
|
|
|
50
51
|
padding: 0.5em 0;
|
|
51
52
|
display: flex;
|
|
52
53
|
padding: 0;
|
|
53
|
-
flex:
|
|
54
|
+
flex: 0;
|
|
54
55
|
}
|
|
55
56
|
`,g=u.default.ul`
|
|
56
57
|
display: none;
|
|
@@ -60,4 +61,4 @@
|
|
|
60
61
|
display: flex;
|
|
61
62
|
padding: 0;
|
|
62
63
|
}
|
|
63
|
-
`,x=({locale:y,primaryLinks:q,secondaryLinks:j,menuIconText:E,onMenuClick:h,onHeaderClick:
|
|
64
|
+
`,x=({locale:y,primaryLinks:q,secondaryLinks:j,menuIconText:E,onMenuClick:h,onHeaderClick:L,forwardRef:w,primaryListProps:$,css:v="",...C})=>i.default.createElement(s,{css:v,...C,ref:w},i.default.createElement(f,null,i.default.createElement(c,{onClick:L},i.default.createElement(r.Logo,{locale:y})),i.default.createElement(p,null,i.default.createElement(m,{...$},q.map((k,b)=>i.default.createElement(o.default,{key:k.text||b,...k}))),i.default.createElement(d.default,{"aria-label":"Menu",text:E,onClick:h})),i.default.createElement(g,null,j.map((k,b)=>i.default.createElement(o.default,{key:k.text||b,...k})))));exports.Header=x,exports.default=x;
|
|
@@ -1,63 +1,64 @@
|
|
|
1
|
-
import e from"react";import t from"styled-components";import{mq as
|
|
1
|
+
import e from"react";import t from"styled-components";import{mq as n}from"../../shared/media-queries.js";import r from"../../theme.js";import{Logo as b}from"../Logo/index.js";import k from"./Hamburger.js";import i from"./Link.js";import"../Logo/LogoSv.js";import"../Logo/LogoEn.js";const h=t.a`
|
|
2
2
|
cursor: pointer;
|
|
3
3
|
padding: 0 0.625rem;
|
|
4
4
|
width: 100%;
|
|
5
5
|
display: flex;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
align-items: center;
|
|
8
|
-
background: ${
|
|
8
|
+
background: ${r.colors.background.light};
|
|
9
9
|
|
|
10
|
-
${
|
|
10
|
+
${n("tablet")} {
|
|
11
11
|
display: block;
|
|
12
12
|
width: auto;
|
|
13
13
|
padding: 0 1.5rem 0 0;
|
|
14
14
|
}
|
|
15
|
-
`,
|
|
15
|
+
`,j=t.nav`
|
|
16
16
|
width: 100%;
|
|
17
17
|
z-index: 17;
|
|
18
18
|
position: fixed;
|
|
19
19
|
top: 0;
|
|
20
20
|
left: 0;
|
|
21
|
-
color: ${
|
|
22
|
-
background-color: ${
|
|
21
|
+
color: ${r.colors.text.dark};
|
|
22
|
+
background-color: ${r.colors.background.light};
|
|
23
23
|
transition: 300ms;
|
|
24
|
-
`,
|
|
24
|
+
`,E=t.div`
|
|
25
25
|
display: flex;
|
|
26
26
|
flex-direction: column;
|
|
27
27
|
align-items: center;
|
|
28
28
|
justify-content: space-between;
|
|
29
|
-
background-color: ${
|
|
29
|
+
background-color: ${r.colors.background.gray};
|
|
30
30
|
|
|
31
|
-
${
|
|
32
|
-
background-color: ${
|
|
31
|
+
${n("tablet")} {
|
|
32
|
+
background-color: ${r.colors.background.light};
|
|
33
33
|
flex-direction: row;
|
|
34
34
|
padding: 0em 1.5em;
|
|
35
35
|
}
|
|
36
|
-
`,
|
|
36
|
+
`,L=t.div`
|
|
37
37
|
display: flex;
|
|
38
38
|
width: 100%;
|
|
39
|
-
|
|
39
|
+
`,$=t.ul`
|
|
40
40
|
display: flex;
|
|
41
41
|
justify-content: space-around;
|
|
42
|
+
flex: 0;
|
|
42
43
|
width: 100%;
|
|
43
44
|
position: relative;
|
|
44
45
|
margin: 0;
|
|
45
46
|
padding: 0;
|
|
46
47
|
flex-grow: 1;
|
|
47
48
|
|
|
48
|
-
${
|
|
49
|
+
${n("tablet")} {
|
|
49
50
|
justify-content: flex-start;
|
|
50
51
|
padding: 0.5em 0;
|
|
51
52
|
display: flex;
|
|
52
53
|
padding: 0;
|
|
53
|
-
flex:
|
|
54
|
+
flex: 0;
|
|
54
55
|
}
|
|
55
|
-
|
|
56
|
+
`,w=t.ul`
|
|
56
57
|
display: none;
|
|
57
58
|
|
|
58
|
-
${
|
|
59
|
+
${n("laptop")} {
|
|
59
60
|
padding: 0.5em 0;
|
|
60
61
|
display: flex;
|
|
61
62
|
padding: 0;
|
|
62
63
|
}
|
|
63
|
-
`,l=({locale:d,primaryLinks:c,secondaryLinks:s,menuIconText:m,onMenuClick:p,onHeaderClick:g,forwardRef:u,css:
|
|
64
|
+
`,l=({locale:d,primaryLinks:c,secondaryLinks:s,menuIconText:m,onMenuClick:p,onHeaderClick:g,forwardRef:f,primaryListProps:u,css:x="",...y})=>e.createElement(j,{css:x,...y,ref:f},e.createElement(E,null,e.createElement(h,{onClick:g},e.createElement(b,{locale:d})),e.createElement(L,null,e.createElement($,{...u},c.map((o,a)=>e.createElement(i,{key:o.text||a,...o}))),e.createElement(k,{"aria-label":"Menu",text:m,onClick:p})),e.createElement(w,null,s.map((o,a)=>e.createElement(i,{key:o.text||a,...o})))));export{l as Header,l as default};
|
package/package.json
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import { MutableRefObject } from 'react';
|
|
2
3
|
import { Locale } from '../../Types';
|
|
3
4
|
import { LinkProps } from './Link';
|
|
@@ -8,8 +9,9 @@ export interface HeaderProps {
|
|
|
8
9
|
menuIconText: string;
|
|
9
10
|
css?: string;
|
|
10
11
|
forwardRef?: MutableRefObject<HTMLDivElement | null>;
|
|
12
|
+
primaryListProps?: React.HTMLAttributes<HTMLUListElement>;
|
|
11
13
|
onMenuClick: () => void;
|
|
12
14
|
onHeaderClick: () => void;
|
|
13
15
|
}
|
|
14
|
-
export declare const Header: ({ locale, primaryLinks, secondaryLinks, menuIconText, onMenuClick, onHeaderClick, forwardRef, css, ...props }: HeaderProps) => JSX.Element;
|
|
16
|
+
export declare const Header: ({ locale, primaryLinks, secondaryLinks, menuIconText, onMenuClick, onHeaderClick, forwardRef, primaryListProps, css, ...props }: HeaderProps) => JSX.Element;
|
|
15
17
|
export default Header;
|