bhl-forms 0.11.10 → 0.11.12

package/dist/forms/civilLawsuit.es.js

@@ -372,14 +372,11 @@ const verticalDate = (updates) => {
   return date(updates)
 };
 
-const email = (scope, vertical, updates = {}) => {
-  const func = vertical ? verticalText : sbsText;
-  const label = vertical ? updates.label : "Email Address:";
-  return func({
-    $formkit: "email",
+const emailFL = (scope, updates = {}) => {
+  return text({
+    $formkit: "FloatingLabelText",
     name: scope ? scope + ":" + "Email" : "Email",
-    label,
-    placeholder: "email@domain.com",
+    placeholder: "Email Address",
     autocomplete: "email",
     "data-tf-sensitive": "false",
     validation: "required|email",
@@ -387,59 +384,72 @@ const email = (scope, vertical, updates = {}) => {
       required: "Email is required",
       email: "Invalid Email",
     },
+    inputClass: "t-text-center",
+    wrapperClass: "t-flex t-justify-center",
     ...updates,
   })
 };
 
-const firstName = (scope, vertical, updates = {}) => {
-  const func = vertical ? verticalText : sbsText;
-  const label = vertical ? updates.label : "First Name:";
-  return func({
-    label,
+const firstNameFL = (scope, updates = {}) => {
+  return text({
+    $formkit: "FloatingLabelText",
     placeholder: "First Name",
     name: scope ? scope + ":" + "First_Name" : "First_Name",
     autocomplete: "given-name",
     validationMessages: {
       required: "First Name is required",
     },
+    inputClass: "t-text-center",
     ...updates,
   })
 };
 
-const lastName = (scope, vertical, updates = {}) => {
-  const func = vertical ? verticalText : sbsText;
-  const label = vertical ? updates.label : "Last Name:";
-  return func({
-    label,
+const lastNameFL = (scope, updates = {}) => {
+  return text({
+    $formkit: "FloatingLabelText",
     placeholder: "Last Name",
     name: scope ? scope + ":" + "Last_Name" : "Last_Name",
     autocomplete: "family-name",
     validationMessages: {
       required: "Last Name is required",
     },
+    inputClass: "t-text-center",
     ...updates,
   })
 };
 
-const phone = (scope, vertical, updates = {}) => {
-  const func = vertical ? verticalText : sbsText;
-  const label = vertical ? updates.label : "Phone Number:";
-  return func({
-    $formkit: "tel",
+const fullNameFLMobileCol = (scope, updates = {}) => {
+  return {
+    $el: "div",
+    attrs: {
+      class: "t-flex t-flex-col sm:t-flex-row t-flex-wrap t-gap-x-[2%] t-justify-center  sm:!t-max-w-[70%]",
+    },
+    children: [
+      firstNameFL(scope, { outerClass: "sm:!t-max-w-[49%]", ...updates }),
+      lastNameFL(scope, { outerClass: "sm:!t-max-w-[49%]", ...updates }),
+    ],
+  }
+};
+
+const phoneFL = (scope, updates = {}) => {
+  return text({
+    $formkit: "FloatingLabelText",
+    datatype: "tel",
     name: scope ? scope + ":" + "Primary_Phone" : "Primary_Phone",
-    label,
-    placeholder: updates.placeholder || "###-###-####",
-    maxlength: 12,
-    help: updates.help || "10-digit phone number, hyphens optional",
+    placeholder: updates.placeholder || "Phone Number",
+    maxlength: 14,
+    help: updates.help || null,
     autocomplete: "tel-national",
     "data-tf-sensitive": "false",
-    validation: "required|matches:/^[0-9]{3}-?[0-9]{3}-?[0-9]{4}$/|valid_phone",
+    validation: "required|matches:/^[0-9]{3}[0-9]{3}[0-9]{4}$/|valid_phone",
     validationMessages: {
       required: "Phone Number is required",
-      matches: "Invalid Phone Format, use ###-###-####",
+      matches: "Invalid Phone Format, use (XXX) YYY-ZZZZ",
       valid_phone: "Invalid Phone Number",
     },
     helpClass: "t-mt-2.5 md:t-text-right md:t-mt-[-2px]",
+    inputClass: "t-text-center",
+    wrapperClass: "t-flex t-justify-center",
     ...updates,
   })
 };
@@ -850,6 +860,32 @@ const employeeAtCompany$1 = (scope, vertical, updates = {}) => {
   )
 };
 
+const employmentAndWorkplaceTOLPDisplay$1 = (scope, vertical, updates = {}) => {
+  const func = vertical ? col2RadioCenter : col2Radio;
+  const label = vertical ? updates.label : "Select The Workplace Issue:";
+  const _if = vertical ? updates.if : '$get(Type_Of_Legal_Problem).value == "Employment and Workplace"';
+  return func(
+    merge(
+      {
+        label,
+        if: _if,
+        name: scope ? scope + ":" + "Type_Of_Legal_Problem_Display" : "Type_Of_Legal_Problem_Display",
+        options: [
+          "Workplace Harassment",
+          "Workplace Discrimination",
+          "Wrongful Termination",
+          "Payment Disputes",
+          "Workers Compensation",
+          "Personal Injury",
+          "Unemployment",
+          "Other Workplace Issues",
+        ],
+      },
+      updates
+    )
+  )
+};
+
 const estateLegalServicesNeeded = (scope, vertical, updates = {}) => {
   const func = vertical ? col2RadioCenter : sbsSelect;
   const label = vertical ? updates.label : "Legal Services Needed for Your Estate:";
@@ -1118,6 +1154,33 @@ const realEstateArea$1 = (scope, vertical, updates = {}) => {
   )
 };
 
+const realEstateTOLPDisplay$1 = (scope, vertical, updates = {}) => {
+  const func = vertical ? col2RadioCenter : col2Radio;
+  const label = vertical ? updates.label : "Select The Real Estate Issue:";
+  const _if = vertical ? updates.if : '$get(Type_Of_Legal_Problem).value == "Real Estate"';
+  return func(
+    merge(
+      {
+        label,
+        if: _if,
+        name: scope ? scope + ":" + "Type_Of_Legal_Problem_Display" : "Type_Of_Legal_Problem_Display",
+        options: [
+          "Contracts and Agreements",
+          "Deeds, Liens, and Titles",
+          "Foreclosure",
+          "Insurance",
+          "Landlord and Tenant",
+          "Loans and Mortgages",
+          "Wills, Trusts, and Estates",
+          "Property Damage",
+          "Not Sure or Other",
+        ],
+      },
+      updates
+    )
+  )
+};
+
 const roleInMatterProbate = (scope, vertical, updates = {}) => {
   const func = vertical ? col2RadioCenter : sbsSelect;
   const label = vertical ? updates.label : "What is Your Role in this Matter?";
@@ -1437,6 +1500,24 @@ function secureIcon(updates = {}) {
   return merge(secureIconDefault, updates)
 }
 
+function secureIconStandalone(updates = {}) {
+  return {
+    if: "$activeStep === $lastStep()",
+    style: {
+      if: "$activeStep !== $lastStep()",
+      then: "display: none;",
+    },
+    children: [
+      secureIcon({
+        attrs: {
+          class: "t-flex t-justify-center t-items-center t-text-sm t-text-gray-500 t-pb-6 sm:t-pb-8",
+        },
+        ...updates,
+      }),
+    ],
+  }
+}
+
 function crossSellQuestionsStepHeadline(updates) {
   return {
     $el: "h3",
@@ -1470,19 +1551,6 @@ function verticalStepHeadline(updates) {
   }
 }
 
-function verticalStepSubHeadline(updates) {
-  return {
-    $el: "h5",
-    children: updates.subheadline || "",
-    attrs: {
-      class:
-        "t-flex t-justify-center t-text-center !t-text-lg t-font-normal t-text-dark t-pb-5 t-pt-0 t-px-1" +
-        " " +
-        (updates.subheadlineClass || ""),
-    },
-  }
-}
-
 function commentsStepHeadline(updates) {
   return {
     $el: "h3",
@@ -1652,6 +1720,7 @@ function commentsWithBankruptcy(updates = {}) {
       comments(updates.scope, false, {
         label: typeof updates.label === "undefined" ? DEFAULT_COMMENTS_LABEL_LEGAL : updates.label,
         placeholder: updates.placeholder || DEFAULT_COMMENTS_PLACEHOLDER_DYNAMIC_LEGAL,
+        // TODO: this is a mess
         inputClass: typeof updates.inputClass === "undefined" ? "!t-h-32" : updates.inputClass,
       }),
       // TODO: needs scope support
@@ -1672,23 +1741,40 @@ function commentsWithBankruptcy(updates = {}) {
   )
 }
 
-function contactInfo(updates = {}) {
+function contactInfoV2(updates = {}) {
   return step(
     "contactInfo",
     [
       contactStepHeadline(updates),
       contactStepSubHeadline(updates),
       trustedFormScript(),
-      email(updates.scope),
-      phone(updates.scope),
-      TCPAConsent(updates.scope),
-      secureIcon(),
+      {
+        $el: "div",
+        attrs: {
+          class: "t-flex t-flex-col t-justify-center t-items-center",
+        },
+        children: [
+          emailFL(updates.scope, {
+            outerClass: "!t-max-w-[95%] !t-w-[96%] sm:!t-w-[70%]",
+            innerClass: "!t-w-[98%] !t-max-w-[98%] sm:!t-w-[100%] sm:!t-max-w-[100%]",
+          }),
+          phoneFL(updates.scope, {
+            outerClass: "!t-max-w-[95%] !t-w-[96%] sm:!t-w-[70%]",
+            innerClass: "!t-w-[98%] !t-max-w-[98%] sm:!t-w-[100%] sm:!t-max-w-[100%]",
+          }),
+        ],
+      },
+      TCPAConsent(updates.scope, {
+        outerClass: "!t-flex !t-flex-col !t-justify-center !t-items-center",
+        wrapperClass: "t-w-[95%] sm:t-w-[80%]",
+        messagesClass: "t-w-[95%] sm:t-w-[80%]",
+      }),
     ],
     { nextOnEnter: false }
   )
 }
 
-function firstAndLastV3(updates = {}) {
+function firstAndLastV4(updates = {}) {
   return step(
     "firstAndLast",
     [
@@ -1696,12 +1782,13 @@ function firstAndLastV3(updates = {}) {
         headline: updates.headline ?? "Who is looking for help?",
         headlineClass: updates.headlineClass,
       }),
-      verticalStepSubHeadline({
-        subheadline: updates.subheadline ?? "We never share info without consent",
-        subheadlineClass: "!t-text-sm !t-text-gray-500",
-      }),
-      firstName(updates.scope),
-      lastName(updates.scope),
+      {
+        $el: "div",
+        attrs: {
+          class: "t-flex t-flex-col t-justify-center t-items-center t-pt-3",
+        },
+        children: [fullNameFLMobileCol(updates.scope)],
+      },
     ],
     updates
   )
@@ -1898,6 +1985,24 @@ function civilLawsuitTOLPDisplay(updates = {}) {
   )
 }
 
+function employmentAndWorkplaceTOLPDisplay(updates = {}) {
+  return sqstep(
+    "employmentAndWorkplaceTOLPDisplay",
+    employmentAndWorkplaceTOLPDisplay$1(updates.scope, true, updates.input),
+    "What type of workplace issue?",
+    updates
+  )
+}
+
+function realEstateTOLPDisplay(updates = {}) {
+  return sqstep(
+    "realEstateTOLPDisplay",
+    realEstateTOLPDisplay$1(updates.scope, true, updates.input),
+    "What type of real estate issue?",
+    updates
+  )
+}
+
 function haveAttorney(updates = {}) {
   return sqstep(
     "haveAttorney",
@@ -1969,7 +2074,7 @@ function businessServices(updates = {}) {
   return sqstep(
     "businessServices",
     businessServices$1(updates.scope, true, updates.input),
-    "What legal services do you need?",
+    "What area of law do you need?",
     updates
   )
 }
@@ -2055,13 +2160,17 @@ function wouldLikeLawyerTo(updates = {}) {
   )
 }
 
-const formNavigation = (updates = {}) => ({
+const formNavigationNoFinalBack = (updates = {}) => ({
   $el: "div",
   attrs: {
     class: {
       if: "$activeStep === $firstStep()",
       then: "step-nav " + (updates.firstStepButtonClass || "!t-justify-center sm:!t-justify-between"),
-      else: "step-nav !t-justify-between",
+      else: {
+        if: "$activeStep === $lastStep()",
+        then: "step-nav !t-justify-center ",
+        else: "step-nav !t-justify-between",
+      },
     },
   },
   children: [
@@ -2071,12 +2180,12 @@ const formNavigation = (updates = {}) => ({
       onClick: "$setPreviousStep($prevStepFunc($get(form)))",
       children: "Back",
       outerClass: {
-        if: "$activeStep === $firstStep()",
+        if: "$fns.eq($activeStep, $firstStep()) || $fns.eq($activeStep, $lastStep())",
         then: "t-hidden sm:t-block",
         else: "",
       },
       style: {
-        if: "$activeStep === $firstStep()",
+        if: "$fns.eq($activeStep, $firstStep()) || $fns.eq($activeStep, $lastStep())",
         then: "display: none;",
       },
       classes: {
@@ -2115,7 +2224,8 @@ const formNavigation = (updates = {}) => ({
         then: "display: none;",
       },
       classes: {
-        input: (updates.inputClass || "") + " !t-ml-2 sm:!t-ml-auto f-navigation-input",
+        input: (updates.inputClass || "") + " f-navigation-input !t-w-60",
+        outer: "!t-mt-0 !t-mb-0",
       },
     },
   ],
@@ -2975,7 +3085,7 @@ const nextStepsMapGeneralLegal = {
         "estateLegalServicesNeeded",
         ...nextStepsLegalDefault,
       ],
-      "Property Damage": ["realEstateArea", "wouldLikeLawyerTo", ...nextStepsLegalDefault],
+      "Property Damage": ["wouldLikeLawyerTo", ...nextStepsLegalDefault],
       "Real Estate": ["realEstateTOLPDisplay", "realEstateArea", "wouldLikeLawyerTo", ...nextStepsLegalDefault],
       "Social Security Disability and Insurance": [
         "applicantAge",
@@ -3118,6 +3228,10 @@ const nextStepsMapCivilTolp = {
   },
 };
 
+filterNextStepsMap(nextStepsMapCivilTolp, ["legalCrossSells"], {
+  commentsWithBankruptcy: "comments",
+});
+
 const nextStepsMapCivilTOLPDisplay = {
   values: {
     Type_Of_Legal_Problem_Display: {
@@ -3187,6 +3301,27 @@ filterNextStepsMap(
   },
 });
 
+({
+  values: {
+    Type_Of_Legal_Problem: {
+      "Workplace Harassment": TOLPNextSteps["Workplace Harassment"],
+      "Workplace Discrimination": TOLPNextSteps["Workplace Discrimination"],
+    },
+    "*": [...nextStepsLegalDefault],
+  },
+});
+
+({
+  values: {
+    Type_Of_Legal_Problem: {
+      "Probate and Estates": TOLPNextSteps["Probate and Estates"],
+      "Wills and Trusts": TOLPNextSteps["Wills and Trusts"],
+      "Wrongful Death": TOLPNextSteps["Wrongful Death"],
+    },
+    "*": [...nextStepsLegalDefault],
+  },
+});
+
 ({
   values: {
     Type_Of_Legal_Problem_Display: {
@@ -3251,7 +3386,7 @@ meta.data.dynamicSchema = [
   businessServices(),
   businessType(),
   civilLawsuitTOLPDisplay({
-    nextStepMap: nextStepsMapCivilTOLPDisplay
+    nextStepMap: nextStepsMapCivilTOLPDisplay,
   }),
   claimStatus(),
   consumerLawyerType(),
@@ -3259,9 +3394,12 @@ meta.data.dynamicSchema = [
   doctorTreatment(),
   employerType(),
   employeeAtCompany(),
+  employmentAndWorkplaceTOLPDisplay({
+    nextStepMap: nextStepsMapEmploymentAndWorkplaceTOLPDisplay,
+  }),
   haveAttorney(),
   incidentDate({
-    nextOnInput: false
+    nextOnInput: false,
   }),
   lawsuitOtherParty(),
   medicalMalpracticeInjuries(),
@@ -3269,15 +3407,17 @@ meta.data.dynamicSchema = [
   policeReportFiled(),
   primaryInjury(),
   realEstateArea(),
+  realEstateTOLPDisplay({
+    nextStepMap: nextStepsMapRealEstateTOLPDisplay,
+  }),
   wouldLikeLawyerTo(),
-  zipcode(),
   commentsWithBankruptcy({
     label: null,
-    headline: 'Please briefly describe your situation:',
-    headlineClass: '!t-text-dark',
+    headline: "Please briefly describe your situation:",
+    headlineClass: "!t-text-dark",
   }),
   legalCrossSells({
-    headlineClass: '!t-text-dark',
+    headlineClass: "!t-text-dark",
     nextStepMap: nextStepsMapLegalCrossSells,
   }),
   autoAndCarAccidentCrossSellQuestions(),
@@ -3289,8 +3429,8 @@ meta.data.dynamicSchema = [
   willsAndTrustsCrossSellQuestions(),
   divorceAndSeparationCrossSellQuestions(),
   childCustodyCrossSellQuestions(),
-  firstAndLastV3({
-    headlineClass: '!t-text-dark'
+  firstAndLastV4({
+    headlineClass: "!t-text-dark",
   }),
 ];
 
@@ -3298,39 +3438,48 @@ const schema = [
   meta,
   formAnchor(),
   {
-    $cmp: 'FormKit',
+    $cmp: "FormKit",
     props: formProps({
-      formId: 'civilLawsuit',
+      formId: "civilLawsuit",
       redirectMap: legalRedirectMap(),
       valueOverrideMap: legalAllValueOverrideMap,
-      crossSellOptionMap: legalCrossSellOptionMap
+      crossSellOptionMap: legalCrossSellOptionMap,
     }),
     children: [
       progressBar(),
       headline({
         children: '$urlParam("hl", "Schedule a Lawsuit Consultation")',
-        if: '$activeStep === $firstStep()'
+        if: "$activeStep === $firstStep()",
       }),
       defaultSubHeadline(),
       ...hiddenInputsLegal,
       {
-        $el: 'div',
+        $el: "div",
         attrs: {
-          class: 'form-body'
+          class: "form-body",
         },
         children: [
           civilLawsuitTOLP({
             nextOnInput: false,
-            nextStepMap: nextStepsMapCivilTolp
+            nextStepMap: nextStepsMapCivilTolp,
           }),
           dynamicSchemaNode(),
-          contactInfo(),
-          formNavigation(),
-          formDetails()
-        ]
-      }
-    ]
-  }
+          zipcode(),
+          contactInfoV2({
+            subheadlineClass: "!t-text-base",
+          }),
+          formNavigationNoFinalBack({
+            startText: "Start Now",
+            submitLabel: "Get Help Now",
+            inputClass: "!t-font-extrabold",
+            firstStepButtonClass: "!t-justify-center",
+          }),
+          secureIconStandalone(),
+          formDetails(),
+        ],
+      },
+    ],
+  },
 ];
 
 export { schema as default };