@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.
- package/dist/src/dropdown-menu.d.ts +2 -2
- package/dist/src/dropdown-menu.js +27 -27
- package/dist/src/dropdown-menu.js.map +1 -1
- package/dist/src/ia-topnav.js +66 -66
- package/dist/src/ia-topnav.js.map +1 -1
- package/dist/src/login-button.js +17 -17
- package/dist/src/login-button.js.map +1 -1
- package/dist/src/primary-nav.js +89 -89
- package/dist/src/primary-nav.js.map +1 -1
- package/dist/src/signed-out-dropdown.d.ts +2 -1
- package/dist/src/signed-out-dropdown.js.map +1 -1
- package/dist/src/styles/dropdown-menu.js +169 -169
- package/dist/src/styles/dropdown-menu.js.map +1 -1
- package/dist/src/user-menu.d.ts +2 -1
- package/dist/src/user-menu.js +13 -13
- package/dist/src/user-menu.js.map +1 -1
- package/package.json +1 -1
- package/src/dropdown-menu.ts +132 -126
- package/src/ia-topnav.ts +332 -332
- package/src/login-button.ts +89 -89
- package/src/primary-nav.ts +300 -300
- package/src/signed-out-dropdown.ts +11 -10
- package/src/styles/dropdown-menu.ts +172 -172
- package/src/user-menu.ts +31 -31
|
@@ -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():
|
|
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":";AAAA,OAAO,
|
|
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"]}
|
package/dist/src/ia-topnav.js
CHANGED
|
@@ -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":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1E,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;AACzB,OAAO,gBAAgB,CAAC;AAMxB,OAAO,eAAe,CAAC;AAEvB,OAAO,uBAAuB,CAAC;AAC/B,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,aAAa,CAAC;AAGd,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QACwB,eAAU,GAAG,KAAK,CAAC;QAEpB,yBAAoB,GAAG,EAAE,CAAC;QAE1B,aAAQ,GAAG,qBAAqB,CAAC;QAEjC,kBAAa,GAAG,qBAAqB,CAAC;QAErC,UAAK,GAAG,KAAK,CAAC;QAEd,mBAAc,GAAG,KAAK,CAAC;QAExB,WAAM,GAAmB,mBAAmB,CAAC;QAE5C,eAAU,GAAG,KAAK,CAAC;QAEpB,mBAAc,GAAG,EAAE,CAAC;QAEnB,oBAAe,GAAG,KAAK,CAAC;QAEzB,aAAQ,GAAG,EAAE,CAAC;QAEd,eAAU,GAAW,EAAE,CAAC;QAExB,uBAAkB,GAAG,EAAE,CAAC;QAExB,aAAQ,GAAW,EAAE,CAAC;QAEtB,yBAAoB,GAC9C,4BAA4B,CAAC;QAG/B,2BAAsB,GAAmC,EAAE,CAAC;QAY3C,UAAK,GAAuB,gBAAgB,EAAE,CAAC;QAExD,uBAAkB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAE3D,qBAAgB,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAuQjE,CAAC;IArQC,IAAY,kBAAkB;QAC5B,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/C,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,OAAO,CAAC,KAAqB;QAC3B,IACE,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC;YACrB,KAAK,CAAC,GAAG,CAAC,sBAAsB,CAAC;YACjC,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC;YAC3B,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC;YACvB,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,EACrB,CAAC;YACD,IAAI,CAAC,SAAS,EAAE,CAAC;QACnB,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC9D,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC5D,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QACjE,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC/D,CAAC;IAEO,qBAAqB,CAAC,CAAgB;QAC5C,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YACvB,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;YACnB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;QAC/B,CAAC;IACH,CAAC;IAEO,mBAAmB,CAAC,CAAa;QACvC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC3B,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE,CAAC;QAC9B,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;YACzB,IAAI,CAAC,UAAU,EAAE,CAAC;QACpB,CAAC;IACH,CAAC;IAED,SAAS;QACP,mBAAmB;QACnB,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAC3B,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,kBAAkB,EACvB,IAAI,CAAC,oBAAoB,EACzB,IAAI,CAAC,cAAc,CACpB,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,CAAc;QACxB,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC;QAClC,IAAI,CAAC,QAAQ,GAAG,WAAW,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC;QAC3E,gDAAgD;QAChD,IAAI,IAAI,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;YAC9B,OAAO;QACT,CAAC;QACD,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAExB,IAAI,IAAI,CAAC,QAAQ,KAAK,MAAM,IAAI,IAAI,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;YAC1D,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;gBAC5C,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC,wBAAwB,EAAE,CAAC;gBACzD,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CACpC,qBAAqB,EACrB,GAAG,KAAK,IAAI,CACb,CAAC;YACJ,CAAC;QACH,CAAC;IACH,CAAC;IAED,eAAe;QACb,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAC9B,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;QAC7B,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC;IAC/B,CAAC;IAED,UAAU;QACR,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;QACnB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,UAAU,CAAC,CAAc;QACvB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,gBAAgB,EAAE;YAChC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,CAAC,CAAC,MAAM;SACjB,CAAC,CACH,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,CAAc;QACxB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;YACjC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,CAAC,CAAC,MAAM;SACjB,CAAC,CACH,CAAC;IACJ,CAAC;IAED,iBAAiB,CAAC,CAAc;QAC9B,IAAI,IAAI,CAAC,kBAAkB,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;YACnD,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,kBAAkB,GAAG,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC;QAC7C,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC;IACnC,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,QAAQ,KAAK,MAAM,CAAC;IAClC,CAAC;IAED,IAAI,gBAAgB;QAClB,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IACzC,CAAC;IAED,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IAC1C,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IAClE,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAA;;oBAEK,IAAI,CAAC,kBAAkB;kBACzB,IAAI,CAAC,MAAM;qBACR,IAAI,CAAC,aAAa;gBACvB,IAAI,CAAC,QAAQ,KAAK,MAAM;oBACpB,IAAI,CAAC,QAAQ;oBACb,IAAI,CAAC,gBAAgB;uBAClB,IAAI,CAAC,WAAW;sBACjB,IAAI,CAAC,UAAU;gCACL,CAAC,CAAc,EAAE,EAAE,CACzC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;;KAEjC,CAAC;IACJ,CAAC;IAED,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAA;;oBAEK,IAAI,CAAC,kBAAkB;kBACzB,IAAI,CAAC,MAAM;gBACb,IAAI,CAAC,eAAe;oBAChB,IAAI,CAAC,iBAAiB;qBACrB,IAAI,CAAC,kBAAkB;gCACZ,CAAC,CAAc,EAAE,EAAE;YACzC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;QAC7B,CAAC;;KAEJ,CAAC;IACJ,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IAC9B,CAAC;IAED;;;;OAIG;IACH,IAAI,aAAa;QACf,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;QAEnC,IAAI,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;QACtC,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,UAAU,GAAG,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;QAC5D,CAAC;QAED,OAAO,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK;YACtC,CAAC,CAAC,CAAC,UAAU,EAAE,UAAU,CAAC;YAC1B,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;IACnB,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,sBAAsB,KAAK,OAAO,CAAC;IACjD,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,IAAI,CAAA,2CAA2C,CAAC;IACzD,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,kBAAkB;YAC5B,CAAC,CAAC,IAAI,CAAA;;;SAGH;YACH,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAA,+CAA+C,CAAC;IAC7D,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;sBAGO,IAAI,CAAC,kBAAkB;2BAClB,IAAI,CAAC,aAAa;oBACzB,IAAI,CAAC,MAAM;sBACT,IAAI,CAAC,QAAQ;wBACX,IAAI,CAAC,UAAU;oCACH,IAAI,CAAC,sBAAsB;gCAC/B,IAAI,CAAC,kBAAkB;sBACjC,IAAI,CAAC,QAAQ;kCACD,IAAI,CAAC,oBAAoB;wBACnC,IAAI,CAAC,UAAU;wBACf,IAAI,CAAC,UAAU;+BACR,IAAI,CAAC,iBAAiB;wBAC7B,IAAI,CAAC,UAAU;yBACd,IAAI,CAAC,WAAW;yBAChB,IAAI,CAAC,WAAW;;YAE7B,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,UAAU;;;sBAG5B,IAAI,CAAC,kBAAkB;oBACzB,IAAI,CAAC,MAAM;gCACC,IAAI,CAAC,kBAAkB;6BAC1B,IAAI,CAAC,eAAe;mBAC9B,IAAI,CAAC,KAAK;sBACP,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI;kCACrB,CAAC,CAAc,EAAE,EAAE,CACzC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;;;QAGhC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB;;oBAE1C,IAAI,CAAC,kBAAkB;qBACtB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK;iBACzB,IAAI,CAAC,UAAU;;;;iBAIf,IAAI,CAAC,eAAe;iBACpB,IAAI,CAAC,UAAU;;KAE3B,CAAC;IACJ,CAAC;CACF,CAAA;AAvT8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAoB;AAEpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAA2B;AAE1B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAkC;AAEjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAuC;AAErC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uCAAe;AAEd;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDAAwB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAA8C;AAE5C;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAoB;AAEpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAqB;AAEnB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAyB;AAEzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAe;AAEd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAuB;AAEtB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDACI;AAG/B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDACiC;AAEhC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAGzB;AAE4B;IAA7B,KAAK,CAAC,aAAa,CAAC;4CAAiC;AAG9C;IADP,KAAK,CAAC,gCAAgC,CAAC;iDACF;AAErB;IAAhB,KAAK,EAAE;uCAAwD;AA7CrD,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAwTpB","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"]}
|
package/dist/src/login-button.js
CHANGED
|
@@ -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":";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,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1E,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;QAIzB,qBAAgB,GAAG,EAAE,CAAC;IAsEzC,CAAC;IApEC,MAAM,KAAK,MAAM;QACf,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,kGAAkG;IAClG,uBAAuB;QACrB,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE,OAAO,CAAC,CAAC;QACjC,OAAO,CACL,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK;YAClC,IAAI,CAAC,YAAY,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAChD,CAAC;IACJ,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,SAAS,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC7C,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;AA5E6B;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;AAED;IAAxC,KAAK,CAAC,wBAAwB,CAAC;iDAA0C;AAEzD;IAAhB,KAAK,EAAE;qDAA+B;AAP5B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CA6EvB","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":";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,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1E,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;QAIzB,qBAAgB,GAAG,EAAE,CAAC;IAsEzC,CAAC;IApEC,MAAM,KAAK,MAAM;QACf,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,kGAAkG;IAClG,uBAAuB;QACrB,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE,OAAO,CAAC,CAAC;QACjC,OAAO,CACL,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK;YAClC,IAAI,CAAC,YAAY,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAChD,CAAC;IACJ,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,SAAS,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC7C,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;AA5E6B;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;AAED;IAAxC,KAAK,CAAC,wBAAwB,CAAC;iDAA0C;AAEzD;IAAhB,KAAK,EAAE;qDAA+B;AAP5B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CA6EvB","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"]}
|