@palta-brain/web-sdk
Version:
93 lines • 4.91 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.BrainTreeCheckoutForm = void 0;
var react_1 = __importDefault(require("react"));
var ApplePayButton_1 = __importDefault(require("./ApplePayButton"));
var BrainTreeCheckoutForm = function (props) {
var onClick = function () {
props.refreshOnClick();
};
return (react_1.default.createElement("div", { id: "braintree-checkout-container", style: { display: 'none' } },
react_1.default.createElement("p", { className: "lead", style: {
fontFamily: 'Arial',
textAlign: 'center',
fontSize: '1.25rem',
fontWeight: '300',
color: '#212529',
} }, "Braintree"),
react_1.default.createElement("div", { id: "paypal-button", style: { display: 'none' } }),
react_1.default.createElement("div", { id: "card-container", style: { display: 'none' } },
react_1.default.createElement("div", { style: { marginBottom: '1rem' } },
react_1.default.createElement("div", { style: { marginBottom: '7px' } }, "Card Number"),
react_1.default.createElement("div", { style: {
height: '30px',
padding: '0.375rem 0.75rem',
fontSize: '1rem',
fontWeight: '400',
lineHeight: '1.5',
border: '1px solid #dee2e6',
borderRadius: '5px',
transition: 'border-color .15s ease-in-out,box-shadow .15s ease-in-out',
}, id: "card-number" })),
react_1.default.createElement("div", { style: { marginBottom: '1rem' } },
react_1.default.createElement("div", { style: { marginBottom: '7px' } }, "Expiration Date"),
react_1.default.createElement("div", { style: {
height: '30px',
padding: '0.375rem 0.75rem',
fontSize: '1rem',
fontWeight: '400',
lineHeight: '1.5',
border: '1px solid #dee2e6',
borderRadius: '5px',
transition: 'border-color .15s ease-in-out,box-shadow .15s ease-in-out',
}, id: "expiration-date" })),
react_1.default.createElement("div", { style: { marginBottom: '1rem' } },
react_1.default.createElement("div", { style: { marginBottom: '7px' } }, "CVV"),
react_1.default.createElement("div", { style: {
height: '30px',
padding: '0.375rem 0.75rem',
fontSize: '1rem',
fontWeight: '400',
lineHeight: '1.5',
border: '1px solid #dee2e6',
borderRadius: '5px',
transition: 'border-color .15s ease-in-out,box-shadow .15s ease-in-out',
}, id: "cvv" })),
window.ApplePaySession &&
window.ApplePaySession.supportsVersion(3) &&
window.ApplePaySession.canMakePayments() && react_1.default.createElement(ApplePayButton_1.default, null),
react_1.default.createElement("button", { id: "card-button", type: "submit", style: {
cursor: 'pointer',
width: '100%',
height: '50px',
padding: '0px 12px',
border: 'none',
textAlign: 'center',
transition: 'opacity 300ms ' +
'cubic-bezier(0.4, 0, 0.2, 1) 0s, ' +
'box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0s, background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0s',
color: 'white',
fontSize: '1.1rem',
background: 'rgb(36, 42, 47)',
borderRadius: '5px',
boxShadow: 'none',
fontFamily: 'serif',
marginBottom: '15px',
} }, "Pay with Card")),
react_1.default.createElement("button", { style: {
backgroundColor: '#007bff',
color: 'white',
padding: '10px 20px',
marginTop: '10px',
border: 'none',
borderRadius: '5px',
cursor: 'default',
marginLeft: '10px',
display: 'none',
}, id: "refresh", onClick: onClick }, "Refresh")));
};
exports.BrainTreeCheckoutForm = BrainTreeCheckoutForm;
//# sourceMappingURL=BrainTreeCheckoutForm.js.map