@internetarchive/ia-topnav 1.3.30 → 1.4.1-alpha-webdev8259.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.
Files changed (53) hide show
  1. package/.prettierignore +1 -1
  2. package/LICENSE +661 -661
  3. package/README.md +147 -147
  4. package/demo/index.html +28 -28
  5. package/dist/index.d.ts +1 -0
  6. package/dist/index.js.map +1 -1
  7. package/dist/src/data/menus.js.map +1 -1
  8. package/dist/src/dropdown-menu.js +26 -26
  9. package/dist/src/dropdown-menu.js.map +1 -1
  10. package/dist/src/ia-topnav.d.ts +4 -1
  11. package/dist/src/ia-topnav.js +96 -81
  12. package/dist/src/ia-topnav.js.map +1 -1
  13. package/dist/src/lib/keyboard-navigation.js.map +1 -1
  14. package/dist/src/login-button.js +17 -17
  15. package/dist/src/login-button.js.map +1 -1
  16. package/dist/src/media-menu.js +21 -21
  17. package/dist/src/media-menu.js.map +1 -1
  18. package/dist/src/models.d.ts +1 -0
  19. package/dist/src/models.js.map +1 -1
  20. package/dist/src/primary-nav.d.ts +3 -1
  21. package/dist/src/primary-nav.js +118 -95
  22. package/dist/src/primary-nav.js.map +1 -1
  23. package/dist/src/styles/login-button.js +87 -87
  24. package/dist/src/styles/login-button.js.map +1 -1
  25. package/dist/src/styles/primary-nav.js +343 -308
  26. package/dist/src/styles/primary-nav.js.map +1 -1
  27. package/dist/src/user-menu.js +13 -13
  28. package/dist/src/user-menu.js.map +1 -1
  29. package/dist/test/ia-topnav.test.js +39 -9
  30. package/dist/test/ia-topnav.test.js.map +1 -1
  31. package/dist/test/primary-nav.test.js +55 -7
  32. package/dist/test/primary-nav.test.js.map +1 -1
  33. package/eslint.config.mjs +53 -53
  34. package/index.ts +4 -3
  35. package/package.json +72 -72
  36. package/prettier.config.js +9 -9
  37. package/src/data/menus.ts +652 -652
  38. package/src/dropdown-menu.ts +132 -132
  39. package/src/ia-topnav.ts +383 -366
  40. package/src/lib/keyboard-navigation.ts +166 -166
  41. package/src/login-button.ts +78 -78
  42. package/src/media-menu.ts +143 -143
  43. package/src/models.ts +65 -63
  44. package/src/primary-nav.ts +324 -296
  45. package/src/styles/login-button.ts +90 -90
  46. package/src/styles/primary-nav.ts +346 -311
  47. package/src/user-menu.ts +32 -32
  48. package/ssl/server.key +28 -28
  49. package/test/ia-topnav.test.ts +381 -343
  50. package/test/primary-nav.test.ts +163 -94
  51. package/tsconfig.json +31 -31
  52. package/web-dev-server.config.mjs +32 -32
  53. package/web-test-runner.config.mjs +41 -41
@@ -2,7 +2,7 @@ import { LitElement, PropertyValues, nothing } from 'lit';
2
2
  import './desktop-subnav';
3
3
  import './dropdown-menu';
4
4
  import './media-slider';
5
- import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from './models';
5
+ import { IATopNavConfig, IATopNavSearchSlotMode, IATopNavSecondIdentitySlotMode } from './models';
6
6
  import './primary-nav';
7
7
  import './search-menu';
8
8
  import './signed-out-dropdown';
@@ -26,6 +26,7 @@ export declare class IATopNav extends LitElement {
26
26
  username: string;
27
27
  userProfileImagePath: string;
28
28
  secondIdentitySlotMode: IATopNavSecondIdentitySlotMode;
29
+ searchSlotMode: IATopNavSearchSlotMode;
29
30
  currentTab?: {
30
31
  mediatype: string;
31
32
  moveTo: string;
@@ -64,6 +65,8 @@ export declare class IATopNav extends LitElement {
64
65
  */
65
66
  get userMenuItems(): import("./models").IATopNavLink[][];
66
67
  get allowSecondaryIcon(): boolean;
68
+ get useCustomSearch(): boolean;
69
+ get customSearchSlot(): import("lit").TemplateResult<1> | typeof nothing;
67
70
  get secondLogoSlot(): import("lit").TemplateResult<1> | typeof nothing;
68
71
  get separatorTemplate(): import("lit").TemplateResult<1>;
69
72
  render(): import("lit").TemplateResult<1>;
@@ -32,6 +32,7 @@ let IATopNav = class IATopNav extends LitElement {
32
32
  this.username = '';
33
33
  this.userProfileImagePath = '/services/img/user/profile';
34
34
  this.secondIdentitySlotMode = '';
35
+ this.searchSlotMode = '';
35
36
  this.menus = buildTopNavMenus();
36
37
  }
37
38
  get normalizedBaseHost() {
@@ -155,34 +156,34 @@ let IATopNav = class IATopNav extends LitElement {
155
156
  return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';
156
157
  }
157
158
  get userMenu() {
158
- return html `
159
- <user-menu
160
- .baseHost=${this.normalizedBaseHost}
161
- .config=${this.config}
162
- .menuItems=${this.userMenuItems}
163
- ?open=${this.openMenu === 'user'}
164
- .username=${this.username}
165
- ?hideSearch=${this.hideSearch}
166
- tabindex="${this.userMenuTabIndex}"
167
- @menuToggled=${this.menuToggled}
168
- @trackClick=${this.trackClick}
169
- @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
170
- ></user-menu>
159
+ return html `
160
+ <user-menu
161
+ .baseHost=${this.normalizedBaseHost}
162
+ .config=${this.config}
163
+ .menuItems=${this.userMenuItems}
164
+ ?open=${this.openMenu === 'user'}
165
+ .username=${this.username}
166
+ ?hideSearch=${this.hideSearch}
167
+ tabindex="${this.userMenuTabIndex}"
168
+ @menuToggled=${this.menuToggled}
169
+ @trackClick=${this.trackClick}
170
+ @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
171
+ ></user-menu>
171
172
  `;
172
173
  }
173
174
  get signedOutDropdown() {
174
- return html `
175
- <signed-out-dropdown
176
- .baseHost=${this.normalizedBaseHost}
177
- .config=${this.config}
178
- .open=${this.signedOutOpened}
179
- ?hideSearch=${this.hideSearch}
180
- tabindex="${this.signedOutTabIndex}"
181
- .menuItems=${this.signedOutMenuItems}
175
+ return html `
176
+ <signed-out-dropdown
177
+ .baseHost=${this.normalizedBaseHost}
178
+ .config=${this.config}
179
+ .open=${this.signedOutOpened}
180
+ ?hideSearch=${this.hideSearch}
181
+ tabindex="${this.signedOutTabIndex}"
182
+ .menuItems=${this.signedOutMenuItems}
182
183
  @focusToOtherMenuItem=${(e) => {
183
184
  this.currentTab = e.detail;
184
- }}
185
- ></signed-out-dropdown>
185
+ }}
186
+ ></signed-out-dropdown>
186
187
  `;
187
188
  }
188
189
  get signedOutMenuItems() {
@@ -206,11 +207,19 @@ let IATopNav = class IATopNav extends LitElement {
206
207
  get allowSecondaryIcon() {
207
208
  return this.secondIdentitySlotMode === 'allow';
208
209
  }
210
+ get useCustomSearch() {
211
+ return this.searchSlotMode === 'custom';
212
+ }
213
+ get customSearchSlot() {
214
+ return this.useCustomSearch
215
+ ? html `<slot name="custom-search" slot="custom-search"></slot>`
216
+ : nothing;
217
+ }
209
218
  get secondLogoSlot() {
210
219
  return this.allowSecondaryIcon
211
- ? html `
212
- <slot name="opt-sec-logo" slot="opt-sec-logo"></slot>
213
- <slot name="opt-sec-logo-mobile" slot="opt-sec-logo-mobile"></slot>
220
+ ? html `
221
+ <slot name="opt-sec-logo" slot="opt-sec-logo"></slot>
222
+ <slot name="opt-sec-logo-mobile" slot="opt-sec-logo-mobile"></slot>
214
223
  `
215
224
  : nothing;
216
225
  }
@@ -218,61 +227,64 @@ let IATopNav = class IATopNav extends LitElement {
218
227
  return html `<li class="divider" role="presentation"></li>`;
219
228
  }
220
229
  render() {
221
- return html `
222
- <div class="topnav">
223
- <primary-nav
224
- .baseHost=${this.normalizedBaseHost}
225
- .mediaBaseHost=${this.mediaBaseHost}
226
- .config=${this.config}
227
- .openMenu=${this.openMenu}
228
- .screenName=${this.screenName}
229
- .searchIn=${this.searchIn}
230
- .searchQuery=${this.searchQuery}
231
- .secondIdentitySlotMode=${this.secondIdentitySlotMode}
232
- .selectedMenuOption=${this.selectedMenuOption}
233
- .username=${this.username}
234
- .userProfileImagePath=${this.userProfileImagePath}
235
- .currentTab=${this.currentTab}
236
- ?hideSearch=${this.hideSearch}
237
- @mediaTypeSelected=${this.mediaTypeSelected}
238
- @trackClick=${this.trackClick}
239
- @trackSubmit=${this.trackSubmit}
240
- @menuToggled=${this.menuToggled}
241
- @navSearchBlur=${this.navSearchBlurEvent}
242
- >
243
- ${this.secondLogoSlot}
244
- </primary-nav>
245
- <media-slider
246
- .baseHost=${this.normalizedBaseHost}
247
- .config=${this.config}
248
- .selectedMenuOption=${this.selectedMenuOption}
249
- .mediaSliderOpen=${this.mediaSliderOpen}
250
- .menus=${this.menus}
251
- tabindex="${this.mediaSliderOpen ? '1' : '-1'}"
252
- @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
253
- ></media-slider>
254
- </div>
255
- ${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
- <desktop-subnav
267
- .baseHost=${this.normalizedBaseHost}
268
- .menuItems=${this.menus.more.links}
269
- @focus=${this.closeMenus}
270
- ></desktop-subnav>
271
- <div
272
- id="close-layer"
273
- class="${this.closeLayerClass}"
274
- @click=${this.closeMenus}
275
- ></div>
230
+ return html `
231
+ <div class="topnav">
232
+ <primary-nav
233
+ .baseHost=${this.normalizedBaseHost}
234
+ .mediaBaseHost=${this.mediaBaseHost}
235
+ .config=${this.config}
236
+ .openMenu=${this.openMenu}
237
+ .screenName=${this.screenName}
238
+ .searchIn=${this.searchIn}
239
+ .searchQuery=${this.searchQuery}
240
+ .searchSlotMode=${this.searchSlotMode}
241
+ .secondIdentitySlotMode=${this.secondIdentitySlotMode}
242
+ .selectedMenuOption=${this.selectedMenuOption}
243
+ .username=${this.username}
244
+ .userProfileImagePath=${this.userProfileImagePath}
245
+ .currentTab=${this.currentTab}
246
+ ?hideSearch=${this.hideSearch}
247
+ @mediaTypeSelected=${this.mediaTypeSelected}
248
+ @trackClick=${this.trackClick}
249
+ @trackSubmit=${this.trackSubmit}
250
+ @menuToggled=${this.menuToggled}
251
+ @navSearchBlur=${this.navSearchBlurEvent}
252
+ >
253
+ ${this.secondLogoSlot} ${this.customSearchSlot}
254
+ </primary-nav>
255
+ <media-slider
256
+ .baseHost=${this.normalizedBaseHost}
257
+ .config=${this.config}
258
+ .selectedMenuOption=${this.selectedMenuOption}
259
+ .mediaSliderOpen=${this.mediaSliderOpen}
260
+ .menus=${this.menus}
261
+ tabindex="${this.mediaSliderOpen ? '1' : '-1'}"
262
+ @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
263
+ ></media-slider>
264
+ </div>
265
+ ${this.username ? this.userMenu : this.signedOutDropdown}
266
+ ${this.useCustomSearch
267
+ ? nothing
268
+ : html `<search-menu
269
+ .baseHost=${this.normalizedBaseHost}
270
+ .config=${this.config}
271
+ .openMenu=${this.openMenu}
272
+ tabindex="${this.searchMenuTabIndex}"
273
+ ?hideSearch=${this.hideSearch}
274
+ @searchInChanged=${this.searchInChanged}
275
+ @trackClick=${this.trackClick}
276
+ @trackSubmit=${this.trackSubmit}
277
+ ></search-menu>`}
278
+ <desktop-subnav
279
+ .baseHost=${this.normalizedBaseHost}
280
+ .menuItems=${this.menus.more.links}
281
+ @focus=${this.closeMenus}
282
+ ></desktop-subnav>
283
+ <div
284
+ id="close-layer"
285
+ class="${this.closeLayerClass}"
286
+ @click=${this.closeMenus}
287
+ ></div>
276
288
  `;
277
289
  }
278
290
  };
@@ -330,6 +342,9 @@ __decorate([
330
342
  __decorate([
331
343
  property({ type: String })
332
344
  ], IATopNav.prototype, "secondIdentitySlotMode", void 0);
345
+ __decorate([
346
+ property({ type: String })
347
+ ], IATopNav.prototype, "searchSlotMode", void 0);
333
348
  __decorate([
334
349
  property({ type: Object })
335
350
  ], IATopNav.prototype, "currentTab", void 0);
@@ -1 +1 @@
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 './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';\r\nimport { customElement, property, state } from 'lit/decorators.js';\r\n\r\nimport { buildTopNavMenus, defaultTopNavConfig } from './data/menus';\r\nimport './desktop-subnav';\r\nimport './dropdown-menu';\r\nimport './media-slider';\r\nimport {\r\n IATopNavConfig,\r\n IATopNavMenuConfig,\r\n IATopNavSearchSlotMode,\r\n IATopNavSecondIdentitySlotMode,\r\n} from './models';\r\nimport './primary-nav';\r\nimport './search-menu';\r\nimport './signed-out-dropdown';\r\nimport iaTopNavCSS from './styles/ia-topnav';\r\nimport './user-menu';\r\nimport KeyboardNavigation from './lib/keyboard-navigation';\r\n\r\n@customElement('ia-topnav')\r\nexport class IATopNav extends LitElement {\r\n @property({ type: Boolean }) localLinks = false;\r\n\r\n @property({ type: String }) waybackPagesArchived = '';\r\n\r\n @property({ type: String }) baseHost = 'https://archive.org';\r\n\r\n @property({ type: String }) mediaBaseHost = 'https://archive.org';\r\n\r\n @property({ type: Boolean }) admin = false;\r\n\r\n @property({ type: Boolean }) canManageFlags = false;\r\n\r\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n\r\n @property({ type: Boolean }) hideSearch = false;\r\n\r\n @property({ type: String }) itemIdentifier = '';\r\n\r\n @property({ type: Boolean }) mediaSliderOpen = false;\r\n\r\n @property({ type: String }) openMenu = '';\r\n\r\n @property({ type: String }) screenName: string = '';\r\n\r\n @property({ type: String }) searchIn = '';\r\n\r\n @property({ type: String }) searchQuery = '';\r\n\r\n @property({ type: String }) selectedMenuOption = '';\r\n\r\n @property({ type: String }) username: string = '';\r\n\r\n @property({ type: String }) userProfileImagePath =\r\n '/services/img/user/profile';\r\n\r\n @property({ type: String })\r\n secondIdentitySlotMode: IATopNavSecondIdentitySlotMode = '';\r\n\r\n @property({ type: String })\r\n searchSlotMode: IATopNavSearchSlotMode = '';\r\n\r\n @property({ type: Object }) currentTab?: {\r\n mediatype: string;\r\n moveTo: string;\r\n };\r\n\r\n @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\r\n private previousKeydownListener: // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n ((this: HTMLElement, ev: KeyboardEvent) => any) | undefined;\r\n\r\n private keyboardNavigation?: KeyboardNavigation;\r\n\r\n private get normalizedBaseHost() {\r\n return !this.localLinks ? this.baseHost : '';\r\n }\r\n\r\n static get styles() {\r\n return iaTopNavCSS;\r\n }\r\n\r\n updated(props: PropertyValues) {\r\n if (\r\n props.has('username') ||\r\n props.has('waybackPagesArchived') ||\r\n props.has('itemIdentifier') ||\r\n props.has('localLinks') ||\r\n props.has('baseHost')\r\n ) {\r\n this.menuSetup();\r\n }\r\n\r\n if (this.openMenu === 'search') {\r\n const targetElement =\r\n this.renderRoot.querySelector('search-menu')?.shadowRoot;\r\n if (targetElement) {\r\n this.keyboardNavigation = new KeyboardNavigation(\r\n targetElement as unknown as HTMLElement,\r\n this.openMenu,\r\n );\r\n\r\n if (this.previousKeydownListener) {\r\n this.removeEventListener('keydown', this.previousKeydownListener);\r\n }\r\n this.addEventListener('keydown', this.keyboardNavigation.handleKeyDown);\r\n this.previousKeydownListener = this.keyboardNavigation.handleKeyDown;\r\n }\r\n }\r\n }\r\n\r\n firstUpdated() {\r\n // close open menu on `esc` click\r\n document.addEventListener(\r\n 'keydown',\r\n (e) => {\r\n if (e.key === 'Escape') {\r\n this.openMenu = '';\r\n this.mediaSliderOpen = false;\r\n }\r\n },\r\n false,\r\n );\r\n }\r\n\r\n menuSetup() {\r\n // re/build the nav\r\n this.menus = buildTopNavMenus(\r\n this.username,\r\n this.normalizedBaseHost,\r\n this.waybackPagesArchived,\r\n this.itemIdentifier,\r\n );\r\n }\r\n\r\n menuToggled(e: CustomEvent) {\r\n const currentMenu = this.openMenu;\r\n this.openMenu = currentMenu === e.detail.menuName ? '' : e.detail.menuName;\r\n // Keeps media slider open if media menu is open\r\n if (this.openMenu === 'media') {\r\n return;\r\n }\r\n this.closeMediaSlider();\r\n }\r\n\r\n navSearchBlurEvent(e: CustomEvent) {\r\n if (this.previousKeydownListener) {\r\n this.removeEventListener('keydown', this.previousKeydownListener);\r\n }\r\n\r\n const isUploadButton = e.detail?.isUploadButton;\r\n if (!isUploadButton) {\r\n const searchMenu = this.renderRoot.querySelector(\r\n 'search-menu',\r\n ) as HTMLElement;\r\n const elements = this.keyboardNavigation?.getFocusableElements();\r\n if (searchMenu && elements?.length) {\r\n elements[0].focus();\r\n }\r\n }\r\n }\r\n\r\n openMediaSlider() {\r\n this.mediaSliderOpen = true;\r\n }\r\n\r\n closeMediaSlider() {\r\n this.mediaSliderOpen = false;\r\n this.selectedMenuOption = '';\r\n }\r\n\r\n closeMenus() {\r\n this.openMenu = '';\r\n this.closeMediaSlider();\r\n }\r\n\r\n searchInChanged(e: CustomEvent) {\r\n this.searchIn = e.detail.searchIn;\r\n }\r\n\r\n trackClick(e: CustomEvent) {\r\n this.dispatchEvent(\r\n new CustomEvent('analyticsClick', {\r\n bubbles: true,\r\n composed: true,\r\n detail: e.detail,\r\n }),\r\n );\r\n }\r\n\r\n trackSubmit(e: CustomEvent) {\r\n this.dispatchEvent(\r\n new CustomEvent('analyticsSubmit', {\r\n bubbles: true,\r\n composed: true,\r\n detail: e.detail,\r\n }),\r\n );\r\n }\r\n\r\n mediaTypeSelected(e: CustomEvent) {\r\n if (this.selectedMenuOption === e.detail.mediatype) {\r\n this.closeMediaSlider();\r\n return;\r\n }\r\n this.selectedMenuOption = e.detail.mediatype;\r\n this.openMediaSlider();\r\n }\r\n\r\n get searchMenuOpened() {\r\n return this.openMenu === 'search';\r\n }\r\n\r\n get signedOutOpened() {\r\n return this.openMenu === 'login';\r\n }\r\n\r\n get userMenuOpened() {\r\n return this.openMenu === 'user';\r\n }\r\n\r\n get searchMenuTabIndex() {\r\n return this.searchMenuOpened ? '' : '-1';\r\n }\r\n\r\n get userMenuTabIndex() {\r\n return this.userMenuOpened ? '' : '-1';\r\n }\r\n\r\n get signedOutTabIndex() {\r\n return this.signedOutOpened ? '' : '-1';\r\n }\r\n\r\n get closeLayerClass() {\r\n return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';\r\n }\r\n\r\n get userMenu() {\r\n return html`\r\n <user-menu\r\n .baseHost=${this.normalizedBaseHost}\r\n .config=${this.config}\r\n .menuItems=${this.userMenuItems}\r\n ?open=${this.openMenu === 'user'}\r\n .username=${this.username}\r\n ?hideSearch=${this.hideSearch}\r\n tabindex=\"${this.userMenuTabIndex}\"\r\n @menuToggled=${this.menuToggled}\r\n @trackClick=${this.trackClick}\r\n @focusToOtherMenuItem=${(e: CustomEvent) =>\r\n (this.currentTab = e.detail)}\r\n ></user-menu>\r\n `;\r\n }\r\n\r\n get signedOutDropdown() {\r\n return html`\r\n <signed-out-dropdown\r\n .baseHost=${this.normalizedBaseHost}\r\n .config=${this.config}\r\n .open=${this.signedOutOpened}\r\n ?hideSearch=${this.hideSearch}\r\n tabindex=\"${this.signedOutTabIndex}\"\r\n .menuItems=${this.signedOutMenuItems}\r\n @focusToOtherMenuItem=${(e: CustomEvent) => {\r\n this.currentTab = e.detail;\r\n }}\r\n ></signed-out-dropdown>\r\n `;\r\n }\r\n\r\n get signedOutMenuItems() {\r\n return this.menus.signedOut;\r\n }\r\n\r\n /**\r\n * Most users just get the basic menu items.\r\n * For users with `/items` priv, additional admin menu items are included too.\r\n * Having the `/flags` priv adds a further admin item for managing flags.\r\n */\r\n get userMenuItems() {\r\n const basicItems = this.menus.user;\r\n\r\n let adminItems = this.menus.userAdmin;\r\n if (this.canManageFlags) {\r\n adminItems = adminItems.concat(this.menus.userAdminFlags);\r\n }\r\n\r\n return this.itemIdentifier && this.admin\r\n ? [basicItems, adminItems]\r\n : [basicItems];\r\n }\r\n\r\n get allowSecondaryIcon() {\r\n return this.secondIdentitySlotMode === 'allow';\r\n }\r\n\r\n get useCustomSearch() {\r\n return this.searchSlotMode === 'custom';\r\n }\r\n\r\n get customSearchSlot() {\r\n return this.useCustomSearch\r\n ? html`<slot name=\"custom-search\" slot=\"custom-search\"></slot>`\r\n : nothing;\r\n }\r\n\r\n get secondLogoSlot() {\r\n return this.allowSecondaryIcon\r\n ? html`\r\n <slot name=\"opt-sec-logo\" slot=\"opt-sec-logo\"></slot>\r\n <slot name=\"opt-sec-logo-mobile\" slot=\"opt-sec-logo-mobile\"></slot>\r\n `\r\n : nothing;\r\n }\r\n\r\n get separatorTemplate() {\r\n return html`<li class=\"divider\" role=\"presentation\"></li>`;\r\n }\r\n\r\n render() {\r\n return html`\r\n <div class=\"topnav\">\r\n <primary-nav\r\n .baseHost=${this.normalizedBaseHost}\r\n .mediaBaseHost=${this.mediaBaseHost}\r\n .config=${this.config}\r\n .openMenu=${this.openMenu}\r\n .screenName=${this.screenName}\r\n .searchIn=${this.searchIn}\r\n .searchQuery=${this.searchQuery}\r\n .searchSlotMode=${this.searchSlotMode}\r\n .secondIdentitySlotMode=${this.secondIdentitySlotMode}\r\n .selectedMenuOption=${this.selectedMenuOption}\r\n .username=${this.username}\r\n .userProfileImagePath=${this.userProfileImagePath}\r\n .currentTab=${this.currentTab}\r\n ?hideSearch=${this.hideSearch}\r\n @mediaTypeSelected=${this.mediaTypeSelected}\r\n @trackClick=${this.trackClick}\r\n @trackSubmit=${this.trackSubmit}\r\n @menuToggled=${this.menuToggled}\r\n @navSearchBlur=${this.navSearchBlurEvent}\r\n >\r\n ${this.secondLogoSlot} ${this.customSearchSlot}\r\n </primary-nav>\r\n <media-slider\r\n .baseHost=${this.normalizedBaseHost}\r\n .config=${this.config}\r\n .selectedMenuOption=${this.selectedMenuOption}\r\n .mediaSliderOpen=${this.mediaSliderOpen}\r\n .menus=${this.menus}\r\n tabindex=\"${this.mediaSliderOpen ? '1' : '-1'}\"\r\n @focusToOtherMenuItem=${(e: CustomEvent) =>\r\n (this.currentTab = e.detail)}\r\n ></media-slider>\r\n </div>\r\n ${this.username ? this.userMenu : this.signedOutDropdown}\r\n ${this.useCustomSearch\r\n ? nothing\r\n : html`<search-menu\r\n .baseHost=${this.normalizedBaseHost}\r\n .config=${this.config}\r\n .openMenu=${this.openMenu}\r\n tabindex=\"${this.searchMenuTabIndex}\"\r\n ?hideSearch=${this.hideSearch}\r\n @searchInChanged=${this.searchInChanged}\r\n @trackClick=${this.trackClick}\r\n @trackSubmit=${this.trackSubmit}\r\n ></search-menu>`}\r\n <desktop-subnav\r\n .baseHost=${this.normalizedBaseHost}\r\n .menuItems=${this.menus.more.links}\r\n @focus=${this.closeMenus}\r\n ></desktop-subnav>\r\n <div\r\n id=\"close-layer\"\r\n class=\"${this.closeLayerClass}\"\r\n @click=${this.closeMenus}\r\n ></div>\r\n `;\r\n }\r\n}\r\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"keyboard-navigation.js","sourceRoot":"","sources":["../../../src/lib/keyboard-navigation.ts"],"names":[],"mappings":"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","sourcesContent":["export default class KeyboardNavigation {\n elementsContainer: HTMLElement;\n menuOption: string;\n focusableElements: HTMLElement[];\n focusedIndex: number;\n\n /**\n * Constructor for the KeyboardNavigation class.\n * @param {HTMLElement} elementsContainer - The container element that holds the focusable elements.\n * @param {string} menuOption - The type of menu option ('web' or 'usermenu').\n */\n constructor(elementsContainer: HTMLElement, menuOption: string) {\n this.elementsContainer = elementsContainer;\n this.menuOption = menuOption;\n this.focusableElements = this.getFocusableElements();\n this.focusedIndex = 0; // always start from first element\n\n if (menuOption !== 'search') {\n this.focusableElements[this.focusedIndex]?.focus();\n }\n this.handleKeyDown = this.handleKeyDown.bind(this);\n }\n\n /**\n * Gets an array of focusable elements within the container.\n * @returns {HTMLElement[]} An array of focusable elements.\n */\n getFocusableElements(): HTMLElement[] {\n const focusableTagSelectors = 'a[href], button, input, [tabindex]';\n\n const isFocusable = (el: Element) =>\n !el.hasAttribute('disabled') &&\n el.getAttribute('aria-hidden') !== 'true' &&\n el.getAttribute('tabindex') !== '-1';\n\n let elements;\n if (this.menuOption === 'web') {\n // wayback focusable elements\n const waybackSlider =\n this.elementsContainer.querySelector('wayback-slider')?.shadowRoot;\n const waybackSearch = waybackSlider?.querySelector('wayback-search');\n const waybackSearchElements = Array.from(\n waybackSearch?.shadowRoot?.querySelectorAll(focusableTagSelectors) ??\n [],\n );\n\n const normalElements = Array.from(\n waybackSlider?.querySelectorAll(focusableTagSelectors) ?? [],\n );\n\n // wayback save-form focusable elements\n const savePageForm = waybackSlider?.querySelector('save-page-form');\n const savePageFormElements = Array.from(\n savePageForm?.shadowRoot?.querySelectorAll(focusableTagSelectors) ?? [],\n );\n\n elements = [\n ...waybackSearchElements,\n ...normalElements,\n ...savePageFormElements,\n ];\n } else {\n elements = this.elementsContainer.querySelectorAll(focusableTagSelectors);\n }\n\n return Array.from(elements ?? []).filter(isFocusable) as HTMLElement[];\n }\n\n /**\n * Handles keyboard events and focuses the appropriate element.\n * @param {KeyboardEvent} event - The keyboard event object.\n */\n handleKeyDown(event: KeyboardEvent) {\n const target = event.composedPath()[0] as HTMLElement;\n\n // Ignore events from editable fields\n if (\n target instanceof HTMLInputElement ||\n target instanceof HTMLTextAreaElement ||\n target.isContentEditable\n ) {\n return;\n }\n\n const { key } = event;\n const isArrowKey = [\n 'ArrowDown',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowLeft',\n ].includes(key);\n const isTabKey = key === 'Tab';\n\n if (isArrowKey) {\n this.handleArrowKey(key);\n event.preventDefault();\n } else if (isTabKey) {\n this.handleTabKey(event);\n }\n }\n\n /**\n * Handles arrow key events and focuses the next or previous element for topnav sub-nav and usermenu\n * @param {string} key - The key that was pressed ('ArrowDown', 'ArrowRight', 'ArrowUp', or 'ArrowLeft').\n */\n handleArrowKey(key: string) {\n const isDownOrRight = ['ArrowDown', 'ArrowRight'].includes(key);\n if (isDownOrRight) {\n this.focusNext();\n } else {\n this.focusPrevious();\n }\n }\n\n /**\n * Handles the Tab key event and focuses the next or previous menu item.\n * @param {KeyboardEvent} event - The keyboard event object.\n */\n handleTabKey(event: KeyboardEvent) {\n const isShiftPressed = event.shiftKey;\n\n this.emitFocusToOtherMenuItems(isShiftPressed);\n\n this.focusableElements[this.focusedIndex]?.blur();\n if (!['search'].includes(this.menuOption)) {\n event.preventDefault();\n }\n }\n\n /**\n * Focuses the previous focusable element in the container.\n */\n focusPrevious() {\n if (this.focusableElements.length === 0) return;\n this.focusedIndex =\n (this.focusedIndex - 1 + this.focusableElements.length) %\n this.focusableElements.length;\n this.focusableElements[this.focusedIndex]?.focus();\n }\n\n /**\n * Focuses the next focusable element in the container.\n */\n focusNext() {\n if (this.focusableElements.length === 0) return;\n this.focusedIndex = (this.focusedIndex + 1) % this.focusableElements.length;\n this.focusableElements[this.focusedIndex]?.focus();\n }\n\n /**\n * Focuses the other parent menu items based on the provided flag.\n * @param {boolean} isPrevious - A flag indicating whether to focus the previous menu item.\n */\n emitFocusToOtherMenuItems(isPrevious: boolean = false) {\n this.elementsContainer.dispatchEvent(\n new CustomEvent('focusToOtherMenuItem', {\n bubbles: true,\n composed: true,\n detail: {\n mediatype: this.menuOption,\n moveTo: isPrevious ? 'prev' : 'next',\n },\n }),\n );\n }\n}\n"]}
1
+ {"version":3,"file":"keyboard-navigation.js","sourceRoot":"","sources":["../../../src/lib/keyboard-navigation.ts"],"names":[],"mappings":"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","sourcesContent":["export default class KeyboardNavigation {\r\n elementsContainer: HTMLElement;\r\n menuOption: string;\r\n focusableElements: HTMLElement[];\r\n focusedIndex: number;\r\n\r\n /**\r\n * Constructor for the KeyboardNavigation class.\r\n * @param {HTMLElement} elementsContainer - The container element that holds the focusable elements.\r\n * @param {string} menuOption - The type of menu option ('web' or 'usermenu').\r\n */\r\n constructor(elementsContainer: HTMLElement, menuOption: string) {\r\n this.elementsContainer = elementsContainer;\r\n this.menuOption = menuOption;\r\n this.focusableElements = this.getFocusableElements();\r\n this.focusedIndex = 0; // always start from first element\r\n\r\n if (menuOption !== 'search') {\r\n this.focusableElements[this.focusedIndex]?.focus();\r\n }\r\n this.handleKeyDown = this.handleKeyDown.bind(this);\r\n }\r\n\r\n /**\r\n * Gets an array of focusable elements within the container.\r\n * @returns {HTMLElement[]} An array of focusable elements.\r\n */\r\n getFocusableElements(): HTMLElement[] {\r\n const focusableTagSelectors = 'a[href], button, input, [tabindex]';\r\n\r\n const isFocusable = (el: Element) =>\r\n !el.hasAttribute('disabled') &&\r\n el.getAttribute('aria-hidden') !== 'true' &&\r\n el.getAttribute('tabindex') !== '-1';\r\n\r\n let elements;\r\n if (this.menuOption === 'web') {\r\n // wayback focusable elements\r\n const waybackSlider =\r\n this.elementsContainer.querySelector('wayback-slider')?.shadowRoot;\r\n const waybackSearch = waybackSlider?.querySelector('wayback-search');\r\n const waybackSearchElements = Array.from(\r\n waybackSearch?.shadowRoot?.querySelectorAll(focusableTagSelectors) ??\r\n [],\r\n );\r\n\r\n const normalElements = Array.from(\r\n waybackSlider?.querySelectorAll(focusableTagSelectors) ?? [],\r\n );\r\n\r\n // wayback save-form focusable elements\r\n const savePageForm = waybackSlider?.querySelector('save-page-form');\r\n const savePageFormElements = Array.from(\r\n savePageForm?.shadowRoot?.querySelectorAll(focusableTagSelectors) ?? [],\r\n );\r\n\r\n elements = [\r\n ...waybackSearchElements,\r\n ...normalElements,\r\n ...savePageFormElements,\r\n ];\r\n } else {\r\n elements = this.elementsContainer.querySelectorAll(focusableTagSelectors);\r\n }\r\n\r\n return Array.from(elements ?? []).filter(isFocusable) as HTMLElement[];\r\n }\r\n\r\n /**\r\n * Handles keyboard events and focuses the appropriate element.\r\n * @param {KeyboardEvent} event - The keyboard event object.\r\n */\r\n handleKeyDown(event: KeyboardEvent) {\r\n const target = event.composedPath()[0] as HTMLElement;\r\n\r\n // Ignore events from editable fields\r\n if (\r\n target instanceof HTMLInputElement ||\r\n target instanceof HTMLTextAreaElement ||\r\n target.isContentEditable\r\n ) {\r\n return;\r\n }\r\n\r\n const { key } = event;\r\n const isArrowKey = [\r\n 'ArrowDown',\r\n 'ArrowRight',\r\n 'ArrowUp',\r\n 'ArrowLeft',\r\n ].includes(key);\r\n const isTabKey = key === 'Tab';\r\n\r\n if (isArrowKey) {\r\n this.handleArrowKey(key);\r\n event.preventDefault();\r\n } else if (isTabKey) {\r\n this.handleTabKey(event);\r\n }\r\n }\r\n\r\n /**\r\n * Handles arrow key events and focuses the next or previous element for topnav sub-nav and usermenu\r\n * @param {string} key - The key that was pressed ('ArrowDown', 'ArrowRight', 'ArrowUp', or 'ArrowLeft').\r\n */\r\n handleArrowKey(key: string) {\r\n const isDownOrRight = ['ArrowDown', 'ArrowRight'].includes(key);\r\n if (isDownOrRight) {\r\n this.focusNext();\r\n } else {\r\n this.focusPrevious();\r\n }\r\n }\r\n\r\n /**\r\n * Handles the Tab key event and focuses the next or previous menu item.\r\n * @param {KeyboardEvent} event - The keyboard event object.\r\n */\r\n handleTabKey(event: KeyboardEvent) {\r\n const isShiftPressed = event.shiftKey;\r\n\r\n this.emitFocusToOtherMenuItems(isShiftPressed);\r\n\r\n this.focusableElements[this.focusedIndex]?.blur();\r\n if (!['search'].includes(this.menuOption)) {\r\n event.preventDefault();\r\n }\r\n }\r\n\r\n /**\r\n * Focuses the previous focusable element in the container.\r\n */\r\n focusPrevious() {\r\n if (this.focusableElements.length === 0) return;\r\n this.focusedIndex =\r\n (this.focusedIndex - 1 + this.focusableElements.length) %\r\n this.focusableElements.length;\r\n this.focusableElements[this.focusedIndex]?.focus();\r\n }\r\n\r\n /**\r\n * Focuses the next focusable element in the container.\r\n */\r\n focusNext() {\r\n if (this.focusableElements.length === 0) return;\r\n this.focusedIndex = (this.focusedIndex + 1) % this.focusableElements.length;\r\n this.focusableElements[this.focusedIndex]?.focus();\r\n }\r\n\r\n /**\r\n * Focuses the other parent menu items based on the provided flag.\r\n * @param {boolean} isPrevious - A flag indicating whether to focus the previous menu item.\r\n */\r\n emitFocusToOtherMenuItems(isPrevious: boolean = false) {\r\n this.elementsContainer.dispatchEvent(\r\n new CustomEvent('focusToOtherMenuItem', {\r\n bubbles: true,\r\n composed: true,\r\n detail: {\r\n mediatype: this.menuOption,\r\n moveTo: isPrevious ? 'prev' : 'next',\r\n },\r\n }),\r\n );\r\n }\r\n}\r\n"]}
@@ -47,23 +47,23 @@ let LoginButton = class LoginButton extends TrackedElement {
47
47
  }));
48
48
  }
49
49
  render() {
50
- return html `
51
- <div class="logged-out-toolbar">
52
- <button
53
- class="logged-out-menu ${this.avatarClass}"
54
- @click=${this.toggleDropdown}
55
- data-event-click-tracking="${this.analyticsEvent}"
56
- aria-label="Toggle login menu"
57
- aria-expanded="${makeBooleanString(this.menuOpened)}"
58
- >
59
- ${icons.user}
60
- </button>
61
- <span>
62
- <a href="${this.signupPath}">Sign up</a>
63
- |
64
- <a href="${this.loginPath}">Log in</a>
65
- </span>
66
- </div>
50
+ return html `
51
+ <div class="logged-out-toolbar">
52
+ <button
53
+ class="logged-out-menu ${this.avatarClass}"
54
+ @click=${this.toggleDropdown}
55
+ data-event-click-tracking="${this.analyticsEvent}"
56
+ aria-label="Toggle login menu"
57
+ aria-expanded="${makeBooleanString(this.menuOpened)}"
58
+ >
59
+ ${icons.user}
60
+ </button>
61
+ <span>
62
+ <a href="${this.signupPath}">Sign up</a>
63
+ |
64
+ <a href="${this.loginPath}">Log in</a>
65
+ </span>
66
+ </div>
67
67
  `;
68
68
  }
69
69
  };
@@ -1 +1 @@
1
- {"version":3,"file":"login-button.js","sourceRoot":"","sources":["../../src/login-button.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,KAAK,MAAM,oBAAoB,CAAC;AACvC,OAAO,cAAc,MAAM,uBAAuB,CAAC;AACnD,OAAO,SAAS,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAG5C,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,cAAc;IAAxC;;QACuB,aAAQ,GAAG,EAAE,CAAC;QACd,WAAM,GAAmB,mBAAmB,CAAC;QAC7C,aAAQ,GAAG,EAAE,CAAC;QAEzB,qBAAgB,GAAG,EAAE,CAAC;IA6DzC,CAAC;IA3DC,MAAM,KAAK,MAAM;QACf,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,SAAS,CAAC,iBAAiB,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACrD,CAAC;IAED,IAAI,SAAS;QACX,OAAO,SAAS,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC5C,CAAC;IAED,IAAI,cAAc;;QAChB,OAAO,GAAG,MAAA,IAAI,CAAC,MAAM,0CAAE,aAAa,eAAe,CAAC;IACtD,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC;IACnC,CAAC;IAED,IAAI,WAAW;QACb,OAAO,kBAAkB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;IAC9D,CAAC;IAED,cAAc,CAAC,CAAQ;QACrB,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACnB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QACpD,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,QAAQ,EAAE,OAAO;aAClB;SACF,CAAC,CACH,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;mCAGoB,IAAI,CAAC,WAAW;mBAChC,IAAI,CAAC,cAAc;uCACC,IAAI,CAAC,cAAc;;2BAE/B,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC;;YAEjD,KAAK,CAAC,IAAI;;;qBAGD,IAAI,CAAC,UAAU;;qBAEf,IAAI,CAAC,SAAS;;;KAG9B,CAAC;IACJ,CAAC;CACF,CAAA;AAjE6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAA8C;AAC7C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AAEzB;IAAhB,KAAK,EAAE;qDAA+B;AAL5B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAkEvB","sourcesContent":["import { html } from 'lit';\nimport TrackedElement from './tracked-element';\nimport icons from './assets/img/icons';\nimport loginButtonCSS from './styles/login-button';\nimport formatUrl from './lib/format-url';\nimport { makeBooleanString } from './lib/make-boolean-string';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { IATopNavConfig } from './models';\nimport { defaultTopNavConfig } from './data/menus';\n\n@customElement('login-button')\nexport class LoginButton extends TrackedElement {\n @property({ type: String }) baseHost = '';\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n @property({ type: String }) openMenu = '';\n\n @state() private dropdownTabIndex = '';\n\n static get styles() {\n return loginButtonCSS;\n }\n\n get signupPath() {\n return formatUrl('/account/signup', this.baseHost);\n }\n\n get loginPath() {\n return formatUrl('/login', this.baseHost);\n }\n\n get analyticsEvent() {\n return `${this.config?.eventCategory}|NavLoginIcon`;\n }\n\n get menuOpened(): boolean {\n return this.openMenu === 'login';\n }\n\n get avatarClass() {\n return `dropdown-toggle${this.menuOpened ? ' active' : ''}`;\n }\n\n toggleDropdown(e: Event) {\n e.preventDefault();\n this.trackClick(e);\n this.dropdownTabIndex = this.menuOpened ? '' : '-1';\n this.dispatchEvent(\n new CustomEvent('menuToggled', {\n bubbles: true,\n composed: true,\n detail: {\n menuName: 'login',\n },\n }),\n );\n }\n\n render() {\n return html`\n <div class=\"logged-out-toolbar\">\n <button\n class=\"logged-out-menu ${this.avatarClass}\"\n @click=${this.toggleDropdown}\n data-event-click-tracking=\"${this.analyticsEvent}\"\n aria-label=\"Toggle login menu\"\n aria-expanded=\"${makeBooleanString(this.menuOpened)}\"\n >\n ${icons.user}\n </button>\n <span>\n <a href=\"${this.signupPath}\">Sign up</a>\n |\n <a href=\"${this.loginPath}\">Log in</a>\n </span>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"login-button.js","sourceRoot":"","sources":["../../src/login-button.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,KAAK,MAAM,oBAAoB,CAAC;AACvC,OAAO,cAAc,MAAM,uBAAuB,CAAC;AACnD,OAAO,SAAS,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAG5C,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,cAAc;IAAxC;;QACuB,aAAQ,GAAG,EAAE,CAAC;QACd,WAAM,GAAmB,mBAAmB,CAAC;QAC7C,aAAQ,GAAG,EAAE,CAAC;QAEzB,qBAAgB,GAAG,EAAE,CAAC;IA6DzC,CAAC;IA3DC,MAAM,KAAK,MAAM;QACf,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,SAAS,CAAC,iBAAiB,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACrD,CAAC;IAED,IAAI,SAAS;QACX,OAAO,SAAS,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC5C,CAAC;IAED,IAAI,cAAc;;QAChB,OAAO,GAAG,MAAA,IAAI,CAAC,MAAM,0CAAE,aAAa,eAAe,CAAC;IACtD,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC;IACnC,CAAC;IAED,IAAI,WAAW;QACb,OAAO,kBAAkB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;IAC9D,CAAC;IAED,cAAc,CAAC,CAAQ;QACrB,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACnB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QACpD,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,QAAQ,EAAE,OAAO;aAClB;SACF,CAAC,CACH,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;mCAGoB,IAAI,CAAC,WAAW;mBAChC,IAAI,CAAC,cAAc;uCACC,IAAI,CAAC,cAAc;;2BAE/B,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC;;YAEjD,KAAK,CAAC,IAAI;;;qBAGD,IAAI,CAAC,UAAU;;qBAEf,IAAI,CAAC,SAAS;;;KAG9B,CAAC;IACJ,CAAC;CACF,CAAA;AAjE6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAA8C;AAC7C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AAEzB;IAAhB,KAAK,EAAE;qDAA+B;AAL5B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAkEvB","sourcesContent":["import { html } from 'lit';\r\nimport TrackedElement from './tracked-element';\r\nimport icons from './assets/img/icons';\r\nimport loginButtonCSS from './styles/login-button';\r\nimport formatUrl from './lib/format-url';\r\nimport { makeBooleanString } from './lib/make-boolean-string';\r\nimport { customElement, property, state } from 'lit/decorators.js';\r\nimport { IATopNavConfig } from './models';\r\nimport { defaultTopNavConfig } from './data/menus';\r\n\r\n@customElement('login-button')\r\nexport class LoginButton extends TrackedElement {\r\n @property({ type: String }) baseHost = '';\r\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n @property({ type: String }) openMenu = '';\r\n\r\n @state() private dropdownTabIndex = '';\r\n\r\n static get styles() {\r\n return loginButtonCSS;\r\n }\r\n\r\n get signupPath() {\r\n return formatUrl('/account/signup', this.baseHost);\r\n }\r\n\r\n get loginPath() {\r\n return formatUrl('/login', this.baseHost);\r\n }\r\n\r\n get analyticsEvent() {\r\n return `${this.config?.eventCategory}|NavLoginIcon`;\r\n }\r\n\r\n get menuOpened(): boolean {\r\n return this.openMenu === 'login';\r\n }\r\n\r\n get avatarClass() {\r\n return `dropdown-toggle${this.menuOpened ? ' active' : ''}`;\r\n }\r\n\r\n toggleDropdown(e: Event) {\r\n e.preventDefault();\r\n this.trackClick(e);\r\n this.dropdownTabIndex = this.menuOpened ? '' : '-1';\r\n this.dispatchEvent(\r\n new CustomEvent('menuToggled', {\r\n bubbles: true,\r\n composed: true,\r\n detail: {\r\n menuName: 'login',\r\n },\r\n }),\r\n );\r\n }\r\n\r\n render() {\r\n return html`\r\n <div class=\"logged-out-toolbar\">\r\n <button\r\n class=\"logged-out-menu ${this.avatarClass}\"\r\n @click=${this.toggleDropdown}\r\n data-event-click-tracking=\"${this.analyticsEvent}\"\r\n aria-label=\"Toggle login menu\"\r\n aria-expanded=\"${makeBooleanString(this.menuOpened)}\"\r\n >\r\n ${icons.user}\r\n </button>\r\n <span>\r\n <a href=\"${this.signupPath}\">Sign up</a>\r\n |\r\n <a href=\"${this.loginPath}\">Log in</a>\r\n </span>\r\n </div>\r\n `;\r\n }\r\n}\r\n"]}
@@ -88,19 +88,19 @@ let MediaMenu = class MediaMenu extends LitElement {
88
88
  get mediaMenuOptionsTemplate() {
89
89
  const buttons = menuSelection.map(({ icon, menu, label, href, followable }) => {
90
90
  const selected = this.selectedMenuOption === menu;
91
- return html `
92
- <media-button
93
- .config=${this.config}
94
- .icon=${icon}
95
- .href=${formatUrl(href, this.baseHost)}
96
- ?followable=${followable}
97
- .label=${label}
98
- .mediatype=${menu}
99
- .openMenu=${this.openMenu}
100
- .selected=${selected}
101
- .selectedMenuOption=${this.selectedMenuOption}
102
- data-mediatype="${menu}"
103
- ></media-button>
91
+ return html `
92
+ <media-button
93
+ .config=${this.config}
94
+ .icon=${icon}
95
+ .href=${formatUrl(href, this.baseHost)}
96
+ ?followable=${followable}
97
+ .label=${label}
98
+ .mediatype=${menu}
99
+ .openMenu=${this.openMenu}
100
+ .selected=${selected}
101
+ .selectedMenuOption=${this.selectedMenuOption}
102
+ data-mediatype="${menu}"
103
+ ></media-button>
104
104
  `;
105
105
  });
106
106
  return buttons;
@@ -112,14 +112,14 @@ let MediaMenu = class MediaMenu extends LitElement {
112
112
  return this.menuOpened ? 'open' : 'closed';
113
113
  }
114
114
  render() {
115
- return html `
116
- <div class="media-menu-container ${this.menuClass}">
117
- <div class="overflow-clip">
118
- <nav class="media-menu-inner" aria-expanded="${this.menuOpened}">
119
- <div class="menu-group">${this.mediaMenuOptionsTemplate}</div>
120
- </nav>
121
- </div>
122
- </div>
115
+ return html `
116
+ <div class="media-menu-container ${this.menuClass}">
117
+ <div class="overflow-clip">
118
+ <nav class="media-menu-inner" aria-expanded="${this.menuOpened}">
119
+ <div class="menu-group">${this.mediaMenuOptionsTemplate}</div>
120
+ </nav>
121
+ </div>
122
+ </div>
123
123
  `;
124
124
  }
125
125
  };
@@ -1 +1 @@
1
- {"version":3,"file":"media-menu.js","sourceRoot":"","sources":["../../src/media-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html } from 'lit';\nimport { customElement, property, queryAll } from 'lit/decorators.js';\n\nimport { defaultTopNavConfig } from './data/menus';\nimport formatUrl from './lib/format-url';\nimport './media-button';\nimport { MediaButton } from './media-button';\nimport { IATopNavConfig } from './models';\nimport mediaMenuCSS from './styles/media-menu';\n\nconst menuSelection = [\n {\n icon: 'web',\n menu: 'web',\n href: 'https://web.archive.org',\n label: 'Wayback Machine',\n },\n {\n icon: 'texts',\n menu: 'texts',\n href: '/details/texts',\n label: 'Texts',\n },\n {\n icon: 'video',\n menu: 'video',\n href: '/details/movies',\n label: 'Video',\n },\n {\n icon: 'audio',\n menu: 'audio',\n href: '/details/audio',\n label: 'Audio',\n },\n {\n icon: 'software',\n menu: 'software',\n href: '/details/software',\n label: 'Software',\n },\n {\n icon: 'images',\n menu: 'images',\n href: '/details/image',\n label: 'Images',\n },\n {\n icon: 'donate',\n menu: 'donate',\n href: '/donate/?origin=iawww-mbhmbgrmenu',\n label: 'Donate',\n followable: true,\n },\n {\n icon: 'ellipses',\n menu: 'more',\n href: '/about/',\n label: 'More',\n },\n];\n\n@customElement('media-menu')\nexport class MediaMenu extends LitElement {\n @property({ type: String }) baseHost = '';\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n @property({ type: String }) openMenu = '';\n @property({ type: String }) selectedMenuOption = '';\n @property({ type: Object }) currentTab: { moveTo: string } | undefined;\n\n @queryAll('media-button') mediaButtons?: MediaButton[];\n\n static get styles() {\n return mediaMenuCSS;\n }\n\n updated(props: PropertyValues) {\n if (props.has('currentTab')) {\n const mediaButtons = Array.from(this.mediaButtons ?? []);\n\n mediaButtons.map((button, index) => {\n const linkItem = button.shadowRoot?.querySelector('a.menu-item');\n if (linkItem) {\n if (linkItem.classList.contains(`${this.selectedMenuOption}`)) {\n linkItem.classList.remove('selected');\n (linkItem as HTMLElement).blur();\n\n const newFocusIndex =\n this.currentTab?.moveTo === 'next' ? index + 1 : index - 1;\n (\n mediaButtons[newFocusIndex]?.shadowRoot?.querySelector(\n 'a.menu-item',\n ) as HTMLElement\n ).focus();\n }\n }\n });\n }\n }\n\n get mediaMenuOptionsTemplate() {\n const buttons = menuSelection.map(\n ({ icon, menu, label, href, followable }) => {\n const selected = this.selectedMenuOption === menu;\n return html`\n <media-button\n .config=${this.config}\n .icon=${icon}\n .href=${formatUrl(href as string & Location, this.baseHost)}\n ?followable=${followable}\n .label=${label}\n .mediatype=${menu}\n .openMenu=${this.openMenu}\n .selected=${selected}\n .selectedMenuOption=${this.selectedMenuOption}\n data-mediatype=\"${menu}\"\n ></media-button>\n `;\n },\n );\n return buttons;\n }\n\n get menuOpened() {\n return this.openMenu === 'media';\n }\n\n get menuClass() {\n return this.menuOpened ? 'open' : 'closed';\n }\n\n render() {\n return html`\n <div class=\"media-menu-container ${this.menuClass}\">\n <div class=\"overflow-clip\">\n <nav class=\"media-menu-inner\" aria-expanded=\"${this.menuOpened}\">\n <div class=\"menu-group\">${this.mediaMenuOptionsTemplate}</div>\n </nav>\n </div>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"media-menu.js","sourceRoot":"","sources":["../../src/media-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html } from 'lit';\r\nimport { customElement, property, queryAll } from 'lit/decorators.js';\r\n\r\nimport { defaultTopNavConfig } from './data/menus';\r\nimport formatUrl from './lib/format-url';\r\nimport './media-button';\r\nimport { MediaButton } from './media-button';\r\nimport { IATopNavConfig } from './models';\r\nimport mediaMenuCSS from './styles/media-menu';\r\n\r\nconst menuSelection = [\r\n {\r\n icon: 'web',\r\n menu: 'web',\r\n href: 'https://web.archive.org',\r\n label: 'Wayback Machine',\r\n },\r\n {\r\n icon: 'texts',\r\n menu: 'texts',\r\n href: '/details/texts',\r\n label: 'Texts',\r\n },\r\n {\r\n icon: 'video',\r\n menu: 'video',\r\n href: '/details/movies',\r\n label: 'Video',\r\n },\r\n {\r\n icon: 'audio',\r\n menu: 'audio',\r\n href: '/details/audio',\r\n label: 'Audio',\r\n },\r\n {\r\n icon: 'software',\r\n menu: 'software',\r\n href: '/details/software',\r\n label: 'Software',\r\n },\r\n {\r\n icon: 'images',\r\n menu: 'images',\r\n href: '/details/image',\r\n label: 'Images',\r\n },\r\n {\r\n icon: 'donate',\r\n menu: 'donate',\r\n href: '/donate/?origin=iawww-mbhmbgrmenu',\r\n label: 'Donate',\r\n followable: true,\r\n },\r\n {\r\n icon: 'ellipses',\r\n menu: 'more',\r\n href: '/about/',\r\n label: 'More',\r\n },\r\n];\r\n\r\n@customElement('media-menu')\r\nexport class MediaMenu extends LitElement {\r\n @property({ type: String }) baseHost = '';\r\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n @property({ type: String }) openMenu = '';\r\n @property({ type: String }) selectedMenuOption = '';\r\n @property({ type: Object }) currentTab: { moveTo: string } | undefined;\r\n\r\n @queryAll('media-button') mediaButtons?: MediaButton[];\r\n\r\n static get styles() {\r\n return mediaMenuCSS;\r\n }\r\n\r\n updated(props: PropertyValues) {\r\n if (props.has('currentTab')) {\r\n const mediaButtons = Array.from(this.mediaButtons ?? []);\r\n\r\n mediaButtons.map((button, index) => {\r\n const linkItem = button.shadowRoot?.querySelector('a.menu-item');\r\n if (linkItem) {\r\n if (linkItem.classList.contains(`${this.selectedMenuOption}`)) {\r\n linkItem.classList.remove('selected');\r\n (linkItem as HTMLElement).blur();\r\n\r\n const newFocusIndex =\r\n this.currentTab?.moveTo === 'next' ? index + 1 : index - 1;\r\n (\r\n mediaButtons[newFocusIndex]?.shadowRoot?.querySelector(\r\n 'a.menu-item',\r\n ) as HTMLElement\r\n ).focus();\r\n }\r\n }\r\n });\r\n }\r\n }\r\n\r\n get mediaMenuOptionsTemplate() {\r\n const buttons = menuSelection.map(\r\n ({ icon, menu, label, href, followable }) => {\r\n const selected = this.selectedMenuOption === menu;\r\n return html`\r\n <media-button\r\n .config=${this.config}\r\n .icon=${icon}\r\n .href=${formatUrl(href as string & Location, this.baseHost)}\r\n ?followable=${followable}\r\n .label=${label}\r\n .mediatype=${menu}\r\n .openMenu=${this.openMenu}\r\n .selected=${selected}\r\n .selectedMenuOption=${this.selectedMenuOption}\r\n data-mediatype=\"${menu}\"\r\n ></media-button>\r\n `;\r\n },\r\n );\r\n return buttons;\r\n }\r\n\r\n get menuOpened() {\r\n return this.openMenu === 'media';\r\n }\r\n\r\n get menuClass() {\r\n return this.menuOpened ? 'open' : 'closed';\r\n }\r\n\r\n render() {\r\n return html`\r\n <div class=\"media-menu-container ${this.menuClass}\">\r\n <div class=\"overflow-clip\">\r\n <nav class=\"media-menu-inner\" aria-expanded=\"${this.menuOpened}\">\r\n <div class=\"menu-group\">${this.mediaMenuOptionsTemplate}</div>\r\n </nav>\r\n </div>\r\n </div>\r\n `;\r\n }\r\n}\r\n"]}
@@ -49,3 +49,4 @@ export interface IATopNavMenuConfig {
49
49
  web: IATopNavMediaMenu;
50
50
  }
51
51
  export type IATopNavSecondIdentitySlotMode = 'allow' | '';
52
+ export type IATopNavSearchSlotMode = 'custom' | '';
@@ -1 +1 @@
1
- {"version":3,"file":"models.js","sourceRoot":"","sources":["../../src/models.ts"],"names":[],"mappings":"","sourcesContent":["export interface IATopNavConfig {\n /**\n * Google Analytics event category\n */\n eventCategory?: string;\n\n /**\n * Copy to display for number of pages archived at the top of the Wayback search form\n *\n * ie. \"425 billion\"\n */\n waybackPagesArchived?: string;\n\n /**\n * Array of strings representing the values of options that should be hidden from search options\n */\n hiddenSearchOptions?: string[];\n\n /**\n * Map from dropdown item ids to any callout text that should be applied beside them\n */\n callouts?: Record<string, string>;\n}\n\nexport interface IATopNavLink {\n title: string;\n\n url?: string;\n\n class?: string;\n\n icon?: string;\n\n analyticsEvent?: string;\n\n external?: boolean;\n}\n\nexport interface IATopNavMediaMenu {\n heading: string;\n iconLinks: IATopNavLink[];\n featuredLinks: IATopNavLink[];\n links: IATopNavLink[];\n mobileAppsLinks: IATopNavLink[];\n browserExtensionsLinks: IATopNavLink[];\n archiveItLinks: IATopNavLink[];\n}\n\nexport interface IATopNavMenuConfig {\n audio: IATopNavMediaMenu;\n images: IATopNavMediaMenu;\n more: IATopNavMediaMenu;\n signedOut: IATopNavLink[];\n software: IATopNavMediaMenu;\n texts: IATopNavMediaMenu;\n user: IATopNavLink[];\n userAdmin: IATopNavLink[];\n userAdminFlags: IATopNavLink[];\n video: IATopNavMediaMenu;\n web: IATopNavMediaMenu;\n}\n\nexport type IATopNavSecondIdentitySlotMode = 'allow' | '';\n"]}
1
+ {"version":3,"file":"models.js","sourceRoot":"","sources":["../../src/models.ts"],"names":[],"mappings":"","sourcesContent":["export interface IATopNavConfig {\r\n /**\r\n * Google Analytics event category\r\n */\r\n eventCategory?: string;\r\n\r\n /**\r\n * Copy to display for number of pages archived at the top of the Wayback search form\r\n *\r\n * ie. \"425 billion\"\r\n */\r\n waybackPagesArchived?: string;\r\n\r\n /**\r\n * Array of strings representing the values of options that should be hidden from search options\r\n */\r\n hiddenSearchOptions?: string[];\r\n\r\n /**\r\n * Map from dropdown item ids to any callout text that should be applied beside them\r\n */\r\n callouts?: Record<string, string>;\r\n}\r\n\r\nexport interface IATopNavLink {\r\n title: string;\r\n\r\n url?: string;\r\n\r\n class?: string;\r\n\r\n icon?: string;\r\n\r\n analyticsEvent?: string;\r\n\r\n external?: boolean;\r\n}\r\n\r\nexport interface IATopNavMediaMenu {\r\n heading: string;\r\n iconLinks: IATopNavLink[];\r\n featuredLinks: IATopNavLink[];\r\n links: IATopNavLink[];\r\n mobileAppsLinks: IATopNavLink[];\r\n browserExtensionsLinks: IATopNavLink[];\r\n archiveItLinks: IATopNavLink[];\r\n}\r\n\r\nexport interface IATopNavMenuConfig {\r\n audio: IATopNavMediaMenu;\r\n images: IATopNavMediaMenu;\r\n more: IATopNavMediaMenu;\r\n signedOut: IATopNavLink[];\r\n software: IATopNavMediaMenu;\r\n texts: IATopNavMediaMenu;\r\n user: IATopNavLink[];\r\n userAdmin: IATopNavLink[];\r\n userAdminFlags: IATopNavLink[];\r\n video: IATopNavMediaMenu;\r\n web: IATopNavMediaMenu;\r\n}\r\n\r\nexport type IATopNavSecondIdentitySlotMode = 'allow' | '';\r\n\r\nexport type IATopNavSearchSlotMode = 'custom' | '';\r\n"]}
@@ -4,7 +4,7 @@ import './assets/img/hamburger';
4
4
  import './login-button';
5
5
  import './nav-search';
6
6
  import './media-menu';
7
- import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from './models';
7
+ import { IATopNavConfig, IATopNavSearchSlotMode, IATopNavSecondIdentitySlotMode } from './models';
8
8
  export declare class PrimaryNav extends TrackedElement {
9
9
  mediaBaseHost: string;
10
10
  baseHost: string;
@@ -14,6 +14,7 @@ export declare class PrimaryNav extends TrackedElement {
14
14
  screenName: string;
15
15
  searchIn: string;
16
16
  searchQuery: string;
17
+ searchSlotMode: IATopNavSearchSlotMode;
17
18
  secondIdentitySlotMode: IATopNavSecondIdentitySlotMode;
18
19
  selectedMenuOption: string;
19
20
  signedOutMenuOpen: boolean;
@@ -34,6 +35,7 @@ export declare class PrimaryNav extends TrackedElement {
34
35
  get userIcon(): import("lit").TemplateResult<1>;
35
36
  get loginIcon(): import("lit").TemplateResult<1>;
36
37
  get searchMenuOpen(): boolean;
38
+ get useCustomSearch(): boolean;
37
39
  get allowSecondaryIcon(): boolean;
38
40
  get searchMenu(): import("lit").TemplateResult<1> | typeof nothing;
39
41
  private emitNavSearchBlurEvent;