@brad-frost-web/eddie-web-components 0.1.0

package/components/nav-container/nav-container.js

@@ -0,0 +1,20 @@
+import { unsafeCSS as t, html as o } from "lit";
+import { E as n } from "../EdElement.js";
+const a = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}:host{position:absolute;left:0;top:100%;width:100%;height:100vh;background:var(--ed-theme-color-background-default);overflow:auto}@media all and (min-width:48rem){:host{position:static;width:auto;height:auto;background:none}}.ed-c-nav-container{display:flex;flex-direction:column;justify-content:space-between}@media all and (min-width:48rem){.ed-c-nav-container{flex-direction:row}}";
+class i extends n {
+  static get styles() {
+    return t(a);
+  }
+  render() {
+    const e = this.componentClassNames("ed-c-nav-container", {});
+    return o`
+      <div class="${e}">
+        <slot></slot>
+      </div>
+    `;
+  }
+}
+customElements.get("ed-nav-container") === void 0 && customElements.define("ed-nav-container", i);
+export {
+  i as EdNavContainer
+};

package/components/page-header/page-header.d.ts

@@ -0,0 +1,18 @@
+import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdElement';
+/**
+ * @slot - The page header content
+ */
+export declare class EdPageHeader extends EdElement {
+    static get styles(): import('lit').CSSResult;
+    /**
+     * Page header title
+     */
+    heading: string;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ed-page-header': EdPageHeader;
+    }
+}
+//# sourceMappingURL=page-header.d.ts.map

package/components/page-header/page-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/page-header/page-header.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,YAAa,SAAQ,SAAS;IACzC,MAAM,KAAK,MAAM,4BAEhB;IAED;;OAEG;IAEH,OAAO,EAAE,MAAM,CAAuB;IAEtC,MAAM;CAiBP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}

package/components/page-header/page-header.js

@@ -0,0 +1,39 @@
+import { unsafeCSS as l, html as h } from "lit";
+import { property as n } from "lit/decorators.js";
+import { E as g } from "../EdElement.js";
+const p = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-page-header{margin-bottom:2rem}.ed-c-page-header__title{display:inline;margin:0;font-family:var(--ed-theme-typography-headline-lg-mobile-font-family);font-weight:var(--ed-theme-typography-headline-lg-mobile-font-weight);font-size:var(--ed-theme-typography-headline-lg-mobile-font-size);line-height:var(--ed-theme-typography-headline-lg-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-lg-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-lg-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-page-header__title{font-family:var(--ed-theme-typography-headline-lg-font-family);font-weight:var(--ed-theme-typography-headline-lg-font-weight);font-size:var(--ed-theme-typography-headline-lg-font-size);line-height:var(--ed-theme-typography-headline-lg-line-height);letter-spacing:var(--ed-theme-typography-headline-lg-letter-spacing);text-transform:var(--ed-theme-typography-headline-lg-text-transform)}}.ed-c-page-header__title-after{display:inline-block;position:relative;bottom:.625rem;margin-left:1rem}.ed-c-page-header__description{font-family:var(--ed-theme-typography-body-default-font-family);font-weight:var(--ed-theme-typography-body-default-font-weight);font-size:var(--ed-theme-typography-body-default-font-size);line-height:var(--ed-theme-typography-body-default-line-height);letter-spacing:var(--ed-theme-typography-body-default-letter-spacing);text-transform:var(--ed-theme-typography-body-default-text-transform)}";
+var s = Object.defineProperty, m = (a, t, i, y) => {
+  for (var e = void 0, r = a.length - 1, o; r >= 0; r--)
+    (o = a[r]) && (e = o(t, i, e) || e);
+  return e && s(t, i, e), e;
+};
+class d extends g {
+  constructor() {
+    super(...arguments), this.heading = "Page header title";
+  }
+  static get styles() {
+    return l(p);
+  }
+  render() {
+    const t = this.componentClassNames("ed-c-page-header", {});
+    return h`
+      <div class="${t}">
+        <h1 class="ed-c-page-header__title">
+          ${this.heading}${this.slotNotEmpty("titleAfter") && h`<div class="ed-c-page-header__title-after">
+            <slot name="titleAfter"></slot>
+          </div>`}
+        </h1>
+        <div class="ed-c-page-header__description">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+  }
+}
+m([
+  n({ type: String })
+], d.prototype, "heading");
+customElements.get("ed-page-header") === void 0 && customElements.define("ed-page-header", d);
+export {
+  d as EdPageHeader
+};

package/components/pagination/pagination.d.ts

@@ -0,0 +1,38 @@
+import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdElement';
+/**
+ * @slot - The component content
+ */
+export declare class EdPagination extends EdElement {
+    static get styles(): import('lit').CSSResult;
+    /**
+     * Previous button text
+     */
+    prevButtonText?: string;
+    /**
+     * Next button text
+     */
+    nextButtonText?: string;
+    /**
+     * Remove Prev button
+     */
+    removePrevButton?: boolean;
+    /**
+     * Remove Next Button
+     */
+    removeNextButton?: boolean;
+    /**
+     * Remove Prev button
+     */
+    disablePrevButton?: boolean;
+    /**
+     * Remove Next Button
+     */
+    disableNextButton?: boolean;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ed-pagination': EdPagination;
+    }
+}
+//# sourceMappingURL=pagination.d.ts.map

package/components/pagination/pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/pagination/pagination.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,YAAa,SAAQ,SAAS;IACzC,MAAM,KAAK,MAAM,4BAEhB;IAED;;OAEG;IAEH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IAEH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IAEH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;OAEG;IAEH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;OAEG;IAEH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IAEH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,MAAM;CAqBP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}

package/components/pagination/pagination.js

@@ -0,0 +1,52 @@
+import { unsafeCSS as m, html as r } from "lit";
+import { property as o } from "lit/decorators.js";
+import { E as l } from "../EdElement.js";
+const h = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-pagination{font-family:var(--ed-theme-typography-body-sm-font-family);font-weight:var(--ed-theme-typography-body-sm-font-weight);font-size:var(--ed-theme-typography-body-sm-font-size);line-height:var(--ed-theme-typography-body-sm-line-height);letter-spacing:var(--ed-theme-typography-body-sm-letter-spacing);text-transform:var(--ed-theme-typography-body-sm-text-transform);display:flex;align-items:center;justify-content:center;list-style:none;padding:0}";
+var y = Object.defineProperty, n = (a, i, p, g) => {
+  for (var t = void 0, s = a.length - 1, d; s >= 0; s--)
+    (d = a[s]) && (t = d(i, p, t) || t);
+  return t && y(i, p, t), t;
+};
+class e extends l {
+  static get styles() {
+    return m(h.toString());
+  }
+  render() {
+    const i = this.componentClassNames("ed-c-pagination", {});
+    return r`
+      <ol class="${i}">
+        ${this.removePrevButton ? "" : r`<ed-pagination-item href="#" ?disabled=${this.disablePrevButton}>
+              <span class="ed-u-is-vishidden">${this.prevButtonText}</span>
+              <ed-icon class="ed-c-pagination__icon" name="keyboard-arrow-left"></ed-icon>
+            </ed-pagination-item>`}
+        <slot></slot>
+        ${this.removeNextButton ? "" : r`<ed-pagination-item href="#" ?disabled=${this.disableNextButton}>
+              <span class="ed-u-is-vishidden">${this.nextButtonText}</span>
+              <ed-icon class="ed-c-pagination__icon" name="keyboard-arrow-right"></ed-icon>
+            </ed-pagination-item>`}
+      </ol>
+    `;
+  }
+}
+n([
+  o()
+], e.prototype, "prevButtonText");
+n([
+  o()
+], e.prototype, "nextButtonText");
+n([
+  o({ type: Boolean })
+], e.prototype, "removePrevButton");
+n([
+  o({ type: Boolean })
+], e.prototype, "removeNextButton");
+n([
+  o({ type: Boolean })
+], e.prototype, "disablePrevButton");
+n([
+  o({ type: Boolean })
+], e.prototype, "disableNextButton");
+customElements.get("ed-pagination") === void 0 && customElements.define("ed-pagination", e);
+export {
+  e as EdPagination
+};

package/components/pagination-item/pagination-item.d.ts

@@ -0,0 +1,35 @@
+import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdElement';
+/**
+ * @slot - The component content
+ */
+export declare class EdPaginationItem extends EdElement {
+    static get styles(): import('lit').CSSResult;
+    /**
+     * The URL of the item link
+     */
+    href?: string;
+    /**
+     * Divide adds a divider in between items to show that it's not orderd (e.g. item with 5 and then next item is 22)
+     */
+    divide?: boolean;
+    /**
+     * Disabled item
+     */
+    disabled?: boolean;
+    /**
+     * Divide icon name
+     * 1) Name of the icon used to show a jump in the navigation
+     */
+    divideIconName?: string;
+    /**
+     * Active class for current item
+     */
+    isActive?: boolean;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ed-pagination-item': EdPaginationItem;
+    }
+}
+//# sourceMappingURL=pagination-item.d.ts.map

package/components/pagination-item/pagination-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination-item.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/pagination-item/pagination-item.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,SAAS;IAC7C,MAAM,KAAK,MAAM,4BAEhB;IAED;;OAEG;IAEH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IAEH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IAEH,cAAc,CAAC,EAAE,MAAM,CAAc;IAErC;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,MAAM;CAgBP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}

package/components/pagination-item/pagination-item.js

@@ -0,0 +1,52 @@
+import { unsafeCSS as l, html as c } from "lit";
+import { ifDefined as p } from "lit-html/directives/if-defined.js";
+import { property as t } from "lit/decorators.js";
+import { E as m } from "../EdElement.js";
+const _ = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-pagination__link{display:block;color:var(--ed-theme-color-content-default);text-decoration:none;padding:.5rem;cursor:pointer}.ed-c-pagination__link:hover,.ed-c-pagination__link:focus{background:var(--ed-theme-color-background-subtle)}.ed-c-pagination__item.ed-is-active .ed-c-pagination__link{background:var(--ed-theme-color-background-brand);color:var(--ed-theme-color-content-knockout)}.ed-c-pagination__item--divide .ed-c-pagination__link{pointer-events:none}.ed-c-pagination__item--disabled .ed-c-pagination__link{pointer-events:none;color:var(--ed-theme-color-content-subtle)}@media all and (min-width:48rem){.ed-c-pagination__link{padding:.5rem 1rem}}";
+var g = Object.defineProperty, o = (a, n, r, h) => {
+  for (var e = void 0, d = a.length - 1, s; d >= 0; d--)
+    (s = a[d]) && (e = s(n, r, e) || e);
+  return e && g(n, r, e), e;
+};
+class i extends m {
+  constructor() {
+    super(...arguments), this.divideIconName = "ellipsis";
+  }
+  static get styles() {
+    return l(_.toString());
+  }
+  render() {
+    const n = this.componentClassNames("ed-c-pagination__item", {
+      "ed-c-pagination__item--divide": this.divide === !0,
+      "ed-c-pagination__item--disabled": this.disabled === !0,
+      "ed-is-active": this.isActive === !0
+    });
+    return c`
+      <li class="${n}">
+        <a class="ed-c-pagination__link" href="${p(this.href)}">
+          <slot></slot>
+          ${this.divide && c`<ed-icon name="${this.divideIconName}"></ed-icon>`}
+        </a>
+      </li>
+    `;
+  }
+}
+o([
+  t()
+], i.prototype, "href");
+o([
+  t({ type: Boolean })
+], i.prototype, "divide");
+o([
+  t({ type: Boolean })
+], i.prototype, "disabled");
+o([
+  t()
+], i.prototype, "divideIconName");
+o([
+  t({ type: Boolean })
+], i.prototype, "isActive");
+customElements.get("ed-pagination-item") === void 0 && customElements.define("ed-pagination-item", i);
+export {
+  i as EdPaginationItem
+};

package/components/primary-nav/primary-nav.d.ts

@@ -0,0 +1,23 @@
+import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdElement';
+/**
+ * @slot - The primary navigation items
+ */
+export declare class EdPrimaryNav extends EdElement {
+    static get styles(): import('lit').CSSResult;
+    /**
+     * Behavior variant
+     * <ed-text-passage size="sm">
+     * <ul>
+     * <li>**side-by-side** keeps the primary nav item always in a horizontal pattern</li>
+     * </ul>
+     * </ed-text-passage>
+     */
+    behavior?: 'side-by-side';
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ed-primary-nav': EdPrimaryNav;
+    }
+}
+//# sourceMappingURL=primary-nav.d.ts.map

package/components/primary-nav/primary-nav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"primary-nav.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/primary-nav/primary-nav.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,YAAa,SAAQ,SAAS;IACzC,MAAM,KAAK,MAAM,4BAEhB;IAED;;;;;;;OAOG;IAEH,QAAQ,CAAC,EAAE,cAAc,CAAC;IAE1B,MAAM;CAaP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}

package/components/primary-nav/primary-nav.js

@@ -0,0 +1,33 @@
+import { unsafeCSS as o, html as d } from "lit";
+import { property as l } from "lit/decorators.js";
+import { E as m } from "../EdElement.js";
+const p = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-primary-nav__list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.ed-c-primary-nav--side-by-side .ed-c-primary-nav__list{flex-direction:row}@media all and (min-width:48rem){.ed-c-primary-nav__list{flex-direction:row}}";
+var c = Object.defineProperty, v = (i, r, t, y) => {
+  for (var e = void 0, s = i.length - 1, a; s >= 0; s--)
+    (a = i[s]) && (e = a(r, t, e) || e);
+  return e && c(r, t, e), e;
+};
+class n extends m {
+  static get styles() {
+    return o(p);
+  }
+  render() {
+    const r = this.componentClassNames("ed-c-primary-nav", {
+      "ed-c-primary-nav--side-by-side": this.behavior === "side-by-side"
+    });
+    return d`
+      <nav class="${r}">
+        <ul class="ed-c-primary-nav__list">
+          <slot></slot>
+        </ul>
+      </nav>
+    `;
+  }
+}
+v([
+  l()
+], n.prototype, "behavior");
+customElements.get("ed-primary-nav") === void 0 && customElements.define("ed-primary-nav", n);
+export {
+  n as EdPrimaryNav
+};

package/components/primary-nav-item/primary-nav-item.d.ts

@@ -0,0 +1,70 @@
+import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdElement';
+/**
+ * @slot - The label for the navigation item
+ */
+export declare class EdPrimaryNavItem extends EdElement {
+    /**
+     * Primary nav item text
+     */
+    text: string;
+    /**
+     * Primary nav item href
+     */
+    href: string;
+    /**
+     * Icon name
+     */
+    iconName?: string;
+    /**
+     * Append to the class name. Used for passing in utility classes
+     */
+    megaMenu?: boolean;
+    /**
+     * Append to the class name. Used for passing in utility classes
+     */
+    isActive?: boolean;
+    static get styles(): import('lit').CSSResult;
+    /**
+     * Initialize functions
+     */
+    constructor();
+    /**
+     * Connected Callback lifecycle
+     */
+    connectedCallback(): void;
+    /**
+     * Disconnected callback lifecycle
+     * 1) Remove window resize event listener
+     */
+    disconnectedCallback(): void;
+    /**
+     * Handle click outside the component
+     * 1) Close the show hide panel on click outside
+     * 2) If the nav is already closed then we don't care about outside clicks and we
+     * can bail early
+     * 3) By the time a user clicks on the page the shadowRoot will almost certainly be
+     * defined, but TypeScript isn't that trusting and sees this.shadowRoot as possibly
+     * undefined. To work around that we'll check that we have a shadowRoot (and a
+     * rendered .host) element here to appease the TypeScript compiler. This should never
+     * actually be shown or run for a human end user.
+     * 4) Check to see if we clicked inside the active navigation item
+     * 5) If the navigation is active and we've clicked outside of the nav then it should
+     * be closed.
+     */
+    handleOnClickOutside(event: MouseEvent): void;
+    /**
+     * Toggle active state of primary nav item
+     * 1) Remove isActive state from all sibling elements
+     * 2) Toggle active state of element selected
+     */
+    clickHandler(e: MouseEvent): void;
+    closePanel(): void;
+    handleOnKeyDown(e: KeyboardEvent): void;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ed-primary-nav-item': EdPrimaryNavItem;
+    }
+}
+//# sourceMappingURL=primary-nav-item.d.ts.map

package/components/primary-nav-item/primary-nav-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"primary-nav-item.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/primary-nav-item/primary-nav-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAItF,OAAO,cAAc,CAAC;AAGtB;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,SAAS;IAC7C;;OAEG;IAEH,IAAI,SAAc;IAElB;;OAEG;IAEH,IAAI,SAAO;IAEX;;OAEG;IAEH,QAAQ,CAAC,EAAE,MAAM,CAAyB;IAE1C;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,MAAM,KAAK,MAAM,4BAEhB;IAED;;OAEG;;IAOH;;OAEG;IACH,iBAAiB;IAMjB;;;OAGG;IACH,oBAAoB;IAKpB;;;;;;;;;;;;;OAaG;IACH,oBAAoB,CAAC,KAAK,EAAE,UAAU;IAoBtC;;;;OAIG;IACH,YAAY,CAAC,CAAC,EAAE,UAAU;IAa1B,UAAU;IAIV,eAAe,CAAC,CAAC,EAAE,aAAa;IAWhC,MAAM;CA4BP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,gBAAgB,CAAC;KACzC;CACF"}

package/components/primary-nav-item/primary-nav-item.js

@@ -0,0 +1,121 @@
+import { E as c } from "../EdElement.js";
+import { unsafeCSS as h, html as l } from "lit";
+import { property as n, state as p } from "lit/decorators.js";
+import { ifDefined as v } from "lit-html/directives/if-defined.js";
+import "../icon/icon.js";
+const u = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-primary-nav__item{border-bottom-width:var(--ed-theme-border-width-sm);border-bottom-style:solid;border-bottom-color:var(--ed-theme-color-border-subtle)}@media all and (min-width:48rem){.ed-c-primary-nav__item{border-bottom:none}}.ed-c-primary-nav__link{font-family:var(--ed-theme-typography-label-default-font-family);font-weight:var(--ed-theme-typography-label-default-font-weight);font-size:var(--ed-theme-typography-label-default-font-size);line-height:var(--ed-theme-typography-label-default-line-height);letter-spacing:var(--ed-theme-typography-label-default-letter-spacing);text-transform:var(--ed-theme-typography-label-default-text-transform);display:flex;align-items:center;appearance:none;background:none;border:none;border-radius:var(--ed-theme-border-radius-md);white-space:nowrap;width:100%;margin:0;padding:1rem 2rem;color:var(--ed-theme-color-content-brand);text-decoration:none;transition:all var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease);cursor:pointer}.ed-c-primary-nav__link:hover,.ed-c-primary-nav__link:focus-visible{background:var(--ed-theme-color-background-brand-knockout);color:var(--ed-theme-color-content-knockout)}.ed-c-primary-nav__item.ed-is-active .ed-c-primary-nav__link{background:var(--ed-theme-color-background-brand-knockout);color:var(--ed-theme-color-content-knockout)}@media all and (min-width:48rem){.ed-c-primary-nav__link{padding:1rem .5rem}}@media all and (min-width:60rem){.ed-c-primary-nav__link{padding:1rem;border-bottom:none}}ed-icon{--ed-icon-height: .5rem ;--ed-icon-width: .5rem ;margin-left:auto;transition:transform var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease)}.ed-c-primary-nav__item.ed-is-active ed-icon{transform:rotate(-180deg)}@media all and (min-width:48rem){ed-icon{margin-left:.5rem}}.ed-c-primary-nav__item-panel{visibility:hidden;width:100%;height:0;overflow:hidden;background:transparent;opacity:0;transition:all 0s var(--ed-theme-animation-ease);z-index:-1}@media all and (min-width:48rem){.ed-c-primary-nav__item-panel{position:absolute;top:100%;left:0;height:auto;box-shadow:var(--ed-theme-box-shadow-md)}}.ed-c-primary-nav__item.ed-is-active .ed-c-primary-nav__item-panel{display:block;visibility:visible;height:auto;padding-top:2rem;padding-bottom:2rem;background:var(--ed-theme-color-background-default);opacity:1;z-index:1;transition:opacity var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease)}.ed-c-primary-nav__item--megamenu .ed-c-primary-nav__item-panel-inner{max-width:70rem;padding-right:2rem;padding-left:2rem;margin:0 auto}";
+var f = Object.defineProperty, r = (o, e, t, d) => {
+  for (var i = void 0, s = o.length - 1, m; s >= 0; s--)
+    (m = o[s]) && (i = m(e, t, i) || i);
+  return i && f(e, t, i), i;
+};
+class a extends c {
+  /**
+   * Initialize functions
+   */
+  constructor() {
+    super(), this.text = "Nav item", this.href = "#", this.iconName = "keyboard-arrow-down", this.handleOnClickOutside = this.handleOnClickOutside.bind(this), this.clickHandler = this.clickHandler.bind(this);
+  }
+  static get styles() {
+    return h(u);
+  }
+  /**
+   * Connected Callback lifecycle
+   */
+  connectedCallback() {
+    super.connectedCallback(), document.addEventListener("mousedown", this.handleOnClickOutside, !1);
+  }
+  /**
+   * Disconnected callback lifecycle
+   * 1) Remove window resize event listener
+   */
+  disconnectedCallback() {
+    document.removeEventListener("mousedown", this.handleOnClickOutside, !1), super.disconnectedCallback();
+  }
+  /**
+   * Handle click outside the component
+   * 1) Close the show hide panel on click outside
+   * 2) If the nav is already closed then we don't care about outside clicks and we
+   * can bail early
+   * 3) By the time a user clicks on the page the shadowRoot will almost certainly be
+   * defined, but TypeScript isn't that trusting and sees this.shadowRoot as possibly
+   * undefined. To work around that we'll check that we have a shadowRoot (and a
+   * rendered .host) element here to appease the TypeScript compiler. This should never
+   * actually be shown or run for a human end user.
+   * 4) Check to see if we clicked inside the active navigation item
+   * 5) If the navigation is active and we've clicked outside of the nav then it should
+   * be closed.
+   */
+  handleOnClickOutside(e) {
+    if (!this.isActive)
+      return;
+    if (!this.shadowRoot?.host)
+      throw Error("Could not determine navigation context during click handler");
+    const t = e.composedPath().includes(this.shadowRoot.host);
+    this.isActive && !t && (this.isActive = !1);
+  }
+  /**
+   * Toggle active state of primary nav item
+   * 1) Remove isActive state from all sibling elements
+   * 2) Toggle active state of element selected
+   */
+  clickHandler(e) {
+    e.preventDefault(), this.parentNode && this.parentNode.querySelectorAll("ed-primary-nav-item").forEach((d) => {
+      d !== this && (d.isActive = !1);
+    }), this.isActive = !this.isActive;
+  }
+  closePanel() {
+    this.isActive = !1;
+  }
+  handleOnKeyDown(e) {
+    if (e.key === "Escape" && this.isActive === !0) {
+      this.closePanel();
+      const t = this.shadowRoot?.querySelector(".ed-c-primary-nav__link");
+      t && setTimeout(() => {
+        t.focus();
+      }, 1);
+    }
+  }
+  render() {
+    const e = this.componentClassNames("ed-c-primary-nav__item", {
+      "ed-is-active": this.isActive === !0,
+      "ed-c-primary-nav__item--megamenu": this.megaMenu === !0
+    });
+    return this.megaMenu ? l`
+        <li class="${e}" @keydown=${this.handleOnKeyDown}>
+          <button class="ed-c-primary-nav__link" @click=${this.clickHandler} aria-expanded=${this.isActive === !0}>
+            ${this.text}
+            <ed-icon styleModifier="ed-c-button__icon" aria-hidden="true" name="${v(this.iconName)}"></ed-icon>
+          </button>
+          <div class="ed-c-primary-nav__item-panel">
+            <div class="ed-c-primary-nav__item-panel-inner">
+              <slot></slot>
+            </div>
+          </div>
+        </li>
+      ` : l`
+        <li class="${e}">
+          <a class="ed-c-primary-nav__link" href="${this.href}">${this.text}</a>
+        </li>
+      `;
+  }
+}
+r([
+  n()
+], a.prototype, "text");
+r([
+  n()
+], a.prototype, "href");
+r([
+  n()
+], a.prototype, "iconName");
+r([
+  n({ type: Boolean })
+], a.prototype, "megaMenu");
+r([
+  p()
+], a.prototype, "isActive");
+customElements.get("ed-primary-nav-item") === void 0 && customElements.define("ed-primary-nav-item", a);
+export {
+  a as EdPrimaryNavItem
+};

package/components/radio-field/radio-field.d.ts

@@ -0,0 +1,84 @@
+import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdElement';
+/**
+ * @slot - The component content
+ */
+export declare class EdRadioField extends EdElement {
+    static get styles(): import('lit').CSSResult;
+    /**
+     * Error switch
+     */
+    isError?: boolean;
+    /**
+     * Success switch
+     */
+    isSuccess?: boolean;
+    /**
+     * value attribute
+     */
+    readOnly?: boolean;
+    /**
+     * disabled attribute
+     */
+    disabled?: boolean;
+    /**
+     * value attribute
+     */
+    value?: string;
+    /**
+     * Id
+     */
+    fieldId?: string;
+    /**
+     * Name attribute
+     */
+    name?: string;
+    /**
+     * Checked property
+     */
+    checked?: boolean;
+    /**
+     * Description or Error message for the field
+     */
+    fieldNote?: any;
+    /**
+     * Required attribute
+     */
+    required?: boolean;
+    /**
+     * Visibly hide the legend
+     * 1) Removes the legend from visual users but can still be read by assistive technology
+     */
+    hideLegend?: boolean;
+    /**
+     * Optional label to appear after label text
+     */
+    optionalLabel?: string;
+    /**
+     * Icon to display in field note
+     */
+    iconName?: string;
+    /**
+     * Inverted variant
+     * 1) Used for dark backgrounds
+     */
+    inverted?: boolean;
+    /**
+     * aria-describedby attribute property
+     */
+    ariaDescribedBy?: string;
+    /**
+     * The form field's label
+     */
+    label: string;
+    /**
+     * Autogenerate
+     */
+    connectedCallback(): void;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ed-radio-field': EdRadioField;
+    }
+}
+//# sourceMappingURL=radio-field.d.ts.map

package/components/radio-field/radio-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-field.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/radio-field/radio-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAKtF,OAAO,0BAA0B,CAAC;AAGlC;;GAEG;AACH,qBAAa,YAAa,SAAQ,SAAS;IACzC,MAAM,KAAK,MAAM,4BAEhB;IAED;;OAEG;IAEH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IAEH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IAEH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IAEH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IAEH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IAEH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IAEH,SAAS,CAAC,EAAE,GAAG,CAAC;IAEhB;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IAEH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IAEH,aAAa,CAAC,EAAE,MAAM,CAAgB;IAEtC;;OAEG;IAEH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IAEH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IAEH,KAAK,EAAE,MAAM,CAAW;IAExB;;OAEG;IACH,iBAAiB;IAOjB,MAAM;CAgCP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}