tf-checkout-react 1.0.65 → 1.0.69

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/dist/api/index.d.ts +1 -0
  2. package/dist/components/common/FormikPhoneNumberField.d.ts +11 -0
  3. package/dist/components/confirmationContainer/config.d.ts +1 -0
  4. package/dist/components/confirmationContainer/index.d.ts +5 -11
  5. package/dist/components/confirmationContainer/social-buttons.d.ts +11 -0
  6. package/dist/components/loginModal/index.d.ts +1 -0
  7. package/dist/components/waitingList/index.d.ts +2 -1
  8. package/dist/index.d.ts +1 -0
  9. package/dist/normalizers/index.d.ts +1 -0
  10. package/dist/tf-checkout-react.cjs.development.js +449 -224
  11. package/dist/tf-checkout-react.cjs.development.js.map +1 -1
  12. package/dist/tf-checkout-react.cjs.production.min.js +1 -1
  13. package/dist/tf-checkout-react.cjs.production.min.js.map +1 -1
  14. package/dist/tf-checkout-react.esm.js +451 -227
  15. package/dist/tf-checkout-react.esm.js.map +1 -1
  16. package/dist/tf-checkout-styles.css +1 -1
  17. package/dist/types/referral-promotion.d.ts +1 -1
  18. package/dist/utils/index.d.ts +3 -0
  19. package/dist/utils/setConfigs.d.ts +10 -0
  20. package/package.json +9 -4
  21. package/src/api/index.ts +59 -36
  22. package/src/components/billing-info-container/index.tsx +8 -11
  23. package/src/components/billing-info-container/utils.ts +3 -3
  24. package/src/components/common/FormikPhoneNumberField.tsx +41 -0
  25. package/src/components/confirmationContainer/config.ts +72 -0
  26. package/src/components/confirmationContainer/index.tsx +107 -138
  27. package/src/components/confirmationContainer/social-buttons.tsx +91 -0
  28. package/src/components/confirmationContainer/style.css +87 -100
  29. package/src/components/loginModal/index.tsx +11 -4
  30. package/src/components/paymentContainer/index.tsx +3 -4
  31. package/src/components/registerModal/index.tsx +3 -3
  32. package/src/components/stripePayment/index.tsx +4 -4
  33. package/src/components/ticketsContainer/index.tsx +1 -3
  34. package/src/components/waitingList/index.tsx +6 -5
  35. package/src/env.ts +3 -3
  36. package/src/index.ts +1 -0
  37. package/src/normalizers/index.ts +3 -1
  38. package/src/types/referral-promotion.ts +1 -1
  39. package/src/utils/index.ts +3 -0
  40. package/src/utils/setConfigs.ts +21 -0
@@ -1 +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}.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}.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}.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}.register-container{margin:0 auto;max-width:800px}.register-container .is-half{width:49%}.register-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.register-container__singleField{margin-top:15px}button{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 .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 -10px}.confirmation-page .referral_text_image_section .referral_text_section{margin:10px}.confirmation-page .referral_text_image_section .referral_title_text{color:#f08057;font-size:28px;padding-bottom:10px}.confirmation-page .referral_text_image_section .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 .share_wrapper .invitation_title{font-size:22px;padding-bottom:12px;padding-top:12px}.confirmation-page .share_wrapper .share_section{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 -10px}.confirmation-page .share_wrapper .share_section .invitation_section{flex:1 1;padding:0 5px}.confirmation-page .share_wrapper .share_section .invitation_section .share_buttons{display:grid;flex-wrap:wrap;margin:0 -7px}.confirmation-page .share_wrapper .share_section .invitation_section .share_buttons .social-media-btns{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.confirmation-page .share_wrapper .share_section .invitation_section .share_buttons .social-media-btns .sharing-btn{min-width:130px}.confirmation-page .share_wrapper .share_section .invitation_section .share-btn-inner.share-by-link-copy{padding:0;text-align:left}.confirmation-page .share_wrapper .share_section .invitation_section .sharing-button{flex:1 1}.confirmation-page .share_wrapper .share_section .invitation_section .convenient_buttons.sharing-btn{display:inline}.confirmation-page .share_wrapper .share_section .invitation_section .share-by-link{background:#000;color:#fff;padding:0}.confirmation-page .share_wrapper .share_section .invitation_section .share-by-link.label{margin:0;padding:0;text-align:left}.confirmation-page .share_wrapper .share_section .invitation_section .sharing-btn{flex:1 1;padding:7px;text-align:center}.confirmation-page .share_wrapper .share_section .invitation_section .share-btn-inner{background:#000;color:#fff;padding:10px}.confirmation-page .share_wrapper .share_section .invitation_section .share-btn-inner .svg_wrapper{display:inline}.confirmation-page .share_wrapper .share_section .invitation_section .share-btn-inner .share-input{background-color:#fff;text-align:left;width:300px}.confirmation-page .share_wrapper .share_section .invitation_section .share-text{display:block;font-size:13px;font-weight:600;padding-top:8px;width:100%}.confirmation-page .share_wrapper .pricing-section_wrapper{background:#e3e3e3;border:1px solid #dcdcdc;display:grid;grid-template-columns:1fr 1fr;margin:10px 0;padding:15px}.confirmation-page .share_wrapper .pricing-section_wrapper.free_price{background:#e9835b;border:1px solid #eb7b4a;color:#fff}.confirmation-page .share_wrapper .pricing-section_label{font-weight:600}.confirmation-page .share_wrapper .pricing-section_sublabel{font-size:14px;font-weight:100}.confirmation-page .share_wrapper .pricing-section_price{font-weight:600;text-align:right}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;font-weight:700;line-height:1;text-align:center}.event-detail__tier-price p{margin:0}.event-detail__tier-price .fees{font-size:14px;font-weight:400;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{background-color:#d9edf7;border:1px solid #bce8f1;border-radius:4px;color:#3a87ad;font-size:1em;margin:0 35px;padding:8px 15px;text-align:center;text-shadow:0 1px 0 hsla(0,0%,100%,.5)}.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}.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}.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 h3{margin:10px 0}.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}.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%}.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 .download-button{background-color:#212529;border:1px solid #fff;border-radius:0;color:#fff;cursor:pointer;display:block;font-family:Bebas Neue;font-size:16px;font-weight:400;line-height:normal;margin-bottom:20px;margin-top:20px;min-height:auto;outline:none;overflow:hidden;padding:12px 0;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:uppercase;width:100%}.order-details .download-button:hover{background-color:#505050}.order-details .personal-link{padding:20px 0}
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}.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}.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}.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}.register-container{margin:0 auto;max-width:800px}.register-container .is-half{width:49%}.register-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.register-container__singleField{margin-top:15px}button{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;font-weight:700;line-height:1;text-align:center}.event-detail__tier-price p{margin:0}.event-detail__tier-price .fees{font-size:14px;font-weight:400;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{background-color:#d9edf7;border:1px solid #bce8f1;border-radius:4px;color:#3a87ad;font-size:1em;margin:0 35px;padding:8px 15px;text-align:center;text-shadow:0 1px 0 hsla(0,0%,100%,.5)}.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}.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}.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 h3{margin:10px 0}.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}.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%}.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 .download-button{background-color:#212529;border:1px solid #fff;border-radius:0;color:#fff;cursor:pointer;display:block;font-family:Bebas Neue;font-size:16px;font-weight:400;line-height:normal;margin-bottom:20px;margin-top:20px;min-height:auto;outline:none;overflow:hidden;padding:12px 0;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:uppercase;width:100%}.order-details .download-button:hover{background-color:#505050}.order-details .personal-link{padding:20px 0}
@@ -1,6 +1,6 @@
1
1
  export interface IReferralPromotion {
2
2
  label: string;
3
3
  price: string;
4
- id: number | string;
4
+ id?: number | string;
5
5
  subLabel?: string;
6
6
  }
@@ -0,0 +1,3 @@
1
+ export { setConfigs, CONFIGS } from './setConfigs';
2
+ export { getQueryVariable } from './getQueryVariable';
3
+ export { ErrorFocus } from './formikErrorFocus';
@@ -0,0 +1,10 @@
1
+ interface IConfigs {
2
+ BASE_URL: string;
3
+ CLIENT_ID: string;
4
+ CLIENT_SECRET: string;
5
+ STRIPE_PUBLISHABLE_KEY: string;
6
+ [key: string]: string;
7
+ }
8
+ export declare const CONFIGS: IConfigs;
9
+ export declare const setConfigs: (configs: IConfigs) => void;
10
+ export {};
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.65",
2
+ "version": "1.0.69",
3
3
  "license": "MIT",
4
4
  "main": "dist/index.js",
5
5
  "typings": "dist/index.d.ts",
@@ -63,19 +63,24 @@
63
63
  "typescript": "^4.4.4"
64
64
  },
65
65
  "dependencies": {
66
- "@emotion/react": "^11.5.0",
67
- "@emotion/styled": "^11.3.0",
66
+ "@emotion/react": "^11.7.0",
67
+ "@emotion/styled": "^11.6.0",
68
68
  "@mui/lab": "^5.0.0-alpha.55",
69
69
  "@mui/material": "^5.2.2",
70
+ "@mui/styles": "^5.2.2",
70
71
  "@stripe/react-stripe-js": "^1.6.0",
71
72
  "@stripe/stripe-js": "^1.21.1",
72
73
  "axios": "^0.24.0",
74
+ "clsx": "^1.1.1",
73
75
  "formik": "^2.2.9",
74
76
  "jwt-decode": "^3.1.2",
75
77
  "lodash": "^4.17.21",
76
78
  "lodash-es": "^4.17.21",
79
+ "material-ui-phone-number": "^3.0.0",
77
80
  "nanoid": "^3.1.30",
81
+ "prop-types": "^15.7.2",
78
82
  "react-bootstrap": "^2.0.2",
79
- "react-inlinesvg": "^2.3.0"
83
+ "react-inlinesvg": "^2.3.0",
84
+ "react-share": "^4.4.0"
80
85
  }
81
86
  }
package/src/api/index.ts CHANGED
@@ -1,9 +1,17 @@
1
1
  import axios, { AxiosInstance, AxiosRequestConfig } from 'axios'
2
2
  import _get from 'lodash/get'
3
3
 
4
- import { ENV } from '../env'
4
+ import { CONFIGS } from '../utils'
5
5
 
6
6
  const isWindowDefined = typeof window !== 'undefined'
7
+ const allowedOrigins = [
8
+ 'http://localhost',
9
+ 'gtsb.io',
10
+ 'gatsbyjs.io',
11
+ 'https://www.houseofx.nyc',
12
+ 'https://tickets-staging.houseofx.nyc',
13
+ ]
14
+ const origin = isWindowDefined && window.location.origin
7
15
 
8
16
  const ttfHeaders: { [key: string]: any } = {
9
17
  Accept: 'application/vnd.api+json',
@@ -13,12 +21,9 @@ const ttfHeaders: { [key: string]: any } = {
13
21
  if (isWindowDefined && localStorage.getItem('auth_guest_token')) {
14
22
  ttfHeaders['Authorization-Guest'] = localStorage.getItem('auth_guest_token')
15
23
  }
16
-
17
24
  if (
18
25
  isWindowDefined &&
19
- window.location.origin !== 'https://www.houseofx.nyc' &&
20
- window.location.origin !== 'https://tickets-staging.houseofx.nyc' &&
21
- !window.location.origin.includes('http://localhost')
26
+ !allowedOrigins.some(el => origin && origin.includes(el))
22
27
  ) {
23
28
  ttfHeaders['X-Source-Origin'] = 'houseofx.nyc'
24
29
  }
@@ -26,23 +31,27 @@ if (
26
31
  interface IPublicRequest extends AxiosInstance {
27
32
  setGuestToken: (token: string) => void;
28
33
  setAccessToken: (token: string) => void;
34
+ setBaseUrl: (baseUrl: string) => void;
29
35
  }
30
36
 
31
37
  export const publicRequest: IPublicRequest = axios.create({
32
- baseURL: ENV.BASE_URL || `https://www.ticketfairy.com/api`,
38
+ baseURL: CONFIGS.BASE_URL || `https://www.ticketfairy.com/api`,
33
39
  headers: ttfHeaders,
34
40
  }) as IPublicRequest
35
41
 
36
- publicRequest.interceptors.response.use(response => response, error => {
37
- if (error?.response?.status === 401) {
38
- if(isWindowDefined){
39
- window.localStorage.removeItem('auth_guest_token')
40
- window.localStorage.removeItem('user_data')
41
- window.localStorage.removeItem('access_token')
42
+ publicRequest.interceptors.response.use(
43
+ response => response,
44
+ error => {
45
+ if (error?.response?.status === 401) {
46
+ if (isWindowDefined) {
47
+ window.localStorage.removeItem('auth_guest_token')
48
+ window.localStorage.removeItem('user_data')
49
+ window.localStorage.removeItem('access_token')
50
+ }
42
51
  }
52
+ return Promise.reject(error)
43
53
  }
44
- return Promise.reject(error)
45
- })
54
+ )
46
55
 
47
56
  publicRequest.interceptors.request.use((config: AxiosRequestConfig) => {
48
57
  const guestToken = isWindowDefined
@@ -74,9 +83,7 @@ publicRequest.interceptors.request.use((config: AxiosRequestConfig) => {
74
83
 
75
84
  if (
76
85
  isWindowDefined &&
77
- window.location.origin !== 'https://www.houseofx.nyc' &&
78
- window.location.origin !== 'https://tickets-staging.houseofx.nyc' &&
79
- !window.location.origin.includes('http://localhost')
86
+ !allowedOrigins.some(el => origin && origin.includes(el))
80
87
  ) {
81
88
  const updatedHeaders = {
82
89
  ...config.headers,
@@ -85,12 +92,19 @@ publicRequest.interceptors.request.use((config: AxiosRequestConfig) => {
85
92
  config.headers = updatedHeaders
86
93
  }
87
94
 
95
+ if (CONFIGS.BASE_URL) {
96
+ config.baseURL = CONFIGS.BASE_URL + '/api'
97
+ }
98
+
88
99
  return config
89
100
  })
90
101
 
91
102
  publicRequest.setGuestToken = token =>
92
103
  (publicRequest.defaults.headers.common['Authorization-Guest'] = token)
93
104
 
105
+ publicRequest.setBaseUrl = (baseUrl: string) =>
106
+ (publicRequest.defaults.baseURL = baseUrl + '/api')
107
+
94
108
  publicRequest.setAccessToken = token =>
95
109
  (publicRequest.defaults.headers.common.Authorization = token)
96
110
 
@@ -165,7 +179,7 @@ export const postOnCheckout = (data: any, accessToken: string) => {
165
179
 
166
180
  export const authorize = (data: FormData) =>
167
181
  publicRequest.post(
168
- `/v1/oauth/authorize-rn?client_id=${ENV.CLIENT_ID ||
182
+ `/v1/oauth/authorize-rn?client_id=${CONFIGS.CLIENT_ID ||
169
183
  'e9d8f8922797b4621e562255afe90dbf'}`,
170
184
  data
171
185
  )
@@ -206,30 +220,39 @@ export const handlePaymentSuccess = (orderHash: string) => {
206
220
  }
207
221
 
208
222
  export const getProfileData = (accessToken: any) =>
209
- publicRequest.get('/customer/profile/', {
210
- headers: {
211
- ...ttfHeaders,
212
- Authorization: `Bearer ${accessToken}`,
213
- },
214
- }).catch((e:any)=>{
215
- if(isWindowDefined){
216
- const event = new window.CustomEvent('auth_error', e)
217
- window.document.dispatchEvent(event)
218
- }
219
- return e
220
- })
223
+ publicRequest
224
+ .get('/customer/profile/', {
225
+ headers: {
226
+ ...ttfHeaders,
227
+ Authorization: `Bearer ${accessToken}`,
228
+ },
229
+ })
230
+ .catch((e: any) => {
231
+ if (isWindowDefined) {
232
+ const event = new window.CustomEvent('auth_error', e)
233
+ window.document.dispatchEvent(event)
234
+ }
235
+ return e
236
+ })
221
237
 
222
238
  export const getCountries = () => publicRequest.get('/countries/')
223
239
 
224
- export const getConfirmationData = (orderHash: string) => publicRequest.get(`/v1/order/${orderHash}/payment/complete`)
240
+ export const getConfirmationData = (orderHash: string) =>
241
+ publicRequest.get(`/v1/order/${orderHash}/payment/complete`)
225
242
 
226
- export const getStates = (countryId: string) => publicRequest.get(`/countries/${countryId}/states/`)
243
+ export const getStates = (countryId: string) =>
244
+ publicRequest.get(`/countries/${countryId}/states/`)
227
245
 
228
246
  export const getOrders = (page: number, limit: number, eventSlug: string) =>
229
- publicRequest.get(`/v1/account/orders/?page=${page}&limit=${limit}&filter[event]=${eventSlug}`)
247
+ publicRequest.get(
248
+ `/v1/account/orders/?page=${page}&limit=${limit}&filter[event]=${eventSlug}`
249
+ )
230
250
 
231
- export const getOrderDetails = (orderId: string) => publicRequest.get(`/v1/account/order/${orderId}`)
251
+ export const getOrderDetails = (orderId: string) =>
252
+ publicRequest.get(`/v1/account/order/${orderId}`)
232
253
 
233
- export const addToWaitingList = (id: number, data: any) => publicRequest.post(`/v1/event/${id}/add_to_waiting_list`, data)
254
+ export const addToWaitingList = (id: number, data: any) =>
255
+ publicRequest.post(`/v1/event/${id}/add_to_waiting_list`, data)
234
256
 
235
- export const getConditions = (eventId: string) => publicRequest.get(`v1/event/${eventId}/conditions`)
257
+ export const getConditions = (eventId: string) =>
258
+ publicRequest.get(`v1/event/${eventId}/conditions`)
@@ -45,6 +45,7 @@ import { nanoid } from 'nanoid'
45
45
  import { getQueryVariable } from '../../utils/getQueryVariable'
46
46
  import { SelectField } from '../common/SelectField'
47
47
  import { ErrorFocus } from '../../utils/formikErrorFocus'
48
+ import { FormikPhoneNumberField } from '../common/FormikPhoneNumberField'
48
49
  import { getImage } from '../../utils/getImage'
49
50
  import { ThemeProvider, createTheme } from '@mui/material/styles'
50
51
 
@@ -120,12 +121,12 @@ const LogicRunner: FC<{
120
121
  const fetchStates = async () => {
121
122
  try {
122
123
  const res = await getStates(values.country)
123
- const mappedStates = _map(_get(res, 'data.data'), item => ({
124
+ const mappedStates = _map(_get(res, 'data.data'), (item, key) => ({
124
125
  label: item,
125
- value: item,
126
+ value: key,
126
127
  }))
127
128
  setStates(mappedStates)
128
- setFieldValue('state', mappedStates[0]?.label ?? '')
129
+ setFieldValue('state', mappedStates[0]?.value ?? '')
129
130
  onGetStatesSuccess(res.data)
130
131
  } catch (e) {
131
132
  if (axios.isAxiosError(e)) {
@@ -365,7 +366,6 @@ export const BillingInfoContainer = ({
365
366
  dataWithUniqueIds,
366
367
  {
367
368
  ...initialValues,
368
- email: emailLogged,
369
369
  firstName: firstNameLogged,
370
370
  lastName: lastNameLogged,
371
371
  country: 1,
@@ -563,13 +563,6 @@ export const BillingInfoContainer = ({
563
563
  ].includes(element.name) &&
564
564
  isLoggedIn ? null : (
565
565
  <React.Fragment key={element.uniqueId}>
566
- {element.name === 'email' ? (
567
- <div className="email-checking">
568
- {`IMPORTANT: Please double check that your
569
- email address is correct. It's where we
570
- send your confirmation and e-tickets to!`}
571
- </div>
572
- ) : null}
573
566
  <div className={element.className}>
574
567
  {element.component ? (
575
568
  element.component
@@ -582,11 +575,15 @@ export const BillingInfoContainer = ({
582
575
  element,
583
576
  states
584
577
  )}
578
+ setFieldValue={props.setFieldValue}
579
+ onBlur={props.handleBlur}
585
580
  component={
586
581
  element.type === 'checkbox'
587
582
  ? CheckboxField
588
583
  : element.type === 'select'
589
584
  ? SelectField
585
+ : element.type === 'phone'
586
+ ? FormikPhoneNumberField
590
587
  : CustomField
591
588
  }
592
589
  selectOptions={
@@ -4,7 +4,7 @@ import _forEach from 'lodash/forEach'
4
4
  import _flatMapDeep from 'lodash/flatMapDeep'
5
5
  import _isArray from 'lodash/isArray'
6
6
 
7
- import { ENV } from '../../env'
7
+ import { CONFIGS } from '../../utils'
8
8
  import { IGroupItem } from '../../types'
9
9
  import { combineValidators, requiredValidator } from '../../validators'
10
10
  import { nanoid } from 'nanoid'
@@ -56,11 +56,11 @@ export const createRegisterFormData = (
56
56
  bodyFormData.append('password_confirmation', values.confirmPassword)
57
57
  bodyFormData.append(
58
58
  'client_id',
59
- ENV.CLIENT_ID || 'e9d8f8922797b4621e562255afe90dbf'
59
+ CONFIGS.CLIENT_ID || 'e9d8f8922797b4621e562255afe90dbf'
60
60
  )
61
61
  bodyFormData.append(
62
62
  'client_secret',
63
- ENV.CLIENT_SECRET || 'b89c191eff22fdcf84ac9bfd88d005355a151ec2c83b26b9'
63
+ CONFIGS.CLIENT_SECRET || 'b89c191eff22fdcf84ac9bfd88d005355a151ec2c83b26b9'
64
64
  )
65
65
 
66
66
  _forEach(checkoutBody.attributes, (item: any, key: string) => {
@@ -0,0 +1,41 @@
1
+ import React from 'react'
2
+ import { FieldInputProps } from 'formik'
3
+ import MuiPhoneNumber from 'material-ui-phone-number'
4
+ import _get from 'lodash/get'
5
+ import { removePlusSign } from '../../normalizers'
6
+
7
+ export interface INumberInField {
8
+ label: string | number | JSX.Element;
9
+ field: FieldInputProps<any>;
10
+ }
11
+
12
+ interface IOtherProps {
13
+ [key: string]: any;
14
+ }
15
+
16
+ export const FormikPhoneNumberField = ({
17
+ label,
18
+ field,
19
+ form: { touched, errors },
20
+ setFieldValue,
21
+ ...rest
22
+ }: INumberInField & IOtherProps) => {
23
+ const error = _get(errors, field.name)
24
+ const isTouched = Boolean(_get(touched, field.name))
25
+
26
+ return (
27
+ <MuiPhoneNumber
28
+ name='phone'
29
+ onChange={(e: any) => setFieldValue("phone", removePlusSign(e))}
30
+ variant="outlined"
31
+ defaultCountry='us'
32
+ disableDropdown={true}
33
+ label={label}
34
+ error={!!error && isTouched}
35
+ helperText={isTouched && error}
36
+ fullWidth
37
+ autoFormat={false}
38
+ {...rest}
39
+ />
40
+ )
41
+ }
@@ -0,0 +1,72 @@
1
+ import {
2
+ FacebookShareButton,
3
+ FacebookMessengerShareButton,
4
+ TwitterShareButton,
5
+ LinkedinShareButton,
6
+ PinterestShareButton,
7
+ VKShareButton,
8
+ OKShareButton,
9
+ TelegramShareButton,
10
+ WhatsappShareButton,
11
+ RedditShareButton,
12
+ TumblrShareButton,
13
+ MailruShareButton,
14
+ EmailShareButton,
15
+ LivejournalShareButton,
16
+ ViberShareButton,
17
+ WorkplaceShareButton,
18
+ LineShareButton,
19
+ PocketShareButton,
20
+ InstapaperShareButton,
21
+ WeiboShareButton,
22
+ HatenaShareButton,
23
+ FacebookIcon,
24
+ FacebookMessengerIcon,
25
+ TwitterIcon,
26
+ LinkedinIcon,
27
+ PinterestIcon,
28
+ VKIcon,
29
+ OKIcon,
30
+ TelegramIcon,
31
+ WhatsappIcon,
32
+ RedditIcon,
33
+ TumblrIcon,
34
+ MailruIcon,
35
+ EmailIcon,
36
+ LivejournalIcon,
37
+ ViberIcon,
38
+ WorkplaceIcon,
39
+ LineIcon,
40
+ PocketIcon,
41
+ InstapaperIcon,
42
+ WeiboIcon,
43
+ HatenaIcon,
44
+ } from 'react-share'
45
+
46
+ const config: any = {
47
+ facebook: { component: FacebookShareButton, icon: FacebookIcon },
48
+ messenger: { component: FacebookMessengerShareButton, icon: FacebookMessengerIcon },
49
+ twitter: { component: TwitterShareButton, icon: TwitterIcon },
50
+ linkedin: { component: LinkedinShareButton, icon: LinkedinIcon },
51
+ pinterest: { component: PinterestShareButton, icon: PinterestIcon },
52
+ vk: { component: VKShareButton, icon: VKIcon },
53
+ ok: { component: OKShareButton, icon: OKIcon },
54
+ telegram: { component: TelegramShareButton, icon: TelegramIcon },
55
+ whatsapp: { component: WhatsappShareButton, icon: WhatsappIcon },
56
+ reddit: { component: RedditShareButton, icon: RedditIcon },
57
+ tumblr: { component: TumblrShareButton, icon: TumblrIcon },
58
+ mailru: { component: MailruShareButton, icon: MailruIcon },
59
+ email: { component: EmailShareButton, icon: EmailIcon },
60
+ livejournal: { component: LivejournalShareButton, icon: LivejournalIcon },
61
+ viber: { component: ViberShareButton, icon: ViberIcon },
62
+ workplace: { component: WorkplaceShareButton, icon: WorkplaceIcon },
63
+ line: { component: LineShareButton, icon: LineIcon },
64
+ pocket: { component: PocketShareButton, icon: PocketIcon },
65
+ instapaper: { component: InstapaperShareButton, icon: InstapaperIcon },
66
+ weibo: { component: WeiboShareButton, icon: WeiboIcon },
67
+ hatena: { component: HatenaShareButton, icon: HatenaIcon },
68
+ }
69
+
70
+ export default function (key: string) {
71
+ return config[key]
72
+ }