@nysds/nys-errormessage/dist/nys-errormessage.js

The Errormessage component from the NYS Design System.

import { LitElement as l, unsafeCSS as d, html as y } from "lit";
import { property as o } from "lit/decorators.js";
/*!
   * █▄  █  █   █  █▀▀▀█  █▀▀▄  █▀▀▀█
   * █ █ █  █▄▄▄█  ▀▀▀▄▄  █   █ ▀▀▀▄▄
   * █  ▀█    █    █▄▄▄█  █▄▄▀  █▄▄▄█
   *
   * Error message Component v1.15.1
   * Part of the New York State Design System
   * Repository: https://github.com/its-hcd/nysds
   * License: MIT
*/
const p = ':host{--_nys-errormessage-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-errormessage-font-weight: var(--nys-font-weight-regular, 400);--_nys-errormessage-font-size: var(--nys-font-size-ui-md, 16px);--_nys-errormessage-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-errormessage-letter-spacing: var( --nys-font-letterspacing-ui-md, .044px );--_nys-errormessage-color: var(--nys-color-danger, #b52c2c);--_nys-errormessage-gap: var(--nys-space-100, 8px);--_nys-errormessage-padding--divider: var(--nys-space-50, 4px);--_nys-errormessage-width--divider: var(--nys-border-width-sm, 1px);--_nys-errormessage-margin-top: 0}.nys-errormessage{display:flex;align-items:center;gap:var(--_nys-errormessage-gap);font-family:var(--_nys-errormessage-font-family);font-weight:var(--_nys-errormessage-font-weight);font-size:var(--_nys-errormessage-font-size);line-height:var(--_nys-errormessage-line-height);letter-spacing:var(--_nys-errormessage-letter-spacing);color:var(--_nys-errormessage-color);margin-top:var(--_nys-errormessage-margin-top)}.nys-errormessage[showDivider]{padding-top:var(--_nys-errormessage-padding--divider);margin-top:var(--_nys-errormessage-padding--divider);border-top:var(--_nys-errormessage-width--divider) solid var(--_nys-errormessage-color)}';
var v = Object.defineProperty, n = (t, i, g, h) => {
  for (var e = void 0, a = t.length - 1, m; a >= 0; a--)
    (m = t[a]) && (e = m(i, g, e) || e);
  return e && v(i, g, e), e;
};
const s = class s extends l {
  // allows use of elementInternals' API
  constructor() {
    super(), this.showError = !1, this.errorMessage = "", this.showDivider = !1, this._internals = this.attachInternals();
  }
  render() {
    return y`${this.showError ? y`<div
          class="nys-errormessage"
          ?showDivider=${this.showDivider}
          role="alert"
        >
          <nys-icon name="error" size="2xl"></nys-icon>
          ${this._internals.validationMessage || this.errorMessage}
        </div>` : ""}`;
  }
};
s.styles = d(p), s.formAssociated = !0;
let r = s;
n([
  o({ type: Boolean })
], r.prototype, "showError");
n([
  o({ type: String })
], r.prototype, "errorMessage");
n([
  o({ type: Boolean, reflect: !0 })
], r.prototype, "showDivider");
customElements.get("nys-errormessage") || customElements.define("nys-errormessage", r);
export {
  r as NysErrorMessage
};
//# sourceMappingURL=nys-errormessage.js.map