@phillips/seldon 1.26.2 → 1.27.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/assets/account_circle.svg.js +5 -0
- package/dist/assets/search.svg.js +5 -0
- package/dist/components/Header/Header.d.ts +26 -9
- package/dist/components/Header/Header.js +70 -24
- package/dist/components/Link/utils.d.ts +7 -1
- package/dist/components/Link/utils.js +6 -6
- package/dist/components/Navigation/Navigation.d.ts +10 -0
- package/dist/components/Navigation/Navigation.js +50 -0
- package/dist/components/Navigation/NavigationItem/NavigationItem.d.ts +30 -0
- package/dist/components/Navigation/NavigationItem/NavigationItem.js +35 -0
- package/dist/components/Navigation/NavigationItemTrigger/NavigationItemTrigger.d.ts +9 -0
- package/dist/components/Navigation/NavigationItemTrigger/NavigationItemTrigger.js +31 -0
- package/dist/components/Navigation/NavigationList/NavigationList.d.ts +9 -0
- package/dist/components/Navigation/NavigationList/NavigationList.js +32 -0
- package/dist/components/Search/Search.d.ts +7 -0
- package/dist/components/Search/Search.js +49 -0
- package/dist/components/UserManagement/UserManagement.d.ts +19 -0
- package/dist/components/UserManagement/UserManagement.js +52 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.js +65 -51
- package/dist/pages/Page.js +38 -54
- package/dist/scss/_vars.scss +1 -1
- package/dist/scss/components/Button/_button.scss +3 -3
- package/dist/scss/components/DatePicker/_datePicker.scss +2 -2
- package/dist/scss/components/Footer/_footer.scss +4 -4
- package/dist/scss/components/Grid/_grid.scss +2 -2
- package/dist/scss/components/GridItem/_gridItem.scss +1 -1
- package/dist/scss/components/Header/_header.scss +144 -24
- package/dist/scss/components/HeroBanner/_heroBanner.scss +1 -1
- package/dist/scss/components/Input/_input.scss +2 -2
- package/dist/scss/components/Link/_link.scss +77 -3
- package/dist/scss/components/LinkBlock/_linkBlock.scss +2 -2
- package/dist/scss/components/LinkList/_linkList.scss +1 -1
- package/dist/scss/components/Modal/_modal.scss +2 -2
- package/dist/scss/components/Navigation/NavigationItem/_navigationItem.scss +272 -0
- package/dist/scss/components/Navigation/NavigationItemTrigger/_navigationItemTrigger.scss +1 -0
- package/dist/scss/components/Navigation/NavigationList/_navigationList.scss +96 -0
- package/dist/scss/components/Navigation/_navigation.scss +114 -0
- package/dist/scss/components/Row/_row.scss +1 -1
- package/dist/scss/components/Search/_search.scss +101 -0
- package/dist/scss/components/Social/_social.scss +3 -3
- package/dist/scss/components/SplitPanel/_splitPanel.scss +2 -2
- package/dist/scss/components/SplitPanel/_splitPanel.stories.scss +1 -1
- package/dist/scss/components/Subscribe/_subscribe.scss +4 -4
- package/dist/scss/components/Text/_text.scss +1 -1
- package/dist/scss/components/Toggle/_toggle.scss +2 -2
- package/dist/scss/components/UserManagement/_userManagement.scss +115 -0
- package/dist/scss/components/ViewingsList/_viewingsList.scss +3 -3
- package/dist/scss/styles.scss +6 -0
- package/dist/types/commonTypes.d.ts +4 -0
- package/dist/types/commonTypes.js +4 -0
- package/package.json +10 -10
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as e from "react";
|
|
2
|
+
const C = (t) => /* @__PURE__ */ e.createElement("svg", { width: 19, height: 20, viewBox: "0 0 19 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("path", { d: "M9.5026 0.833984C4.4426 0.833984 0.335938 4.94065 0.335938 10.0007C0.335938 15.0607 4.4426 19.1673 9.5026 19.1673C14.5626 19.1673 18.6693 15.0607 18.6693 10.0007C18.6693 4.94065 14.5626 0.833984 9.5026 0.833984ZM9.5026 3.58398C11.0243 3.58398 12.2526 4.81232 12.2526 6.33398C12.2526 7.85565 11.0243 9.08398 9.5026 9.08398C7.98094 9.08398 6.7526 7.85565 6.7526 6.33398C6.7526 4.81232 7.98094 3.58398 9.5026 3.58398ZM9.5026 16.6007C7.21094 16.6007 5.1851 15.4273 4.0026 13.649C4.0301 11.8248 7.66927 10.8257 9.5026 10.8257C11.3268 10.8257 14.9751 11.8248 15.0026 13.649C13.8201 15.4273 11.7943 16.6007 9.5026 16.6007Z", fill: "#ADADAD" }));
|
|
3
|
+
export {
|
|
4
|
+
C as default
|
|
5
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as e from "react";
|
|
2
|
+
const a = (t) => /* @__PURE__ */ e.createElement("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("g", { id: "Search" }, /* @__PURE__ */ e.createElement("path", { id: "Vector", d: "M12.0209 10.9563H11.4603L11.2616 10.7647C12.1131 9.77122 12.5531 8.41582 12.3118 6.97527C11.9783 5.00249 10.3319 3.4271 8.34498 3.18583C5.34323 2.81682 2.81694 5.34311 3.18595 8.34486C3.42723 10.3318 5.00261 11.9782 6.97539 12.3117C8.41594 12.553 9.77134 12.113 10.7648 11.2614L10.9564 11.4601V12.0208L13.9724 15.0367C14.2633 15.3276 14.7388 15.3276 15.0297 15.0367C15.3207 14.7457 15.3207 14.2703 15.0297 13.9793L12.0209 10.9563ZM7.76308 10.9563C5.99609 10.9563 4.56973 9.52994 4.56973 7.76296C4.56973 5.99597 5.99609 4.56961 7.76308 4.56961C9.53006 4.56961 10.9564 5.99597 10.9564 7.76296C10.9564 9.52994 9.53006 10.9563 7.76308 10.9563Z", fill: "black" })));
|
|
3
|
+
export {
|
|
4
|
+
a as default
|
|
5
|
+
};
|
|
@@ -1,11 +1,28 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
|
|
3
|
+
/**
|
|
4
|
+
* Default mobile menu label
|
|
5
|
+
*/
|
|
6
|
+
defaultMobileMenuLabel?: string;
|
|
7
|
+
/**
|
|
8
|
+
* Logo src
|
|
9
|
+
*/
|
|
10
|
+
logo?: React.ReactElement<React.Component> | string;
|
|
11
|
+
/**
|
|
12
|
+
* Toggle open text
|
|
13
|
+
*/
|
|
14
|
+
toggleOpenText?: string;
|
|
15
|
+
/**
|
|
16
|
+
* Toggle close text
|
|
17
|
+
*/
|
|
18
|
+
toggleCloseText?: string;
|
|
9
19
|
}
|
|
10
|
-
declare const
|
|
20
|
+
export declare const HeaderContext: React.Context<{
|
|
21
|
+
defaultMobileMenuLabel: string;
|
|
22
|
+
expandedItem: string;
|
|
23
|
+
setExpandedItem: (_item: string) => void;
|
|
24
|
+
isExpanded: boolean;
|
|
25
|
+
onSelect: (_label: string) => void;
|
|
26
|
+
}>;
|
|
27
|
+
declare const Header: ({ defaultMobileMenuLabel, logo, className, children, toggleOpenText, toggleCloseText, ...props }: React.PropsWithChildren<HeaderProps>) => import("react/jsx-runtime").JSX.Element;
|
|
11
28
|
export default Header;
|
|
@@ -1,26 +1,72 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
1
|
+
import { jsxs as u, jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import o from "../../node_modules/classnames/index.js";
|
|
3
|
+
import * as i from "react";
|
|
4
|
+
import { px as a } from "../../utils/index.js";
|
|
5
|
+
import I from "../Search/Search.js";
|
|
6
|
+
const y = i.createContext({
|
|
7
|
+
defaultMobileMenuLabel: "",
|
|
8
|
+
expandedItem: "",
|
|
9
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
|
|
10
|
+
setExpandedItem: (e) => {
|
|
11
|
+
},
|
|
12
|
+
isExpanded: !1,
|
|
13
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
|
|
14
|
+
onSelect: (e) => {
|
|
15
|
+
}
|
|
16
|
+
}), k = ({
|
|
17
|
+
defaultMobileMenuLabel: e = "Main Menu",
|
|
18
|
+
logo: s,
|
|
19
|
+
className: _,
|
|
20
|
+
children: g,
|
|
21
|
+
toggleOpenText: m = "Open Menu",
|
|
22
|
+
toggleCloseText: l = "Close Menu",
|
|
23
|
+
...x
|
|
24
|
+
}) => {
|
|
25
|
+
const [r, v] = i.useState(!1), [h, c] = i.useState(e), d = r ? l : m, S = h !== e, p = function() {
|
|
26
|
+
v((n) => !n), c(e);
|
|
27
|
+
}, $ = function(n) {
|
|
28
|
+
c((f) => f === e ? n : e);
|
|
29
|
+
};
|
|
30
|
+
return /* @__PURE__ */ u("header", { ...x, className: o(`${a}-header`, _), children: [
|
|
31
|
+
/* @__PURE__ */ t(
|
|
32
|
+
"div",
|
|
33
|
+
{
|
|
34
|
+
className: o(`${a}-header__overlay`, { [`${a}-header__overlay--active`]: r }),
|
|
35
|
+
"data-testid": "header-overlay",
|
|
36
|
+
onClick: p
|
|
37
|
+
}
|
|
38
|
+
),
|
|
39
|
+
/* @__PURE__ */ t(
|
|
40
|
+
"button",
|
|
41
|
+
{
|
|
42
|
+
"aria-label": d,
|
|
43
|
+
"data-testid": "mobile-menu-toggle",
|
|
44
|
+
type: "button",
|
|
45
|
+
onClick: p,
|
|
46
|
+
className: o(`${a}-header__toggle-btn`, {
|
|
47
|
+
[`${a}-header__toggle-btn--open`]: d === l
|
|
48
|
+
}),
|
|
49
|
+
children: /* @__PURE__ */ t("span", { children: d })
|
|
50
|
+
}
|
|
51
|
+
),
|
|
52
|
+
/* @__PURE__ */ t("h1", { "data-testid": "header-logo", className: `${a}-header__logo`, tabIndex: d === m ? 0 : -1, children: typeof s == "object" ? s : /* @__PURE__ */ t("img", { "data-testid": "header-logo-img", src: s, height: "14" }) }),
|
|
53
|
+
/* @__PURE__ */ t("div", { className: o(`${a}-header__nav`, { [`${a}-header__nav--open`]: r }), children: /* @__PURE__ */ t(
|
|
54
|
+
y.Provider,
|
|
55
|
+
{
|
|
56
|
+
value: {
|
|
57
|
+
defaultMobileMenuLabel: e,
|
|
58
|
+
expandedItem: h,
|
|
59
|
+
setExpandedItem: (n) => c(n),
|
|
60
|
+
isExpanded: S,
|
|
61
|
+
onSelect: (n) => $(n)
|
|
62
|
+
},
|
|
63
|
+
children: g
|
|
64
|
+
}
|
|
65
|
+
) }),
|
|
66
|
+
/* @__PURE__ */ t(I, {})
|
|
67
|
+
] });
|
|
68
|
+
};
|
|
24
69
|
export {
|
|
25
|
-
|
|
70
|
+
y as HeaderContext,
|
|
71
|
+
k as default
|
|
26
72
|
};
|
|
@@ -8,5 +8,11 @@ export declare enum LinkVariants {
|
|
|
8
8
|
/** these links are being rendered in a list */
|
|
9
9
|
list = "list",
|
|
10
10
|
/** link is being rendered within body copy */
|
|
11
|
-
inline = "inline"
|
|
11
|
+
inline = "inline",
|
|
12
|
+
/** link is being rendered in the main nav bar */
|
|
13
|
+
navMain = "navMain",
|
|
14
|
+
/** link is being rendered in a nav bar flyout*/
|
|
15
|
+
navLinkLg = "navLinkLg",
|
|
16
|
+
/** link is being rendered in a nav bar flyout*/
|
|
17
|
+
navLinkSm = "navLinkSm"
|
|
12
18
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { px as
|
|
2
|
-
const
|
|
1
|
+
import { px as l } from "../../utils/index.js";
|
|
2
|
+
const m = (n) => `${l}-link--${n}`, t = (n) => !!(n != null && n.match(
|
|
3
3
|
/(http[s]?:\/\/)(?!.*phillips\.com)([a-zA-Z0-9\-.]+)(:[0-9]{1,4})?([a-zA-Z0-9/\-._~:?#[\]@!$&'()*+,;=]*)/g
|
|
4
4
|
));
|
|
5
|
-
var
|
|
5
|
+
var a = /* @__PURE__ */ ((n) => (n.standalone = "standalone", n.email = "email", n.list = "list", n.inline = "inline", n.navMain = "navMain", n.navLinkLg = "navLinkLg", n.navLinkSm = "navLinkSm", n))(a || {});
|
|
6
6
|
export {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
a as LinkVariants,
|
|
8
|
+
m as getLinkVariantClassName,
|
|
9
|
+
t as isLinkExternal
|
|
10
10
|
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface NavigationProps extends React.HTMLAttributes<HTMLElement> {
|
|
3
|
+
backBtnLabel?: string;
|
|
4
|
+
/**
|
|
5
|
+
* Optional visible state
|
|
6
|
+
*/
|
|
7
|
+
visible?: boolean;
|
|
8
|
+
}
|
|
9
|
+
declare const Navigation: ({ backBtnLabel, children, className, id, visible, }: React.PropsWithChildren<NavigationProps>) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export default Navigation;
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { jsxs as p, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import * as x from "react";
|
|
3
|
+
import { px as e } from "../../utils/index.js";
|
|
4
|
+
import d from "../../node_modules/classnames/index.js";
|
|
5
|
+
import { HeaderContext as v } from "../Header/Header.js";
|
|
6
|
+
const _ = ({
|
|
7
|
+
backBtnLabel: i,
|
|
8
|
+
children: r,
|
|
9
|
+
className: b,
|
|
10
|
+
id: a,
|
|
11
|
+
visible: n = !0
|
|
12
|
+
}) => {
|
|
13
|
+
const { defaultMobileMenuLabel: l, isExpanded: s, expandedItem: t, setExpandedItem: m } = x.useContext(v), c = () => m(t === l ? t : l);
|
|
14
|
+
return /* @__PURE__ */ p(
|
|
15
|
+
"nav",
|
|
16
|
+
{
|
|
17
|
+
role: "navigation",
|
|
18
|
+
"aria-labelledby": `${a}-label`,
|
|
19
|
+
"data-testid": a,
|
|
20
|
+
id: a,
|
|
21
|
+
className: d(`${e}-nav`, b, { [`${e}-nav--expanded`]: s }),
|
|
22
|
+
children: [
|
|
23
|
+
/* @__PURE__ */ o(
|
|
24
|
+
"button",
|
|
25
|
+
{
|
|
26
|
+
"data-testid": `${a}-back-btn`,
|
|
27
|
+
tabIndex: s ? 0 : -1,
|
|
28
|
+
className: `${e}-nav__back-btn`,
|
|
29
|
+
onClick: c,
|
|
30
|
+
children: i
|
|
31
|
+
}
|
|
32
|
+
),
|
|
33
|
+
/* @__PURE__ */ o(
|
|
34
|
+
"h2",
|
|
35
|
+
{
|
|
36
|
+
id: `${a}-label`,
|
|
37
|
+
"data-testid": `${a}-label`,
|
|
38
|
+
className: d(`${e}-nav__label`, { [`${e}-nav__label--hidden`]: !n }),
|
|
39
|
+
style: { "--visible": n ? "visible" : "hidden" },
|
|
40
|
+
children: t || "Main Menu"
|
|
41
|
+
}
|
|
42
|
+
),
|
|
43
|
+
r
|
|
44
|
+
]
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
};
|
|
48
|
+
export {
|
|
49
|
+
_ as default
|
|
50
|
+
};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { LinkVariants } from '../../Link/utils';
|
|
3
|
+
export interface NavigationItemProps extends Omit<React.HTMLAttributes<HTMLLIElement>, 'onClick'> {
|
|
4
|
+
/**
|
|
5
|
+
* Optional badge for navigation item. Used currently for location of auctions
|
|
6
|
+
*/
|
|
7
|
+
badge?: React.ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* href link
|
|
10
|
+
*/
|
|
11
|
+
href?: string;
|
|
12
|
+
/**
|
|
13
|
+
* Optional listen to onClick event
|
|
14
|
+
*/
|
|
15
|
+
onClick?: (event: React.MouseEvent<HTMLLIElement>) => void;
|
|
16
|
+
/**
|
|
17
|
+
* Label for the navigation item
|
|
18
|
+
*/
|
|
19
|
+
label?: React.ReactNode;
|
|
20
|
+
/**
|
|
21
|
+
* Optional group for navigation items
|
|
22
|
+
*/
|
|
23
|
+
navGroup?: 'nav-link-lg' | 'nav-link-sm';
|
|
24
|
+
/**
|
|
25
|
+
* Optional type for navigation item
|
|
26
|
+
*/
|
|
27
|
+
navType?: LinkVariants;
|
|
28
|
+
}
|
|
29
|
+
declare const NavigationItem: ({ badge, className, href, label, navGroup, navType, onClick, ...props }: React.PropsWithChildren<NavigationItemProps>) => import("react/jsx-runtime").JSX.Element;
|
|
30
|
+
export default NavigationItem;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { jsx as a, jsxs as d } from "react/jsx-runtime";
|
|
2
|
+
import * as p from "react";
|
|
3
|
+
import { px as t } from "../../../utils/index.js";
|
|
4
|
+
import f from "../../../node_modules/classnames/index.js";
|
|
5
|
+
import x from "../../Link/Link.js";
|
|
6
|
+
import { LinkVariants as v } from "../../Link/utils.js";
|
|
7
|
+
import { HeaderContext as _ } from "../../Header/Header.js";
|
|
8
|
+
const k = ({
|
|
9
|
+
badge: e,
|
|
10
|
+
className: m = "",
|
|
11
|
+
href: r,
|
|
12
|
+
label: n,
|
|
13
|
+
navGroup: s,
|
|
14
|
+
navType: i,
|
|
15
|
+
onClick: o,
|
|
16
|
+
...l
|
|
17
|
+
}) => {
|
|
18
|
+
const { expandedItem: c } = p.useContext(_);
|
|
19
|
+
return /* @__PURE__ */ a(
|
|
20
|
+
"li",
|
|
21
|
+
{
|
|
22
|
+
...l,
|
|
23
|
+
onClick: o,
|
|
24
|
+
"data-testid": `nav-item-${n}`,
|
|
25
|
+
className: f(`${t}-nav__item`, s, m),
|
|
26
|
+
children: /* @__PURE__ */ d(x, { href: r, variant: i || v.navMain, tabIndex: c === "" ? 0 : -1, children: [
|
|
27
|
+
/* @__PURE__ */ a("span", { className: `${t}-nav__item--label`, children: n }),
|
|
28
|
+
e ? /* @__PURE__ */ a("span", { className: `${t}-nav__item--badge `, children: e }) : null
|
|
29
|
+
] })
|
|
30
|
+
}
|
|
31
|
+
);
|
|
32
|
+
};
|
|
33
|
+
export {
|
|
34
|
+
k as default
|
|
35
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface NavigationItemTriggerProps extends React.HTMLAttributes<HTMLElement> {
|
|
3
|
+
/**
|
|
4
|
+
* Label for the navigation item
|
|
5
|
+
*/
|
|
6
|
+
label: string;
|
|
7
|
+
}
|
|
8
|
+
declare const NavigationItemTrigger: ({ id, label, children, className, ...props }: React.PropsWithChildren<NavigationItemTriggerProps>) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export default NavigationItemTrigger;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { jsxs as d, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import * as l from "react";
|
|
3
|
+
import { px as t } from "../../../utils/index.js";
|
|
4
|
+
import p from "../../../node_modules/classnames/index.js";
|
|
5
|
+
import { HeaderContext as x } from "../../Header/Header.js";
|
|
6
|
+
const u = ({
|
|
7
|
+
id: r,
|
|
8
|
+
label: e,
|
|
9
|
+
children: i,
|
|
10
|
+
className: m,
|
|
11
|
+
...o
|
|
12
|
+
}) => {
|
|
13
|
+
const { expandedItem: a, onSelect: s } = l.useContext(x), c = () => s(e);
|
|
14
|
+
return /* @__PURE__ */ d(
|
|
15
|
+
"li",
|
|
16
|
+
{
|
|
17
|
+
"aria-expanded": a === e,
|
|
18
|
+
"data-testid": `nav-item-trigger-${r}`,
|
|
19
|
+
className: p(m, `${t}-nav__item`, { [`${t}-nav__item--expanded`]: a === e }),
|
|
20
|
+
onClick: c,
|
|
21
|
+
...o,
|
|
22
|
+
children: [
|
|
23
|
+
/* @__PURE__ */ n("button", { className: `${t}-nav__item-trigger`, type: "button", children: /* @__PURE__ */ n("label", { className: `${t}-nav__item--label`, children: e }) }),
|
|
24
|
+
i
|
|
25
|
+
]
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
};
|
|
29
|
+
export {
|
|
30
|
+
u as default
|
|
31
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface NavigationListProps extends React.HTMLAttributes<HTMLElement> {
|
|
3
|
+
/**
|
|
4
|
+
* id for the navigation list
|
|
5
|
+
*/
|
|
6
|
+
id: string;
|
|
7
|
+
}
|
|
8
|
+
declare const NavigationList: ({ id, children, className }: React.PropsWithChildren<NavigationListProps>) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export default NavigationList;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { jsxs as p, jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import * as r from "react";
|
|
3
|
+
import { px as a } from "../../../utils/index.js";
|
|
4
|
+
import l from "../../../node_modules/classnames/index.js";
|
|
5
|
+
import { HeaderContext as v } from "../../Header/Header.js";
|
|
6
|
+
const x = ({ id: o, children: n, className: _ }) => {
|
|
7
|
+
const { isExpanded: i } = r.useContext(v), s = r.Children.toArray(n).filter((t) => {
|
|
8
|
+
if (t && t.props.navGroup === "nav-link-lg")
|
|
9
|
+
return t;
|
|
10
|
+
}), e = r.Children.toArray(n).filter((t) => {
|
|
11
|
+
if (t && t.props.navGroup === "nav-link-sm")
|
|
12
|
+
return t;
|
|
13
|
+
});
|
|
14
|
+
return /* @__PURE__ */ p(
|
|
15
|
+
"ul",
|
|
16
|
+
{
|
|
17
|
+
id: o,
|
|
18
|
+
"data-testid": o,
|
|
19
|
+
role: "list",
|
|
20
|
+
"aria-expanded": i,
|
|
21
|
+
className: l(_, `${a}-nav__list`, { [`${a}-nav__list--expanded`]: i }),
|
|
22
|
+
children: [
|
|
23
|
+
s.length > 0 ? /* @__PURE__ */ m("div", { className: l(`${a}-nav__list__section`, `${a}-nav__list__section--large-cta`), children: s.map((t) => t) }) : null,
|
|
24
|
+
e.length > 0 ? /* @__PURE__ */ m("div", { className: l(`${a}-nav__list__section`, `${a}-nav__list__section--small-cta`), children: e.map((t) => t) }) : null,
|
|
25
|
+
!s.length && !e.length ? n : null
|
|
26
|
+
]
|
|
27
|
+
}
|
|
28
|
+
);
|
|
29
|
+
};
|
|
30
|
+
export {
|
|
31
|
+
x as default
|
|
32
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface SearchProps extends React.HTMLAttributes<HTMLElement> {
|
|
3
|
+
altText?: string;
|
|
4
|
+
useIcon?: boolean;
|
|
5
|
+
}
|
|
6
|
+
declare const Search: ({ altText, useIcon }: React.PropsWithChildren<SearchProps>) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default Search;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsxs as c, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import * as n from "react";
|
|
3
|
+
import { px as a } from "../../utils/index.js";
|
|
4
|
+
import o from "../../node_modules/classnames/index.js";
|
|
5
|
+
import p from "../Input/Input.js";
|
|
6
|
+
import i from "../../assets/search.svg.js";
|
|
7
|
+
const v = ({ altText: h = "Search", useIcon: r = !0 }) => {
|
|
8
|
+
const [t, l] = n.useState(!1), s = () => {
|
|
9
|
+
l(!t);
|
|
10
|
+
};
|
|
11
|
+
return /* @__PURE__ */ c("div", { "data-testid": "header-search", className: `${a}-search`, role: "search", children: [
|
|
12
|
+
/* @__PURE__ */ e(
|
|
13
|
+
"div",
|
|
14
|
+
{
|
|
15
|
+
"data-testid": "search-overlay",
|
|
16
|
+
className: o(`${a}-search__overlay`, { [`${a}-search__overlay--active`]: t }),
|
|
17
|
+
onClick: s
|
|
18
|
+
}
|
|
19
|
+
),
|
|
20
|
+
/* @__PURE__ */ e("button", { "data-testid": "search-button", className: `${a}-search__button`, onClick: s, children: r ? /* @__PURE__ */ e(i, { "data-testid": "search-button-icon", className: `${a}-search__button__icon` }) : "Search" }),
|
|
21
|
+
/* @__PURE__ */ c(
|
|
22
|
+
"form",
|
|
23
|
+
{
|
|
24
|
+
"data-testid": "search-form",
|
|
25
|
+
className: o(
|
|
26
|
+
`${a}-search__input-wrapper`,
|
|
27
|
+
{ [`${a}-search__input-wrapper--active`]: t },
|
|
28
|
+
{ [`${a}-search__input-wrapper--use-icon`]: r }
|
|
29
|
+
),
|
|
30
|
+
children: [
|
|
31
|
+
r ? /* @__PURE__ */ e(i, { "data-testid": "search-form-icon", className: `${a}-search__input-wrapper__icon` }) : null,
|
|
32
|
+
/* @__PURE__ */ e(
|
|
33
|
+
p,
|
|
34
|
+
{
|
|
35
|
+
className: `${a}-search__input`,
|
|
36
|
+
alt: h,
|
|
37
|
+
hideLabel: !0,
|
|
38
|
+
placeholder: "Type to search",
|
|
39
|
+
type: "text"
|
|
40
|
+
}
|
|
41
|
+
)
|
|
42
|
+
]
|
|
43
|
+
}
|
|
44
|
+
)
|
|
45
|
+
] });
|
|
46
|
+
};
|
|
47
|
+
export {
|
|
48
|
+
v as default
|
|
49
|
+
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import { LinkProps } from '../Link/Link';
|
|
3
|
+
import { SupportedLanguages } from '../../types/commonTypes';
|
|
4
|
+
export interface UserManagementProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
5
|
+
languageOptions?: {
|
|
6
|
+
label: string;
|
|
7
|
+
value: SupportedLanguages;
|
|
8
|
+
}[];
|
|
9
|
+
currentLanguage?: SupportedLanguages;
|
|
10
|
+
onLanguageChange?: (language: SupportedLanguages) => void;
|
|
11
|
+
isLoggedIn?: boolean;
|
|
12
|
+
onLogin?: () => void;
|
|
13
|
+
onLogout?: () => void;
|
|
14
|
+
accountDetailsLink?: React.ElementType<LinkProps>;
|
|
15
|
+
loginLabel?: ReactNode;
|
|
16
|
+
logoutLabel?: ReactNode;
|
|
17
|
+
}
|
|
18
|
+
declare const UserManagement: ({ accountDetailsLink, children, className, currentLanguage, languageOptions, onLanguageChange, isLoggedIn, onLogin, onLogout, loginLabel, logoutLabel, ...props }: React.PropsWithChildren<UserManagementProps>) => import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
export default UserManagement;
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { jsxs as g, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { getCommonProps as x, px as j, noOp as s } from "../../utils/index.js";
|
|
3
|
+
import A from "../Input/Input.js";
|
|
4
|
+
import E from "../../assets/account_circle.svg.js";
|
|
5
|
+
import M from "../Navigation/NavigationItemTrigger/NavigationItemTrigger.js";
|
|
6
|
+
import P from "../Navigation/NavigationList/NavigationList.js";
|
|
7
|
+
import S from "../Navigation/NavigationItem/NavigationItem.js";
|
|
8
|
+
import { SupportedLanguages as o } from "../../types/commonTypes.js";
|
|
9
|
+
import T from "../../node_modules/classnames/index.js";
|
|
10
|
+
const H = ({
|
|
11
|
+
accountDetailsLink: m,
|
|
12
|
+
children: p,
|
|
13
|
+
className: v,
|
|
14
|
+
currentLanguage: n = o.en,
|
|
15
|
+
languageOptions: i = [
|
|
16
|
+
{ label: "English", value: o.en },
|
|
17
|
+
{ label: "中文", value: o.zh }
|
|
18
|
+
],
|
|
19
|
+
onLanguageChange: d = s,
|
|
20
|
+
isLoggedIn: r = !1,
|
|
21
|
+
onLogin: f = s,
|
|
22
|
+
onLogout: h = s,
|
|
23
|
+
loginLabel: N = "Login",
|
|
24
|
+
logoutLabel: _ = "Logout",
|
|
25
|
+
...t
|
|
26
|
+
}) => {
|
|
27
|
+
var c, u;
|
|
28
|
+
const { className: l, ...b } = x(t, "UserManagement"), C = (u = (c = i.find((e) => e.value === n)) == null ? void 0 : c.label) != null ? u : "English", $ = m != null ? m : "a";
|
|
29
|
+
return /* @__PURE__ */ g("div", { ...b, className: T(l, v), ...t, children: [
|
|
30
|
+
/* @__PURE__ */ g("ul", { className: `${l}__account-wrapper`, children: [
|
|
31
|
+
r && /* @__PURE__ */ a($, { children: /* @__PURE__ */ a(E, { className: `${l}__account-icon` }) }),
|
|
32
|
+
/* @__PURE__ */ a(S, { onClick: r ? h : f, label: r ? _ : N })
|
|
33
|
+
] }),
|
|
34
|
+
/* @__PURE__ */ a(M, { className: `${l}__language`, label: C, children: /* @__PURE__ */ a(P, { id: `${j}-langauge-selection-list`, className: `${l}__language__selections`, children: i.map((e) => /* @__PURE__ */ a("li", { children: /* @__PURE__ */ a(
|
|
35
|
+
A,
|
|
36
|
+
{
|
|
37
|
+
type: "radio",
|
|
38
|
+
id: `radio-${e.value}`,
|
|
39
|
+
labelText: e.label,
|
|
40
|
+
value: e.value,
|
|
41
|
+
inline: !0,
|
|
42
|
+
name: "languages",
|
|
43
|
+
checked: e.value === n,
|
|
44
|
+
onChange: () => d(e.value)
|
|
45
|
+
}
|
|
46
|
+
) }, e.value)) }) }),
|
|
47
|
+
p
|
|
48
|
+
] });
|
|
49
|
+
};
|
|
50
|
+
export {
|
|
51
|
+
H as default
|
|
52
|
+
};
|
package/dist/index.d.ts
CHANGED
|
@@ -6,6 +6,10 @@ export { default as ErrorBoundary, type ErrorBoundaryProps } from './components/
|
|
|
6
6
|
export { default as Footer, type FooterProps } from './components/Footer/Footer';
|
|
7
7
|
export { default as Grid, type GridProps } from './components/Grid/Grid';
|
|
8
8
|
export { default as Header, type HeaderProps } from './components/Header/Header';
|
|
9
|
+
export { default as Navigation, type NavigationProps } from './components/Navigation/Navigation';
|
|
10
|
+
export { default as NavigationItem, type NavigationItemProps, } from './components/Navigation/NavigationItem/NavigationItem';
|
|
11
|
+
export { default as NavigationItemTrigger, type NavigationItemTriggerProps, } from './components/Navigation/NavigationItemTrigger/NavigationItemTrigger';
|
|
12
|
+
export { default as NavigationList, type NavigationListProps, } from './components/Navigation/NavigationList/NavigationList';
|
|
9
13
|
export { default as HeroBanner, type HeroBannerProps } from './components/HeroBanner/HeroBanner';
|
|
10
14
|
export { default as Input, type InputProps } from './components/Input/Input';
|
|
11
15
|
export { default as Link, type LinkProps } from './components/Link/Link';
|
|
@@ -15,6 +19,7 @@ export { default as LinkList, type LinkListProps } from './components/LinkList/L
|
|
|
15
19
|
export { default as Row, type RowProps } from './components/Row/Row';
|
|
16
20
|
export { default as GridItem, type GridItemProps } from './components/GridItem/GridItem';
|
|
17
21
|
export { GridItemAlign } from './components/GridItem/types';
|
|
22
|
+
export { default as Search, type SearchProps } from './components/Search/Search';
|
|
18
23
|
export { default as Select, type SelectProps } from './components/Select/Select';
|
|
19
24
|
export { default as SplitPanel, type SplitPanelProps } from './components/SplitPanel/SplitPanel';
|
|
20
25
|
export { default as Subscribe, type SubscribeProps } from './components/Subscribe/Subscribe';
|
|
@@ -24,3 +29,5 @@ export { default as ViewingsList, type ViewingsListProps } from './components/Vi
|
|
|
24
29
|
export { default as Modal, type ModalProps } from './components/Modal/Modal';
|
|
25
30
|
export { default as StatefulViewingsList, type StatefulViewingsListProps, } from './components/ViewingsList/StatefulViewingsList';
|
|
26
31
|
export * from './components/Text';
|
|
32
|
+
export { default as UserManagement, type UserManagementProps } from './components/UserManagement/UserManagement';
|
|
33
|
+
export * from './types/commonTypes';
|