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/Spinner.ts

38 lines
1002 B
TypeScript

import { AKElement } from "@goauthentik/elements/Base";
import { t } from "@lingui/macro";
import { CSSResult, TemplateResult, html } from "lit";
import { customElement, property } from "lit/decorators.js";
import PFSpinner from "@patternfly/patternfly/components/Spinner/spinner.css";
export enum PFSize {
Small = "pf-m-sm",
Medium = "pf-m-md",
Large = "pf-m-lg",
XLarge = "pf-m-xl",
}
@customElement("ak-spinner")
export class Spinner extends AKElement {
@property()
size: PFSize = PFSize.Medium;
static get styles(): CSSResult[] {
return [PFSpinner];
}
render(): TemplateResult {
return html`<span
class="pf-c-spinner ${this.size.toString()}"
role="progressbar"
aria-valuetext="${t`Loading...`}"
>
<span class="pf-c-spinner__clipper"></span>
<span class="pf-c-spinner__lead-ball"></span>
<span class="pf-c-spinner__tail-ball"></span>
</span>`;
}
}