@internetarchive/ia-topnav 2.0.1-alpha-webdev8396.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { nothing, PropertyValues, TemplateResult } from 'lit';
1
+ import { CSSResultGroup, nothing, PropertyValues, TemplateResult } from 'lit';
2
2
  import { IATopNavConfig, IATopNavLink } from './models';
3
3
  import TrackedElement from './tracked-element';
4
4
  export default class DropdownMenu extends TrackedElement {
@@ -8,7 +8,7 @@ export default class DropdownMenu extends TrackedElement {
8
8
  animated: boolean;
9
9
  open: boolean;
10
10
  private previousKeydownListener?;
11
- static get styles(): import("lit").CSSResult;
11
+ static get styles(): CSSResultGroup;
12
12
  updated(props: PropertyValues): void;
13
13
  get dropdownItems(): typeof nothing | TemplateResult[] | (TemplateResult[] | undefined)[];
14
14
  static get dropdownDivider(): TemplateResult<1>;
@@ -1,5 +1,5 @@
1
1
  import { __decorate } from "tslib";
2
- import { html, nothing } from 'lit';
2
+ import { html, nothing, } from 'lit';
3
3
  import { property } from 'lit/decorators.js';
4
4
  import icons from './assets/img/icons';
5
5
  import { defaultTopNavConfig } from './data/menus';
@@ -54,12 +54,12 @@ export default class DropdownMenu extends TrackedElement {
54
54
  return html `<li class="divider"></li>`;
55
55
  }
56
56
  dropdownSection(submenu) {
57
- return submenu.map((item) => html `
58
- <li>
57
+ return submenu.map((item) => html `
58
+ <li>
59
59
  ${item.url
60
60
  ? this.dropdownLink(item)
61
- : DropdownMenu.dropdownText(item)}
62
- </li>
61
+ : DropdownMenu.dropdownText(item)}
62
+ </li>
63
63
  `);
64
64
  }
65
65
  dropdownLink(link) {
@@ -67,18 +67,18 @@ export default class DropdownMenu extends TrackedElement {
67
67
  const calloutText = (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.callouts) === null || _b === void 0 ? void 0 : _b[link.title];
68
68
  const isMobileUpload = link.class === 'mobile-upload';
69
69
  const isTabbable = this.open && !isMobileUpload;
70
- return html `<a
71
- href="${formatUrl(link.url, this.baseHost)}"
72
- class=${ifDefined(link.class)}
73
- tabindex="${isTabbable ? '' : '-1'}"
74
- @click=${this.trackClick}
75
- data-event-click-tracking="${(_c = this.config) === null || _c === void 0 ? void 0 : _c.eventCategory}|Nav${link.analyticsEvent}"
76
- aria-label=${calloutText ? `New feature: ${link.title}` : nothing}
77
- >
78
- ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}
70
+ return html `<a
71
+ href="${formatUrl(link.url, this.baseHost)}"
72
+ class=${ifDefined(link.class)}
73
+ tabindex="${isTabbable ? '' : '-1'}"
74
+ @click=${this.trackClick}
75
+ data-event-click-tracking="${(_c = this.config) === null || _c === void 0 ? void 0 : _c.eventCategory}|Nav${link.analyticsEvent}"
76
+ aria-label=${calloutText ? `New feature: ${link.title}` : nothing}
77
+ >
78
+ ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}
79
79
  ${calloutText
80
80
  ? html `<span class="callout" aria-hidden="true">${calloutText}</span>`
81
- : nothing}
81
+ : nothing}
82
82
  </a>`;
83
83
  }
84
84
  static dropdownText(item) {
@@ -92,18 +92,18 @@ export default class DropdownMenu extends TrackedElement {
92
92
  return 'initial';
93
93
  }
94
94
  render() {
95
- return html `
96
- <div class="nav-container">
97
- <nav
98
- class="${this.menuClass}"
99
- aria-hidden="${makeBooleanString(!this.open)}"
100
- aria-expanded="${makeBooleanString(this.open)}"
101
- >
102
- <ul>
103
- ${this.dropdownItems}
104
- </ul>
105
- </nav>
106
- </div>
95
+ return html `
96
+ <div class="nav-container">
97
+ <nav
98
+ class="${this.menuClass}"
99
+ aria-hidden="${makeBooleanString(!this.open)}"
100
+ aria-expanded="${makeBooleanString(this.open)}"
101
+ >
102
+ <ul>
103
+ ${this.dropdownItems}
104
+ </ul>
105
+ </nav>
106
+ </div>
107
107
  `;
108
108
  }
109
109
  }
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../src/dropdown-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, PropertyValues, TemplateResult } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport icons from './assets/img/icons';\nimport { defaultTopNavConfig } from './data/menus';\nimport formatUrl from './lib/format-url';\nimport { makeBooleanString } from './lib/make-boolean-string';\nimport { IATopNavConfig, IATopNavLink } from './models';\nimport dropdownMenuCSS from './styles/dropdown-menu';\nimport TrackedElement from './tracked-element';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport KeyboardNavigation from './lib/keyboard-navigation';\n\nexport default class DropdownMenu extends TrackedElement {\n @property({ type: String }) baseHost = '';\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n @property({ type: Array }) menuItems: IATopNavLink[] | IATopNavLink[][] = [];\n @property({ type: Boolean }) animated = false;\n @property({ type: Boolean }) open = false;\n\n private previousKeydownListener?: // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (this: HTMLElement, ev: KeyboardEvent) => any;\n\n static get styles() {\n return dropdownMenuCSS;\n }\n\n updated(props: PropertyValues) {\n if (props.has('open') && this.open) {\n const container = this.shadowRoot?.querySelector(\n '.nav-container',\n ) as HTMLElement;\n\n if (container) {\n const keyboardNavigation = new KeyboardNavigation(\n container,\n 'usermenu',\n );\n this.addEventListener('keydown', keyboardNavigation.handleKeyDown);\n if (this.previousKeydownListener) {\n this.removeEventListener('keydown', this.previousKeydownListener);\n }\n this.previousKeydownListener = keyboardNavigation.handleKeyDown;\n }\n }\n }\n\n get dropdownItems() {\n if (!this.menuItems) return nothing;\n\n if (!Array.isArray(this.menuItems[0])) {\n const submenu = this.menuItems as IATopNavLink[];\n return this.dropdownSection(submenu);\n }\n return this.menuItems.map((submenu, i) => {\n const joiner = i ? DropdownMenu.dropdownDivider : html``;\n if (!Array.isArray(submenu)) {\n return;\n }\n return [joiner, ...this.dropdownSection(submenu)];\n });\n }\n\n static get dropdownDivider() {\n return html`<li class=\"divider\"></li>`;\n }\n\n private dropdownSection(submenu: IATopNavLink[]): TemplateResult[] {\n return submenu.map(\n (item) => html`\n <li>\n ${item.url\n ? this.dropdownLink(item)\n : DropdownMenu.dropdownText(item)}\n </li>\n `,\n );\n }\n\n dropdownLink(link: IATopNavLink): TemplateResult {\n const calloutText = this.config?.callouts?.[link.title];\n const isMobileUpload = link.class === 'mobile-upload';\n const isTabbable = this.open && !isMobileUpload;\n\n return html`<a\n href=\"${formatUrl(link.url, this.baseHost)}\"\n class=${ifDefined(link.class)}\n tabindex=\"${isTabbable ? '' : '-1'}\"\n @click=${this.trackClick}\n data-event-click-tracking=\"${this.config\n ?.eventCategory}|Nav${link.analyticsEvent}\"\n aria-label=${calloutText ? `New feature: ${link.title}` : nothing}\n >\n ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}\n ${calloutText\n ? html`<span class=\"callout\" aria-hidden=\"true\">${calloutText}</span>`\n : nothing}\n </a>`;\n }\n\n static dropdownText(item: IATopNavLink) {\n return html`<span class=\"info-item\">${item.title}</span>`;\n }\n\n get menuClass() {\n if (this.open) return 'open';\n if (this.animated) return 'closed';\n return 'initial';\n }\n\n render() {\n return html`\n <div class=\"nav-container\">\n <nav\n class=\"${this.menuClass}\"\n aria-hidden=\"${makeBooleanString(!this.open)}\"\n aria-expanded=\"${makeBooleanString(this.open)}\"\n >\n <ul>\n ${this.dropdownItems}\n </ul>\n </nav>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../src/dropdown-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAEL,IAAI,EACJ,OAAO,GAGR,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,KAAK,MAAM,oBAAoB,CAAC;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,SAAS,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,eAAe,MAAM,wBAAwB,CAAC;AACrD,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,kBAAkB,MAAM,2BAA2B,CAAC;AAE3D,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,cAAc;IAAxD;;QAC8B,aAAQ,GAAG,EAAE,CAAC;QACd,WAAM,GAAmB,mBAAmB,CAAC;QAC9C,cAAS,GAAsC,EAAE,CAAC;QAChD,aAAQ,GAAG,KAAK,CAAC;QACjB,SAAI,GAAG,KAAK,CAAC;IA2G5C,CAAC;IAtGC,MAAM,KAAK,MAAM;QACf,OAAO,eAAe,CAAC;IACzB,CAAC;IAED,OAAO,CAAC,KAAqB;;QAC3B,IAAI,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACnC,MAAM,SAAS,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAC9C,gBAAgB,CACF,CAAC;YAEjB,IAAI,SAAS,EAAE,CAAC;gBACd,MAAM,kBAAkB,GAAG,IAAI,kBAAkB,CAC/C,SAAS,EACT,UAAU,CACX,CAAC;gBACF,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,kBAAkB,CAAC,aAAa,CAAC,CAAC;gBACnE,IAAI,IAAI,CAAC,uBAAuB,EAAE,CAAC;oBACjC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;gBACpE,CAAC;gBACD,IAAI,CAAC,uBAAuB,GAAG,kBAAkB,CAAC,aAAa,CAAC;YAClE,CAAC;QACH,CAAC;IACH,CAAC;IAED,IAAI,aAAa;QACf,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO,OAAO,CAAC;QAEpC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;YACtC,MAAM,OAAO,GAAG,IAAI,CAAC,SAA2B,CAAC;YACjD,OAAO,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QACvC,CAAC;QACD,OAAO,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE;YACvC,MAAM,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,CAAC;YACzD,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;gBAC5B,OAAO;YACT,CAAC;YACD,OAAO,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,CAAC;QACpD,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,KAAK,eAAe;QACxB,OAAO,IAAI,CAAA,2BAA2B,CAAC;IACzC,CAAC;IAEO,eAAe,CAAC,OAAuB;QAC7C,OAAO,OAAO,CAAC,GAAG,CAChB,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;YAER,IAAI,CAAC,GAAG;YACR,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;YACzB,CAAC,CAAC,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC;;OAEtC,CACF,CAAC;IACJ,CAAC;IAED,YAAY,CAAC,IAAkB;;QAC7B,MAAM,WAAW,GAAG,MAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,QAAQ,0CAAG,IAAI,CAAC,KAAK,CAAC,CAAC;QACxD,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,KAAK,eAAe,CAAC;QACtD,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC;QAEhD,OAAO,IAAI,CAAA;cACD,SAAS,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC;cAClC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;kBACjB,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;eACzB,IAAI,CAAC,UAAU;mCACK,MAAA,IAAI,CAAC,MAAM,0CACpC,aAAa,OAAO,IAAI,CAAC,cAAc;mBAC9B,WAAW,CAAC,CAAC,CAAC,gBAAgB,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,OAAO;;QAE/D,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,OAAO,IAAI,IAAI,CAAC,KAAK;QAC7D,WAAW;YACX,CAAC,CAAC,IAAI,CAAA,4CAA4C,WAAW,SAAS;YACtE,CAAC,CAAC,OAAO;SACR,CAAC;IACR,CAAC;IAED,MAAM,CAAC,YAAY,CAAC,IAAkB;QACpC,OAAO,IAAI,CAAA,2BAA2B,IAAI,CAAC,KAAK,SAAS,CAAC;IAC5D,CAAC;IAED,IAAI,SAAS;QACX,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,MAAM,CAAC;QAC7B,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,QAAQ,CAAC;QACnC,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;mBAGI,IAAI,CAAC,SAAS;yBACR,iBAAiB,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;2BAC3B,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC;;;cAGzC,IAAI,CAAC,aAAa;;;;KAI3B,CAAC;IACJ,CAAC;CACF;AA/G6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAA8C;AAC9C;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;+CAAmD;AAChD;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CAAkB;AACjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CAAc","sourcesContent":["import {\r\n CSSResultGroup,\r\n html,\r\n nothing,\r\n PropertyValues,\r\n TemplateResult,\r\n} from 'lit';\r\nimport { property } from 'lit/decorators.js';\r\n\r\nimport icons from './assets/img/icons';\r\nimport { defaultTopNavConfig } from './data/menus';\r\nimport formatUrl from './lib/format-url';\r\nimport { makeBooleanString } from './lib/make-boolean-string';\r\nimport { IATopNavConfig, IATopNavLink } from './models';\r\nimport dropdownMenuCSS from './styles/dropdown-menu';\r\nimport TrackedElement from './tracked-element';\r\nimport { ifDefined } from 'lit/directives/if-defined.js';\r\nimport KeyboardNavigation from './lib/keyboard-navigation';\r\n\r\nexport default class DropdownMenu extends TrackedElement {\r\n @property({ type: String }) baseHost = '';\r\n @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n @property({ type: Array }) menuItems: IATopNavLink[] | IATopNavLink[][] = [];\r\n @property({ type: Boolean }) animated = false;\r\n @property({ type: Boolean }) open = false;\r\n\r\n private previousKeydownListener?: // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (this: HTMLElement, ev: KeyboardEvent) => any;\r\n\r\n static get styles(): CSSResultGroup {\r\n return dropdownMenuCSS;\r\n }\r\n\r\n updated(props: PropertyValues) {\r\n if (props.has('open') && this.open) {\r\n const container = this.shadowRoot?.querySelector(\r\n '.nav-container',\r\n ) as HTMLElement;\r\n\r\n if (container) {\r\n const keyboardNavigation = new KeyboardNavigation(\r\n container,\r\n 'usermenu',\r\n );\r\n this.addEventListener('keydown', keyboardNavigation.handleKeyDown);\r\n if (this.previousKeydownListener) {\r\n this.removeEventListener('keydown', this.previousKeydownListener);\r\n }\r\n this.previousKeydownListener = keyboardNavigation.handleKeyDown;\r\n }\r\n }\r\n }\r\n\r\n get dropdownItems() {\r\n if (!this.menuItems) return nothing;\r\n\r\n if (!Array.isArray(this.menuItems[0])) {\r\n const submenu = this.menuItems as IATopNavLink[];\r\n return this.dropdownSection(submenu);\r\n }\r\n return this.menuItems.map((submenu, i) => {\r\n const joiner = i ? DropdownMenu.dropdownDivider : html``;\r\n if (!Array.isArray(submenu)) {\r\n return;\r\n }\r\n return [joiner, ...this.dropdownSection(submenu)];\r\n });\r\n }\r\n\r\n static get dropdownDivider() {\r\n return html`<li class=\"divider\"></li>`;\r\n }\r\n\r\n private dropdownSection(submenu: IATopNavLink[]): TemplateResult[] {\r\n return submenu.map(\r\n (item) => html`\r\n <li>\r\n ${item.url\r\n ? this.dropdownLink(item)\r\n : DropdownMenu.dropdownText(item)}\r\n </li>\r\n `,\r\n );\r\n }\r\n\r\n dropdownLink(link: IATopNavLink): TemplateResult {\r\n const calloutText = this.config?.callouts?.[link.title];\r\n const isMobileUpload = link.class === 'mobile-upload';\r\n const isTabbable = this.open && !isMobileUpload;\r\n\r\n return html`<a\r\n href=\"${formatUrl(link.url, this.baseHost)}\"\r\n class=${ifDefined(link.class)}\r\n tabindex=\"${isTabbable ? '' : '-1'}\"\r\n @click=${this.trackClick}\r\n data-event-click-tracking=\"${this.config\r\n ?.eventCategory}|Nav${link.analyticsEvent}\"\r\n aria-label=${calloutText ? `New feature: ${link.title}` : nothing}\r\n >\r\n ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}\r\n ${calloutText\r\n ? html`<span class=\"callout\" aria-hidden=\"true\">${calloutText}</span>`\r\n : nothing}\r\n </a>`;\r\n }\r\n\r\n static dropdownText(item: IATopNavLink) {\r\n return html`<span class=\"info-item\">${item.title}</span>`;\r\n }\r\n\r\n get menuClass() {\r\n if (this.open) return 'open';\r\n if (this.animated) return 'closed';\r\n return 'initial';\r\n }\r\n\r\n render() {\r\n return html`\r\n <div class=\"nav-container\">\r\n <nav\r\n class=\"${this.menuClass}\"\r\n aria-hidden=\"${makeBooleanString(!this.open)}\"\r\n aria-expanded=\"${makeBooleanString(this.open)}\"\r\n >\r\n <ul>\r\n ${this.dropdownItems}\r\n </ul>\r\n </nav>\r\n </div>\r\n `;\r\n }\r\n}\r\n"]}
@@ -139,32 +139,32 @@ let IATopNav = class IATopNav extends LitElement {
139
139
  return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';
140
140
  }
141
141
  get userMenu() {
142
- return html `
143
- <user-menu
144
- .baseHost=${this.normalizedBaseHost}
145
- .config=${this.config}
146
- .menuItems=${this.userMenuItems}
147
- ?open=${this.openMenu === 'user'}
148
- .username=${this.username}
149
- tabindex="${this.userMenuTabIndex}"
150
- @menuToggled=${this.menuToggled}
151
- @trackClick=${this.trackClick}
152
- @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
153
- ></user-menu>
142
+ return html `
143
+ <user-menu
144
+ .baseHost=${this.normalizedBaseHost}
145
+ .config=${this.config}
146
+ .menuItems=${this.userMenuItems}
147
+ ?open=${this.openMenu === 'user'}
148
+ .username=${this.username}
149
+ tabindex="${this.userMenuTabIndex}"
150
+ @menuToggled=${this.menuToggled}
151
+ @trackClick=${this.trackClick}
152
+ @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
153
+ ></user-menu>
154
154
  `;
155
155
  }
156
156
  get signedOutDropdown() {
157
- return html `
158
- <signed-out-dropdown
159
- .baseHost=${this.normalizedBaseHost}
160
- .config=${this.config}
161
- .open=${this.signedOutOpened}
162
- tabindex="${this.signedOutTabIndex}"
163
- .menuItems=${this.signedOutMenuItems}
157
+ return html `
158
+ <signed-out-dropdown
159
+ .baseHost=${this.normalizedBaseHost}
160
+ .config=${this.config}
161
+ .open=${this.signedOutOpened}
162
+ tabindex="${this.signedOutTabIndex}"
163
+ .menuItems=${this.signedOutMenuItems}
164
164
  @focusToOtherMenuItem=${(e) => {
165
165
  this.currentTab = e.detail;
166
- }}
167
- ></signed-out-dropdown>
166
+ }}
167
+ ></signed-out-dropdown>
168
168
  `;
169
169
  }
170
170
  get signedOutMenuItems() {
@@ -193,9 +193,9 @@ let IATopNav = class IATopNav extends LitElement {
193
193
  }
194
194
  get secondLogoSlot() {
195
195
  return this.allowSecondaryIcon
196
- ? html `
197
- <slot name="opt-sec-logo" slot="opt-sec-logo"></slot>
198
- <slot name="opt-sec-logo-mobile" slot="opt-sec-logo-mobile"></slot>
196
+ ? html `
197
+ <slot name="opt-sec-logo" slot="opt-sec-logo"></slot>
198
+ <slot name="opt-sec-logo-mobile" slot="opt-sec-logo-mobile"></slot>
199
199
  `
200
200
  : nothing;
201
201
  }
@@ -203,48 +203,48 @@ let IATopNav = class IATopNav extends LitElement {
203
203
  return html `<li class="divider" role="presentation"></li>`;
204
204
  }
205
205
  render() {
206
- return html `
207
- <div class="topnav">
208
- <primary-nav
209
- .baseHost=${this.normalizedBaseHost}
210
- .mediaBaseHost=${this.mediaBaseHost}
211
- .config=${this.config}
212
- .openMenu=${this.openMenu}
213
- .screenName=${this.screenName}
214
- .secondIdentitySlotMode=${this.secondIdentitySlotMode}
215
- .selectedMenuOption=${this.selectedMenuOption}
216
- .username=${this.username}
217
- .userProfileImagePath=${this.userProfileImagePath}
218
- .currentTab=${this.currentTab}
219
- ?hideSearch=${this.hideSearch}
220
- @mediaTypeSelected=${this.mediaTypeSelected}
221
- @trackClick=${this.trackClick}
222
- @trackSubmit=${this.trackSubmit}
223
- @menuToggled=${this.menuToggled}
224
- >
225
- ${this.secondLogoSlot} ${this.searchSlot}
226
- </primary-nav>
227
- <media-slider
228
- .baseHost=${this.normalizedBaseHost}
229
- .config=${this.config}
230
- .selectedMenuOption=${this.selectedMenuOption}
231
- .mediaSliderOpen=${this.mediaSliderOpen}
232
- .menus=${this.menus}
233
- tabindex="${this.mediaSliderOpen ? '1' : '-1'}"
234
- @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
235
- ></media-slider>
236
- </div>
237
- ${this.username ? this.userMenu : this.signedOutDropdown}
238
- <desktop-subnav
239
- .baseHost=${this.normalizedBaseHost}
240
- .menuItems=${this.menus.more.links}
241
- @focus=${this.closeMenus}
242
- ></desktop-subnav>
243
- <div
244
- id="close-layer"
245
- class="${this.closeLayerClass}"
246
- @click=${this.closeMenus}
247
- ></div>
206
+ return html `
207
+ <div class="topnav">
208
+ <primary-nav
209
+ .baseHost=${this.normalizedBaseHost}
210
+ .mediaBaseHost=${this.mediaBaseHost}
211
+ .config=${this.config}
212
+ .openMenu=${this.openMenu}
213
+ .screenName=${this.screenName}
214
+ .secondIdentitySlotMode=${this.secondIdentitySlotMode}
215
+ .selectedMenuOption=${this.selectedMenuOption}
216
+ .username=${this.username}
217
+ .userProfileImagePath=${this.userProfileImagePath}
218
+ .currentTab=${this.currentTab}
219
+ ?hideSearch=${this.hideSearch}
220
+ @mediaTypeSelected=${this.mediaTypeSelected}
221
+ @trackClick=${this.trackClick}
222
+ @trackSubmit=${this.trackSubmit}
223
+ @menuToggled=${this.menuToggled}
224
+ >
225
+ ${this.secondLogoSlot} ${this.searchSlot}
226
+ </primary-nav>
227
+ <media-slider
228
+ .baseHost=${this.normalizedBaseHost}
229
+ .config=${this.config}
230
+ .selectedMenuOption=${this.selectedMenuOption}
231
+ .mediaSliderOpen=${this.mediaSliderOpen}
232
+ .menus=${this.menus}
233
+ tabindex="${this.mediaSliderOpen ? '1' : '-1'}"
234
+ @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
235
+ ></media-slider>
236
+ </div>
237
+ ${this.username ? this.userMenu : this.signedOutDropdown}
238
+ <desktop-subnav
239
+ .baseHost=${this.normalizedBaseHost}
240
+ .menuItems=${this.menus.more.links}
241
+ @focus=${this.closeMenus}
242
+ ></desktop-subnav>
243
+ <div
244
+ id="close-layer"
245
+ class="${this.closeLayerClass}"
246
+ @click=${this.closeMenus}
247
+ ></div>
248
248
  `;
249
249
  }
250
250
  };
@@ -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, query, 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 type { PrimaryNav } from './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 @query('primary-nav') private primaryNav?: PrimaryNav;\n /** Only one of user-menu or signed-out-dropdown is rendered at a time. */\n @query('user-menu, signed-out-dropdown')\n private accountDropdown?: HTMLElement;\n\n @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\n\n private boundHandleKeydown = this.handleDocumentKeydown.bind(this);\n\n private boundHandleClick = this.handleDocumentClick.bind(this);\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 connectedCallback() {\n super.connectedCallback();\n document.addEventListener('keydown', this.boundHandleKeydown);\n document.addEventListener('click', this.boundHandleClick);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('keydown', this.boundHandleKeydown);\n document.removeEventListener('click', this.boundHandleClick);\n }\n\n private handleDocumentKeydown(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n this.openMenu = '';\n this.mediaSliderOpen = false;\n }\n }\n\n private handleDocumentClick(e: MouseEvent) {\n if (!this.openMenu) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this.closeMenus();\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 if (this.openMenu === 'user' || this.openMenu === 'login') {\n if (this.primaryNav && this.accountDropdown) {\n const right = this.primaryNav.getAccountDropdownOffset();\n this.accountDropdown.style.setProperty(\n '--dropdownMenuRight',\n `${right}px`,\n );\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 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 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 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=\"search\" slot=\"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"]}
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, query, 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 IATopNavSecondIdentitySlotMode,\r\n} from './models';\r\nimport './primary-nav';\r\nimport type { PrimaryNav } from './primary-nav';\r\nimport './signed-out-dropdown';\r\nimport iaTopNavCSS from './styles/ia-topnav';\r\nimport './user-menu';\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 }) 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: Object }) currentTab?: {\r\n mediatype: string;\r\n moveTo: string;\r\n };\r\n\r\n @query('primary-nav') private primaryNav?: PrimaryNav;\r\n /** Only one of user-menu or signed-out-dropdown is rendered at a time. */\r\n @query('user-menu, signed-out-dropdown')\r\n private accountDropdown?: HTMLElement;\r\n\r\n @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\r\n\r\n private boundHandleKeydown = this.handleDocumentKeydown.bind(this);\r\n\r\n private boundHandleClick = this.handleDocumentClick.bind(this);\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\r\n connectedCallback() {\r\n super.connectedCallback();\r\n document.addEventListener('keydown', this.boundHandleKeydown);\r\n document.addEventListener('click', this.boundHandleClick);\r\n }\r\n\r\n disconnectedCallback() {\r\n super.disconnectedCallback();\r\n document.removeEventListener('keydown', this.boundHandleKeydown);\r\n document.removeEventListener('click', this.boundHandleClick);\r\n }\r\n\r\n private handleDocumentKeydown(e: KeyboardEvent) {\r\n if (e.key === 'Escape') {\r\n this.openMenu = '';\r\n this.mediaSliderOpen = false;\r\n }\r\n }\r\n\r\n private handleDocumentClick(e: MouseEvent) {\r\n if (!this.openMenu) return;\r\n const path = e.composedPath();\r\n if (!path.includes(this)) {\r\n this.closeMenus();\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 if (this.openMenu === 'user' || this.openMenu === 'login') {\r\n if (this.primaryNav && this.accountDropdown) {\r\n const right = this.primaryNav.getAccountDropdownOffset();\r\n this.accountDropdown.style.setProperty(\r\n '--dropdownMenuRight',\r\n `${right}px`,\r\n );\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 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 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 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 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 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 searchSlot() {\r\n return html`<slot name=\"search\" slot=\"search\"></slot>`;\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 .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 >\r\n ${this.secondLogoSlot} ${this.searchSlot}\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 <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"]}
@@ -54,23 +54,23 @@ let LoginButton = class LoginButton extends TrackedElement {
54
54
  }));
55
55
  }
56
56
  render() {
57
- return html `
58
- <div class="logged-out-toolbar">
59
- <button
60
- class="logged-out-menu ${this.avatarClass}"
61
- @click=${this.toggleDropdown}
62
- data-event-click-tracking="${this.analyticsEvent}"
63
- aria-label="Toggle login menu"
64
- aria-expanded="${makeBooleanString(this.menuOpened)}"
65
- >
66
- ${icons.user}
67
- </button>
68
- <span>
69
- <a href="${this.signupPath}">Sign up</a>
70
- |
71
- <a href="${this.loginPath}">Log in</a>
72
- </span>
73
- </div>
57
+ return html `
58
+ <div class="logged-out-toolbar">
59
+ <button
60
+ class="logged-out-menu ${this.avatarClass}"
61
+ @click=${this.toggleDropdown}
62
+ data-event-click-tracking="${this.analyticsEvent}"
63
+ aria-label="Toggle login menu"
64
+ aria-expanded="${makeBooleanString(this.menuOpened)}"
65
+ >
66
+ ${icons.user}
67
+ </button>
68
+ <span>
69
+ <a href="${this.signupPath}">Sign up</a>
70
+ |
71
+ <a href="${this.loginPath}">Log in</a>
72
+ </span>
73
+ </div>
74
74
  `;
75
75
  }
76
76
  };
@@ -1 +1 @@
1
- {"version":3,"file":"login-button.js","sourceRoot":"","sources":["../../src/login-button.ts"],"names":[],"mappings":"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","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, query, 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 @query('button.logged-out-menu') private toggleButton?: HTMLButtonElement;\n\n @state() private dropdownTabIndex = '';\n\n static get styles() {\n return loginButtonCSS;\n }\n\n /** Distance (px) from this element's right edge to the right edge of the dropdown toggle icon. */\n getDropdownToggleOffset(): number {\n if (!this.toggleButton) return 0;\n return (\n this.getBoundingClientRect().right -\n this.toggleButton.getBoundingClientRect().right\n );\n }\n\n get signupPath() {\n return formatUrl('/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":"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","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, query, 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 @query('button.logged-out-menu') private toggleButton?: HTMLButtonElement;\r\n\r\n @state() private dropdownTabIndex = '';\r\n\r\n static get styles() {\r\n return loginButtonCSS;\r\n }\r\n\r\n /** Distance (px) from this element's right edge to the right edge of the dropdown toggle icon. */\r\n getDropdownToggleOffset(): number {\r\n if (!this.toggleButton) return 0;\r\n return (\r\n this.getBoundingClientRect().right -\r\n this.toggleButton.getBoundingClientRect().right\r\n );\r\n }\r\n\r\n get signupPath() {\r\n return formatUrl('/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"]}