This repository has been archived on 2024-05-31. You can view files and clone it, but cannot push or open issues or pull requests.
authentik/web/src/elements/Alert.ts

42 lines
1.1 KiB
TypeScript
Raw Normal View History

import { AKElement } from "@goauthentik/elements/Base";
import { CSSResult, TemplateResult, html } from "lit";
import { customElement, property } from "lit/decorators.js";
import AKGlobal from "@goauthentik/common/styles/authentik.css";
import PFAlert from "@patternfly/patternfly/components/Alert/alert.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
export enum Level {
Warning = "pf-m-warning",
Info = "pf-m-info",
Success = "pf-m-success",
Danger = "pf-m-danger",
}
@customElement("ak-alert")
export class Alert extends AKElement {
@property({ type: Boolean })
inline = false;
@property()
level: Level = Level.Warning;
static get styles(): CSSResult[] {
return [PFBase, PFAlert, AKGlobal];
}
render(): TemplateResult {
return html`<div
class="pf-c-alert ${this.inline ? html`pf-m-inline` : html``} ${this.level}"
>
<div class="pf-c-alert__icon">
<i class="fas fa-exclamation-circle"></i>
</div>
<h4 class="pf-c-alert__title">
<slot></slot>
</h4>
</div>`;
}
}