@covalent/components 4.16.0-beta.1 → 6.0.1

package/action-ribbon.mjs

@@ -0,0 +1,148 @@
+import { LitElement as g, html as h, css as u, unsafeCSS as f } from "lit";
+import { query as l, property as m, customElement as v } from "lit/decorators.js";
+import { addHasRemoveClass as x } from "@material/mwc-base/base-element";
+import { observer as y } from "@material/mwc-base/observer";
+import { selectors as _, CloseReason as b, events as s } from "@material/banner/constants";
+import { MDCBannerFoundation as w } from "@material/banner";
+import { classMap as C } from "lit/directives/class-map.js";
+var E = Object.defineProperty, k = Object.getOwnPropertyDescriptor, i = (c, e, r, a) => {
+  for (var t = a > 1 ? void 0 : a ? k(e, r) : e, o = c.length - 1, d; o >= 0; o--)
+    (d = c[o]) && (t = (a ? d(e, r, t) : d(t)) || t);
+  return a && t && E(e, r, t), t;
+};
+class n extends g {
+  constructor() {
+    super(...arguments), this.mdcFoundationClass = w, this.open = !0, this.labelText = "", this.icon = "", this.iconAriaLabel = "", this.centered = !0, this.reason = b.UNSPECIFIED;
+  }
+  render() {
+    const e = {
+      "mdc-banner": !0,
+      negative: this.state === "negative",
+      positive: this.state === "positive",
+      caution: this.state === "caution",
+      active: this.state === "active",
+      "mdc-banner--centered": this.centered
+    };
+    return h` <div class="${C(e)}" role="banner">
+      <div class="mdc-banner__content" role="alertdialog" aria-live="assertive" aria-label="${this.labelText}">
+        <div class="mdc-banner__graphic-text-wrapper">
+          ${this.icon ? this.renderIcon() : ""}
+          <div class="mdc-banner__text">${this.labelText}</div>
+        </div>
+        <div class="mdc-banner__actions">
+          <slot name="action-items"></slot>
+        </div>
+      </div>
+    </div>`;
+  }
+  renderIcon() {
+    return h` <div class="mdc-banner__graphic" role="img" aria-label="${this.iconAriaLabel}">
+      <slot name="icon">
+        <cv-icon class="mdc-banner__icon"> ${this.icon} </cv-icon>
+      </slot>
+    </div>`;
+  }
+  createAdapter() {
+    return {
+      ...x(this.mdcRoot),
+      getContentHeight: () => this.mdcContent.offsetHeight,
+      setStyleProperty: (e, r) => this.mdcRoot.style.setProperty(e, r),
+      trapFocus: () => {
+        var e;
+        return (e = this.primaryActionEl) == null ? void 0 : e.focus();
+      },
+      releaseFocus: () => {
+        var e;
+        return (e = this.primaryActionEl) == null ? void 0 : e.blur();
+      },
+      notifyActionClicked: (e) => this.dispatchEvent(
+        new CustomEvent(s.ACTION_CLICKED, {
+          bubbles: !0,
+          cancelable: !0,
+          detail: { reason: e }
+        })
+      ),
+      notifyClosed: (e) => this.dispatchEvent(
+        new CustomEvent(s.CLOSED, {
+          bubbles: !0,
+          cancelable: !0,
+          detail: { reason: e }
+        })
+      ),
+      notifyClosing: (e) => this.dispatchEvent(
+        new CustomEvent(s.CLOSING, {
+          bubbles: !0,
+          cancelable: !0,
+          detail: { reason: e }
+        })
+      ),
+      notifyOpened: () => this.dispatchEvent(
+        new CustomEvent(s.OPENED, { bubbles: !0, cancelable: !0 })
+      ),
+      notifyOpening: () => this.dispatchEvent(
+        new CustomEvent(s.OPENING, { bubbles: !0, cancelable: !0 })
+      )
+    };
+  }
+  /** @export */
+  show() {
+    this.open = !0;
+  }
+  /** @export */
+  close(e = b.UNSPECIFIED) {
+    this.reason = e, this.open = !1;
+  }
+  async firstUpdated() {
+    this.mdcFoundation !== void 0 && this.mdcFoundation.destroy(), this.mdcFoundation = new this.mdcFoundationClass(this.createAdapter()), this.open && this.mdcFoundation.open();
+  }
+}
+i([
+  l(".mdc-banner")
+], n.prototype, "mdcRoot", 2);
+i([
+  l(_.CONTENT)
+], n.prototype, "mdcContent", 2);
+i([
+  l(_.PRIMARY_ACTION)
+], n.prototype, "primaryActionEl", 2);
+i([
+  m({ type: Boolean, reflect: !0 }),
+  y(function(c) {
+    this.mdcFoundation && (c ? this.mdcFoundation.open() : (this.mdcFoundation.close(this.reason), this.reason = b.UNSPECIFIED));
+  })
+], n.prototype, "open", 2);
+i([
+  m({ type: String })
+], n.prototype, "labelText", 2);
+i([
+  m({ type: String })
+], n.prototype, "icon", 2);
+i([
+  m({ type: String })
+], n.prototype, "iconAriaLabel", 2);
+i([
+  m({ type: Boolean })
+], n.prototype, "centered", 2);
+i([
+  m()
+], n.prototype, "state", 2);
+const O = `.mdc-banner__graphic{color:#fff;color:var(--mdc-theme-surface, #fff)}.mdc-banner__graphic{background-color:#6200ee;background-color:var(--mdc-theme-primary, #6200ee)}.mdc-banner__content,.mdc-banner__fixed{min-width:344px}@media (max-width: 480px),(max-width: 344px){.mdc-banner__content,.mdc-banner__fixed{min-width:100%}}.mdc-banner__content{max-width:720px}.mdc-banner{z-index:1;border-bottom-style:solid;box-sizing:border-box;display:none;flex-shrink:0;height:0;position:relative;width:100%}@media (max-width: 480px){.mdc-banner .mdc-banner__fixed{left:0;right:0}.mdc-banner .mdc-banner__text{margin-left:16px;margin-right:36px}[dir=rtl] .mdc-banner .mdc-banner__text,.mdc-banner .mdc-banner__text[dir=rtl]{margin-left:36px;margin-right:16px}}@media (max-width: 480px){.mdc-banner.mdc-banner--mobile-stacked .mdc-banner__content{flex-wrap:wrap}.mdc-banner.mdc-banner--mobile-stacked .mdc-banner__graphic{margin-bottom:12px}.mdc-banner.mdc-banner--mobile-stacked .mdc-banner__text{margin-left:16px;margin-right:8px;padding-bottom:4px}[dir=rtl] .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__text,.mdc-banner.mdc-banner--mobile-stacked .mdc-banner__text[dir=rtl]{margin-left:8px;margin-right:16px}.mdc-banner.mdc-banner--mobile-stacked .mdc-banner__actions{margin-left:auto}}.mdc-banner--opening,.mdc-banner--open,.mdc-banner--closing{display:flex}.mdc-banner--open{transition:height .3s ease}.mdc-banner--open .mdc-banner__content{transition:transform .3s ease;transform:translateY(0)}.mdc-banner--closing{transition:height .25s ease}.mdc-banner--closing .mdc-banner__content{transition:transform .25s ease}.mdc-banner--centered .mdc-banner__content{left:0;margin-left:auto;margin-right:auto;right:0}.mdc-banner__fixed{border-bottom-style:solid;box-sizing:border-box;height:inherit;position:fixed;width:100%}.mdc-banner__content{display:flex;min-height:52px;position:absolute;transform:translateY(-100%);width:100%}.mdc-banner__graphic-text-wrapper{display:flex;width:100%}.mdc-banner__graphic{margin:16px 0 16px 16px;flex-shrink:0;text-align:center}[dir=rtl] .mdc-banner__graphic,.mdc-banner__graphic[dir=rtl]{margin-left:0;margin-right:16px}.mdc-banner__icon{position:relative;top:50%;transform:translateY(-50%)}.mdc-banner__text{margin-left:24px;margin-right:90px;align-self:center;flex-grow:1;padding-top:16px;padding-bottom:16px}[dir=rtl] .mdc-banner__text,.mdc-banner__text[dir=rtl]{margin-left:90px;margin-right:24px}.mdc-banner__actions{padding:8px 8px 8px 0;align-self:flex-end;display:flex;flex-shrink:0}[dir=rtl] .mdc-banner__actions,.mdc-banner__actions[dir=rtl]{padding-left:8px;padding-right:0}.mdc-banner{background-color:#fff;border-bottom-color:#0000001f;border-bottom-width:1px;border-radius:0}.mdc-banner .mdc-banner__text{color:#000}.mdc-banner .mdc-banner__text{letter-spacing:.0178571429em;font-size:.875rem;font-family:Roboto,sans-serif;font-weight:400;line-height:1.25rem}.mdc-banner .mdc-banner__graphic{border-radius:50%}.mdc-banner .mdc-banner__graphic{height:40px;width:40px}.mdc-banner .mdc-banner__fixed{background-color:#fff}.mdc-banner .mdc-banner__fixed{border-bottom-color:#0000001f}.mdc-banner .mdc-banner__fixed{border-bottom-width:1px}.mdc-banner .mdc-button:not(:disabled){color:#6200ee;color:var(--mdc-text-button-label-text-color, #6200ee)}.mdc-banner .mdc-button .mdc-button__ripple:before,.mdc-banner .mdc-button .mdc-button__ripple:after{background-color:#6200ee;background-color:var(--mdc-text-button-hover-state-layer-color, #6200ee)}.mdc-banner .mdc-button:hover .mdc-button__ripple:before,.mdc-banner .mdc-button.mdc-ripple-surface--hover .mdc-button__ripple:before{opacity:.04;opacity:var(--mdc-text-button-hover-state-layer-opacity, .04)}.mdc-banner .mdc-button.mdc-ripple-upgraded--background-focused .mdc-button__ripple:before,.mdc-banner .mdc-button:not(.mdc-ripple-upgraded):focus .mdc-button__ripple:before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-text-button-focus-state-layer-opacity, .12)}.mdc-banner .mdc-button:not(.mdc-ripple-upgraded) .mdc-button__ripple:after{transition:opacity .15s linear}.mdc-banner .mdc-button:not(.mdc-ripple-upgraded):active .mdc-button__ripple:after{transition-duration:75ms;opacity:.1;opacity:var(--mdc-text-button-pressed-state-layer-opacity, .1)}.mdc-banner .mdc-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: var(--mdc-text-button-pressed-state-layer-opacity, .1)}.mdc-banner__secondary-action{margin-left:0;margin-right:8px}[dir=rtl] .mdc-banner__secondary-action,.mdc-banner__secondary-action[dir=rtl]{margin-left:8px;margin-right:0}.mdc-banner{--cv-action-ribbon-background: transparent;background-color:var(--cv-action-ribbon-background);overflow:hidden}.mdc-banner .mdc-banner__content{max-width:inherit}.mdc-banner .mdc-banner__graphic,.mdc-banner .mdc-banner__text{--mdc-theme-primary: var(--mdc-theme-surface-neutral-highlight-hover);--mdc-theme-on-surface: var(--mdc-theme-text-icon-on-background);color:var(--mdc-theme-on-surface)}.mdc-banner .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-text-disabled-on-background);margin-left:16px;font-family:var(--mdc-typography-caption-font-family);font-size:var(--mdc-typography-caption-font-size);font-weight:var(--mdc-typography-caption-font-weight);line-height:var(--mdc-typography-caption-line-height)}.mdc-banner.caution{--cv-action-ribbon-background: var(--mdc-theme-surface-caution-highlight)}.mdc-banner.caution .mdc-banner__graphic,.mdc-banner.caution .mdc-banner__text{--mdc-theme-primary: var(--mdc-theme-surface-caution-highlight-hover);--mdc-theme-on-surface: var(--mdc-theme-caution)}.mdc-banner.negative{--cv-action-ribbon-background: var( --mdc-theme-surface-negative-highlight )}.mdc-banner.negative .mdc-banner__graphic,.mdc-banner.negative .mdc-banner__text{--mdc-theme-primary: var(--mdc-theme-surface-negative-highlight-hover);--mdc-theme-on-surface: var(--mdc-theme-error)}.mdc-banner.active{--cv-action-ribbon-background: var( --mdc-theme-surface-secondary-highlight )}.mdc-banner.active .mdc-banner__graphic,.mdc-banner.active .mdc-banner__text{--mdc-theme-primary: var(--mdc-theme-surface-secondary-highlight-hover);--mdc-theme-on-surface: var(--mdc-theme-secondary)}.mdc-banner.positive{--cv-action-ribbon-background: var( --mdc-theme-surface-positive-highlight )}.mdc-banner.positive .mdc-banner__graphic,.mdc-banner.positive .mdc-banner__text{--mdc-theme-primary: var(--mdc-theme-surface-positive-highlight-hover);--mdc-theme-on-surface: var(--mdc-theme-positive)}::slotted(*){margin-left:8px}.mdc-banner__content{min-height:56px}.mdc-banner__graphic{background-color:transparent;margin-top:8px;margin-bottom:8px}.mdc-banner__actions{align-self:center}
+`;
+var P = Object.defineProperty, F = Object.getOwnPropertyDescriptor, A = (c, e, r, a) => {
+  for (var t = a > 1 ? void 0 : a ? F(e, r) : e, o = c.length - 1, d; o >= 0; o--)
+    (d = c[o]) && (t = (a ? d(e, r, t) : d(t)) || t);
+  return a && t && P(e, r, t), t;
+};
+let p = class extends n {
+};
+p.styles = [
+  u`
+      ${f(O)}
+    `
+];
+p = A([
+  v("cv-action-ribbon")
+], p);
+export {
+  p as CovalentActionRibbon
+};

package/alert.mjs

@@ -0,0 +1,140 @@
+import { LitElement as l, html as b, css as _, unsafeCSS as f } from "lit";
+import { query as p, property as s, customElement as g } from "lit/decorators.js";
+import { addHasRemoveClass as u } from "@material/mwc-base/base-element";
+import { observer as v } from "@material/mwc-base/observer";
+import { MDCBannerFoundation as x } from "@material/banner/foundation";
+import { CloseReason as m, events as y } from "@material/banner/constants";
+import { classMap as w } from "lit/directives/class-map.js";
+var C = Object.defineProperty, k = Object.getOwnPropertyDescriptor, o = (i, e, r, a) => {
+  for (var t = a > 1 ? void 0 : a ? k(e, r) : e, c = i.length - 1, d; c >= 0; c--)
+    (d = i[c]) && (t = (a ? d(e, r, t) : d(t)) || t);
+  return a && t && C(e, r, t), t;
+};
+class n extends l {
+  constructor() {
+    super(...arguments), this.mdcFoundationClass = x, this.open = !0, this.titleText = "", this.descriptionText = "", this.icon = "", this.iconAriaLabel = "", this.inline = !1, this.state = "", this.reason = m.UNSPECIFIED;
+  }
+  render() {
+    const e = {
+      "mdc-banner": !0,
+      "cv-banner--inline": this.inline,
+      negative: this.state === "negative",
+      positive: this.state === "positive",
+      caution: this.state === "caution",
+      active: this.state === "active"
+    };
+    return b` <div class="${w(e)}" role="banner">
+      <div class="mdc-banner__content" role="alertdialog" aria-live="assertive" aria-label="${this.titleText}">
+        <div class="mdc-banner__graphic-text-wrapper">
+          ${this.icon ? this.renderIcon() : ""}
+          <div class="mdc-banner__text">
+            <span class="mdc-typography--body2">${this.titleText}</span>
+            <div class="mdc-typography--body1">${this.descriptionText}</div>
+          </div>
+        </div>
+        <div class="mdc-banner__actions">
+          <slot name="action-items"></slot>
+        </div>
+      </div>
+    </div>`;
+  }
+  /** @soyTemplate */
+  renderIcon() {
+    return b` <div class="mdc-banner__graphic" role="img" aria-label="${this.iconAriaLabel}">
+      <slot name="icon">
+        <cv-icon class="mdc-banner__icon"> ${this.icon} </cv-icon>
+      </slot>
+    </div>`;
+  }
+  createAdapter() {
+    return {
+      ...u(this.mdcRoot),
+      getContentHeight: () => this.mdcContent.offsetHeight,
+      setStyleProperty: (e, r) => {
+        this.mdcRoot.style.setProperty(e, r);
+      },
+      trapFocus: () => {
+      },
+      releaseFocus: () => {
+      },
+      notifyActionClicked: (e) => this.dispatchEvent(
+        new CustomEvent(y.ACTION_CLICKED, {
+          bubbles: !0,
+          cancelable: !0,
+          detail: { reason: e }
+        })
+      ),
+      notifyClosed: () => {
+      },
+      notifyClosing: () => {
+        this.open = !1;
+      },
+      notifyOpened: () => {
+      },
+      notifyOpening: () => {
+        this.open = !0;
+      }
+    };
+  }
+  /** @export */
+  show() {
+    this.open = !0;
+  }
+  /** @export */
+  close(e = m.UNSPECIFIED) {
+    this.reason = e, this.open = !1;
+  }
+  async firstUpdated() {
+    this.mdcFoundation !== void 0 && this.mdcFoundation.destroy(), this.mdcFoundation = new this.mdcFoundationClass(this.createAdapter()), this.open && this.mdcFoundation.open();
+  }
+}
+o([
+  p(".mdc-banner")
+], n.prototype, "mdcRoot", 2);
+o([
+  p(".mdc-banner__content")
+], n.prototype, "mdcContent", 2);
+o([
+  s({ type: Boolean, reflect: !0 }),
+  v(function(i) {
+    this.mdcFoundation && (i ? this.mdcFoundation.open() : (this.mdcFoundation.close(this.reason), this.reason = m.UNSPECIFIED));
+  })
+], n.prototype, "open", 2);
+o([
+  s({ type: String })
+], n.prototype, "titleText", 2);
+o([
+  s({ type: String })
+], n.prototype, "descriptionText", 2);
+o([
+  s({ type: String })
+], n.prototype, "icon", 2);
+o([
+  s({ type: String })
+], n.prototype, "iconAriaLabel", 2);
+o([
+  s({ type: Boolean })
+], n.prototype, "inline", 2);
+o([
+  s()
+], n.prototype, "state", 2);
+const F = `:host .mdc-banner__graphic{color:#fff;color:var(--mdc-theme-surface, #fff)}:host .mdc-banner__graphic{background-color:#6200ee;background-color:var(--mdc-theme-primary, #6200ee)}:host .mdc-banner__content,:host .mdc-banner__fixed{min-width:344px}@media (max-width: 480px),(max-width: 344px){:host .mdc-banner__content,:host .mdc-banner__fixed{min-width:100%}}:host .mdc-banner__content{max-width:720px}:host .mdc-banner{z-index:1;border-bottom-style:solid;box-sizing:border-box;display:none;flex-shrink:0;height:0;position:relative;width:100%}@media (max-width: 480px){:host .mdc-banner .mdc-banner__fixed{left:0;right:0}:host .mdc-banner .mdc-banner__text{margin-left:16px;margin-right:36px}[dir=rtl] :host .mdc-banner .mdc-banner__text,:host .mdc-banner .mdc-banner__text[dir=rtl]{margin-left:36px;margin-right:16px}}@media (max-width: 480px){:host .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__content{flex-wrap:wrap}:host .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__graphic{margin-bottom:12px}:host .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__text{margin-left:16px;margin-right:8px;padding-bottom:4px}[dir=rtl] :host .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__text,:host .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__text[dir=rtl]{margin-left:8px;margin-right:16px}:host .mdc-banner.mdc-banner--mobile-stacked .mdc-banner__actions{margin-left:auto}}:host .mdc-banner--opening,:host .mdc-banner--open,:host .mdc-banner--closing{display:flex}:host .mdc-banner--open{transition:height .3s ease}:host .mdc-banner--open .mdc-banner__content{transition:transform .3s ease;transform:translateY(0)}:host .mdc-banner--closing{transition:height .25s ease}:host .mdc-banner--closing .mdc-banner__content{transition:transform .25s ease}:host .mdc-banner--centered .mdc-banner__content{left:0;margin-left:auto;margin-right:auto;right:0}:host .mdc-banner__fixed{border-bottom-style:solid;box-sizing:border-box;height:inherit;position:fixed;width:100%}:host .mdc-banner__content{display:flex;min-height:52px;position:absolute;transform:translateY(-100%);width:100%}:host .mdc-banner__graphic-text-wrapper{display:flex;width:100%}:host .mdc-banner__graphic{margin:16px 0 16px 16px;flex-shrink:0;text-align:center}[dir=rtl] :host .mdc-banner__graphic,:host .mdc-banner__graphic[dir=rtl]{margin-left:0;margin-right:16px}:host .mdc-banner__icon{position:relative;top:50%;transform:translateY(-50%)}:host .mdc-banner__text{margin-left:24px;margin-right:90px;align-self:center;flex-grow:1;padding-top:16px;padding-bottom:16px}[dir=rtl] :host .mdc-banner__text,:host .mdc-banner__text[dir=rtl]{margin-left:90px;margin-right:24px}:host .mdc-banner__actions{padding:8px 8px 8px 0;align-self:flex-end;display:flex;flex-shrink:0}[dir=rtl] :host .mdc-banner__actions,:host .mdc-banner__actions[dir=rtl]{padding-left:8px;padding-right:0}:host .mdc-banner{background-color:#fff;border-bottom-color:#0000001f;border-bottom-width:1px;border-radius:0}:host .mdc-banner .mdc-banner__text{color:#000}:host .mdc-banner .mdc-banner__text{letter-spacing:.0178571429em;font-size:.875rem;font-family:Roboto,sans-serif;font-weight:400;line-height:1.25rem}:host .mdc-banner .mdc-banner__graphic{border-radius:50%}:host .mdc-banner .mdc-banner__graphic{height:40px;width:40px}:host .mdc-banner .mdc-banner__fixed{background-color:#fff}:host .mdc-banner .mdc-banner__fixed{border-bottom-color:#0000001f}:host .mdc-banner .mdc-banner__fixed{border-bottom-width:1px}:host .mdc-banner .mdc-button:not(:disabled){color:#6200ee;color:var(--mdc-text-button-label-text-color, #6200ee)}:host .mdc-banner .mdc-button .mdc-button__ripple:before,:host .mdc-banner .mdc-button .mdc-button__ripple:after{background-color:#6200ee;background-color:var(--mdc-text-button-hover-state-layer-color, #6200ee)}:host .mdc-banner .mdc-button:hover .mdc-button__ripple:before,:host .mdc-banner .mdc-button.mdc-ripple-surface--hover .mdc-button__ripple:before{opacity:.04;opacity:var(--mdc-text-button-hover-state-layer-opacity, .04)}:host .mdc-banner .mdc-button.mdc-ripple-upgraded--background-focused .mdc-button__ripple:before,:host .mdc-banner .mdc-button:not(.mdc-ripple-upgraded):focus .mdc-button__ripple:before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-text-button-focus-state-layer-opacity, .12)}:host .mdc-banner .mdc-button:not(.mdc-ripple-upgraded) .mdc-button__ripple:after{transition:opacity .15s linear}:host .mdc-banner .mdc-button:not(.mdc-ripple-upgraded):active .mdc-button__ripple:after{transition-duration:75ms;opacity:.1;opacity:var(--mdc-text-button-pressed-state-layer-opacity, .1)}:host .mdc-banner .mdc-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: var(--mdc-text-button-pressed-state-layer-opacity, .1)}:host .mdc-banner__secondary-action{margin-left:0;margin-right:8px}[dir=rtl] :host .mdc-banner__secondary-action,:host .mdc-banner__secondary-action[dir=rtl]{margin-left:8px;margin-right:0}:host .mdc-banner{--mdc-theme-surface: var(--mdc-theme-surface-neutral);background-color:var(--mdc-theme-surface)}:host .mdc-banner .mdc-banner__graphic{--mdc-theme-surface: var(--mdc-theme-text-icon-on-background)}:host .mdc-banner .mdc-banner__text{color:var(--mdc-theme-text-primary-on-background)}:host .mdc-banner .mdc-banner__text .mdc-typography--body2{font-family:var(--mdc-typography-body2-font-family);font-size:var(--mdc-typography-body2-font-size);font-weight:700;line-height:var(--mdc-typography-body2-line-height)}:host .mdc-banner .mdc-banner__text .mdc-typography--body1{color:var(--mdc-theme-text-secondary-on-background);font-family:var(--mdc-typography-body1-font-family);font-size:var(--mdc-typography-body1-font-size);font-weight:var(--mdc-typography-body1-font-weight);line-height:var(--mdc-typography-body1-line-height)}:host .mdc-banner.caution{--mdc-theme-surface: var(--mdc-theme-surface-caution)}:host .mdc-banner.caution.cv-banner--inline{--mdc-theme-surface: var(--mdc-theme-surface-caution-highlight)}:host .mdc-banner.caution.cv-banner--inline .mdc-banner__graphic,:host .mdc-banner.caution.cv-banner--inline .mdc-banner__text{--mdc-theme-surface: var(--mdc-theme-caution);--mdc-theme-text-primary-on-background: var(--mdc-theme-caution)}:host .mdc-banner.negative{--mdc-theme-surface: var(--mdc-theme-surface-negative)}:host .mdc-banner.negative.cv-banner--inline{--mdc-theme-surface: var(--mdc-theme-surface-negative-highlight)}:host .mdc-banner.negative.cv-banner--inline .mdc-banner__graphic,:host .mdc-banner.negative.cv-banner--inline .mdc-banner__text{--mdc-theme-surface: var(--mdc-theme-negative);--mdc-theme-text-primary-on-background: var(--mdc-theme-negative)}:host .mdc-banner.active{--mdc-theme-surface: var(--mdc-theme-surface-secondary)}:host .mdc-banner.active.cv-banner--inline{--mdc-theme-surface: var(--mdc-theme-surface-secondary-highlight)}:host .mdc-banner.active.cv-banner--inline .mdc-banner__graphic,:host .mdc-banner.active.cv-banner--inline .mdc-banner__text{--mdc-theme-surface: var(--mdc-theme-secondary);--mdc-theme-text-primary-on-background: var(--mdc-theme-secondary)}:host .mdc-banner.positive{--mdc-theme-surface: var(--mdc-theme-surface-positive)}:host .mdc-banner.positive.cv-banner--inline{--mdc-theme-surface: var(--mdc-theme-surface-positive-highlight)}:host .mdc-banner.positive.cv-banner--inline .mdc-banner__graphic,:host .mdc-banner.positive.cv-banner--inline .mdc-banner__text{--mdc-theme-surface: var(--mdc-theme-positive);--mdc-theme-text-primary-on-background: var(--mdc-theme-positive)}:host .mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity .28s cubic-bezier(.4,0,.2,1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}:host .mdc-banner{border-radius:8px;position:relative;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f;overflow:hidden;border:none}:host .mdc-banner .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}:host .mdc-banner .mdc-banner__content{max-width:inherit}:host .mdc-banner .mdc-banner__graphic{background:none;margin-left:24px;width:24px}:host .mdc-banner .mdc-banner__text{margin-left:24px}:host .mdc-banner .mdc-banner__actions{align-self:center;align-items:center}:host .mdc-banner.cv-banner--inline{border-radius:0;box-shadow:0 0 #0003,0 0 #00000024,0 0 #0000001f}:host ::slotted(*){margin-left:8px}
+`;
+var P = Object.defineProperty, E = Object.getOwnPropertyDescriptor, O = (i, e, r, a) => {
+  for (var t = a > 1 ? void 0 : a ? E(e, r) : e, c = i.length - 1, d; c >= 0; c--)
+    (d = i[c]) && (t = (a ? d(e, r, t) : d(t)) || t);
+  return a && t && P(e, r, t), t;
+};
+let h = class extends n {
+};
+h.styles = [
+  _`
+      ${f(F)}
+    `
+];
+h = O([
+  g("cv-alert")
+], h);
+export {
+  h as CovalentAlert
+};

package/app-shell.mjs

@@ -0,0 +1,94 @@
+import { html as l, nothing as p, css as h, unsafeCSS as g } from "lit";
+import { property as c, customElement as f } from "lit/decorators.js";
+import { classMap as m } from "lit/directives/class-map.js";
+import { DrawerBase as y } from "@material/mwc-drawer/mwc-drawer-base";
+const b = `.mdc-drawer{border-color:#0000001f;background-color:#fff;background-color:var(--mdc-theme-surface, #fff);border-top-left-radius:0;border-top-right-radius:0;border-top-right-radius:var(--mdc-shape-large, 0);border-bottom-right-radius:0;border-bottom-right-radius:var(--mdc-shape-large, 0);border-bottom-left-radius:0;z-index:6;width:256px;display:flex;flex-direction:column;flex-shrink:0;box-sizing:border-box;height:100%;border-right-width:1px;border-right-style:solid;overflow:hidden;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdc-drawer .mdc-drawer__title{color:#000000de}.mdc-drawer .mdc-deprecated-list-group__subheader,.mdc-drawer .mdc-drawer__subtitle,.mdc-drawer .mdc-deprecated-list-item__graphic{color:#0009}.mdc-drawer .mdc-deprecated-list-item{color:#000000de}.mdc-drawer .mdc-deprecated-list-item--activated .mdc-deprecated-list-item__graphic{color:#6200ee}.mdc-drawer .mdc-deprecated-list-item--activated{color:#6200eede}[dir=rtl] .mdc-drawer,.mdc-drawer[dir=rtl]{border-top-left-radius:0;border-top-left-radius:var(--mdc-shape-large, 0);border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:0;border-bottom-left-radius:var(--mdc-shape-large, 0)}.mdc-drawer .mdc-deprecated-list-item{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-drawer.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content{margin-left:256px;margin-right:0}[dir=rtl] .mdc-drawer.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content,.mdc-drawer.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content[dir=rtl]{margin-left:0;margin-right:256px}[dir=rtl] .mdc-drawer,.mdc-drawer[dir=rtl]{border-right-width:0;border-left-width:1px;border-right-style:none;border-left-style:solid}.mdc-drawer .mdc-deprecated-list-item{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-subtitle2-font-size, .875rem);line-height:1.375rem;line-height:var(--mdc-typography-subtitle2-line-height, 1.375rem);font-weight:500;font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:.0071428571em;letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, .0071428571em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle2-text-transform, inherit);height:40px;margin:8px;padding:0 8px}.mdc-drawer .mdc-deprecated-list-item:nth-child(1){margin-top:2px}.mdc-drawer .mdc-deprecated-list-item:nth-last-child(1){margin-bottom:0}.mdc-drawer .mdc-deprecated-list-group__subheader{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-body2-font-size, .875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, .0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);display:block;line-height:normal;margin:0;padding:0 16px}.mdc-drawer .mdc-deprecated-list-group__subheader:before{display:inline-block;width:0;height:24px;content:"";vertical-align:0}.mdc-drawer .mdc-deprecated-list-divider{margin:3px 0 4px}.mdc-drawer .mdc-deprecated-list-item__text,.mdc-drawer .mdc-deprecated-list-item__graphic{pointer-events:none}.mdc-drawer--animate{transform:translate(-100%)}[dir=rtl] .mdc-drawer--animate,.mdc-drawer--animate[dir=rtl]{transform:translate(100%)}.mdc-drawer--opening{transform:translate(0);transition-duration:.25s}[dir=rtl] .mdc-drawer--opening,.mdc-drawer--opening[dir=rtl]{transform:translate(0)}.mdc-drawer--closing{transform:translate(-100%);transition-duration:.2s}[dir=rtl] .mdc-drawer--closing,.mdc-drawer--closing[dir=rtl]{transform:translate(100%)}.mdc-drawer__header{flex-shrink:0;box-sizing:border-box;min-height:64px;padding:0 16px 4px}.mdc-drawer__title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-headline6-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1.25rem;font-size:var(--mdc-typography-headline6-font-size, 1.25rem);line-height:2rem;line-height:var(--mdc-typography-headline6-line-height, 2rem);font-weight:500;font-weight:var(--mdc-typography-headline6-font-weight, 500);letter-spacing:.0125em;letter-spacing:var(--mdc-typography-headline6-letter-spacing, .0125em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline6-text-transform, inherit);display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-drawer__title:before{display:inline-block;width:0;height:36px;content:"";vertical-align:0}.mdc-drawer__title:after{display:inline-block;width:0;height:20px;content:"";vertical-align:-20px}.mdc-drawer__subtitle{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-body2-font-size, .875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, .0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);display:block;margin-top:0;line-height:normal;margin-bottom:0}.mdc-drawer__subtitle:before{display:inline-block;width:0;height:20px;content:"";vertical-align:0}.mdc-drawer__content{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.mdc-drawer--dismissible{left:0;right:initial;display:none;position:absolute}[dir=rtl] .mdc-drawer--dismissible,.mdc-drawer--dismissible[dir=rtl]{left:initial;right:0}.mdc-drawer--dismissible.mdc-drawer--open{display:flex}.mdc-drawer-app-content{margin-left:0;margin-right:0;position:relative}[dir=rtl] .mdc-drawer-app-content,.mdc-drawer-app-content[dir=rtl]{margin-left:0;margin-right:0}.mdc-drawer--modal{box-shadow:0 8px 10px -5px #0003,0 16px 24px 2px #00000024,0 6px 30px 5px #0000001f;left:0;right:initial;display:none;position:fixed}.mdc-drawer--modal+.mdc-drawer-scrim{background-color:#00000052}[dir=rtl] .mdc-drawer--modal,.mdc-drawer--modal[dir=rtl]{left:initial;right:0}.mdc-drawer--modal.mdc-drawer--open{display:flex}.mdc-drawer-scrim{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:5;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdc-drawer--open+.mdc-drawer-scrim{display:block}.mdc-drawer--animate+.mdc-drawer-scrim{opacity:0}.mdc-drawer--opening+.mdc-drawer-scrim{transition-duration:.25s;opacity:1}.mdc-drawer--closing+.mdc-drawer-scrim{transition-duration:.2s;opacity:0}:host{--mdc-theme-surface: var(--mdc-theme-background);--mdc-list-vertical-padding: 0}.app-shell{background-color:var(--mdc-theme-surface);display:grid;grid-template:"nav mini-list main help" min-content/auto auto 1fr;min-height:100vh}.app-shell:after{content:"";position:absolute;top:0;height:2px;width:100%;z-index:1000;background-color:#f3753f}.main{grid-area:main;overflow:auto;height:100vh;border-left:1px solid;border-color:var(--mdc-theme-border, rgba(0, 0, 0, .12))}.help{grid-area:help;width:320px;height:100vh;overflow-y:auto;border-left:1px solid;border-color:var(--mdc-theme-border, rgba(0, 0, 0, .12));transition-property:width;transition-duration:.2s}.help.help--closed{width:0}[name=mini-list]::slotted(*){display:block;width:320px;height:100vh;overflow:auto;border-left:1px solid;border-color:var(--mdc-theme-border, rgba(0, 0, 0, .12))}@media only screen and (max-width: 1000px){[name=mini-list]::slotted(*){display:none}}nav.navigation{grid-area:nav;height:100vh;overflow-y:auto;border-right:0}nav.navigation .toggle-drawer{margin:8px auto}nav.navigation .navigation-toolbar{display:flex;align-items:center}nav.navigation slot[name=logo]{display:none}nav.navigation.mdc-drawer--open .toggle-drawer{margin-left:12px;margin-right:12px}nav.navigation.mdc-drawer--open slot[name=logo]{display:block}[divider]{border-bottom:1px solid;margin:16px;border-color:var(--mdc-theme-border, rgba(0, 0, 0, .12))}@media only screen and (min-width: 768px){nav.navigation{display:flex;flex-direction:column;transition-property:width;transition-duration:.2s;transform:none;background-color:transparent}.mdc-drawer--dismissible{display:block;width:72px;position:static}.mdc-drawer--open{width:256px}.mdc-drawer--opening{width:256px;transition-duration:.2s}.mdc-drawer--closing{width:72px;transition-duration:.2s}.header{display:none}}@media only screen and (max-width: 768px){.app-shell{grid-template-columns:1fr;grid-template-areas:"header" "main" "mini-list" "help"}[name=help]::slotted(*),.main{height:auto;width:auto;border:none}}
+`;
+var w = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (t, r, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? v(r, a) : r, d = t.length - 1, n; d >= 0; d--)
+    (n = t[d]) && (e = (i ? n(r, a, e) : n(e)) || e);
+  return i && e && w(r, a, e), e;
+};
+let o = class extends y {
+  constructor() {
+    super(), this.appName = "", this.helpOpen = !1, this.resizeEvent();
+  }
+  _toggleOpen() {
+    this.mdcFoundation.isOpening() || this.mdcFoundation.isClosing() || (this.open = !this.open, this.dispatchEvent(
+      new Event("CovalentAppShell:toggle", { bubbles: !0, composed: !0 })
+    ));
+  }
+  resizeEvent() {
+    const t = window.matchMedia("(max-width: 800px)");
+    t.matches && this.type !== "modal" ? this.type = "modal" : !t.matches && this.type !== "dismissible" && (this.type = "dismissible"), this.requestUpdate();
+  }
+  connectedCallback() {
+    super.connectedCallback(), window.addEventListener("resize", () => this.resizeEvent());
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), window.removeEventListener("resize", this.resizeEvent);
+  }
+  render() {
+    const t = this.type === "dismissible" || this.type === "modal", r = this.type === "modal", a = {
+      "mdc-drawer--dismissible": t,
+      "mdc-drawer--modal": r
+    }, i = {
+      "help--closed": !this.helpOpen
+    }, e = r ? l`<div
+          class="mdc-drawer-scrim"
+          @click="${this._handleScrimClick}"
+        ></div>` : p;
+    return l`
+      <div class="app-shell">
+        <span class="header"
+          ><cv-top-app-bar-fixed centerTitle>
+            <cv-icon-button
+              class="toggle-drawer"
+              @click=${this._toggleOpen}
+              slot="navigationIcon"
+              icon="menu"
+            ></cv-icon-button>
+            <span slot="title">${this.appName}</span>
+          </cv-top-app-bar-fixed>
+        </span>
+        <nav class="navigation mdc-drawer ${m(a)}">
+          <div class="navigation-toolbar">
+            <cv-icon-button
+              @click=${this._toggleOpen}
+              class="toggle-drawer"
+              icon="menu"
+            ></cv-icon-button>
+            <slot name="logo"></slot>
+          </div>
+          <slot name="navigation"></slot>
+          <div style="display:flex; flex:1;"></div>
+          <div divider></div>
+          <slot name="user-menu"></slot>
+        </nav>
+        ${e}
+        <slot name="mini-list"></slot>
+        <div class="main mdc-drawer-app-content"><slot></slot></div>
+        <div class="help ${m(i)}">
+          <slot name="help"></slot>
+        </div>
+      </div>
+    `;
+  }
+};
+o.styles = [
+  h`
+      ${g(b)}
+    `
+];
+s([
+  c()
+], o.prototype, "appName", 2);
+s([
+  c({ type: Boolean })
+], o.prototype, "helpOpen", 2);
+o = s([
+  f("cv-app-shell")
+], o);
+export {
+  o as CovalentAppShell
+};

package/button.mjs

@@ -0,0 +1,20 @@
+import { css as a, unsafeCSS as l } from "lit";
+import { customElement as p } from "lit/decorators.js";
+import { ButtonBase as u } from "@material/mwc-button/mwc-button-base";
+import { styles as i } from "@material/mwc-button/styles.css?used";
+const v = `:host{--mdc-button-outline-color: var(--mdc-theme-text-icon-on-background);--mdc-theme-primary: var(--mdc-theme-text-primary-on-background)}:host(.accent.primary){--mdc-theme-primary: var(--mdc-theme-accent);--mdc-button-outline-color: var(--mdc-theme-accent)}:host(.destructive.primary){--mdc-theme-primary: var(--mdc-theme-error);--mdc-button-outline-color: var(--mdc-theme-error)}
+`;
+var d = Object.defineProperty, h = Object.getOwnPropertyDescriptor, f = (n, e, o, r) => {
+  for (var t = r > 1 ? void 0 : r ? h(e, o) : e, m = n.length - 1, c; m >= 0; m--)
+    (c = n[m]) && (t = (r ? c(e, o, t) : c(t)) || t);
+  return r && t && d(e, o, t), t;
+};
+let s = class extends u {
+};
+s.styles = [i, a`${l(v)}`];
+s = f([
+  p("cv-button")
+], s);
+export {
+  s as CovalentButtonBase
+};

package/card.mjs

@@ -0,0 +1,70 @@
+import { LitElement as s, html as m, css as _, unsafeCSS as f } from "lit";
+import { property as n, customElement as b } from "lit/decorators.js";
+import { classMap as u } from "lit/directives/class-map.js";
+var g = Object.defineProperty, y = Object.getOwnPropertyDescriptor, p = (d, i, e, a) => {
+  for (var r = a > 1 ? void 0 : a ? y(i, e) : i, c = d.length - 1, t; c >= 0; c--)
+    (t = d[c]) && (r = (a ? t(i, e, r) : t(r)) || r);
+  return a && r && g(i, e, r), r;
+};
+class o extends s {
+  constructor() {
+    super(...arguments), this.cardTitle = "", this.subTitle = "", this.actionBar = !1, this.interactive = !1, this.outlined = !1;
+  }
+  render() {
+    const i = {
+      "mdc-card": !0,
+      "mdc-card--outlined": this.outlined
+    };
+    return m` <div class="${u(i)}">
+      ${this.cardTitle ? m`
+            <div class="mdc-card__actions mdc-typography--headline5">
+              ${this.cardTitle}
+            </div>
+          ` : ""}
+      <div class="mdc-card__primary-action">
+        <slot></slot>
+        ${this.interactive ? m`<div class="mdc-card__ripple"></div>` : ""}
+      </div>
+      ${this.actionBar ? m`
+            <div class="mdc-card__actions">
+              <slot name="card-actions"></slot>
+            </div>
+          ` : ""}
+    </div>`;
+  }
+}
+p([
+  n()
+], o.prototype, "cardTitle", 2);
+p([
+  n()
+], o.prototype, "subTitle", 2);
+p([
+  n({ type: Boolean })
+], o.prototype, "actionBar", 2);
+p([
+  n({ type: Boolean })
+], o.prototype, "interactive", 2);
+p([
+  n({ type: Boolean })
+], o.prototype, "outlined", 2);
+const h = `.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity .28s cubic-bezier(.4,0,.2,1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}.mdc-card{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);background-color:#fff;background-color:var(--mdc-theme-surface, #fff);position:relative;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f;display:flex;flex-direction:column;box-sizing:border-box}.mdc-card .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-card:after{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:"";pointer-events:none}@media screen and (forced-colors: active){.mdc-card:after{border-color:CanvasText}}.mdc-card--outlined{box-shadow:0 0 #0003,0 0 #00000024,0 0 #0000001f;border-width:1px;border-style:solid;border-color:#e0e0e0}.mdc-card--outlined:after{border:none}.mdc-card__content{border-radius:inherit;height:100%}.mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}.mdc-card__media:before{display:block;content:""}.mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mdc-card__media--square:before{margin-top:100%}.mdc-card__media--16-9:before{margin-top:56.25%}.mdc-card__media-content{position:absolute;top:0;right:0;bottom:0;left:0;box-sizing:border-box}.mdc-card__primary-action{display:flex;flex-direction:column;box-sizing:border-box;position:relative;outline:none;color:inherit;text-decoration:none;cursor:pointer;overflow:hidden}.mdc-card__primary-action:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mdc-card__primary-action:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mdc-card__actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px;padding:8px}.mdc-card__actions--full-bleed{padding:0}.mdc-card__action-buttons,.mdc-card__action-icons{display:flex;flex-direction:row;align-items:center;box-sizing:border-box}.mdc-card__action-icons{color:#0009;flex-grow:1;justify-content:flex-end}.mdc-card__action-buttons+.mdc-card__action-icons{margin-left:16px;margin-right:0}[dir=rtl] .mdc-card__action-buttons+.mdc-card__action-icons,.mdc-card__action-buttons+.mdc-card__action-icons[dir=rtl]{margin-left:0;margin-right:16px}.mdc-card__action{display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;justify-content:center;cursor:pointer;user-select:none}.mdc-card__action:focus{outline:none}.mdc-card__action--button{margin-left:0;margin-right:8px;padding:0 8px}[dir=rtl] .mdc-card__action--button,.mdc-card__action--button[dir=rtl]{margin-left:8px;margin-right:0}.mdc-card__action--button:last-child{margin-left:0;margin-right:0}[dir=rtl] .mdc-card__action--button:last-child,.mdc-card__action--button:last-child[dir=rtl]{margin-left:0;margin-right:0}.mdc-card__actions--full-bleed .mdc-card__action--button{justify-content:space-between;width:100%;height:auto;max-height:none;margin:0;padding:8px 16px;text-align:left}[dir=rtl] .mdc-card__actions--full-bleed .mdc-card__action--button,.mdc-card__actions--full-bleed .mdc-card__action--button[dir=rtl]{text-align:right}.mdc-card__action--icon{margin:-6px 0;padding:12px}.mdc-card__action--icon:not(:disabled){color:#0009}@keyframes mdc-ripple-fg-radius-in{0%{animation-timing-function:cubic-bezier(.4,0,.2,1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{0%{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{0%{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-card__primary-action{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity}.mdc-card__primary-action .mdc-card__ripple:before,.mdc-card__primary-action .mdc-card__ripple:after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-card__primary-action .mdc-card__ripple:before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-card__primary-action .mdc-card__ripple:after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple:before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple:after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-card__primary-action.mdc-ripple-upgraded--unbounded .mdc-card__ripple:after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-card__primary-action.mdc-ripple-upgraded--foreground-activation .mdc-card__ripple:after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-card__primary-action.mdc-ripple-upgraded--foreground-deactivation .mdc-card__ripple:after{animation:mdc-ripple-fg-opacity-out .15s;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-card__primary-action .mdc-card__ripple:before,.mdc-card__primary-action .mdc-card__ripple:after{top:-50%;left:-50%;width:200%;height:200%}.mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple:after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-card__primary-action .mdc-card__ripple:before,.mdc-card__primary-action .mdc-card__ripple:after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-card__primary-action:hover .mdc-card__ripple:before,.mdc-card__primary-action.mdc-ripple-surface--hover .mdc-card__ripple:before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.mdc-card__primary-action.mdc-ripple-upgraded--background-focused .mdc-card__ripple:before,.mdc-card__primary-action:not(.mdc-ripple-upgraded):focus .mdc-card__ripple:before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.mdc-card__primary-action:not(.mdc-ripple-upgraded) .mdc-card__ripple:after{transition:opacity .15s linear}.mdc-card__primary-action:not(.mdc-ripple-upgraded):active .mdc-card__ripple:after{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.mdc-card__primary-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: var(--mdc-ripple-press-opacity, .12)}.mdc-card__primary-action .mdc-card__ripple{box-sizing:content-box;height:100%;overflow:hidden;left:0;pointer-events:none;position:absolute;top:0;width:100%}.mdc-card__primary-action.mdc-ripple-upgraded--background-focused:after,.mdc-card__primary-action:not(.mdc-ripple-upgraded):focus:after{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:5px double transparent;border-radius:inherit;content:"";pointer-events:none}@media screen and (forced-colors: active){.mdc-card__primary-action.mdc-ripple-upgraded--background-focused:after,.mdc-card__primary-action:not(.mdc-ripple-upgraded):focus:after{border-color:CanvasText}}.mdc-card__actions{color:var(--mdc-theme-text-primary-on-background);justify-content:space-between}.mdc-card__actions:first-of-type{border-bottom:1px solid var(--mdc-theme-border);padding-left:16px}.mdc-card.mdc-card--outlined{background-color:var(--mdc-theme-surface)}
+`;
+var v = Object.defineProperty, x = Object.getOwnPropertyDescriptor, w = (d, i, e, a) => {
+  for (var r = a > 1 ? void 0 : a ? x(i, e) : i, c = d.length - 1, t; c >= 0; c--)
+    (t = d[c]) && (r = (a ? t(i, e, r) : t(r)) || r);
+  return a && r && v(i, e, r), r;
+};
+let l = class extends o {
+};
+l.styles = [
+  _`
+      ${f(h)}
+    `
+];
+l = w([
+  b("cv-card")
+], l);
+export {
+  l as CovalentCardBase
+};

package/check-list-item.mjs

@@ -0,0 +1,18 @@
+import { CheckListItemBase as c } from "@material/mwc-list/mwc-check-list-item-base";
+import { styles as f } from "@material/mwc-list/mwc-control-list-item.css?used";
+import { styles as i } from "@material/mwc-list/mwc-list-item.css?used";
+import { customElement as v } from "lit/decorators.js";
+var a = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, n = (p, s, r, t) => {
+  for (var e = t > 1 ? void 0 : t ? _(s, r) : s, m = p.length - 1, o; m >= 0; m--)
+    (o = p[m]) && (e = (t ? o(s, r, e) : o(e)) || e);
+  return t && e && a(s, r, e), e;
+};
+let l = class extends c {
+};
+l.styles = [i, f];
+l = n([
+  v("cv-check-list-item")
+], l);
+export {
+  l as CovalentCheckListItemBase
+};

package/checkbox.mjs

@@ -0,0 +1,20 @@
+import { css as l, unsafeCSS as n } from "lit";
+import { customElement as d } from "lit/decorators.js";
+import { CheckboxBase as h } from "@material/mwc-checkbox/mwc-checkbox-base";
+import { styles as b } from "@material/mwc-checkbox/mwc-checkbox.css?used";
+const p = `:host{--mdc-checkbox-checked-color: var(--mdc-theme-primary);--mdc-checkbox-disabled-color: var(--mdc-theme-text-disabled-on-background);--mdc-checkbox-ink-color: var(--mdc-theme-on-primary);--mdc-checkbox-unchecked-color: var(--mdc-theme-text-icon-on-background)}
+`;
+var v = Object.defineProperty, x = Object.getOwnPropertyDescriptor, f = (a, c, r, o) => {
+  for (var e = o > 1 ? void 0 : o ? x(c, r) : c, s = a.length - 1, t; s >= 0; s--)
+    (t = a[s]) && (e = (o ? t(c, r, e) : t(e)) || e);
+  return o && e && v(c, r, e), e;
+};
+let m = class extends h {
+};
+m.styles = [b, l`${n(p)}`];
+m = f([
+  d("cv-checkbox")
+], m);
+export {
+  m as CovalentCheckboxBase
+};

package/circular-progress.mjs

@@ -0,0 +1,17 @@
+import { CircularProgressBase as a } from "@material/mwc-circular-progress/mwc-circular-progress-base";
+import { styles as f } from "@material/mwc-circular-progress/mwc-circular-progress.css?used";
+import { customElement as m } from "lit/decorators.js";
+var v = Object.defineProperty, i = Object.getOwnPropertyDescriptor, u = (c, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? i(e, o) : e, t = c.length - 1, l; t >= 0; t--)
+    (l = c[t]) && (r = (s ? l(e, o, r) : l(r)) || r);
+  return s && r && v(e, o, r), r;
+};
+let p = class extends a {
+};
+p.styles = [f];
+p = u([
+  m("cv-circular-progress")
+], p);
+export {
+  p as CovalentCircularProgressBase
+};