@e280/authlocal/x/authority/views/pages/ingress/subviews/recovery/view.js

User-sovereign login system for everybody

import { debounce, html, shadowView } from "@benev/slate";
import stylesCss from "./styles.css.js";
import themeCss from "../../../../../theme.css.js";
import { Summary } from "../../../../common/summary/view.js";
import { Problems } from "../../../../common/problems/view.js";
export const Recovery = shadowView(use => (options) => {
    use.name("recovery");
    use.styles([themeCss, stylesCss]);
    const { intake } = options;
    const ingest = debounce(100, async () => {
        intake.clear();
        const textarea = use.shadow.querySelector("textarea");
        const text = textarea.value;
        await intake.ingestSeedText(text);
    });
    async function clickSave() {
        await options.onSave(intake.identities.value);
        await options.onBack();
    }
    return html `
		<section theme-group class=seedzone>
			<h2>Enter your recovery seed(s)</h2>

			<textarea
				theme-inputty
				theme-seedbox
				theme-seed
				autocorrect=off
				autocapitalize=off
				spellcheck=false
				@input="${ingest}"
			></textarea>

			${intake.problems.value.length > 0
        ? Problems([intake.problems.value])
        : null}
		</section>

		${intake.identities.value.length > 0
        ? Summary([intake.identities.value])
        : null}

		<footer theme-buttons>
			<button
				theme-button=back
				@click="${options.onBack}">
					Back
			</button>

			<button
				theme-button=happy
				?disabled="${intake.identities.value.length === 0}"
				@click="${clickSave}">
					Import
			</button>
		</footer>
	`;
});
//# sourceMappingURL=view.js.map