@internetarchive/ia-topnav 1.4.0 → 1.4.1-alpha-webdev8259.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.
- package/.prettierignore +1 -1
- package/LICENSE +661 -661
- package/README.md +147 -147
- package/demo/index.html +28 -28
- package/dist/src/ia-topnav.d.ts +1 -9
- package/dist/src/ia-topnav.js +4 -59
- package/dist/src/ia-topnav.js.map +1 -1
- package/dist/src/primary-nav.d.ts +5 -4
- package/dist/src/primary-nav.js +14 -35
- package/dist/src/primary-nav.js.map +1 -1
- package/dist/src/styles/primary-nav.js +35 -0
- package/dist/src/styles/primary-nav.js.map +1 -1
- package/dist/test/ia-topnav.test.js +18 -60
- package/dist/test/ia-topnav.test.js.map +1 -1
- package/dist/test/primary-nav.test.js +32 -2
- package/dist/test/primary-nav.test.js.map +1 -1
- package/eslint.config.mjs +53 -53
- package/package.json +72 -72
- package/prettier.config.js +9 -9
- package/src/ia-topnav.ts +5 -70
- package/src/primary-nav.ts +14 -33
- package/src/styles/primary-nav.ts +35 -0
- package/ssl/server.key +28 -28
- package/test/ia-topnav.test.ts +20 -81
- package/test/primary-nav.test.ts +44 -2
- package/tsconfig.json +31 -31
- package/web-dev-server.config.mjs +32 -32
- package/web-test-runner.config.mjs +41 -41
package/README.md
CHANGED
|
@@ -1,147 +1,147 @@
|
|
|
1
|
-
# The top navigation menu component for archive.org
|
|
2
|
-
|
|
3
|
-
## Update guide
|
|
4
|
-
https://git.archive.org/www/offshoot/-/blob/main/guides/update-top-nav.md
|
|
5
|
-
## Installation
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
npm i -S @internetarchive/ia-topnav
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
## Usage
|
|
12
|
-
|
|
13
|
-
@see [www/index.html](www/index.html) for the simplest example with all the defaults
|
|
14
|
-
|
|
15
|
-
* Demo app is in another directory: `/www/index.html`
|
|
16
|
-
* `npm run start` - runs local server in Demo directory which is in `/www` folder
|
|
17
|
-
* you can also just use your preferred server
|
|
18
|
-
* open demo: `http://localhost:8000/www/index.html`
|
|
19
|
-
|
|
20
|
-
It shows a dynamic change of the logged in user name -- and how it will re-paint the menus.
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
```js
|
|
24
|
-
// ia-top-nav.js
|
|
25
|
-
import IATopNav from '@internetarchive/ia-topnav';
|
|
26
|
-
export default IATopNav;
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
```html
|
|
30
|
-
<!-- index.html -->
|
|
31
|
-
<script type="module">
|
|
32
|
-
import './ia-topnav.js';
|
|
33
|
-
</script>
|
|
34
|
-
|
|
35
|
-
<style>
|
|
36
|
-
/* Defaults */
|
|
37
|
-
ia-topnav {
|
|
38
|
-
--white: #fff;
|
|
39
|
-
--grey13: #222;
|
|
40
|
-
--grey20: #333;
|
|
41
|
-
--grey40: #666;
|
|
42
|
-
--grey28: #474747;
|
|
43
|
-
--grey60: #999;
|
|
44
|
-
--grey66: #aaa;
|
|
45
|
-
--grey80: #ccc;
|
|
46
|
-
--errorYellow: #ffcd27;
|
|
47
|
-
|
|
48
|
-
--linkColor: #4b64ff;
|
|
49
|
-
--linkHoverColor: var(--white);
|
|
50
|
-
--subnavLinkColor: var(--grey66);
|
|
51
|
-
--primaryTextColor: var(--white);
|
|
52
|
-
--inverseTextColor: var(--grey20);
|
|
53
|
-
--lightTextColor: var(--grey60);
|
|
54
|
-
--activeColor: var(--white);
|
|
55
|
-
--activeButtonBg: var(--grey20);
|
|
56
|
-
--iconFill: var(--grey60);
|
|
57
|
-
|
|
58
|
-
--searchActiveBg: var(--grey20);
|
|
59
|
-
--searchActiveInputBg: var(--white);
|
|
60
|
-
--searchMenuBg: var(--grey20);
|
|
61
|
-
--desktopSearchIconFill: var(--grey20);
|
|
62
|
-
|
|
63
|
-
--mediaMenuBg: var(--grey13);
|
|
64
|
-
--mediaLabelDesktopColor: var(--grey60);
|
|
65
|
-
--activeDesktopMenuIcon: var(--grey28);
|
|
66
|
-
|
|
67
|
-
--mediaSliderBg: var(--grey20);
|
|
68
|
-
--mediaSliderDesktopBg: var(--grey28);
|
|
69
|
-
|
|
70
|
-
--primaryNavBg: var(--grey13);
|
|
71
|
-
--primaryNavBottomBorder: var(--grey20);
|
|
72
|
-
|
|
73
|
-
--desktopSubnavBg: var(--grey20);
|
|
74
|
-
|
|
75
|
-
--dropdownMenuBg: var(--grey20);
|
|
76
|
-
--dropdownMenuInfoItem: var(--grey60);
|
|
77
|
-
--dropdownMenuDivider: var(--grey40);
|
|
78
|
-
|
|
79
|
-
--loginTextColor: var(--grey60);
|
|
80
|
-
|
|
81
|
-
--themeFontFamily: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
82
|
-
--logoWidthTablet: 263px;
|
|
83
|
-
|
|
84
|
-
--savePageSubmitBg: var(--grey13);
|
|
85
|
-
--savePageSubmitText: var(--white);
|
|
86
|
-
--savePageInputBorder: var(--grey60);
|
|
87
|
-
--savePageErrorText: var(--errorYellow);
|
|
88
|
-
|
|
89
|
-
--topOffset: -1500px;
|
|
90
|
-
}
|
|
91
|
-
</style>
|
|
92
|
-
|
|
93
|
-
<!--
|
|
94
|
-
`baseHost` is the navigation base so leave emtpy for relative links
|
|
95
|
-
`mediaBaseHost` is the base host for media like the profile picture if it's not relative
|
|
96
|
-
|
|
97
|
-
NOTE:
|
|
98
|
-
When passing in the `searchQuery` attribute from HTML, not LitElement bindings,
|
|
99
|
-
you must base64 the value to account for any special characters.
|
|
100
|
-
-->
|
|
101
|
-
<ia-topnav
|
|
102
|
-
baseHost="https://archive.org"
|
|
103
|
-
mediaBaseHost="https://archive.org"
|
|
104
|
-
hideSearch=${true}
|
|
105
|
-
username="shaneriley"
|
|
106
|
-
screenName="long_screen_name_that_gets_truncated"
|
|
107
|
-
searchQuery="J2Zvbyc="
|
|
108
|
-
></ia-topnav>
|
|
109
|
-
```
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
**Menus object:**
|
|
113
|
-
|
|
114
|
-
Please see [src/data/menus.js](the menu objects) for our valid `menus` property.
|
|
115
|
-
|
|
116
|
-
# Development
|
|
117
|
-
|
|
118
|
-
## Prerequisite
|
|
119
|
-
|
|
120
|
-
```bash
|
|
121
|
-
npm install
|
|
122
|
-
```
|
|
123
|
-
|
|
124
|
-
## Start Development Server
|
|
125
|
-
|
|
126
|
-
```bash
|
|
127
|
-
npm run start // start development server and typescript compiler
|
|
128
|
-
```
|
|
129
|
-
then open demo - http://localhost:8000/www/index.html
|
|
130
|
-
|
|
131
|
-
## Testing
|
|
132
|
-
|
|
133
|
-
```bash
|
|
134
|
-
npm run test
|
|
135
|
-
```
|
|
136
|
-
|
|
137
|
-
## Testing via browserstack
|
|
138
|
-
|
|
139
|
-
```bash
|
|
140
|
-
npm run test:bs
|
|
141
|
-
```
|
|
142
|
-
|
|
143
|
-
## Linting
|
|
144
|
-
|
|
145
|
-
```bash
|
|
146
|
-
npm run lint
|
|
147
|
-
```
|
|
1
|
+
# The top navigation menu component for archive.org
|
|
2
|
+
|
|
3
|
+
## Update guide
|
|
4
|
+
https://git.archive.org/www/offshoot/-/blob/main/guides/update-top-nav.md
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm i -S @internetarchive/ia-topnav
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
@see [www/index.html](www/index.html) for the simplest example with all the defaults
|
|
14
|
+
|
|
15
|
+
* Demo app is in another directory: `/www/index.html`
|
|
16
|
+
* `npm run start` - runs local server in Demo directory which is in `/www` folder
|
|
17
|
+
* you can also just use your preferred server
|
|
18
|
+
* open demo: `http://localhost:8000/www/index.html`
|
|
19
|
+
|
|
20
|
+
It shows a dynamic change of the logged in user name -- and how it will re-paint the menus.
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
```js
|
|
24
|
+
// ia-top-nav.js
|
|
25
|
+
import IATopNav from '@internetarchive/ia-topnav';
|
|
26
|
+
export default IATopNav;
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
```html
|
|
30
|
+
<!-- index.html -->
|
|
31
|
+
<script type="module">
|
|
32
|
+
import './ia-topnav.js';
|
|
33
|
+
</script>
|
|
34
|
+
|
|
35
|
+
<style>
|
|
36
|
+
/* Defaults */
|
|
37
|
+
ia-topnav {
|
|
38
|
+
--white: #fff;
|
|
39
|
+
--grey13: #222;
|
|
40
|
+
--grey20: #333;
|
|
41
|
+
--grey40: #666;
|
|
42
|
+
--grey28: #474747;
|
|
43
|
+
--grey60: #999;
|
|
44
|
+
--grey66: #aaa;
|
|
45
|
+
--grey80: #ccc;
|
|
46
|
+
--errorYellow: #ffcd27;
|
|
47
|
+
|
|
48
|
+
--linkColor: #4b64ff;
|
|
49
|
+
--linkHoverColor: var(--white);
|
|
50
|
+
--subnavLinkColor: var(--grey66);
|
|
51
|
+
--primaryTextColor: var(--white);
|
|
52
|
+
--inverseTextColor: var(--grey20);
|
|
53
|
+
--lightTextColor: var(--grey60);
|
|
54
|
+
--activeColor: var(--white);
|
|
55
|
+
--activeButtonBg: var(--grey20);
|
|
56
|
+
--iconFill: var(--grey60);
|
|
57
|
+
|
|
58
|
+
--searchActiveBg: var(--grey20);
|
|
59
|
+
--searchActiveInputBg: var(--white);
|
|
60
|
+
--searchMenuBg: var(--grey20);
|
|
61
|
+
--desktopSearchIconFill: var(--grey20);
|
|
62
|
+
|
|
63
|
+
--mediaMenuBg: var(--grey13);
|
|
64
|
+
--mediaLabelDesktopColor: var(--grey60);
|
|
65
|
+
--activeDesktopMenuIcon: var(--grey28);
|
|
66
|
+
|
|
67
|
+
--mediaSliderBg: var(--grey20);
|
|
68
|
+
--mediaSliderDesktopBg: var(--grey28);
|
|
69
|
+
|
|
70
|
+
--primaryNavBg: var(--grey13);
|
|
71
|
+
--primaryNavBottomBorder: var(--grey20);
|
|
72
|
+
|
|
73
|
+
--desktopSubnavBg: var(--grey20);
|
|
74
|
+
|
|
75
|
+
--dropdownMenuBg: var(--grey20);
|
|
76
|
+
--dropdownMenuInfoItem: var(--grey60);
|
|
77
|
+
--dropdownMenuDivider: var(--grey40);
|
|
78
|
+
|
|
79
|
+
--loginTextColor: var(--grey60);
|
|
80
|
+
|
|
81
|
+
--themeFontFamily: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
82
|
+
--logoWidthTablet: 263px;
|
|
83
|
+
|
|
84
|
+
--savePageSubmitBg: var(--grey13);
|
|
85
|
+
--savePageSubmitText: var(--white);
|
|
86
|
+
--savePageInputBorder: var(--grey60);
|
|
87
|
+
--savePageErrorText: var(--errorYellow);
|
|
88
|
+
|
|
89
|
+
--topOffset: -1500px;
|
|
90
|
+
}
|
|
91
|
+
</style>
|
|
92
|
+
|
|
93
|
+
<!--
|
|
94
|
+
`baseHost` is the navigation base so leave emtpy for relative links
|
|
95
|
+
`mediaBaseHost` is the base host for media like the profile picture if it's not relative
|
|
96
|
+
|
|
97
|
+
NOTE:
|
|
98
|
+
When passing in the `searchQuery` attribute from HTML, not LitElement bindings,
|
|
99
|
+
you must base64 the value to account for any special characters.
|
|
100
|
+
-->
|
|
101
|
+
<ia-topnav
|
|
102
|
+
baseHost="https://archive.org"
|
|
103
|
+
mediaBaseHost="https://archive.org"
|
|
104
|
+
hideSearch=${true}
|
|
105
|
+
username="shaneriley"
|
|
106
|
+
screenName="long_screen_name_that_gets_truncated"
|
|
107
|
+
searchQuery="J2Zvbyc="
|
|
108
|
+
></ia-topnav>
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
**Menus object:**
|
|
113
|
+
|
|
114
|
+
Please see [src/data/menus.js](the menu objects) for our valid `menus` property.
|
|
115
|
+
|
|
116
|
+
# Development
|
|
117
|
+
|
|
118
|
+
## Prerequisite
|
|
119
|
+
|
|
120
|
+
```bash
|
|
121
|
+
npm install
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
## Start Development Server
|
|
125
|
+
|
|
126
|
+
```bash
|
|
127
|
+
npm run start // start development server and typescript compiler
|
|
128
|
+
```
|
|
129
|
+
then open demo - http://localhost:8000/www/index.html
|
|
130
|
+
|
|
131
|
+
## Testing
|
|
132
|
+
|
|
133
|
+
```bash
|
|
134
|
+
npm run test
|
|
135
|
+
```
|
|
136
|
+
|
|
137
|
+
## Testing via browserstack
|
|
138
|
+
|
|
139
|
+
```bash
|
|
140
|
+
npm run test:bs
|
|
141
|
+
```
|
|
142
|
+
|
|
143
|
+
## Linting
|
|
144
|
+
|
|
145
|
+
```bash
|
|
146
|
+
npm run lint
|
|
147
|
+
```
|
package/demo/index.html
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en-GB">
|
|
3
|
-
|
|
4
|
-
<head>
|
|
5
|
-
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
-
<meta charset="utf-8">
|
|
7
|
-
<title>Internet Archive topnav component</title>
|
|
8
|
-
<style>
|
|
9
|
-
html {
|
|
10
|
-
font-size: 10px;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
body {
|
|
14
|
-
background: #fafafa;
|
|
15
|
-
margin: 0;
|
|
16
|
-
padding: 0;
|
|
17
|
-
}
|
|
18
|
-
</style>
|
|
19
|
-
</head>
|
|
20
|
-
|
|
21
|
-
<body>
|
|
22
|
-
<app-root></app-root>
|
|
23
|
-
|
|
24
|
-
<script type="module" src="../dist/demo/app-root.js">
|
|
25
|
-
</script>
|
|
26
|
-
</body>
|
|
27
|
-
|
|
28
|
-
</html>
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en-GB">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
+
<meta charset="utf-8">
|
|
7
|
+
<title>Internet Archive topnav component</title>
|
|
8
|
+
<style>
|
|
9
|
+
html {
|
|
10
|
+
font-size: 10px;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
body {
|
|
14
|
+
background: #fafafa;
|
|
15
|
+
margin: 0;
|
|
16
|
+
padding: 0;
|
|
17
|
+
}
|
|
18
|
+
</style>
|
|
19
|
+
</head>
|
|
20
|
+
|
|
21
|
+
<body>
|
|
22
|
+
<app-root></app-root>
|
|
23
|
+
|
|
24
|
+
<script type="module" src="../dist/demo/app-root.js">
|
|
25
|
+
</script>
|
|
26
|
+
</body>
|
|
27
|
+
|
|
28
|
+
</html>
|
package/dist/src/ia-topnav.d.ts
CHANGED
|
@@ -4,7 +4,6 @@ import './dropdown-menu';
|
|
|
4
4
|
import './media-slider';
|
|
5
5
|
import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from './models';
|
|
6
6
|
import './primary-nav';
|
|
7
|
-
import './search-menu';
|
|
8
7
|
import './signed-out-dropdown';
|
|
9
8
|
import './user-menu';
|
|
10
9
|
export declare class IATopNav extends LitElement {
|
|
@@ -20,8 +19,6 @@ export declare class IATopNav extends LitElement {
|
|
|
20
19
|
mediaSliderOpen: boolean;
|
|
21
20
|
openMenu: string;
|
|
22
21
|
screenName: string;
|
|
23
|
-
searchIn: string;
|
|
24
|
-
searchQuery: string;
|
|
25
22
|
selectedMenuOption: string;
|
|
26
23
|
username: string;
|
|
27
24
|
userProfileImagePath: string;
|
|
@@ -31,26 +28,20 @@ export declare class IATopNav extends LitElement {
|
|
|
31
28
|
moveTo: string;
|
|
32
29
|
};
|
|
33
30
|
private menus;
|
|
34
|
-
private previousKeydownListener;
|
|
35
|
-
private keyboardNavigation?;
|
|
36
31
|
private get normalizedBaseHost();
|
|
37
32
|
static get styles(): import("lit").CSSResult;
|
|
38
33
|
updated(props: PropertyValues): void;
|
|
39
34
|
firstUpdated(): void;
|
|
40
35
|
menuSetup(): void;
|
|
41
36
|
menuToggled(e: CustomEvent): void;
|
|
42
|
-
navSearchBlurEvent(e: CustomEvent): void;
|
|
43
37
|
openMediaSlider(): void;
|
|
44
38
|
closeMediaSlider(): void;
|
|
45
39
|
closeMenus(): void;
|
|
46
|
-
searchInChanged(e: CustomEvent): void;
|
|
47
40
|
trackClick(e: CustomEvent): void;
|
|
48
41
|
trackSubmit(e: CustomEvent): void;
|
|
49
42
|
mediaTypeSelected(e: CustomEvent): void;
|
|
50
|
-
get searchMenuOpened(): boolean;
|
|
51
43
|
get signedOutOpened(): boolean;
|
|
52
44
|
get userMenuOpened(): boolean;
|
|
53
|
-
get searchMenuTabIndex(): "" | "-1";
|
|
54
45
|
get userMenuTabIndex(): "" | "-1";
|
|
55
46
|
get signedOutTabIndex(): "" | "-1";
|
|
56
47
|
get closeLayerClass(): "" | "visible";
|
|
@@ -64,6 +55,7 @@ export declare class IATopNav extends LitElement {
|
|
|
64
55
|
*/
|
|
65
56
|
get userMenuItems(): import("./models").IATopNavLink[][];
|
|
66
57
|
get allowSecondaryIcon(): boolean;
|
|
58
|
+
get searchSlot(): import("lit").TemplateResult<1>;
|
|
67
59
|
get secondLogoSlot(): import("lit").TemplateResult<1> | typeof nothing;
|
|
68
60
|
get separatorTemplate(): import("lit").TemplateResult<1>;
|
|
69
61
|
render(): import("lit").TemplateResult<1>;
|
package/dist/src/ia-topnav.js
CHANGED
|
@@ -6,11 +6,9 @@ import './desktop-subnav';
|
|
|
6
6
|
import './dropdown-menu';
|
|
7
7
|
import './media-slider';
|
|
8
8
|
import './primary-nav';
|
|
9
|
-
import './search-menu';
|
|
10
9
|
import './signed-out-dropdown';
|
|
11
10
|
import iaTopNavCSS from './styles/ia-topnav';
|
|
12
11
|
import './user-menu';
|
|
13
|
-
import KeyboardNavigation from './lib/keyboard-navigation';
|
|
14
12
|
let IATopNav = class IATopNav extends LitElement {
|
|
15
13
|
constructor() {
|
|
16
14
|
super(...arguments);
|
|
@@ -26,8 +24,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
26
24
|
this.mediaSliderOpen = false;
|
|
27
25
|
this.openMenu = '';
|
|
28
26
|
this.screenName = '';
|
|
29
|
-
this.searchIn = '';
|
|
30
|
-
this.searchQuery = '';
|
|
31
27
|
this.selectedMenuOption = '';
|
|
32
28
|
this.username = '';
|
|
33
29
|
this.userProfileImagePath = '/services/img/user/profile';
|
|
@@ -41,7 +37,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
41
37
|
return iaTopNavCSS;
|
|
42
38
|
}
|
|
43
39
|
updated(props) {
|
|
44
|
-
var _a;
|
|
45
40
|
if (props.has('username') ||
|
|
46
41
|
props.has('waybackPagesArchived') ||
|
|
47
42
|
props.has('itemIdentifier') ||
|
|
@@ -49,17 +44,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
49
44
|
props.has('baseHost')) {
|
|
50
45
|
this.menuSetup();
|
|
51
46
|
}
|
|
52
|
-
if (this.openMenu === 'search') {
|
|
53
|
-
const targetElement = (_a = this.renderRoot.querySelector('search-menu')) === null || _a === void 0 ? void 0 : _a.shadowRoot;
|
|
54
|
-
if (targetElement) {
|
|
55
|
-
this.keyboardNavigation = new KeyboardNavigation(targetElement, this.openMenu);
|
|
56
|
-
if (this.previousKeydownListener) {
|
|
57
|
-
this.removeEventListener('keydown', this.previousKeydownListener);
|
|
58
|
-
}
|
|
59
|
-
this.addEventListener('keydown', this.keyboardNavigation.handleKeyDown);
|
|
60
|
-
this.previousKeydownListener = this.keyboardNavigation.handleKeyDown;
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
47
|
}
|
|
64
48
|
firstUpdated() {
|
|
65
49
|
// close open menu on `esc` click
|
|
@@ -83,20 +67,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
83
67
|
}
|
|
84
68
|
this.closeMediaSlider();
|
|
85
69
|
}
|
|
86
|
-
navSearchBlurEvent(e) {
|
|
87
|
-
var _a, _b;
|
|
88
|
-
if (this.previousKeydownListener) {
|
|
89
|
-
this.removeEventListener('keydown', this.previousKeydownListener);
|
|
90
|
-
}
|
|
91
|
-
const isUploadButton = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.isUploadButton;
|
|
92
|
-
if (!isUploadButton) {
|
|
93
|
-
const searchMenu = this.renderRoot.querySelector('search-menu');
|
|
94
|
-
const elements = (_b = this.keyboardNavigation) === null || _b === void 0 ? void 0 : _b.getFocusableElements();
|
|
95
|
-
if (searchMenu && (elements === null || elements === void 0 ? void 0 : elements.length)) {
|
|
96
|
-
elements[0].focus();
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
70
|
openMediaSlider() {
|
|
101
71
|
this.mediaSliderOpen = true;
|
|
102
72
|
}
|
|
@@ -108,9 +78,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
108
78
|
this.openMenu = '';
|
|
109
79
|
this.closeMediaSlider();
|
|
110
80
|
}
|
|
111
|
-
searchInChanged(e) {
|
|
112
|
-
this.searchIn = e.detail.searchIn;
|
|
113
|
-
}
|
|
114
81
|
trackClick(e) {
|
|
115
82
|
this.dispatchEvent(new CustomEvent('analyticsClick', {
|
|
116
83
|
bubbles: true,
|
|
@@ -133,18 +100,12 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
133
100
|
this.selectedMenuOption = e.detail.mediatype;
|
|
134
101
|
this.openMediaSlider();
|
|
135
102
|
}
|
|
136
|
-
get searchMenuOpened() {
|
|
137
|
-
return this.openMenu === 'search';
|
|
138
|
-
}
|
|
139
103
|
get signedOutOpened() {
|
|
140
104
|
return this.openMenu === 'login';
|
|
141
105
|
}
|
|
142
106
|
get userMenuOpened() {
|
|
143
107
|
return this.openMenu === 'user';
|
|
144
108
|
}
|
|
145
|
-
get searchMenuTabIndex() {
|
|
146
|
-
return this.searchMenuOpened ? '' : '-1';
|
|
147
|
-
}
|
|
148
109
|
get userMenuTabIndex() {
|
|
149
110
|
return this.userMenuOpened ? '' : '-1';
|
|
150
111
|
}
|
|
@@ -206,6 +167,9 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
206
167
|
get allowSecondaryIcon() {
|
|
207
168
|
return this.secondIdentitySlotMode === 'allow';
|
|
208
169
|
}
|
|
170
|
+
get searchSlot() {
|
|
171
|
+
return html `<slot name="custom-search" slot="custom-search"></slot>`;
|
|
172
|
+
}
|
|
209
173
|
get secondLogoSlot() {
|
|
210
174
|
return this.allowSecondaryIcon
|
|
211
175
|
? html `
|
|
@@ -226,8 +190,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
226
190
|
.config=${this.config}
|
|
227
191
|
.openMenu=${this.openMenu}
|
|
228
192
|
.screenName=${this.screenName}
|
|
229
|
-
.searchIn=${this.searchIn}
|
|
230
|
-
.searchQuery=${this.searchQuery}
|
|
231
193
|
.secondIdentitySlotMode=${this.secondIdentitySlotMode}
|
|
232
194
|
.selectedMenuOption=${this.selectedMenuOption}
|
|
233
195
|
.username=${this.username}
|
|
@@ -238,9 +200,8 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
238
200
|
@trackClick=${this.trackClick}
|
|
239
201
|
@trackSubmit=${this.trackSubmit}
|
|
240
202
|
@menuToggled=${this.menuToggled}
|
|
241
|
-
@navSearchBlur=${this.navSearchBlurEvent}
|
|
242
203
|
>
|
|
243
|
-
${this.secondLogoSlot}
|
|
204
|
+
${this.secondLogoSlot} ${this.searchSlot}
|
|
244
205
|
</primary-nav>
|
|
245
206
|
<media-slider
|
|
246
207
|
.baseHost=${this.normalizedBaseHost}
|
|
@@ -253,16 +214,6 @@ let IATopNav = class IATopNav extends LitElement {
|
|
|
253
214
|
></media-slider>
|
|
254
215
|
</div>
|
|
255
216
|
${this.username ? this.userMenu : this.signedOutDropdown}
|
|
256
|
-
<search-menu
|
|
257
|
-
.baseHost=${this.normalizedBaseHost}
|
|
258
|
-
.config=${this.config}
|
|
259
|
-
.openMenu=${this.openMenu}
|
|
260
|
-
tabindex="${this.searchMenuTabIndex}"
|
|
261
|
-
?hideSearch=${this.hideSearch}
|
|
262
|
-
@searchInChanged=${this.searchInChanged}
|
|
263
|
-
@trackClick=${this.trackClick}
|
|
264
|
-
@trackSubmit=${this.trackSubmit}
|
|
265
|
-
></search-menu>
|
|
266
217
|
<desktop-subnav
|
|
267
218
|
.baseHost=${this.normalizedBaseHost}
|
|
268
219
|
.menuItems=${this.menus.more.links}
|
|
@@ -312,12 +263,6 @@ __decorate([
|
|
|
312
263
|
__decorate([
|
|
313
264
|
property({ type: String })
|
|
314
265
|
], IATopNav.prototype, "screenName", void 0);
|
|
315
|
-
__decorate([
|
|
316
|
-
property({ type: String })
|
|
317
|
-
], IATopNav.prototype, "searchIn", void 0);
|
|
318
|
-
__decorate([
|
|
319
|
-
property({ type: String })
|
|
320
|
-
], IATopNav.prototype, "searchQuery", void 0);
|
|
321
266
|
__decorate([
|
|
322
267
|
property({ type: String })
|
|
323
268
|
], IATopNav.prototype, "selectedMenuOption", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ia-topnav.js","sourceRoot":"","sources":["../../src/ia-topnav.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;AACzB,OAAO,gBAAgB,CAAC;AAMxB,OAAO,eAAe,CAAC;AACvB,OAAO,eAAe,CAAC;AACvB,OAAO,uBAAuB,CAAC;AAC/B,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,aAAa,CAAC;AACrB,OAAO,kBAAkB,MAAM,2BAA2B,CAAC;AAGpD,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QACwB,eAAU,GAAG,KAAK,CAAC;QAEpB,yBAAoB,GAAG,EAAE,CAAC;QAE1B,aAAQ,GAAG,qBAAqB,CAAC;QAEjC,kBAAa,GAAG,qBAAqB,CAAC;QAErC,UAAK,GAAG,KAAK,CAAC;QAEd,mBAAc,GAAG,KAAK,CAAC;QAExB,WAAM,GAAmB,mBAAmB,CAAC;QAE5C,eAAU,GAAG,KAAK,CAAC;QAEpB,mBAAc,GAAG,EAAE,CAAC;QAEnB,oBAAe,GAAG,KAAK,CAAC;QAEzB,aAAQ,GAAG,EAAE,CAAC;QAEd,eAAU,GAAW,EAAE,CAAC;QAExB,aAAQ,GAAG,EAAE,CAAC;QAEd,gBAAW,GAAG,EAAE,CAAC;QAEjB,uBAAkB,GAAG,EAAE,CAAC;QAExB,aAAQ,GAAW,EAAE,CAAC;QAEtB,yBAAoB,GAC9C,4BAA4B,CAAC;QAG/B,2BAAsB,GAAmC,EAAE,CAAC;QAO3C,UAAK,GAAuB,gBAAgB,EAAE,CAAC;IA6SlE,CAAC;IAvSC,IAAY,kBAAkB;QAC5B,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/C,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,OAAO,CAAC,KAAqB;;QAC3B,IACE,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC;YACrB,KAAK,CAAC,GAAG,CAAC,sBAAsB,CAAC;YACjC,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC;YAC3B,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC;YACvB,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,EACrB,CAAC;YACD,IAAI,CAAC,SAAS,EAAE,CAAC;QACnB,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,EAAE,CAAC;YAC/B,MAAM,aAAa,GACjB,MAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,aAAa,CAAC,0CAAE,UAAU,CAAC;YAC3D,IAAI,aAAa,EAAE,CAAC;gBAClB,IAAI,CAAC,kBAAkB,GAAG,IAAI,kBAAkB,CAC9C,aAAuC,EACvC,IAAI,CAAC,QAAQ,CACd,CAAC;gBAEF,IAAI,IAAI,CAAC,uBAAuB,EAAE,CAAC;oBACjC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;gBACpE,CAAC;gBACD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,aAAa,CAAC,CAAC;gBACxE,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,kBAAkB,CAAC,aAAa,CAAC;YACvE,CAAC;QACH,CAAC;IACH,CAAC;IAED,YAAY;QACV,iCAAiC;QACjC,QAAQ,CAAC,gBAAgB,CACvB,SAAS,EACT,CAAC,CAAC,EAAE,EAAE;YACJ,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBACvB,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;gBACnB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;YAC/B,CAAC;QACH,CAAC,EACD,KAAK,CACN,CAAC;IACJ,CAAC;IAED,SAAS;QACP,mBAAmB;QACnB,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAC3B,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,kBAAkB,EACvB,IAAI,CAAC,oBAAoB,EACzB,IAAI,CAAC,cAAc,CACpB,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,CAAc;QACxB,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC;QAClC,IAAI,CAAC,QAAQ,GAAG,WAAW,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC;QAC3E,gDAAgD;QAChD,IAAI,IAAI,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;YAC9B,OAAO;QACT,CAAC;QACD,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,kBAAkB,CAAC,CAAc;;QAC/B,IAAI,IAAI,CAAC,uBAAuB,EAAE,CAAC;YACjC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;QACpE,CAAC;QAED,MAAM,cAAc,GAAG,MAAA,CAAC,CAAC,MAAM,0CAAE,cAAc,CAAC;QAChD,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAC9C,aAAa,CACC,CAAC;YACjB,MAAM,QAAQ,GAAG,MAAA,IAAI,CAAC,kBAAkB,0CAAE,oBAAoB,EAAE,CAAC;YACjE,IAAI,UAAU,KAAI,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,CAAA,EAAE,CAAC;gBACnC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC;YACtB,CAAC;QACH,CAAC;IACH,CAAC;IAED,eAAe;QACb,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAC9B,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;QAC7B,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC;IAC/B,CAAC;IAED,UAAU;QACR,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;QACnB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,eAAe,CAAC,CAAc;QAC5B,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC;IACpC,CAAC;IAED,UAAU,CAAC,CAAc;QACvB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,gBAAgB,EAAE;YAChC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,CAAC,CAAC,MAAM;SACjB,CAAC,CACH,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,CAAc;QACxB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;YACjC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,CAAC,CAAC,MAAM;SACjB,CAAC,CACH,CAAC;IACJ,CAAC;IAED,iBAAiB,CAAC,CAAc;QAC9B,IAAI,IAAI,CAAC,kBAAkB,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;YACnD,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,kBAAkB,GAAG,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC;QAC7C,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAED,IAAI,gBAAgB;QAClB,OAAO,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC;IACpC,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC;IACnC,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,QAAQ,KAAK,MAAM,CAAC;IAClC,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IAC3C,CAAC;IAED,IAAI,gBAAgB;QAClB,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IACzC,CAAC;IAED,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IAC1C,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IAClE,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAA;;oBAEK,IAAI,CAAC,kBAAkB;kBACzB,IAAI,CAAC,MAAM;qBACR,IAAI,CAAC,aAAa;gBACvB,IAAI,CAAC,QAAQ,KAAK,MAAM;oBACpB,IAAI,CAAC,QAAQ;sBACX,IAAI,CAAC,UAAU;oBACjB,IAAI,CAAC,gBAAgB;uBAClB,IAAI,CAAC,WAAW;sBACjB,IAAI,CAAC,UAAU;gCACL,CAAC,CAAc,EAAE,EAAE,CACzC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;;KAEjC,CAAC;IACJ,CAAC;IAED,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAA;;oBAEK,IAAI,CAAC,kBAAkB;kBACzB,IAAI,CAAC,MAAM;gBACb,IAAI,CAAC,eAAe;sBACd,IAAI,CAAC,UAAU;oBACjB,IAAI,CAAC,iBAAiB;qBACrB,IAAI,CAAC,kBAAkB;gCACZ,CAAC,CAAc,EAAE,EAAE;YACzC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;QAC7B,CAAC;;KAEJ,CAAC;IACJ,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IAC9B,CAAC;IAED;;;;OAIG;IACH,IAAI,aAAa;QACf,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;QAEnC,IAAI,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;QACtC,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,UAAU,GAAG,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;QAC5D,CAAC;QAED,OAAO,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK;YACtC,CAAC,CAAC,CAAC,UAAU,EAAE,UAAU,CAAC;YAC1B,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;IACnB,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,sBAAsB,KAAK,OAAO,CAAC;IACjD,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,kBAAkB;YAC5B,CAAC,CAAC,IAAI,CAAA;;;SAGH;YACH,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAA,+CAA+C,CAAC;IAC7D,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;sBAGO,IAAI,CAAC,kBAAkB;2BAClB,IAAI,CAAC,aAAa;oBACzB,IAAI,CAAC,MAAM;sBACT,IAAI,CAAC,QAAQ;wBACX,IAAI,CAAC,UAAU;sBACjB,IAAI,CAAC,QAAQ;yBACV,IAAI,CAAC,WAAW;oCACL,IAAI,CAAC,sBAAsB;gCAC/B,IAAI,CAAC,kBAAkB;sBACjC,IAAI,CAAC,QAAQ;kCACD,IAAI,CAAC,oBAAoB;wBACnC,IAAI,CAAC,UAAU;wBACf,IAAI,CAAC,UAAU;+BACR,IAAI,CAAC,iBAAiB;wBAC7B,IAAI,CAAC,UAAU;yBACd,IAAI,CAAC,WAAW;yBAChB,IAAI,CAAC,WAAW;2BACd,IAAI,CAAC,kBAAkB;;YAEtC,IAAI,CAAC,cAAc;;;sBAGT,IAAI,CAAC,kBAAkB;oBACzB,IAAI,CAAC,MAAM;gCACC,IAAI,CAAC,kBAAkB;6BAC1B,IAAI,CAAC,eAAe;mBAC9B,IAAI,CAAC,KAAK;sBACP,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI;kCACrB,CAAC,CAAc,EAAE,EAAE,CACzC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;;;QAGhC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB;;oBAE1C,IAAI,CAAC,kBAAkB;kBACzB,IAAI,CAAC,MAAM;oBACT,IAAI,CAAC,QAAQ;oBACb,IAAI,CAAC,kBAAkB;sBACrB,IAAI,CAAC,UAAU;2BACV,IAAI,CAAC,eAAe;sBACzB,IAAI,CAAC,UAAU;uBACd,IAAI,CAAC,WAAW;;;oBAGnB,IAAI,CAAC,kBAAkB;qBACtB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK;iBACzB,IAAI,CAAC,UAAU;;;;iBAIf,IAAI,CAAC,eAAe;iBACpB,IAAI,CAAC,UAAU;;KAE3B,CAAC;IACJ,CAAC;CACF,CAAA;AAxV8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAoB;AAEpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAA2B;AAE1B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAkC;AAEjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAuC;AAErC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uCAAe;AAEd;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDAAwB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAA8C;AAE5C;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAoB;AAEpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAqB;AAEnB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAyB;AAEzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAe;AAEd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAe;AAEd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAkB;AAEjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAuB;AAEtB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDACI;AAG/B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDACiC;AAEhC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAGzB;AAEe;IAAhB,KAAK,EAAE;uCAAwD;AA5CrD,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAyVpB","sourcesContent":["import { LitElement, PropertyValues, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { buildTopNavMenus, defaultTopNavConfig } from './data/menus';\nimport './desktop-subnav';\nimport './dropdown-menu';\nimport './media-slider';\nimport {\n IATopNavConfig,\n IATopNavMenuConfig,\n IATopNavSecondIdentitySlotMode,\n} from './models';\nimport './primary-nav';\nimport './search-menu';\nimport './signed-out-dropdown';\nimport iaTopNavCSS from './styles/ia-topnav';\nimport './user-menu';\nimport KeyboardNavigation from './lib/keyboard-navigation';\n\n@customElement('ia-topnav')\nexport class IATopNav extends LitElement {\n @property({ type: Boolean }) localLinks = false;\n\n @property({ type: String }) waybackPagesArchived = '';\n\n @property({ type: String }) baseHost = 'https://archive.org';\n\n @property({ type: String }) mediaBaseHost = 'https://archive.org';\n\n @property({ type: Boolean }) admin = false;\n\n @property({ type: Boolean }) canManageFlags = false;\n\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n\n @property({ type: Boolean }) hideSearch = false;\n\n @property({ type: String }) itemIdentifier = '';\n\n @property({ type: Boolean }) mediaSliderOpen = false;\n\n @property({ type: String }) openMenu = '';\n\n @property({ type: String }) screenName: string = '';\n\n @property({ type: String }) searchIn = '';\n\n @property({ type: String }) searchQuery = '';\n\n @property({ type: String }) selectedMenuOption = '';\n\n @property({ type: String }) username: string = '';\n\n @property({ type: String }) userProfileImagePath =\n '/services/img/user/profile';\n\n @property({ type: String })\n secondIdentitySlotMode: IATopNavSecondIdentitySlotMode = '';\n\n @property({ type: Object }) currentTab?: {\n mediatype: string;\n moveTo: string;\n };\n\n @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\n private previousKeydownListener: // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ((this: HTMLElement, ev: KeyboardEvent) => any) | undefined;\n\n private keyboardNavigation?: KeyboardNavigation;\n\n private get normalizedBaseHost() {\n return !this.localLinks ? this.baseHost : '';\n }\n\n static get styles() {\n return iaTopNavCSS;\n }\n\n updated(props: PropertyValues) {\n if (\n props.has('username') ||\n props.has('waybackPagesArchived') ||\n props.has('itemIdentifier') ||\n props.has('localLinks') ||\n props.has('baseHost')\n ) {\n this.menuSetup();\n }\n\n if (this.openMenu === 'search') {\n const targetElement =\n this.renderRoot.querySelector('search-menu')?.shadowRoot;\n if (targetElement) {\n this.keyboardNavigation = new KeyboardNavigation(\n targetElement as unknown as HTMLElement,\n this.openMenu,\n );\n\n if (this.previousKeydownListener) {\n this.removeEventListener('keydown', this.previousKeydownListener);\n }\n this.addEventListener('keydown', this.keyboardNavigation.handleKeyDown);\n this.previousKeydownListener = this.keyboardNavigation.handleKeyDown;\n }\n }\n }\n\n firstUpdated() {\n // close open menu on `esc` click\n document.addEventListener(\n 'keydown',\n (e) => {\n if (e.key === 'Escape') {\n this.openMenu = '';\n this.mediaSliderOpen = false;\n }\n },\n false,\n );\n }\n\n menuSetup() {\n // re/build the nav\n this.menus = buildTopNavMenus(\n this.username,\n this.normalizedBaseHost,\n this.waybackPagesArchived,\n this.itemIdentifier,\n );\n }\n\n menuToggled(e: CustomEvent) {\n const currentMenu = this.openMenu;\n this.openMenu = currentMenu === e.detail.menuName ? '' : e.detail.menuName;\n // Keeps media slider open if media menu is open\n if (this.openMenu === 'media') {\n return;\n }\n this.closeMediaSlider();\n }\n\n navSearchBlurEvent(e: CustomEvent) {\n if (this.previousKeydownListener) {\n this.removeEventListener('keydown', this.previousKeydownListener);\n }\n\n const isUploadButton = e.detail?.isUploadButton;\n if (!isUploadButton) {\n const searchMenu = this.renderRoot.querySelector(\n 'search-menu',\n ) as HTMLElement;\n const elements = this.keyboardNavigation?.getFocusableElements();\n if (searchMenu && elements?.length) {\n elements[0].focus();\n }\n }\n }\n\n openMediaSlider() {\n this.mediaSliderOpen = true;\n }\n\n closeMediaSlider() {\n this.mediaSliderOpen = false;\n this.selectedMenuOption = '';\n }\n\n closeMenus() {\n this.openMenu = '';\n this.closeMediaSlider();\n }\n\n searchInChanged(e: CustomEvent) {\n this.searchIn = e.detail.searchIn;\n }\n\n trackClick(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('analyticsClick', {\n bubbles: true,\n composed: true,\n detail: e.detail,\n }),\n );\n }\n\n trackSubmit(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('analyticsSubmit', {\n bubbles: true,\n composed: true,\n detail: e.detail,\n }),\n );\n }\n\n mediaTypeSelected(e: CustomEvent) {\n if (this.selectedMenuOption === e.detail.mediatype) {\n this.closeMediaSlider();\n return;\n }\n this.selectedMenuOption = e.detail.mediatype;\n this.openMediaSlider();\n }\n\n get searchMenuOpened() {\n return this.openMenu === 'search';\n }\n\n get signedOutOpened() {\n return this.openMenu === 'login';\n }\n\n get userMenuOpened() {\n return this.openMenu === 'user';\n }\n\n get searchMenuTabIndex() {\n return this.searchMenuOpened ? '' : '-1';\n }\n\n get userMenuTabIndex() {\n return this.userMenuOpened ? '' : '-1';\n }\n\n get signedOutTabIndex() {\n return this.signedOutOpened ? '' : '-1';\n }\n\n get closeLayerClass() {\n return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';\n }\n\n get userMenu() {\n return html`\n <user-menu\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .menuItems=${this.userMenuItems}\n ?open=${this.openMenu === 'user'}\n .username=${this.username}\n ?hideSearch=${this.hideSearch}\n tabindex=\"${this.userMenuTabIndex}\"\n @menuToggled=${this.menuToggled}\n @trackClick=${this.trackClick}\n @focusToOtherMenuItem=${(e: CustomEvent) =>\n (this.currentTab = e.detail)}\n ></user-menu>\n `;\n }\n\n get signedOutDropdown() {\n return html`\n <signed-out-dropdown\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .open=${this.signedOutOpened}\n ?hideSearch=${this.hideSearch}\n tabindex=\"${this.signedOutTabIndex}\"\n .menuItems=${this.signedOutMenuItems}\n @focusToOtherMenuItem=${(e: CustomEvent) => {\n this.currentTab = e.detail;\n }}\n ></signed-out-dropdown>\n `;\n }\n\n get signedOutMenuItems() {\n return this.menus.signedOut;\n }\n\n /**\n * Most users just get the basic menu items.\n * For users with `/items` priv, additional admin menu items are included too.\n * Having the `/flags` priv adds a further admin item for managing flags.\n */\n get userMenuItems() {\n const basicItems = this.menus.user;\n\n let adminItems = this.menus.userAdmin;\n if (this.canManageFlags) {\n adminItems = adminItems.concat(this.menus.userAdminFlags);\n }\n\n return this.itemIdentifier && this.admin\n ? [basicItems, adminItems]\n : [basicItems];\n }\n\n get allowSecondaryIcon() {\n return this.secondIdentitySlotMode === 'allow';\n }\n\n get secondLogoSlot() {\n return this.allowSecondaryIcon\n ? html`\n <slot name=\"opt-sec-logo\" slot=\"opt-sec-logo\"></slot>\n <slot name=\"opt-sec-logo-mobile\" slot=\"opt-sec-logo-mobile\"></slot>\n `\n : nothing;\n }\n\n get separatorTemplate() {\n return html`<li class=\"divider\" role=\"presentation\"></li>`;\n }\n\n render() {\n return html`\n <div class=\"topnav\">\n <primary-nav\n .baseHost=${this.normalizedBaseHost}\n .mediaBaseHost=${this.mediaBaseHost}\n .config=${this.config}\n .openMenu=${this.openMenu}\n .screenName=${this.screenName}\n .searchIn=${this.searchIn}\n .searchQuery=${this.searchQuery}\n .secondIdentitySlotMode=${this.secondIdentitySlotMode}\n .selectedMenuOption=${this.selectedMenuOption}\n .username=${this.username}\n .userProfileImagePath=${this.userProfileImagePath}\n .currentTab=${this.currentTab}\n ?hideSearch=${this.hideSearch}\n @mediaTypeSelected=${this.mediaTypeSelected}\n @trackClick=${this.trackClick}\n @trackSubmit=${this.trackSubmit}\n @menuToggled=${this.menuToggled}\n @navSearchBlur=${this.navSearchBlurEvent}\n >\n ${this.secondLogoSlot}\n </primary-nav>\n <media-slider\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .selectedMenuOption=${this.selectedMenuOption}\n .mediaSliderOpen=${this.mediaSliderOpen}\n .menus=${this.menus}\n tabindex=\"${this.mediaSliderOpen ? '1' : '-1'}\"\n @focusToOtherMenuItem=${(e: CustomEvent) =>\n (this.currentTab = e.detail)}\n ></media-slider>\n </div>\n ${this.username ? this.userMenu : this.signedOutDropdown}\n <search-menu\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .openMenu=${this.openMenu}\n tabindex=\"${this.searchMenuTabIndex}\"\n ?hideSearch=${this.hideSearch}\n @searchInChanged=${this.searchInChanged}\n @trackClick=${this.trackClick}\n @trackSubmit=${this.trackSubmit}\n ></search-menu>\n <desktop-subnav\n .baseHost=${this.normalizedBaseHost}\n .menuItems=${this.menus.more.links}\n @focus=${this.closeMenus}\n ></desktop-subnav>\n <div\n id=\"close-layer\"\n class=\"${this.closeLayerClass}\"\n @click=${this.closeMenus}\n ></div>\n `;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ia-topnav.js","sourceRoot":"","sources":["../../src/ia-topnav.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { buildTopNavMenus, defaultTopNavConfig } from './data/menus';\nimport './desktop-subnav';\nimport './dropdown-menu';\nimport './media-slider';\nimport {\n IATopNavConfig,\n IATopNavMenuConfig,\n IATopNavSecondIdentitySlotMode,\n} from './models';\nimport './primary-nav';\nimport './signed-out-dropdown';\nimport iaTopNavCSS from './styles/ia-topnav';\nimport './user-menu';\n\n@customElement('ia-topnav')\nexport class IATopNav extends LitElement {\n @property({ type: Boolean }) localLinks = false;\n\n @property({ type: String }) waybackPagesArchived = '';\n\n @property({ type: String }) baseHost = 'https://archive.org';\n\n @property({ type: String }) mediaBaseHost = 'https://archive.org';\n\n @property({ type: Boolean }) admin = false;\n\n @property({ type: Boolean }) canManageFlags = false;\n\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n\n @property({ type: Boolean }) hideSearch = false;\n\n @property({ type: String }) itemIdentifier = '';\n\n @property({ type: Boolean }) mediaSliderOpen = false;\n\n @property({ type: String }) openMenu = '';\n\n @property({ type: String }) screenName: string = '';\n\n @property({ type: String }) selectedMenuOption = '';\n\n @property({ type: String }) username: string = '';\n\n @property({ type: String }) userProfileImagePath =\n '/services/img/user/profile';\n\n @property({ type: String })\n secondIdentitySlotMode: IATopNavSecondIdentitySlotMode = '';\n\n @property({ type: Object }) currentTab?: {\n mediatype: string;\n moveTo: string;\n };\n\n @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\n\n private get normalizedBaseHost() {\n return !this.localLinks ? this.baseHost : '';\n }\n\n static get styles() {\n return iaTopNavCSS;\n }\n\n updated(props: PropertyValues) {\n if (\n props.has('username') ||\n props.has('waybackPagesArchived') ||\n props.has('itemIdentifier') ||\n props.has('localLinks') ||\n props.has('baseHost')\n ) {\n this.menuSetup();\n }\n }\n\n firstUpdated() {\n // close open menu on `esc` click\n document.addEventListener(\n 'keydown',\n (e) => {\n if (e.key === 'Escape') {\n this.openMenu = '';\n this.mediaSliderOpen = false;\n }\n },\n false,\n );\n }\n\n menuSetup() {\n // re/build the nav\n this.menus = buildTopNavMenus(\n this.username,\n this.normalizedBaseHost,\n this.waybackPagesArchived,\n this.itemIdentifier,\n );\n }\n\n menuToggled(e: CustomEvent) {\n const currentMenu = this.openMenu;\n this.openMenu = currentMenu === e.detail.menuName ? '' : e.detail.menuName;\n // Keeps media slider open if media menu is open\n if (this.openMenu === 'media') {\n return;\n }\n this.closeMediaSlider();\n }\n\n openMediaSlider() {\n this.mediaSliderOpen = true;\n }\n\n closeMediaSlider() {\n this.mediaSliderOpen = false;\n this.selectedMenuOption = '';\n }\n\n closeMenus() {\n this.openMenu = '';\n this.closeMediaSlider();\n }\n\n trackClick(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('analyticsClick', {\n bubbles: true,\n composed: true,\n detail: e.detail,\n }),\n );\n }\n\n trackSubmit(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('analyticsSubmit', {\n bubbles: true,\n composed: true,\n detail: e.detail,\n }),\n );\n }\n\n mediaTypeSelected(e: CustomEvent) {\n if (this.selectedMenuOption === e.detail.mediatype) {\n this.closeMediaSlider();\n return;\n }\n this.selectedMenuOption = e.detail.mediatype;\n this.openMediaSlider();\n }\n\n get signedOutOpened() {\n return this.openMenu === 'login';\n }\n\n get userMenuOpened() {\n return this.openMenu === 'user';\n }\n\n get userMenuTabIndex() {\n return this.userMenuOpened ? '' : '-1';\n }\n\n get signedOutTabIndex() {\n return this.signedOutOpened ? '' : '-1';\n }\n\n get closeLayerClass() {\n return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';\n }\n\n get userMenu() {\n return html`\n <user-menu\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .menuItems=${this.userMenuItems}\n ?open=${this.openMenu === 'user'}\n .username=${this.username}\n ?hideSearch=${this.hideSearch}\n tabindex=\"${this.userMenuTabIndex}\"\n @menuToggled=${this.menuToggled}\n @trackClick=${this.trackClick}\n @focusToOtherMenuItem=${(e: CustomEvent) =>\n (this.currentTab = e.detail)}\n ></user-menu>\n `;\n }\n\n get signedOutDropdown() {\n return html`\n <signed-out-dropdown\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .open=${this.signedOutOpened}\n ?hideSearch=${this.hideSearch}\n tabindex=\"${this.signedOutTabIndex}\"\n .menuItems=${this.signedOutMenuItems}\n @focusToOtherMenuItem=${(e: CustomEvent) => {\n this.currentTab = e.detail;\n }}\n ></signed-out-dropdown>\n `;\n }\n\n get signedOutMenuItems() {\n return this.menus.signedOut;\n }\n\n /**\n * Most users just get the basic menu items.\n * For users with `/items` priv, additional admin menu items are included too.\n * Having the `/flags` priv adds a further admin item for managing flags.\n */\n get userMenuItems() {\n const basicItems = this.menus.user;\n\n let adminItems = this.menus.userAdmin;\n if (this.canManageFlags) {\n adminItems = adminItems.concat(this.menus.userAdminFlags);\n }\n\n return this.itemIdentifier && this.admin\n ? [basicItems, adminItems]\n : [basicItems];\n }\n\n get allowSecondaryIcon() {\n return this.secondIdentitySlotMode === 'allow';\n }\n\n get searchSlot() {\n return html`<slot name=\"custom-search\" slot=\"custom-search\"></slot>`;\n }\n\n get secondLogoSlot() {\n return this.allowSecondaryIcon\n ? html`\n <slot name=\"opt-sec-logo\" slot=\"opt-sec-logo\"></slot>\n <slot name=\"opt-sec-logo-mobile\" slot=\"opt-sec-logo-mobile\"></slot>\n `\n : nothing;\n }\n\n get separatorTemplate() {\n return html`<li class=\"divider\" role=\"presentation\"></li>`;\n }\n\n render() {\n return html`\n <div class=\"topnav\">\n <primary-nav\n .baseHost=${this.normalizedBaseHost}\n .mediaBaseHost=${this.mediaBaseHost}\n .config=${this.config}\n .openMenu=${this.openMenu}\n .screenName=${this.screenName}\n .secondIdentitySlotMode=${this.secondIdentitySlotMode}\n .selectedMenuOption=${this.selectedMenuOption}\n .username=${this.username}\n .userProfileImagePath=${this.userProfileImagePath}\n .currentTab=${this.currentTab}\n ?hideSearch=${this.hideSearch}\n @mediaTypeSelected=${this.mediaTypeSelected}\n @trackClick=${this.trackClick}\n @trackSubmit=${this.trackSubmit}\n @menuToggled=${this.menuToggled}\n >\n ${this.secondLogoSlot} ${this.searchSlot}\n </primary-nav>\n <media-slider\n .baseHost=${this.normalizedBaseHost}\n .config=${this.config}\n .selectedMenuOption=${this.selectedMenuOption}\n .mediaSliderOpen=${this.mediaSliderOpen}\n .menus=${this.menus}\n tabindex=\"${this.mediaSliderOpen ? '1' : '-1'}\"\n @focusToOtherMenuItem=${(e: CustomEvent) =>\n (this.currentTab = e.detail)}\n ></media-slider>\n </div>\n ${this.username ? this.userMenu : this.signedOutDropdown}\n <desktop-subnav\n .baseHost=${this.normalizedBaseHost}\n .menuItems=${this.menus.more.links}\n @focus=${this.closeMenus}\n ></desktop-subnav>\n <div\n id=\"close-layer\"\n class=\"${this.closeLayerClass}\"\n @click=${this.closeMenus}\n ></div>\n `;\n }\n}\n"]}
|
|
@@ -2,7 +2,6 @@ import { nothing, PropertyValues } from 'lit';
|
|
|
2
2
|
import TrackedElement from './tracked-element';
|
|
3
3
|
import './assets/img/hamburger';
|
|
4
4
|
import './login-button';
|
|
5
|
-
import './nav-search';
|
|
6
5
|
import './media-menu';
|
|
7
6
|
import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from './models';
|
|
8
7
|
export declare class PrimaryNav extends TrackedElement {
|
|
@@ -12,8 +11,6 @@ export declare class PrimaryNav extends TrackedElement {
|
|
|
12
11
|
config: IATopNavConfig;
|
|
13
12
|
openMenu: string;
|
|
14
13
|
screenName: string;
|
|
15
|
-
searchIn: string;
|
|
16
|
-
searchQuery: string;
|
|
17
14
|
secondIdentitySlotMode: IATopNavSecondIdentitySlotMode;
|
|
18
15
|
selectedMenuOption: string;
|
|
19
16
|
signedOutMenuOpen: boolean;
|
|
@@ -35,8 +32,12 @@ export declare class PrimaryNav extends TrackedElement {
|
|
|
35
32
|
get loginIcon(): import("lit").TemplateResult<1>;
|
|
36
33
|
get searchMenuOpen(): boolean;
|
|
37
34
|
get allowSecondaryIcon(): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* The search slot container, rendered between media-menu and
|
|
37
|
+
* right-side-section so it sits left of the Upload button on desktop.
|
|
38
|
+
*/
|
|
39
|
+
get searchSlotContainer(): import("lit").TemplateResult<1> | typeof nothing;
|
|
38
40
|
get searchMenu(): import("lit").TemplateResult<1> | typeof nothing;
|
|
39
|
-
private emitNavSearchBlurEvent;
|
|
40
41
|
get mobileDonateHeart(): import("lit").TemplateResult<1>;
|
|
41
42
|
get uploadButtonTemplate(): import("lit").TemplateResult<1>;
|
|
42
43
|
get userStateTemplate(): import("lit").TemplateResult<1>;
|