@navinc/base-react-components
Version:
Nav's Pattern Library
188 lines • 27.1 kB
JavaScript
"use strict";
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MiniSBAPaycheckProtectionProgramForm = exports.StyledTwoColumn = exports.StyledSubHeader = exports.StyledHeader = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const prop_types_1 = __importDefault(require("prop-types"));
const formik_1 = require("formik");
const vanilla_masker_1 = require("vanilla-masker");
const utils_1 = require("@navinc/utils");
const styled_components_1 = __importDefault(require("styled-components"));
const input_js_1 = __importDefault(require("./input.js"));
const select_js_1 = __importDefault(require("./select.js"));
const header_js_1 = __importDefault(require("./header.js"));
const copy_1 = __importDefault(require("./copy"));
const text_1 = __importDefault(require("./text"));
const us_states_and_territories_js_1 = __importDefault(require("./data/us-states-and-territories.js"));
const sba_form_js_1 = require("./sba-form.js");
exports.StyledHeader = (0, styled_components_1.default)(header_js_1.default) `
margin-bottom: 8px;
`;
exports.StyledSubHeader = (0, styled_components_1.default)(copy_1.default) `
margin-bottom: 16px;
`;
const GridRow = styled_components_1.default.div `
display: grid;
grid-template-columns: 1fr;
grid-gap: 16px;
`;
const HeaderSection = styled_components_1.default.div `
text-align: center;
padding-bottom: 8px;
`;
const CopySection = styled_components_1.default.div `
display: grid;
grid-gap: 16px;
`;
const BulletSection = styled_components_1.default.div `
display: grid;
grid-gap: 8px;
grid-template-columns: 32px 1fr;
padding-top: 8px;
`;
const FlexDiv = styled_components_1.default.div `
display: flex;
> * {
padding-left: 8px;
padding-bottom: 8px;
}
`;
const StyledDiv = styled_components_1.default.div `
padding-bottom: 8px;
`;
exports.StyledTwoColumn = styled_components_1.default.div `
display: flex;
flex-wrap: wrap;
justify-content: space-between;
${StyledDiv} {
width: 100%;
padding-bottom: 8px;
}
@media (${({ theme }) => theme.forLargerThanPhone}) {
${StyledDiv} {
width: 48%;
}
}
`;
const StyledInput = (0, styled_components_1.default)(input_js_1.default) `
display: hidden;
`;
const BlueBorderDiv = styled_components_1.default.div `
border: 1px solid ${({ theme }) => theme.navBlue};
border-radius: 20px;
padding: 20px;
width: 85%;
margin: 10px auto;
`;
const HeaderSectionTC = styled_components_1.default.div `
text-align: center;
`;
const StyledCopy = (0, styled_components_1.default)(copy_1.default) `
padding-bottom: 8px;
`;
// TODO: Remove once @navinc/utils properly exports validator from password-validator.js
const minLength = (minLength = 1) => ({ length = 0 } = '') => length >= minLength;
const hasUpperCase = (password = '') => /[A-Z]/.test(password);
const hasLowerCase = (password = '') => /[a-z]/.test(password);
const hasDigit = (password = '') => /[0-9]/.test(password);
const defaultRequirements = [
{ test: minLength(8), message: 'Use at least 8 characters' },
{ test: hasUpperCase, message: 'Use at least 1 uppercase character' },
{ test: hasLowerCase, message: 'Use at least 1 lowercase character' },
{ test: hasDigit, message: 'Use at least 1 digit' },
];
const validator = (requirements = defaultRequirements) => (value) => requirements.filter(({ test }) => !test(value)).map(({ message }) => message);
const passwordValidator = validator();
const entriesPolyFill = (obj) => Object.keys(obj).map((key) => [key, obj[key]]);
const usStates = entriesPolyFill(us_states_and_territories_js_1.default).map(([label, value]) => ({ label, value }));
const MiniSBAPaycheckProtectionProgramForm = ({ initialValues = {}, isSubmittingForm = false, onFormSubmit = () => { }, dispatchOpenInfoDrawer = () => { }, shouldShowPasswordField = false, headerHelperText = '', primaryContactNameValue = '', emailAddressValue = '', contactPhoneValue = '', businessLegalNameValue = '', addressValue = '', cityValue = '', stateValue = '', zipCodeValue = '', dbaValue = '', businessTypeValue = '', termsOfServiceBool = false, secondDraw = '', shouldShowHasReceivedSecondPPPDraw = false, termsHref = '', shouldShowDocumentation = false, privatePolicy = '', isClover = false, referrerID = '', }) => {
const hiddenValue = isClover ? 'Clover' : referrerID;
// const { callback: debouncedSetCachedValues = () => {} } = useDebouncedCallback(setCachedValues, 750)
const handleSubmit = (_a = {}) => {
var { emailAddress, password } = _a, rest = __rest(_a, ["emailAddress", "password"]);
const cleanedValues = Object.assign({ version: 4, // Increment the version each time the shape of data changes
emailAddress }, rest);
const loginInfo = shouldShowPasswordField && { emailAddress, password };
onFormSubmit(cleanedValues, loginInfo);
};
return ((0, jsx_runtime_1.jsx)(formik_1.Formik, Object.assign({ enableReinitialize: true, initialValues: Object.assign({ primaryContact: primaryContactNameValue || '', emailAddress: emailAddressValue || '', primaryContactPhone: contactPhoneValue || '', businessLegalName: businessLegalNameValue || '', secondDraw: secondDraw || '', address: addressValue || '', city: cityValue || '', state: stateValue || '', zipCode: zipCodeValue || '', dba: dbaValue || '', businessType: businessTypeValue || '', password: '', termsOfService: termsOfServiceBool, partnerField: hiddenValue }, initialValues), onSubmit: handleSubmit, validate: (_a) => {
// debouncedSetCachedValues(restOfValues) // Update the cache as things change
var { password } = _a, restOfValues = __rest(_a, ["password"]);
const { primaryContact, emailAddress, primaryContactPhone, businessLegalName, address, city, state, zipCode, businessType, termsOfService, secondDraw, } = restOfValues;
const PHONE_REGEX = /^\d{3}-\d{3}-\d{4}$/;
const REQUIRED_MESSAGE = 'Required';
const PHONE_MESSAGE = 'Phone number is invalid';
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (!primaryContact && {
primaryContact: [REQUIRED_MESSAGE],
})), (primaryContact.length > 121 && {
primaryContact: ['Primary Contact must be 121 characters or less'],
})), (!emailAddress.match(
// eslint-disable-next-line no-control-regex
/(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9]))\.){3}(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9])|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/) && {
emailAddress: ['Enter a valid email'],
})), (!primaryContactPhone.match(PHONE_REGEX) && {
primaryContactPhone: [PHONE_MESSAGE],
})), (primaryContactPhone &&
primaryContactPhone === 'xxx-xxx-xxxx' && {
primaryContactPhone: [REQUIRED_MESSAGE],
})), (!businessLegalName && { businessLegalName: [REQUIRED_MESSAGE] })), (businessLegalName.length > 255 && {
businessLegalName: ['Business Name must be 255 characters or less'],
})), (!address && { address: [REQUIRED_MESSAGE] })), (!city && { city: [REQUIRED_MESSAGE] })), (!state && { state: [REQUIRED_MESSAGE] })), (!zipCode.match(/^\d{5}$/) && {
zipCode: ['We need your 5-digit ZIP Code'],
})), (!businessType && { businessType: [REQUIRED_MESSAGE] })), (shouldShowHasReceivedSecondPPPDraw && !secondDraw && { secondDraw: [REQUIRED_MESSAGE] })), (!termsOfService && { termsOfService: [REQUIRED_MESSAGE] })), (shouldShowPasswordField &&
passwordValidator(password).length && {
password: passwordValidator(password),
}));
} }, { children: ({ values, isValid, errors, touched, handleChange, handleBlur, handleSubmit, submitCount }) => ((0, jsx_runtime_1.jsxs)(sba_form_js_1.StyledForm, Object.assign({ "data-testid": "paycheck-protection-program:form", onSubmit: handleSubmit }, { children: [(0, jsx_runtime_1.jsx)(exports.StyledHeader, Object.assign({ size: "xl" }, { children: "Paycheck Protection Program (PPP)" }), void 0), (0, jsx_runtime_1.jsx)(exports.StyledSubHeader, { children: headerHelperText ||
'Additional PPP funds will be made available in January 2021. Get started on your payment protection program (PPP) application today.' }, void 0), (0, jsx_runtime_1.jsxs)(sba_form_js_1.StyledStandardCard, { children: [(0, jsx_runtime_1.jsxs)(sba_form_js_1.CardHeader, Object.assign({ bold: true }, { children: ["Primary Contact Information", ' ', !isClover && ((0, jsx_runtime_1.jsx)(sba_form_js_1.StyledIcon, { "data-testid": "ppp-form:info-drawer:primary-contact", name: "actions/circle-faq", onClick: () => dispatchOpenInfoDrawer({
children: ((0, jsx_runtime_1.jsx)(sba_form_js_1.InfodrawerCopyWrapper, { children: (0, jsx_runtime_1.jsx)(copy_1.default, { children: "This person will be the primary contact for the application and will be emailed regarding this application." }, void 0) }, void 0)),
title: 'Primary contact information',
}) }, void 0))] }), void 0), (0, jsx_runtime_1.jsx)(StyledDiv, { children: (0, jsx_runtime_1.jsx)(input_js_1.default, { hasSpaceForErrors: true, name: "primaryContact", label: "Primary Contact Name", value: values.primaryContact, onBlur: handleBlur, onChange: handleChange, isInvalid: touched.primaryContact && !!(errors === null || errors === void 0 ? void 0 : errors.primaryContact), errors: touched.primaryContact && errors.primaryContact ? errors.primaryContact : undefined, "data-testid": "ppp-form:input:primary-contact" }, void 0) }, void 0), (0, jsx_runtime_1.jsxs)(StyledDiv, { children: [(0, jsx_runtime_1.jsx)(input_js_1.default, { hasSpaceForErrors: true, label: "Best Email Address", type: "email", name: "emailAddress", value: values.emailAddress, onBlur: handleBlur, onChange: handleChange, isInvalid: touched.emailAddress && !!(errors === null || errors === void 0 ? void 0 : errors.emailAddress), errors: touched.emailAddress && errors.emailAddress ? errors.emailAddress : undefined, "data-testid": "ppp-form:input:primary-email-address" }, void 0), (0, jsx_runtime_1.jsx)(FlexDiv, { children: (0, jsx_runtime_1.jsxs)(copy_1.default, Object.assign({ size: "xs", light: true, bold: true }, { children: ["Use the same email in your PPP loan application.", ' '] }), void 0) }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(StyledDiv, { children: [(0, jsx_runtime_1.jsx)(input_js_1.default, { hasSpaceForErrors: true, label: "Best Contact Phone Number", placeholder: "xxx-xxx-xxxx", name: "primaryContactPhone", value: values.primaryContactPhone && (0, vanilla_masker_1.toPattern)(values.primaryContactPhone, '999-999-9999'), onBlur: handleBlur, onChange: (event) => {
event.target.value = (0, vanilla_masker_1.toPattern)(event.target.value, '999-999-9999');
handleChange(event);
}, isInvalid: touched.primaryContactPhone && !!(errors === null || errors === void 0 ? void 0 : errors.primaryContactPhone), errors: touched.primaryContactPhone && errors.primaryContactPhone ? errors.primaryContactPhone : undefined, "data-testid": "ppp-form:input:primary-contact-phone" }, void 0), (0, jsx_runtime_1.jsx)(FlexDiv, { children: (0, jsx_runtime_1.jsxs)(copy_1.default, Object.assign({ size: "xs", light: true, bold: true }, { children: ["Please enter your contact phone number above.", ' '] }), void 0) }, void 0)] }, void 0), shouldShowHasReceivedSecondPPPDraw && ((0, jsx_runtime_1.jsxs)(GridRow, { children: [(0, jsx_runtime_1.jsx)(copy_1.default, Object.assign({ bold: true }, { children: "Have you previously received PPP funds?" }), void 0), (0, jsx_runtime_1.jsx)(select_js_1.default, { hasSpaceForErrors: true, isInvalid: touched.secondDraw && !!(errors === null || errors === void 0 ? void 0 : errors.secondDraw), label: "Please make a selection", name: "secondDraw", onBlur: handleBlur, onChange: handleChange, value: values.secondDraw, options: ['Yes', 'No'], errors: touched.secondDraw && !!(errors === null || errors === void 0 ? void 0 : errors.secondDraw) ? errors.secondDraw : undefined, "data-testid": "ppp-form:select:secondDraw" }, void 0)] }, void 0))] }, void 0), (0, jsx_runtime_1.jsxs)(sba_form_js_1.StyledStandardCard, { children: [(0, jsx_runtime_1.jsxs)(sba_form_js_1.CardHeader, Object.assign({ bold: true }, { children: ["Business Information", ' ', !isClover && ((0, jsx_runtime_1.jsx)(sba_form_js_1.StyledIcon, { "data-testid": "ppp-form:info-drawer:business-information", name: "actions/circle-faq", onClick: () => dispatchOpenInfoDrawer({
children: ((0, jsx_runtime_1.jsxs)(sba_form_js_1.InfodrawerCopyWrapper, Object.assign({ "data-testid": "ppp-form:info-drawer:dba" }, { children: [(0, jsx_runtime_1.jsx)(copy_1.default, { children: "Information about the business applying for funds through the Paycheck Protection Program." }, void 0), (0, jsx_runtime_1.jsxs)(copy_1.default, { children: [(0, jsx_runtime_1.jsx)(text_1.default, Object.assign({ "$bold": true }, { children: "Doing Business As (DBA):" }), void 0), " A company is said to be \"doing business as\" when the name under which they operate their business differs from its legal, registered name."] }, void 0), (0, jsx_runtime_1.jsxs)(copy_1.default, { children: [(0, jsx_runtime_1.jsx)(text_1.default, Object.assign({ "$bold": true }, { children: "Tradename:" }), void 0), " A trade name, trading name, or business name is a name used by companies that don't want to operate under their registered name."] }, void 0)] }), void 0)),
title: 'Business information',
}) }, void 0))] }), void 0), (0, jsx_runtime_1.jsx)(input_js_1.default, { hasSpaceForErrors: true, name: "businessLegalName", label: "Business Legal Name", type: "text", value: values.businessLegalName, onBlur: handleBlur, onChange: handleChange, isInvalid: touched.businessLegalName && !!(errors === null || errors === void 0 ? void 0 : errors.businessLegalName), errors: touched.businessLegalName && errors.businessLegalName ? errors.businessLegalName : undefined, "data-testid": "ppp-form:input:business-legal-name" }, void 0), (0, jsx_runtime_1.jsx)(input_js_1.default, { errors: touched.address && errors.address ? errors.address : undefined, hasSpaceForErrors: true, isInvalid: touched.address && !!(errors === null || errors === void 0 ? void 0 : errors.address), label: "Business Address", name: "address", onBlur: handleBlur, onChange: handleChange, value: values.address, "data-testid": "ppp-form:input:business-address" }, void 0), (0, jsx_runtime_1.jsx)(input_js_1.default, { errors: touched.city && (errors === null || errors === void 0 ? void 0 : errors.city) ? errors.city : undefined, hasSpaceForErrors: true, isInvalid: touched.city && !!(errors === null || errors === void 0 ? void 0 : errors.city), label: "City", masktype: "city", name: "city", onBlur: handleBlur, onChange: handleChange, value: values.city, "data-testid": "ppp-form:input:business-city" }, void 0), (0, jsx_runtime_1.jsxs)(sba_form_js_1.TwoColumn, { children: [(0, jsx_runtime_1.jsx)(select_js_1.default, { errors: touched.state && errors.state ? errors.state : undefined, hasSpaceForErrors: true, isInvalid: touched.state && !!(errors === null || errors === void 0 ? void 0 : errors.state), label: "State", name: "state", type: "text", onBlur: handleBlur, onChange: handleChange, options: usStates, value: values.state, "data-testid": "ppp-form:input:business-state" }, void 0), (0, jsx_runtime_1.jsx)(input_js_1.default, { errors: touched.zipCode && errors.zipCode ? errors.zipCode : undefined, hasSpaceForErrors: true, isInvalid: touched.zipCode && !!(errors === null || errors === void 0 ? void 0 : errors.zipCode), label: "ZIP Code", name: "zipCode", onBlur: handleBlur, onChange: handleChange, value: (0, vanilla_masker_1.toPattern)(values.zipCode, '99999-9999'), "data-testid": "ppp-form:input:business-zip" }, void 0)] }, void 0), (0, jsx_runtime_1.jsx)(select_js_1.default, { hasSpaceForErrors: true, isInvalid: touched.businessType && !!(errors === null || errors === void 0 ? void 0 : errors.businessType), label: "Entity Type", name: "businessType", onBlur: handleBlur, onChange: handleChange, value: values.businessType, options: [
'Sole Proprietor',
'Partnership',
'C-Corp',
'S-Corp',
'LLC',
'Independent Contractor',
'Eligible Self Employed',
'501(c)(3) Non-Profit',
'501(c)(19) Veterans Organization',
'Tribal business (sec. 31(b)(2)(C) of Small Business Act)',
'Other',
], errors: touched.businessType && !!(errors === null || errors === void 0 ? void 0 : errors.businessType) ? errors.businessType : undefined, "data-testid": "ppp-form:select:dba-businessType" }, void 0), (0, jsx_runtime_1.jsx)(StyledInput, { type: "hidden", name: "partnerField", value: values.partnerField }, void 0)] }, void 0), shouldShowDocumentation && ((0, jsx_runtime_1.jsxs)(sba_form_js_1.StyledStandardCard, { children: [(0, jsx_runtime_1.jsxs)(HeaderSection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ size: "lg" }, { children: "Documentation to have ready" }), void 0), (0, jsx_runtime_1.jsx)(copy_1.default, { children: "Use the following checklist to gather the documentation that you need to complete your PPP loan application. Having these ready will speed up the application process." }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(BulletSection, { children: [(0, jsx_runtime_1.jsx)("div", {}, void 0), (0, jsx_runtime_1.jsxs)(CopySection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ bold: true }, { children: "SBA Loan Number of First PPP loan (Applies only to second-draw PPP loan applicants)" }), void 0), (0, jsx_runtime_1.jsx)(StyledCopy, { children: "Be sure to accurately indicate whether you are applying for a first-draw or second-draw PPP loan. If you are applying for a second-draw PPP loan, you must provide the SBA loan number for the first PPP loan you obtained in 2020. SBA loan numbers (PLP) have eight numbers followed by a dash then two more numbers (i.e., XXXXXXXX-XX)." }, void 0)] }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(BulletSection, { children: [(0, jsx_runtime_1.jsx)("div", {}, void 0), (0, jsx_runtime_1.jsxs)(CopySection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ bold: true }, { children: "CARES Act Report - Only for those with payroll (Not self-employed)" }), void 0), (0, jsx_runtime_1.jsxs)(StyledCopy, { children: ["If you're using a payroll provider they should be able to provide you a CARES Act report. Having this ready allows your loan processing team to review your loan quicker.", ' '] }, void 0)] }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(BulletSection, { children: [(0, jsx_runtime_1.jsx)("div", {}, void 0), (0, jsx_runtime_1.jsxs)(CopySection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ size: "sm" }, { children: "Tax Documents for 2019 (or 2020 if using 2020 payroll)" }), void 0), (0, jsx_runtime_1.jsx)(StyledCopy, { children: "If you don\u2019t have a CARES Act report, you may upload tax documents instead. The required tax document will depend on your business\u2019s entity type." }, void 0)] }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(BulletSection, { children: [(0, jsx_runtime_1.jsx)("div", {}, void 0), (0, jsx_runtime_1.jsxs)(CopySection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ size: "sm" }, { children: "Documentation of Reduction in Receipts (Applies only to second-draw PPP loans over $150,000)" }), void 0), (0, jsx_runtime_1.jsx)(StyledCopy, { children: "For a second-draw PPP loan, you must provide documentation showing at least a 25% reduction in gross receipts annually or in at least one quarter in 2020 when compared to the same quarter in 2019. (Alternative calculations may apply for those not in business all of 2019.) Acceptable documentation may include quarterly financial statements; quarterly or monthly bank statements showing deposits from the relevant quarters; or annual IRS income tax filings (if using an annual reference period)." }, void 0)] }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(BulletSection, { children: [(0, jsx_runtime_1.jsx)("div", {}, void 0), (0, jsx_runtime_1.jsxs)(CopySection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ size: "sm" }, { children: "Bank Account Information" }), void 0), (0, jsx_runtime_1.jsx)(StyledCopy, { children: "You will need the account number and routing number for your business checking account. You can find this information on your bank statement, by logging into your bank\u2019s website, or from one of your business checks." }, void 0)] }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(BulletSection, { children: [(0, jsx_runtime_1.jsx)("div", {}, void 0), (0, jsx_runtime_1.jsxs)(CopySection, { children: [(0, jsx_runtime_1.jsx)(header_js_1.default, Object.assign({ size: "sm" }, { children: "Driver\u2019s License or Passport Number" }), void 0), (0, jsx_runtime_1.jsx)(StyledCopy, { children: "Have your driver\u2019s license or passport handy so you can enter the identification number of one of them on your loan application." }, void 0)] }, void 0)] }, void 0)] }, void 0)), (0, jsx_runtime_1.jsxs)(sba_form_js_1.StyledStandardCard, { children: [shouldShowPasswordField && ((0, jsx_runtime_1.jsxs)(sba_form_js_1.CreateAccountWrapper, { children: [(0, jsx_runtime_1.jsx)(sba_form_js_1.StyledCDNIllustration, { height: "126px", filename: "CARES-app-thank+you.png" }, void 0), (0, jsx_runtime_1.jsx)(sba_form_js_1.CreateAccountHeader, { children: "Save all your information to a free Nav account and access more financing options available for your business." }, void 0), (0, jsx_runtime_1.jsx)(input_js_1.default, { hasSpaceForErrors: true, type: "password", name: "password", onChange: handleChange, onBlur: handleBlur, value: values.password, label: "Password", errors: touched.password && errors.password ? errors.password : undefined, isInvalid: touched.password && !!(errors === null || errors === void 0 ? void 0 : errors.password), "data-testid": "ppp-form:input:password" }, void 0)] }, void 0)), (0, jsx_runtime_1.jsxs)(BlueBorderDiv, { children: [(0, jsx_runtime_1.jsx)(HeaderSectionTC, { children: (0, jsx_runtime_1.jsx)(header_js_1.default, { children: "Check the box before submitting" }, void 0) }, void 0), (0, jsx_runtime_1.jsx)(sba_form_js_1.LegalCheckbox, { hasSpaceForErrors: true, name: "termsOfService", label: (0, jsx_runtime_1.jsxs)(copy_1.default, { children: [privatePolicy ||
`Information is gathered in accordance with Nav’s Privacy Policy. By checking this box, I confirm that
I have read and agree to Nav’s `, (0, jsx_runtime_1.jsx)("a", Object.assign({ href: termsHref || `https://www.nav.com/terms/`, target: "_blank", rel: "noopener noreferrer", "data-testid": "pp-form:terms-service-link" }, { children: "Terms of Service" }), void 0), ", including the", ' ', (0, jsx_runtime_1.jsx)("a", Object.assign({ href: "https://www.nav.com/privacy/", target: "_blank", rel: "noopener noreferrer", "data-testid": "pp-form:privacy-link" }, { children: "Privacy Policy" }), void 0), "."] }, void 0), checked: values.termsOfService, onChange: handleChange, onBlur: handleBlur, errors: touched.termsOfService && errors.termsOfService ? errors.termsOfService : undefined, isInvalid: touched.termsOfService && !!(errors === null || errors === void 0 ? void 0 : errors.termsOfService), "data-testid": "pp-form:terms-of-service" }, void 0), !(0, utils_1.isEmpty)(errors.totalPercent) && (0, jsx_runtime_1.jsx)(sba_form_js_1.ErrorsMessage, { children: errors.totalPercent[0] }, void 0), !!Object.keys(errors).length && !isValid && submitCount > 0 && ((0, jsx_runtime_1.jsx)(sba_form_js_1.ErrorsMessage, { children: "Please complete all required fields before submitting your application." }, void 0)), (0, jsx_runtime_1.jsx)(sba_form_js_1.SubmitButton, Object.assign({ size: "extraLarge", type: "submit",
// Disable only if submit has been attempted before
disabled: (isSubmittingForm || !!Object.keys(errors).length) && submitCount, "data-testid": "pp-form:submit-cta", isLoading: isSubmittingForm }, { children: "Submit" }), void 0)] }, void 0), (0, jsx_runtime_1.jsx)(sba_form_js_1.DisclaimerText, Object.assign({ light: true }, { children: "Please keep in mind this information is changing rapidly and is based on our current understanding of the programs. Please do not rely solely on information provided here for your financial decisions." }), void 0)] }, void 0)] }), void 0)) }), void 0));
};
exports.MiniSBAPaycheckProtectionProgramForm = MiniSBAPaycheckProtectionProgramForm;
exports.MiniSBAPaycheckProtectionProgramForm.propTypes = {
initialValues: prop_types_1.default.object,
isSubmittingForm: prop_types_1.default.bool,
onFormSubmit: prop_types_1.default.func.isRequired,
dispatchOpenInfoDrawer: prop_types_1.default.func.isRequired,
shouldShowLoginPrompt: prop_types_1.default.bool,
loginPromptUrl: prop_types_1.default.string,
onLoginPromptDismiss: prop_types_1.default.func,
shouldShowPasswordField: prop_types_1.default.bool,
};
//# sourceMappingURL=mini-sba-form.js.map