@internetarchive/ia-topnav 2.0.1 → 2.0.2-alpha2

package/dist/src/styles/dropdown-menu.js

@@ -1,172 +1,172 @@
 import { css } from 'lit';
-export default css `
-  .nav-container {
-    position: relative;
-  }
-
-  nav {
-    position: absolute;
-    right: 0;
-    z-index: 4;
-    overflow: hidden;
-    font-size: 1.6rem;
-    background-color: var(--dropdownMenuBg);
-    transition-property: top;
-    transition-duration: 0.2s;
-    transition-timing-function: ease;
-  }
-
-  .initial,
-  .closed {
-    top: var(--topOffset, -1500px);
-  }
-
-  .closed {
-    transition-duration: 0.5s;
-  }
-
-  .open {
-    max-width: 100vw;
-    overflow: auto;
-  }
-
-  h3 {
-    padding: 0.6rem 2rem;
-    margin: 0;
-    font-size: inherit;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
-  ul {
-    padding: 0.4rem 0 0.7rem 0;
-    margin: 0;
-    list-style: none;
-    /* viewport height - nav height + bottom nav border */
-    max-height: calc(100vh - 7.2rem + 1px);
-    overflow: auto;
-    box-sizing: border-box;
-  }
-
-  .divider {
-    margin: 0.5rem 0;
-    border-bottom: 1px solid var(--dropdownMenuDivider);
-  }
-
-  a,
-  .info-item {
-    display: block;
-    color: var(--primaryTextColor);
-    text-decoration: none;
-    padding: 1rem 2rem;
-  }
-
-  .info-item {
-    font-size: 0.8em;
-    color: var(--dropdownMenuInfoItem);
-  }
-
-  .callout {
-    position: absolute;
-    margin-left: 10px;
-    padding: 0 5px;
-    border-radius: 2px;
-    background: #fee257;
-    color: #2c2c2c;
-    font-size: 1.4rem;
-    font-weight: bold;
-  }
-
-  a.mobile-upload {
-    display: flex;
-    justify-content: left;
-    align-items: center;
-  }
-  a.mobile-upload svg {
-    fill: var(--white);
-    margin-right: 1rem;
-    height: 1.4rem;
-    width: 1.4rem;
-  }
-
-  @media (min-width: 890px) {
-    nav {
-      display: flex;
-      overflow: visible;
-      top: 0;
-      left: auto;
-      right: var(--dropdownMenuRight, 0);
-      z-index: 5;
-      transition: opacity 0.2s ease-in-out;
-      font-size: 1.4rem;
-      border-radius: 2px;
-      background: var(--primaryTextColor);
-      box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.15);
-    }
-
-    nav:after {
-      position: absolute;
-      right: 7px;
-      top: -7px;
-      width: 12px;
-      height: 7px;
-      box-sizing: border-box;
-      color: var(--white);
-      content: '';
-      border-bottom: 7px solid currentColor;
-      border-left: 6px solid transparent;
-      border-right: 6px solid transparent;
-    }
-
-    h3 {
-      display: none;
-    }
-
-    ul {
-      /* viewport height - nav height + bottom nav border */
-      max-height: calc(100vh - 8.5rem + 1px);
-    }
-
-    .divider {
-      border-bottom-color: var(--dropdownMenuDivider);
-    }
-
-    a {
-      padding: 0.5rem 2rem;
-      color: var(--inverseTextColor);
-      transition:
-        background 0.1s ease-out,
-        color 0.1s ease-out;
-    }
-
-    .info-item {
-      padding: 0.5rem 2rem;
-      font-size: 0.8em;
-      color: var(--inverseDropdownMenuInfoItem);
-    }
-
-    a:hover,
-    a:active,
-    a:focus {
-      color: var(--linkHoverColor);
-      background: var(--linkColor);
-      outline: none;
-    }
-
-    .initial,
-    .closed {
-      opacity: 0;
-      transition-duration: 0.2s;
-    }
-
-    .open {
-      opacity: 1;
-      overflow: visible;
-    }
-
-    a.mobile-upload {
-      display: none;
-    }
-  }
+export default css `
+  .nav-container {
+    position: relative;
+  }
+
+  nav {
+    position: absolute;
+    right: 0;
+    z-index: 4;
+    overflow: hidden;
+    font-size: 1.6rem;
+    background-color: var(--dropdownMenuBg);
+    transition-property: top;
+    transition-duration: 0.2s;
+    transition-timing-function: ease;
+  }
+
+  .initial,
+  .closed {
+    top: var(--topOffset, -1500px);
+  }
+
+  .closed {
+    transition-duration: 0.5s;
+  }
+
+  .open {
+    max-width: 100vw;
+    overflow: auto;
+  }
+
+  h3 {
+    padding: 0.6rem 2rem;
+    margin: 0;
+    font-size: inherit;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  ul {
+    padding: 0.4rem 0 0.7rem 0;
+    margin: 0;
+    list-style: none;
+    /* viewport height - nav height + bottom nav border */
+    max-height: calc(100vh - 7.2rem + 1px);
+    overflow: auto;
+    box-sizing: border-box;
+  }
+
+  .divider {
+    margin: 0.5rem 0;
+    border-bottom: 1px solid var(--dropdownMenuDivider);
+  }
+
+  a,
+  .info-item {
+    display: block;
+    color: var(--primaryTextColor);
+    text-decoration: none;
+    padding: 1rem 2rem;
+  }
+
+  .info-item {
+    font-size: 0.8em;
+    color: var(--dropdownMenuInfoItem);
+  }
+
+  .callout {
+    position: absolute;
+    margin-left: 10px;
+    padding: 0 5px;
+    border-radius: 2px;
+    background: #fee257;
+    color: #2c2c2c;
+    font-size: 1.4rem;
+    font-weight: bold;
+  }
+
+  a.mobile-upload {
+    display: flex;
+    justify-content: left;
+    align-items: center;
+  }
+  a.mobile-upload svg {
+    fill: var(--white);
+    margin-right: 1rem;
+    height: 1.4rem;
+    width: 1.4rem;
+  }
+
+  @media (min-width: 890px) {
+    nav {
+      display: flex;
+      overflow: visible;
+      top: 0;
+      left: auto;
+      right: var(--dropdownMenuRight, 0);
+      z-index: 5;
+      transition: opacity 0.2s ease-in-out;
+      font-size: 1.4rem;
+      border-radius: 2px;
+      background: var(--primaryTextColor);
+      box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.15);
+    }
+
+    nav:after {
+      position: absolute;
+      right: 7px;
+      top: -7px;
+      width: 12px;
+      height: 7px;
+      box-sizing: border-box;
+      color: var(--white);
+      content: '';
+      border-bottom: 7px solid currentColor;
+      border-left: 6px solid transparent;
+      border-right: 6px solid transparent;
+    }
+
+    h3 {
+      display: none;
+    }
+
+    ul {
+      /* viewport height - nav height + bottom nav border */
+      max-height: calc(100vh - 8.5rem + 1px);
+    }
+
+    .divider {
+      border-bottom-color: var(--dropdownMenuDivider);
+    }
+
+    a {
+      padding: 0.5rem 2rem;
+      color: var(--inverseTextColor);
+      transition:
+        background 0.1s ease-out,
+        color 0.1s ease-out;
+    }
+
+    .info-item {
+      padding: 0.5rem 2rem;
+      font-size: 0.8em;
+      color: var(--inverseDropdownMenuInfoItem);
+    }
+
+    a:hover,
+    a:active,
+    a:focus {
+      color: var(--linkHoverColor);
+      background: var(--linkColor);
+      outline: none;
+    }
+
+    .initial,
+    .closed {
+      opacity: 0;
+      transition-duration: 0.2s;
+    }
+
+    .open {
+      opacity: 1;
+      overflow: visible;
+    }
+
+    a.mobile-upload {
+      display: none;
+    }
+  }
 `;
 //# sourceMappingURL=dropdown-menu.js.map

package/dist/src/styles/dropdown-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../../src/styles/dropdown-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyKjB,CAAC","sourcesContent":["import { css } from 'lit';\r\n\r\nexport default css`\r\n  .nav-container {\r\n    position: relative;\r\n  }\r\n\r\n  nav {\r\n    position: absolute;\r\n    right: 0;\r\n    z-index: 4;\r\n    overflow: hidden;\r\n    font-size: 1.6rem;\r\n    background-color: var(--dropdownMenuBg);\r\n    transition-property: top;\r\n    transition-duration: 0.2s;\r\n    transition-timing-function: ease;\r\n  }\r\n\r\n  .initial,\r\n  .closed {\r\n    top: var(--topOffset, -1500px);\r\n  }\r\n\r\n  .closed {\r\n    transition-duration: 0.5s;\r\n  }\r\n\r\n  .open {\r\n    max-width: 100vw;\r\n    overflow: auto;\r\n  }\r\n\r\n  h3 {\r\n    padding: 0.6rem 2rem;\r\n    margin: 0;\r\n    font-size: inherit;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n  }\r\n\r\n  ul {\r\n    padding: 0.4rem 0 0.7rem 0;\r\n    margin: 0;\r\n    list-style: none;\r\n    /* viewport height - nav height + bottom nav border */\r\n    max-height: calc(100vh - 7.2rem + 1px);\r\n    overflow: auto;\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .divider {\r\n    margin: 0.5rem 0;\r\n    border-bottom: 1px solid var(--dropdownMenuDivider);\r\n  }\r\n\r\n  a,\r\n  .info-item {\r\n    display: block;\r\n    color: var(--primaryTextColor);\r\n    text-decoration: none;\r\n    padding: 1rem 2rem;\r\n  }\r\n\r\n  .info-item {\r\n    font-size: 0.8em;\r\n    color: var(--dropdownMenuInfoItem);\r\n  }\r\n\r\n  .callout {\r\n    position: absolute;\r\n    margin-left: 10px;\r\n    padding: 0 5px;\r\n    border-radius: 2px;\r\n    background: #fee257;\r\n    color: #2c2c2c;\r\n    font-size: 1.4rem;\r\n    font-weight: bold;\r\n  }\r\n\r\n  a.mobile-upload {\r\n    display: flex;\r\n    justify-content: left;\r\n    align-items: center;\r\n  }\r\n  a.mobile-upload svg {\r\n    fill: var(--white);\r\n    margin-right: 1rem;\r\n    height: 1.4rem;\r\n    width: 1.4rem;\r\n  }\r\n\r\n  @media (min-width: 890px) {\r\n    nav {\r\n      display: flex;\r\n      overflow: visible;\r\n      top: 0;\r\n      left: auto;\r\n      right: var(--dropdownMenuRight, 0);\r\n      z-index: 5;\r\n      transition: opacity 0.2s ease-in-out;\r\n      font-size: 1.4rem;\r\n      border-radius: 2px;\r\n      background: var(--primaryTextColor);\r\n      box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.15);\r\n    }\r\n\r\n    nav:after {\r\n      position: absolute;\r\n      right: 7px;\r\n      top: -7px;\r\n      width: 12px;\r\n      height: 7px;\r\n      box-sizing: border-box;\r\n      color: var(--white);\r\n      content: '';\r\n      border-bottom: 7px solid currentColor;\r\n      border-left: 6px solid transparent;\r\n      border-right: 6px solid transparent;\r\n    }\r\n\r\n    h3 {\r\n      display: none;\r\n    }\r\n\r\n    ul {\r\n      /* viewport height - nav height + bottom nav border */\r\n      max-height: calc(100vh - 8.5rem + 1px);\r\n    }\r\n\r\n    .divider {\r\n      border-bottom-color: var(--dropdownMenuDivider);\r\n    }\r\n\r\n    a {\r\n      padding: 0.5rem 2rem;\r\n      color: var(--inverseTextColor);\r\n      transition:\r\n        background 0.1s ease-out,\r\n        color 0.1s ease-out;\r\n    }\r\n\r\n    .info-item {\r\n      padding: 0.5rem 2rem;\r\n      font-size: 0.8em;\r\n      color: var(--inverseDropdownMenuInfoItem);\r\n    }\r\n\r\n    a:hover,\r\n    a:active,\r\n    a:focus {\r\n      color: var(--linkHoverColor);\r\n      background: var(--linkColor);\r\n      outline: none;\r\n    }\r\n\r\n    .initial,\r\n    .closed {\r\n      opacity: 0;\r\n      transition-duration: 0.2s;\r\n    }\r\n\r\n    .open {\r\n      opacity: 1;\r\n      overflow: visible;\r\n    }\r\n\r\n    a.mobile-upload {\r\n      display: none;\r\n    }\r\n  }\r\n`;\r\n"]}
+{"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../../src/styles/dropdown-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyKjB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport default css`\n  .nav-container {\n    position: relative;\n  }\n\n  nav {\n    position: absolute;\n    right: 0;\n    z-index: 4;\n    overflow: hidden;\n    font-size: 1.6rem;\n    background-color: var(--dropdownMenuBg);\n    transition-property: top;\n    transition-duration: 0.2s;\n    transition-timing-function: ease;\n  }\n\n  .initial,\n  .closed {\n    top: var(--topOffset, -1500px);\n  }\n\n  .closed {\n    transition-duration: 0.5s;\n  }\n\n  .open {\n    max-width: 100vw;\n    overflow: auto;\n  }\n\n  h3 {\n    padding: 0.6rem 2rem;\n    margin: 0;\n    font-size: inherit;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  ul {\n    padding: 0.4rem 0 0.7rem 0;\n    margin: 0;\n    list-style: none;\n    /* viewport height - nav height + bottom nav border */\n    max-height: calc(100vh - 7.2rem + 1px);\n    overflow: auto;\n    box-sizing: border-box;\n  }\n\n  .divider {\n    margin: 0.5rem 0;\n    border-bottom: 1px solid var(--dropdownMenuDivider);\n  }\n\n  a,\n  .info-item {\n    display: block;\n    color: var(--primaryTextColor);\n    text-decoration: none;\n    padding: 1rem 2rem;\n  }\n\n  .info-item {\n    font-size: 0.8em;\n    color: var(--dropdownMenuInfoItem);\n  }\n\n  .callout {\n    position: absolute;\n    margin-left: 10px;\n    padding: 0 5px;\n    border-radius: 2px;\n    background: #fee257;\n    color: #2c2c2c;\n    font-size: 1.4rem;\n    font-weight: bold;\n  }\n\n  a.mobile-upload {\n    display: flex;\n    justify-content: left;\n    align-items: center;\n  }\n  a.mobile-upload svg {\n    fill: var(--white);\n    margin-right: 1rem;\n    height: 1.4rem;\n    width: 1.4rem;\n  }\n\n  @media (min-width: 890px) {\n    nav {\n      display: flex;\n      overflow: visible;\n      top: 0;\n      left: auto;\n      right: var(--dropdownMenuRight, 0);\n      z-index: 5;\n      transition: opacity 0.2s ease-in-out;\n      font-size: 1.4rem;\n      border-radius: 2px;\n      background: var(--primaryTextColor);\n      box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.15);\n    }\n\n    nav:after {\n      position: absolute;\n      right: 7px;\n      top: -7px;\n      width: 12px;\n      height: 7px;\n      box-sizing: border-box;\n      color: var(--white);\n      content: '';\n      border-bottom: 7px solid currentColor;\n      border-left: 6px solid transparent;\n      border-right: 6px solid transparent;\n    }\n\n    h3 {\n      display: none;\n    }\n\n    ul {\n      /* viewport height - nav height + bottom nav border */\n      max-height: calc(100vh - 8.5rem + 1px);\n    }\n\n    .divider {\n      border-bottom-color: var(--dropdownMenuDivider);\n    }\n\n    a {\n      padding: 0.5rem 2rem;\n      color: var(--inverseTextColor);\n      transition:\n        background 0.1s ease-out,\n        color 0.1s ease-out;\n    }\n\n    .info-item {\n      padding: 0.5rem 2rem;\n      font-size: 0.8em;\n      color: var(--inverseDropdownMenuInfoItem);\n    }\n\n    a:hover,\n    a:active,\n    a:focus {\n      color: var(--linkHoverColor);\n      background: var(--linkColor);\n      outline: none;\n    }\n\n    .initial,\n    .closed {\n      opacity: 0;\n      transition-duration: 0.2s;\n    }\n\n    .open {\n      opacity: 1;\n      overflow: visible;\n    }\n\n    a.mobile-upload {\n      display: none;\n    }\n  }\n`;\n"]}

package/dist/src/user-menu.js

@@ -13,19 +13,19 @@ let UserMenu = class UserMenu extends DropdownMenu {
         return dropdownStyles;
     }
     render() {
-        return html `
-      <div class="nav-container">
-        <nav
-          class="${this.menuClass}"
-          aria-hidden=${!this.open}
-          aria-expanded=${this.open}
-        >
-          <h3>${this.screenName}</h3>
-          <ul>
-            ${this.dropdownItems}
-          </ul>
-        </nav>
-      </div>
+        return html `
+      <div class="nav-container">
+        <nav
+          class="${this.menuClass}"
+          aria-hidden=${!this.open}
+          aria-expanded=${this.open}
+        >
+          <h3>${this.screenName}</h3>
+          <ul>
+            ${this.dropdownItems}
+          </ul>
+        </nav>
+      </div>
     `;
     }
 };

package/dist/src/user-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"user-menu.js","sourceRoot":"","sources":["../../src/user-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAkB,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,cAAc,MAAM,wBAAwB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG7C,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,YAAY;IAAnC;;QACe,aAAQ,GAAG,EAAE,CAAC;QACd,eAAU,GAAG,EAAE,CAAC;IAsB9C,CAAC;IApBC,MAAM,KAAK,MAAM;QACf,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;mBAGI,IAAI,CAAC,SAAS;wBACT,CAAC,IAAI,CAAC,IAAI;0BACR,IAAI,CAAC,IAAI;;gBAEnB,IAAI,CAAC,UAAU;;cAEjB,IAAI,CAAC,aAAa;;;;KAI3B,CAAC;IACJ,CAAC;CACF,CAAA;AAvB6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAiB;AAFzB,QAAQ;IAD5B,aAAa,CAAC,WAAW,CAAC;GACN,QAAQ,CAwB5B;eAxBoB,QAAQ","sourcesContent":["import { CSSResultGroup, html } from 'lit';\r\nimport DropdownMenu from './dropdown-menu';\r\nimport dropdownStyles from './styles/dropdown-menu';\r\nimport { customElement, property } from 'lit/decorators.js';\r\n\r\n@customElement('user-menu')\r\nexport default class UserMenu extends DropdownMenu {\r\n  @property({ type: String }) username = '';\r\n  @property({ type: String }) screenName = '';\r\n\r\n  static get styles(): CSSResultGroup {\r\n    return dropdownStyles;\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=${!this.open}\r\n          aria-expanded=${this.open}\r\n        >\r\n          <h3>${this.screenName}</h3>\r\n          <ul>\r\n            ${this.dropdownItems}\r\n          </ul>\r\n        </nav>\r\n      </div>\r\n    `;\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"user-menu.js","sourceRoot":"","sources":["../../src/user-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAkB,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,cAAc,MAAM,wBAAwB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG7C,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,YAAY;IAAnC;;QACe,aAAQ,GAAG,EAAE,CAAC;QACd,eAAU,GAAG,EAAE,CAAC;IAsB9C,CAAC;IApBC,MAAM,KAAK,MAAM;QACf,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;mBAGI,IAAI,CAAC,SAAS;wBACT,CAAC,IAAI,CAAC,IAAI;0BACR,IAAI,CAAC,IAAI;;gBAEnB,IAAI,CAAC,UAAU;;cAEjB,IAAI,CAAC,aAAa;;;;KAI3B,CAAC;IACJ,CAAC;CACF,CAAA;AAvB6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAiB;AAFzB,QAAQ;IAD5B,aAAa,CAAC,WAAW,CAAC;GACN,QAAQ,CAwB5B;eAxBoB,QAAQ","sourcesContent":["import { CSSResultGroup, html } from 'lit';\nimport DropdownMenu from './dropdown-menu';\nimport dropdownStyles from './styles/dropdown-menu';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('user-menu')\nexport default class UserMenu extends DropdownMenu {\n  @property({ type: String }) username = '';\n  @property({ type: String }) screenName = '';\n\n  static get styles(): CSSResultGroup {\n    return dropdownStyles;\n  }\n\n  render() {\n    return html`\n      <div class=\"nav-container\">\n        <nav\n          class=\"${this.menuClass}\"\n          aria-hidden=${!this.open}\n          aria-expanded=${this.open}\n        >\n          <h3>${this.screenName}</h3>\n          <ul>\n            ${this.dropdownItems}\n          </ul>\n        </nav>\n      </div>\n    `;\n  }\n}\n"]}

package/eslint.config.mjs

@@ -1,53 +1,53 @@
-import typescriptEslint from '@typescript-eslint/eslint-plugin';
-import html from 'eslint-plugin-html';
-import tsParser from '@typescript-eslint/parser';
-import path from 'node:path';
-import { fileURLToPath } from 'node:url';
-import js from '@eslint/js';
-import { FlatCompat } from '@eslint/eslintrc';
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const compat = new FlatCompat({
-  baseDirectory: __dirname,
-  recommendedConfig: js.configs.recommended,
-  allConfig: js.configs.all,
-});
-
-export default [
-  ...compat.extends('plugin:@typescript-eslint/recommended'),
-  {
-    plugins: {
-      '@typescript-eslint': typescriptEslint,
-      html,
-    },
-
-    languageOptions: {
-      parser: tsParser,
-    },
-
-    settings: {
-      'import/resolver': {
-        node: {
-          extensions: ['.ts', '.tsx'],
-          moduleDirectory: ['node_modules', 'src', 'demo'],
-        },
-      },
-    },
-
-    rules: {
-      '@typescript-eslint/no-unsafe-function-type': 'warn',
-      '@typescript-eslint/no-unused-vars': 'warn',
-      '@typescript-eslint/no-explicit-any': 'warn',
-    },
-  },
-  {
-    ignores: ['**/*.js', '**/*.mjs'],
-  },
-  {
-    files: ['**/*.test.ts'],
-    rules: {
-      '@typescript-eslint/no-unused-expressions': 'off',
-    },
-  },
-];
+import typescriptEslint from '@typescript-eslint/eslint-plugin';
+import html from 'eslint-plugin-html';
+import tsParser from '@typescript-eslint/parser';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import js from '@eslint/js';
+import { FlatCompat } from '@eslint/eslintrc';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+});
+
+export default [
+  ...compat.extends('plugin:@typescript-eslint/recommended'),
+  {
+    plugins: {
+      '@typescript-eslint': typescriptEslint,
+      html,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+    },
+
+    settings: {
+      'import/resolver': {
+        node: {
+          extensions: ['.ts', '.tsx'],
+          moduleDirectory: ['node_modules', 'src', 'demo'],
+        },
+      },
+    },
+
+    rules: {
+      '@typescript-eslint/no-unsafe-function-type': 'warn',
+      '@typescript-eslint/no-unused-vars': 'warn',
+      '@typescript-eslint/no-explicit-any': 'warn',
+    },
+  },
+  {
+    ignores: ['**/*.js', '**/*.mjs'],
+  },
+  {
+    files: ['**/*.test.ts'],
+    rules: {
+      '@typescript-eslint/no-unused-expressions': 'off',
+    },
+  },
+];

package/package.json

@@ -1,72 +1,72 @@
-{
-  "name": "@internetarchive/ia-topnav",
-  "version": "2.0.1",
-  "description": "Top nav for Internet Archive",
-  "license": "AGPL-3.0-only",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "type": "module",
-  "publishConfig": {
-    "access": "public"
-  },
-  "scripts": {
-    "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
-    "prepare": "rimraf dist && tsc && husky install",
-    "build": "tsc",
-    "lint": "eslint . && prettier \"**/*.ts\" --check",
-    "format": "eslint . --fix && prettier \"**/*.ts\" --write",
-    "circular": "madge --circular --extensions ts .",
-    "test": "tsc && npm run lint && npm run circular && wtr --coverage",
-    "test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\"",
-    "ghpages:build": "rimraf ghpages && npm run prepare && vite build",
-    "ghpages:publish": "npm run ghpages:prepare -e $(git branch --show-current)",
-    "ghpages:prepare": "npm run ghpages:build && touch ghpages/.nojekyll && npm run ghpages:generate",
-    "ghpages:generate": "gh-pages -t -d ghpages -m \"Build for $(git log --pretty=format:\"%h %an %ai %s\" -n1) [skip ci]\""
-  },
-  "dependencies": {
-    "@internetarchive/ia-styles": "^1.0.0",
-    "@internetarchive/ia-wayback-search": "^1.0.4",
-    "lit": "^2.8.0"
-  },
-  "devDependencies": {
-    "@open-wc/eslint-config": "^12.0.3",
-    "@open-wc/testing": "^4.0.0",
-    "@types/mocha": "^10.0.10",
-    "@typescript-eslint/eslint-plugin": "^8.19.1",
-    "@typescript-eslint/parser": "^8.19.1",
-    "@web/dev-server": "^0.4.6",
-    "@web/test-runner": "^0.20.0",
-    "concurrently": "^9.1.2",
-    "eslint": "^9.24.0",
-    "eslint-config-prettier": "^10.1.1",
-    "eslint-plugin-html": "^8.1.2",
-    "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-lit": "^2.0.0",
-    "eslint-plugin-lit-a11y": "^4.1.4",
-    "eslint-plugin-no-only-tests": "^3.3.0",
-    "eslint-plugin-wc": "^3.0.0",
-    "gh-pages": "^6.3.0",
-    "husky": "^9.1.7",
-    "madge": "^8.0.0",
-    "prettier": "^3.4.2",
-    "rimraf": "^6.0.1",
-    "sinon": "^20.0.0",
-    "ts-lit-plugin": "^2.0.2",
-    "tslib": "^2.8.1",
-    "typescript": "^5.7.2",
-    "vite": "^6.0.7"
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
-  },
-  "lint-staged": {
-    "*.ts": [
-      "eslint --fix",
-      "prettier --write",
-      "git add"
-    ]
-  }
-}
+{
+  "name": "@internetarchive/ia-topnav",
+  "version": "2.0.2-alpha2",
+  "description": "Top nav for Internet Archive",
+  "license": "AGPL-3.0-only",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "type": "module",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
+    "prepare": "rimraf dist && tsc && husky install",
+    "build": "tsc",
+    "lint": "eslint . && prettier \"**/*.ts\" --check",
+    "format": "eslint . --fix && prettier \"**/*.ts\" --write",
+    "circular": "madge --circular --extensions ts .",
+    "test": "tsc && npm run lint && npm run circular && wtr --coverage",
+    "test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\"",
+    "ghpages:build": "rimraf ghpages && npm run prepare && vite build",
+    "ghpages:publish": "npm run ghpages:prepare -e $(git branch --show-current)",
+    "ghpages:prepare": "npm run ghpages:build && touch ghpages/.nojekyll && npm run ghpages:generate",
+    "ghpages:generate": "gh-pages -t -d ghpages -m \"Build for $(git log --pretty=format:\"%h %an %ai %s\" -n1) [skip ci]\""
+  },
+  "dependencies": {
+    "@internetarchive/ia-styles": "^1.0.0",
+    "@internetarchive/ia-wayback-search": "^1.0.4",
+    "lit": "^2.8.0"
+  },
+  "devDependencies": {
+    "@open-wc/eslint-config": "^12.0.3",
+    "@open-wc/testing": "^4.0.0",
+    "@types/mocha": "^10.0.10",
+    "@typescript-eslint/eslint-plugin": "^8.19.1",
+    "@typescript-eslint/parser": "^8.19.1",
+    "@web/dev-server": "^0.4.6",
+    "@web/test-runner": "^0.20.0",
+    "concurrently": "^9.1.2",
+    "eslint": "^9.24.0",
+    "eslint-config-prettier": "^10.1.1",
+    "eslint-plugin-html": "^8.1.2",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-lit": "^2.0.0",
+    "eslint-plugin-lit-a11y": "^4.1.4",
+    "eslint-plugin-no-only-tests": "^3.3.0",
+    "eslint-plugin-wc": "^3.0.0",
+    "gh-pages": "^6.3.0",
+    "husky": "^9.1.7",
+    "madge": "^8.0.0",
+    "prettier": "^3.4.2",
+    "rimraf": "^6.0.1",
+    "sinon": "^20.0.0",
+    "ts-lit-plugin": "^2.0.2",
+    "tslib": "^2.8.1",
+    "typescript": "^5.7.2",
+    "vite": "^6.0.7"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
+  "lint-staged": {
+    "*.ts": [
+      "eslint --fix",
+      "prettier --write",
+      "git add"
+    ]
+  }
+}