feat(ABP 5) Add the ABP 5 web form

src/packages/shared-types/forms.ts

@@ -21,12 +21,12 @@ export interface FormSchema {
 export type RHFSlotProps = {
   name: string;
   label?: RHFTextField;
-  labelStyling?: string;
-  formItemStyling?: string;
+  labelClassName?: string;
+  formItemClassName?: string;
   groupNamePrefix?: string;
   description?: RHFTextField;
   descriptionAbove?: boolean;
-  descriptionStyling?: string;
+  descriptionClassName?: string;
   dependency?: DependencyRule;
   rules?: RegisterOptions;
 } & {
@@ -81,6 +81,7 @@ export type RHFOption = {
   dependency?: DependencyRule;
   form?: FormGroup[];
   slots?: RHFSlotProps[];
+  optionlabelClassName?: string;
 };
 
 export type RHFComponentMap = {
@@ -114,15 +115,17 @@ export type RHFComponentMap = {
 
 export type FormGroup = {
   description?: string;
+  descriptionClassName?: string;
   slots: RHFSlotProps[];
-  wrapperStyling?: string;
+  wrapperClassName?: string;
   dependency?: DependencyRule;
 };
 
 export interface Section {
   title: string;
   form: FormGroup[];
   dependency?: DependencyRule;
+  subsection?: boolean;
 }
 
 export interface Document {

src/packages/shared-types/inputs.ts

@@ -1,4 +1,5 @@
 import { DayPicker } from "react-day-picker";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
 import * as SelectPrimitive from "@radix-ui/react-select";
@@ -41,6 +42,6 @@ export type SwitchProps = React.ComponentPropsWithoutRef<
 
 export interface TextareaProps
   extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
-  charcount?: "simple" | "limited";
-  charcountstyling?: string;
+  charCount?: "simple" | "limited";
+  charCountClassName?: string;
 }

src/services/api/webforms/ABP1/v202401.ts

@@ -1265,7 +1265,7 @@ export const v202401: FormSchema = {
     //   form: [
     //     {
     //       description: "A test of horizontal layouts with no slot styles",
-    //       wrapperStyling: "flex flex-wrap gap-6",
+    //       wrapperClassName: "flex flex-wrap gap-6",
     //       slots: [
     //         {
     //           name: "example1_1",
@@ -1286,7 +1286,7 @@ export const v202401: FormSchema = {
     //     },
     //     {
     //       description: "A test of horizontal layouts with slot styles",
-    //       wrapperStyling: "flex flex-wrap gap-6",
+    //       wrapperClassName: "flex flex-wrap gap-6",
     //       slots: [
     //         {
     //           name: "example2_1",

src/services/api/webforms/ABP10/v202401.ts

@@ -27,7 +27,7 @@ export const v202401: FormSchema = {
               name: "abp10_economy-and-efficiency-of-plans_describe-approach_select",
               label:
                 "Will economy and efficiency be achieved using the same approach as used for Medicaid state plan services?",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               rules: { required: "* Required" },
               props: {
                 className: "w-[150px]",
@@ -43,7 +43,7 @@ export const v202401: FormSchema = {
             {
               rhf: "Textarea",
               label: "Describe the approach",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               name: "abp10_economy-and-efficiency-of-plans_describe-approach_textarea",
               formItemStyling: "ml-[0.6rem] px-4 border-l-4 border-l-primary",
               rules: { required: "* Required" },

src/services/api/webforms/ABP11/v202401.ts

@@ -26,7 +26,7 @@ export const v202401: FormSchema = {
               rhf: "Upload",
               name: "abp11_abp-pay-method_state-plan-attchmnt-alt-payment-method_upload",
               label: "State plan amendment attachment",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               description:
                 "Only required if not using the payment methodology in the approved state plan",
               descriptionAbove: true,

src/services/api/webforms/ABP3/v202401.ts

@@ -32,7 +32,7 @@ export const v202401: FormSchema = {
               rhf: "Input",
               name: "abp3_benefit-package_name_input",
               label: "Benefit package name",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               rules: { required: "* Required" },
             },
           ],
@@ -180,7 +180,7 @@ export const v202401: FormSchema = {
                                           rhf: "Textarea",
                                           name: "abp3_select-of-sect-1937-cov-opt_benefits-and-limits_textarea",
                                           rules: { required: "* Required" },
-                                          labelStyling: "font-bold",
+                                          labelClassName: "font-bold",
                                           label:
                                             "Describe the benefits, source of benefits, and any limitations.",
                                         },
@@ -291,7 +291,7 @@ export const v202401: FormSchema = {
               rhf: "Radio",
               label:
                 "The state/territory will use the following as its base benchmark plan as described at 45 CFR 156.100(a):",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               name: "abp3_select-of-base-bench-plan_base-benchmark-plan_radiogroup",
               rules: { required: "* Required" },
               props: {

src/services/api/webforms/ABP3_1/v202401.ts

@@ -190,7 +190,7 @@ export const v202401: FormSchema = {
                                           name: "abp3-1_select-of-sect-1937-coverage-opt_benefits-description_textarea",
                                           label:
                                             "Describe the benefits, source of benefits, and any limitations.",
-                                          labelStyling: "font-bold",
+                                          labelClassName: "font-bold",
                                           rules: {
                                             required: "* Required",
                                           },
@@ -288,7 +288,7 @@ export const v202401: FormSchema = {
               name: "abp3-1_select-of-ehb-bench-plan_name_input",
               rhf: "Input",
               label: "EHB-benchmark plan name",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               rules: {
                 required: "* Required",
               },
@@ -299,7 +299,7 @@ export const v202401: FormSchema = {
               rhf: "Select",
               label:
                 "Is the EHB-benchmark plan the same as the Section 1937 coverage option?",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               rules: {
                 required: "* Required",
               },
@@ -315,7 +315,7 @@ export const v202401: FormSchema = {
             {
               label:
                 "The state/territory will use the following as its EHB-benchmark option as described at 45 CFR 156.111(b)(2)(B), in compliance with the individual insurance market under 45 CFR 156.100 through 156.125:",
-              labelStyling: "font-bold",
+              labelClassName: "font-bold",
               name: "abp3-1_select-of-ehb-bench-plan_option_radiogroup",
               rhf: "Radio",
               descriptionAbove: true,
@@ -339,7 +339,7 @@ export const v202401: FormSchema = {
                         rhf: "Select",
                         name: "abp3-1_select-of-ehb-bench-plan_is-geo-area_select",
                         label: "State/territory",
-                        labelStyling: "p-3",
+                        labelClassName: "p-3",
                         formItemStyling: "flex-row",
                         props: {
                           className: "w-[150px]",
@@ -449,7 +449,7 @@ export const v202401: FormSchema = {
                         rhf: "Radio",
                         name: "abp3-1_select-of-ehb-bench-plan_indicate-ehb-bench-plan_radiogroup",
                         label: "Type of EHB-benchmark plan",
-                        labelStyling: "font-bold",
+                        labelClassName: "font-bold",
                         props: {
                           options: [
                             {
@@ -523,7 +523,7 @@ export const v202401: FormSchema = {
                             rhf: "Checkbox",
                             name: "abp3-1_select-of-ehb-bench-plan_one-or-more-EHBs-other-states_checkgroup",
                             label: "Select one or more EHBs from other states.",
-                            labelStyling: "font-bold",
+                            labelClassName: "font-bold",
                             rules: { required: "* Required" },
                             props: {
                               options: [
@@ -535,7 +535,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_ambulatory-patient-services-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       props: {
                                         className: "w-[150px]",
@@ -648,7 +648,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_emergency-services-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -764,7 +764,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_hospital-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -880,7 +880,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_maternity-and-newborn-care-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -998,7 +998,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_mental-health-and-substance-use-disorders-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -1114,7 +1114,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_prescription-drugs-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -1232,7 +1232,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_rehab-and-habilitative-services-and-devices-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -1348,7 +1348,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_laboratory-services-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -1466,7 +1466,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_prevent-and-well-services-and-chronic-disease-management-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",
@@ -1584,7 +1584,7 @@ export const v202401: FormSchema = {
                                       rhf: "Select",
                                       name: "abp3-1_select-of-ehb-bench-plan_pediatric-services-including-oral-and-vision-care-state-territory_select",
                                       label: "Identify the state/territory",
-                                      labelStyling: "p-3",
+                                      labelClassName: "p-3",
                                       formItemStyling: "flex-row",
                                       rules: {
                                         required: "* Required",

src/services/api/webforms/ABP5/index.ts

@@ -0,0 +1 @@
+export * from "./v202401";