tf-checkout-react 1.3.46 → 1.3.47-beta.2

package/dist/tf-checkout-styles.css

@@ -1 +1 @@
-.button-container{display:flex;justify-content:center;padding:20px}.billing-info-container{margin:0 auto;max-width:800px}.billing-info-container .is-half{width:49%}.billing-info-container p{color:#000}.billing-info-container .main-header{font-size:2rem;font-weight:600}.billing-info-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.billing-info-container__singleField{margin-top:15px}button{margin-top:10px}.account-actions-block{color:#182026;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif;margin-top:10px}.MuiButtonBase-root.MuiButton-root,.MuiButtonBase-root.MuiButton-root:hover,.login-register-button{background-color:#212529;border:#f28051;border-radius:5px;color:#fff;cursor:pointer;display:block;font-family:Inter-Bold;font-size:26px;font-weight:700;line-height:1.15;margin-top:10px;min-height:46px;outline:none;overflow:hidden;padding:14px 12px 12px;position:relative;text-align:center;text-overflow:ellipsis;text-transform:uppercase;width:49%}.logo-image-container{margin-top:5px;text-align:center;width:49%}.logo-image-container img{height:30px}.login-block{align-items:center;display:flex;flex-direction:column}.login-register-button:hover{background-color:#505050!important;border-color:#505050!important}.login-register-block{display:flex;justify-content:space-between}@media only screen and (max-width:820px){.billing-info-container{width:90%}.billing-info-container .main-header{font-size:1.5rem}}.email-checking{margin-bottom:15px}.forgot-password-modal .forgot-password-container{margin:0 auto;max-width:800px}.forgot-password-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.forgot-password-modal .forgot-password-container__singleField{margin-top:15px}.forgot-password-modal .forgot-password-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.forgot-password-modal .forgot-password-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.forgot-password-modal .login{margin-top:10px;text-align:center}.forgot-password-modal .login span{cursor:pointer}.forgot-password-modal .login span:hover{text-decoration:underline}.forgot-password-modal button[disabled]{cursor:unset;opacity:.7}.modal-title{align-items:center;background-color:#fff;display:flex;font-family:Inter;font-size:18px;font-weight:700;height:49px;line-height:22px;padding-left:25px;position:relative}.login-modal-body{padding:15px 25px}.login-modal-body input{background:#fff!important}.login-modal-body__email,.login-modal-body__password{margin-bottom:20px}.login-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin:10px 0;outline:none;padding:10px;width:100%}.login-action-button button:hover{background-color:#505050;border-color:#505050}.server_auth__error{color:red;font-family:Inter;font-size:12px;font-style:normal;padding-left:25px;padding-top:15px}.info-text-for-login{font-size:14px;margin-bottom:4px;padding-left:10px}.forgot-password{text-align:center}.forgot-password span{cursor:pointer}.forgot-password span:hover{text-decoration:underline}.signup-modal .signup-container{margin:0 auto;max-width:800px}.signup-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.signup-modal .signup-container .is-half{width:49%}.signup-modal .signup-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.signup-modal .signup-container__singleField{margin-top:15px}.signup-modal button{margin-top:10px}.signup-modal .signup-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.signup-modal .signup-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.signup-modal .login{margin-top:10px;text-align:center}.signup-modal .login span{cursor:pointer}.signup-modal .login span:hover{text-decoration:underline}.signup-modal button[disabled]{cursor:unset;opacity:.7}.timer{background-color:#000;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);background-position:15px;background-repeat:no-repeat;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-box-shadow:0 0 12px #999;-webkit-box-shadow:0 0 12px #999;box-shadow:0 0 12px #999;color:#fff;margin:0 0 6px;max-width:300px;overflow:hidden;padding:15px 15px 15px 50px;pointer-events:auto;position:absolute;right:15px;width:300px}.timer .close-icon{cursor:pointer;display:flex;position:absolute;right:10px;top:10px}.timer .countdown{font-weight:700;margin-top:10px}.payment_page{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.payment_page .order_info_section{padding:15px 0}.payment_page .order_info_section .order_info_block{padding-bottom:15px;padding-top:15px}.payment_page .order_info_section .order_info_block .field-underline{border-bottom:1px solid #000;padding-bottom:15px}.payment_page .order_info_section .order_info_block .order_info_title{font-size:14px;font-weight:700;padding-bottom:3px}.payment_page .order_info_section .order_info_block .order_info_text{font-size:16px;line-height:1.15;outline:none}.payment_page .MuiBox-root{margin-left:auto;margin-right:auto;padding:20px;text-align:center}.payment_page .payment_info_label{padding:20px 0;text-align:center}.payment_page .payment_form{color:#fff;padding:20px}.payment_page .payment_form input,.payment_page .payment_form label{color:#fff}.payment_page .payment_button{padding-top:20px;text-align:center}.card_form_inner{background:#232323;border-radius:8px;margin:0 auto 20px;min-width:325px;padding:15px;width:50%}.card_form_inner .card_label_text{color:#fff}.card_form_inner .StripeElement{margin:5px 0 10px}.card_label_text{color:#fff}.payment_button{padding-top:15px;text-align:center}.payment_button button{background-color:#212529;border-radius:8px;color:#fff;cursor:pointer;font-size:26px;padding:15px 30px;transition:opacity .5s;width:200px}.payment_button button:hover{opacity:.7}.disabled-payment-button button{opacity:.3;pointer-events:none;user-select:none}.checkout_error_block{color:#e53935;font-weight:600;padding:15px 0}.zip_element p{margin-bottom:0}.zip_element input{background-color:#000;border:none;color:#fff;font-size:18px;margin-top:5px;outline:none;width:100%}.confirmation-page{margin:0 auto;max-width:1024px}.confirmation-page button{margin-top:inherit}.confirmation-page .strong-text{font-weight:700}.confirmation-page .title{color:#333;font-size:24px;font-weight:600}.confirmation-page .share-message-section{background:#dff0d8;border:1px solid #d6e9c6;border-radius:5px;color:#2c7221;display:flex;flex-direction:column;margin:20px 0;padding:15px}.confirmation-page .main{font-size:15px;font-weight:700}.confirmation-page .helper,.confirmation-page .main{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.confirmation-page .helper{font-size:14px;margin-top:5px}.confirmation-page .referral_text_image_section{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between;margin:20px 0}.confirmation-page .referral_text_section{margin:10px}.confirmation-page .referral_title_text{color:#f08057;font-size:28px;padding-bottom:10px}.confirmation-page .referral_text{font-size:18px}.confirmation-page .referral_text_image_section img{margin:10px;max-width:200px}.confirmation-page .share_wrapper{column-gap:5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:10px}.confirmation-page .invitation_title{font-size:22px;padding-bottom:12px;padding-top:12px}.confirmation-page .share_section{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 -10px}.confirmation-page .invitation_section{flex:1 1;padding:0 5px}.confirmation-page .share_buttons{display:grid;flex-wrap:wrap;margin:0 -7px}.confirmation-page .convenient_buttons{margin-top:10px}.confirmation-page .social-media-btns{grid-gap:5px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.confirmation-page .sharing-btn{background-color:#000;flex:1 1;min-width:130px}.confirmation-page .sharing-btn a{text-decoration:none}.confirmation-page .share-by-link{background:#000;color:#fff;padding:10px}.confirmation-page .share-by-link.label{margin:0;padding:0;text-align:left}.confirmation-page .share-btn-inner{align-items:center;background-color:#000;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-flex;padding:0;text-align:left;width:100%}.confirmation-page .share-input{background-color:#fff;border:none;outline:none;padding:5px;text-align:left;width:300px}.confirmation-page .share-text{display:block;font-size:13px;font-weight:600;padding-top:8px;width:100%}.confirmation-page .pricing-section_wrapper{background:#e3e3e3;border:1px solid #dcdcdc;display:grid;grid-template-columns:1fr 1fr;margin:10px 0;padding:15px}.confirmation-page .pricing-section_label{font-weight:600}.confirmation-page .pricing-section_sublabel{font-size:14px;font-weight:100}.confirmation-page .pricing-section_price{font-weight:600;text-align:right}.confirmation-page .share-by-link-copy-icon{align-items:center;background-color:#32325d;border-radius:4px;color:#fff;cursor:pointer;display:flex;justify-content:center;margin-left:8px;padding:10px;transition:all .15s ease}.confirmation-page .share-by-link-copy-icon:hover{background-color:#505050}.confirmation-page .share-by-link-copy-icon img{width:14px}.confirmation-page .social-media-sharing{background-color:#000;color:#fff;cursor:pointer;padding:10px;text-align:center}.confirmation-page .share-icon{border-radius:4px;display:inline-flex}@media only screen and (max-width:1050px){.confirmation-page .share_wrapper{column-gap:0;display:grid;grid-template-columns:unset;margin:15px}}@media only screen and (max-width:480px){.confirmation-page .social-media-btns{grid-template-columns:unset}.confirmation-page .share-input{width:250px}}body{margin:0;padding:0}.get-tickets-page{width:100%}.event-detail__tier{background-color:#fff;padding:17px 35px 20px}.event-detail__tier-name{color:#000;font-family:Inter-Bold;font-family:Bebas Neue;font-size:.85rem;font-weight:700;letter-spacing:.2em;line-height:1.3;margin-bottom:8px;margin-top:16px;padding-right:20%;text-transform:uppercase}.event-detail__tier-status{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;margin-top:8px;width:100%}.event-detail__tier-status.ticket-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;font-weight:700;letter-spacing:.2em;line-height:1.5;margin-bottom:10px;width:200px}.event-tickets-container{align-items:center;display:flex;justify-content:space-between}.event-detail__tier-status.ticket-button.true{background-color:#c1c3c6;border-color:#afb0b1}.event-detail__tier-price{color:#000;font-family:Inter-Bold;font-size:1.5rem;line-height:1;text-align:center}.event-detail__tier-price p{margin:0}.event-detail__tier-price .fees{font-size:14px;margin-top:4px;text-align:left}.event-detail__tier-price .old-price{color:red;font-size:1.3rem;margin-bottom:5px;text-decoration:line-through}.alert-info{align-items:center;background-color:#d9edf7;border:1px solid #bce8f1;border-radius:4px;color:#3a87ad;display:flex;font-size:1em;justify-content:center;margin:0 35px;padding:8px 15px;text-shadow:0 1px 0 hsla(0,0%,100%,.5)}.alert-info svg{margin-right:4px}.event-detail__tier-state{color:#30bc9d;font-family:Inter-Bold;font-size:.75rem;font-weight:300;line-height:1;text-align:right;text-transform:uppercase}.event-detail__tier-state .ticket-not-started-message{color:#000;text-align:left;text-transform:none;width:50px}.promo-code-block input{font-size:14px;padding:1px 8px}.book-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;display:block;font-size:26px;font-weight:700;height:50px;letter-spacing:.2em;line-height:1.5;margin:25px auto 10px;text-align:center;width:100%}.book-button:hover{background-color:#505050;border-color:#505050}.loader-container{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.get-tickets-paper::-webkit-scrollbar{width:5px}.get-tickets-paper::-webkit-scrollbar-track{background:#f1f1f1}.get-tickets-paper::-webkit-scrollbar-thumb{background:#888}.get-tickets-paper::-webkit-scrollbar-thumb:hover{background:#555}.get-tickets .get-tickets__selectbox{width:100%}.disabled{pointer-events:none;user-select:none}.hidden{display:none}.event-closed-message{font-family:Bebas Neue;letter-spacing:.5px}.countdown p{margin:0}.countdown .title{font-weight:700}.countdown .message{font-weight:700;margin-top:20px}.waiting-list{padding:17px 35px 20px}.waiting-list .field-item{margin-bottom:30px}.waiting-list .waiting-list-button{width:100%!important}.waiting-list .waiting-list-button:hover{background-color:#505050}.waiting-list .success-message{margin-bottom:15px;text-align:center}.waiting-list .success-message p{margin:0}.waiting-list .no-tickets-text{font-weight:700;text-align:center}.waiting-list .added-success-message{font-size:22px;margin-bottom:10px}.my-ticket{padding:30px}.my-ticket-table{margin-top:30px}.my-ticket .loading{background-color:rgba(0,0,0,.4);height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%}.my-ticket .event-info,.my-ticket .loading{align-items:center;display:flex}.my-ticket thead th{font-weight:700}.my-ticket .event-info img{margin-right:10px;width:50px}.my-ticket .order-details-button{background-color:#32325d;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:10px 14px;transition:all .15s ease}.my-ticket .order-details-button:hover{background-color:#505050}.order-details{margin:0 auto;max-width:940px}.order-details .loading{align-items:center;background-color:rgba(0,0,0,.4);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1400}.order-details .layout-title{font-size:24px;font-weight:400}.order-details .sub-title{font-size:18px;font-weight:400;margin:10px 0}.order-details .order-summary-box{margin-top:30px}.order-details .total-row td,.order-details th{color:#fff;font-weight:700}.order-details .tickets-box{margin-top:30px}.order-details .ticket-add-on-table{background-color:#fcf8e3}.order-details .action-button{background-color:#212529;border:1px solid #fff;border-radius:0;color:#fff;cursor:pointer;display:block;font-family:Bebas Neue;font-size:14px;font-weight:400;line-height:normal;margin-bottom:20px;margin-top:20px;min-height:auto;outline:none;overflow:hidden;padding:12px;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:uppercase;width:max-content}.order-details .download-button:hover{background-color:#505050}.order-details .personal-link{padding:20px 0}.order-details .total-referrer{padding:0 0 20px}.resale-modal .field-box{display:flex;margin-bottom:10px}.resale-modal .field-box .icon{align-items:center;display:flex;height:56px;justify-content:center;min-width:44px}.resale-modal .field-box .empty-box{min-width:44px}.resale-modal .resale-action-button button{background-color:#212529;color:#fff;cursor:pointer;width:100%}.resale-modal .resale-action-button button[disabled]{opacity:.7}.resale-modal .resale-action-button button:hover{background-color:#505050;border-color:#505050;width:100%}.reset-password{margin:0 auto;max-width:300px;padding:14px}.reset-password .title{font-size:20px;font-weight:700}.reset-password .field-item{margin-top:14px}.reset-password .action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:14px;outline:none;padding:10px;text-transform:uppercase;width:100%}.reset-password .action-button button:hover:enabled{background-color:#505050;border-color:#505050}.reset-password .action-button button[disabled]{cursor:unset;opacity:.7}
+.button-container{display:flex;justify-content:center;padding:20px}.billing-info-container{margin:0 auto;max-width:800px}.billing-info-container .is-half{width:49%}.billing-info-container p{color:#000}.billing-info-container .main-header{font-size:2rem;font-weight:600}.billing-info-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.billing-info-container__singleField{margin-top:15px}button{margin-top:10px}.account-actions-block,.crypto-actions-block{color:#182026;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif;margin-top:10px}.login-register-button,.MuiButtonBase-root.MuiButton-root,.MuiButtonBase-root.MuiButton-root:hover{background-color:#212529;border:#f28051;border-radius:5px;color:#fff;cursor:pointer;display:block;font-family:Inter-Bold;font-size:26px;font-weight:700;line-height:1.15;margin-top:10px;min-height:46px;outline:none;overflow:hidden;padding:14px 12px 12px;position:relative;text-align:center;text-overflow:ellipsis;text-transform:uppercase;width:49%}.logo-image-container{margin-top:5px;text-align:center;width:49%}.logo-image-container img{height:30px}.login-block{align-items:center;display:flex;flex-direction:column}.login-register-button:hover{background-color:#505050!important;border-color:#505050!important}.login-register-block{display:flex;justify-content:space-between}@media only screen and (max-width:820px){.billing-info-container{width:90%}.billing-info-container .main-header{font-size:1.5rem}}.email-checking{margin-bottom:15px}.forgot-password-modal .forgot-password-container{margin:0 auto;max-width:800px}.forgot-password-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.forgot-password-modal .forgot-password-container__singleField{margin-top:15px}.forgot-password-modal .forgot-password-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.forgot-password-modal .forgot-password-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.forgot-password-modal .login{margin-top:10px;text-align:center}.forgot-password-modal .login span{cursor:pointer}.forgot-password-modal .login span:hover{text-decoration:underline}.forgot-password-modal button[disabled]{cursor:unset;opacity:.7}.modal-title{align-items:center;background-color:#fff;display:flex;font-family:Inter;font-size:18px;font-weight:700;height:49px;line-height:22px;padding-left:25px;position:relative}.login-modal-body{padding:15px 25px}.login-modal-body input{background:#fff!important}.login-modal-body__email,.login-modal-body__password{margin-bottom:20px}.login-action-button button,.login-wallet-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin:10px 0;outline:none;padding:10px;width:100%}.login-action-button button:hover,.login-wallet-button button:hover{background-color:#505050;border-color:#505050}.server_auth__error{color:red;font-family:Inter;font-size:12px;font-style:normal;padding-left:25px;padding-top:15px}.info-text-for-login{font-size:14px;margin-bottom:4px;padding-left:10px}.forgot-password{text-align:center}.forgot-password span{cursor:pointer}.forgot-password span:hover{text-decoration:underline}.signup-modal .signup-container{margin:0 auto;max-width:800px}.signup-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.signup-modal .signup-container .is-half{width:49%}.signup-modal .signup-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.signup-modal .signup-container__singleField{margin-top:15px}.signup-modal button{margin-top:10px}.signup-modal .signup-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.signup-modal .signup-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.signup-modal .login{margin-top:10px;text-align:center}.signup-modal .login span{cursor:pointer}.signup-modal .login span:hover{text-decoration:underline}.signup-modal button[disabled]{cursor:unset;opacity:.7}.timer{background-color:#000;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);background-position:15px;background-repeat:no-repeat;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-box-shadow:0 0 12px #999;-webkit-box-shadow:0 0 12px #999;box-shadow:0 0 12px #999;color:#fff;margin:0 0 6px;max-width:300px;overflow:hidden;padding:15px 15px 15px 50px;pointer-events:auto;position:absolute;right:15px;width:300px}.timer .close-icon{cursor:pointer;display:flex;position:absolute;right:10px;top:10px}.timer .countdown{font-weight:700;margin-top:10px}.payment_page{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.payment_page .order_info_section{padding:15px 0}.payment_page .order_info_section .order_info_block{padding-bottom:15px;padding-top:15px}.payment_page .order_info_section .order_info_block .field-underline{border-bottom:1px solid #000;padding-bottom:15px}.payment_page .order_info_section .order_info_block .order_info_title{font-size:14px;font-weight:700;padding-bottom:3px}.payment_page .order_info_section .order_info_block .order_info_text{font-size:16px;line-height:1.15;outline:none}.payment_page .MuiBox-root{margin-left:auto;margin-right:auto;padding:20px;text-align:center}.payment_page .payment_info_label{padding:20px 0;text-align:center}.payment_page .payment_form{color:#fff;padding:20px}.payment_page .payment_form input,.payment_page .payment_form label{color:#fff}.payment_page .payment_button{padding-top:20px;text-align:center}.card_form_inner{background:#232323;border-radius:8px;margin:0 auto 20px;min-width:325px;padding:15px;width:50%}.card_form_inner .card_label_text{color:#fff}.card_form_inner .StripeElement{margin:5px 0 10px}.card_label_text{color:#fff}.payment_button{padding-top:15px;text-align:center}.payment_button button{background-color:#212529;border-radius:8px;color:#fff;cursor:pointer;font-size:26px;padding:15px 30px;transition:opacity .5s;width:200px}.payment_button button:hover{opacity:.7}.disabled-payment-button button{opacity:.3;pointer-events:none;user-select:none}.checkout_error_block{color:#e53935;font-weight:600;padding:15px 0}.zip_element p{margin-bottom:0}.zip_element input{background-color:#000;border:none;color:#fff;font-size:18px;margin-top:5px;outline:none;width:100%}.confirmation-page{margin:0 auto;max-width:1024px}.confirmation-page button{margin-top:inherit}.confirmation-page .strong-text{font-weight:700}.confirmation-page .title{color:#333;font-size:24px;font-weight:600}.confirmation-page .share-message-section{background:#dff0d8;border:1px solid #d6e9c6;border-radius:5px;color:#2c7221;display:flex;flex-direction:column;margin:20px 0;padding:15px}.confirmation-page .main{font-size:15px;font-weight:700}.confirmation-page .helper,.confirmation-page .main{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.confirmation-page .helper{font-size:14px;margin-top:5px}.confirmation-page .referral_text_image_section{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between;margin:20px 0}.confirmation-page .referral_text_section{margin:10px}.confirmation-page .referral_title_text{color:#f08057;font-size:28px;padding-bottom:10px}.confirmation-page .referral_text{font-size:18px}.confirmation-page .referral_text_image_section img{margin:10px;max-width:200px}.confirmation-page .share_wrapper{column-gap:5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:10px}.confirmation-page .invitation_title{font-size:22px;padding-bottom:12px;padding-top:12px}.confirmation-page .share_section{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 -10px}.confirmation-page .invitation_section{flex:1 1;padding:0 5px}.confirmation-page .share_buttons{display:grid;flex-wrap:wrap;margin:0 -7px}.confirmation-page .convenient_buttons{margin-top:10px}.confirmation-page .social-media-btns{grid-gap:5px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.confirmation-page .sharing-btn{background-color:#000;flex:1 1;min-width:130px}.confirmation-page .sharing-btn a{text-decoration:none}.confirmation-page .share-by-link{background:#000;color:#fff;padding:10px}.confirmation-page .share-by-link.label{margin:0;padding:0;text-align:left}.confirmation-page .share-btn-inner{align-items:center;background-color:#000;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-flex;padding:0;text-align:left;width:100%}.confirmation-page .share-input{background-color:#fff;border:none;outline:none;padding:5px;text-align:left;width:300px}.confirmation-page .share-text{display:block;font-size:13px;font-weight:600;padding-top:8px;width:100%}.confirmation-page .pricing-section_wrapper{background:#e3e3e3;border:1px solid #dcdcdc;display:grid;grid-template-columns:1fr 1fr;margin:10px 0;padding:15px}.confirmation-page .pricing-section_label{font-weight:600}.confirmation-page .pricing-section_sublabel{font-size:14px;font-weight:100}.confirmation-page .pricing-section_price{font-weight:600;text-align:right}.confirmation-page .share-by-link-copy-icon{align-items:center;background-color:#32325d;border-radius:4px;color:#fff;cursor:pointer;display:flex;justify-content:center;margin-left:8px;padding:10px;transition:all .15s ease}.confirmation-page .share-by-link-copy-icon:hover{background-color:#505050}.confirmation-page .share-by-link-copy-icon img{width:14px}.confirmation-page .social-media-sharing{background-color:#000;color:#fff;cursor:pointer;padding:10px;text-align:center}.confirmation-page .share-icon{border-radius:4px;display:inline-flex}@media only screen and (max-width:1050px){.confirmation-page .share_wrapper{column-gap:0;display:grid;grid-template-columns:unset;margin:15px}}@media only screen and (max-width:480px){.confirmation-page .social-media-btns{grid-template-columns:unset}.confirmation-page .share-input{width:250px}}body{margin:0;padding:0}.get-tickets-page{width:100%}.event-detail__tier{background-color:#fff;padding:17px 35px 20px}.event-detail__tier-name{color:#000;font-family:Inter-Bold;font-family:Bebas Neue;font-size:.85rem;font-weight:700;letter-spacing:.2em;line-height:1.3;margin-bottom:8px;margin-top:16px;padding-right:20%;text-transform:uppercase}.event-detail__tier-status{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;margin-top:8px;width:100%}.event-detail__tier-status.ticket-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;font-weight:700;letter-spacing:.2em;line-height:1.5;margin-bottom:10px;width:200px}.event-tickets-container{align-items:center;display:flex;justify-content:space-between}.event-detail__tier-status.ticket-button.true{background-color:#c1c3c6;border-color:#afb0b1}.event-detail__tier-price{color:#000;font-family:Inter-Bold;font-size:1.5rem;line-height:1;text-align:center}.event-detail__tier-price p{margin:0}.event-detail__tier-price .fees{font-size:14px;margin-top:4px;text-align:left}.event-detail__tier-price .old-price{color:red;font-size:1.3rem;margin-bottom:5px;text-decoration:line-through}.alert-info{align-items:center;background-color:#d9edf7;border:1px solid #bce8f1;border-radius:4px;color:#3a87ad;display:flex;font-size:1em;justify-content:center;margin:0 35px;padding:8px 15px;text-shadow:0 1px 0 hsla(0,0%,100%,.5)}.alert-info svg{margin-right:4px}.event-detail__tier-state{color:#30bc9d;font-family:Inter-Bold;font-size:.75rem;font-weight:300;line-height:1;text-align:right;text-transform:uppercase}.event-detail__tier-state .ticket-not-started-message{color:#000;text-align:left;text-transform:none;width:50px}.promo-code-block input{font-size:14px;padding:1px 8px}.book-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;display:block;font-size:26px;font-weight:700;height:50px;letter-spacing:.2em;line-height:1.5;margin:25px auto 10px;text-align:center;width:100%}.book-button:hover{background-color:#505050;border-color:#505050}.loader-container{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.get-tickets-paper::-webkit-scrollbar{width:5px}.get-tickets-paper::-webkit-scrollbar-track{background:#f1f1f1}.get-tickets-paper::-webkit-scrollbar-thumb{background:#888}.get-tickets-paper::-webkit-scrollbar-thumb:hover{background:#555}.get-tickets .get-tickets__selectbox{width:100%}.disabled{pointer-events:none;user-select:none}.hidden{display:none}.event-closed-message{font-family:Bebas Neue;letter-spacing:.5px}.countdown p{margin:0}.countdown .title{font-weight:700}.countdown .message{font-weight:700;margin-top:20px}.waiting-list{padding:17px 35px 20px}.waiting-list .field-item{margin-bottom:30px}.waiting-list .waiting-list-button{width:100%!important}.waiting-list .waiting-list-button:hover{background-color:#505050}.waiting-list .success-message{margin-bottom:15px;text-align:center}.waiting-list .success-message p{margin:0}.waiting-list .no-tickets-text{font-weight:700;text-align:center}.waiting-list .added-success-message{font-size:22px;margin-bottom:10px}.my-ticket{padding:30px}.my-ticket-table{margin-top:30px}.my-ticket .loading{background-color:rgba(0,0,0,.4);height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%}.my-ticket .event-info,.my-ticket .loading{align-items:center;display:flex}.my-ticket thead th{font-weight:700}.my-ticket .event-info img{margin-right:10px;width:50px}.my-ticket .order-details-button{background-color:#32325d;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:10px 14px;transition:all .15s ease}.my-ticket .order-details-button:hover{background-color:#505050}.order-details{margin:0 auto;max-width:940px}.order-details .loading{align-items:center;background-color:rgba(0,0,0,.4);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1400}.order-details .layout-title{font-size:24px;font-weight:400}.order-details .sub-title{font-size:18px;font-weight:400;margin:10px 0}.order-details .order-summary-box{margin-top:30px}.order-details .total-row td,.order-details th{color:#fff;font-weight:700}.order-details .tickets-box{margin-top:30px}.order-details .ticket-add-on-table{background-color:#fcf8e3}.order-details .action-button{background-color:#212529;border:1px solid #fff;border-radius:0;color:#fff;cursor:pointer;display:block;font-family:Bebas Neue;font-size:14px;font-weight:400;line-height:normal;margin-bottom:20px;margin-top:20px;min-height:auto;outline:none;overflow:hidden;padding:12px;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:uppercase;width:max-content}.order-details .download-button:hover{background-color:#505050}.order-details .personal-link{padding:20px 0}.order-details .total-referrer{padding:0 0 20px}.resale-modal .field-box{display:flex;margin-bottom:10px}.resale-modal .field-box .icon{align-items:center;display:flex;height:56px;justify-content:center;min-width:44px}.resale-modal .field-box .empty-box{min-width:44px}.resale-modal .resale-action-button button{background-color:#212529;color:#fff;cursor:pointer;width:100%}.resale-modal .resale-action-button button[disabled]{opacity:.7}.resale-modal .resale-action-button button:hover{background-color:#505050;border-color:#505050;width:100%}.reset-password{margin:0 auto;max-width:300px;padding:14px}.reset-password .title{font-size:20px;font-weight:700}.reset-password .field-item{margin-top:14px}.reset-password .action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:14px;outline:none;padding:10px;text-transform:uppercase;width:100%}.reset-password .action-button button:hover:enabled{background-color:#505050;border-color:#505050}.reset-password .action-button button[disabled]{cursor:unset;opacity:.7}

package/dist/types/billing-info-data.d.ts

@@ -25,3 +25,8 @@ export interface IBillingInfoData {
     labelClassName?: string;
     uniqueId?: string;
 }
+export interface IBillingCryptoData {
+    cryptoAddress: string | undefined;
+    cryptoSignature: string | undefined;
+    blockchain: string | undefined;
+}

package/dist/utils/getWalletName.d.ts

@@ -0,0 +1 @@
+export declare const getWalletName: (blockchain: string) => string;

package/dist/utils/loadProfile.d.ts

@@ -0,0 +1,32 @@
+export declare const loadProfile: (token?: string | undefined) => Promise<any>;
+export declare const setLoggedUserData: (data: IUserData) => {
+    id: string;
+    first_name: string;
+    last_name: string;
+    email: string;
+    confirmEmail: string;
+    city: string;
+    country: string;
+    phone: string;
+    street_address: string;
+    state: string;
+    zip: string;
+    linkedCryptoWallets: string[];
+};
+interface IUserData {
+    id: string;
+    firstName: string;
+    lastName: string;
+    email: string;
+    city?: string;
+    country?: string;
+    countryId?: string;
+    phone?: string;
+    streetAddress?: string;
+    state?: string;
+    zip?: string;
+    zipCode?: string;
+    stateId?: string;
+    linkedCryptoWallets?: string[];
+}
+export {};

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.3.46",
+  "version": "1.3.47-beta.2",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -79,6 +79,7 @@
   "dependencies": {
     "@emotion/react": "^11.7.0",
     "@emotion/styled": "^11.6.0",
+    "@metamask/detect-provider": "^1.2.0",
     "@mui/material": "^5.2.2",
     "@mui/styles": "^5.2.2",
     "@mui/x-date-pickers": "^5.0.1",
@@ -98,6 +99,7 @@
     "react-countdown": "^2.3.2",
     "react-inlinesvg": "^2.3.0",
     "react-share": "^4.4.0",
+    "web3": "^1.8.1",
     "yup": "^0.32.11"
   }
 }

package/src/api/index.ts

@@ -81,7 +81,7 @@ publicRequest.interceptors.request.use((config: AxiosRequestConfig) => {
     config.headers = updatedHeaders
   }
 
-  const additionalCookiesHeaderValue = '' //document.cookie ?? ''
+  const additionalCookiesHeaderValue = document.cookie ?? ''
   if (additionalCookiesHeaderValue !== '') {
     const updatedHeaders = {
       ...config.headers,
@@ -259,6 +259,15 @@ export const authorize = (data: { email: string, password: string }) =>
     data
   )
 
+export const authorizeWithWallet = (address: string, signature: string, blockchain: string) => {
+  const body = new FormData()
+  body.set('crypto_address', address)
+  body.set('crypto_signature', signature)
+  return publicRequest.post(`crypto/${blockchain}/auth`,body).catch(error => {
+    throw error
+  })
+}
+
 export const register = (data: FormData) =>
   publicRequest.post('v1/oauth/register-rn', data)
 
@@ -384,6 +393,9 @@ export const declineInvitation = (hash: string) =>
 export const sendRSVPInfo = (eventId: number, data: any) =>
   publicRequest.post(`v1/event/${eventId}/send-rsvp-info`, data)
 
+export const temporalNonce = () =>
+  publicRequest.get(`crypto/nonce`)
+
 export const validatePhoneNumber = async (phone: string): Promise<any> => {
   const response: AxiosResponse<
     any,
@@ -393,6 +405,35 @@ export const validatePhoneNumber = async (phone: string): Promise<any> => {
   return response.data
 }
 
+export const connectMetamask = (blockchain: string, form: FormData) =>
+  publicRequest.post(`crypto/${blockchain}/connect-metamask`, form)
+
+export const confirmMetamask = (blockchain: string, form: FormData) =>
+  publicRequest.post(`crypto/${blockchain}/confirm-metamask`, form)
+
+export const onConfirmConnectMetamask = (form: FormData) =>
+  publicRequest.post(`crypto/on-confirm-connect-metamask`, form)
+
+export const onUnconnectMetamask = () =>
+  publicRequest.post(`crypto/on-unconnect-metamask`)
+
+export const cryptoAccount = (blockchain: string) =>
+  publicRequest.get(`crypto/${blockchain}/account`)
+
+export const cryptoAddress = (blockchain: string, address: string) =>
+  publicRequest.get(`crypto/${blockchain}/account/${address}`)
+
+export const cryptoConnect = (blockchain: string, address: string, signature: string) => {
+  const body = new FormData()
+  body.set('crypto_address', address)
+  body.set('crypto_signature', signature)
+  publicRequest.post(`crypto/${blockchain}/connect`, body)
+}
+
+export const cryptoA0K1 = (address: string, ticketHash: string, amount: string) => {
+  const query = 'ticketHash=' + encodeURIComponent(ticketHash) + '&amount=' + amount
+  return publicRequest.get(`crypto/a0k1verse/wallet/${address}/nfts?${query}`)
+}
 export const getAddons = async (eventId: string) => {
   const result = await publicRequest.get(`/v1/event/${eventId}/add-ons`)
   const addons = _get(result, 'data.data.attributes', [])

package/src/components/addonsContainer/utils/index.tsx

@@ -8,7 +8,7 @@ interface ObjectLiteral {
 }
 
 export const generateSelectOptions = (minCount = 1, maxCount = 10) => {
-  const options = []
+  const options: any[] = []
   for (let i = minCount; i <= maxCount; i++) {
     options.push({ label: i, value: i })
   }

package/src/components/billing-info-container/index.tsx

@@ -29,12 +29,16 @@ import {
   getCountries,
   getProfileData,
   getStates,
+  onConfirmConnectMetamask,
+  onUnconnectMetamask,
   postOnCheckout,
   register,
   setCustomHeader,
+  temporalNonce,
 } from '../../api'
 import { usePixel } from '../../hooks/usePixel'
 import { IBillingInfoData } from '../../types'
+import { IBillingCryptoData } from '../../types/billing-info-data'
 import {
   createCheckoutDataBodyWithDefaultHolder,
   deleteCookieByName,
@@ -42,11 +46,14 @@ import {
 } from '../../utils'
 import { ErrorFocus } from '../../utils/formikErrorFocus'
 import { getQueryVariable } from '../../utils/getQueryVariable'
+import { getWalletName } from '../../utils/getWalletName'
+import { loadProfile, setLoggedUserData } from '../../utils/loadProfile'
 import { combineValidators, requiredValidator } from '../../validators'
 import SnackbarAlert from '../common/SnackbarAlert'
 import { ForgotPasswordModal } from '../forgotPasswordModal'
 import { LoginModal } from '../loginModal'
 import { SignupModal } from '../signupModal'
+import { CryptoIntegration } from '../ticketsContainer/crypto'
 import TimerWidget from '../timerWidget'
 import {
   assingUniqueIds,
@@ -56,7 +63,8 @@ import {
   getFieldLabel,
   getInitialValues,
   getValidateFunctions,
-  setLoggedUserData,
+  returnSelectedBlockchain,
+  signSubmit,
 } from './utils'
 
 export interface IBillingInfoPage {
@@ -190,6 +198,7 @@ const LogicRunner: FC<{
               'holderLastName-0':
                 parsedData?.last_name || parsedData?.lastName || '',
               'holderEmail-0': parsedData?.email || '',
+              linkedCryptoWallets: parsedData?.linkedCryptoWallets || [],
             }
             setValues({ ...values, ...mappedValues })
             setUserValues(mappedValues)
@@ -293,6 +302,7 @@ export const BillingInfoContainer = React.memo(
       street_address: '',
       state: '',
       zip: '',
+      linkedCryptoWallets: [],
     })
     const [loading, setLoading] = useState(true)
     const [isCountriesLoading, setIsCountriesLoading] = useState(true)
@@ -324,6 +334,28 @@ export const BillingInfoContainer = React.memo(
     const hidePhoneField = getQueryVariable('hide_phone_field') === 'true'
     const hideWalletAddressField =
       !collectOptionalWalletAddress && !collectMandatoryWalletAddress
+    const [cryptoWrapper, setCryptoWrapper] = useState<any>(undefined)
+    const [detectedWallets, setDetectedWallets] = useState<string[]>([])
+    const [walletConnected, setWalletConnected] = useState<boolean>(false)
+    const [cryptoData, setCryptoData] = useState<IBillingCryptoData>({
+      cryptoAddress: undefined,
+      cryptoSignature: undefined,
+      blockchain: undefined
+    })
+    useEffect(() => {
+      setCryptoWrapper(CryptoIntegration())
+      const wallets: string[] = []
+      const registerDetectedWallet = (event: any) => {
+        const identifier = event?.detail?.identifier
+        const registered = wallets.find(wallet => wallet === identifier)
+        if (identifier && !registered) {
+          wallets.push(identifier)
+          setDetectedWallets(detectedWallets => [...detectedWallets, identifier])
+        }
+      }
+      window.addEventListener('ttf.crypto.new-wallet', registerDetectedWallet)
+      return () => window.removeEventListener('ttf.crypto.new-wallet', registerDetectedWallet)
+    }, [])
 
     // Get prevProps
     const prevData = useRef(data)
@@ -399,18 +431,14 @@ export const BillingInfoContainer = React.memo(
     const fetchUserData = async (token: string) => {
       try {
         if ((isWindowDefined && token) || isLoggedIn) {
-          const userDataResponse = await getProfileData(token)
-          const profileSpecifiedData = _get(userDataResponse, 'data.data')
+          const userDataResponse = await loadProfile(token)
+          const profileSpecifiedData = _get(userDataResponse, 'data')
           const profileDataObj = setLoggedUserData(profileSpecifiedData)
           setUserValues({
             ...profileDataObj,
             firstName: profileDataObj.first_name,
             lastName: profileDataObj.last_name,
           })
-          window.localStorage.setItem(
-            'user_data',
-            JSON.stringify(profileDataObj)
-          )
           onGetProfileDataSuccess(userDataResponse.data)
         }
       } catch (e) {
@@ -500,6 +528,115 @@ export const BillingInfoContainer = React.memo(
       localStorage.removeItem('referral_key')
     }
 
+    const unconnectWalletLoggedIn = async () => {
+      await onUnconnectMetamask()
+      document?.location?.reload()
+    }
+
+    const connectWalletLoggedIn = async (blockchain: string) => {
+      try {
+        cryptoWrapper.setBlockchain(blockchain)
+        await cryptoWrapper.enable()
+        const walletAddress = await cryptoWrapper.getAddress()
+        try{
+          await cryptoWrapper.getNonceFromAddress(walletAddress)
+          const errorMessage = 'This wallet is already connected to an existing account. Please log out of this account and log back in using this wallet.'
+          // @ts-ignore
+          return setError(errorMessage)
+        }
+        catch (e) {
+          if (e.errorCode === cryptoWrapper.ERRORS.ACCOUNT_NOT_FOUND) {
+            const response = await temporalNonce()
+            const ethNonce = _get(response, 'data.data.attributes.ethNonce')
+            const signature = await cryptoWrapper.getSignature(walletAddress, ethNonce, 'You are connecting your wallet with The Ticket Fairy. Nonce: ')
+            await cryptoWrapper.connectAddress(walletAddress, signature)
+            const form = new FormData()
+            form.append('blockchain', blockchain)
+            await onConfirmConnectMetamask(form)
+            setTimeout(() => {
+              fetchUserData(access_token)
+            }, 100)
+            setTimeout(() => {
+              fetchCart()
+            }, 1000)
+          } else {
+            throw e
+          }
+        }
+
+      } catch (e) {
+        if (e.errorCode !== cryptoWrapper.ERRORS.CONNECTION_REJECTED &&
+          e.errorCode !== cryptoWrapper.ERRORS.SIGNATURE_REJECTED) {
+          const errorMessage = 'Something went wrong, Try again later or contact our support team.'
+          fetchCart()
+          // @ts-ignore
+          return setError(errorMessage)
+        }
+      }
+    }
+
+    const getSignatureNewAccount = async (blockchain: string) => {
+      cryptoWrapper.setBlockchain(blockchain)
+      await cryptoWrapper.enable()
+      const address = await cryptoWrapper.getAddress()
+      const ethNonce = cartInfoData?.ethNonce
+      const signature = await cryptoWrapper.getSignature(address, ethNonce, 'Welcome to The Ticket Fairy! Nonce: ')
+      return { signature, address }
+    }
+
+    const getSignatureConfirmation = async (nonce: string) => {
+      const address = await cryptoWrapper.getAddress()
+      const message = 'Confirm you are the owner of '+ address + '. Nonce: '
+      const signature = await cryptoWrapper.getSignature(address, nonce, message)
+      return { signature }
+    }
+
+    const connectWallet = async (blockchain: string) => {
+      try {
+        cryptoWrapper.setBlockchain(blockchain)
+        await cryptoWrapper.enable()
+        const walletAddress = await cryptoWrapper.getAddress()
+        try {
+          const accountNonce = await cryptoWrapper.getNonceFromAddress(walletAddress)
+          const signature = await cryptoWrapper.getSignature(walletAddress, accountNonce, 'Welcome back, we missed you! Nonce: ')
+          await cryptoWrapper.authAddress(walletAddress, signature)
+          try {
+            const profileData = await loadProfile(access_token)
+            onGetProfileDataSuccess(profileData)
+            fetchCart()
+            setUserExpired(false)
+            if (typeof window !== 'undefined') {
+              const event = new window.CustomEvent('tf-login')
+              window.document.dispatchEvent(event)
+            }
+            onLoginSuccess()
+          } catch (e) {
+            if (axios.isAxiosError(e)) {
+              onGetProfileDataError(e)
+            }
+          }
+        } catch (e) {
+          if (e.errorCode === cryptoWrapper.ERRORS.ACCOUNT_NOT_FOUND) {
+            const response = await temporalNonce()
+            const ethNonce = _get(response, 'data.data.attributes.ethNonce')
+            const signature = await cryptoWrapper.getSignature(walletAddress, ethNonce, 'Welcome to The Ticket Fairy! Nonce: ')
+            setWalletConnected(true)
+            fetchCart()
+            // Set crypto information for customer registration
+            setCryptoData({ cryptoAddress: walletAddress, cryptoSignature: signature, blockchain })
+          } else {
+            throw e
+          }
+        }
+      } catch (e) {
+        if (e.errorCode !== cryptoWrapper.ERRORS.CONNECTION_REJECTED &&
+          e.errorCode !== cryptoWrapper.ERRORS.SIGNATURE_REJECTED) {
+          // @ts-ignore
+          return setError('Something went wrong, Try again later or contact our support team.')
+        }
+      }
+    }
+
     if (
       loading ||
       (enableTimer && !expirationTime && typeof window !== 'undefined')
@@ -510,6 +647,17 @@ export const BillingInfoContainer = React.memo(
       }
     }
 
+    const permittedBlockchains = cartInfoData?.permittedBlockchains
+    const isCryptoEvent = !!permittedBlockchains
+
+    const { selectedBlockchain, linkedAddress, sessionAddress } = returnSelectedBlockchain(permittedBlockchains, detectedWallets)
+
+    useEffect(() => {
+      if (selectedBlockchain) {
+        cryptoWrapper && cryptoWrapper.setBlockchain(selectedBlockchain)
+      }
+    }, [selectedBlockchain])
+
     const selectedCountry =
       _find(countries, item => item.code.toLowerCase() === defaultCountry) || {}
     const initialCountry =
@@ -517,6 +665,9 @@ export const BillingInfoContainer = React.memo(
 
     usePixel(['checkoutPixels', 'brandCheckoutPixels'], eventId)
 
+    const walletConnectedInSession = !!sessionAddress
+    const walletConnectedToTTFAccount = !!linkedAddress
+
     return (
       <ThemeProvider theme={themeMui}>
         {(loading || isCountriesLoading) && (
@@ -550,7 +701,28 @@ export const BillingInfoContainer = React.memo(
             onSubmit={async (values, formikHelpers) => {
               try {
                 if (isLoggedIn) {
-                  const checkoutBody = collectCheckoutBody(values, userData)
+                  const checkoutBody: any = collectCheckoutBody(values, userData)
+
+                  if (isCryptoEvent) {
+                    const res = await getCart()
+                    const cartInfo = _get(res, 'data.data.attributes')
+                    const { signature, override_crypto_address, usedAddress } = await signSubmit(
+                      {
+                        hasAccount: cartInfo?.hasAccount,
+                        ethNonce: cartInfo?.ethNonce,
+                        permittedBlockchains: cartInfo?.permittedBlockchains,
+                        cryptoWrapper,
+                        selectedBlockchain
+                      }
+                    )
+                    checkoutBody.attributes.blockchain = selectedBlockchain
+                    if (override_crypto_address) {
+                      checkoutBody.attributes.crypto_address = usedAddress
+                      checkoutBody.attributes.crypto_signature = signature
+                    } else {
+                      checkoutBody.attributes.crypto_confirmation_signature = signature
+                    }
+                  }
 
                   if (isWindowDefined) {
                     addAddOnsInAttributes(checkoutBody)
@@ -595,11 +767,21 @@ export const BillingInfoContainer = React.memo(
                 const bodyFormData = createRegisterFormData(
                   values,
                   checkoutBodyForRegistration,
-                  flagFreeTicket
+                  flagFreeTicket,
+                  cryptoData
                 )
                 try {
                   setLoading(true)
+                  if (isCryptoEvent) {
+                    const { signature, address } = await getSignatureNewAccount(selectedBlockchain)
+                    bodyFormData.append('blockchain', selectedBlockchain)
+                    bodyFormData.append('crypto_address', address)
+                    bodyFormData.append('crypto_signature', signature)
+                  }
                   const resRegister = await register(bodyFormData)
+                  const form = new FormData()
+                  form.append('blockchain', selectedBlockchain)
+                  await onConfirmConnectMetamask(form)
                   const xtfCookie = _get(resRegister, 'headers.x-tf-ecommerce')
                   const accessToken = _get(
                     resRegister,
@@ -662,12 +844,20 @@ export const BillingInfoContainer = React.memo(
                   )
                 }
 
-                const checkoutBody = collectCheckoutBody(values, profileDataObj)
+                const checkoutBody: any = collectCheckoutBody(values, profileDataObj)
 
                 if (isWindowDefined) {
                   addAddOnsInAttributes(checkoutBody)
                 }
 
+                if (isCryptoEvent) {
+                  const res = await getCart()
+                  const cartInfo = _get(res, 'data.data.attributes')
+                  const { signature } = await getSignatureConfirmation(cartInfo?.ethNonce)
+                  checkoutBody.attributes.blockchain = selectedBlockchain
+                    checkoutBody.attributes.crypto_confirmation_signature = signature
+                }
+
                 const res = await postOnCheckout(
                   checkoutBody,
                   undefined,
@@ -770,6 +960,76 @@ export const BillingInfoContainer = React.memo(
                       </div>
                     </div>
                   )}
+                  {
+                    (
+                      isCryptoEvent &&
+                      isLoggedIn &&
+                      !walletConnectedInSession &&
+                      !walletConnectedToTTFAccount
+                    ) ? (
+                        <div className="crypto-actions-block">
+                          <div className="action-item">
+                            <div>
+                              Connect your wallet and skip setting up a password and log in with your wallet next time
+                            </div>
+                          </div>
+                          {_map(detectedWallets, wallet => (
+                              <div className="action-item login-block" key={wallet}>
+                                <button
+                                  className="login-register-button"
+                                  type="button"
+                                  onClick={() => {
+                                    if (isLoggedIn) {
+                                      connectWalletLoggedIn(wallet)
+                                    } else {
+                                      connectWallet(wallet)
+                                    }
+                                  }}>
+                                  Connect with {getWalletName(wallet)}
+                                </button>
+                              </div>
+                            ))}
+                        </div>
+                      )
+                      : null
+                  }
+                  {
+                    walletConnected && (
+                      <div className="action-item">
+                        <div>
+                          Wallet connected.
+                        </div>
+                      </div>
+                    )
+                  }
+                  {
+                    isCryptoEvent && isLoggedIn && walletConnectedInSession && !walletConnectedToTTFAccount
+                      ? (
+                        <div className='warning-connect-wallet'>
+                          <div className='text-connect-wallet'>
+                            You are logged into an existing TICKETFAIRY account that does not have a
+                            wallet connected. Connect this wallet to your account? This will become your primary login wallet
+                          </div>
+                          <button
+                            className="connect-wallet-button"
+                            type="button"
+                            onClick={() => {
+                              connectWalletLoggedIn(selectedBlockchain)
+                            }}
+                          >
+                            Confirm wallet
+                          </button>
+                          <button
+                            className="unconnect-wallet-button"
+                            type="button"
+                            onClick={unconnectWalletLoggedIn}
+                          >
+                            Change wallet
+                          </button>
+                        </div>
+                      )
+                      : null
+                  }
                   {_map(dataWithUniqueIds, item => {
                     const { label, labelClassName, fields } = item
                     return (
@@ -833,7 +1093,7 @@ export const BillingInfoContainer = React.memo(
                                       'confirmPassword',
                                       'password-info',
                                     ].includes(element.name) &&
-                                    isLoggedIn ? null : [
+                                    (isLoggedIn || (walletConnectedToTTFAccount || walletConnectedInSession)) ? null : [
                                         'data_capture[wallet_address]',
                                       ].includes(element.name) &&
                                       hideWalletAddressField ? null : (

package/src/components/billing-info-container/style.css

@@ -33,7 +33,7 @@ button {
   margin-top: 10px;
 }
 
-.account-actions-block {
+.account-actions-block, .crypto-actions-block {
   margin-top: 10px;
   color: #182026;
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,