@phillips/seldon 1.106.4 → 1.108.0
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/components/Dropdown/Dropdown.d.ts +4 -0
- package/dist/components/Dropdown/Dropdown.js +29 -20
- package/dist/components/Dropdown/Dropdown.stories.d.ts +1 -0
- package/dist/patterns/LanguageSelector/LanguageSelector.d.ts +4 -0
- package/dist/patterns/LanguageSelector/LanguageSelector.js +40 -39
- package/dist/patterns/UserManagement/UserManagement.d.ts +4 -0
- package/dist/patterns/UserManagement/UserManagement.js +24 -23
- package/dist/scss/_utils.scss +4 -0
- package/dist/scss/_vars.scss +5 -1
- package/dist/scss/components/Dropdown/_dropdown.scss +12 -2
- package/dist/scss/patterns/UserManagement/_userManagement.scss +7 -2
- package/dist/site-furniture/Header/Header.d.ts +4 -0
- package/dist/site-furniture/Header/Header.js +50 -49
- package/package.json +1 -1
|
@@ -18,6 +18,10 @@ export interface DropdownProps extends Omit<DropdownSelect.SelectProps, 'default
|
|
|
18
18
|
* Aria-label for specific dropdown use, e.g. Select your language
|
|
19
19
|
*/
|
|
20
20
|
label: string;
|
|
21
|
+
/**
|
|
22
|
+
* Is the dropdown disabled
|
|
23
|
+
*/
|
|
24
|
+
disabled?: boolean;
|
|
21
25
|
}
|
|
22
26
|
/**
|
|
23
27
|
* ## Overview
|
|
@@ -1,28 +1,37 @@
|
|
|
1
1
|
import { jsx as e, jsxs as n } from "react/jsx-runtime";
|
|
2
|
-
import d, { useState as
|
|
3
|
-
import { getCommonProps as
|
|
2
|
+
import d, { useState as C } from "react";
|
|
3
|
+
import { getCommonProps as D } from "../../utils/index.js";
|
|
4
4
|
import i from "../../node_modules/classnames/index.js";
|
|
5
|
-
import { Root as
|
|
5
|
+
import { Root as $, Trigger as b, Value as v, Icon as I, Portal as S, Content as x, ScrollUpButton as R, Viewport as O, ScrollDownButton as P, Item as V, ItemText as j } from "../../node_modules/@radix-ui/react-select/dist/index.js";
|
|
6
6
|
import c from "../../assets/chevronDown.svg.js";
|
|
7
|
-
const
|
|
8
|
-
({ options: l, value: a, onValueChange: s, label: t, className: _, id: m,
|
|
9
|
-
const { className: o, ...
|
|
10
|
-
return /* @__PURE__ */ e("div", { className: i(o, _), id: m, ...
|
|
11
|
-
|
|
7
|
+
const y = d.forwardRef(
|
|
8
|
+
({ options: l, value: a, onValueChange: s, label: t, className: _, id: m, disabled: h, ...f }, u) => {
|
|
9
|
+
const { className: o, ...N } = D({ id: m }, "Dropdown"), [w, g] = C(!1);
|
|
10
|
+
return /* @__PURE__ */ e("div", { className: i(o, _), id: m, ...N, ...f, children: /* @__PURE__ */ n(
|
|
11
|
+
$,
|
|
12
12
|
{
|
|
13
13
|
value: a,
|
|
14
14
|
onValueChange: (r) => {
|
|
15
15
|
s(r);
|
|
16
16
|
},
|
|
17
|
-
onOpenChange:
|
|
17
|
+
onOpenChange: g,
|
|
18
18
|
children: [
|
|
19
|
-
/* @__PURE__ */ n(
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
19
|
+
/* @__PURE__ */ n(
|
|
20
|
+
b,
|
|
21
|
+
{
|
|
22
|
+
className: `${o}__trigger`,
|
|
23
|
+
"aria-label": t,
|
|
24
|
+
ref: u,
|
|
25
|
+
disabled: h,
|
|
26
|
+
children: [
|
|
27
|
+
/* @__PURE__ */ e(v, { placeholder: a }),
|
|
28
|
+
/* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(c, { className: i({ [`${o}__trigger-icon-expanded`]: w }) }) })
|
|
29
|
+
]
|
|
30
|
+
}
|
|
31
|
+
),
|
|
32
|
+
/* @__PURE__ */ e(S, { children: /* @__PURE__ */ n(x, { className: `${o}__content`, position: "popper", children: [
|
|
33
|
+
/* @__PURE__ */ e(R, { className: `${o}__scroll-button__up`, children: /* @__PURE__ */ e(c, {}) }),
|
|
34
|
+
/* @__PURE__ */ e(O, { className: `${o}__viewport`, children: l.map((r) => /* @__PURE__ */ e(
|
|
26
35
|
p,
|
|
27
36
|
{
|
|
28
37
|
value: r.value,
|
|
@@ -32,18 +41,18 @@ const j = d.forwardRef(
|
|
|
32
41
|
},
|
|
33
42
|
r.value
|
|
34
43
|
)) }),
|
|
35
|
-
/* @__PURE__ */ e(
|
|
44
|
+
/* @__PURE__ */ e(P, { className: `${o}__scroll-button`, children: /* @__PURE__ */ e(c, {}) })
|
|
36
45
|
] }) })
|
|
37
46
|
]
|
|
38
47
|
}
|
|
39
48
|
) });
|
|
40
49
|
}
|
|
41
50
|
);
|
|
42
|
-
|
|
51
|
+
y.displayName = "Dropdown";
|
|
43
52
|
const p = d.forwardRef(
|
|
44
|
-
({ children: l, className: a, ...s }, t) => /* @__PURE__ */ e(
|
|
53
|
+
({ children: l, className: a, ...s }, t) => /* @__PURE__ */ e(V, { className: `${a}__item`, ...s, ref: t, children: /* @__PURE__ */ e(j, { children: l }) })
|
|
45
54
|
);
|
|
46
55
|
p.displayName = "DropdownSelectItem";
|
|
47
56
|
export {
|
|
48
|
-
|
|
57
|
+
y as default
|
|
49
58
|
};
|
|
@@ -22,6 +22,10 @@ export interface LanguageSelectorProps extends ComponentProps<'div'> {
|
|
|
22
22
|
* hide or show with an opacity transition
|
|
23
23
|
*/
|
|
24
24
|
isHidden?: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Disable the language selector so it can't be interacted with
|
|
27
|
+
*/
|
|
28
|
+
disabled?: boolean;
|
|
25
29
|
}
|
|
26
30
|
/**
|
|
27
31
|
* ## Overview
|
|
@@ -1,76 +1,77 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { getCommonProps as
|
|
4
|
-
import
|
|
1
|
+
import { jsxs as v, Fragment as L, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as b } from "react";
|
|
3
|
+
import { getCommonProps as S, noOp as N } from "../../utils/index.js";
|
|
4
|
+
import T from "../../node_modules/classnames/index.js";
|
|
5
5
|
import { SupportedLanguages as i } from "../../types/commonTypes.js";
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import { AccordionItemVariant as
|
|
10
|
-
import
|
|
11
|
-
import { LinkVariants as
|
|
12
|
-
import { TextVariants as
|
|
13
|
-
import
|
|
14
|
-
import
|
|
6
|
+
import x from "../../components/Dropdown/Dropdown.js";
|
|
7
|
+
import C from "../../components/Accordion/Accordion.js";
|
|
8
|
+
import k from "../../components/Accordion/AccordionItem.js";
|
|
9
|
+
import { AccordionItemVariant as w } from "../../components/Accordion/types.js";
|
|
10
|
+
import y from "../../components/Navigation/NavigationItem/NavigationItem.js";
|
|
11
|
+
import { LinkVariants as M } from "../../components/Link/types.js";
|
|
12
|
+
import { TextVariants as V } from "../../components/Text/types.js";
|
|
13
|
+
import A from "../../components/Text/Text.js";
|
|
14
|
+
import I from "../../components/Navigation/NavigationList/NavigationList.js";
|
|
15
15
|
import { SSRMediaQuery as g } from "../../providers/SeldonProvider/utils.js";
|
|
16
|
-
import { getLanguageLabel as
|
|
17
|
-
const
|
|
16
|
+
import { getLanguageLabel as P } from "./utils.js";
|
|
17
|
+
const j = ({
|
|
18
18
|
id: a,
|
|
19
|
-
value:
|
|
19
|
+
value: l,
|
|
20
20
|
// can't be passed to the accordion
|
|
21
21
|
onValueChange: o,
|
|
22
|
-
label:
|
|
22
|
+
label: t,
|
|
23
23
|
options: n,
|
|
24
24
|
...m
|
|
25
|
-
}) => /* @__PURE__ */ e(
|
|
26
|
-
|
|
25
|
+
}) => /* @__PURE__ */ e(C, { ...m, children: /* @__PURE__ */ e(
|
|
26
|
+
k,
|
|
27
27
|
{
|
|
28
28
|
hasTransition: !0,
|
|
29
29
|
id: a != null ? a : "language-selector-accordion",
|
|
30
|
-
label: /* @__PURE__ */ e(
|
|
31
|
-
variant:
|
|
32
|
-
children: /* @__PURE__ */ e(
|
|
33
|
-
|
|
30
|
+
label: /* @__PURE__ */ e(A, { variant: V.snwHeaderLink, children: t }),
|
|
31
|
+
variant: w.lg,
|
|
32
|
+
children: /* @__PURE__ */ e(I, { id: `${a}-navlist`, children: n.map((r) => /* @__PURE__ */ e(
|
|
33
|
+
y,
|
|
34
34
|
{
|
|
35
35
|
label: r.label,
|
|
36
36
|
onClick: () => o(r.value),
|
|
37
|
-
navType:
|
|
37
|
+
navType: M.snwFlyoutLink
|
|
38
38
|
},
|
|
39
39
|
r.value
|
|
40
40
|
)) })
|
|
41
41
|
}
|
|
42
|
-
) }),
|
|
42
|
+
) }), E = b(
|
|
43
43
|
({
|
|
44
44
|
className: a,
|
|
45
|
-
currentLanguage:
|
|
45
|
+
currentLanguage: l = i.en,
|
|
46
46
|
languageOptions: o = [
|
|
47
47
|
{ label: "English", value: i.en },
|
|
48
48
|
{ label: "中文", value: i.zh }
|
|
49
49
|
],
|
|
50
|
-
onLanguageChange:
|
|
50
|
+
onLanguageChange: t = N,
|
|
51
51
|
id: n,
|
|
52
52
|
isHidden: m,
|
|
53
|
-
|
|
53
|
+
disabled: r = !1,
|
|
54
|
+
...u
|
|
54
55
|
}, s) => {
|
|
55
|
-
const { className: c, ...
|
|
56
|
+
const { className: c, ...d } = S({ id: n }, "LanguageSelector"), f = P({ languageOptions: o, currentLanguage: l }), p = {
|
|
57
|
+
...d,
|
|
56
58
|
...u,
|
|
57
|
-
...r,
|
|
58
59
|
id: n,
|
|
59
|
-
className:
|
|
60
|
+
className: T(c, a, {
|
|
60
61
|
[`${c}--hidden`]: m
|
|
61
62
|
}),
|
|
62
63
|
options: o,
|
|
63
|
-
value:
|
|
64
|
-
onValueChange: (
|
|
65
|
-
label:
|
|
64
|
+
value: l,
|
|
65
|
+
onValueChange: (h) => t(h),
|
|
66
|
+
label: f
|
|
66
67
|
};
|
|
67
|
-
return /* @__PURE__ */
|
|
68
|
-
/* @__PURE__ */ e(g.Media, { greaterThanOrEqual: "md", children: /* @__PURE__ */ e(
|
|
69
|
-
/* @__PURE__ */ e(g.Media, { lessThan: "md", children: /* @__PURE__ */ e(
|
|
68
|
+
return /* @__PURE__ */ v(L, { children: [
|
|
69
|
+
/* @__PURE__ */ e(g.Media, { greaterThanOrEqual: "md", children: /* @__PURE__ */ e(x, { ...p, disabled: r, ref: s }) }),
|
|
70
|
+
/* @__PURE__ */ e(g.Media, { lessThan: "md", children: /* @__PURE__ */ e(j, { ...p, ref: s }) })
|
|
70
71
|
] });
|
|
71
72
|
}
|
|
72
73
|
);
|
|
73
|
-
|
|
74
|
+
E.displayName = "LanguageSelector";
|
|
74
75
|
export {
|
|
75
|
-
|
|
76
|
+
E as default
|
|
76
77
|
};
|
|
@@ -26,6 +26,10 @@ export interface UserManagementProps extends ComponentProps<'div'> {
|
|
|
26
26
|
* The label for the account details link
|
|
27
27
|
*/
|
|
28
28
|
accountLabel?: ReactNode;
|
|
29
|
+
/**
|
|
30
|
+
* is the link disabled
|
|
31
|
+
*/
|
|
32
|
+
disabled?: boolean;
|
|
29
33
|
}
|
|
30
34
|
declare const UserManagement: import('react').ForwardRefExoticComponent<Omit<UserManagementProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
31
35
|
export default UserManagement;
|
|
@@ -1,33 +1,34 @@
|
|
|
1
|
-
import { jsx as o, Fragment as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { getCommonProps as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { jsx as o, Fragment as x, jsxs as r } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as C } from "react";
|
|
3
|
+
import { getCommonProps as v, noOp as A } from "../../utils/index.js";
|
|
4
|
+
import s from "../../assets/account_circle.svg.js";
|
|
5
|
+
import $ from "../../node_modules/classnames/index.js";
|
|
6
6
|
import { AuthState as a } from "./types.js";
|
|
7
|
-
import { TextVariants as
|
|
8
|
-
import
|
|
9
|
-
const
|
|
7
|
+
import { TextVariants as m } from "../../components/Text/types.js";
|
|
8
|
+
import i from "../../components/Text/Text.js";
|
|
9
|
+
const b = C(
|
|
10
10
|
({
|
|
11
|
-
accountDetailsLinkComponent:
|
|
12
|
-
className:
|
|
13
|
-
onLogin: d =
|
|
11
|
+
accountDetailsLinkComponent: l = "a",
|
|
12
|
+
className: g,
|
|
13
|
+
onLogin: d = A,
|
|
14
14
|
authState: e = a.LoggedOut,
|
|
15
|
-
loginLabel:
|
|
15
|
+
loginLabel: f = "Login",
|
|
16
16
|
accountLabel: p = "Account",
|
|
17
17
|
href: u = "/account",
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
/* @__PURE__ */ o(
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
/* @__PURE__ */ o(
|
|
18
|
+
disabled: t = !1,
|
|
19
|
+
...c
|
|
20
|
+
}, h) => {
|
|
21
|
+
const { className: n, ...N } = v(c, "UserManagement"), _ = e === a.LoggedIn, L = e !== a.Loading;
|
|
22
|
+
return /* @__PURE__ */ o("div", { ...N, className: $(n, g), ...c, ref: h, children: L && /* @__PURE__ */ o(x, { children: _ ? /* @__PURE__ */ r(l, { className: `${n}__login`, href: u, disabled: t, children: [
|
|
23
|
+
/* @__PURE__ */ o(s, { className: `${n}__account-icon` }),
|
|
24
|
+
/* @__PURE__ */ o(i, { variant: m.body3, children: p })
|
|
25
|
+
] }) : /* @__PURE__ */ r("button", { className: `${n}__login`, onClick: d, disabled: t, children: [
|
|
26
|
+
/* @__PURE__ */ o(s, { className: `${n}__account-icon` }),
|
|
27
|
+
/* @__PURE__ */ o(i, { variant: m.body3, children: f })
|
|
27
28
|
] }) }) });
|
|
28
29
|
}
|
|
29
30
|
);
|
|
30
|
-
|
|
31
|
+
b.displayName = "UserManagement";
|
|
31
32
|
export {
|
|
32
|
-
|
|
33
|
+
b as default
|
|
33
34
|
};
|
package/dist/scss/_utils.scss
CHANGED
package/dist/scss/_vars.scss
CHANGED
|
@@ -323,6 +323,7 @@ $snowflake-menu-padding: 1.25rem;
|
|
|
323
323
|
--spacing-lg: 2.75rem;
|
|
324
324
|
--spacing-xl: 3.75rem;
|
|
325
325
|
--spacing-xxl: 4.75rem;
|
|
326
|
+
--spacing-xxxl: 5.75rem;
|
|
326
327
|
|
|
327
328
|
@media (min-width: $breakpoint-md) {
|
|
328
329
|
--spacing-micro: 0.25rem;
|
|
@@ -332,6 +333,7 @@ $snowflake-menu-padding: 1.25rem;
|
|
|
332
333
|
--spacing-lg: 3rem;
|
|
333
334
|
--spacing-xl: 4rem;
|
|
334
335
|
--spacing-xxl: 5rem;
|
|
336
|
+
--spacing-xxxl: 6rem;
|
|
335
337
|
}
|
|
336
338
|
|
|
337
339
|
@media (min-width: $breakpoint-xl) {
|
|
@@ -342,6 +344,7 @@ $snowflake-menu-padding: 1.25rem;
|
|
|
342
344
|
--spacing-lg: 3.75rem;
|
|
343
345
|
--spacing-xl: 5rem;
|
|
344
346
|
--spacing-xxl: 5.25rem;
|
|
347
|
+
--spacing-xxxl: 6.25rem;
|
|
345
348
|
}
|
|
346
349
|
}
|
|
347
350
|
|
|
@@ -352,7 +355,8 @@ $spacing-md: var(--spacing-md);
|
|
|
352
355
|
$spacing-lg: var(--spacing-lg);
|
|
353
356
|
$spacing-xl: var(--spacing-xl);
|
|
354
357
|
$spacing-xxl: var(--spacing-xl);
|
|
355
|
-
$spacing-
|
|
358
|
+
$spacing-xxxl: var(--spacing-xxxl);
|
|
359
|
+
$spacing-sizes: micro, xsm, sm, md, lg, xl, xxl, xxxl;
|
|
356
360
|
|
|
357
361
|
// PADDING
|
|
358
362
|
$padding-micro: var(--spacing-micro);
|
|
@@ -12,6 +12,16 @@
|
|
|
12
12
|
justify-content: center;
|
|
13
13
|
padding: $spacing-xsm;
|
|
14
14
|
|
|
15
|
+
&:disabled {
|
|
16
|
+
color: $medium-gray;
|
|
17
|
+
cursor: default;
|
|
18
|
+
pointer-events: none;
|
|
19
|
+
|
|
20
|
+
svg {
|
|
21
|
+
stroke: $light-gray;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
|
|
15
25
|
svg {
|
|
16
26
|
height: 16px;
|
|
17
27
|
width: 16px;
|
|
@@ -21,11 +31,11 @@
|
|
|
21
31
|
transform: rotateX(180deg);
|
|
22
32
|
}
|
|
23
33
|
|
|
24
|
-
&:hover {
|
|
34
|
+
&:hover:not(:disabled) {
|
|
25
35
|
cursor: pointer;
|
|
26
36
|
}
|
|
27
37
|
|
|
28
|
-
&:focus-within {
|
|
38
|
+
&:focus-within:not(:disabled) {
|
|
29
39
|
box-shadow: 0 0 0 1px $light-gray;
|
|
30
40
|
outline: 1px solid $pure-black;
|
|
31
41
|
}
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
.#{$px}-user-management {
|
|
4
4
|
align-items: center;
|
|
5
|
-
cursor: pointer;
|
|
6
5
|
display: flex;
|
|
7
6
|
gap: 0 $spacing-xsm;
|
|
8
7
|
justify-content: flex-end;
|
|
@@ -30,7 +29,13 @@
|
|
|
30
29
|
padding: 0;
|
|
31
30
|
padding-bottom: $padding-xsm;
|
|
32
31
|
|
|
33
|
-
&:
|
|
32
|
+
&:disabled {
|
|
33
|
+
cursor: default;
|
|
34
|
+
opacity: 0.5;
|
|
35
|
+
pointer-events: none;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
&:hover:not(:disabled) {
|
|
34
39
|
@include underline;
|
|
35
40
|
}
|
|
36
41
|
|
|
@@ -1,38 +1,39 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { findChildrenOfType as
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import { defaultHeaderContext as
|
|
10
|
-
import { SSRMediaQuery as
|
|
11
|
-
import { useMobileMenu as
|
|
12
|
-
const
|
|
1
|
+
import { jsxs as i, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import t, { createContext as j, forwardRef as R, useState as V } from "react";
|
|
3
|
+
import s from "../../node_modules/classnames/index.js";
|
|
4
|
+
import { findChildrenOfType as c, findChildrenExcludingTypes as w, px as e } from "../../utils/index.js";
|
|
5
|
+
import L from "../../assets/PhillipsLogo.svg.js";
|
|
6
|
+
import f from "../../patterns/UserManagement/UserManagement.js";
|
|
7
|
+
import u from "../../patterns/LanguageSelector/LanguageSelector.js";
|
|
8
|
+
import _ from "../../components/Navigation/Navigation.js";
|
|
9
|
+
import { defaultHeaderContext as k } from "./utils.js";
|
|
10
|
+
import { SSRMediaQuery as q } from "../../providers/SeldonProvider/utils.js";
|
|
11
|
+
import { useMobileMenu as A } from "./hooks.js";
|
|
12
|
+
const I = j(k), Q = R(
|
|
13
13
|
({
|
|
14
|
-
logo: d = /* @__PURE__ */ a(
|
|
15
|
-
logoHref:
|
|
16
|
-
className:
|
|
14
|
+
logo: d = /* @__PURE__ */ a(L, {}),
|
|
15
|
+
logoHref: v = "/",
|
|
16
|
+
className: E,
|
|
17
17
|
children: r,
|
|
18
|
-
toggleOpenText:
|
|
19
|
-
toggleCloseText:
|
|
20
|
-
logoText:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
/* @__PURE__ */
|
|
18
|
+
toggleOpenText: x = "Open Menu",
|
|
19
|
+
toggleCloseText: M = "Close Menu",
|
|
20
|
+
logoText: y = "Home Page",
|
|
21
|
+
disabled: p,
|
|
22
|
+
...$
|
|
23
|
+
}, b) => {
|
|
24
|
+
const o = c(r, f), C = t.isValidElement(o == null ? void 0 : o[0]) ? t.cloneElement(o[0], { disabled: p }) : "", n = c(r, u), h = t.isValidElement(n == null ? void 0 : n[0]) ? t.cloneElement(n[0], { disabled: p }) : "", [g, N] = V(!1), S = c(r, _), H = w(r, [_, f, u]), { closeMenu: T, handleMenuToggle: O, isMenuOpen: m, toggleText: P } = A({ toggleOpenText: x, toggleCloseText: M });
|
|
25
|
+
return /* @__PURE__ */ i("header", { ...$, className: s(`${e}-header`, E), ref: b, children: [
|
|
26
|
+
/* @__PURE__ */ i("div", { className: `${e}-header__top-row`, children: [
|
|
27
|
+
/* @__PURE__ */ a(q.Media, { greaterThanOrEqual: "md", children: h }),
|
|
28
|
+
/* @__PURE__ */ i(
|
|
28
29
|
"button",
|
|
29
30
|
{
|
|
30
|
-
"aria-label":
|
|
31
|
+
"aria-label": P,
|
|
31
32
|
"data-testid": "mobile-menu-toggle",
|
|
32
33
|
type: "button",
|
|
33
|
-
onClick:
|
|
34
|
-
className:
|
|
35
|
-
[`${e}-header__toggle-btn--open`]:
|
|
34
|
+
onClick: O,
|
|
35
|
+
className: s(`${e}-header__toggle-btn`, {
|
|
36
|
+
[`${e}-header__toggle-btn--open`]: m
|
|
36
37
|
}),
|
|
37
38
|
children: [
|
|
38
39
|
/* @__PURE__ */ a("span", {}),
|
|
@@ -40,45 +41,45 @@ const q = T(w), A = O(
|
|
|
40
41
|
]
|
|
41
42
|
}
|
|
42
43
|
),
|
|
43
|
-
/* @__PURE__ */ a("h1", { "data-testid": "header-logo", className: `${e}-header__logo`, children: /* @__PURE__ */ a("a", { href:
|
|
44
|
-
|
|
44
|
+
/* @__PURE__ */ a("h1", { "data-testid": "header-logo", className: `${e}-header__logo`, children: /* @__PURE__ */ a("a", { href: v, "aria-label": y, children: typeof d == "object" ? d : /* @__PURE__ */ a("img", { alt: "Phillips", "data-testid": "header-logo-img", src: d }) }) }),
|
|
45
|
+
C
|
|
45
46
|
] }),
|
|
46
|
-
/* @__PURE__ */ a("div", { className:
|
|
47
|
-
|
|
47
|
+
/* @__PURE__ */ a("div", { className: s(`${e}-header__nav`, { [`${e}-header__nav--closed`]: !m }), children: /* @__PURE__ */ i(
|
|
48
|
+
I.Provider,
|
|
48
49
|
{
|
|
49
50
|
value: {
|
|
50
|
-
isMenuOpen:
|
|
51
|
-
isSearchExpanded:
|
|
52
|
-
setIsSearchExpanded:
|
|
53
|
-
closeMenu:
|
|
51
|
+
isMenuOpen: m,
|
|
52
|
+
isSearchExpanded: g,
|
|
53
|
+
setIsSearchExpanded: N,
|
|
54
|
+
closeMenu: T
|
|
54
55
|
},
|
|
55
56
|
children: [
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
(
|
|
57
|
+
t.Children.map(
|
|
58
|
+
S,
|
|
59
|
+
(l) => t.isValidElement(l) ? t.cloneElement(l, {
|
|
59
60
|
children: [
|
|
60
|
-
...
|
|
61
|
-
|
|
61
|
+
...t.Children.toArray(l.props.children),
|
|
62
|
+
h
|
|
62
63
|
]
|
|
63
|
-
}) :
|
|
64
|
+
}) : l
|
|
64
65
|
),
|
|
65
|
-
|
|
66
|
+
H
|
|
66
67
|
]
|
|
67
68
|
}
|
|
68
69
|
) }),
|
|
69
70
|
/* @__PURE__ */ a(
|
|
70
71
|
"div",
|
|
71
72
|
{
|
|
72
|
-
className:
|
|
73
|
-
[`${e}-header__overlay--active`]:
|
|
73
|
+
className: s(`${e}-header__overlay`, {
|
|
74
|
+
[`${e}-header__overlay--active`]: g
|
|
74
75
|
})
|
|
75
76
|
}
|
|
76
77
|
)
|
|
77
78
|
] });
|
|
78
79
|
}
|
|
79
80
|
);
|
|
80
|
-
|
|
81
|
+
Q.displayName = "Header";
|
|
81
82
|
export {
|
|
82
|
-
|
|
83
|
-
|
|
83
|
+
I as HeaderContext,
|
|
84
|
+
Q as default
|
|
84
85
|
};
|