42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
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>`;
|
|
}
|
|
}
|