@f1studio/form-spec 5.0.0-alpha.111 → 5.0.0-alpha.112

package/FormSpec.TS/plugins/demographics/src/DemographicsField.js

@@ -0,0 +1,918 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get DemographicsField_Attributes () {
+        return DemographicsField_Attributes;
+    },
+    get DemographicsField_Attributes_$reflection () {
+        return DemographicsField_Attributes_$reflection;
+    },
+    get DemographicsField_DemographicsConfig () {
+        return DemographicsField_DemographicsConfig;
+    },
+    get DemographicsField_DemographicsConfig_$reflection () {
+        return DemographicsField_DemographicsConfig_$reflection;
+    },
+    get DemographicsField_DemographicsData () {
+        return DemographicsField_DemographicsData;
+    },
+    get DemographicsField_DemographicsData_$reflection () {
+        return DemographicsField_DemographicsData_$reflection;
+    },
+    get DemographicsField_DemographicsFieldComponent () {
+        return DemographicsField_DemographicsFieldComponent;
+    },
+    get DemographicsField_Field$1 () {
+        return DemographicsField_Field$1;
+    },
+    get DemographicsField_Field$1_$ctor_Z3F5C7C07 () {
+        return DemographicsField_Field$1_$ctor_Z3F5C7C07;
+    },
+    get DemographicsField_Field$1_$reflection () {
+        return DemographicsField_Field$1_$reflection;
+    },
+    get DemographicsField_SerializedDemographics () {
+        return DemographicsField_SerializedDemographics;
+    },
+    get DemographicsField_SerializedDemographics_$reflection () {
+        return DemographicsField_SerializedDemographics_$reflection;
+    },
+    get DemographicsField_configToOptions () {
+        return DemographicsField_configToOptions;
+    },
+    get DemographicsField_defaultConfig () {
+        return DemographicsField_defaultConfig;
+    },
+    get DemographicsField_form () {
+        return DemographicsField_form;
+    },
+    get DemographicsField_inputClass () {
+        return DemographicsField_inputClass;
+    },
+    get DemographicsField_optionsToConfig () {
+        return DemographicsField_optionsToConfig;
+    },
+    get DemographicsField_parseDemographicsData () {
+        return DemographicsField_parseDemographicsData;
+    },
+    get DemographicsField_serializeDemographicsData () {
+        return DemographicsField_serializeDemographicsData;
+    },
+    get Form_PropertyKeys_Address () {
+        return Form_PropertyKeys_Address;
+    },
+    get Form_PropertyKeys_DateOfBirth () {
+        return Form_PropertyKeys_DateOfBirth;
+    },
+    get Form_PropertyKeys_Email () {
+        return Form_PropertyKeys_Email;
+    },
+    get Form_PropertyKeys_EmergencyContact () {
+        return Form_PropertyKeys_EmergencyContact;
+    },
+    get Form_PropertyKeys_FirstName () {
+        return Form_PropertyKeys_FirstName;
+    },
+    get Form_PropertyKeys_Insurance () {
+        return Form_PropertyKeys_Insurance;
+    },
+    get Form_PropertyKeys_IsMedicalField () {
+        return Form_PropertyKeys_IsMedicalField;
+    },
+    get Form_PropertyKeys_LastName () {
+        return Form_PropertyKeys_LastName;
+    },
+    get Form_PropertyKeys_MRN () {
+        return Form_PropertyKeys_MRN;
+    },
+    get Form_PropertyKeys_Phone () {
+        return Form_PropertyKeys_Phone;
+    },
+    get Form_PropertyKeys_RaceEthnicity () {
+        return Form_PropertyKeys_RaceEthnicity;
+    },
+    get Form_demographicsField () {
+        return Form_demographicsField;
+    },
+    get Form_designerPreview () {
+        return Form_designerPreview;
+    },
+    get Form_enhancedDemographicsConverter () {
+        return Form_enhancedDemographicsConverter;
+    },
+    get Form_isMedicalFieldProp () {
+        return Form_isMedicalFieldProp;
+    },
+    get Form_markdownRenderer () {
+        return Form_markdownRenderer;
+    },
+    get Form_pluginConfig () {
+        return Form_pluginConfig;
+    }
+});
+const _Types = require("@fable-org/fable-library-js/Types.js");
+const _Option = require("@fable-org/fable-library-js/Option.js");
+const _Util = require("@fable-org/fable-library-js/Util.js");
+const _Reflection = require("@fable-org/fable-library-js/Reflection.js");
+const _Fieldfs = require("../../../fable_modules/Fable.Form.3.0.0/Field.fs.js");
+const _Basefs = require("../../../fable_modules/Fable.Form.3.0.0/Base.fs.js");
+const _String = require("@fable-org/fable-library-js/String.js");
+const _Guid = require("@fable-org/fable-library-js/Guid.js");
+const _FormSpec = require("../../../FormSpec.FS/FormSpec.js");
+const _List = require("@fable-org/fable-library-js/List.js");
+const _Array = require("@fable-org/fable-library-js/Array.js");
+const _react = require("react");
+const _Interopfs = require("../../../fable_modules/Feliz.2.8.0/Interop.fs.js");
+const _HtmlViewfs = require("../../../fable_modules/Fable.Form.Simple.Bulma.5.0.1/Html.View.fs.js");
+const _Seq = require("@fable-org/fable-library-js/Seq.js");
+const _Typesfs = require("../../../fable_modules/Fable.Form.Simple.Bulma.5.0.1/Types.fs.js");
+const _Result = require("@fable-org/fable-library-js/Result.js");
+const _PluginInterface = require("../../../FormSpec.FS/PluginInterface.js");
+class DemographicsField_DemographicsData extends _Types.Record {
+    constructor(FirstName, LastName, Email, Phone, DateOfBirth, Address, MRN, Insurance, RaceEthnicity, EmergencyContact){
+        super();
+        this.FirstName = FirstName;
+        this.LastName = LastName;
+        this.Email = Email;
+        this.Phone = Phone;
+        this.DateOfBirth = DateOfBirth;
+        this.Address = Address;
+        this.MRN = MRN;
+        this.Insurance = Insurance;
+        this.RaceEthnicity = RaceEthnicity;
+        this.EmergencyContact = EmergencyContact;
+    }
+}
+function DemographicsField_DemographicsData_$reflection() {
+    return (0, _Reflection.record_type)("Fable.Form.Simple.Bulma.Fields.DemographicsField.DemographicsField.DemographicsData", [], DemographicsField_DemographicsData, ()=>[
+            [
+                "FirstName",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "LastName",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "Email",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "Phone",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "DateOfBirth",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "Address",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "MRN",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "Insurance",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "RaceEthnicity",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ],
+            [
+                "EmergencyContact",
+                (0, _Reflection.option_type)(_Reflection.string_type)
+            ]
+        ]);
+}
+class DemographicsField_DemographicsConfig extends _Types.Record {
+    constructor(IncludeName, IncludeEmail, IncludePhone, IncludeDOB, IncludeAddress, IncludeMRN, IncludeInsurance, IncludeRaceEthnicity, IncludeEmergencyContact, MedicalMode, IsRequiredName, IsRequiredEmail, IsRequiredPhone, IsRequiredDOB, IsRequiredAddress, IsRequiredMRN, IsRequiredInsurance, IsRequiredRaceEthnicity, IsRequiredEmergencyContact){
+        super();
+        this.IncludeName = IncludeName;
+        this.IncludeEmail = IncludeEmail;
+        this.IncludePhone = IncludePhone;
+        this.IncludeDOB = IncludeDOB;
+        this.IncludeAddress = IncludeAddress;
+        this.IncludeMRN = IncludeMRN;
+        this.IncludeInsurance = IncludeInsurance;
+        this.IncludeRaceEthnicity = IncludeRaceEthnicity;
+        this.IncludeEmergencyContact = IncludeEmergencyContact;
+        this.MedicalMode = MedicalMode;
+        this.IsRequiredName = IsRequiredName;
+        this.IsRequiredEmail = IsRequiredEmail;
+        this.IsRequiredPhone = IsRequiredPhone;
+        this.IsRequiredDOB = IsRequiredDOB;
+        this.IsRequiredAddress = IsRequiredAddress;
+        this.IsRequiredMRN = IsRequiredMRN;
+        this.IsRequiredInsurance = IsRequiredInsurance;
+        this.IsRequiredRaceEthnicity = IsRequiredRaceEthnicity;
+        this.IsRequiredEmergencyContact = IsRequiredEmergencyContact;
+    }
+}
+function DemographicsField_DemographicsConfig_$reflection() {
+    return (0, _Reflection.record_type)("Fable.Form.Simple.Bulma.Fields.DemographicsField.DemographicsField.DemographicsConfig", [], DemographicsField_DemographicsConfig, ()=>[
+            [
+                "IncludeName",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeEmail",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludePhone",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeDOB",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeAddress",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeMRN",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeInsurance",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeRaceEthnicity",
+                _Reflection.bool_type
+            ],
+            [
+                "IncludeEmergencyContact",
+                _Reflection.bool_type
+            ],
+            [
+                "MedicalMode",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredName",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredEmail",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredPhone",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredDOB",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredAddress",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredMRN",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredInsurance",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredRaceEthnicity",
+                _Reflection.bool_type
+            ],
+            [
+                "IsRequiredEmergencyContact",
+                _Reflection.bool_type
+            ]
+        ]);
+}
+class DemographicsField_Attributes extends _Types.Record {
+    GetFieldId() {
+        const this$ = this;
+        return this$.FieldId;
+    }
+    constructor(FieldId, Label, Config){
+        super();
+        this.FieldId = FieldId;
+        this.Label = Label;
+        this.Config = Config;
+    }
+}
+function DemographicsField_Attributes_$reflection() {
+    return (0, _Reflection.record_type)("Fable.Form.Simple.Bulma.Fields.DemographicsField.DemographicsField.Attributes", [], DemographicsField_Attributes, ()=>[
+            [
+                "FieldId",
+                _Reflection.string_type
+            ],
+            [
+                "Label",
+                _Reflection.string_type
+            ],
+            [
+                "Config",
+                DemographicsField_DemographicsConfig_$reflection()
+            ]
+        ]);
+}
+function DemographicsField_form() {
+    return (build)=>(config)=>(0, _Basefs.field)(_String.isNullOrEmpty, build, config);
+}
+const DemographicsField_defaultConfig = new DemographicsField_DemographicsConfig(true, true, true, true, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false);
+function DemographicsField_configToOptions(config) {
+    const mk = (desc, v)=>new _FormSpec.Shared_FieldOption(desc, v, new _FormSpec.Shared_FieldOptionKey((0, _Guid.newGuid)()), undefined);
+    return (0, _List.ofArray)([
+        mk("IncludeName", config.IncludeName ? "true" : "false"),
+        mk("IncludeEmail", config.IncludeEmail ? "true" : "false"),
+        mk("IncludePhone", config.IncludePhone ? "true" : "false"),
+        mk("IncludeDOB", config.IncludeDOB ? "true" : "false"),
+        mk("IncludeAddress", config.IncludeAddress ? "true" : "false"),
+        mk("IncludeMRN", config.IncludeMRN ? "true" : "false"),
+        mk("IncludeInsurance", config.IncludeInsurance ? "true" : "false"),
+        mk("IncludeRaceEthnicity", config.IncludeRaceEthnicity ? "true" : "false"),
+        mk("IncludeEmergencyContact", config.IncludeEmergencyContact ? "true" : "false"),
+        mk("MedicalMode", config.MedicalMode ? "true" : "false"),
+        mk("IsRequiredName", config.IsRequiredName ? "true" : "false"),
+        mk("IsRequiredEmail", config.IsRequiredEmail ? "true" : "false"),
+        mk("IsRequiredPhone", config.IsRequiredPhone ? "true" : "false"),
+        mk("IsRequiredDOB", config.IsRequiredDOB ? "true" : "false"),
+        mk("IsRequiredAddress", config.IsRequiredAddress ? "true" : "false"),
+        mk("IsRequiredMRN", config.IsRequiredMRN ? "true" : "false"),
+        mk("IsRequiredInsurance", config.IsRequiredInsurance ? "true" : "false"),
+        mk("IsRequiredRaceEthnicity", config.IsRequiredRaceEthnicity ? "true" : "false"),
+        mk("IsRequiredEmergencyContact", config.IsRequiredEmergencyContact ? "true" : "false")
+    ]);
+}
+function DemographicsField_optionsToConfig(options) {
+    const getFlag = (name, defaultVal)=>(0, _Option.defaultArg)((0, _Option.map)((o_1)=>o_1.Value === "true", (0, _List.tryFind)((o)=>o.Description === name, options)), defaultVal);
+    return new DemographicsField_DemographicsConfig(getFlag("IncludeName", DemographicsField_defaultConfig.IncludeName), getFlag("IncludeEmail", DemographicsField_defaultConfig.IncludeEmail), getFlag("IncludePhone", DemographicsField_defaultConfig.IncludePhone), getFlag("IncludeDOB", DemographicsField_defaultConfig.IncludeDOB), getFlag("IncludeAddress", DemographicsField_defaultConfig.IncludeAddress), getFlag("IncludeMRN", DemographicsField_defaultConfig.IncludeMRN), getFlag("IncludeInsurance", DemographicsField_defaultConfig.IncludeInsurance), getFlag("IncludeRaceEthnicity", DemographicsField_defaultConfig.IncludeRaceEthnicity), getFlag("IncludeEmergencyContact", DemographicsField_defaultConfig.IncludeEmergencyContact), getFlag("MedicalMode", DemographicsField_defaultConfig.MedicalMode), getFlag("IsRequiredName", DemographicsField_defaultConfig.IsRequiredName), getFlag("IsRequiredEmail", DemographicsField_defaultConfig.IsRequiredEmail), getFlag("IsRequiredPhone", DemographicsField_defaultConfig.IsRequiredPhone), getFlag("IsRequiredDOB", DemographicsField_defaultConfig.IsRequiredDOB), getFlag("IsRequiredAddress", DemographicsField_defaultConfig.IsRequiredAddress), getFlag("IsRequiredMRN", DemographicsField_defaultConfig.IsRequiredMRN), getFlag("IsRequiredInsurance", DemographicsField_defaultConfig.IsRequiredInsurance), getFlag("IsRequiredRaceEthnicity", DemographicsField_defaultConfig.IsRequiredRaceEthnicity), getFlag("IsRequiredEmergencyContact", DemographicsField_defaultConfig.IsRequiredEmergencyContact));
+}
+class DemographicsField_SerializedDemographics extends _Types.Record {
+    constructor(Data, MedicalMode){
+        super();
+        this.Data = Data;
+        this.MedicalMode = MedicalMode;
+    }
+}
+function DemographicsField_SerializedDemographics_$reflection() {
+    return (0, _Reflection.record_type)("Fable.Form.Simple.Bulma.Fields.DemographicsField.DemographicsField.SerializedDemographics", [], DemographicsField_SerializedDemographics, ()=>[
+            [
+                "Data",
+                DemographicsField_DemographicsData_$reflection()
+            ],
+            [
+                "MedicalMode",
+                _Reflection.bool_type
+            ]
+        ]);
+}
+function DemographicsField_parseDemographicsData(value, medicalMode) {
+    try {
+        if ((0, _String.isNullOrWhiteSpace)(value)) {
+            return new DemographicsField_SerializedDemographics(new DemographicsField_DemographicsData(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined), medicalMode);
+        } else {
+            const parts = (0, _String.split)(value, [
+                "|"
+            ], undefined, 0);
+            const medicalModeFromStorage = parts.length > 0 && (0, _Array.item)(0, parts).startsWith("MEDICAL:") ? (0, _Array.item)(0, parts) === "MEDICAL:true" : medicalMode;
+            const offset = ((0, _Array.item)(0, parts).startsWith("MEDICAL:") ? 1 : 0) | 0;
+            const opt = (i)=>{
+                const idx = offset + i | 0;
+                if (parts.length > idx && !(0, _String.isNullOrWhiteSpace)((0, _Array.item)(idx, parts))) {
+                    return (0, _Array.item)(idx, parts);
+                } else {
+                    return undefined;
+                }
+            };
+            return new DemographicsField_SerializedDemographics(new DemographicsField_DemographicsData(opt(0), opt(1), opt(2), opt(3), opt(4), opt(5), opt(6), opt(7), opt(8), opt(9)), medicalModeFromStorage);
+        }
+    } catch (matchValue) {
+        return new DemographicsField_SerializedDemographics(new DemographicsField_DemographicsData(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined), medicalMode);
+    }
+}
+function DemographicsField_serializeDemographicsData(data, medicalMode) {
+    return (medicalMode ? "MEDICAL:true" : "MEDICAL:false") + "|" + (0, _String.join)("|", [
+        (0, _Option.defaultArg)(data.FirstName, ""),
+        (0, _Option.defaultArg)(data.LastName, ""),
+        (0, _Option.defaultArg)(data.Email, ""),
+        (0, _Option.defaultArg)(data.Phone, ""),
+        (0, _Option.defaultArg)(data.DateOfBirth, ""),
+        (0, _Option.defaultArg)(data.Address, ""),
+        (0, _Option.defaultArg)(data.MRN, ""),
+        (0, _Option.defaultArg)(data.Insurance, ""),
+        (0, _Option.defaultArg)(data.RaceEthnicity, ""),
+        (0, _Option.defaultArg)(data.EmergencyContact, "")
+    ]);
+}
+const DemographicsField_inputClass = "mt-1 block w-full rounded-md border border-slate-300 bg-white px-2.5 py-1.5 text-sm text-slate-900 shadow-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30 disabled:cursor-not-allowed disabled:bg-slate-100 disabled:text-slate-500";
+function DemographicsField_DemographicsFieldComponent(config) {
+    let elems_4, elems_3;
+    const cfg = config.Attributes.Config;
+    const data = DemographicsField_parseDemographicsData(config.Value, cfg.MedicalMode).Data;
+    let patternInput;
+    const initial = (0, _Option.defaultArg)(data.FirstName, "");
+    patternInput = _Interopfs.reactApi.useState(initial);
+    const firstName = patternInput[0];
+    let patternInput_1;
+    const initial_1 = (0, _Option.defaultArg)(data.LastName, "");
+    patternInput_1 = _Interopfs.reactApi.useState(initial_1);
+    const lastName = patternInput_1[0];
+    let patternInput_2;
+    const initial_2 = (0, _Option.defaultArg)(data.Email, "");
+    patternInput_2 = _Interopfs.reactApi.useState(initial_2);
+    const email = patternInput_2[0];
+    let patternInput_3;
+    const initial_3 = (0, _Option.defaultArg)(data.Phone, "");
+    patternInput_3 = _Interopfs.reactApi.useState(initial_3);
+    const phone = patternInput_3[0];
+    let patternInput_4;
+    const initial_4 = (0, _Option.defaultArg)(data.DateOfBirth, "");
+    patternInput_4 = _Interopfs.reactApi.useState(initial_4);
+    const dob = patternInput_4[0];
+    let patternInput_5;
+    const initial_5 = (0, _Option.defaultArg)(data.Address, "");
+    patternInput_5 = _Interopfs.reactApi.useState(initial_5);
+    const address = patternInput_5[0];
+    let patternInput_6;
+    const initial_6 = (0, _Option.defaultArg)(data.MRN, "");
+    patternInput_6 = _Interopfs.reactApi.useState(initial_6);
+    const mrn = patternInput_6[0];
+    let patternInput_7;
+    const initial_7 = (0, _Option.defaultArg)(data.Insurance, "");
+    patternInput_7 = _Interopfs.reactApi.useState(initial_7);
+    const insurance = patternInput_7[0];
+    let patternInput_8;
+    const initial_8 = (0, _Option.defaultArg)(data.RaceEthnicity, "");
+    patternInput_8 = _Interopfs.reactApi.useState(initial_8);
+    const raceEthnicity = patternInput_8[0];
+    let patternInput_9;
+    const initial_9 = (0, _Option.defaultArg)(data.EmergencyContact, "");
+    patternInput_9 = _Interopfs.reactApi.useState(initial_9);
+    const emergencyContact = patternInput_9[0];
+    const dependencies = [
+        firstName,
+        lastName,
+        email,
+        phone,
+        dob,
+        address,
+        mrn,
+        insurance,
+        raceEthnicity,
+        emergencyContact
+    ];
+    _Interopfs.reactApi.useEffect(()=>{
+        config.OnChange(DemographicsField_serializeDemographicsData(new DemographicsField_DemographicsData((0, _String.isNullOrWhiteSpace)(firstName) ? undefined : firstName, (0, _String.isNullOrWhiteSpace)(lastName) ? undefined : lastName, (0, _String.isNullOrWhiteSpace)(email) ? undefined : email, (0, _String.isNullOrWhiteSpace)(phone) ? undefined : phone, (0, _String.isNullOrWhiteSpace)(dob) ? undefined : dob, (0, _String.isNullOrWhiteSpace)(address) ? undefined : address, (0, _String.isNullOrWhiteSpace)(mrn) ? undefined : mrn, (0, _String.isNullOrWhiteSpace)(insurance) ? undefined : insurance, (0, _String.isNullOrWhiteSpace)(raceEthnicity) ? undefined : raceEthnicity, (0, _String.isNullOrWhiteSpace)(emergencyContact) ? undefined : emergencyContact), cfg.MedicalMode));
+    }, dependencies);
+    const field = (label, value_10, setValue, placeholder, isRequired)=>{
+        let elems;
+        return (0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+            [
+                "className",
+                "space-y-1"
+            ],
+            (elems = [
+                (0, _react.createElement)("label", {
+                    className: "block text-xs font-medium text-slate-700",
+                    children: isRequired ? label + " *" : label
+                }),
+                (0, _react.createElement)("input", {
+                    type: "text",
+                    className: DemographicsField_inputClass,
+                    value: value_10,
+                    placeholder: placeholder,
+                    disabled: config.Disabled ? true : config.IsReadOnly,
+                    onChange: (ev)=>{
+                        setValue(ev.target.value);
+                    }
+                })
+            ], [
+                "children",
+                _Interopfs.reactApi.Children.toArray(Array.from(elems))
+            ])
+        ])));
+    };
+    return (0, _HtmlViewfs.withLabelAndError)(config.Attributes.Label, config.ShowError, config.Error, (0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+        [
+            "className",
+            "space-y-4"
+        ],
+        (elems_4 = [
+            (0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+                [
+                    "className",
+                    "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:gap-6"
+                ],
+                (elems_3 = (0, _Seq.toList)((0, _Seq.delay)(()=>{
+                    let elems_1;
+                    return (0, _Seq.append)(cfg.IncludeName ? (0, _Seq.singleton)((0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+                        [
+                            "className",
+                            "space-y-4 sm:col-span-2 sm:grid sm:grid-cols-2 sm:gap-4"
+                        ],
+                        (elems_1 = [
+                            field("First name", firstName, patternInput[1], "First name", cfg.IsRequiredName),
+                            field("Last name", lastName, patternInput_1[1], "Last name", cfg.IsRequiredName)
+                        ], [
+                            "children",
+                            _Interopfs.reactApi.Children.toArray(Array.from(elems_1))
+                        ])
+                    ])))) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>(0, _Seq.append)(cfg.IncludeEmail ? (0, _Seq.singleton)(field("Email", email, patternInput_2[1], "email@example.com", cfg.IsRequiredEmail)) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>(0, _Seq.append)(cfg.IncludePhone ? (0, _Seq.singleton)(field("Phone", phone, patternInput_3[1], "Phone number", cfg.IsRequiredPhone)) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>(0, _Seq.append)(cfg.IncludeDOB ? (0, _Seq.singleton)(field("Date of birth", dob, patternInput_4[1], "YYYY-MM-DD", cfg.IsRequiredDOB)) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>{
+                                    let elems_2;
+                                    return (0, _Seq.append)(cfg.IncludeAddress ? (0, _Seq.singleton)((0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+                                        [
+                                            "className",
+                                            "sm:col-span-2"
+                                        ],
+                                        (elems_2 = [
+                                            field("Address", address, patternInput_5[1], "Street, city, state, zip", cfg.IsRequiredAddress)
+                                        ], [
+                                            "children",
+                                            _Interopfs.reactApi.Children.toArray(Array.from(elems_2))
+                                        ])
+                                    ])))) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>(0, _Seq.append)(cfg.MedicalMode && cfg.IncludeMRN ? (0, _Seq.singleton)(field("MRN", mrn, patternInput_6[1], "Medical record number", cfg.IsRequiredMRN)) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>(0, _Seq.append)(cfg.MedicalMode && cfg.IncludeInsurance ? (0, _Seq.singleton)(field("Insurance", insurance, patternInput_7[1], "Insurance provider", cfg.IsRequiredInsurance)) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>(0, _Seq.append)(cfg.MedicalMode && cfg.IncludeRaceEthnicity ? (0, _Seq.singleton)(field("Race / Ethnicity", raceEthnicity, patternInput_8[1], "Race or ethnicity", cfg.IsRequiredRaceEthnicity)) : (0, _Seq.empty)(), (0, _Seq.delay)(()=>cfg.IncludeEmergencyContact ? (0, _Seq.singleton)(field("Emergency contact", emergencyContact, patternInput_9[1], "Name and phone", cfg.IsRequiredEmergencyContact)) : (0, _Seq.empty)()))))))));
+                                }))))))));
+                })), [
+                    "children",
+                    _Interopfs.reactApi.Children.toArray(Array.from(elems_3))
+                ])
+            ])))
+        ], [
+            "children",
+            _Interopfs.reactApi.Children.toArray(Array.from(elems_4))
+        ])
+    ]))));
+}
+class DemographicsField_Field$1 extends _Typesfs.IStandardField$3 {
+    "Fable.Form.Simple.Bulma.IStandardField`3.RenderFieldZ43FEF6DC"(config) {
+        return (0, _react.createElement)(DemographicsField_DemographicsFieldComponent, config);
+    }
+    MapFieldValues(update) {
+        const _ = this;
+        return DemographicsField_Field$1_$ctor_Z3F5C7C07((0, _Fieldfs.mapValues)(update, _.innerField_1));
+    }
+    constructor(innerField){
+        super(innerField);
+        this.innerField_1 = innerField;
+    }
+}
+function DemographicsField_Field$1_$reflection(gen0) {
+    return (0, _Reflection.class_type)("Fable.Form.Simple.Bulma.Fields.DemographicsField.DemographicsField.Field`1", [
+        gen0
+    ], DemographicsField_Field$1, (0, _Typesfs.IStandardField$3_$reflection)(gen0, _Reflection.string_type, DemographicsField_Attributes_$reflection()));
+}
+function DemographicsField_Field$1_$ctor_Z3F5C7C07(innerField) {
+    return new DemographicsField_Field$1(innerField);
+}
+function Form_demographicsField(config) {
+    return DemographicsField_form()(DemographicsField_Field$1_$ctor_Z3F5C7C07)(config);
+}
+const Form_pluginConfig = new _FormSpec.Spec_PluginFieldConfig("Fable.Form.Simple.Bulma.Fields.DemographicsField", undefined, undefined);
+const Form_PropertyKeys_IsMedicalField = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0001-4000-8000-000000000001");
+const Form_PropertyKeys_FirstName = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0002-4000-8000-000000000001");
+const Form_PropertyKeys_LastName = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0003-4000-8000-000000000001");
+const Form_PropertyKeys_Email = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0004-4000-8000-000000000001");
+const Form_PropertyKeys_Phone = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0005-4000-8000-000000000001");
+const Form_PropertyKeys_DateOfBirth = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0006-4000-8000-000000000001");
+const Form_PropertyKeys_Address = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0007-4000-8000-000000000001");
+const Form_PropertyKeys_MRN = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0008-4000-8000-000000000001");
+const Form_PropertyKeys_Insurance = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-0009-4000-8000-000000000001");
+const Form_PropertyKeys_RaceEthnicity = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-000a-4000-8000-000000000001");
+const Form_PropertyKeys_EmergencyContact = new _FormSpec.Shared_PluginPropertyKey("d0e0f0a0-000b-4000-8000-000000000001");
+function Form_isMedicalFieldProp(medicalMode) {
+    return new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_IsMedicalField, "is_medical_field", "bool", medicalMode ? "true" : "false", "Is Medical Field", undefined, "Indicates this field instance was configured in medical mode (PHI/HIPAA context)");
+}
+const Form_enhancedDemographicsConverter = new _PluginInterface.IPluginValueConverter((fieldKey, pluginValue)=>{
+    const data = pluginValue;
+    const cfg = DemographicsField_defaultConfig;
+    const props = [];
+    void props.push(Form_isMedicalFieldProp(cfg.MedicalMode));
+    if (cfg.IncludeName && data.FirstName != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_FirstName, "first_name", "string", (0, _Option.value)(data.FirstName), "First Name", undefined, undefined));
+    }
+    if (cfg.IncludeName && data.LastName != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_LastName, "last_name", "string", (0, _Option.value)(data.LastName), "Last Name", undefined, undefined));
+    }
+    if (cfg.IncludeEmail && data.Email != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Email, "email", "string", (0, _Option.value)(data.Email), "Email", undefined, undefined));
+    }
+    if (cfg.IncludePhone && data.Phone != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Phone, "phone", "string", (0, _Option.value)(data.Phone), "Phone", undefined, undefined));
+    }
+    if (cfg.IncludeDOB && data.DateOfBirth != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_DateOfBirth, "date_of_birth", "datetime", (0, _Option.value)(data.DateOfBirth), "Date of Birth", undefined, undefined));
+    }
+    if (cfg.IncludeAddress && data.Address != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Address, "address", "string", (0, _Option.value)(data.Address), "Address", undefined, undefined));
+    }
+    if (cfg.MedicalMode && cfg.IncludeMRN && data.MRN != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_MRN, "mrn", "string", (0, _Option.value)(data.MRN), "MRN", undefined, undefined));
+    }
+    if (cfg.MedicalMode && cfg.IncludeInsurance && data.Insurance != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Insurance, "insurance", "string", (0, _Option.value)(data.Insurance), "Insurance", undefined, undefined));
+    }
+    if (cfg.MedicalMode && cfg.IncludeRaceEthnicity && data.RaceEthnicity != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_RaceEthnicity, "race_ethnicity", "string", (0, _Option.value)(data.RaceEthnicity), "Race / Ethnicity", undefined, undefined));
+    }
+    if (cfg.IncludeEmergencyContact && data.EmergencyContact != null) {
+        void props.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_EmergencyContact, "emergency_contact", "string", (0, _Option.value)(data.EmergencyContact), "Emergency Contact", undefined, undefined));
+    }
+    return (0, _FormSpec.Shared_FieldValue_PluginData)((0, _Seq.toList)(props));
+}, (fieldValue)=>{
+    switch(fieldValue.tag){
+        case /* PluginData */ 3:
+            {
+                const properties = fieldValue.fields[0];
+                const getVal = (name)=>(0, _Option.filter)((v)=>!(0, _String.isNullOrWhiteSpace)(v), (0, _Option.map)((p_1)=>p_1.Value, (0, _List.tryFind)((p)=>p.Name === name, properties)));
+                return (0, _Option.some)(new DemographicsField_DemographicsData(getVal("first_name"), getVal("last_name"), getVal("email"), getVal("phone"), getVal("date_of_birth"), getVal("address"), getVal("mrn"), getVal("insurance"), getVal("race_ethnicity"), getVal("emergency_contact")));
+            }
+        case /* Single */ 0:
+            return (0, _Option.some)(DemographicsField_parseDemographicsData(fieldValue.fields[0].Value, false).Data);
+        default:
+            return undefined;
+    }
+}, ()=>undefined, ()=>(0, _List.ofArray)([
+        "is_medical_field",
+        "first_name",
+        "last_name",
+        "email",
+        "phone",
+        "date_of_birth",
+        "address",
+        "mrn",
+        "insurance",
+        "race_ethnicity",
+        "emergency_contact"
+    ]), (propertyName)=>{
+    const meta = (pk, name_1, dt, disp)=>new _FormSpec.Shared_PluginDataProperty(pk, name_1, dt, "", disp, undefined, undefined);
+    return propertyName === "is_medical_field" ? meta(Form_PropertyKeys_IsMedicalField, "is_medical_field", "bool", "Is Medical Field") : propertyName === "first_name" ? meta(Form_PropertyKeys_FirstName, "first_name", "string", "First Name") : propertyName === "last_name" ? meta(Form_PropertyKeys_LastName, "last_name", "string", "Last Name") : propertyName === "email" ? meta(Form_PropertyKeys_Email, "email", "string", "Email") : propertyName === "phone" ? meta(Form_PropertyKeys_Phone, "phone", "string", "Phone") : propertyName === "date_of_birth" ? meta(Form_PropertyKeys_DateOfBirth, "date_of_birth", "datetime", "Date of Birth") : propertyName === "address" ? meta(Form_PropertyKeys_Address, "address", "string", "Address") : propertyName === "mrn" ? meta(Form_PropertyKeys_MRN, "mrn", "string", "MRN") : propertyName === "insurance" ? meta(Form_PropertyKeys_Insurance, "insurance", "string", "Insurance") : propertyName === "race_ethnicity" ? meta(Form_PropertyKeys_RaceEthnicity, "race_ethnicity", "string", "Race / Ethnicity") : propertyName === "emergency_contact" ? meta(Form_PropertyKeys_EmergencyContact, "emergency_contact", "string", "Emergency Contact") : undefined;
+}, (propertyKey)=>(0, _Option.map)((tupledArg_1)=>{
+        const _arg_1 = tupledArg_1[1];
+        return new _FormSpec.Shared_PluginDataProperty(tupledArg_1[0], _arg_1[0], _arg_1[1], "", _arg_1[2], undefined, undefined);
+    }, (0, _List.tryFind)((tupledArg)=>(0, _Util.equals)(tupledArg[0], propertyKey), (0, _List.ofArray)([
+        [
+            Form_PropertyKeys_IsMedicalField,
+            [
+                "is_medical_field",
+                "bool",
+                "Is Medical Field"
+            ]
+        ],
+        [
+            Form_PropertyKeys_FirstName,
+            [
+                "first_name",
+                "string",
+                "First Name"
+            ]
+        ],
+        [
+            Form_PropertyKeys_LastName,
+            [
+                "last_name",
+                "string",
+                "Last Name"
+            ]
+        ],
+        [
+            Form_PropertyKeys_Email,
+            [
+                "email",
+                "string",
+                "Email"
+            ]
+        ],
+        [
+            Form_PropertyKeys_Phone,
+            [
+                "phone",
+                "string",
+                "Phone"
+            ]
+        ],
+        [
+            Form_PropertyKeys_DateOfBirth,
+            [
+                "date_of_birth",
+                "datetime",
+                "Date of Birth"
+            ]
+        ],
+        [
+            Form_PropertyKeys_Address,
+            [
+                "address",
+                "string",
+                "Address"
+            ]
+        ],
+        [
+            Form_PropertyKeys_MRN,
+            [
+                "mrn",
+                "string",
+                "MRN"
+            ]
+        ],
+        [
+            Form_PropertyKeys_Insurance,
+            [
+                "insurance",
+                "string",
+                "Insurance"
+            ]
+        ],
+        [
+            Form_PropertyKeys_RaceEthnicity,
+            [
+                "race_ethnicity",
+                "string",
+                "Race / Ethnicity"
+            ]
+        ],
+        [
+            Form_PropertyKeys_EmergencyContact,
+            [
+                "emergency_contact",
+                "string",
+                "Emergency Contact"
+            ]
+        ]
+    ]))), (propertyName_1, fieldValue_1)=>{
+    switch(fieldValue_1.tag){
+        case /* PluginData */ 3:
+            return (0, _List.tryFind)((p_2)=>p_2.Name === propertyName_1, fieldValue_1.fields[0]);
+        case /* Single */ 0:
+            {
+                const parsed_1 = DemographicsField_parseDemographicsData(fieldValue_1.fields[0].Value, false);
+                const data_1 = parsed_1.Data;
+                return propertyName_1 === "is_medical_field" ? Form_isMedicalFieldProp(parsed_1.MedicalMode) : propertyName_1 === "first_name" ? (0, _Option.map)((v_1)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_FirstName, "first_name", "string", v_1, "First Name", undefined, undefined), data_1.FirstName) : propertyName_1 === "last_name" ? (0, _Option.map)((v_2)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_LastName, "last_name", "string", v_2, "Last Name", undefined, undefined), data_1.LastName) : propertyName_1 === "email" ? (0, _Option.map)((v_3)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Email, "email", "string", v_3, "Email", undefined, undefined), data_1.Email) : propertyName_1 === "phone" ? (0, _Option.map)((v_4)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Phone, "phone", "string", v_4, "Phone", undefined, undefined), data_1.Phone) : propertyName_1 === "date_of_birth" ? (0, _Option.map)((v_5)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_DateOfBirth, "date_of_birth", "datetime", v_5, "Date of Birth", undefined, undefined), data_1.DateOfBirth) : propertyName_1 === "address" ? (0, _Option.map)((v_6)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Address, "address", "string", v_6, "Address", undefined, undefined), data_1.Address) : propertyName_1 === "mrn" ? (0, _Option.map)((v_7)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_MRN, "mrn", "string", v_7, "MRN", undefined, undefined), data_1.MRN) : propertyName_1 === "insurance" ? (0, _Option.map)((v_8)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Insurance, "insurance", "string", v_8, "Insurance", undefined, undefined), data_1.Insurance) : propertyName_1 === "race_ethnicity" ? (0, _Option.map)((v_9)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_RaceEthnicity, "race_ethnicity", "string", v_9, "Race / Ethnicity", undefined, undefined), data_1.RaceEthnicity) : propertyName_1 === "emergency_contact" ? (0, _Option.map)((v_10)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_EmergencyContact, "emergency_contact", "string", v_10, "Emergency Contact", undefined, undefined), data_1.EmergencyContact) : undefined;
+            }
+        default:
+            return undefined;
+    }
+}, (propertyKey_1, fieldValue_2)=>{
+    switch(fieldValue_2.tag){
+        case /* PluginData */ 3:
+            return (0, _List.tryFind)((p_3)=>(0, _Util.equals)(p_3.PropertyKey, propertyKey_1), fieldValue_2.fields[0]);
+        case /* Single */ 0:
+            {
+                const parsed_2 = DemographicsField_parseDemographicsData(fieldValue_2.fields[0].Value, false);
+                const data_2 = parsed_2.Data;
+                return (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_IsMedicalField) ? Form_isMedicalFieldProp(parsed_2.MedicalMode) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_FirstName) ? (0, _Option.map)((v_11)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_FirstName, "first_name", "string", v_11, "First Name", undefined, undefined), data_2.FirstName) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_LastName) ? (0, _Option.map)((v_12)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_LastName, "last_name", "string", v_12, "Last Name", undefined, undefined), data_2.LastName) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_Email) ? (0, _Option.map)((v_13)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Email, "email", "string", v_13, "Email", undefined, undefined), data_2.Email) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_Phone) ? (0, _Option.map)((v_14)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Phone, "phone", "string", v_14, "Phone", undefined, undefined), data_2.Phone) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_DateOfBirth) ? (0, _Option.map)((v_15)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_DateOfBirth, "date_of_birth", "datetime", v_15, "Date of Birth", undefined, undefined), data_2.DateOfBirth) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_Address) ? (0, _Option.map)((v_16)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Address, "address", "string", v_16, "Address", undefined, undefined), data_2.Address) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_MRN) ? (0, _Option.map)((v_17)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_MRN, "mrn", "string", v_17, "MRN", undefined, undefined), data_2.MRN) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_Insurance) ? (0, _Option.map)((v_18)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Insurance, "insurance", "string", v_18, "Insurance", undefined, undefined), data_2.Insurance) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_RaceEthnicity) ? (0, _Option.map)((v_19)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_RaceEthnicity, "race_ethnicity", "string", v_19, "Race / Ethnicity", undefined, undefined), data_2.RaceEthnicity) : (0, _Util.equals)(propertyKey_1, Form_PropertyKeys_EmergencyContact) ? (0, _Option.map)((v_20)=>new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_EmergencyContact, "emergency_contact", "string", v_20, "Emergency Contact", undefined, undefined), data_2.EmergencyContact) : undefined;
+            }
+        default:
+            return undefined;
+    }
+}, (propertyName_2, value)=>propertyName_2 === "is_medical_field" ? (0, _Result.FSharpResult$2_Error)("is_medical_field is derived from MedicalMode and cannot be set directly") : (0, _Result.FSharpResult$2_Ok)(undefined), (fieldValue_3)=>{
+    switch(fieldValue_3.tag){
+        case /* PluginData */ 3:
+            return fieldValue_3.fields[0];
+        case /* Single */ 0:
+            {
+                const parsed_3 = DemographicsField_parseDemographicsData(fieldValue_3.fields[0].Value, false);
+                const data_3 = parsed_3.Data;
+                const props_1 = [];
+                void props_1.push(Form_isMedicalFieldProp(parsed_3.MedicalMode));
+                if (data_3.FirstName != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_FirstName, "first_name", "string", (0, _Option.value)(data_3.FirstName), "First Name", undefined, undefined));
+                }
+                if (data_3.LastName != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_LastName, "last_name", "string", (0, _Option.value)(data_3.LastName), "Last Name", undefined, undefined));
+                }
+                if (data_3.Email != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Email, "email", "string", (0, _Option.value)(data_3.Email), "Email", undefined, undefined));
+                }
+                if (data_3.Phone != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Phone, "phone", "string", (0, _Option.value)(data_3.Phone), "Phone", undefined, undefined));
+                }
+                if (data_3.DateOfBirth != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_DateOfBirth, "date_of_birth", "datetime", (0, _Option.value)(data_3.DateOfBirth), "Date of Birth", undefined, undefined));
+                }
+                if (data_3.Address != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Address, "address", "string", (0, _Option.value)(data_3.Address), "Address", undefined, undefined));
+                }
+                if (parsed_3.MedicalMode && data_3.MRN != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_MRN, "mrn", "string", (0, _Option.value)(data_3.MRN), "MRN", undefined, undefined));
+                }
+                if (parsed_3.MedicalMode && data_3.Insurance != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_Insurance, "insurance", "string", (0, _Option.value)(data_3.Insurance), "Insurance", undefined, undefined));
+                }
+                if (parsed_3.MedicalMode && data_3.RaceEthnicity != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_RaceEthnicity, "race_ethnicity", "string", (0, _Option.value)(data_3.RaceEthnicity), "Race / Ethnicity", undefined, undefined));
+                }
+                if (data_3.EmergencyContact != null) {
+                    void props_1.push(new _FormSpec.Shared_PluginDataProperty(Form_PropertyKeys_EmergencyContact, "emergency_contact", "string", (0, _Option.value)(data_3.EmergencyContact), "Emergency Contact", undefined, undefined));
+                }
+                return (0, _Seq.toList)(props_1);
+            }
+        default:
+            return (0, _List.empty)();
+    }
+});
+function Form_designerPreview(props) {
+    let value, elems_2, elems, elems_1;
+    return (0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+        (value = "flex items-center justify-between rounded-lg border border-dashed border-gray-300 bg-gray-50/80 px-3 py-2", [
+            "className",
+            value
+        ]),
+        (elems_2 = [
+            (0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+                [
+                    "className",
+                    "flex flex-col gap-0.5"
+                ],
+                (elems = [
+                    (0, _react.createElement)("span", {
+                        className: "text-sm font-semibold text-gray-800",
+                        children: "Demographics"
+                    }),
+                    (0, _react.createElement)("span", {
+                        className: "text-xs text-gray-500",
+                        children: "Name, contact, DOB, and optional medical fields"
+                    })
+                ], [
+                    "children",
+                    _Interopfs.reactApi.Children.toArray(Array.from(elems))
+                ])
+            ]))),
+            (0, _react.createElement)("div", (0, _Util.createObj)((0, _List.ofArray)([
+                [
+                    "className",
+                    "flex items-center gap-2 text-gray-400"
+                ],
+                (elems_1 = [
+                    (0, _react.createElement)("span", {
+                        className: "text-base",
+                        children: "👤"
+                    }),
+                    (0, _react.createElement)("span", {
+                        className: "w-1.5 h-1.5 rounded-full bg-red-400 shrink-0"
+                    }),
+                    (0, _react.createElement)("span", {
+                        className: "text-xs",
+                        children: "🔗"
+                    })
+                ], [
+                    "children",
+                    _Interopfs.reactApi.Children.toArray(Array.from(elems_1))
+                ])
+            ])))
+        ], [
+            "children",
+            _Interopfs.reactApi.Children.toArray(Array.from(elems_2))
+        ])
+    ])));
+}
+function Form_markdownRenderer(field, fieldDetails) {
+    let value;
+    const matchValue = fieldDetails.FieldValue;
+    value = matchValue.tag === /* Single */ 0 ? matchValue.fields[0].Value : "";
+    if ((0, _String.isNullOrWhiteSpace)(value)) {
+        return `**${field.Label}:** *[No demographics recorded]*`;
+    } else {
+        try {
+            const data = DemographicsField_parseDemographicsData(value, false).Data;
+            const parts = [];
+            if (data.FirstName != null) {
+                const lastNameStr = (0, _Option.defaultArg)(data.LastName, "");
+                void parts.push(`Name: ${(0, _Option.value)(data.FirstName)} ${lastNameStr}`.trim());
+            }
+            if (data.Email != null) {
+                void parts.push(`Email: ${(0, _Option.value)(data.Email)}`);
+            }
+            if (data.Phone != null) {
+                void parts.push(`Phone: ${(0, _Option.value)(data.Phone)}`);
+            }
+            if (data.DateOfBirth != null) {
+                void parts.push(`DOB: ${(0, _Option.value)(data.DateOfBirth)}`);
+            }
+            if (data.Address != null) {
+                void parts.push(`Address: ${(0, _Option.value)(data.Address)}`);
+            }
+            if (data.MRN != null) {
+                void parts.push(`MRN: ${(0, _Option.value)(data.MRN)}`);
+            }
+            return parts.length > 0 ? `**${field.Label}**
+
+` + (0, _String.join)("\n", (0, _Seq.map)((p)=>"- " + p, parts)) : `**${field.Label}:** *[No demographics recorded]*`;
+        } catch (ex) {
+            return `**${field.Label}:** *[Error: ${ex.message}]*`;
+        }
+    }
+} //# sourceMappingURL=DemographicsField.ts.map
+
+//# sourceMappingURL=DemographicsField.js.map