@internetarchive/ia-topnav 1.3.10-webdev-7394.0 → 1.3.10-webdev-7394.2

package/demo/app-root.ts

@@ -1,5 +1,5 @@
 import { html, css, LitElement, TemplateResult } from 'lit';
-import { customElement, query } from 'lit/decorators.js';
+import { customElement, query, state } from 'lit/decorators.js';
 import '../src/ia-topnav';
 import type TopNav from '../src/ia-topnav';
 
@@ -8,9 +8,26 @@ export class AppRoot extends LitElement {
   @query('ia-topnav')
   private topnav!: TopNav;
 
+  @state() private admin = false;
+
+  @state() private canManageFlags = false;
+
+  @state() private username = '';
+
+  @state() private screenName = '';
+
+  @state() private itemIdentifier = '';
+
   render() {
     return html`
-      <ia-topnav> </ia-topnav>
+      <ia-topnav
+        ?admin=${this.admin}
+        ?canManageFlags=${this.canManageFlags}
+        .username=${this.username}
+        .screenName=${this.screenName}
+        .itemIdentifier=${this.itemIdentifier}
+      >
+      </ia-topnav>
 
       ${this.devTools}
     `;
@@ -21,51 +38,78 @@ export class AppRoot extends LitElement {
       <div id="dev-tools">
         <h1>Dev Tools</h1>
 
-        <h2>Username</h2>
+        <h2>User menu</h2>
         <fieldset>
-          <button
-            @click=${() => {
-              this.topnav.screenName = 'brewster';
-              this.topnav.username = '@brewster';
-            }}
-          >
-            Switch username to brewster
-          </button>
-
-          <br />
-
-          <button
-            @click=${() => {
-              this.topnav.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';
-              this.topnav.username = '@test';
-            }}
-          >
-            Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
-          </button>
-
-          <br />
-
-          <button
-            @click=${() => {
-              this.topnav.screenName =
-                'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';
-              this.topnav.username = '@test';
-            }}
-          >
-            Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور محمد
-            العجوز
-          </button>
-
-          <br />
-
-          <button
-            @click=${() => {
-              this.topnav.username = '';
-              this.topnav.screenName = '';
-            }}
-          >
-            Switch to logged out
-          </button>
+          <ul>
+            <li>
+              <button
+                @click=${() => {
+      this.screenName = 'brewster';
+      this.username = '@brewster';
+    }}
+              >
+                Switch username to brewster
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+      this.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';
+      this.username = '@test';
+    }}
+              >
+                Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+        this.screenName =
+          'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';
+        this.username = '@test';
+      }}
+              >
+                Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور
+                محمد العجوز
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+      this.username = '';
+      this.screenName = '';
+    }}
+              >
+                Switch to logged out
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+        this.itemIdentifier = this.admin ? '' : 'boop';
+        this.admin = !this.admin;
+      }}
+              >
+                Toggle admin mode (${this.admin ? 'on' : 'off'}) (requires
+                logged in)
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+      this.canManageFlags = !this.canManageFlags;
+    }}
+              >
+                Toggle manage flags mode (${this.canManageFlags ? 'on' : 'off'})
+                (requires admin mode)
+              </button>
+            </li>
+          </ul>
         </fieldset>
 
         <h2>Local Links</h2>
@@ -83,7 +127,7 @@ export class AppRoot extends LitElement {
             }}
           >
             Enable local links
-        </button>
+          </button>
         </fieldset>
 
         <h2>Wayback Count</h2>
@@ -137,50 +181,3 @@ export class AppRoot extends LitElement {
     }
   `;
 }
-
-// <center>
-//   <h1>demo </h1>
-
-//   < button
-// onclick = "document.querySelector('ia-topnav').setAttribute('screenname', 'brewster'); document.querySelector('ia-topnav').setAttribute('username', '@brewster')" >
-//     switch username to brewster
-//   </button>
-//   < br />
-//   <button
-//     onclick="document.querySelector('ia-topnav').setAttribute('screenname', 'a😊b😊c😊d😊e😊f😊g😊h😊i😊'); document.querySelector('ia-topnav').setAttribute('username', '@test')" >
-//     switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
-// </button>
-//   < br />
-//   <button
-//     onclick="document.querySelector('ia-topnav').setAttribute('screenname', 'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز'); document.querySelector('ia-topnav').setAttribute('username', '@test')" >
-//     switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور محمد العجوز
-//   </button>
-//   < br />
-//   <br />
-//   < button onclick = "document.querySelector('ia-topnav').removeAttribute('username')" >
-//     switch to un - logged -in
-//   </button>
-
-//   < hr />
-
-//   <button onclick="document.querySelector('ia-topnav').setAttribute('localLinks', false)" >
-//     switch localLinks false(change to https://archive.org)
-//     </button>
-//     < br />
-//     <button onclick="document.querySelector('ia-topnav').removeAttribute('localLinks')" >
-//     switch to localLinks(default, change links to start with /)
-// </button>
-
-//   < hr />
-//   <button onclick="document.querySelector('ia-topnav').setAttribute('waybackPagesArchived', 'many, MAAAANNNY')" >
-//     change WB pages count
-//       </button>
-
-//       < hr />
-//       <button onclick="document.querySelector('ia-topnav').setAttribute('hideSearch', true)" >
-//         HIDE Top Row Search button, like on mobile
-//           </button>
-//           < button onclick = "document.querySelector('ia-topnav').removeAttribute('hideSearch')" >
-//             SHOW Top Row Search button, like on mobile
-//               </button>
-//               </center>

package/dist/demo/app-root.d.ts

@@ -2,6 +2,11 @@ import { LitElement, TemplateResult } from 'lit';
 import '../src/ia-topnav';
 export declare class AppRoot extends LitElement {
     private topnav;
+    private admin;
+    private canManageFlags;
+    private username;
+    private screenName;
+    private itemIdentifier;
     render(): TemplateResult<1>;
     private get devTools();
     static styles: import("lit").CSSResult;

package/dist/demo/app-root.js

@@ -1,11 +1,26 @@
 import { __decorate } from "tslib";
 import { html, css, LitElement } from 'lit';
-import { customElement, query } from 'lit/decorators.js';
+import { customElement, query, state } from 'lit/decorators.js';
 import '../src/ia-topnav';
 let AppRoot = class AppRoot extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.admin = false;
+        this.canManageFlags = false;
+        this.username = '';
+        this.screenName = '';
+        this.itemIdentifier = '';
+    }
     render() {
         return html `
-      <ia-topnav> </ia-topnav>
+      <ia-topnav
+        ?admin=${this.admin}
+        ?canManageFlags=${this.canManageFlags}
+        .username=${this.username}
+        .screenName=${this.screenName}
+        .itemIdentifier=${this.itemIdentifier}
+      >
+      </ia-topnav>
 
       ${this.devTools}
     `;
@@ -15,51 +30,78 @@ let AppRoot = class AppRoot extends LitElement {
       <div id="dev-tools">
         <h1>Dev Tools</h1>
 
-        <h2>Username</h2>
+        <h2>User menu</h2>
         <fieldset>
-          <button
-            @click=${() => {
-            this.topnav.screenName = 'brewster';
-            this.topnav.username = '@brewster';
+          <ul>
+            <li>
+              <button
+                @click=${() => {
+            this.screenName = 'brewster';
+            this.username = '@brewster';
         }}
-          >
-            Switch username to brewster
-          </button>
-
-          <br />
+              >
+                Switch username to brewster
+              </button>
+            </li>
 
-          <button
-            @click=${() => {
-            this.topnav.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';
-            this.topnav.username = '@test';
+            <li>
+              <button
+                @click=${() => {
+            this.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';
+            this.username = '@test';
         }}
-          >
-            Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
-          </button>
-
-          <br />
+              >
+                Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
+              </button>
+            </li>
 
-          <button
-            @click=${() => {
-            this.topnav.screenName =
+            <li>
+              <button
+                @click=${() => {
+            this.screenName =
                 'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';
-            this.topnav.username = '@test';
+            this.username = '@test';
         }}
-          >
-            Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور محمد
-            العجوز
-          </button>
+              >
+                Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور
+                محمد العجوز
+              </button>
+            </li>
 
-          <br />
+            <li>
+              <button
+                @click=${() => {
+            this.username = '';
+            this.screenName = '';
+        }}
+              >
+                Switch to logged out
+              </button>
+            </li>
 
-          <button
-            @click=${() => {
-            this.topnav.username = '';
-            this.topnav.screenName = '';
+            <li>
+              <button
+                @click=${() => {
+            this.itemIdentifier = this.admin ? '' : 'boop';
+            this.admin = !this.admin;
         }}
-          >
-            Switch to logged out
-          </button>
+              >
+                Toggle admin mode (${this.admin ? 'on' : 'off'}) (requires
+                logged in)
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+            this.canManageFlags = !this.canManageFlags;
+        }}
+              >
+                Toggle manage flags mode (${this.canManageFlags ? 'on' : 'off'})
+                (requires admin mode)
+              </button>
+            </li>
+          </ul>
         </fieldset>
 
         <h2>Local Links</h2>
@@ -77,7 +119,7 @@ let AppRoot = class AppRoot extends LitElement {
         }}
           >
             Enable local links
-        </button>
+          </button>
         </fieldset>
 
         <h2>Wayback Count</h2>
@@ -133,49 +175,23 @@ AppRoot.styles = css `
 __decorate([
     query('ia-topnav')
 ], AppRoot.prototype, "topnav", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "admin", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "canManageFlags", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "username", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "screenName", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "itemIdentifier", void 0);
 AppRoot = __decorate([
     customElement('app-root')
 ], AppRoot);
 export { AppRoot };
-// <center>
-//   <h1>demo </h1>
-//   < button
-// onclick = "document.querySelector('ia-topnav').setAttribute('screenname', 'brewster'); document.querySelector('ia-topnav').setAttribute('username', '@brewster')" >
-//     switch username to brewster
-//   </button>
-//   < br />
-//   <button
-//     onclick="document.querySelector('ia-topnav').setAttribute('screenname', 'a😊b😊c😊d😊e😊f😊g😊h😊i😊'); document.querySelector('ia-topnav').setAttribute('username', '@test')" >
-//     switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
-// </button>
-//   < br />
-//   <button
-//     onclick="document.querySelector('ia-topnav').setAttribute('screenname', 'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز'); document.querySelector('ia-topnav').setAttribute('username', '@test')" >
-//     switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور محمد العجوز
-//   </button>
-//   < br />
-//   <br />
-//   < button onclick = "document.querySelector('ia-topnav').removeAttribute('username')" >
-//     switch to un - logged -in
-//   </button>
-//   < hr />
-//   <button onclick="document.querySelector('ia-topnav').setAttribute('localLinks', false)" >
-//     switch localLinks false(change to https://archive.org)
-//     </button>
-//     < br />
-//     <button onclick="document.querySelector('ia-topnav').removeAttribute('localLinks')" >
-//     switch to localLinks(default, change links to start with /)
-// </button>
-//   < hr />
-//   <button onclick="document.querySelector('ia-topnav').setAttribute('waybackPagesArchived', 'many, MAAAANNNY')" >
-//     change WB pages count
-//       </button>
-//       < hr />
-//       <button onclick="document.querySelector('ia-topnav').setAttribute('hideSearch', true)" >
-//         HIDE Top Row Search button, like on mobile
-//           </button>
-//           < button onclick = "document.querySelector('ia-topnav').removeAttribute('hideSearch')" >
-//             SHOW Top Row Search button, like on mobile
-//               </button>
-//               </center>
 //# sourceMappingURL=app-root.js.map

package/dist/demo/app-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../demo/app-root.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,kBAAkB,CAAC;AAInB,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAIrC,MAAM;QACJ,OAAO,IAAI,CAAA;;;QAGP,IAAI,CAAC,QAAQ;KAChB,CAAC;IACJ,CAAC;IAED,IAAY,QAAQ;QAClB,OAAO,IAAI,CAAA;;;;;;;qBAOM,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,UAAU,CAAC;YACpC,IAAI,CAAC,MAAM,CAAC,QAAQ,GAAG,WAAW,CAAC;QACrC,CAAC;;;;;;;;qBAQQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,6BAA6B,CAAC;YACvD,IAAI,CAAC,MAAM,CAAC,QAAQ,GAAG,OAAO,CAAC;QACjC,CAAC;;;;;;;;qBAQQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU;gBACpB,uDAAuD,CAAC;YAC1D,IAAI,CAAC,MAAM,CAAC,QAAQ,GAAG,OAAO,CAAC;QACjC,CAAC;;;;;;;;;qBASQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,QAAQ,GAAG,EAAE,CAAC;YAC1B,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,EAAE,CAAC;QAC9B,CAAC;;;;;;;;;qBASQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,KAAK,CAAC;QACjC,CAAC;;;;;qBAKQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC;QAChC,CAAC;;;;;;;;;qBASQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,oBAAoB,GAAG,iBAAiB,CAAC;QACvD,CAAC;;;;;;qBAMQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,oBAAoB,GAAG,aAAa,CAAC;QACnD,CAAC;;;;;;;;;qBASQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC;QAChC,CAAC;;;;;qBAKQ,GAAG,EAAE;YACZ,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,KAAK,CAAC;QACjC,CAAC;;;;;;KAMR,CAAC;IACJ,CAAC;;AAEM,cAAM,GAAG,GAAG,CAAA;;;;;;;;;GASlB,AATY,CASX;AAjIM;IADP,KAAK,CAAC,WAAW,CAAC;uCACK;AAFb,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAoInB;;AAED,WAAW;AACX,mBAAmB;AAEnB,aAAa;AACb,sKAAsK;AACtK,kCAAkC;AAClC,cAAc;AACd,YAAY;AACZ,YAAY;AACZ,uLAAuL;AACvL,qDAAqD;AACrD,YAAY;AACZ,YAAY;AACZ,YAAY;AACZ,iNAAiN;AACjN,+EAA+E;AAC/E,cAAc;AACd,YAAY;AACZ,WAAW;AACX,2FAA2F;AAC3F,gCAAgC;AAChC,cAAc;AAEd,YAAY;AAEZ,8FAA8F;AAC9F,6DAA6D;AAC7D,gBAAgB;AAChB,cAAc;AACd,4FAA4F;AAC5F,kEAAkE;AAClE,YAAY;AAEZ,YAAY;AACZ,oHAAoH;AACpH,4BAA4B;AAC5B,kBAAkB;AAElB,gBAAgB;AAChB,iGAAiG;AACjG,qDAAqD;AACrD,sBAAsB;AACtB,qGAAqG;AACrG,yDAAyD;AACzD,0BAA0B;AAC1B,0BAA0B","sourcesContent":["import { html, css, LitElement, TemplateResult } from 'lit';\nimport { customElement, query } from 'lit/decorators.js';\nimport '../src/ia-topnav';\nimport type TopNav from '../src/ia-topnav';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n  @query('ia-topnav')\n  private topnav!: TopNav;\n\n  render() {\n    return html`\n      <ia-topnav> </ia-topnav>\n\n      ${this.devTools}\n    `;\n  }\n\n  private get devTools(): TemplateResult {\n    return html`\n      <div id=\"dev-tools\">\n        <h1>Dev Tools</h1>\n\n        <h2>Username</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.screenName = 'brewster';\n              this.topnav.username = '@brewster';\n            }}\n          >\n            Switch username to brewster\n          </button>\n\n          <br />\n\n          <button\n            @click=${() => {\n              this.topnav.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';\n              this.topnav.username = '@test';\n            }}\n          >\n            Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊\n          </button>\n\n          <br />\n\n          <button\n            @click=${() => {\n              this.topnav.screenName =\n                'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';\n              this.topnav.username = '@test';\n            }}\n          >\n            Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور محمد\n            العجوز\n          </button>\n\n          <br />\n\n          <button\n            @click=${() => {\n              this.topnav.username = '';\n              this.topnav.screenName = '';\n            }}\n          >\n            Switch to logged out\n          </button>\n        </fieldset>\n\n        <h2>Local Links</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.localLinks = false;\n            }}\n          >\n            Disable local links\n          </button>\n          <button\n            @click=${() => {\n              this.topnav.localLinks = true;\n            }}\n          >\n            Enable local links\n        </button>\n        </fieldset>\n\n        <h2>Wayback Count</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.waybackPagesArchived = 'many, MAAAANNNY';\n            }}\n          >\n            Change WB pages count\n          </button>\n\n          <button\n            @click=${() => {\n              this.topnav.waybackPagesArchived = '740 billion';\n            }}\n          >\n            Reset WB pages count\n          </button>\n        </fieldset>\n\n        <h2>Search</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.hideSearch = true;\n            }}\n          >\n            Hide Top Row Search button, like on mobile\n          </button>\n          <button\n            @click=${() => {\n              this.topnav.hideSearch = false;\n            }}\n          >\n            Show Top Row Search button, like on mobile\n          </button>\n        </fieldset>\n      </div>\n    `;\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n      font-family: sans-serif;\n    }\n\n    #dev-tools {\n      margin: 1rem;\n    }\n  `;\n}\n\n// <center>\n//   <h1>demo </h1>\n\n//   < button\n// onclick = \"document.querySelector('ia-topnav').setAttribute('screenname', 'brewster'); document.querySelector('ia-topnav').setAttribute('username', '@brewster')\" >\n//     switch username to brewster\n//   </button>\n//   < br />\n//   <button\n//     onclick=\"document.querySelector('ia-topnav').setAttribute('screenname', 'a😊b😊c😊d😊e😊f😊g😊h😊i😊'); document.querySelector('ia-topnav').setAttribute('username', '@test')\" >\n//     switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊\n// </button>\n//   < br />\n//   <button\n//     onclick=\"document.querySelector('ia-topnav').setAttribute('screenname', 'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز'); document.querySelector('ia-topnav').setAttribute('username', '@test')\" >\n//     switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور محمد العجوز\n//   </button>\n//   < br />\n//   <br />\n//   < button onclick = \"document.querySelector('ia-topnav').removeAttribute('username')\" >\n//     switch to un - logged -in\n//   </button>\n\n//   < hr />\n\n//   <button onclick=\"document.querySelector('ia-topnav').setAttribute('localLinks', false)\" >\n//     switch localLinks false(change to https://archive.org)\n//     </button>\n//     < br />\n//     <button onclick=\"document.querySelector('ia-topnav').removeAttribute('localLinks')\" >\n//     switch to localLinks(default, change links to start with /)\n// </button>\n\n//   < hr />\n//   <button onclick=\"document.querySelector('ia-topnav').setAttribute('waybackPagesArchived', 'many, MAAAANNNY')\" >\n//     change WB pages count\n//       </button>\n\n//       < hr />\n//       <button onclick=\"document.querySelector('ia-topnav').setAttribute('hideSearch', true)\" >\n//         HIDE Top Row Search button, like on mobile\n//           </button>\n//           < button onclick = \"document.querySelector('ia-topnav').removeAttribute('hideSearch')\" >\n//             SHOW Top Row Search button, like on mobile\n//               </button>\n//               </center>\n"]}
+{"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../demo/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement, TemplateResult } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport '../src/ia-topnav';\nimport type TopNav from '../src/ia-topnav';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n  @query('ia-topnav')\n  private topnav!: TopNav;\n\n  @state() private admin = false;\n\n  @state() private canManageFlags = false;\n\n  @state() private username = '';\n\n  @state() private screenName = '';\n\n  @state() private itemIdentifier = '';\n\n  render() {\n    return html`\n      <ia-topnav\n        ?admin=${this.admin}\n        ?canManageFlags=${this.canManageFlags}\n        .username=${this.username}\n        .screenName=${this.screenName}\n        .itemIdentifier=${this.itemIdentifier}\n      >\n      </ia-topnav>\n\n      ${this.devTools}\n    `;\n  }\n\n  private get devTools(): TemplateResult {\n    return html`\n      <div id=\"dev-tools\">\n        <h1>Dev Tools</h1>\n\n        <h2>User menu</h2>\n        <fieldset>\n          <ul>\n            <li>\n              <button\n                @click=${() => {\n      this.screenName = 'brewster';\n      this.username = '@brewster';\n    }}\n              >\n                Switch username to brewster\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n      this.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';\n      this.username = '@test';\n    }}\n              >\n                Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n        this.screenName =\n          'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';\n        this.username = '@test';\n      }}\n              >\n                Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور\n                محمد العجوز\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n      this.username = '';\n      this.screenName = '';\n    }}\n              >\n                Switch to logged out\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n        this.itemIdentifier = this.admin ? '' : 'boop';\n        this.admin = !this.admin;\n      }}\n              >\n                Toggle admin mode (${this.admin ? 'on' : 'off'}) (requires\n                logged in)\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n      this.canManageFlags = !this.canManageFlags;\n    }}\n              >\n                Toggle manage flags mode (${this.canManageFlags ? 'on' : 'off'})\n                (requires admin mode)\n              </button>\n            </li>\n          </ul>\n        </fieldset>\n\n        <h2>Local Links</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.localLinks = false;\n            }}\n          >\n            Disable local links\n          </button>\n          <button\n            @click=${() => {\n              this.topnav.localLinks = true;\n            }}\n          >\n            Enable local links\n          </button>\n        </fieldset>\n\n        <h2>Wayback Count</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.waybackPagesArchived = 'many, MAAAANNNY';\n            }}\n          >\n            Change WB pages count\n          </button>\n\n          <button\n            @click=${() => {\n              this.topnav.waybackPagesArchived = '740 billion';\n            }}\n          >\n            Reset WB pages count\n          </button>\n        </fieldset>\n\n        <h2>Search</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.hideSearch = true;\n            }}\n          >\n            Hide Top Row Search button, like on mobile\n          </button>\n          <button\n            @click=${() => {\n              this.topnav.hideSearch = false;\n            }}\n          >\n            Show Top Row Search button, like on mobile\n          </button>\n        </fieldset>\n      </div>\n    `;\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n      font-family: sans-serif;\n    }\n\n    #dev-tools {\n      margin: 1rem;\n    }\n  `;\n}\n"]}

package/dist/src/data/menus.js

@@ -147,44 +147,52 @@ export function buildTopNavMenus(userid = '___USERID___', baseHost = 'https://ar
             browserExtensionsLinks: [],
             archiveItLinks: [],
         },
-        more: [
-            {
-                title: 'About',
-                url: `${baseHost}/about/`,
-            },
-            {
-                title: 'Blog',
-                url: 'https://blog.archive.org',
-            },
-            {
-                title: 'Projects',
-                url: `${baseHost}/projects/`,
-            },
-            {
-                title: 'Help',
-                url: `${baseHost}/about/faqs.php`,
-            },
-            {
-                title: 'Donate',
-                url: `${baseHost}/donate?origin=iawww-TopNavDonateButton`,
-            },
-            {
-                title: 'Contact',
-                url: `${baseHost}/about/contact`,
-            },
-            {
-                title: 'Jobs',
-                url: `${baseHost}/about/jobs`,
-            },
-            {
-                title: 'Volunteer',
-                url: `${baseHost}/about/volunteer-positions`,
-            },
-            {
-                title: 'People',
-                url: `${baseHost}/about/bios`,
-            },
-        ],
+        more: {
+            links: [
+                {
+                    title: 'About',
+                    url: `${baseHost}/about/`,
+                },
+                {
+                    title: 'Blog',
+                    url: 'https://blog.archive.org',
+                },
+                {
+                    title: 'Projects',
+                    url: `${baseHost}/projects/`,
+                },
+                {
+                    title: 'Help',
+                    url: `${baseHost}/about/faqs.php`,
+                },
+                {
+                    title: 'Donate',
+                    url: `${baseHost}/donate?origin=iawww-TopNavDonateButton`,
+                },
+                {
+                    title: 'Contact',
+                    url: `${baseHost}/about/contact`,
+                },
+                {
+                    title: 'Jobs',
+                    url: `${baseHost}/about/jobs`,
+                },
+                {
+                    title: 'Volunteer',
+                    url: `${baseHost}/about/volunteer-positions`,
+                },
+                {
+                    title: 'People',
+                    url: `${baseHost}/about/bios`,
+                },
+            ],
+            heading: '',
+            iconLinks: [],
+            featuredLinks: [],
+            mobileAppsLinks: [],
+            browserExtensionsLinks: [],
+            archiveItLinks: []
+        },
         software: {
             heading: 'Software',
             iconLinks: [