import { s as _, x as h, r as v, i as u, e as f } from "./query-assigned-elements-D930kELM.mjs";
import { a as x } from "./utils-Dr5MegQq.mjs";
import { o as y } from "./observer-DQ8OfVDQ.mjs";
import { M as w, C as p, e as m, s as g } from "./foundation-qQ4jzaAu.mjs";
import { o as k } from "./class-map-DPUylGZM.mjs";
import { n as i } from "./property-DJzm_oB9.mjs";
import { i as l } from "./query-CDOd1Kwm.mjs";
var C = Object.defineProperty, r = (a, e, c, s) => {
  for (var n = void 0, o = a.length - 1, d; o >= 0; o--)
    (d = a[o]) && (n = d(e, c, n) || n);
  return n && C(e, c, n), n;
};
class t extends _ {
  constructor() {
    super(...arguments), this.mdcFoundationClass = w, this.open = !0, this.labelText = "", this.icon = "", this.iconAriaLabel = "", this.centered = !0, this.reason = p.UNSPECIFIED;
  }
  render() {
    const e = {
      "mdc-banner": !0,
      negative: this.state === "negative",
      positive: this.state === "positive",
      caution: this.state === "caution",
      active: this.state === "active",
      loading: this.state === "loading",
      pending: this.state === "pending",
      checked: this.state === "checked",
      "mdc-banner--centered": this.centered
    };
    return h` <div class="${k(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, c) => this.mdcRoot.style.setProperty(e, c),
      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(m.ACTION_CLICKED, {
          bubbles: !0,
          cancelable: !0,
          detail: { reason: e }
        })
      ),
      notifyClosed: (e) => this.dispatchEvent(
        new CustomEvent(m.CLOSED, {
          bubbles: !0,
          cancelable: !0,
          detail: { reason: e }
        })
      ),
      notifyClosing: (e) => this.dispatchEvent(
        new CustomEvent(m.CLOSING, {
          bubbles: !0,
          cancelable: !0,
          detail: { reason: e }
        })
      ),
      notifyOpened: () => this.dispatchEvent(
        new CustomEvent(m.OPENED, { bubbles: !0, cancelable: !0 })
      ),
      notifyOpening: () => this.dispatchEvent(
        new CustomEvent(m.OPENING, { bubbles: !0, cancelable: !0 })
      )
    };
  }
  /** @export */
  show() {
    this.open = !0;
  }
  /** @export */
  close(e = p.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();
  }
}
r([
  l(".mdc-banner")
], t.prototype, "mdcRoot");
r([
  l(g.CONTENT)
], t.prototype, "mdcContent");
r([
  l(g.PRIMARY_ACTION)
], t.prototype, "primaryActionEl");
r([
  i({ type: Boolean, reflect: !0 }),
  y(function(a) {
    this.mdcFoundation && (a ? this.mdcFoundation.open() : (this.mdcFoundation.close(this.reason), this.reason = p.UNSPECIFIED));
  })
], t.prototype, "open");
r([
  i({ type: String })
], t.prototype, "labelText");
r([
  i({ type: String })
], t.prototype, "icon");
r([
  i({ type: String })
], t.prototype, "iconAriaLabel");
r([
  i({ type: Boolean })
], t.prototype, "centered");
r([
  i()
], t.prototype, "state");
const E = '.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;background-color:var(--mdc-banner-container-color, #fff);border-bottom-color:#0000001f;border-bottom-color:var(--mdc-banner-divider-color, rgba(0, 0, 0, .12));border-bottom-width:1px;border-bottom-width:var(--mdc-banner-divider-height, 1px);border-radius:0;border-radius:var(--mdc-banner-container-shape, 0)}.mdc-banner .mdc-banner__text{color:#000;color:var(--mdc-banner-supporting-text-color, #000)}.mdc-banner .mdc-banner__text{letter-spacing:.0178571429em;letter-spacing:var(--mdc-banner-supporting-text-tracking, .0178571429em);font-size:.875rem;font-size:var(--mdc-banner-supporting-text-size, .875rem);font-family:Roboto,sans-serif;font-family:var(--mdc-banner-supporting-text-font, Roboto, sans-serif);font-weight:400;font-weight:var(--mdc-banner-supporting-text-weight, 400);line-height:1.25rem;line-height:var(--mdc-banner-supporting-text-line-height, 1.25rem)}.mdc-banner .mdc-banner__graphic{border-radius:50%;border-radius:var(--mdc-banner-with-image-image-shape, 50%)}.mdc-banner .mdc-banner__graphic{height:40px;height:var(--mdc-banner-with-image-image-size, 40px);width:40px;width:var(--mdc-banner-with-image-image-size, 40px)}.mdc-banner .mdc-banner__fixed{background-color:#fff;background-color:var(--mdc-banner-container-color, #fff)}.mdc-banner .mdc-banner__fixed{border-bottom-color:#0000001f;border-bottom-color:var(--mdc-banner-divider-color, rgba(0, 0, 0, .12))}.mdc-banner .mdc-banner__fixed{border-bottom-width:1px;border-bottom-width:var(--mdc-banner-divider-height, 1px)}.mdc-banner .mdc-button:not(:disabled){color:#6200ee;color:var(--mdc-text-button-label-text-color, var(--mdc-banner-action-label-text-color, #6200ee))}.mdc-banner .mdc-button .mdc-button__ripple:before{background-color:#6200ee;background-color:var(--mdc-text-button-hover-state-layer-color, var(--mdc-banner-action-hover-state-layer-color, #6200ee))}.mdc-banner .mdc-button .mdc-button__ripple:after{background-color:#6200ee;background-color:var(--mdc-text-button-pressed-state-layer-color, var(--mdc-banner-action-pressed-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, var(--mdc-banner-action-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, var(--mdc-banner-action-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, var(--mdc-banner-action-pressed-state-layer-opacity, .1))}.mdc-banner .mdc-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: var(--mdc-text-button-pressed-state-layer-opacity, var(--mdc-banner-action-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-on-surface: var(--cv-theme-on-surface-38);color:var(--mdc-theme-on-surface)}.mdc-banner .mdc-banner__text{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(--cv-theme-caution-8)}.mdc-banner.caution .mdc-banner__graphic,.mdc-banner.caution .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-caution)}.mdc-banner.negative{--cv-action-ribbon-background: var(--cv-theme-negative-8)}.mdc-banner.negative .mdc-banner__graphic,.mdc-banner.negative .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-negative)}.mdc-banner.active{--cv-action-ribbon-background: var(--cv-theme-primary-8)}.mdc-banner.active .mdc-banner__graphic,.mdc-banner.active .mdc-banner__text{--mdc-theme-on-surface: var(--cv-theme-primary)}.mdc-banner.positive{--cv-action-ribbon-background: var(--cv-theme-positive-8)}.mdc-banner.positive .mdc-banner__graphic,.mdc-banner.positive .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-positive)}.mdc-banner.loading .mdc-banner__graphic,.mdc-banner.loading .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-primary)}.mdc-banner.pending .mdc-banner__graphic,.mdc-banner.pending .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-on-surface-variant)}.mdc-banner.checked{--cv-action-ribbon-background: var(--cv-theme-primary-8)}.mdc-banner.checked .mdc-banner__graphic,.mdc-banner.checked .mdc-banner__text{--mdc-theme-on-surface: var(--mdc-theme-on-surface-variant)}::slotted(*){margin-left:8px}.mdc-banner__content{min-height:56px}.mdc-banner__graphic{background-color:transparent;margin-top:8px;margin-bottom:8px;font-variation-settings:"FILL" 1}.mdc-banner__actions{align-self:center}';
var F = Object.getOwnPropertyDescriptor, A = (a, e, c, s) => {
  for (var n = s > 1 ? void 0 : s ? F(e, c) : e, o = a.length - 1, d; o >= 0; o--)
    (d = a[o]) && (n = d(n) || n);
  return n;
};
let b = class extends t {
};
b.styles = [
  u`
      ${v(E)}
    `
];
b = A([
  f("cv-action-ribbon")
], b);
const D = b;
export {
  b as CovalentActionRibbon,
  D as default
};
