bhl-forms 0.0.13 → 0.0.16

package/dist/forms/childAndFamily.es.js

@@ -2,6 +2,58 @@ function merge() {
   return Object.assign({}, ...arguments)
 }
 
+const formPropDefaults = {
+  type: 'form',
+  id: 'form',
+  onSubmit: '$submit("https://httpbin.org/post", $prepData, $getRedirect)',
+  plugins: '$plugins',
+  actions: false,
+  prepop: {
+    fromURL: true
+  },
+  errorCodes: {
+    403: "An Error Occurred",
+    409: { abort: false },
+    429: "An Error Occurred"
+  },
+  formClass: '!t-max-w-xl'
+};
+
+function formProps(updates) {
+  return merge(
+    formPropDefaults,
+    updates
+  )
+}
+
+const hiddenInputs = [
+  {
+    $formkit: 'hidden',
+    name: "vertical",
+    value: "Legal"
+  },
+  {
+    $formkit: 'hidden',
+    name: "TCPA_Language",
+    value: "$meta.tcpaLanguage"
+  },
+  {
+    $formkit: 'hidden',
+    name: "gclid",
+    value: null,
+  },
+  {
+    $formkit: 'hidden',
+    name: "campaignid",
+    value: null,
+  },
+  {
+    $formkit: 'hidden',
+    name: "s",
+    value: null,
+  }
+];
+
 // ------ Common Base Settings
 
 const radio = (updates) => {
@@ -11,26 +63,26 @@ const radio = (updates) => {
     validationMessages: {
       required: 'Field is required',
     },
-    optionsClass: 'pt-3 pl-1',
+    optionsClass: 't-pt-3 t-pl-1',
     legendClass: 'required'
   }, updates)
 };
 
-const sbsRadio = (updates) => {
+const sbs2ColRadio = (updates) => {
   updates.legendClass = 'legend-left required';
   updates.fieldsetClass = '$reset side-by-side';
-  updates.optionsClass = 'pl-1';
-  updates.innerClass = 'flex items-center';
-  updates.wrapperClass = 'mb-3';
+  updates.optionsClass = 't-grid t-grid-cols-1 md:t-grid-cols-2';
+  updates.innerClass = 't-flex t-items-start';
+  updates.wrapperClass = '$reset t-flex t-cursor-pointer t-mb-3';
   return radio(updates)
 };
 
 const sbsYesNoRadio = (updates) => {
   updates.options = ['Yes', 'No'];
   updates.legendClass = 'legend-left required';
-  updates.fieldsetClass = '$reset side-by-side items-center';
-  updates.optionsClass = 'pl-1 side-by-side items-center';
-  updates.innerClass = 'flex items-center';
+  updates.fieldsetClass = '$reset side-by-side t-items-center';
+  updates.optionsClass = 't-pl-1 side-by-side t-items-center';
+  updates.innerClass = 't-flex t-items-center';
   return radio(updates)
 };
 
@@ -42,14 +94,14 @@ const select = (updates) => {
     validationMessages: {
       required: 'Field is required',
     },
-    inputClass: 'bg-white',
+    inputClass: 't-bg-white',
     labelClass: 'required'
   }, updates)
 };
 
 const sbsSelect = (updates) => {
   updates.labelClass = 'required';
-  updates.wrapperClass = 'side-by-side items-center';
+  updates.wrapperClass = 'side-by-side t-items-center';
   updates.innerClass = 'select-height-content';
   return select(updates)
 };
@@ -67,20 +119,20 @@ const text = (updates) => {
 
 const sbsText = (updates) => {
   updates.labelClass = 'required';
-  updates.wrapperClass = 'side-by-side items-center';
+  updates.wrapperClass = 'side-by-side t-items-center';
   return text(updates)
 };
 
-const childAndFamilyTOLP = () => sbsRadio({
+const childAndFamilyTOLP = () => sbs2ColRadio({
   label: 'Type of Help Needed:',
   name: 'Type_Of_Legal_Problem',
   id: 'Type_Of_Legal_Problem',
   options: [
     'Adoption',
     'Child Custody and Support',
-    // 'Family Issues',
-    // 'Guardianship',
-    // 'Divorce and Separation',
+    'Family Issues',
+    'Guardianship',
+    'Divorce and Separation',
     'Not Sure or Other'
   ]
 });
@@ -218,6 +270,7 @@ const phone = () => sbsText({
   name: 'Primary_Phone',
   label: 'Phone Number:',
   placeholder: 'xxx-xxx-xxxx',
+  maxlength: 12,
   // help: '10-digit US phone number, hyphens optional.',
   validation: 'required|matches:/^[0-9]{3}-?[0-9]{3}-?[0-9]{4}$/',
   validationMessages: {
@@ -232,10 +285,11 @@ const TCPAConsent = () => ({
   name: 'TCPA_Opt_In',
   validation: 'required|accepted',
   validationMessages: {
+    required: 'Consent is required',
     accepted: 'Consent is required',
   },
   classes: {
-    label: "text-xs text-slate-500 font-normal"
+    label: "t-text-xs t-text-slate-500 t-font-normal"
   }
 });
 
@@ -243,6 +297,7 @@ const zipcode = () => sbsText({
   label: 'Zip Code:',
   placeholder: '90210',
   name: 'Zip',
+  maxlength: 5,
   validation: 'required|matches:/^[0-9]{5}$/',
   validationMessages: {
     required: 'Zip Code is required',
@@ -295,6 +350,48 @@ const ChildCustodyAndSupportQuestions = () => group(
   }
 );
 
+const FamilyIssuesQuestions = () => group(
+  'FamilyIssuesQuestions',
+  {
+    if: '$get(Type_Of_Legal_Problem).value == "Family Issues"',
+    children: [
+      haveAttorney(),
+      maritalStatus(),
+      haveChildren(),
+      degreeOfInterest(),
+      lawyerPaymentMethod()
+    ]
+  }
+);
+
+const GuardianshipQuestions = () => group(
+  'GuardianshipQuestions',
+  {
+    if: '$get(Type_Of_Legal_Problem).value == "Guardianship"',
+    children: [
+      haveAttorney(),
+      maritalStatus(),
+      haveChildren(),
+      degreeOfInterest(),
+      lawyerPaymentMethod()
+    ]
+  }
+);
+
+const DivorceQuestions = () => group(
+  'DivorceQuestions',
+  {
+    if: '$get(Type_Of_Legal_Problem).value == "Divorce and Separation"',
+    children: [
+      haveAttorney(),
+      maritalStatus(),
+      haveChildren(),
+      degreeOfInterest(),
+      lawyerPaymentMethod()
+    ]
+  }
+);
+
 const NotSureOrOtherQuestions = () => group(
   'NotSureOrOtherQuestions',
   {
@@ -365,7 +462,7 @@ function contactInfo() {
         $el: 'h3',
         children: 'Based on your input, you may benefit from speaking with a family lawyer. Please verify your contact information:',
         attrs: {
-          class: 'flex justify-center text-center text-lg font-bold pb-5 pt-0 px-3'
+          class: 't-flex t-justify-center t-text-center t-text-lg t-font-bold t-pb-5 t-pt-0 t-px-3'
         }
       },
       email(),
@@ -375,7 +472,7 @@ function contactInfo() {
         $el: 'div',
         if: '$activeStep === $lastStep()',
         attrs: {
-          class: 'flex justify-center'
+          class: 't-flex t-justify-center'
         },
         children: [
           {
@@ -415,11 +512,14 @@ function TOLPQuestions() {
         $el: 'h3',
         children: 'Please Complete the Following:',
         attrs: {
-          class: 'flex justify-center text-center text-2xl font-bold text-blue-500 pb-5 pt-0 px-3'
+          class: 't-flex t-justify-center t-text-center t-text-2xl t-font-bold t-text-blue-500 t-pb-5 t-pt-0 t-px-3'
         }
       },
       AdoptionQuestions(),
       ChildCustodyAndSupportQuestions(),
+      FamilyIssuesQuestions(),
+      GuardianshipQuestions(),
+      DivorceQuestions(),
       NotSureOrOtherQuestions()
     ],
     ...arguments
@@ -445,7 +545,7 @@ const formNavigation = () => ({
     },
     {
       $formkit: 'button',
-      onClick: '$setNextStep()',
+      onClick: '$setNextStep($fireStepEvent($get(form)))',
       children: 'Next',
       style: {
         if: '$activeStep === $lastStep()',
@@ -472,7 +572,7 @@ const formDetails = () => ({
       $el: 'pre',
       children: '$stringify( $get(form).value )',
       attrs: {
-        class: 'text-xs',
+        class: 't-text-xs',
         style: 'overflow: scroll'
       }
     },
@@ -480,7 +580,7 @@ const formDetails = () => ({
       $el: 'pre',
       children: ['activeStep: ', '$activeStep'],
       attrs: {
-        class: 'text-xs',
+        class: 't-text-xs',
         style: 'overflow: scroll'
       }
     },
@@ -488,7 +588,7 @@ const formDetails = () => ({
       $el: 'pre',
       children: ['stepHistory: ', '$stepHistory'],
       attrs: {
-        class: 'text-xs',
+        class: 't-text-xs',
         style: 'overflow: scroll'
       }
     },
@@ -496,7 +596,7 @@ const formDetails = () => ({
       $el: 'pre',
       children: ['stepQueue: ', '$stepQueue'],
       attrs: {
-        class: 'text-xs',
+        class: 't-text-xs',
         style: 'overflow: scroll'
       }
     }
@@ -512,33 +612,25 @@ const schema = [
   },
   {
     $cmp: 'FormKit',
-    props: {
-      type: 'form',
-      id: 'form',
+    props: formProps({
+      formId: 'childAndFamily',
       onSubmit: '$submit("https://httpbin.org/post", $prepData, $getRedirect)',
       // onSubmit: '$submit("http://localhost:8080/api/v1/form_leads_ext", $prepData, $getRedirect)',
-      plugins: '$plugins',
-      actions: false,
-      prepop: {
-        fromURL: true
-      },
-      errorCodes: {
-        403: "An Error Occurred",
-        409: { abort: false },
-        429: "An Error Occurred"
-      },
       redirectMap: {
+        'Adoption': 'https://justanswer.9pctbx.net/c/2880795/565949/9320?sharedid=${properties.vid}',
+        'Child Custody and Support': 'https://justanswer.9pctbx.net/c/2880795/565949/9320?sharedid=${properties.vid}',
+        'Divorce and Separation': 'https://justanswer.9pctbx.net/c/2880795/966410/9320?sharedid=${properties.vid}',
+        'Guardianship': 'https://justanswer.9pctbx.net/c/2880795/565949/9320?sharedid=${properties.vid}',
         '*': 'https://justanswer.9pctbx.net/c/2880795/808601/9320?sharedid=${properties.vid}'
       },
-      formClass: '!max-w-xl'
-    },
+    }),
     children: [
       {
         $el: 'h1',
         if: '$activeStep === $firstStep()',
         children: 'Get Child & Family Help Today',
         attrs: {
-          class: 'flex justify-center text-center text-3xl font-bold pt-5 px-3'
+          class: 't-flex t-justify-center t-text-center t-text-3xl t-font-bold t-pt-5 t-px-3'
         }
       },
       {
@@ -546,34 +638,10 @@ const schema = [
         if: '$activeStep === $firstStep()',
         children: 'Contact Us Now for Child Support, Custody and Family Issues',
         attrs: {
-          class: 'flex justify-center text-center text-md font-medium text-blue-500 px-3'
+          class: 't-flex t-justify-center t-text-center t-text-md t-font-medium t-text-blue-500 t-px-3'
         }
       },
-      {
-        $formkit: 'hidden',
-        name: "vertical",
-        value: "Legal"
-      },
-      {
-        $formkit: 'hidden',
-        name: "TCPA_Language",
-        value: "$meta.tcpaLanguage"
-      },
-      {
-        $formkit: 'hidden',
-        name: "gclid",
-        value: null,
-      },
-      {
-        $formkit: 'hidden',
-        name: "campaignid",
-        value: null,
-      },
-      {
-        $formkit: 'hidden',
-        name: "s",
-        value: null,
-      },
+      ...hiddenInputs,
       {
         $el: 'div',
         attrs: {