keycloakify/account/pages/Account.js

Framework to create custom Keycloak UIs

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { clsx } from "../../tools/clsx";
import { getKcClsx } from "../../account/lib/kcClsx";
export default function Account(props) {
    var _a, _b, _c, _d, _e;
    const { kcContext, i18n, doUseDefaultCss, Template } = props;
    const classes = Object.assign(Object.assign({}, props.classes), { kcBodyClass: clsx((_a = props.classes) === null || _a === void 0 ? void 0 : _a.kcBodyClass, "user") });
    const { kcClsx } = getKcClsx({
        doUseDefaultCss,
        classes
    });
    const { url, realm, messagesPerField, stateChecker, account, referrer } = kcContext;
    const { msg } = i18n;
    return (_jsxs(Template, Object.assign({}, { kcContext, i18n, doUseDefaultCss, classes }, { active: "account" }, { children: [_jsxs("div", Object.assign({ className: "row" }, { children: [_jsx("div", Object.assign({ className: "col-md-10" }, { children: _jsx("h2", { children: msg("editAccountHtmlTitle") }) })), _jsx("div", Object.assign({ className: "col-md-2 subtitle" }, { children: _jsxs("span", Object.assign({ className: "subtitle" }, { children: [_jsx("span", Object.assign({ className: "required" }, { children: "*" })), " ", msg("requiredFields")] })) }))] })), _jsxs("form", Object.assign({ action: url.accountUrl, className: "form-horizontal", method: "post" }, { children: [_jsx("input", { type: "hidden", id: "stateChecker", name: "stateChecker", value: stateChecker }), !realm.registrationEmailAsUsername && (_jsxs("div", Object.assign({ className: clsx("form-group", messagesPerField.printIfExists("username", "has-error")) }, { children: [_jsxs("div", Object.assign({ className: "col-sm-2 col-md-2" }, { children: [_jsx("label", Object.assign({ htmlFor: "username", className: "control-label" }, { children: msg("username") })), realm.editUsernameAllowed && _jsx("span", Object.assign({ className: "required" }, { children: "*" }))] })), _jsx("div", Object.assign({ className: "col-sm-10 col-md-10" }, { children: _jsx("input", { type: "text", className: "form-control", id: "username", name: "username", disabled: !realm.editUsernameAllowed, defaultValue: (_b = account.username) !== null && _b !== void 0 ? _b : "" }) }))] }))), _jsxs("div", Object.assign({ className: clsx("form-group", messagesPerField.printIfExists("email", "has-error")) }, { children: [_jsxs("div", Object.assign({ className: "col-sm-2 col-md-2" }, { children: [_jsx("label", Object.assign({ htmlFor: "email", className: "control-label" }, { children: msg("email") })), " ", _jsx("span", Object.assign({ className: "required" }, { children: "*" }))] })), _jsx("div", Object.assign({ className: "col-sm-10 col-md-10" }, { children: _jsx("input", { type: "text", className: "form-control", id: "email", name: "email", autoFocus: true, defaultValue: (_c = account.email) !== null && _c !== void 0 ? _c : "" }) }))] })), _jsxs("div", Object.assign({ className: clsx("form-group", messagesPerField.printIfExists("firstName", "has-error")) }, { children: [_jsxs("div", Object.assign({ className: "col-sm-2 col-md-2" }, { children: [_jsx("label", Object.assign({ htmlFor: "firstName", className: "control-label" }, { children: msg("firstName") })), " ", _jsx("span", Object.assign({ className: "required" }, { children: "*" }))] })), _jsx("div", Object.assign({ className: "col-sm-10 col-md-10" }, { children: _jsx("input", { type: "text", className: "form-control", id: "firstName", name: "firstName", defaultValue: (_d = account.firstName) !== null && _d !== void 0 ? _d : "" }) }))] })), _jsxs("div", Object.assign({ className: clsx("form-group", messagesPerField.printIfExists("lastName", "has-error")) }, { children: [_jsxs("div", Object.assign({ className: "col-sm-2 col-md-2" }, { children: [_jsx("label", Object.assign({ htmlFor: "lastName", className: "control-label" }, { children: msg("lastName") })), " ", _jsx("span", Object.assign({ className: "required" }, { children: "*" }))] })), _jsx("div", Object.assign({ className: "col-sm-10 col-md-10" }, { children: _jsx("input", { type: "text", className: "form-control", id: "lastName", name: "lastName", defaultValue: (_e = account.lastName) !== null && _e !== void 0 ? _e : "" }) }))] })), _jsx("div", Object.assign({ className: "form-group" }, { children: _jsx("div", Object.assign({ id: "kc-form-buttons", className: "col-md-offset-2 col-md-10 submit" }, { children: _jsxs("div", { children: [referrer !== undefined && _jsx("a", Object.assign({ href: referrer === null || referrer === void 0 ? void 0 : referrer.url }, { children: msg("backToApplication") })), _jsx("button", Object.assign({ type: "submit", className: kcClsx("kcButtonClass", "kcButtonPrimaryClass", "kcButtonLargeClass"), name: "submitAction", value: "Save" }, { children: msg("doSave") })), _jsx("button", Object.assign({ type: "submit", className: kcClsx("kcButtonClass", "kcButtonDefaultClass", "kcButtonLargeClass"), name: "submitAction", value: "Cancel" }, { children: msg("doCancel") }))] }) })) }))] }))] })));
}
//# sourceMappingURL=Account.js.map