@debtcollective/dc-header-component - npm Package Compare versions

Comparing version 1.5.0 to 2.0.0

CHANGELOG.md

@@ -6,2 +6,196 @@ # Change Log
 
+# 2.0.0 (2020-10-15)
+
+
+### Bug Fixes
+
+* fix package.json module paths ([e7c3041](https://github.com/debtcollective/packages/commit/e7c3041))
+
+
+
+# 1.5.0 (2020-10-09)
+
+
+### Features
+
+* **dropdown:** add new baseline component ([f458d74](https://github.com/debtcollective/packages/commit/f458d74))
+
+
+
+## 1.4.4 (2020-10-07)
+
+
+### Bug Fixes
+
+* **header-component:** display dc-menu in resolutions lower than 1024px ([e26d12e](https://github.com/debtcollective/packages/commit/e26d12e))
+
+
+
+## 1.4.3 (2020-10-03)
+
+
+
+## 1.4.2 (2020-10-03)
+
+
+
+## 1.4.1 (2020-10-03)
+
+
+### Bug Fixes
+
+* **header-mobile:** display logo correctly in safari ([0a793d0](https://github.com/debtcollective/packages/commit/0a793d0))
+
+
+
+# 1.4.0 (2020-10-02)
+
+
+### Features
+
+* **header-component:** add take action links ([5a401cc](https://github.com/debtcollective/packages/commit/5a401cc))
+
+
+
+## 1.3.2 (2020-10-01)
+
+
+
+## 1.3.1 (2020-10-01)
+
+
+### Bug Fixes
+
+* **dc-menu:** use fixed position to keep the menu in the screen while scrolling ([bc30f2a](https://github.com/debtcollective/packages/commit/bc30f2a))
+
+
+
+# 1.3.0 (2020-09-26)
+
+
+### Features
+
+* **header:** remove authLinks while exposing user object ([fa7e5dc](https://github.com/debtcollective/packages/commit/fa7e5dc))
+
+
+
+# 1.2.0 (2020-09-22)
+
+
+### Features
+
+* **header-links:** add member hub link if user is authenticated ([b520e1e](https://github.com/debtcollective/packages/commit/b520e1e))
+* **user-avatar:** create popup for the user avatar ([295ad7a](https://github.com/debtcollective/packages/commit/295ad7a))
+
+
+
+## 1.1.3 (2020-09-18)
+
+
+### Bug Fixes
+
+* **header-component:** use lower case for donate url prop ([4bb2e06](https://github.com/debtcollective/packages/commit/4bb2e06))
+
+
+
+## 1.1.2 (2020-09-18)
+
+
+
+## 1.1.1 (2020-09-18)
+
+
+### Bug Fixes
+
+* **header-component:** remove test dropdown from header ([f9e0705](https://github.com/debtcollective/packages/commit/f9e0705))
+
+
+
+# 1.1.0 (2020-09-18)
+
+
+### Features
+
+* **dc-header:** add logo and logoSmall props for custom images in web component ([7bac0cf](https://github.com/debtcollective/packages/commit/7bac0cf))
+* **header-component:** create collapser for mobile menu ([7ecef13](https://github.com/debtcollective/packages/commit/7ecef13))
+* **header-component:** create dropdown ([533c70f](https://github.com/debtcollective/packages/commit/533c70f))
+
+
+
+## 1.0.1 (2020-09-11)
+
+
+### Bug Fixes
+
+* **header:** use community url to create login/signup links ([e9ae3fc](https://github.com/debtcollective/packages/commit/e9ae3fc))
+
+
+
+# 1.0.0 (2020-09-11)
+
+
+### Build System
+
+* **header-component:** drop usage of env variables to use props instead ([341c6e7](https://github.com/debtcollective/packages/commit/341c6e7))
+
+
+### BREAKING CHANGES
+
+* **header-component:** not longer using env variables now users need to pass a prop of host and community
+with the URL values for each of them. This makes easier the release process of this component
+
+
+
+## 0.12.2 (2020-09-10)
+
+
+
+## 0.12.1 (2020-09-09)
+
+
+
+# 0.12.0 (2020-09-09)
+
+
+### Features
+
+* **header:** add a toggleable side menu ([42366ea](https://github.com/debtcollective/packages/commit/42366ea))
+* **header:** add messages/notifications icons ([15ee94f](https://github.com/debtcollective/packages/commit/15ee94f))
+* **header:** add notifications link alongside counters ([b7a80f6](https://github.com/debtcollective/packages/commit/b7a80f6))
+* **header:** add root link and close btn within menu ([f9f9fee](https://github.com/debtcollective/packages/commit/f9f9fee))
+* **header:** allow to transition from header desktop to mobile ([7f938ef](https://github.com/debtcollective/packages/commit/7f938ef))
+* **header:** update btns to match red brand colour ([abebcad](https://github.com/debtcollective/packages/commit/abebcad))
+* **header:** update layout to have navigation on the left ([c9517cc](https://github.com/debtcollective/packages/commit/c9517cc))
+* **header:** use <slot /> API to improve flexibility ([e215c6d](https://github.com/debtcollective/packages/commit/e215c6d))
+
+
+
+## 0.10.2 (2020-07-22)
+
+
+
+## 0.10.1 (2020-07-22)
+
+
+
+# 0.10.0 (2020-07-13)
+
+
+
+# 0.9.0 (2020-05-20)
+
+
+### Bug Fixes
+
+* change types definition path ([5b928eb](https://github.com/debtcollective/packages/commit/5b928eb))
+
+
+### Features
+
+* **header:** add new stencil component ([75b41df](https://github.com/debtcollective/packages/commit/75b41df))
+
+
+
+
+
 # [1.5.0](https://github.com/debtcollective/packages/compare/v1.4.4...v1.5.0) (2020-10-09)
@@ -8,0 +202,0 @@

dist/cjs/dc-collapser.cjs.entry.js

@@ -5,4 +5,4 @@ 'use strict';
 
-require('./index-685a0736.js');
-const dcCollapser = require('./dc-collapser-1caf563e.js');
+require('./index-5653fce9.js');
+const dcCollapser = require('./dc-collapser-08d80667.js');
 
@@ -9,0 +9,0 @@

dist/cjs/dc-dropdown_5.cjs.entry.js

@@ -5,40 +5,40 @@ 'use strict';
 
-const index = require('./index-685a0736.js');
-const dcCollapser = require('./dc-collapser-1caf563e.js');
+const index = require('./index-5653fce9.js');
+const dcCollapser = require('./dc-collapser-08d80667.js');
 
-const dcDropdownCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif;display:inline-block;font-family:var(--main-font)}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;-webkit-transition:color 0.216s ease;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .btn{-ms-flex-align:center;align-items:center;border-radius:0.25rem;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:0.5rem 1rem;-webkit-transition:background 0.216s ease, color 0.216s ease;transition:background 0.216s ease, color 0.216s ease}:host .btn-transparent{background:none;border:none;display:-ms-flexbox;display:flex;font-size:var(--font-size);padding:0}:host .dropdown-container{position:relative}:host .dropdown-items{background-color:var(--main-bg-color);border-radius:0.5rem 0 0.5rem 0.5rem;-webkit-box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);cursor:pointer;left:0;padding:0;position:absolute;top:2.5rem;width:16rem}:host .dropdown-items.open{list-style:none;opacity:1;-webkit-transition:opacity 0.1s ease-in;transition:opacity 0.1s ease-in;visibility:visible}:host .dropdown-items.hidden{opacity:0;visibility:hidden}:host .dropdown-items .dropdown-item{-ms-flex-align:center;align-items:center;color:var(--disabled-text-color);display:-ms-flexbox;display:flex;font-size:0.875rem;font-weight:600;-ms-flex-pack:start;justify-content:start;min-height:2rem;padding:0.5rem 1rem;text-decoration:none}:host .dropdown-items .dropdown-item:hover,:host .dropdown-items .dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);color:var(--brand-color);-webkit-transition:background-color 0.1s ease-in;transition:background-color 0.1s ease-in}:host .dropdown-items .dropdown-item .dropdown-item-description{color:var(--text-color);font-size:0.75rem;line-height:1rem}:host .material-icons{color:var(--text-color);direction:ltr;display:inline-block;font-family:\"Material Icons\";font-size:24px;font-style:normal;font-weight:normal;letter-spacing:normal;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;-webkit-font-feature-settings:\"liga\";font-feature-settings:\"liga\"}";
+const dcDropdownCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif;display:inline-block;font-family:var(--main-font)}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .btn{align-items:center;border-radius:0.25rem;cursor:pointer;display:flex;justify-content:space-between;padding:0.5rem 1rem;transition:background 0.216s ease, color 0.216s ease}:host .btn-transparent{background:none;border:none;display:flex;font-size:var(--font-size);padding:0}:host .dropdown-container{position:relative}:host .dropdown-items{background-color:var(--main-bg-color);border-radius:0.5rem 0 0.5rem 0.5rem;box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);cursor:pointer;left:0;padding:0;position:absolute;top:2.5rem;width:16rem}:host .dropdown-items.open{list-style:none;opacity:1;transition:opacity 0.1s ease-in;visibility:visible}:host .dropdown-items.hidden{opacity:0;visibility:hidden}:host .dropdown-items .dropdown-item{align-items:center;color:var(--disabled-text-color);display:flex;font-size:0.875rem;font-weight:600;justify-content:start;min-height:2rem;padding:0.5rem 1rem;text-decoration:none}:host .dropdown-items .dropdown-item:hover,:host .dropdown-items .dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);color:var(--brand-color);transition:background-color 0.1s ease-in}:host .dropdown-items .dropdown-item .dropdown-item-description{color:var(--text-color);font-size:0.75rem;line-height:1rem}:host .material-icons{color:var(--text-color);direction:ltr;display:inline-block;font-family:\"Material Icons\";font-size:24px;font-style:normal;font-weight:normal;letter-spacing:normal;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}";
 
 const DcDropdown = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+  }
+  /**
+   * Event to detect outside clicks from the dropdown
+   */
+  handleClickOutside(event) {
+    var _a, _b;
+    const target = event.composedPath()[0];
+    if (((_a = this === null || this === void 0 ? void 0 : this.dropdownTrigger) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.dropdownItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
+      return;
     }
-    /**
-     * Event to detect outside clicks from the dropdown
-     */
-    handleClickOutside(event) {
-        var _a, _b;
-        const target = event.composedPath()[0];
-        if (((_a = this === null || this === void 0 ? void 0 : this.dropdownTrigger) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.dropdownItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
-            return;
-        }
-        this.closeDropdown();
-    }
-    /**
-     * Event to detect escape key press
-     */
-    handleEscapeKey(event) {
-        if (event.keyCode === 27)
-            this.closeDropdown();
-    }
-    toggleDropdown() {
-        this.open = !this.open;
-    }
-    closeDropdown() {
-        this.open = false;
-    }
-    render() {
-        //TODO: @Watch approach seems to not work correctly
-        const _items = JSON.parse(this.items);
-        return (index.h("div", { class: "dropdown-container nav-item" }, index.h("button", { class: "nav-link btn btn-transparent", onClick: this.toggleDropdown.bind(this), ref: (el) => this.dropdownTrigger = el }, this.label || '', index.h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), index.h("div", { class: `dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closeDropdown.bind(this), ref: (el) => this.dropdownItems = el }, _items === null || _items === void 0 ? void 0 : _items.map(item => (index.h("a", Object.assign({ class: "dropdown-item" }, dcCollapser.lodash_omit(item, ['text'])), item.text))))));
-    }
+    this.closeDropdown();
+  }
+  /**
+   * Event to detect escape key press
+   */
+  handleEscapeKey(event) {
+    if (event.keyCode === 27)
+      this.closeDropdown();
+  }
+  toggleDropdown() {
+    this.open = !this.open;
+  }
+  closeDropdown() {
+    this.open = false;
+  }
+  render() {
+    //TODO: @Watch approach seems to not work correctly
+    const _items = JSON.parse(this.items);
+    return (index.h("div", { class: "dropdown-container nav-item" }, index.h("button", { class: "nav-link btn btn-transparent", onClick: this.toggleDropdown.bind(this), ref: (el) => this.dropdownTrigger = el }, this.label || '', index.h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), index.h("div", { class: `dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closeDropdown.bind(this), ref: (el) => this.dropdownItems = el }, _items === null || _items === void 0 ? void 0 : _items.map(item => (index.h("a", Object.assign({ class: "dropdown-item" }, dcCollapser.lodash_omit(item, ['text'])), item.text))))));
+  }
 };
@@ -49,79 +49,79 @@ DcDropdown.style = dcDropdownCss;
 const getCSRFToken = async (discourseEndpoint) => {
-    const url = `${discourseEndpoint}/session/csrf.json`;
-    const response = await fetch(url, {
-        credentials: "include",
-        headers: {
-            Accept: "application/json",
-        },
-    });
-    if (!response.ok) {
-        throw "Error trying CSRF token";
-    }
-    const json = await response.json();
-    return json.csrf;
+  const url = `${discourseEndpoint}/session/csrf.json`;
+  const response = await fetch(url, {
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+    },
+  });
+  if (!response.ok) {
+    throw "Error trying CSRF token";
+  }
+  const json = await response.json();
+  return json.csrf;
 };
 const getCurrentUser = async (discourseEndpoint, { csrfToken }) => {
-    const url = `${discourseEndpoint}/session/current.json`;
-    const response = await fetch(url, {
-        credentials: "include",
-        headers: {
-            Accept: "application/json",
-            "X-CSRF-Token": csrfToken,
-        },
-    });
-    // Could be the case for no active session
-    if (!response.ok) {
-        return;
-    }
-    const json = await response.json();
-    const { current_user: currentUser } = json;
-    return currentUser;
+  const url = `${discourseEndpoint}/session/current.json`;
+  const response = await fetch(url, {
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+      "X-CSRF-Token": csrfToken,
+    },
+  });
+  // Could be the case for no active session
+  if (!response.ok) {
+    return;
+  }
+  const json = await response.json();
+  const { current_user: currentUser } = json;
+  return currentUser;
 };
 const syncCurrentUser = async (discourseEndpoint) => {
-    let currentUser;
-    try {
-        const csrfToken = await getCSRFToken(discourseEndpoint);
-        currentUser = await getCurrentUser(discourseEndpoint, { csrfToken });
-    }
-    catch (error) {
-        console.error(error);
-    }
-    return currentUser;
+  let currentUser;
+  try {
+    const csrfToken = await getCSRFToken(discourseEndpoint);
+    currentUser = await getCurrentUser(discourseEndpoint, { csrfToken });
+  }
+  catch (error) {
+    console.error(error);
+  }
+  return currentUser;
 };
 const logout = async (discourseEndpoint, username) => {
-    const url = `${discourseEndpoint}/session/${username}`;
-    const csrfToken = await getCSRFToken(discourseEndpoint);
-    try {
-        await fetch(url, {
-            method: "DELETE",
-            credentials: "include",
-            headers: {
-                Accept: "application/json",
-                "X-CSRF-Token": csrfToken,
-            },
-        });
-    }
-    catch (error) {
-        console.error(error);
-    }
+  const url = `${discourseEndpoint}/session/${username}`;
+  const csrfToken = await getCSRFToken(discourseEndpoint);
+  try {
+    await fetch(url, {
+      method: "DELETE",
+      credentials: "include",
+      headers: {
+        Accept: "application/json",
+        "X-CSRF-Token": csrfToken,
+      },
+    });
+  }
+  catch (error) {
+    console.error(error);
+  }
 };
 
-const dcMenuCss = ":host .menu-container.open .menu{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}:host .menu-container.hidden .menu{-webkit-transform:translate3d(-100%, 0, 0);transform:translate3d(-100%, 0, 0)}:host .menu{-webkit-backface-visibility:hidden;-ms-flex-align:start;align-items:flex-start;backface-visibility:hidden;background-color:var(--main-bg-color);-webkit-box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100vh;-ms-flex-pack:start;justify-content:flex-start;left:0;padding:0;position:fixed;top:0;-webkit-transition:-webkit-transform ease 0.216s;transition:-webkit-transform ease 0.216s;transition:transform ease 0.216s;transition:transform ease 0.216s, -webkit-transform ease 0.216s;width:75%;z-index:var(--z-index)}:host .menu-cloak{height:100vh;width:100vw;position:fixed;background-color:black;opacity:0.5;top:0;left:0;z-index:var(--z-index)}:host .menu-container.open .menu-cloak{display:block}:host .menu-container.hidden .menu-cloak{display:none}:host .menu-close{-ms-flex-align:center;align-items:center;background:rgba(57,57,57,0.07);border-radius:50%;display:-ms-flexbox;display:flex;font-size:1rem;padding:0.5rem}:host .menu-logo{width:50%}:host .nav-header{-ms-flex-align:center;align-items:center;border-bottom:0.0625rem solid #e8e8e8;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:1rem;padding:1.5rem var(--column-gap);width:100%}:host .menu-nav .nav-item{margin-bottom:1rem}";
+const dcMenuCss = ":host .menu-container.open .menu{transform:translate3d(0, 0, 0)}:host .menu-container.hidden .menu{transform:translate3d(-100%, 0, 0)}:host .menu{-webkit-backface-visibility:hidden;align-items:flex-start;backface-visibility:hidden;background-color:var(--main-bg-color);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-sizing:border-box;display:flex;flex-direction:column;height:100vh;justify-content:flex-start;left:0;padding:0;position:fixed;top:0;transition:transform ease 0.216s;width:75%;z-index:var(--z-index)}:host .menu-cloak{height:100vh;width:100vw;position:fixed;background-color:black;opacity:0.5;top:0;left:0;z-index:var(--z-index)}:host .menu-container.open .menu-cloak{display:block}:host .menu-container.hidden .menu-cloak{display:none}:host .menu-close{align-items:center;background:rgba(57,57,57,0.07);border-radius:50%;display:flex;font-size:1rem;padding:0.5rem}:host .menu-logo{width:50%}:host .nav-header{align-items:center;border-bottom:0.0625rem solid #e8e8e8;box-sizing:border-box;display:flex;justify-content:space-between;margin-bottom:1rem;padding:1.5rem var(--column-gap);width:100%}:host .menu-nav .nav-item{margin-bottom:1rem}";
 
 const Menu = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.toggleMenu = index.createEvent(this, "toggleMenu", 7);
-        /**
-         * Logo image
-         */
-        this._logo = "logo.png";
-    }
-    toggleMenuHandler() {
-        this.toggleMenu.emit();
-    }
-    render() {
-        return (index.h("div", { class: `menu-container ${this.open ? "open " : "hidden"}` }, index.h("div", { class: "menu-cloak", onClick: this.toggleMenuHandler.bind(this) }), index.h("div", { class: "menu" }, index.h("div", { class: "nav-header" }, index.h("a", { href: "/" }, index.h("img", { class: "menu-logo", src: this.logo || index.getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), index.h("button", { class: "btn-transparent menu-close material-icons", "aria-label": "close menu", onClick: this.toggleMenuHandler.bind(this) }, "close")), index.h("nav", { class: "menu-nav" }, index.h("slot", null)))));
-    }
-    static get assetsDirs() { return ["assets"]; }
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.toggleMenu = index.createEvent(this, "toggleMenu", 7);
+    /**
+     * Logo image
+     */
+    this._logo = "logo.png";
+  }
+  toggleMenuHandler() {
+    this.toggleMenu.emit();
+  }
+  render() {
+    return (index.h("div", { class: `menu-container ${this.open ? "open " : "hidden"}` }, index.h("div", { class: "menu-cloak", onClick: this.toggleMenuHandler.bind(this) }), index.h("div", { class: "menu" }, index.h("div", { class: "nav-header" }, index.h("a", { href: "/" }, index.h("img", { class: "menu-logo", src: this.logo || index.getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), index.h("button", { class: "btn-transparent menu-close material-icons", "aria-label": "close menu", onClick: this.toggleMenuHandler.bind(this) }, "close")), index.h("nav", { class: "menu-nav" }, index.h("slot", null)))));
+  }
+  static get assetsDirs() { return ["assets"]; }
 };
@@ -150,160 +150,160 @@ Menu.style = dcMenuCss;
 const getAvatarURL = ({ avatar_template }, community, size = 64) => {
-    return preffixCommunityURL(community, avatar_template.replace(`{size}`, size));
+  return preffixCommunityURL(community, avatar_template.replace(`{size}`, size));
 };
 
-const dcUserDropdownCss = ":host .user-dropdown-container{position:relative}:host .user-dropdown-items{position:absolute;top:2.5rem;right:0;border-radius:0.5rem 0 0.5rem 0.5rem;background-color:var(--main-bg-color);padding:0;cursor:pointer;width:16rem;-webkit-box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12)}:host .user-dropdown-items.open{opacity:1;-webkit-transition:opacity 0.1s ease-in;transition:opacity 0.1s ease-in;visibility:visible;list-style:none}:host .user-dropdown-items.hidden{visibility:hidden;opacity:0}:host .user-dropdown-items .user-dropdown-item{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:start;padding:0.5rem 1rem;min-height:2rem;color:var(--disabled-text-color);font-size:0.875rem;font-weight:600}:host .user-dropdown-items .user-dropdown-item:first-child{-ms-flex-pack:justify;justify-content:space-between}:host .user-dropdown-items .user-dropdown-item:last-child{width:100%}:host .user-dropdown-items .user-dropdown-item:hover,:host .user-dropdown-items .user-dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);-webkit-transition:background-color 0.1s ease-in;transition:background-color 0.1s ease-in;color:var(--brand-color)}:host .user-dropdown-items .user-dropdown-item .user-dropdown-item-description{font-size:0.75rem;line-height:1rem;color:var(--text-color)}";
+const dcUserDropdownCss = ":host .user-dropdown-container{position:relative}:host .user-dropdown-items{position:absolute;top:2.5rem;right:0;border-radius:0.5rem 0 0.5rem 0.5rem;background-color:var(--main-bg-color);padding:0;cursor:pointer;width:16rem;box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12)}:host .user-dropdown-items.open{opacity:1;transition:opacity 0.1s ease-in;visibility:visible;list-style:none}:host .user-dropdown-items.hidden{visibility:hidden;opacity:0}:host .user-dropdown-items .user-dropdown-item{display:flex;align-items:center;justify-content:start;padding:0.5rem 1rem;min-height:2rem;color:var(--disabled-text-color);font-size:0.875rem;font-weight:600}:host .user-dropdown-items .user-dropdown-item:first-child{justify-content:space-between}:host .user-dropdown-items .user-dropdown-item:last-child{width:100%}:host .user-dropdown-items .user-dropdown-item:hover,:host .user-dropdown-items .user-dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);transition:background-color 0.1s ease-in;color:var(--brand-color)}:host .user-dropdown-items .user-dropdown-item .user-dropdown-item-description{font-size:0.75rem;line-height:1rem;color:var(--text-color)}";
 
 const UserPopup = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.open = false;
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.open = false;
+  }
+  /**
+   * Event to detect outside clicks from the popup
+   */
+  handleClickOutside(event) {
+    var _a, _b;
+    const target = event.composedPath()[0];
+    if (((_a = this === null || this === void 0 ? void 0 : this.popupTriggerElement) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.popupItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
+      return;
     }
-    /**
-     * Event to detect outside clicks from the popup
-     */
-    handleClickOutside(event) {
-        var _a, _b;
-        const target = event.composedPath()[0];
-        if (((_a = this === null || this === void 0 ? void 0 : this.popupTriggerElement) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.popupItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
-            return;
-        }
-        this.closePopup();
+    this.closePopup();
+  }
+  /**
+   *  Event to detect escape key press
+   */
+  handleEscapeKey(event) {
+    if (event.keyCode === 27)
+      this.closePopup();
+  }
+  togglePopup() {
+    this.open = !this.open;
+  }
+  closePopup() {
+    this.open = false;
+  }
+  async handleLogout() {
+    try {
+      await logout(this.community, this.user.username);
     }
-    /**
-     *  Event to detect escape key press
-     */
-    handleEscapeKey(event) {
-        if (event.keyCode === 27)
-            this.closePopup();
+    finally {
+      window.location.reload();
     }
-    togglePopup() {
-        this.open = !this.open;
-    }
-    closePopup() {
-        this.open = false;
-    }
-    async handleLogout() {
-        try {
-            await logout(this.community, this.user.username);
-        }
-        finally {
-            window.location.reload();
-        }
-    }
-    render() {
-        const items = [
-            {
-                text: 'Summary',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/summary`),
-                icon: 'account_circle'
-            },
-            {
-                text: 'Activity',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/activity`),
-                icon: 'subject'
-            },
-            {
-                text: 'Drafts',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/activity/drafts`),
-                icon: 'edit'
-            },
-            {
-                text: 'Preferences',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/preferences/account`),
-                icon: 'settings'
-            }
-        ];
-        return (index.h("div", { class: `user-dropdown-container` }, index.h("button", { class: "btn btn-transparent", onClick: this.togglePopup.bind(this), ref: (el) => this.popupTriggerElement = el }, index.h("img", { alt: "Profile picture", width: "32", height: "32", src: getAvatarURL(this.user, this.community), title: this.user.username, class: "avatar" }), index.h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), index.h("div", { class: `user-dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closePopup.bind(this), ref: (el) => this.popupItems = el }, index.h("a", { href: preffixCommunityURL(this.community, `u/${this.user.username}`), class: "user-dropdown-item", target: "_blank" }, this.user.username, index.h("small", null, "View Your Profile")), items.map(item => (index.h("a", { href: item.href, class: "user-dropdown-item", target: "_blank" }, index.h("span", { class: "material-icons" }, item.icon), item.text))), index.h("button", { class: "btn btn-transparent user-dropdown-item", onClick: this.handleLogout.bind(this) }, index.h("span", { class: "material-icons" }, "exit_to_app"), "Logout"))));
-    }
-    static get assetsDirs() { return ["assets"]; }
+  }
+  render() {
+    const items = [
+      {
+        text: 'Summary',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/summary`),
+        icon: 'account_circle'
+      },
+      {
+        text: 'Activity',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/activity`),
+        icon: 'subject'
+      },
+      {
+        text: 'Drafts',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/activity/drafts`),
+        icon: 'edit'
+      },
+      {
+        text: 'Preferences',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/preferences/account`),
+        icon: 'settings'
+      }
+    ];
+    return (index.h("div", { class: `user-dropdown-container` }, index.h("button", { class: "btn btn-transparent", onClick: this.togglePopup.bind(this), ref: (el) => this.popupTriggerElement = el }, index.h("img", { alt: "Profile picture", width: "32", height: "32", src: getAvatarURL(this.user, this.community), title: this.user.username, class: "avatar" }), index.h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), index.h("div", { class: `user-dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closePopup.bind(this), ref: (el) => this.popupItems = el }, index.h("a", { href: preffixCommunityURL(this.community, `u/${this.user.username}`), class: "user-dropdown-item", target: "_blank" }, this.user.username, index.h("small", null, "View Your Profile")), items.map(item => (index.h("a", { href: item.href, class: "user-dropdown-item", target: "_blank" }, index.h("span", { class: "material-icons" }, item.icon), item.text))), index.h("button", { class: "btn btn-transparent user-dropdown-item", onClick: this.handleLogout.bind(this) }, index.h("span", { class: "material-icons" }, "exit_to_app"), "Logout"))));
+  }
+  static get assetsDirs() { return ["assets"]; }
 };
 UserPopup.style = dcUserDropdownCss;
 
-const dcUserItemsCss = ":host .session-user-items{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .notification-link{margin-left:.5rem}:host .notification-icon{position:relative}:host .badge-notification{background:#bdbdbd;border-radius:10px;color:#fff;display:inline-block;font-size:.7579em;font-weight:normal;left:-2px;line-height:1;padding:0.21em 0.42em;position:absolute;text-align:center;top:-4px;white-space:nowrap;z-index:1}:host .unread-notifications{background-color:#6cf}";
+const dcUserItemsCss = ":host .session-user-items{display:flex;align-items:center}:host .notification-link{margin-left:.5rem}:host .notification-icon{position:relative}:host .badge-notification{background:#bdbdbd;border-radius:10px;color:#fff;display:inline-block;font-size:.7579em;font-weight:normal;left:-2px;line-height:1;padding:0.21em 0.42em;position:absolute;text-align:center;top:-4px;white-space:nowrap;z-index:1}:host .unread-notifications{background-color:#6cf}";
 
 const Menu$1 = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    render() {
-        const { unread_high_priority_notifications: inboxNoticeCount, unread_notifications: generalNoticeCount } = this.user;
-        return (index.h(index.Host, { class: "session-user-items" }, index.h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/messages`) }, index.h("div", { class: "notification-icon icons" }, index.h("div", { id: "inbox", class: "material-icons" }, "email"), inboxNoticeCount !== 0 && (index.h("span", { class: "badge-notification unread-private-messages" }, inboxNoticeCount)))), index.h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/notifications`) }, index.h("div", { class: "notification-icon icons" }, index.h("div", { id: "notifications", class: "material-icons" }, "notifications"), generalNoticeCount !== 0 && (index.h("span", { class: "badge-notification unread-notifications" }, generalNoticeCount)))), index.h("dc-user-dropdown", { user: this.user, community: this.community })));
-    }
-    static get assetsDirs() { return ["assets"]; }
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+  }
+  render() {
+    const { unread_high_priority_notifications: inboxNoticeCount, unread_notifications: generalNoticeCount } = this.user;
+    return (index.h(index.Host, { class: "session-user-items" }, index.h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/messages`) }, index.h("div", { class: "notification-icon icons" }, index.h("div", { id: "inbox", class: "material-icons" }, "email"), inboxNoticeCount !== 0 && (index.h("span", { class: "badge-notification unread-private-messages" }, inboxNoticeCount)))), index.h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/notifications`) }, index.h("div", { class: "notification-icon icons" }, index.h("div", { id: "notifications", class: "material-icons" }, "notifications"), generalNoticeCount !== 0 && (index.h("span", { class: "badge-notification unread-notifications" }, generalNoticeCount)))), index.h("dc-user-dropdown", { user: this.user, community: this.community })));
+  }
+  static get assetsDirs() { return ["assets"]; }
 };
 Menu$1.style = dcUserItemsCss;
 
-const dcHeaderCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif}:host *{font-family:var(--main-font)}:host a{text-decoration:none}:host .header{-webkit-backface-visibility:hidden;-ms-flex-align:center;align-items:center;backface-visibility:hidden;background-color:var(--main-bg-color);-webkit-box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;height:5rem;-ms-flex-pack:start;justify-content:flex-start;left:0;padding:0 var(--column-gap);position:fixed;top:0;width:100%;z-index:var(--z-index)}:host .logo{height:2.667em;position:relative;width:auto}:host .logo-link{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:1rem}:host .nav{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;-webkit-transition:color 0.216s ease;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .avatar{border-radius:50%;width:2.1333em;height:2.1333em}:host #current-user{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:2.2857em;height:2.2857em;padding:0.2143em;padding-right:0;cursor:pointer;outline:none}:host .session-items{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:1rem}:host .session-items .material-icons{font-size:1.25rem;padding:0.2143em;text-decoration:none;cursor:pointer}:host .avatar{margin-left:.5rem}:host .session-links{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .btn{-ms-flex-align:center;align-items:center;border-radius:0.25rem;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:0.5rem 1rem;-webkit-transition:background 0.216s ease, color 0.216s ease;transition:background 0.216s ease, color 0.216s ease}:host .btn-outline{background:transparent;border:0.0625rem solid var(--text-color);color:var(--text-color)}:host .btn-outline:hover{background:var(--outline-button-hover-color)}:host .btn-primary{background:var(--button-color);border:0.0625rem solid var(--button-color);color:#fff}:host .btn-primary:hover{border:0.0625rem solid var(--button-hover-color);background:var(--button-hover-color)}:host .header .btn+.btn{margin-left:0.4375rem}:host .btn-transparent{background:none;border:none;display:-ms-flexbox;display:flex;font-size:var(--font-size);padding:0}.ml-1{margin-left:0.25rem}:host .d-md-flex{display:none}@media (min-width: 1024px){:host .d-md-flex{display:-ms-flexbox;display:flex}}:host .d-md-none{display:-ms-flexbox;display:flex}@media (min-width: 1024px){:host .d-md-none{display:none}}:host .material-icons{color:var(--text-color);font-family:\"Material Icons\";font-weight:normal;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;-webkit-font-feature-settings:\"liga\";font-feature-settings:\"liga\"}";
+const dcHeaderCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif}:host *{font-family:var(--main-font)}:host a{text-decoration:none}:host .header{-webkit-backface-visibility:hidden;align-items:center;backface-visibility:hidden;background-color:var(--main-bg-color);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-sizing:border-box;display:flex;height:5rem;justify-content:flex-start;left:0;padding:0 var(--column-gap);position:fixed;top:0;width:100%;z-index:var(--z-index)}:host .logo{height:2.667em;position:relative;width:auto}:host .logo-link{display:flex;align-items:center;margin-right:1rem}:host .nav{align-items:center;display:flex;flex:1}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .avatar{border-radius:50%;width:2.1333em;height:2.1333em}:host #current-user{position:relative;display:flex;align-items:center;justify-content:center;width:2.2857em;height:2.2857em;padding:0.2143em;padding-right:0;cursor:pointer;outline:none}:host .session-items{display:flex;align-items:center;margin-left:1rem}:host .session-items .material-icons{font-size:1.25rem;padding:0.2143em;text-decoration:none;cursor:pointer}:host .avatar{margin-left:.5rem}:host .session-links{display:flex;align-items:center}:host .btn{align-items:center;border-radius:0.25rem;cursor:pointer;display:flex;justify-content:space-between;padding:0.5rem 1rem;transition:background 0.216s ease, color 0.216s ease}:host .btn-outline{background:transparent;border:0.0625rem solid var(--text-color);color:var(--text-color)}:host .btn-outline:hover{background:var(--outline-button-hover-color)}:host .btn-primary{background:var(--button-color);border:0.0625rem solid var(--button-color);color:#fff}:host .btn-primary:hover{border:0.0625rem solid var(--button-hover-color);background:var(--button-hover-color)}:host .header .btn+.btn{margin-left:0.4375rem}:host .btn-transparent{background:none;border:none;display:flex;font-size:var(--font-size);padding:0}.ml-1{margin-left:0.25rem}:host .d-md-flex{display:none}@media (min-width: 1024px){:host .d-md-flex{display:flex}}:host .d-md-none{display:flex}@media (min-width: 1024px){:host .d-md-none{display:none}}:host .material-icons{color:var(--text-color);font-family:\"Material Icons\";font-weight:normal;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}";
 
 // dc-dropdown.items accepts strings
 const TAKE_ACTION_LINKS = JSON.stringify([
-    {
-        text: 'Events',
-        href: 'https://community.debtcollective.org/calendar',
-        target: '_blank'
-    },
-    {
-        text: 'Student Debt Strike',
-        href: 'https://strike.debtcollective.org',
-        target: '_blank'
-    },
-    {
-        text: 'Dispute Your Debt',
-        href: 'https://tools.debtcollective.org/',
-        target: '_blank'
-    },
+  {
+    text: 'Events',
+    href: 'https://community.debtcollective.org/calendar',
+    target: '_blank'
+  },
+  {
+    text: 'Student Debt Strike',
+    href: 'https://strike.debtcollective.org',
+    target: '_blank'
+  },
+  {
+    text: 'Dispute Your Debt',
+    href: 'https://tools.debtcollective.org/',
+    target: '_blank'
+  },
 ]);
 const Header = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.userSynced = index.createEvent(this, "userSynced", 7);
-        /**
-         * Link to follow in order to prompt user to donate
-         */
-        this.donateurl = "https://membership.debtcollective.org";
-        /**
-         * URL to the community
-         * without the latest "/"
-         */
-        this.community = "https://community.debtcollective.org";
-        /**
-         * URL to the member hub page
-         */
-        this.memberhuburl = "https://debtcollective.org/hub";
-        /**
-         * Logo image
-         */
-        this._logo = "logo.png";
-        this._logoSmall = "logo-small.png";
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.userSynced = index.createEvent(this, "userSynced", 7);
+    /**
+     * Link to follow in order to prompt user to donate
+     */
+    this.donateurl = "https://membership.debtcollective.org";
+    /**
+     * URL to the community
+     * without the latest "/"
+     */
+    this.community = "https://community.debtcollective.org";
+    /**
+     * URL to the member hub page
+     */
+    this.memberhuburl = "https://debtcollective.org/hub";
+    /**
+     * Logo image
+     */
+    this._logo = "logo.png";
+    this._logoSmall = "logo-small.png";
+  }
+  linksDidChangeHandler(newValue) {
+    if (!newValue) {
+      this._links = [];
+      return;
     }
-    linksDidChangeHandler(newValue) {
-        if (!newValue) {
-            this._links = [];
-            return;
-        }
-        this._links = JSON.parse(newValue);
-    }
-    toggleMenuHandler() {
-        this.toggleMenu();
-    }
-    toggleMenu() {
-        this.isMenuOpen = !this.isMenuOpen;
-    }
-    async syncCurrentUser() {
-        const user = await syncCurrentUser(this.community);
-        this.user = user;
-        this.userSynced.emit(user);
-    }
-    componentWillLoad() {
-        this.linksDidChangeHandler(this.links);
-        return this.syncCurrentUser();
-    }
-    render() {
-        const linksToRender = this._links;
-        return (index.h(index.Host, null, index.h("header", { class: "header" }, index.h("a", { class: "logo-link d-md-flex", href: "/" }, index.h("img", { class: "logo", src: this.logo || index.getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), index.h("button", { class: "btn-transparent logo-link d-md-none", onClick: this.toggleMenuHandler.bind(this) }, index.h("img", { class: "logo", src: this.logosmall || index.getAssetPath(`./assets/${this._logoSmall}`), alt: "The Debtcollective" }), index.h("span", { class: "material-icons ml-1" }, "keyboard_arrow_right")), index.h("nav", { class: "nav" }, index.h("slot", { name: "header" }, linksToRender.map(link => (index.h("div", { class: "nav-item d-md-flex" }, index.h("a", Object.assign({ class: "nav-link" }, dcCollapser.lodash_omit(link, ['text'])), link.text)))), index.h("dc-dropdown", { label: "Take Action!", items: TAKE_ACTION_LINKS }))), index.h("div", { class: "session-items" }, this.user ? (index.h("dc-user-items", { user: this.user, community: this.community })) : (index.h("div", { class: "session-links" }, index.h("a", { href: loginURL({ community: this.community, host: this.host }), class: "btn btn-outline" }, index.h("span", { class: "d-md-flex" }, "Member"), "\u00A0Login"), index.h("a", { href: this.donateurl, class: "btn btn-primary" }, "Donate"))))), index.h("dc-menu", { open: this.isMenuOpen, logo: this.logo }, index.h("slot", { name: "menu" }, linksToRender.map(link => (index.h("div", { class: "nav-item" }, index.h("a", Object.assign({ class: "nav-link" }, dcCollapser.lodash_omit(link, ['text'])), link.text))))))));
-    }
-    static get assetsDirs() { return ["assets"]; }
-    static get watchers() { return {
-        "links": ["linksDidChangeHandler"]
-    }; }
+    this._links = JSON.parse(newValue);
+  }
+  toggleMenuHandler() {
+    this.toggleMenu();
+  }
+  toggleMenu() {
+    this.isMenuOpen = !this.isMenuOpen;
+  }
+  async syncCurrentUser() {
+    const user = await syncCurrentUser(this.community);
+    this.user = user;
+    this.userSynced.emit(user);
+  }
+  componentWillLoad() {
+    this.linksDidChangeHandler(this.links);
+    return this.syncCurrentUser();
+  }
+  render() {
+    const linksToRender = this._links;
+    return (index.h(index.Host, null, index.h("header", { class: "header" }, index.h("a", { class: "logo-link d-md-flex", href: "/" }, index.h("img", { class: "logo", src: this.logo || index.getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), index.h("button", { class: "btn-transparent logo-link d-md-none", onClick: this.toggleMenuHandler.bind(this) }, index.h("img", { class: "logo", src: this.logosmall || index.getAssetPath(`./assets/${this._logoSmall}`), alt: "The Debtcollective" }), index.h("span", { class: "material-icons ml-1" }, "keyboard_arrow_right")), index.h("nav", { class: "nav" }, index.h("slot", { name: "header" }, linksToRender.map(link => (index.h("div", { class: "nav-item d-md-flex" }, index.h("a", Object.assign({ class: "nav-link" }, dcCollapser.lodash_omit(link, ['text'])), link.text)))), index.h("dc-dropdown", { label: "Take Action!", items: TAKE_ACTION_LINKS }))), index.h("div", { class: "session-items" }, this.user ? (index.h("dc-user-items", { user: this.user, community: this.community })) : (index.h("div", { class: "session-links" }, index.h("a", { href: loginURL({ community: this.community, host: this.host }), class: "btn btn-outline" }, index.h("span", { class: "d-md-flex" }, "Member"), "\u00A0Login"), index.h("a", { href: this.donateurl, class: "btn btn-primary" }, "Donate"))))), index.h("dc-menu", { open: this.isMenuOpen, logo: this.logo }, index.h("slot", { name: "menu" }, linksToRender.map(link => (index.h("div", { class: "nav-item" }, index.h("a", Object.assign({ class: "nav-link" }, dcCollapser.lodash_omit(link, ['text'])), link.text))))))));
+  }
+  static get assetsDirs() { return ["assets"]; }
+  static get watchers() { return {
+    "links": ["linksDidChangeHandler"]
+  }; }
 };
@@ -310,0 +310,0 @@ Header.style = dcHeaderCss;

dist/cjs/header.cjs.js

 'use strict';
 
-const index = require('./index-685a0736.js');
-const patch = require('./patch-32037456.js');
+const index = require('./index-5653fce9.js');
 
-patch.patchBrowser().then(options => {
+/*
+ Stencil Client Patch Browser v2.0.3 | MIT Licensed | https://stenciljs.com
+ */
+const patchBrowser = () => {
+    const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('header.cjs.js', document.baseURI).href));
+    const opts =  {};
+    if ( importMeta !== '') {
+        opts.resourcesUrl = new URL('.', importMeta).href;
+    }
+    return index.promiseResolve(opts);
+};
+
+patchBrowser().then(options => {
   return index.bootstrapLazy([["dc-collapser.cjs",[[0,"dc-collapser",{"label":[1],"items":[16],"open":[32]}]]],["dc-dropdown_5.cjs",[[1,"dc-header",{"links":[1],"donateurl":[1],"community":[1],"memberhuburl":[1],"host":[1],"logo":[1],"logosmall":[1],"user":[32],"isMenuOpen":[32]},[[0,"toggleMenu","toggleMenuHandler"]]],[0,"dc-user-items",{"community":[1],"user":[16]}],[1,"dc-dropdown",{"label":[1],"items":[1],"open":[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]],[4,"dc-menu",{"open":[4],"logo":[1]}],[0,"dc-user-dropdown",{"community":[1],"user":[16],"open":[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]]]]], options);
 });

dist/cjs/loader.cjs.js

@@ -5,8 +5,14 @@ 'use strict';
 
-const index = require('./index-685a0736.js');
-const patch = require('./patch-32037456.js');
+const index = require('./index-5653fce9.js');
 
+/*
+ Stencil Client Patch Esm v2.0.3 | MIT Licensed | https://stenciljs.com
+ */
+const patchEsm = () => {
+    return index.promiseResolve();
+};
+
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
-  return patch.patchEsm().then(() => {
+  return patchEsm().then(() => {
   return index.bootstrapLazy([["dc-collapser.cjs",[[0,"dc-collapser",{"label":[1],"items":[16],"open":[32]}]]],["dc-dropdown_5.cjs",[[1,"dc-header",{"links":[1],"donateurl":[1],"community":[1],"memberhuburl":[1],"host":[1],"logo":[1],"logosmall":[1],"user":[32],"isMenuOpen":[32]},[[0,"toggleMenu","toggleMenuHandler"]]],[0,"dc-user-items",{"community":[1],"user":[16]}],[1,"dc-dropdown",{"label":[1],"items":[1],"open":[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]],[4,"dc-menu",{"open":[4],"logo":[1]}],[0,"dc-user-dropdown",{"community":[1],"user":[16],"open":[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]]]]], options);
@@ -13,0 +19,0 @@ });

dist/collection/collection-manifest.json

@@ -11,4 +11,4 @@ {
     "name": "@stencil/core",
-    "version": "1.17.3",
-    "typescriptVersion": "3.9.7"
+    "version": "2.0.3",
+    "typescriptVersion": "4.0.2"
   },
@@ -15,0 +15,0 @@ "collections": [

dist/collection/components/dc-header/dc-collapser.js

 import { Component, h, State, Prop, } from "@stencil/core";
 import omit from 'lodash.omit';
 export class Collapser {
-    toggleCollapser() {
-        this.open = !this.open;
+  toggleCollapser() {
+    this.open = !this.open;
+  }
+  render() {
+    var _a;
+    return (h("div", { class: "nav-item" },
+      h("button", { class: "nav-link btn btn-transparent", onClick: this.toggleCollapser.bind(this) },
+        this.label || '',
+        h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')),
+      h("ul", { class: `collapser-items ${this.open ? "open " : "hidden"}` }, (_a = this === null || this === void 0 ? void 0 : this.items) === null || _a === void 0 ? void 0 : _a.map(item => (h("li", { class: "collapser-item" },
+        h("a", Object.assign({ class: "collapser-item-text" }, omit(item, ['text'])), item.text)))))));
+  }
+  static get is() { return "dc-collapser"; }
+  static get originalStyleUrls() { return {
+    "$": ["dc-collapser.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["dc-collapser.css"]
+  }; }
+  static get assetsDirs() { return ["assets"]; }
+  static get properties() { return {
+    "label": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "label for the collapser nav item"
+      },
+      "attribute": "label",
+      "reflect": false
+    },
+    "items": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "Array<{ text: string; href: string, target?: string }>",
+        "resolved": "{ text: string; href: string; target?: string; }[]",
+        "references": {
+          "Array": {
+            "location": "global"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Items to be displayed in the collapser"
+      }
     }
-    render() {
-        var _a;
-        return (h("div", { class: "nav-item" },
-            h("button", { class: "nav-link btn btn-transparent", onClick: this.toggleCollapser.bind(this) },
-                this.label || '',
-                h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')),
-            h("ul", { class: `collapser-items ${this.open ? "open " : "hidden"}` }, (_a = this === null || this === void 0 ? void 0 : this.items) === null || _a === void 0 ? void 0 : _a.map(item => (h("li", { class: "collapser-item" },
-                h("a", Object.assign({ class: "collapser-item-text" }, omit(item, ['text'])), item.text)))))));
-    }
-    static get is() { return "dc-collapser"; }
-    static get originalStyleUrls() { return {
-        "$": ["dc-collapser.css"]
-    }; }
-    static get styleUrls() { return {
-        "$": ["dc-collapser.css"]
-    }; }
-    static get assetsDirs() { return ["assets"]; }
-    static get properties() { return {
-        "label": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "label for the collapser nav item"
-            },
-            "attribute": "label",
-            "reflect": false
-        },
-        "items": {
-            "type": "unknown",
-            "mutable": false,
-            "complexType": {
-                "original": "Array<{ text: string; href: string, target?: string }>",
-                "resolved": "{ text: string; href: string; target?: string; }[]",
-                "references": {
-                    "Array": {
-                        "location": "global"
-                    }
-                }
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "Items to be displayed in the collapser"
-            }
-        }
-    }; }
-    static get states() { return {
-        "open": {}
-    }; }
+  }; }
+  static get states() { return {
+    "open": {}
+  }; }
 }

dist/collection/components/dc-header/dc-header.js

@@ -12,248 +12,248 @@ import { Component, Prop, State, h, Watch, getAssetPath, Host, Listen, Event } from "@stencil/core";
 const TAKE_ACTION_LINKS = JSON.stringify([
-    {
-        text: 'Events',
-        href: 'https://community.debtcollective.org/calendar',
-        target: '_blank'
+  {
+    text: 'Events',
+    href: 'https://community.debtcollective.org/calendar',
+    target: '_blank'
+  },
+  {
+    text: 'Student Debt Strike',
+    href: 'https://strike.debtcollective.org',
+    target: '_blank'
+  },
+  {
+    text: 'Dispute Your Debt',
+    href: 'https://tools.debtcollective.org/',
+    target: '_blank'
+  },
+]);
+export class Header {
+  constructor() {
+    /**
+     * Link to follow in order to prompt user to donate
+     */
+    this.donateurl = "https://membership.debtcollective.org";
+    /**
+     * URL to the community
+     * without the latest "/"
+     */
+    this.community = "https://community.debtcollective.org";
+    /**
+     * URL to the member hub page
+     */
+    this.memberhuburl = "https://debtcollective.org/hub";
+    /**
+     * Logo image
+     */
+    this._logo = "logo.png";
+    this._logoSmall = "logo-small.png";
+  }
+  linksDidChangeHandler(newValue) {
+    if (!newValue) {
+      this._links = [];
+      return;
+    }
+    this._links = JSON.parse(newValue);
+  }
+  toggleMenuHandler() {
+    this.toggleMenu();
+  }
+  toggleMenu() {
+    this.isMenuOpen = !this.isMenuOpen;
+  }
+  async syncCurrentUser() {
+    const user = await syncCurrentUser(this.community);
+    this.user = user;
+    this.userSynced.emit(user);
+  }
+  componentWillLoad() {
+    this.linksDidChangeHandler(this.links);
+    return this.syncCurrentUser();
+  }
+  render() {
+    const linksToRender = this._links;
+    return (h(Host, null,
+      h("header", { class: "header" },
+        h("a", { class: "logo-link d-md-flex", href: "/" },
+          h("img", { class: "logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })),
+        h("button", { class: "btn-transparent logo-link d-md-none", onClick: this.toggleMenuHandler.bind(this) },
+          h("img", { class: "logo", src: this.logosmall || getAssetPath(`./assets/${this._logoSmall}`), alt: "The Debtcollective" }),
+          h("span", { class: "material-icons ml-1" }, "keyboard_arrow_right")),
+        h("nav", { class: "nav" },
+          h("slot", { name: "header" },
+            linksToRender.map(link => (h("div", { class: "nav-item d-md-flex" },
+              h("a", Object.assign({ class: "nav-link" }, omit(link, ['text'])), link.text)))),
+            h("dc-dropdown", { label: "Take Action!", items: TAKE_ACTION_LINKS }))),
+        h("div", { class: "session-items" }, this.user ? (h("dc-user-items", { user: this.user, community: this.community })) : (h("div", { class: "session-links" },
+          h("a", { href: loginURL({ community: this.community, host: this.host }), class: "btn btn-outline" },
+            h("span", { class: "d-md-flex" }, "Member"),
+            "\u00A0Login"),
+          h("a", { href: this.donateurl, class: "btn btn-primary" }, "Donate"))))),
+      h("dc-menu", { open: this.isMenuOpen, logo: this.logo },
+        h("slot", { name: "menu" }, linksToRender.map(link => (h("div", { class: "nav-item" },
+          h("a", Object.assign({ class: "nav-link" }, omit(link, ['text'])), link.text))))))));
+  }
+  static get is() { return "dc-header"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["dc-header.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["dc-header.css"]
+  }; }
+  static get assetsDirs() { return ["assets"]; }
+  static get properties() { return {
+    "links": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The links you need to display within the header\nthis string needs to be JSON (able to JSON.parse)"
+      },
+      "attribute": "links",
+      "reflect": false
     },
-    {
-        text: 'Student Debt Strike',
-        href: 'https://strike.debtcollective.org',
-        target: '_blank'
+    "donateurl": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Link to follow in order to prompt user to donate"
+      },
+      "attribute": "donateurl",
+      "reflect": false,
+      "defaultValue": "\"https://membership.debtcollective.org\""
     },
-    {
-        text: 'Dispute Your Debt',
-        href: 'https://tools.debtcollective.org/',
-        target: '_blank'
+    "community": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "URL to the community\nwithout the latest \"/\""
+      },
+      "attribute": "community",
+      "reflect": false,
+      "defaultValue": "\"https://community.debtcollective.org\""
     },
-]);
-export class Header {
-    constructor() {
-        /**
-         * Link to follow in order to prompt user to donate
-         */
-        this.donateurl = "https://membership.debtcollective.org";
-        /**
-         * URL to the community
-         * without the latest "/"
-         */
-        this.community = "https://community.debtcollective.org";
-        /**
-         * URL to the member hub page
-         */
-        this.memberhuburl = "https://debtcollective.org/hub";
-        /**
-         * Logo image
-         */
-        this._logo = "logo.png";
-        this._logoSmall = "logo-small.png";
+    "memberhuburl": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "URL to the member hub page"
+      },
+      "attribute": "memberhuburl",
+      "reflect": false,
+      "defaultValue": "\"https://debtcollective.org/hub\""
+    },
+    "host": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "URL to the component host\nwithout the latest \"/\""
+      },
+      "attribute": "host",
+      "reflect": false
+    },
+    "logo": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Logo src to use a custom image for the header"
+      },
+      "attribute": "logo",
+      "reflect": false
+    },
+    "logosmall": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Logo small src to use a custom image for the header in mobile"
+      },
+      "attribute": "logosmall",
+      "reflect": false
     }
-    linksDidChangeHandler(newValue) {
-        if (!newValue) {
-            this._links = [];
-            return;
-        }
-        this._links = JSON.parse(newValue);
-    }
-    toggleMenuHandler() {
-        this.toggleMenu();
-    }
-    toggleMenu() {
-        this.isMenuOpen = !this.isMenuOpen;
-    }
-    async syncCurrentUser() {
-        const user = await syncCurrentUser(this.community);
-        this.user = user;
-        this.userSynced.emit(user);
-    }
-    componentWillLoad() {
-        this.linksDidChangeHandler(this.links);
-        return this.syncCurrentUser();
-    }
-    render() {
-        const linksToRender = this._links;
-        return (h(Host, null,
-            h("header", { class: "header" },
-                h("a", { class: "logo-link d-md-flex", href: "/" },
-                    h("img", { class: "logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })),
-                h("button", { class: "btn-transparent logo-link d-md-none", onClick: this.toggleMenuHandler.bind(this) },
-                    h("img", { class: "logo", src: this.logosmall || getAssetPath(`./assets/${this._logoSmall}`), alt: "The Debtcollective" }),
-                    h("span", { class: "material-icons ml-1" }, "keyboard_arrow_right")),
-                h("nav", { class: "nav" },
-                    h("slot", { name: "header" },
-                        linksToRender.map(link => (h("div", { class: "nav-item d-md-flex" },
-                            h("a", Object.assign({ class: "nav-link" }, omit(link, ['text'])), link.text)))),
-                        h("dc-dropdown", { label: "Take Action!", items: TAKE_ACTION_LINKS }))),
-                h("div", { class: "session-items" }, this.user ? (h("dc-user-items", { user: this.user, community: this.community })) : (h("div", { class: "session-links" },
-                    h("a", { href: loginURL({ community: this.community, host: this.host }), class: "btn btn-outline" },
-                        h("span", { class: "d-md-flex" }, "Member"),
-                        "\u00A0Login"),
-                    h("a", { href: this.donateurl, class: "btn btn-primary" }, "Donate"))))),
-            h("dc-menu", { open: this.isMenuOpen, logo: this.logo },
-                h("slot", { name: "menu" }, linksToRender.map(link => (h("div", { class: "nav-item" },
-                    h("a", Object.assign({ class: "nav-link" }, omit(link, ['text'])), link.text))))))));
-    }
-    static get is() { return "dc-header"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() { return {
-        "$": ["dc-header.css"]
-    }; }
-    static get styleUrls() { return {
-        "$": ["dc-header.css"]
-    }; }
-    static get assetsDirs() { return ["assets"]; }
-    static get properties() { return {
-        "links": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "The links you need to display within the header\nthis string needs to be JSON (able to JSON.parse)"
-            },
-            "attribute": "links",
-            "reflect": false
-        },
-        "donateurl": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "Link to follow in order to prompt user to donate"
-            },
-            "attribute": "donateurl",
-            "reflect": false,
-            "defaultValue": "\"https://membership.debtcollective.org\""
-        },
-        "community": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "URL to the community\nwithout the latest \"/\""
-            },
-            "attribute": "community",
-            "reflect": false,
-            "defaultValue": "\"https://community.debtcollective.org\""
-        },
-        "memberhuburl": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": true,
-            "docs": {
-                "tags": [],
-                "text": "URL to the member hub page"
-            },
-            "attribute": "memberhuburl",
-            "reflect": false,
-            "defaultValue": "\"https://debtcollective.org/hub\""
-        },
-        "host": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "URL to the component host\nwithout the latest \"/\""
-            },
-            "attribute": "host",
-            "reflect": false
-        },
-        "logo": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "Logo src to use a custom image for the header"
-            },
-            "attribute": "logo",
-            "reflect": false
-        },
-        "logosmall": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "Logo small src to use a custom image for the header in mobile"
-            },
-            "attribute": "logosmall",
-            "reflect": false
-        }
-    }; }
-    static get states() { return {
-        "user": {},
-        "isMenuOpen": {}
-    }; }
-    static get events() { return [{
-            "method": "userSynced",
-            "name": "userSynced",
-            "bubbles": true,
-            "cancelable": true,
-            "composed": true,
-            "docs": {
-                "tags": [],
-                "text": "Emit event to exposed fetched user on host application\nTODO: Cannot find name User on EventEmitter<User>"
-            },
-            "complexType": {
-                "original": "any",
-                "resolved": "any",
-                "references": {}
-            }
-        }]; }
-    static get watchers() { return [{
-            "propName": "links",
-            "methodName": "linksDidChangeHandler"
-        }]; }
-    static get listeners() { return [{
-            "name": "toggleMenu",
-            "method": "toggleMenuHandler",
-            "target": undefined,
-            "capture": false,
-            "passive": false
-        }]; }
+  }; }
+  static get states() { return {
+    "user": {},
+    "isMenuOpen": {}
+  }; }
+  static get events() { return [{
+      "method": "userSynced",
+      "name": "userSynced",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "Emit event to exposed fetched user on host application\nTODO: Cannot find name User on EventEmitter<User>"
+      },
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      }
+    }]; }
+  static get watchers() { return [{
+      "propName": "links",
+      "methodName": "linksDidChangeHandler"
+    }]; }
+  static get listeners() { return [{
+      "name": "toggleMenu",
+      "method": "toggleMenuHandler",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }]; }
 }

dist/collection/components/dc-header/dc-menu.js

 import { Component, h, Event, Prop, getAssetPath } from "@stencil/core";
 export class Menu {
-    constructor() {
-        /**
-         * Logo image
-         */
-        this._logo = "logo.png";
+  constructor() {
+    /**
+     * Logo image
+     */
+    this._logo = "logo.png";
+  }
+  toggleMenuHandler() {
+    this.toggleMenu.emit();
+  }
+  render() {
+    return (h("div", { class: `menu-container ${this.open ? "open " : "hidden"}` },
+      h("div", { class: "menu-cloak", onClick: this.toggleMenuHandler.bind(this) }),
+      h("div", { class: "menu" },
+        h("div", { class: "nav-header" },
+          h("a", { href: "/" },
+            h("img", { class: "menu-logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })),
+          h("button", { class: "btn-transparent menu-close material-icons", "aria-label": "close menu", onClick: this.toggleMenuHandler.bind(this) }, "close")),
+        h("nav", { class: "menu-nav" },
+          h("slot", null)))));
+  }
+  static get is() { return "dc-menu"; }
+  static get originalStyleUrls() { return {
+    "$": ["dc-menu.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["dc-menu.css"]
+  }; }
+  static get assetsDirs() { return ["assets"]; }
+  static get properties() { return {
+    "open": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Wether or not the mobile menu is displayed"
+      },
+      "attribute": "open",
+      "reflect": false
+    },
+    "logo": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Logo src to use a custom image for the header"
+      },
+      "attribute": "logo",
+      "reflect": false
     }
-    toggleMenuHandler() {
-        this.toggleMenu.emit();
-    }
-    render() {
-        return (h("div", { class: `menu-container ${this.open ? "open " : "hidden"}` },
-            h("div", { class: "menu-cloak", onClick: this.toggleMenuHandler.bind(this) }),
-            h("div", { class: "menu" },
-                h("div", { class: "nav-header" },
-                    h("a", { href: "/" },
-                        h("img", { class: "menu-logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })),
-                    h("button", { class: "btn-transparent menu-close material-icons", "aria-label": "close menu", onClick: this.toggleMenuHandler.bind(this) }, "close")),
-                h("nav", { class: "menu-nav" },
-                    h("slot", null)))));
-    }
-    static get is() { return "dc-menu"; }
-    static get originalStyleUrls() { return {
-        "$": ["dc-menu.css"]
-    }; }
-    static get styleUrls() { return {
-        "$": ["dc-menu.css"]
-    }; }
-    static get assetsDirs() { return ["assets"]; }
-    static get properties() { return {
-        "open": {
-            "type": "boolean",
-            "mutable": false,
-            "complexType": {
-                "original": "boolean",
-                "resolved": "boolean",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "Wether or not the mobile menu is displayed"
-            },
-            "attribute": "open",
-            "reflect": false
-        },
-        "logo": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "Logo src to use a custom image for the header"
-            },
-            "attribute": "logo",
-            "reflect": false
-        }
-    }; }
-    static get events() { return [{
-            "method": "toggleMenu",
-            "name": "toggleMenu",
-            "bubbles": true,
-            "cancelable": true,
-            "composed": true,
-            "docs": {
-                "tags": [],
-                "text": ""
-            },
-            "complexType": {
-                "original": "void",
-                "resolved": "void",
-                "references": {}
-            }
-        }]; }
+  }; }
+  static get events() { return [{
+      "method": "toggleMenu",
+      "name": "toggleMenu",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "void",
+        "resolved": "void",
+        "references": {}
+      }
+    }]; }
 }

dist/collection/components/dc-header/dc-user-dropdown.js

@@ -5,133 +5,133 @@ import { Component, h, State, Prop, Listen } from "@stencil/core";
 export class UserPopup {
-    constructor() {
-        this.open = false;
+  constructor() {
+    this.open = false;
+  }
+  /**
+   * Event to detect outside clicks from the popup
+   */
+  handleClickOutside(event) {
+    var _a, _b;
+    const target = event.composedPath()[0];
+    if (((_a = this === null || this === void 0 ? void 0 : this.popupTriggerElement) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.popupItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
+      return;
     }
-    /**
-     * Event to detect outside clicks from the popup
-     */
-    handleClickOutside(event) {
-        var _a, _b;
-        const target = event.composedPath()[0];
-        if (((_a = this === null || this === void 0 ? void 0 : this.popupTriggerElement) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.popupItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
-            return;
-        }
-        this.closePopup();
+    this.closePopup();
+  }
+  /**
+   *  Event to detect escape key press
+   */
+  handleEscapeKey(event) {
+    if (event.keyCode === 27)
+      this.closePopup();
+  }
+  togglePopup() {
+    this.open = !this.open;
+  }
+  closePopup() {
+    this.open = false;
+  }
+  async handleLogout() {
+    try {
+      await logout(this.community, this.user.username);
     }
-    /**
-     *  Event to detect escape key press
-     */
-    handleEscapeKey(event) {
-        if (event.keyCode === 27)
-            this.closePopup();
+    finally {
+      window.location.reload();
     }
-    togglePopup() {
-        this.open = !this.open;
+  }
+  render() {
+    const items = [
+      {
+        text: 'Summary',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/summary`),
+        icon: 'account_circle'
+      },
+      {
+        text: 'Activity',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/activity`),
+        icon: 'subject'
+      },
+      {
+        text: 'Drafts',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/activity/drafts`),
+        icon: 'edit'
+      },
+      {
+        text: 'Preferences',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/preferences/account`),
+        icon: 'settings'
+      }
+    ];
+    return (h("div", { class: `user-dropdown-container` },
+      h("button", { class: "btn btn-transparent", onClick: this.togglePopup.bind(this), ref: (el) => this.popupTriggerElement = el },
+        h("img", { alt: "Profile picture", width: "32", height: "32", src: getAvatarURL(this.user, this.community), title: this.user.username, class: "avatar" }),
+        h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')),
+      h("div", { class: `user-dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closePopup.bind(this), ref: (el) => this.popupItems = el },
+        h("a", { href: preffixCommunityURL(this.community, `u/${this.user.username}`), class: "user-dropdown-item", target: "_blank" },
+          this.user.username,
+          h("small", null, "View Your Profile")),
+        items.map(item => (h("a", { href: item.href, class: "user-dropdown-item", target: "_blank" },
+          h("span", { class: "material-icons" }, item.icon),
+          item.text))),
+        h("button", { class: "btn btn-transparent user-dropdown-item", onClick: this.handleLogout.bind(this) },
+          h("span", { class: "material-icons" }, "exit_to_app"),
+          "Logout"))));
+  }
+  static get is() { return "dc-user-dropdown"; }
+  static get originalStyleUrls() { return {
+    "$": ["dc-user-dropdown.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["dc-user-dropdown.css"]
+  }; }
+  static get assetsDirs() { return ["assets"]; }
+  static get properties() { return {
+    "community": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "URL to the community"
+      },
+      "attribute": "community",
+      "reflect": false
+    },
+    "user": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "{\n    id: number;\n    admin: boolean;\n    avatar_template: string;\n    username: string;\n    unread_notifications: number;\n    unread_high_priority_notifications: number;\n  }",
+        "resolved": "{ id: number; admin: boolean; avatar_template: string; username: string; unread_notifications: number; unread_high_priority_notifications: number; }",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "An object with the user data. Follows Discourse structure as\nhttps://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get"
+      }
     }
-    closePopup() {
-        this.open = false;
-    }
-    async handleLogout() {
-        try {
-            await logout(this.community, this.user.username);
-        }
-        finally {
-            window.location.reload();
-        }
-    }
-    render() {
-        const items = [
-            {
-                text: 'Summary',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/summary`),
-                icon: 'account_circle'
-            },
-            {
-                text: 'Activity',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/activity`),
-                icon: 'subject'
-            },
-            {
-                text: 'Drafts',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/activity/drafts`),
-                icon: 'edit'
-            },
-            {
-                text: 'Preferences',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/preferences/account`),
-                icon: 'settings'
-            }
-        ];
-        return (h("div", { class: `user-dropdown-container` },
-            h("button", { class: "btn btn-transparent", onClick: this.togglePopup.bind(this), ref: (el) => this.popupTriggerElement = el },
-                h("img", { alt: "Profile picture", width: "32", height: "32", src: getAvatarURL(this.user, this.community), title: this.user.username, class: "avatar" }),
-                h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')),
-            h("div", { class: `user-dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closePopup.bind(this), ref: (el) => this.popupItems = el },
-                h("a", { href: preffixCommunityURL(this.community, `u/${this.user.username}`), class: "user-dropdown-item", target: "_blank" },
-                    this.user.username,
-                    h("small", null, "View Your Profile")),
-                items.map(item => (h("a", { href: item.href, class: "user-dropdown-item", target: "_blank" },
-                    h("span", { class: "material-icons" }, item.icon),
-                    item.text))),
-                h("button", { class: "btn btn-transparent user-dropdown-item", onClick: this.handleLogout.bind(this) },
-                    h("span", { class: "material-icons" }, "exit_to_app"),
-                    "Logout"))));
-    }
-    static get is() { return "dc-user-dropdown"; }
-    static get originalStyleUrls() { return {
-        "$": ["dc-user-dropdown.css"]
-    }; }
-    static get styleUrls() { return {
-        "$": ["dc-user-dropdown.css"]
-    }; }
-    static get assetsDirs() { return ["assets"]; }
-    static get properties() { return {
-        "community": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "URL to the community"
-            },
-            "attribute": "community",
-            "reflect": false
-        },
-        "user": {
-            "type": "unknown",
-            "mutable": false,
-            "complexType": {
-                "original": "{\n    id: number;\n    admin: boolean;\n    avatar_template: string;\n    username: string;\n    unread_notifications: number;\n    unread_high_priority_notifications: number;\n  }",
-                "resolved": "{ id: number; admin: boolean; avatar_template: string; username: string; unread_notifications: number; unread_high_priority_notifications: number; }",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "An object with the user data. Follows Discourse structure as\nhttps://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get"
-            }
-        }
-    }; }
-    static get states() { return {
-        "open": {}
-    }; }
-    static get listeners() { return [{
-            "name": "click",
-            "method": "handleClickOutside",
-            "target": "document",
-            "capture": false,
-            "passive": false
-        }, {
-            "name": "keydown",
-            "method": "handleEscapeKey",
-            "target": "document",
-            "capture": false,
-            "passive": false
-        }]; }
+  }; }
+  static get states() { return {
+    "open": {}
+  }; }
+  static get listeners() { return [{
+      "name": "click",
+      "method": "handleClickOutside",
+      "target": "document",
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "keydown",
+      "method": "handleEscapeKey",
+      "target": "document",
+      "capture": false,
+      "passive": false
+    }]; }
 }

dist/collection/components/dc-header/dc-user-items.js

@@ -5,57 +5,57 @@ import { Component, h, Host, Prop } from "@stencil/core";
 export class Menu {
-    render() {
-        const { unread_high_priority_notifications: inboxNoticeCount, unread_notifications: generalNoticeCount } = this.user;
-        return (h(Host, { class: "session-user-items" },
-            h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/messages`) },
-                h("div", { class: "notification-icon icons" },
-                    h("div", { id: "inbox", class: "material-icons" }, "email"),
-                    inboxNoticeCount !== 0 && (h("span", { class: "badge-notification unread-private-messages" }, inboxNoticeCount)))),
-            h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/notifications`) },
-                h("div", { class: "notification-icon icons" },
-                    h("div", { id: "notifications", class: "material-icons" }, "notifications"),
-                    generalNoticeCount !== 0 && (h("span", { class: "badge-notification unread-notifications" }, generalNoticeCount)))),
-            h("dc-user-dropdown", { user: this.user, community: this.community })));
+  render() {
+    const { unread_high_priority_notifications: inboxNoticeCount, unread_notifications: generalNoticeCount } = this.user;
+    return (h(Host, { class: "session-user-items" },
+      h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/messages`) },
+        h("div", { class: "notification-icon icons" },
+          h("div", { id: "inbox", class: "material-icons" }, "email"),
+          inboxNoticeCount !== 0 && (h("span", { class: "badge-notification unread-private-messages" }, inboxNoticeCount)))),
+      h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/notifications`) },
+        h("div", { class: "notification-icon icons" },
+          h("div", { id: "notifications", class: "material-icons" }, "notifications"),
+          generalNoticeCount !== 0 && (h("span", { class: "badge-notification unread-notifications" }, generalNoticeCount)))),
+      h("dc-user-dropdown", { user: this.user, community: this.community })));
+  }
+  static get is() { return "dc-user-items"; }
+  static get originalStyleUrls() { return {
+    "$": ["dc-user-items.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["dc-user-items.css"]
+  }; }
+  static get assetsDirs() { return ["assets"]; }
+  static get properties() { return {
+    "community": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "URL to the community"
+      },
+      "attribute": "community",
+      "reflect": false
+    },
+    "user": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "{\n    id: number;\n    admin: boolean;\n    avatar_template: string;\n    username: string;\n    unread_notifications: number;\n    unread_high_priority_notifications: number;\n  }",
+        "resolved": "{ id: number; admin: boolean; avatar_template: string; username: string; unread_notifications: number; unread_high_priority_notifications: number; }",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "An object with the user data. Follows Discourse structure as\nhttps://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get"
+      }
     }
-    static get is() { return "dc-user-items"; }
-    static get originalStyleUrls() { return {
-        "$": ["dc-user-items.css"]
-    }; }
-    static get styleUrls() { return {
-        "$": ["dc-user-items.css"]
-    }; }
-    static get assetsDirs() { return ["assets"]; }
-    static get properties() { return {
-        "community": {
-            "type": "string",
-            "mutable": false,
-            "complexType": {
-                "original": "string",
-                "resolved": "string",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "URL to the community"
-            },
-            "attribute": "community",
-            "reflect": false
-        },
-        "user": {
-            "type": "unknown",
-            "mutable": false,
-            "complexType": {
-                "original": "{\n    id: number;\n    admin: boolean;\n    avatar_template: string;\n    username: string;\n    unread_notifications: number;\n    unread_high_priority_notifications: number;\n  }",
-                "resolved": "{ id: number; admin: boolean; avatar_template: string; username: string; unread_notifications: number; unread_high_priority_notifications: number; }",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": "An object with the user data. Follows Discourse structure as\nhttps://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get"
-            }
-        }
-    }; }
+  }; }
 }

dist/collection/services/session.js

 // https://stackoverflow.com/a/33829607/1422380
 const getCSRFToken = async (discourseEndpoint) => {
-    const url = `${discourseEndpoint}/session/csrf.json`;
-    const response = await fetch(url, {
-        credentials: "include",
-        headers: {
-            Accept: "application/json",
-        },
-    });
-    if (!response.ok) {
-        throw "Error trying CSRF token";
-    }
-    const json = await response.json();
-    return json.csrf;
+  const url = `${discourseEndpoint}/session/csrf.json`;
+  const response = await fetch(url, {
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+    },
+  });
+  if (!response.ok) {
+    throw "Error trying CSRF token";
+  }
+  const json = await response.json();
+  return json.csrf;
 };
 const getCurrentUser = async (discourseEndpoint, { csrfToken }) => {
-    const url = `${discourseEndpoint}/session/current.json`;
-    const response = await fetch(url, {
-        credentials: "include",
-        headers: {
-            Accept: "application/json",
-            "X-CSRF-Token": csrfToken,
-        },
-    });
-    // Could be the case for no active session
-    if (!response.ok) {
-        return;
-    }
-    const json = await response.json();
-    const { current_user: currentUser } = json;
-    return currentUser;
+  const url = `${discourseEndpoint}/session/current.json`;
+  const response = await fetch(url, {
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+      "X-CSRF-Token": csrfToken,
+    },
+  });
+  // Could be the case for no active session
+  if (!response.ok) {
+    return;
+  }
+  const json = await response.json();
+  const { current_user: currentUser } = json;
+  return currentUser;
 };
 export const syncCurrentUser = async (discourseEndpoint) => {
-    let currentUser;
-    try {
-        const csrfToken = await getCSRFToken(discourseEndpoint);
-        currentUser = await getCurrentUser(discourseEndpoint, { csrfToken });
-    }
-    catch (error) {
-        console.error(error);
-    }
-    return currentUser;
+  let currentUser;
+  try {
+    const csrfToken = await getCSRFToken(discourseEndpoint);
+    currentUser = await getCurrentUser(discourseEndpoint, { csrfToken });
+  }
+  catch (error) {
+    console.error(error);
+  }
+  return currentUser;
 };
 export const logout = async (discourseEndpoint, username) => {
-    const url = `${discourseEndpoint}/session/${username}`;
-    const csrfToken = await getCSRFToken(discourseEndpoint);
-    try {
-        await fetch(url, {
-            method: "DELETE",
-            credentials: "include",
-            headers: {
-                Accept: "application/json",
-                "X-CSRF-Token": csrfToken,
-            },
-        });
-    }
-    catch (error) {
-        console.error(error);
-    }
+  const url = `${discourseEndpoint}/session/${username}`;
+  const csrfToken = await getCSRFToken(discourseEndpoint);
+  try {
+    await fetch(url, {
+      method: "DELETE",
+      credentials: "include",
+      headers: {
+        Accept: "application/json",
+        "X-CSRF-Token": csrfToken,
+      },
+    });
+  }
+  catch (error) {
+    console.error(error);
+  }
 };

dist/collection/utils/community.js

@@ -26,3 +26,3 @@ const redirectParam = host => `return_url=${host}`;
 export const getAvatarURL = ({ avatar_template }, community, size = 64) => {
-    return preffixCommunityURL(community, avatar_template.replace(`{size}`, size));
+  return preffixCommunityURL(community, avatar_template.replace(`{size}`, size));
 };

dist/esm/dc-collapser.entry.js

@@ -1,2 +0,2 @@
-import './index-0a11e596.js';
-export { C as dc_collapser } from './dc-collapser-e0e0b0c8.js';
+import './index-7fce0d77.js';
+export { C as dc_collapser } from './dc-collapser-d40f98ff.js';

dist/esm/dc-dropdown_5.entry.js

@@ -1,39 +0,39 @@
-import { r as registerInstance, h, c as createEvent, g as getAssetPath, H as Host } from './index-0a11e596.js';
-import { l as lodash_omit } from './dc-collapser-e0e0b0c8.js';
+import { r as registerInstance, h, c as createEvent, g as getAssetPath, H as Host } from './index-7fce0d77.js';
+import { l as lodash_omit } from './dc-collapser-d40f98ff.js';
 
-const dcDropdownCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif;display:inline-block;font-family:var(--main-font)}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;-webkit-transition:color 0.216s ease;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .btn{-ms-flex-align:center;align-items:center;border-radius:0.25rem;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:0.5rem 1rem;-webkit-transition:background 0.216s ease, color 0.216s ease;transition:background 0.216s ease, color 0.216s ease}:host .btn-transparent{background:none;border:none;display:-ms-flexbox;display:flex;font-size:var(--font-size);padding:0}:host .dropdown-container{position:relative}:host .dropdown-items{background-color:var(--main-bg-color);border-radius:0.5rem 0 0.5rem 0.5rem;-webkit-box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);cursor:pointer;left:0;padding:0;position:absolute;top:2.5rem;width:16rem}:host .dropdown-items.open{list-style:none;opacity:1;-webkit-transition:opacity 0.1s ease-in;transition:opacity 0.1s ease-in;visibility:visible}:host .dropdown-items.hidden{opacity:0;visibility:hidden}:host .dropdown-items .dropdown-item{-ms-flex-align:center;align-items:center;color:var(--disabled-text-color);display:-ms-flexbox;display:flex;font-size:0.875rem;font-weight:600;-ms-flex-pack:start;justify-content:start;min-height:2rem;padding:0.5rem 1rem;text-decoration:none}:host .dropdown-items .dropdown-item:hover,:host .dropdown-items .dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);color:var(--brand-color);-webkit-transition:background-color 0.1s ease-in;transition:background-color 0.1s ease-in}:host .dropdown-items .dropdown-item .dropdown-item-description{color:var(--text-color);font-size:0.75rem;line-height:1rem}:host .material-icons{color:var(--text-color);direction:ltr;display:inline-block;font-family:\"Material Icons\";font-size:24px;font-style:normal;font-weight:normal;letter-spacing:normal;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;-webkit-font-feature-settings:\"liga\";font-feature-settings:\"liga\"}";
+const dcDropdownCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif;display:inline-block;font-family:var(--main-font)}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .btn{align-items:center;border-radius:0.25rem;cursor:pointer;display:flex;justify-content:space-between;padding:0.5rem 1rem;transition:background 0.216s ease, color 0.216s ease}:host .btn-transparent{background:none;border:none;display:flex;font-size:var(--font-size);padding:0}:host .dropdown-container{position:relative}:host .dropdown-items{background-color:var(--main-bg-color);border-radius:0.5rem 0 0.5rem 0.5rem;box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);cursor:pointer;left:0;padding:0;position:absolute;top:2.5rem;width:16rem}:host .dropdown-items.open{list-style:none;opacity:1;transition:opacity 0.1s ease-in;visibility:visible}:host .dropdown-items.hidden{opacity:0;visibility:hidden}:host .dropdown-items .dropdown-item{align-items:center;color:var(--disabled-text-color);display:flex;font-size:0.875rem;font-weight:600;justify-content:start;min-height:2rem;padding:0.5rem 1rem;text-decoration:none}:host .dropdown-items .dropdown-item:hover,:host .dropdown-items .dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);color:var(--brand-color);transition:background-color 0.1s ease-in}:host .dropdown-items .dropdown-item .dropdown-item-description{color:var(--text-color);font-size:0.75rem;line-height:1rem}:host .material-icons{color:var(--text-color);direction:ltr;display:inline-block;font-family:\"Material Icons\";font-size:24px;font-style:normal;font-weight:normal;letter-spacing:normal;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}";
 
 const DcDropdown = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  /**
+   * Event to detect outside clicks from the dropdown
+   */
+  handleClickOutside(event) {
+    var _a, _b;
+    const target = event.composedPath()[0];
+    if (((_a = this === null || this === void 0 ? void 0 : this.dropdownTrigger) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.dropdownItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
+      return;
     }
-    /**
-     * Event to detect outside clicks from the dropdown
-     */
-    handleClickOutside(event) {
-        var _a, _b;
-        const target = event.composedPath()[0];
-        if (((_a = this === null || this === void 0 ? void 0 : this.dropdownTrigger) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.dropdownItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
-            return;
-        }
-        this.closeDropdown();
-    }
-    /**
-     * Event to detect escape key press
-     */
-    handleEscapeKey(event) {
-        if (event.keyCode === 27)
-            this.closeDropdown();
-    }
-    toggleDropdown() {
-        this.open = !this.open;
-    }
-    closeDropdown() {
-        this.open = false;
-    }
-    render() {
-        //TODO: @Watch approach seems to not work correctly
-        const _items = JSON.parse(this.items);
-        return (h("div", { class: "dropdown-container nav-item" }, h("button", { class: "nav-link btn btn-transparent", onClick: this.toggleDropdown.bind(this), ref: (el) => this.dropdownTrigger = el }, this.label || '', h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), h("div", { class: `dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closeDropdown.bind(this), ref: (el) => this.dropdownItems = el }, _items === null || _items === void 0 ? void 0 : _items.map(item => (h("a", Object.assign({ class: "dropdown-item" }, lodash_omit(item, ['text'])), item.text))))));
-    }
+    this.closeDropdown();
+  }
+  /**
+   * Event to detect escape key press
+   */
+  handleEscapeKey(event) {
+    if (event.keyCode === 27)
+      this.closeDropdown();
+  }
+  toggleDropdown() {
+    this.open = !this.open;
+  }
+  closeDropdown() {
+    this.open = false;
+  }
+  render() {
+    //TODO: @Watch approach seems to not work correctly
+    const _items = JSON.parse(this.items);
+    return (h("div", { class: "dropdown-container nav-item" }, h("button", { class: "nav-link btn btn-transparent", onClick: this.toggleDropdown.bind(this), ref: (el) => this.dropdownTrigger = el }, this.label || '', h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), h("div", { class: `dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closeDropdown.bind(this), ref: (el) => this.dropdownItems = el }, _items === null || _items === void 0 ? void 0 : _items.map(item => (h("a", Object.assign({ class: "dropdown-item" }, lodash_omit(item, ['text'])), item.text))))));
+  }
 };
@@ -44,79 +44,79 @@ DcDropdown.style = dcDropdownCss;
 const getCSRFToken = async (discourseEndpoint) => {
-    const url = `${discourseEndpoint}/session/csrf.json`;
-    const response = await fetch(url, {
-        credentials: "include",
-        headers: {
-            Accept: "application/json",
-        },
-    });
-    if (!response.ok) {
-        throw "Error trying CSRF token";
-    }
-    const json = await response.json();
-    return json.csrf;
+  const url = `${discourseEndpoint}/session/csrf.json`;
+  const response = await fetch(url, {
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+    },
+  });
+  if (!response.ok) {
+    throw "Error trying CSRF token";
+  }
+  const json = await response.json();
+  return json.csrf;
 };
 const getCurrentUser = async (discourseEndpoint, { csrfToken }) => {
-    const url = `${discourseEndpoint}/session/current.json`;
-    const response = await fetch(url, {
-        credentials: "include",
-        headers: {
-            Accept: "application/json",
-            "X-CSRF-Token": csrfToken,
-        },
-    });
-    // Could be the case for no active session
-    if (!response.ok) {
-        return;
-    }
-    const json = await response.json();
-    const { current_user: currentUser } = json;
-    return currentUser;
+  const url = `${discourseEndpoint}/session/current.json`;
+  const response = await fetch(url, {
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+      "X-CSRF-Token": csrfToken,
+    },
+  });
+  // Could be the case for no active session
+  if (!response.ok) {
+    return;
+  }
+  const json = await response.json();
+  const { current_user: currentUser } = json;
+  return currentUser;
 };
 const syncCurrentUser = async (discourseEndpoint) => {
-    let currentUser;
-    try {
-        const csrfToken = await getCSRFToken(discourseEndpoint);
-        currentUser = await getCurrentUser(discourseEndpoint, { csrfToken });
-    }
-    catch (error) {
-        console.error(error);
-    }
-    return currentUser;
+  let currentUser;
+  try {
+    const csrfToken = await getCSRFToken(discourseEndpoint);
+    currentUser = await getCurrentUser(discourseEndpoint, { csrfToken });
+  }
+  catch (error) {
+    console.error(error);
+  }
+  return currentUser;
 };
 const logout = async (discourseEndpoint, username) => {
-    const url = `${discourseEndpoint}/session/${username}`;
-    const csrfToken = await getCSRFToken(discourseEndpoint);
-    try {
-        await fetch(url, {
-            method: "DELETE",
-            credentials: "include",
-            headers: {
-                Accept: "application/json",
-                "X-CSRF-Token": csrfToken,
-            },
-        });
-    }
-    catch (error) {
-        console.error(error);
-    }
+  const url = `${discourseEndpoint}/session/${username}`;
+  const csrfToken = await getCSRFToken(discourseEndpoint);
+  try {
+    await fetch(url, {
+      method: "DELETE",
+      credentials: "include",
+      headers: {
+        Accept: "application/json",
+        "X-CSRF-Token": csrfToken,
+      },
+    });
+  }
+  catch (error) {
+    console.error(error);
+  }
 };
 
-const dcMenuCss = ":host .menu-container.open .menu{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}:host .menu-container.hidden .menu{-webkit-transform:translate3d(-100%, 0, 0);transform:translate3d(-100%, 0, 0)}:host .menu{-webkit-backface-visibility:hidden;-ms-flex-align:start;align-items:flex-start;backface-visibility:hidden;background-color:var(--main-bg-color);-webkit-box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100vh;-ms-flex-pack:start;justify-content:flex-start;left:0;padding:0;position:fixed;top:0;-webkit-transition:-webkit-transform ease 0.216s;transition:-webkit-transform ease 0.216s;transition:transform ease 0.216s;transition:transform ease 0.216s, -webkit-transform ease 0.216s;width:75%;z-index:var(--z-index)}:host .menu-cloak{height:100vh;width:100vw;position:fixed;background-color:black;opacity:0.5;top:0;left:0;z-index:var(--z-index)}:host .menu-container.open .menu-cloak{display:block}:host .menu-container.hidden .menu-cloak{display:none}:host .menu-close{-ms-flex-align:center;align-items:center;background:rgba(57,57,57,0.07);border-radius:50%;display:-ms-flexbox;display:flex;font-size:1rem;padding:0.5rem}:host .menu-logo{width:50%}:host .nav-header{-ms-flex-align:center;align-items:center;border-bottom:0.0625rem solid #e8e8e8;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:1rem;padding:1.5rem var(--column-gap);width:100%}:host .menu-nav .nav-item{margin-bottom:1rem}";
+const dcMenuCss = ":host .menu-container.open .menu{transform:translate3d(0, 0, 0)}:host .menu-container.hidden .menu{transform:translate3d(-100%, 0, 0)}:host .menu{-webkit-backface-visibility:hidden;align-items:flex-start;backface-visibility:hidden;background-color:var(--main-bg-color);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-sizing:border-box;display:flex;flex-direction:column;height:100vh;justify-content:flex-start;left:0;padding:0;position:fixed;top:0;transition:transform ease 0.216s;width:75%;z-index:var(--z-index)}:host .menu-cloak{height:100vh;width:100vw;position:fixed;background-color:black;opacity:0.5;top:0;left:0;z-index:var(--z-index)}:host .menu-container.open .menu-cloak{display:block}:host .menu-container.hidden .menu-cloak{display:none}:host .menu-close{align-items:center;background:rgba(57,57,57,0.07);border-radius:50%;display:flex;font-size:1rem;padding:0.5rem}:host .menu-logo{width:50%}:host .nav-header{align-items:center;border-bottom:0.0625rem solid #e8e8e8;box-sizing:border-box;display:flex;justify-content:space-between;margin-bottom:1rem;padding:1.5rem var(--column-gap);width:100%}:host .menu-nav .nav-item{margin-bottom:1rem}";
 
 const Menu = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.toggleMenu = createEvent(this, "toggleMenu", 7);
-        /**
-         * Logo image
-         */
-        this._logo = "logo.png";
-    }
-    toggleMenuHandler() {
-        this.toggleMenu.emit();
-    }
-    render() {
-        return (h("div", { class: `menu-container ${this.open ? "open " : "hidden"}` }, h("div", { class: "menu-cloak", onClick: this.toggleMenuHandler.bind(this) }), h("div", { class: "menu" }, h("div", { class: "nav-header" }, h("a", { href: "/" }, h("img", { class: "menu-logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), h("button", { class: "btn-transparent menu-close material-icons", "aria-label": "close menu", onClick: this.toggleMenuHandler.bind(this) }, "close")), h("nav", { class: "menu-nav" }, h("slot", null)))));
-    }
-    static get assetsDirs() { return ["assets"]; }
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.toggleMenu = createEvent(this, "toggleMenu", 7);
+    /**
+     * Logo image
+     */
+    this._logo = "logo.png";
+  }
+  toggleMenuHandler() {
+    this.toggleMenu.emit();
+  }
+  render() {
+    return (h("div", { class: `menu-container ${this.open ? "open " : "hidden"}` }, h("div", { class: "menu-cloak", onClick: this.toggleMenuHandler.bind(this) }), h("div", { class: "menu" }, h("div", { class: "nav-header" }, h("a", { href: "/" }, h("img", { class: "menu-logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), h("button", { class: "btn-transparent menu-close material-icons", "aria-label": "close menu", onClick: this.toggleMenuHandler.bind(this) }, "close")), h("nav", { class: "menu-nav" }, h("slot", null)))));
+  }
+  static get assetsDirs() { return ["assets"]; }
 };
@@ -145,160 +145,160 @@ Menu.style = dcMenuCss;
 const getAvatarURL = ({ avatar_template }, community, size = 64) => {
-    return preffixCommunityURL(community, avatar_template.replace(`{size}`, size));
+  return preffixCommunityURL(community, avatar_template.replace(`{size}`, size));
 };
 
-const dcUserDropdownCss = ":host .user-dropdown-container{position:relative}:host .user-dropdown-items{position:absolute;top:2.5rem;right:0;border-radius:0.5rem 0 0.5rem 0.5rem;background-color:var(--main-bg-color);padding:0;cursor:pointer;width:16rem;-webkit-box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12);box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12)}:host .user-dropdown-items.open{opacity:1;-webkit-transition:opacity 0.1s ease-in;transition:opacity 0.1s ease-in;visibility:visible;list-style:none}:host .user-dropdown-items.hidden{visibility:hidden;opacity:0}:host .user-dropdown-items .user-dropdown-item{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:start;padding:0.5rem 1rem;min-height:2rem;color:var(--disabled-text-color);font-size:0.875rem;font-weight:600}:host .user-dropdown-items .user-dropdown-item:first-child{-ms-flex-pack:justify;justify-content:space-between}:host .user-dropdown-items .user-dropdown-item:last-child{width:100%}:host .user-dropdown-items .user-dropdown-item:hover,:host .user-dropdown-items .user-dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);-webkit-transition:background-color 0.1s ease-in;transition:background-color 0.1s ease-in;color:var(--brand-color)}:host .user-dropdown-items .user-dropdown-item .user-dropdown-item-description{font-size:0.75rem;line-height:1rem;color:var(--text-color)}";
+const dcUserDropdownCss = ":host .user-dropdown-container{position:relative}:host .user-dropdown-items{position:absolute;top:2.5rem;right:0;border-radius:0.5rem 0 0.5rem 0.5rem;background-color:var(--main-bg-color);padding:0;cursor:pointer;width:16rem;box-shadow:0 0 0.5rem rgba(37, 40, 43, 0.12)}:host .user-dropdown-items.open{opacity:1;transition:opacity 0.1s ease-in;visibility:visible;list-style:none}:host .user-dropdown-items.hidden{visibility:hidden;opacity:0}:host .user-dropdown-items .user-dropdown-item{display:flex;align-items:center;justify-content:start;padding:0.5rem 1rem;min-height:2rem;color:var(--disabled-text-color);font-size:0.875rem;font-weight:600}:host .user-dropdown-items .user-dropdown-item:first-child{justify-content:space-between}:host .user-dropdown-items .user-dropdown-item:last-child{width:100%}:host .user-dropdown-items .user-dropdown-item:hover,:host .user-dropdown-items .user-dropdown-item:focus{background-color:rgba(255, 70, 48, 0.1);transition:background-color 0.1s ease-in;color:var(--brand-color)}:host .user-dropdown-items .user-dropdown-item .user-dropdown-item-description{font-size:0.75rem;line-height:1rem;color:var(--text-color)}";
 
 const UserPopup = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.open = false;
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.open = false;
+  }
+  /**
+   * Event to detect outside clicks from the popup
+   */
+  handleClickOutside(event) {
+    var _a, _b;
+    const target = event.composedPath()[0];
+    if (((_a = this === null || this === void 0 ? void 0 : this.popupTriggerElement) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.popupItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
+      return;
     }
-    /**
-     * Event to detect outside clicks from the popup
-     */
-    handleClickOutside(event) {
-        var _a, _b;
-        const target = event.composedPath()[0];
-        if (((_a = this === null || this === void 0 ? void 0 : this.popupTriggerElement) === null || _a === void 0 ? void 0 : _a.contains(target)) || ((_b = this === null || this === void 0 ? void 0 : this.popupItems) === null || _b === void 0 ? void 0 : _b.contains(target))) {
-            return;
-        }
-        this.closePopup();
+    this.closePopup();
+  }
+  /**
+   *  Event to detect escape key press
+   */
+  handleEscapeKey(event) {
+    if (event.keyCode === 27)
+      this.closePopup();
+  }
+  togglePopup() {
+    this.open = !this.open;
+  }
+  closePopup() {
+    this.open = false;
+  }
+  async handleLogout() {
+    try {
+      await logout(this.community, this.user.username);
     }
-    /**
-     *  Event to detect escape key press
-     */
-    handleEscapeKey(event) {
-        if (event.keyCode === 27)
-            this.closePopup();
+    finally {
+      window.location.reload();
     }
-    togglePopup() {
-        this.open = !this.open;
-    }
-    closePopup() {
-        this.open = false;
-    }
-    async handleLogout() {
-        try {
-            await logout(this.community, this.user.username);
-        }
-        finally {
-            window.location.reload();
-        }
-    }
-    render() {
-        const items = [
-            {
-                text: 'Summary',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/summary`),
-                icon: 'account_circle'
-            },
-            {
-                text: 'Activity',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/activity`),
-                icon: 'subject'
-            },
-            {
-                text: 'Drafts',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/activity/drafts`),
-                icon: 'edit'
-            },
-            {
-                text: 'Preferences',
-                href: preffixCommunityURL(this.community, `u/${this.user.username}/preferences/account`),
-                icon: 'settings'
-            }
-        ];
-        return (h("div", { class: `user-dropdown-container` }, h("button", { class: "btn btn-transparent", onClick: this.togglePopup.bind(this), ref: (el) => this.popupTriggerElement = el }, h("img", { alt: "Profile picture", width: "32", height: "32", src: getAvatarURL(this.user, this.community), title: this.user.username, class: "avatar" }), h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), h("div", { class: `user-dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closePopup.bind(this), ref: (el) => this.popupItems = el }, h("a", { href: preffixCommunityURL(this.community, `u/${this.user.username}`), class: "user-dropdown-item", target: "_blank" }, this.user.username, h("small", null, "View Your Profile")), items.map(item => (h("a", { href: item.href, class: "user-dropdown-item", target: "_blank" }, h("span", { class: "material-icons" }, item.icon), item.text))), h("button", { class: "btn btn-transparent user-dropdown-item", onClick: this.handleLogout.bind(this) }, h("span", { class: "material-icons" }, "exit_to_app"), "Logout"))));
-    }
-    static get assetsDirs() { return ["assets"]; }
+  }
+  render() {
+    const items = [
+      {
+        text: 'Summary',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/summary`),
+        icon: 'account_circle'
+      },
+      {
+        text: 'Activity',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/activity`),
+        icon: 'subject'
+      },
+      {
+        text: 'Drafts',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/activity/drafts`),
+        icon: 'edit'
+      },
+      {
+        text: 'Preferences',
+        href: preffixCommunityURL(this.community, `u/${this.user.username}/preferences/account`),
+        icon: 'settings'
+      }
+    ];
+    return (h("div", { class: `user-dropdown-container` }, h("button", { class: "btn btn-transparent", onClick: this.togglePopup.bind(this), ref: (el) => this.popupTriggerElement = el }, h("img", { alt: "Profile picture", width: "32", height: "32", src: getAvatarURL(this.user, this.community), title: this.user.username, class: "avatar" }), h("span", { class: "material-icons" }, this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down')), h("div", { class: `user-dropdown-items ${this.open ? "open " : "hidden"}`, onMouseLeave: this.closePopup.bind(this), ref: (el) => this.popupItems = el }, h("a", { href: preffixCommunityURL(this.community, `u/${this.user.username}`), class: "user-dropdown-item", target: "_blank" }, this.user.username, h("small", null, "View Your Profile")), items.map(item => (h("a", { href: item.href, class: "user-dropdown-item", target: "_blank" }, h("span", { class: "material-icons" }, item.icon), item.text))), h("button", { class: "btn btn-transparent user-dropdown-item", onClick: this.handleLogout.bind(this) }, h("span", { class: "material-icons" }, "exit_to_app"), "Logout"))));
+  }
+  static get assetsDirs() { return ["assets"]; }
 };
 UserPopup.style = dcUserDropdownCss;
 
-const dcUserItemsCss = ":host .session-user-items{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .notification-link{margin-left:.5rem}:host .notification-icon{position:relative}:host .badge-notification{background:#bdbdbd;border-radius:10px;color:#fff;display:inline-block;font-size:.7579em;font-weight:normal;left:-2px;line-height:1;padding:0.21em 0.42em;position:absolute;text-align:center;top:-4px;white-space:nowrap;z-index:1}:host .unread-notifications{background-color:#6cf}";
+const dcUserItemsCss = ":host .session-user-items{display:flex;align-items:center}:host .notification-link{margin-left:.5rem}:host .notification-icon{position:relative}:host .badge-notification{background:#bdbdbd;border-radius:10px;color:#fff;display:inline-block;font-size:.7579em;font-weight:normal;left:-2px;line-height:1;padding:0.21em 0.42em;position:absolute;text-align:center;top:-4px;white-space:nowrap;z-index:1}:host .unread-notifications{background-color:#6cf}";
 
 const Menu$1 = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    render() {
-        const { unread_high_priority_notifications: inboxNoticeCount, unread_notifications: generalNoticeCount } = this.user;
-        return (h(Host, { class: "session-user-items" }, h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/messages`) }, h("div", { class: "notification-icon icons" }, h("div", { id: "inbox", class: "material-icons" }, "email"), inboxNoticeCount !== 0 && (h("span", { class: "badge-notification unread-private-messages" }, inboxNoticeCount)))), h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/notifications`) }, h("div", { class: "notification-icon icons" }, h("div", { id: "notifications", class: "material-icons" }, "notifications"), generalNoticeCount !== 0 && (h("span", { class: "badge-notification unread-notifications" }, generalNoticeCount)))), h("dc-user-dropdown", { user: this.user, community: this.community })));
-    }
-    static get assetsDirs() { return ["assets"]; }
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  render() {
+    const { unread_high_priority_notifications: inboxNoticeCount, unread_notifications: generalNoticeCount } = this.user;
+    return (h(Host, { class: "session-user-items" }, h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/messages`) }, h("div", { class: "notification-icon icons" }, h("div", { id: "inbox", class: "material-icons" }, "email"), inboxNoticeCount !== 0 && (h("span", { class: "badge-notification unread-private-messages" }, inboxNoticeCount)))), h("a", { class: "notification-link", href: preffixCommunityURL(this.community, `u/${this.user.username}/notifications`) }, h("div", { class: "notification-icon icons" }, h("div", { id: "notifications", class: "material-icons" }, "notifications"), generalNoticeCount !== 0 && (h("span", { class: "badge-notification unread-notifications" }, generalNoticeCount)))), h("dc-user-dropdown", { user: this.user, community: this.community })));
+  }
+  static get assetsDirs() { return ["assets"]; }
 };
 Menu$1.style = dcUserItemsCss;
 
-const dcHeaderCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif}:host *{font-family:var(--main-font)}:host a{text-decoration:none}:host .header{-webkit-backface-visibility:hidden;-ms-flex-align:center;align-items:center;backface-visibility:hidden;background-color:var(--main-bg-color);-webkit-box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;height:5rem;-ms-flex-pack:start;justify-content:flex-start;left:0;padding:0 var(--column-gap);position:fixed;top:0;width:100%;z-index:var(--z-index)}:host .logo{height:2.667em;position:relative;width:auto}:host .logo-link{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:1rem}:host .nav{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;-webkit-transition:color 0.216s ease;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .avatar{border-radius:50%;width:2.1333em;height:2.1333em}:host #current-user{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:2.2857em;height:2.2857em;padding:0.2143em;padding-right:0;cursor:pointer;outline:none}:host .session-items{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:1rem}:host .session-items .material-icons{font-size:1.25rem;padding:0.2143em;text-decoration:none;cursor:pointer}:host .avatar{margin-left:.5rem}:host .session-links{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .btn{-ms-flex-align:center;align-items:center;border-radius:0.25rem;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:0.5rem 1rem;-webkit-transition:background 0.216s ease, color 0.216s ease;transition:background 0.216s ease, color 0.216s ease}:host .btn-outline{background:transparent;border:0.0625rem solid var(--text-color);color:var(--text-color)}:host .btn-outline:hover{background:var(--outline-button-hover-color)}:host .btn-primary{background:var(--button-color);border:0.0625rem solid var(--button-color);color:#fff}:host .btn-primary:hover{border:0.0625rem solid var(--button-hover-color);background:var(--button-hover-color)}:host .header .btn+.btn{margin-left:0.4375rem}:host .btn-transparent{background:none;border:none;display:-ms-flexbox;display:flex;font-size:var(--font-size);padding:0}.ml-1{margin-left:0.25rem}:host .d-md-flex{display:none}@media (min-width: 1024px){:host .d-md-flex{display:-ms-flexbox;display:flex}}:host .d-md-none{display:-ms-flexbox;display:flex}@media (min-width: 1024px){:host .d-md-none{display:none}}:host .material-icons{color:var(--text-color);font-family:\"Material Icons\";font-weight:normal;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;-webkit-font-feature-settings:\"liga\";font-feature-settings:\"liga\"}";
+const dcHeaderCss = ":host{--brand-color:#ff4630;--button-color:#ff4630;--button-hover-color:#ee2812;--outline-button-hover-color:#FFFBEA;--text-color:#2b2b2b;--disabled-text-color:#52575C;--font-size:1rem;--column-gap:15px;--main-bg-color:#fbfbfb;--z-index:1000;--main-font:\"Libre Franklin\", sans-serif}:host *{font-family:var(--main-font)}:host a{text-decoration:none}:host .header{-webkit-backface-visibility:hidden;align-items:center;backface-visibility:hidden;background-color:var(--main-bg-color);box-shadow:0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.25);box-sizing:border-box;display:flex;height:5rem;justify-content:flex-start;left:0;padding:0 var(--column-gap);position:fixed;top:0;width:100%;z-index:var(--z-index)}:host .logo{height:2.667em;position:relative;width:auto}:host .logo-link{display:flex;align-items:center;margin-right:1rem}:host .nav{align-items:center;display:flex;flex:1}:host .nav-item{padding:0 0.625rem}:host .nav-link{color:var(--text-color);font-size:var(--font-size);font-weight:600;line-height:1.2;text-decoration:none;transition:color 0.216s ease}:host .nav-link:visited{color:var(--text-color)}:host .nav-link:hover{color:var(--brand-color)}:host .avatar{border-radius:50%;width:2.1333em;height:2.1333em}:host #current-user{position:relative;display:flex;align-items:center;justify-content:center;width:2.2857em;height:2.2857em;padding:0.2143em;padding-right:0;cursor:pointer;outline:none}:host .session-items{display:flex;align-items:center;margin-left:1rem}:host .session-items .material-icons{font-size:1.25rem;padding:0.2143em;text-decoration:none;cursor:pointer}:host .avatar{margin-left:.5rem}:host .session-links{display:flex;align-items:center}:host .btn{align-items:center;border-radius:0.25rem;cursor:pointer;display:flex;justify-content:space-between;padding:0.5rem 1rem;transition:background 0.216s ease, color 0.216s ease}:host .btn-outline{background:transparent;border:0.0625rem solid var(--text-color);color:var(--text-color)}:host .btn-outline:hover{background:var(--outline-button-hover-color)}:host .btn-primary{background:var(--button-color);border:0.0625rem solid var(--button-color);color:#fff}:host .btn-primary:hover{border:0.0625rem solid var(--button-hover-color);background:var(--button-hover-color)}:host .header .btn+.btn{margin-left:0.4375rem}:host .btn-transparent{background:none;border:none;display:flex;font-size:var(--font-size);padding:0}.ml-1{margin-left:0.25rem}:host .d-md-flex{display:none}@media (min-width: 1024px){:host .d-md-flex{display:flex}}:host .d-md-none{display:flex}@media (min-width: 1024px){:host .d-md-none{display:none}}:host .material-icons{color:var(--text-color);font-family:\"Material Icons\";font-weight:normal;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}";
 
 // dc-dropdown.items accepts strings
 const TAKE_ACTION_LINKS = JSON.stringify([
-    {
-        text: 'Events',
-        href: 'https://community.debtcollective.org/calendar',
-        target: '_blank'
-    },
-    {
-        text: 'Student Debt Strike',
-        href: 'https://strike.debtcollective.org',
-        target: '_blank'
-    },
-    {
-        text: 'Dispute Your Debt',
-        href: 'https://tools.debtcollective.org/',
-        target: '_blank'
-    },
+  {
+    text: 'Events',
+    href: 'https://community.debtcollective.org/calendar',
+    target: '_blank'
+  },
+  {
+    text: 'Student Debt Strike',
+    href: 'https://strike.debtcollective.org',
+    target: '_blank'
+  },
+  {
+    text: 'Dispute Your Debt',
+    href: 'https://tools.debtcollective.org/',
+    target: '_blank'
+  },
 ]);
 const Header = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.userSynced = createEvent(this, "userSynced", 7);
-        /**
-         * Link to follow in order to prompt user to donate
-         */
-        this.donateurl = "https://membership.debtcollective.org";
-        /**
-         * URL to the community
-         * without the latest "/"
-         */
-        this.community = "https://community.debtcollective.org";
-        /**
-         * URL to the member hub page
-         */
-        this.memberhuburl = "https://debtcollective.org/hub";
-        /**
-         * Logo image
-         */
-        this._logo = "logo.png";
-        this._logoSmall = "logo-small.png";
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.userSynced = createEvent(this, "userSynced", 7);
+    /**
+     * Link to follow in order to prompt user to donate
+     */
+    this.donateurl = "https://membership.debtcollective.org";
+    /**
+     * URL to the community
+     * without the latest "/"
+     */
+    this.community = "https://community.debtcollective.org";
+    /**
+     * URL to the member hub page
+     */
+    this.memberhuburl = "https://debtcollective.org/hub";
+    /**
+     * Logo image
+     */
+    this._logo = "logo.png";
+    this._logoSmall = "logo-small.png";
+  }
+  linksDidChangeHandler(newValue) {
+    if (!newValue) {
+      this._links = [];
+      return;
     }
-    linksDidChangeHandler(newValue) {
-        if (!newValue) {
-            this._links = [];
-            return;
-        }
-        this._links = JSON.parse(newValue);
-    }
-    toggleMenuHandler() {
-        this.toggleMenu();
-    }
-    toggleMenu() {
-        this.isMenuOpen = !this.isMenuOpen;
-    }
-    async syncCurrentUser() {
-        const user = await syncCurrentUser(this.community);
-        this.user = user;
-        this.userSynced.emit(user);
-    }
-    componentWillLoad() {
-        this.linksDidChangeHandler(this.links);
-        return this.syncCurrentUser();
-    }
-    render() {
-        const linksToRender = this._links;
-        return (h(Host, null, h("header", { class: "header" }, h("a", { class: "logo-link d-md-flex", href: "/" }, h("img", { class: "logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), h("button", { class: "btn-transparent logo-link d-md-none", onClick: this.toggleMenuHandler.bind(this) }, h("img", { class: "logo", src: this.logosmall || getAssetPath(`./assets/${this._logoSmall}`), alt: "The Debtcollective" }), h("span", { class: "material-icons ml-1" }, "keyboard_arrow_right")), h("nav", { class: "nav" }, h("slot", { name: "header" }, linksToRender.map(link => (h("div", { class: "nav-item d-md-flex" }, h("a", Object.assign({ class: "nav-link" }, lodash_omit(link, ['text'])), link.text)))), h("dc-dropdown", { label: "Take Action!", items: TAKE_ACTION_LINKS }))), h("div", { class: "session-items" }, this.user ? (h("dc-user-items", { user: this.user, community: this.community })) : (h("div", { class: "session-links" }, h("a", { href: loginURL({ community: this.community, host: this.host }), class: "btn btn-outline" }, h("span", { class: "d-md-flex" }, "Member"), "\u00A0Login"), h("a", { href: this.donateurl, class: "btn btn-primary" }, "Donate"))))), h("dc-menu", { open: this.isMenuOpen, logo: this.logo }, h("slot", { name: "menu" }, linksToRender.map(link => (h("div", { class: "nav-item" }, h("a", Object.assign({ class: "nav-link" }, lodash_omit(link, ['text'])), link.text))))))));
-    }
-    static get assetsDirs() { return ["assets"]; }
-    static get watchers() { return {
-        "links": ["linksDidChangeHandler"]
-    }; }
+    this._links = JSON.parse(newValue);
+  }
+  toggleMenuHandler() {
+    this.toggleMenu();
+  }
+  toggleMenu() {
+    this.isMenuOpen = !this.isMenuOpen;
+  }
+  async syncCurrentUser() {
+    const user = await syncCurrentUser(this.community);
+    this.user = user;
+    this.userSynced.emit(user);
+  }
+  componentWillLoad() {
+    this.linksDidChangeHandler(this.links);
+    return this.syncCurrentUser();
+  }
+  render() {
+    const linksToRender = this._links;
+    return (h(Host, null, h("header", { class: "header" }, h("a", { class: "logo-link d-md-flex", href: "/" }, h("img", { class: "logo", src: this.logo || getAssetPath(`./assets/${this._logo}`), alt: "The Debtcollective" })), h("button", { class: "btn-transparent logo-link d-md-none", onClick: this.toggleMenuHandler.bind(this) }, h("img", { class: "logo", src: this.logosmall || getAssetPath(`./assets/${this._logoSmall}`), alt: "The Debtcollective" }), h("span", { class: "material-icons ml-1" }, "keyboard_arrow_right")), h("nav", { class: "nav" }, h("slot", { name: "header" }, linksToRender.map(link => (h("div", { class: "nav-item d-md-flex" }, h("a", Object.assign({ class: "nav-link" }, lodash_omit(link, ['text'])), link.text)))), h("dc-dropdown", { label: "Take Action!", items: TAKE_ACTION_LINKS }))), h("div", { class: "session-items" }, this.user ? (h("dc-user-items", { user: this.user, community: this.community })) : (h("div", { class: "session-links" }, h("a", { href: loginURL({ community: this.community, host: this.host }), class: "btn btn-outline" }, h("span", { class: "d-md-flex" }, "Member"), "\u00A0Login"), h("a", { href: this.donateurl, class: "btn btn-primary" }, "Donate"))))), h("dc-menu", { open: this.isMenuOpen, logo: this.logo }, h("slot", { name: "menu" }, linksToRender.map(link => (h("div", { class: "nav-item" }, h("a", Object.assign({ class: "nav-link" }, lodash_omit(link, ['text'])), link.text))))))));
+  }
+  static get assetsDirs() { return ["assets"]; }
+  static get watchers() { return {
+    "links": ["linksDidChangeHandler"]
+  }; }
 };
@@ -305,0 +305,0 @@ Header.style = dcHeaderCss;

dist/esm/polyfills/css-shim.js

@@ -1,1 +0,1 @@
-var StyleNode=function(){this.start=0,this.end=0,this.previous=null,this.parent=null,this.rules=null,this.parsedCssText="",this.cssText="",this.atRule=!1,this.type=0,this.keyframesName="",this.selector="",this.parsedSelector=""};function parse(e){return parseCss(lex(e=clean(e)),e)}function clean(e){return e.replace(RX.comments,"").replace(RX.port,"")}function lex(e){var t=new StyleNode;t.start=0,t.end=e.length;for(var r=t,n=0,s=e.length;n<s;n++)if(e[n]===OPEN_BRACE){r.rules||(r.rules=[]);var o=r,a=o.rules[o.rules.length-1]||null;(r=new StyleNode).start=n+1,r.parent=o,r.previous=a,o.rules.push(r)}else e[n]===CLOSE_BRACE&&(r.end=n+1,r=r.parent||t);return t}function parseCss(e,t){var r=t.substring(e.start,e.end-1);if(e.parsedCssText=e.cssText=r.trim(),e.parent){var n=e.previous?e.previous.end:e.parent.start;r=(r=(r=_expandUnicodeEscapes(r=t.substring(n,e.start-1))).replace(RX.multipleSpaces," ")).substring(r.lastIndexOf(";")+1);var s=e.parsedSelector=e.selector=r.trim();e.atRule=0===s.indexOf(AT_START),e.atRule?0===s.indexOf(MEDIA_START)?e.type=types.MEDIA_RULE:s.match(RX.keyframesRule)&&(e.type=types.KEYFRAMES_RULE,e.keyframesName=e.selector.split(RX.multipleSpaces).pop()):0===s.indexOf(VAR_START)?e.type=types.MIXIN_RULE:e.type=types.STYLE_RULE}var o=e.rules;if(o)for(var a=0,i=o.length,l=void 0;a<i&&(l=o[a]);a++)parseCss(l,t);return e}function _expandUnicodeEscapes(e){return e.replace(/\\([0-9a-f]{1,6})\s/gi,(function(){for(var e=arguments[1],t=6-e.length;t--;)e="0"+e;return"\\"+e}))}var types={STYLE_RULE:1,KEYFRAMES_RULE:7,MEDIA_RULE:4,MIXIN_RULE:1e3},OPEN_BRACE="{",CLOSE_BRACE="}",RX={comments:/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,port:/@import[^;]*;/gim,customProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim,mixinProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim,mixinApply:/@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim,varApply:/[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim,keyframesRule:/^@[^\s]*keyframes/,multipleSpaces:/\s+/g},VAR_START="--",MEDIA_START="@media",AT_START="@";function findRegex(e,t,r){e.lastIndex=0;var n=t.substring(r).match(e);if(n){var s=r+n.index;return{start:s,end:s+n[0].length}}return null}var VAR_USAGE_START=/\bvar\(/,VAR_ASSIGN_START=/\B--[\w-]+\s*:/,COMMENTS=/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,TRAILING_LINES=/^[\t ]+\n/gm;function resolveVar(e,t,r){return e[t]?e[t]:r?executeTemplate(r,e):""}function findVarEndIndex(e,t){for(var r=0,n=t;n<e.length;n++){var s=e[n];if("("===s)r++;else if(")"===s&&--r<=0)return n+1}return n}function parseVar(e,t){var r=findRegex(VAR_USAGE_START,e,t);if(!r)return null;var n=findVarEndIndex(e,r.start),s=e.substring(r.end,n-1).split(","),o=s[0],a=s.slice(1);return{start:r.start,end:n,propName:o.trim(),fallback:a.length>0?a.join(",").trim():void 0}}function compileVar(e,t,r){var n=parseVar(e,r);if(!n)return t.push(e.substring(r,e.length)),e.length;var s=n.propName,o=null!=n.fallback?compileTemplate(n.fallback):void 0;return t.push(e.substring(r,n.start),(function(e){return resolveVar(e,s,o)})),n.end}function executeTemplate(e,t){for(var r="",n=0;n<e.length;n++){var s=e[n];r+="string"==typeof s?s:s(t)}return r}function findEndValue(e,t){for(var r=!1,n=!1,s=t;s<e.length;s++){var o=e[s];if(r)n&&'"'===o&&(r=!1),n||"'"!==o||(r=!1);else if('"'===o)r=!0,n=!0;else if("'"===o)r=!0,n=!1;else{if(";"===o)return s+1;if("}"===o)return s}}return s}function removeCustomAssigns(e){for(var t="",r=0;;){var n=findRegex(VAR_ASSIGN_START,e,r),s=n?n.start:e.length;if(t+=e.substring(r,s),!n)break;r=findEndValue(e,s)}return t}function compileTemplate(e){var t=0;e=removeCustomAssigns(e=e.replace(COMMENTS,"")).replace(TRAILING_LINES,"");for(var r=[];t<e.length;)t=compileVar(e,r,t);return r}function resolveValues(e){var t={};e.forEach((function(e){e.declarations.forEach((function(e){t[e.prop]=e.value}))}));for(var r={},n=Object.entries(t),s=function(e){var t=!1;if(n.forEach((function(e){var n=e[0],s=executeTemplate(e[1],r);s!==r[n]&&(r[n]=s,t=!0)})),!t)return"break"},o=0;o<10;o++){if("break"===s())break}return r}function getSelectors(e,t){if(void 0===t&&(t=0),!e.rules)return[];var r=[];return e.rules.filter((function(e){return e.type===types.STYLE_RULE})).forEach((function(e){var n=getDeclarations(e.cssText);n.length>0&&e.parsedSelector.split(",").forEach((function(e){e=e.trim(),r.push({selector:e,declarations:n,specificity:computeSpecificity(),nu:t})})),t++})),r}function computeSpecificity(e){return 1}var IMPORTANT="!important",FIND_DECLARATIONS=/(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm;function getDeclarations(e){for(var t,r=[];t=FIND_DECLARATIONS.exec(e.trim());){var n=normalizeValue(t[2]),s=n.value,o=n.important;r.push({prop:t[1].trim(),value:compileTemplate(s),important:o})}return r}function normalizeValue(e){var t=(e=e.replace(/\s+/gim," ").trim()).endsWith(IMPORTANT);return t&&(e=e.substr(0,e.length-IMPORTANT.length).trim()),{value:e,important:t}}function getActiveSelectors(e,t,r){var n=[],s=getScopesForElement(t,e);return r.forEach((function(e){return n.push(e)})),s.forEach((function(e){return n.push(e)})),sortSelectors(getSelectorsForScopes(n).filter((function(t){return matches(e,t.selector)})))}function getScopesForElement(e,t){for(var r=[];t;){var n=e.get(t);n&&r.push(n),t=t.parentElement}return r}function getSelectorsForScopes(e){var t=[];return e.forEach((function(e){t.push.apply(t,e.selectors)})),t}function sortSelectors(e){return e.sort((function(e,t){return e.specificity===t.specificity?e.nu-t.nu:e.specificity-t.specificity})),e}function matches(e,t){return":root"===t||"html"===t||e.matches(t)}function parseCSS(e){var t=parse(e),r=compileTemplate(e);return{original:e,template:r,selectors:getSelectors(t),usesCssVars:r.length>1}}function addGlobalStyle(e,t){if(e.some((function(e){return e.styleEl===t})))return!1;var r=parseCSS(t.textContent);return r.styleEl=t,e.push(r),!0}function updateGlobalScopes(e){var t=resolveValues(getSelectorsForScopes(e));e.forEach((function(e){e.usesCssVars&&(e.styleEl.textContent=executeTemplate(e.template,t))}))}function reScope(e,t){var r=e.template.map((function(r){return"string"==typeof r?replaceScope(r,e.scopeId,t):r})),n=e.selectors.map((function(r){return Object.assign(Object.assign({},r),{selector:replaceScope(r.selector,e.scopeId,t)})}));return Object.assign(Object.assign({},e),{template:r,selectors:n,scopeId:t})}function replaceScope(e,t,r){return e=replaceAll(e,"\\."+t,"."+r)}function replaceAll(e,t,r){return e.replace(new RegExp(t,"g"),r)}function loadDocument(e,t){return loadDocumentStyles(e,t),loadDocumentLinks(e,t).then((function(){updateGlobalScopes(t)}))}function startWatcher(e,t){"undefined"!=typeof MutationObserver&&new MutationObserver((function(){loadDocumentStyles(e,t)&&updateGlobalScopes(t)})).observe(document.head,{childList:!0})}function loadDocumentLinks(e,t){for(var r=[],n=e.querySelectorAll('link[rel="stylesheet"][href]:not([data-no-shim])'),s=0;s<n.length;s++)r.push(addGlobalLink(e,t,n[s]));return Promise.all(r)}function loadDocumentStyles(e,t){return Array.from(e.querySelectorAll("style:not([data-styles]):not([data-no-shim])")).map((function(e){return addGlobalStyle(t,e)})).some(Boolean)}function addGlobalLink(e,t,r){var n=r.href;return fetch(n).then((function(e){return e.text()})).then((function(s){if(hasCssVariables(s)&&r.parentNode){hasRelativeUrls(s)&&(s=fixRelativeUrls(s,n));var o=e.createElement("style");o.setAttribute("data-styles",""),o.textContent=s,addGlobalStyle(t,o),r.parentNode.insertBefore(o,r),r.remove()}})).catch((function(e){console.error(e)}))}var CSS_VARIABLE_REGEXP=/[\s;{]--[-a-zA-Z0-9]+\s*:/m;function hasCssVariables(e){return e.indexOf("var(")>-1||CSS_VARIABLE_REGEXP.test(e)}var CSS_URL_REGEXP=/url[\s]*\([\s]*['"]?(?!(?:https?|data)\:|\/)([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim;function hasRelativeUrls(e){return CSS_URL_REGEXP.lastIndex=0,CSS_URL_REGEXP.test(e)}function fixRelativeUrls(e,t){var r=t.replace(/[^/]*$/,"");return e.replace(CSS_URL_REGEXP,(function(e,t){var n=r+t;return e.replace(t,n)}))}var CustomStyle=function(){function e(e,t){this.win=e,this.doc=t,this.count=0,this.hostStyleMap=new WeakMap,this.hostScopeMap=new WeakMap,this.globalScopes=[],this.scopesMap=new Map,this.didInit=!1}return e.prototype.i=function(){var e=this;return this.didInit||!this.win.requestAnimationFrame?Promise.resolve():(this.didInit=!0,new Promise((function(t){e.win.requestAnimationFrame((function(){startWatcher(e.doc,e.globalScopes),loadDocument(e.doc,e.globalScopes).then((function(){return t()}))}))})))},e.prototype.addLink=function(e){var t=this;return addGlobalLink(this.doc,this.globalScopes,e).then((function(){t.updateGlobal()}))},e.prototype.addGlobalStyle=function(e){addGlobalStyle(this.globalScopes,e)&&this.updateGlobal()},e.prototype.createHostStyle=function(e,t,r,n){if(this.hostScopeMap.has(e))throw new Error("host style already created");var s=this.registerHostTemplate(r,t,n),o=this.doc.createElement("style");return o.setAttribute("data-no-shim",""),s.usesCssVars?n?(o["s-sc"]=t=s.scopeId+"-"+this.count,o.textContent="/*needs update*/",this.hostStyleMap.set(e,o),this.hostScopeMap.set(e,reScope(s,t)),this.count++):(s.styleEl=o,s.usesCssVars||(o.textContent=executeTemplate(s.template,{})),this.globalScopes.push(s),this.updateGlobal(),this.hostScopeMap.set(e,s)):o.textContent=r,o},e.prototype.removeHost=function(e){var t=this.hostStyleMap.get(e);t&&t.remove(),this.hostStyleMap.delete(e),this.hostScopeMap.delete(e)},e.prototype.updateHost=function(e){var t=this.hostScopeMap.get(e);if(t&&t.usesCssVars&&t.isScoped){var r=this.hostStyleMap.get(e);if(r){var n=resolveValues(getActiveSelectors(e,this.hostScopeMap,this.globalScopes));r.textContent=executeTemplate(t.template,n)}}},e.prototype.updateGlobal=function(){updateGlobalScopes(this.globalScopes)},e.prototype.registerHostTemplate=function(e,t,r){var n=this.scopesMap.get(t);return n||((n=parseCSS(e)).scopeId=t,n.isScoped=r,this.scopesMap.set(t,n)),n},e}();!function(e){!e||e.__cssshim||e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")||(e.__cssshim=new CustomStyle(e,e.document))}("undefined"!=typeof window&&window);
+var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var s in t=arguments[r])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e}).apply(this,arguments)},StyleNode=function(){this.start=0,this.end=0,this.previous=null,this.parent=null,this.rules=null,this.parsedCssText="",this.cssText="",this.atRule=!1,this.type=0,this.keyframesName="",this.selector="",this.parsedSelector=""};function parse(e){return parseCss(lex(e=clean(e)),e)}function clean(e){return e.replace(RX.comments,"").replace(RX.port,"")}function lex(e){var t=new StyleNode;t.start=0,t.end=e.length;for(var r=t,n=0,s=e.length;n<s;n++)if(e[n]===OPEN_BRACE){r.rules||(r.rules=[]);var o=r,a=o.rules[o.rules.length-1]||null;(r=new StyleNode).start=n+1,r.parent=o,r.previous=a,o.rules.push(r)}else e[n]===CLOSE_BRACE&&(r.end=n+1,r=r.parent||t);return t}function parseCss(e,t){var r=t.substring(e.start,e.end-1);if(e.parsedCssText=e.cssText=r.trim(),e.parent){var n=e.previous?e.previous.end:e.parent.start;r=(r=(r=_expandUnicodeEscapes(r=t.substring(n,e.start-1))).replace(RX.multipleSpaces," ")).substring(r.lastIndexOf(";")+1);var s=e.parsedSelector=e.selector=r.trim();e.atRule=0===s.indexOf(AT_START),e.atRule?0===s.indexOf(MEDIA_START)?e.type=types.MEDIA_RULE:s.match(RX.keyframesRule)&&(e.type=types.KEYFRAMES_RULE,e.keyframesName=e.selector.split(RX.multipleSpaces).pop()):0===s.indexOf(VAR_START)?e.type=types.MIXIN_RULE:e.type=types.STYLE_RULE}var o=e.rules;if(o)for(var a=0,i=o.length,l=void 0;a<i&&(l=o[a]);a++)parseCss(l,t);return e}function _expandUnicodeEscapes(e){return e.replace(/\\([0-9a-f]{1,6})\s/gi,(function(){for(var e=arguments[1],t=6-e.length;t--;)e="0"+e;return"\\"+e}))}var types={STYLE_RULE:1,KEYFRAMES_RULE:7,MEDIA_RULE:4,MIXIN_RULE:1e3},OPEN_BRACE="{",CLOSE_BRACE="}",RX={comments:/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,port:/@import[^;]*;/gim,customProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim,mixinProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim,mixinApply:/@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim,varApply:/[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim,keyframesRule:/^@[^\s]*keyframes/,multipleSpaces:/\s+/g},VAR_START="--",MEDIA_START="@media",AT_START="@";function findRegex(e,t,r){e.lastIndex=0;var n=t.substring(r).match(e);if(n){var s=r+n.index;return{start:s,end:s+n[0].length}}return null}var VAR_USAGE_START=/\bvar\(/,VAR_ASSIGN_START=/\B--[\w-]+\s*:/,COMMENTS=/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,TRAILING_LINES=/^[\t ]+\n/gm;function resolveVar(e,t,r){return e[t]?e[t]:r?executeTemplate(r,e):""}function findVarEndIndex(e,t){for(var r=0,n=t;n<e.length;n++){var s=e[n];if("("===s)r++;else if(")"===s&&--r<=0)return n+1}return n}function parseVar(e,t){var r=findRegex(VAR_USAGE_START,e,t);if(!r)return null;var n=findVarEndIndex(e,r.start),s=e.substring(r.end,n-1).split(","),o=s[0],a=s.slice(1);return{start:r.start,end:n,propName:o.trim(),fallback:a.length>0?a.join(",").trim():void 0}}function compileVar(e,t,r){var n=parseVar(e,r);if(!n)return t.push(e.substring(r,e.length)),e.length;var s=n.propName,o=null!=n.fallback?compileTemplate(n.fallback):void 0;return t.push(e.substring(r,n.start),(function(e){return resolveVar(e,s,o)})),n.end}function executeTemplate(e,t){for(var r="",n=0;n<e.length;n++){var s=e[n];r+="string"==typeof s?s:s(t)}return r}function findEndValue(e,t){for(var r=!1,n=!1,s=t;s<e.length;s++){var o=e[s];if(r)n&&'"'===o&&(r=!1),n||"'"!==o||(r=!1);else if('"'===o)r=!0,n=!0;else if("'"===o)r=!0,n=!1;else{if(";"===o)return s+1;if("}"===o)return s}}return s}function removeCustomAssigns(e){for(var t="",r=0;;){var n=findRegex(VAR_ASSIGN_START,e,r),s=n?n.start:e.length;if(t+=e.substring(r,s),!n)break;r=findEndValue(e,s)}return t}function compileTemplate(e){var t=0;e=removeCustomAssigns(e=e.replace(COMMENTS,"")).replace(TRAILING_LINES,"");for(var r=[];t<e.length;)t=compileVar(e,r,t);return r}function resolveValues(e){var t={};e.forEach((function(e){e.declarations.forEach((function(e){t[e.prop]=e.value}))}));for(var r={},n=Object.entries(t),s=function(e){var t=!1;if(n.forEach((function(e){var n=e[0],s=executeTemplate(e[1],r);s!==r[n]&&(r[n]=s,t=!0)})),!t)return"break"},o=0;o<10;o++){if("break"===s())break}return r}function getSelectors(e,t){if(void 0===t&&(t=0),!e.rules)return[];var r=[];return e.rules.filter((function(e){return e.type===types.STYLE_RULE})).forEach((function(e){var n=getDeclarations(e.cssText);n.length>0&&e.parsedSelector.split(",").forEach((function(e){e=e.trim(),r.push({selector:e,declarations:n,specificity:computeSpecificity(),nu:t})})),t++})),r}function computeSpecificity(e){return 1}var IMPORTANT="!important",FIND_DECLARATIONS=/(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm;function getDeclarations(e){for(var t,r=[];t=FIND_DECLARATIONS.exec(e.trim());){var n=normalizeValue(t[2]),s=n.value,o=n.important;r.push({prop:t[1].trim(),value:compileTemplate(s),important:o})}return r}function normalizeValue(e){var t=(e=e.replace(/\s+/gim," ").trim()).endsWith(IMPORTANT);return t&&(e=e.substr(0,e.length-IMPORTANT.length).trim()),{value:e,important:t}}function getActiveSelectors(e,t,r){var n=[],s=getScopesForElement(t,e);return r.forEach((function(e){return n.push(e)})),s.forEach((function(e){return n.push(e)})),sortSelectors(getSelectorsForScopes(n).filter((function(t){return matches(e,t.selector)})))}function getScopesForElement(e,t){for(var r=[];t;){var n=e.get(t);n&&r.push(n),t=t.parentElement}return r}function getSelectorsForScopes(e){var t=[];return e.forEach((function(e){t.push.apply(t,e.selectors)})),t}function sortSelectors(e){return e.sort((function(e,t){return e.specificity===t.specificity?e.nu-t.nu:e.specificity-t.specificity})),e}function matches(e,t){return":root"===t||"html"===t||e.matches(t)}function parseCSS(e){var t=parse(e),r=compileTemplate(e);return{original:e,template:r,selectors:getSelectors(t),usesCssVars:r.length>1}}function addGlobalStyle(e,t){if(e.some((function(e){return e.styleEl===t})))return!1;var r=parseCSS(t.textContent);return r.styleEl=t,e.push(r),!0}function updateGlobalScopes(e){var t=resolveValues(getSelectorsForScopes(e));e.forEach((function(e){e.usesCssVars&&(e.styleEl.textContent=executeTemplate(e.template,t))}))}function reScope(e,t){var r=e.template.map((function(r){return"string"==typeof r?replaceScope(r,e.scopeId,t):r})),n=e.selectors.map((function(r){return __assign(__assign({},r),{selector:replaceScope(r.selector,e.scopeId,t)})}));return __assign(__assign({},e),{template:r,selectors:n,scopeId:t})}function replaceScope(e,t,r){return e=replaceAll(e,"\\."+t,"."+r)}function replaceAll(e,t,r){return e.replace(new RegExp(t,"g"),r)}function loadDocument(e,t){return loadDocumentStyles(e,t),loadDocumentLinks(e,t).then((function(){updateGlobalScopes(t)}))}function startWatcher(e,t){"undefined"!=typeof MutationObserver&&new MutationObserver((function(){loadDocumentStyles(e,t)&&updateGlobalScopes(t)})).observe(document.head,{childList:!0})}function loadDocumentLinks(e,t){for(var r=[],n=e.querySelectorAll('link[rel="stylesheet"][href]:not([data-no-shim])'),s=0;s<n.length;s++)r.push(addGlobalLink(e,t,n[s]));return Promise.all(r)}function loadDocumentStyles(e,t){return Array.from(e.querySelectorAll("style:not([data-styles]):not([data-no-shim])")).map((function(e){return addGlobalStyle(t,e)})).some(Boolean)}function addGlobalLink(e,t,r){var n=r.href;return fetch(n).then((function(e){return e.text()})).then((function(s){if(hasCssVariables(s)&&r.parentNode){hasRelativeUrls(s)&&(s=fixRelativeUrls(s,n));var o=e.createElement("style");o.setAttribute("data-styles",""),o.textContent=s,addGlobalStyle(t,o),r.parentNode.insertBefore(o,r),r.remove()}})).catch((function(e){console.error(e)}))}var CSS_VARIABLE_REGEXP=/[\s;{]--[-a-zA-Z0-9]+\s*:/m;function hasCssVariables(e){return e.indexOf("var(")>-1||CSS_VARIABLE_REGEXP.test(e)}var CSS_URL_REGEXP=/url[\s]*\([\s]*['"]?(?!(?:https?|data)\:|\/)([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim;function hasRelativeUrls(e){return CSS_URL_REGEXP.lastIndex=0,CSS_URL_REGEXP.test(e)}function fixRelativeUrls(e,t){var r=t.replace(/[^/]*$/,"");return e.replace(CSS_URL_REGEXP,(function(e,t){var n=r+t;return e.replace(t,n)}))}var CustomStyle=function(){function e(e,t){this.win=e,this.doc=t,this.count=0,this.hostStyleMap=new WeakMap,this.hostScopeMap=new WeakMap,this.globalScopes=[],this.scopesMap=new Map,this.didInit=!1}return e.prototype.i=function(){var e=this;return this.didInit||!this.win.requestAnimationFrame?Promise.resolve():(this.didInit=!0,new Promise((function(t){e.win.requestAnimationFrame((function(){startWatcher(e.doc,e.globalScopes),loadDocument(e.doc,e.globalScopes).then((function(){return t()}))}))})))},e.prototype.addLink=function(e){var t=this;return addGlobalLink(this.doc,this.globalScopes,e).then((function(){t.updateGlobal()}))},e.prototype.addGlobalStyle=function(e){addGlobalStyle(this.globalScopes,e)&&this.updateGlobal()},e.prototype.createHostStyle=function(e,t,r,n){if(this.hostScopeMap.has(e))throw new Error("host style already created");var s=this.registerHostTemplate(r,t,n),o=this.doc.createElement("style");return o.setAttribute("data-no-shim",""),s.usesCssVars?n?(o["s-sc"]=t=s.scopeId+"-"+this.count,o.textContent="/*needs update*/",this.hostStyleMap.set(e,o),this.hostScopeMap.set(e,reScope(s,t)),this.count++):(s.styleEl=o,s.usesCssVars||(o.textContent=executeTemplate(s.template,{})),this.globalScopes.push(s),this.updateGlobal(),this.hostScopeMap.set(e,s)):o.textContent=r,o},e.prototype.removeHost=function(e){var t=this.hostStyleMap.get(e);t&&t.remove(),this.hostStyleMap.delete(e),this.hostScopeMap.delete(e)},e.prototype.updateHost=function(e){var t=this.hostScopeMap.get(e);if(t&&t.usesCssVars&&t.isScoped){var r=this.hostStyleMap.get(e);if(r){var n=resolveValues(getActiveSelectors(e,this.hostScopeMap,this.globalScopes));r.textContent=executeTemplate(t.template,n)}}},e.prototype.updateGlobal=function(){updateGlobalScopes(this.globalScopes)},e.prototype.registerHostTemplate=function(e,t,r){var n=this.scopesMap.get(t);return n||((n=parseCSS(e)).scopeId=t,n.isScoped=r,this.scopesMap.set(t,n)),n},e}();!function(e){!e||e.__cssshim||e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")||(e.__cssshim=new CustomStyle(e,e.document))}("undefined"!=typeof window&&window);

dist/header/header.esm.js

@@ -1,1 +0,1 @@
-import{b as e}from"./p-47489316.js";import{p as o}from"./p-66b329d3.js";o().then(o=>e([["p-7c3ae34e",[[0,"dc-collapser",{label:[1],items:[16],open:[32]}]]],["p-83b0409f",[[1,"dc-header",{links:[1],donateurl:[1],community:[1],memberhuburl:[1],host:[1],logo:[1],logosmall:[1],user:[32],isMenuOpen:[32]},[[0,"toggleMenu","toggleMenuHandler"]]],[0,"dc-user-items",{community:[1],user:[16]}],[1,"dc-dropdown",{label:[1],items:[1],open:[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]],[4,"dc-menu",{open:[4],logo:[1]}],[0,"dc-user-dropdown",{community:[1],user:[16],open:[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]]]]],o));
+import{p as e,b as o}from"./p-fd935f56.js";(()=>{const o=import.meta.url,n={};return""!==o&&(n.resourcesUrl=new URL(".",o).href),e(n)})().then(e=>o([["p-0e826ae6",[[0,"dc-collapser",{label:[1],items:[16],open:[32]}]]],["p-fee397a1",[[1,"dc-header",{links:[1],donateurl:[1],community:[1],memberhuburl:[1],host:[1],logo:[1],logosmall:[1],user:[32],isMenuOpen:[32]},[[0,"toggleMenu","toggleMenuHandler"]]],[0,"dc-user-items",{community:[1],user:[16]}],[1,"dc-dropdown",{label:[1],items:[1],open:[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]],[4,"dc-menu",{open:[4],logo:[1]}],[0,"dc-user-dropdown",{community:[1],user:[16],open:[32]},[[4,"click","handleClickOutside"],[4,"keydown","handleEscapeKey"]]]]]],e));

dist/index.js

@@ -1,1 +0,1 @@
-module.exports = require('./cjs/index.cjs.js');
+export * from './esm/index.js';

dist/types/components/dc-header/dc-collapser.d.ts

 export declare class Collapser {
-    /**
-     * label for the collapser nav item
-     */
-    label: string;
-    /**
-     * Items to be displayed in the collapser
-     */
-    items: Array<{
-        text: string;
-        href: string;
-        target?: string;
-    }>;
-    open: boolean;
-    toggleCollapser(): void;
-    render(): any;
+  /**
+   * label for the collapser nav item
+   */
+  label: string;
+  /**
+   * Items to be displayed in the collapser
+   */
+  items: Array<{
+    text: string;
+    href: string;
+    target?: string;
+  }>;
+  open: boolean;
+  toggleCollapser(): void;
+  render(): any;
 }

dist/types/components/dc-header/dc-header.d.ts

@@ -7,71 +7,71 @@ import { EventEmitter } from "../../stencil-public-runtime";
 declare type User = {
-    id: number;
-    admin: boolean;
-    avatar_template: string;
-    username: string;
-    unread_notifications: number;
-    unread_high_priority_notifications: number;
+  id: number;
+  admin: boolean;
+  avatar_template: string;
+  username: string;
+  unread_notifications: number;
+  unread_high_priority_notifications: number;
 };
 export declare class Header {
-    /**
-     * The links you need to display within the header
-     * this string needs to be JSON (able to JSON.parse)
-     */
-    links: string;
-    /**
-     * Link to follow in order to prompt user to donate
-     */
-    donateurl: string;
-    /**
-     * URL to the community
-     * without the latest "/"
-     */
-    community: string;
-    /**
-     * URL to the member hub page
-     */
-    memberhuburl?: string;
-    /**
-     * URL to the component host
-     * without the latest "/"
-     */
-    host: string;
-    /**
-     * Logo src to use a custom image for the header
-     */
-    logo: string;
-    /**
-     * Logo small src to use a custom image for the header in mobile
-     */
-    logosmall: string;
-    /**
-     * An object with the user data. Follows Discourse structure as
-     * https://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get
-     */
-    user?: User;
-    /**
-     * Wether or not the menu is displayed
-     */
-    isMenuOpen: boolean;
-    /**
-     * Emit event to exposed fetched user on host application
-     * TODO: Cannot find name User on EventEmitter<User>
-     */
-    userSynced: EventEmitter;
-    /**
-     * Logo image
-     */
-    private _logo;
-    private _logoSmall;
-    /**
-     * Host the value of "links" parsed to an actual Array
-     */
-    private _links;
-    linksDidChangeHandler(newValue: any): void;
-    toggleMenuHandler(): void;
-    toggleMenu(): void;
-    syncCurrentUser(): Promise<void>;
-    componentWillLoad(): Promise<void>;
-    render(): any;
+  /**
+   * The links you need to display within the header
+   * this string needs to be JSON (able to JSON.parse)
+   */
+  links: string;
+  /**
+   * Link to follow in order to prompt user to donate
+   */
+  donateurl: string;
+  /**
+   * URL to the community
+   * without the latest "/"
+   */
+  community: string;
+  /**
+   * URL to the member hub page
+   */
+  memberhuburl?: string;
+  /**
+   * URL to the component host
+   * without the latest "/"
+   */
+  host: string;
+  /**
+   * Logo src to use a custom image for the header
+   */
+  logo: string;
+  /**
+   * Logo small src to use a custom image for the header in mobile
+   */
+  logosmall: string;
+  /**
+   * An object with the user data. Follows Discourse structure as
+   * https://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get
+   */
+  user?: User;
+  /**
+   * Wether or not the menu is displayed
+   */
+  isMenuOpen: boolean;
+  /**
+   * Emit event to exposed fetched user on host application
+   * TODO: Cannot find name User on EventEmitter<User>
+   */
+  userSynced: EventEmitter;
+  /**
+   * Logo image
+   */
+  private _logo;
+  private _logoSmall;
+  /**
+   * Host the value of "links" parsed to an actual Array
+   */
+  private _links;
+  linksDidChangeHandler(newValue: any): void;
+  toggleMenuHandler(): void;
+  toggleMenu(): void;
+  syncCurrentUser(): Promise<void>;
+  componentWillLoad(): Promise<void>;
+  render(): any;
 }
 export {};

dist/types/components/dc-header/dc-menu.d.ts

 import { EventEmitter } from "../../stencil-public-runtime";
 export declare class Menu {
-    /**
-     * Wether or not the mobile menu is displayed
-     */
-    open: boolean;
-    /**
-     * Logo src to use a custom image for the header
-     */
-    logo: string;
-    toggleMenu: EventEmitter<void>;
-    /**
-     * Logo image
-     */
-    private _logo;
-    toggleMenuHandler(): void;
-    render(): any;
+  /**
+   * Wether or not the mobile menu is displayed
+   */
+  open: boolean;
+  /**
+   * Logo src to use a custom image for the header
+   */
+  logo: string;
+  toggleMenu: EventEmitter<void>;
+  /**
+   * Logo image
+   */
+  private _logo;
+  toggleMenuHandler(): void;
+  render(): any;
 }

dist/types/components/dc-header/dc-user-dropdown.d.ts

 export declare class UserPopup {
-    open: boolean;
-    /**
-     * URL to the community
-     */
-    community: string;
-    /**
-     * An object with the user data. Follows Discourse structure as
-     * https://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get
-     */
-    user: {
-        id: number;
-        admin: boolean;
-        avatar_template: string;
-        username: string;
-        unread_notifications: number;
-        unread_high_priority_notifications: number;
-    };
-    /**
-     * Event to detect outside clicks from the popup
-     */
-    handleClickOutside(event: any): void;
-    /**
-     *  Event to detect escape key press
-     */
-    handleEscapeKey(event: any): void;
-    popupTriggerElement: Node;
-    popupItems: Node;
-    togglePopup(): void;
-    closePopup(): void;
-    handleLogout(): Promise<void>;
-    render(): any;
+  open: boolean;
+  /**
+   * URL to the community
+   */
+  community: string;
+  /**
+   * An object with the user data. Follows Discourse structure as
+   * https://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get
+   */
+  user: {
+    id: number;
+    admin: boolean;
+    avatar_template: string;
+    username: string;
+    unread_notifications: number;
+    unread_high_priority_notifications: number;
+  };
+  /**
+   * Event to detect outside clicks from the popup
+   */
+  handleClickOutside(event: any): void;
+  /**
+   *  Event to detect escape key press
+   */
+  handleEscapeKey(event: any): void;
+  popupTriggerElement: Node;
+  popupItems: Node;
+  togglePopup(): void;
+  closePopup(): void;
+  handleLogout(): Promise<void>;
+  render(): any;
 }

dist/types/components/dc-header/dc-user-items.d.ts

 import "./dc-user-dropdown";
 export declare class Menu {
-    /**
-     * URL to the community
-     */
-    community: string;
-    /**
-     * An object with the user data. Follows Discourse structure as
-     * https://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get
-     */
-    user: {
-        id: number;
-        admin: boolean;
-        avatar_template: string;
-        username: string;
-        unread_notifications: number;
-        unread_high_priority_notifications: number;
-    };
-    render(): any;
+  /**
+   * URL to the community
+   */
+  community: string;
+  /**
+   * An object with the user data. Follows Discourse structure as
+   * https://docs.discourse.org/#tag/Users/paths/~1users~1{username}.json/get
+   */
+  user: {
+    id: number;
+    admin: boolean;
+    avatar_template: string;
+    username: string;
+    unread_notifications: number;
+    unread_high_priority_notifications: number;
+  };
+  render(): any;
 }

dist/types/stencil-public-runtime.d.ts

@@ -46,6 +46,2 @@ declare type CustomMethodDecorator<T> = (target: Object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
     assetsDirs?: string[];
-    /**
-     * @deprecated Use `assetsDirs` instead
-     */
-    assetsDir?: string;
 }
@@ -85,10 +81,2 @@ export interface ShadowRootOptions {
     reflect?: boolean;
-    /** @deprecated: "attr" has been deprecated, please use "attribute" instead. */
-    attr?: string;
-    /** @deprecated "context" has been deprecated. */
-    context?: string;
-    /** @deprecated "connect" has been deprecated, please use ES modules and/or dynamic imports instead. */
-    connect?: string;
-    /** @deprecated "reflectToAttr" has been deprecated, please use "reflect" instead. */
-    reflectToAttr?: boolean;
 }
@@ -150,3 +138,3 @@ export interface MethodDecorator {
 }
-export declare type ListenTargetOptions = 'parent' | 'body' | 'document' | 'window';
+export declare type ListenTargetOptions = 'body' | 'document' | 'window';
 export interface StateDecorator {
@@ -270,4 +258,2 @@ (): PropertyDecorator;
     componentOnReady(): Promise<this>;
-    /** @deprecated */
-    forceUpdate(): void;
 }
@@ -338,9 +324,2 @@ /**
 }
-export interface ComponentDidUnload {
-    /**
-     * The component did unload and the element
-     * will be destroyed.
-     */
-    componentDidUnload(): void;
-}
 export interface ComponentInterface {
@@ -450,2 +429,6 @@ connectedCallback?(): void;
 /**
+ * Fragment
+ */
+export declare const Fragment: FunctionalComponent<{}>;
+/**
  * The "h" namespace is used to import JSX types for elements and attributes.
@@ -452,0 +435,0 @@ * It is imported in order to avoid conflicting global JSX issues.

dist/types/utils/community.d.ts

@@ -6,4 +6,4 @@ /**
 export declare const loginURL: ({ host, community }: {
-    host: any;
-    community: any;
+  host: any;
+  community: any;
 }) => string;
@@ -15,4 +15,4 @@ /**
 export declare const signupURL: ({ host, community }: {
-    host: any;
-    community: any;
+  host: any;
+  community: any;
 }) => string;
@@ -33,3 +33,3 @@ /**
 export declare const getAvatarURL: ({ avatar_template }: {
-    avatar_template: any;
+  avatar_template: any;
 }, community: any, size?: number) => string;

loader/package.json

 {
   "name": "header-loader",
   "typings": "./index.d.ts",
-  "module": "./index.mjs",
+  "module": "./index.js",
   "main": "./index.cjs.js",
-  "node:main": "./node-main.js",
-  "jsnext:main": "./index.es2017.mjs",
-  "es2015": "./index.es2017.mjs",
-  "es2017": "./index.es2017.mjs",
+  "jsnext:main": "./index.es2017.js",
+  "es2015": "./index.es2017.js",
+  "es2017": "./index.es2017.js",
   "unpkg": "./cdn.js"
 }

package.json

 {
   "name": "@debtcollective/dc-header-component",
-  "version": "1.5.0",
+  "version": "2.0.0",
   "description": "Stencil header component for debtcollective web apps",
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
-  "es2015": "dist/esm/index.mjs",
-  "es2017": "dist/esm/index.mjs",
-  "types": "dist/types/components.d.ts",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "es2015": "dist/esm/index.js",
+  "es2017": "dist/esm/index.js",
+  "jsnext:main": "dist/esm/index.js",
+  "types": "dist/types/index.d.ts",
   "collection": "dist/collection/collection-manifest.json",
@@ -28,7 +29,7 @@ "collection:main": "dist/collection/index.js",
   "dependencies": {
-    "@debtcollective/dc-dropdown-component": "^1.5.0",
+    "@debtcollective/dc-dropdown-component": "^1.6.0",
     "lodash.omit": "^4.5.0"
   },
   "devDependencies": {
-    "@stencil/core": "1.17.3",
+    "@stencil/core": "2.0.3",
     "@types/jest": "25.2.3",
@@ -45,3 +46,3 @@ "@types/node": "13.13.21",
   "license": "MIT",
-  "gitHead": "0d5aa7183be7cef901289932f3f7e339115ac197"
+  "gitHead": "6c5ae83b1cb5648ad695c72eaf419179e44720ff"
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Uses eval

Supply chain risk

Package uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Improved metrics

Number of low license alerts

0

decreased by-100%

Number of low supply chain risk alerts

14

decreased by-17.65%

Number of medium supply chain risk alerts

18

decreased by-48.57%

Worsened metrics

Total package byte prevSize

554238

decreased by-50.72%

Number of package files

66

decreased by-35.29%

Lines of code

10322

decreased by-40.08%

Dependency changes

• Updated@debtcollective/dc-dropdown-component@^1.6.0