@authduo/authduo/x/common/views/id/view.js

Free User-sovereign Authentication for the World

import { debounce, html, shadowView } from "@benev/slate";
import stylesCss from "./styles.css.js";
import themeCss from "../../theme.css.js";
const time = 1000;
export const IdView = shadowView(use => (hex, alias) => {
    alias ??= hex.slice(0, 8);
    use.name("id");
    use.styles(themeCss, stylesCss);
    const copyStatus = use.signal(undefined);
    const clearStatus = use.once(() => debounce(time, () => {
        copyStatus.value = undefined;
    }));
    function copy() {
        navigator.clipboard.writeText(hex)
            .then(() => { copyStatus.value = "good"; })
            .catch(() => { copyStatus.value = "bad"; })
            .finally(() => clearStatus());
    }
    return html `
		<span x-copy="${copyStatus}" title='copy "${alias}.."'>
			<span x-text @click="${copy}">${alias}</span>
			<span x-notify=good>Copied</span>
			<span x-notify=bad>Copy Failed</span>
		</span>
	`;
});
//# sourceMappingURL=view.js.map