import DeflyConnectIcon from "../../asset/icon/DeflyConnect.svg"; import CloseIcon from "../../asset/icon/Close.svg"; import CloseIconLight from "../../asset/icon/Close--light.svg"; import styles from "./_defly-wallet-modal-header.scss"; import {isSmallScreen} from "../../util/screen/screenSizeUtils"; import {isMobile} from "../../util/device/deviceUtils"; import { DEFLY_WALLET_REDIRECT_MODAL_ID, removeModalWrapperFromDOM } from "../deflyWalletConnectModalUtils"; const deflyWalletModalHeader = document.createElement("template"); const headerClassName = isMobile() ? "defly-wallet-modal-header defly-wallet-modal-header--mobile" : "defly-wallet-modal-header defly-wallet-modal-header--desktop"; deflyWalletModalHeader.innerHTML = `
${ isSmallScreen() && isMobile() ? "" : `
Defly Connect
` }
`; export class DeflyWalletModalHeader extends HTMLElement { constructor() { super(); this.attachShadow({mode: "open"}); if (this.shadowRoot) { const styleSheet = document.createElement("style"); styleSheet.textContent = styles; this.shadowRoot.append(deflyWalletModalHeader.content.cloneNode(true), styleSheet); this.onClose(); } } onClose() { const closeButton = this.shadowRoot?.getElementById( "defly-wallet-modal-header-close-button" ); const modalId = this.getAttribute("modal-id"); if (closeButton && modalId === DEFLY_WALLET_REDIRECT_MODAL_ID) { closeButton.addEventListener("click", () => { removeModalWrapperFromDOM(DEFLY_WALLET_REDIRECT_MODAL_ID); }); } } }