@f1studio/form-spec 5.0.0-alpha.140 → 5.0.0-alpha.142

package/src/plugins/allergyfinder/src/AllergyFinderField.ts

@@ -0,0 +1,1341 @@
+import { FSharpRef, toString as toString_1, Record, Union } from "@fable-org/fable-library-js/Types.js";
+import { lambda_type, class_type, record_type, bool_type, list_type, option_type, string_type, union_type, TypeInfo } from "@fable-org/fable-library-js/Reflection.js";
+import { LabelWarnings, CountResult, AllergenInsights, OpenFdaSearchResult_$reflection, OpenFdaSearchResult, AllergyCategory_$reflection, AllergyCategory_Custom, AllergyCategory_Environmental, AllergyCategory_Food, AllergyCategory_Drug, AllergyCategory_$union } from "../../../FormSpec.FS/Integrations/OpenFda/OpenFdaTypes.js";
+import { orElseWith, unwrap, bind, map as map_2, value as value_284, some, defaultArgWith, defaultArg, Option } from "@fable-org/fable-library-js/Option.js";
+import { tryFind, length, choose, singleton as singleton_1, contains, exists, filter, append as append_1, max, truncate, isEmpty as isEmpty_1, ofArray, empty, map, FSharpList } from "@fable-org/fable-library-js/List.js";
+import { IDisposable, disposeSafe, IEnumerator, getEnumerator, equals, stringHash, int32ToString, comparePrimitives, defaultOf, createObj, uncurry2, IComparable, IEquatable } from "@fable-org/fable-library-js/Util.js";
+import { toString, list as list_7, option as option_15, object } from "../../../Thoth.Json/packages/Thoth.Json/Encode.js";
+import { fromString, IOptionalGetter, IGetters, bool, list as list_8, IRequiredGetter, string, object as object_1 } from "../../../Thoth.Json/packages/Thoth.Json/Decode.js";
+import { FSharpResult$2_Error, FSharpResult$2_Ok, FSharpResult$2_$union } from "@fable-org/fable-library-js/Result.js";
+import { ErrorReason_$union } from "../../../Thoth.Json/packages/Thoth.Json/Types.js";
+import { newGuid } from "@fable-org/fable-library-js/Guid.js";
+import { join, compare, isNullOrEmpty, isNullOrWhiteSpace } from "@fable-org/fable-library-js/String.js";
+import { mapValues, Field$3, IAttributes } from "../../../fable_modules/Fable.Form.3.0.0/Field.fs.js";
+import { Form$3, FieldConfig$4, field as field_1 } from "../../../fable_modules/Fable.Form.3.0.0/Base.fs.js";
+import { createElement } from "react";
+import React from "react";
+import { IRefValue$1, ReactElement } from "../../../fable_modules/Fable.React.Types.18.3.0/Fable.React.fs.js";
+import { reactApi } from "../../../fable_modules/Feliz.2.8.0/Interop.fs.js";
+import { PromiseBuilder__Delay_62FBFDE1, PromiseBuilder__Run_212F1D4B } from "../../../fable_modules/Fable.Promise.3.2.0/Promise.fs.js";
+import { promise } from "../../../fable_modules/Fable.Promise.3.2.0/PromiseImpl.fs.js";
+import { searchAllergens, getAllergenInsights } from "./OpenFdaClient.js";
+import { collect, empty as empty_1, map as map_1, singleton, append, delay, toList } from "@fable-org/fable-library-js/Seq.js";
+import { tryParse, float64, int32 } from "@fable-org/fable-library-js/Int32.js";
+import { IReactProperty } from "../../../fable_modules/Feliz.2.8.0/Types.fs.js";
+import { IStandardField$3_$reflection, IStandardField$3, IField$1, StandardRenderFieldConfig$2 } from "../../../fable_modules/Fable.Form.Simple.Bulma.5.0.1/Types.fs.js";
+import { Spec_FormField$1, Spec_FieldType_$union, Shared_FieldAnswer, Shared_FieldOption, Shared_FieldValue_$union, Shared_FieldKey, Shared_FieldValue_PluginData, Shared_PluginDataProperty, Shared_PluginPropertyKey, Spec_PluginFieldConfig } from "../../../FormSpec.FS/FormSpec.js";
+import { IPluginValueConverter } from "../../../FormSpec.FS/PluginInterface.js";
+import { Helpers_combineClasses } from "../../../fable_modules/Feliz.Bulma.3.0.0/ElementBuilders.fs.js";
+import { RenderPreviewProps$1 } from "../../../FormSpec.FS/Interfaces.js";
+import { FieldDetails } from "../../../FormSpec.FS/Designer.js";
+
+export type AllergyFinderField_AllergySeverity_$union = 
+    | AllergyFinderField_AllergySeverity<0>
+    | AllergyFinderField_AllergySeverity<1>
+    | AllergyFinderField_AllergySeverity<2>
+    | AllergyFinderField_AllergySeverity<3>
+    | AllergyFinderField_AllergySeverity<4>
+
+export type AllergyFinderField_AllergySeverity_$cases = {
+    0: ["Unknown", []],
+    1: ["Mild", []],
+    2: ["Moderate", []],
+    3: ["Severe", []],
+    4: ["LifeThreatening", []]
+}
+
+export function AllergyFinderField_AllergySeverity_Unknown() {
+    return new AllergyFinderField_AllergySeverity<0>(0, []);
+}
+
+export function AllergyFinderField_AllergySeverity_Mild() {
+    return new AllergyFinderField_AllergySeverity<1>(1, []);
+}
+
+export function AllergyFinderField_AllergySeverity_Moderate() {
+    return new AllergyFinderField_AllergySeverity<2>(2, []);
+}
+
+export function AllergyFinderField_AllergySeverity_Severe() {
+    return new AllergyFinderField_AllergySeverity<3>(3, []);
+}
+
+export function AllergyFinderField_AllergySeverity_LifeThreatening() {
+    return new AllergyFinderField_AllergySeverity<4>(4, []);
+}
+
+export class AllergyFinderField_AllergySeverity<Tag extends keyof AllergyFinderField_AllergySeverity_$cases> extends Union<Tag, AllergyFinderField_AllergySeverity_$cases[Tag][0]> {
+    constructor(readonly tag: Tag, readonly fields: AllergyFinderField_AllergySeverity_$cases[Tag][1]) {
+        super();
+    }
+    cases() {
+        return ["Unknown", "Mild", "Moderate", "Severe", "LifeThreatening"];
+    }
+}
+
+export function AllergyFinderField_AllergySeverity_$reflection(): TypeInfo {
+    return union_type("Fable.Form.Simple.Bulma.Fields.AllergyFinderField.AllergyFinderField.AllergySeverity", [], AllergyFinderField_AllergySeverity, () => [[], [], [], [], []]);
+}
+
+export function AllergyFinderField_severityToString(_arg: AllergyFinderField_AllergySeverity_$union): string {
+    switch (_arg.tag) {
+        case /* Mild */ 1:
+            return "mild";
+        case /* Moderate */ 2:
+            return "moderate";
+        case /* Severe */ 3:
+            return "severe";
+        case /* LifeThreatening */ 4:
+            return "life_threatening";
+        default:
+            return "unknown";
+    }
+}
+
+export function AllergyFinderField_severityFromString(_arg: string): AllergyFinderField_AllergySeverity_$union {
+    switch (_arg) {
+        case "mild":
+            return AllergyFinderField_AllergySeverity_Mild();
+        case "moderate":
+            return AllergyFinderField_AllergySeverity_Moderate();
+        case "severe":
+            return AllergyFinderField_AllergySeverity_Severe();
+        case "life_threatening":
+            return AllergyFinderField_AllergySeverity_LifeThreatening();
+        default:
+            return AllergyFinderField_AllergySeverity_Unknown();
+    }
+}
+
+export function AllergyFinderField_severityLabel(_arg: AllergyFinderField_AllergySeverity_$union): string {
+    switch (_arg.tag) {
+        case /* Mild */ 1:
+            return "Mild";
+        case /* Moderate */ 2:
+            return "Moderate";
+        case /* Severe */ 3:
+            return "Severe";
+        case /* LifeThreatening */ 4:
+            return "Life-threatening";
+        default:
+            return "Unknown";
+    }
+}
+
+export function AllergyFinderField_severityColor(_arg: AllergyFinderField_AllergySeverity_$union): string {
+    switch (_arg.tag) {
+        case /* Mild */ 1:
+            return "bg-emerald-100 text-emerald-700 border-emerald-200";
+        case /* Moderate */ 2:
+            return "bg-amber-100 text-amber-700 border-amber-200";
+        case /* Severe */ 3:
+            return "bg-orange-100 text-orange-700 border-orange-200";
+        case /* LifeThreatening */ 4:
+            return "bg-red-100 text-red-700 border-red-200";
+        default:
+            return "bg-slate-100 text-slate-600 border-slate-200";
+    }
+}
+
+export function AllergyFinderField_severityBorderColor(_arg: AllergyFinderField_AllergySeverity_$union): string {
+    switch (_arg.tag) {
+        case /* Mild */ 1:
+            return "border-l-emerald-400";
+        case /* Moderate */ 2:
+            return "border-l-amber-400";
+        case /* Severe */ 3:
+            return "border-l-orange-500";
+        case /* LifeThreatening */ 4:
+            return "border-l-red-500";
+        default:
+            return "border-l-slate-400";
+    }
+}
+
+export function AllergyFinderField_categoryToString(cat: AllergyCategory_$union): string {
+    switch (cat.tag) {
+        case /* Food */ 1:
+            return "food";
+        case /* Environmental */ 2:
+            return "environmental";
+        case /* Custom */ 3:
+            return "custom";
+        default:
+            return "drug";
+    }
+}
+
+export function AllergyFinderField_categoryFromString(_arg: string): AllergyCategory_$union {
+    switch (_arg) {
+        case "drug":
+            return AllergyCategory_Drug();
+        case "food":
+            return AllergyCategory_Food();
+        case "environmental":
+            return AllergyCategory_Environmental();
+        default:
+            return AllergyCategory_Custom();
+    }
+}
+
+export function AllergyFinderField_categoryLabel(cat: AllergyCategory_$union): string {
+    switch (cat.tag) {
+        case /* Food */ 1:
+            return "Food";
+        case /* Environmental */ 2:
+            return "Environmental";
+        case /* Custom */ 3:
+            return "Other";
+        default:
+            return "Drug";
+    }
+}
+
+export class AllergyFinderField_AllergyEntry extends Record implements IEquatable<AllergyFinderField_AllergyEntry>, IComparable<AllergyFinderField_AllergyEntry> {
+    readonly Id: string;
+    readonly Name: string;
+    readonly SubstanceName: string;
+    readonly NdcCode: Option<string>;
+    readonly Category: AllergyCategory_$union;
+    readonly Severity: AllergyFinderField_AllergySeverity_$union;
+    readonly Reactions: FSharpList<string>;
+    readonly Remedy: Option<string>;
+    readonly OnsetTiming: Option<string>;
+    readonly StaffOnly: boolean;
+    readonly Notes: Option<string>;
+    constructor(Id: string, Name: string, SubstanceName: string, NdcCode: Option<string>, Category: AllergyCategory_$union, Severity: AllergyFinderField_AllergySeverity_$union, Reactions: FSharpList<string>, Remedy: Option<string>, OnsetTiming: Option<string>, StaffOnly: boolean, Notes: Option<string>) {
+        super();
+        this.Id = Id;
+        this.Name = Name;
+        this.SubstanceName = SubstanceName;
+        this.NdcCode = NdcCode;
+        this.Category = Category;
+        this.Severity = Severity;
+        this.Reactions = Reactions;
+        this.Remedy = Remedy;
+        this.OnsetTiming = OnsetTiming;
+        this.StaffOnly = StaffOnly;
+        this.Notes = Notes;
+    }
+}
+
+export function AllergyFinderField_AllergyEntry_$reflection(): TypeInfo {
+    return record_type("Fable.Form.Simple.Bulma.Fields.AllergyFinderField.AllergyFinderField.AllergyEntry", [], AllergyFinderField_AllergyEntry, () => [["Id", string_type], ["Name", string_type], ["SubstanceName", string_type], ["NdcCode", option_type(string_type)], ["Category", AllergyCategory_$reflection()], ["Severity", AllergyFinderField_AllergySeverity_$reflection()], ["Reactions", list_type(string_type)], ["Remedy", option_type(string_type)], ["OnsetTiming", option_type(string_type)], ["StaffOnly", bool_type], ["Notes", option_type(string_type)]]);
+}
+
+export const AllergyFinderField_commonReactions: string[] = ["Rash", "Hives", "Itching", "Swelling", "Nausea", "Vomiting", "Diarrhea", "Difficulty Breathing", "Wheezing", "Anaphylaxis", "Dizziness", "Headache", "Fever", "Joint Pain", "Congestion", "Sneezing", "Watery Eyes"];
+
+function AllergyFinderField_allergyEncoder(a: AllergyFinderField_AllergyEntry): any {
+    return object([["id", a.Id] as [string, any], ["name", a.Name] as [string, any], ["substanceName", a.SubstanceName] as [string, any], ["ndcCode", option_15<string>((value_3: string): any => value_3)(a.NdcCode)] as [string, any], ["category", AllergyFinderField_categoryToString(a.Category)] as [string, any], ["severity", AllergyFinderField_severityToString(a.Severity)] as [string, any], ["reactions", list_7(map<string, any>((value_7: string): any => value_7, a.Reactions))] as [string, any], ["remedy", option_15<string>((value_9: string): any => value_9)(a.Remedy)] as [string, any], ["onsetTiming", option_15<string>((value_11: string): any => value_11)(a.OnsetTiming)] as [string, any], ["staffOnly", a.StaffOnly] as [string, any], ["notes", option_15<string>((value_14: string): any => value_14)(a.Notes)] as [string, any]]);
+}
+
+const AllergyFinderField_allergyDecoder = (path_13: string): ((arg0: any) => FSharpResult$2_$union<AllergyFinderField_AllergyEntry, [string, ErrorReason_$union]>) => ((v: any): FSharpResult$2_$union<AllergyFinderField_AllergyEntry, [string, ErrorReason_$union]> => object_1<AllergyFinderField_AllergyEntry>((get$: IGetters): AllergyFinderField_AllergyEntry => {
+    let objectArg: IOptionalGetter, copyOfStruct: string, objectArg_1: IRequiredGetter, objectArg_2: IOptionalGetter, objectArg_4: IOptionalGetter, objectArg_5: IOptionalGetter, objectArg_6: IOptionalGetter, objectArg_7: IOptionalGetter, objectArg_8: IOptionalGetter, objectArg_9: IOptionalGetter, objectArg_10: IOptionalGetter, objectArg_11: IOptionalGetter;
+    return new AllergyFinderField_AllergyEntry(defaultArg((objectArg = get$.Optional, objectArg.Field<string>("id", string)), (copyOfStruct = newGuid(), copyOfStruct)), (objectArg_1 = get$.Required, objectArg_1.Field<string>("name", string)), defaultArgWith<string>((objectArg_2 = get$.Optional, objectArg_2.Field<string>("substanceName", string)), (): string => {
+        const objectArg_3: IRequiredGetter = get$.Required;
+        return objectArg_3.Field<string>("name", string);
+    }), (objectArg_4 = get$.Optional, objectArg_4.Field<string>("ndcCode", string)), AllergyFinderField_categoryFromString(defaultArg((objectArg_5 = get$.Optional, objectArg_5.Field<string>("category", string)), "drug")), AllergyFinderField_severityFromString(defaultArg((objectArg_6 = get$.Optional, objectArg_6.Field<string>("severity", string)), "unknown")), defaultArg((objectArg_7 = get$.Optional, objectArg_7.Field<FSharpList<string>>("reactions", (path_8: string, value_11: any): FSharpResult$2_$union<FSharpList<string>, [string, ErrorReason_$union]> => list_8<string>(string, path_8, value_11))), empty<string>()), (objectArg_8 = get$.Optional, objectArg_8.Field<string>("remedy", string)), (objectArg_9 = get$.Optional, objectArg_9.Field<string>("onsetTiming", string)), defaultArg((objectArg_10 = get$.Optional, objectArg_10.Field<boolean>("staffOnly", bool)), false), (objectArg_11 = get$.Optional, objectArg_11.Field<string>("notes", string)));
+}, path_13, v));
+
+export function AllergyFinderField_serializeAllergies(allergies: FSharpList<AllergyFinderField_AllergyEntry>): string {
+    return toString(0, list_7(map<AllergyFinderField_AllergyEntry, any>(AllergyFinderField_allergyEncoder, allergies)));
+}
+
+export function AllergyFinderField_parseAllergies(value: string): FSharpList<AllergyFinderField_AllergyEntry> {
+    if (isNullOrWhiteSpace(value) ? true : (value === "[]")) {
+        return empty<AllergyFinderField_AllergyEntry>();
+    }
+    else {
+        const matchValue: FSharpResult$2_$union<FSharpList<AllergyFinderField_AllergyEntry>, string> = fromString<FSharpList<AllergyFinderField_AllergyEntry>>((path: string, value_1: any): FSharpResult$2_$union<FSharpList<AllergyFinderField_AllergyEntry>, [string, ErrorReason_$union]> => list_8<AllergyFinderField_AllergyEntry>(uncurry2(AllergyFinderField_allergyDecoder), path, value_1), value);
+        if (matchValue.tag === /* Error */ 1) {
+            const err: string = matchValue.fields[0];
+            console.warn(some("AllergyFinder: failed to decode allergies:"), err);
+            return empty<AllergyFinderField_AllergyEntry>();
+        }
+        else {
+            return matchValue.fields[0];
+        }
+    }
+}
+
+export class AllergyFinderField_Attributes extends Record implements IAttributes {
+    readonly FieldId: string;
+    readonly Label: string;
+    readonly ApiFetch: ((arg0: string) => Promise<string>);
+    constructor(FieldId: string, Label: string, ApiFetch: ((arg0: string) => Promise<string>)) {
+        super();
+        this.FieldId = FieldId;
+        this.Label = Label;
+        this.ApiFetch = ApiFetch;
+    }
+    GetFieldId(): string {
+        const this$: AllergyFinderField_Attributes = this;
+        return this$.FieldId;
+    }
+}
+
+export function AllergyFinderField_Attributes_$reflection(): TypeInfo {
+    return record_type("Fable.Form.Simple.Bulma.Fields.AllergyFinderField.AllergyFinderField.Attributes", [], AllergyFinderField_Attributes, () => [["FieldId", string_type], ["Label", string_type], ["ApiFetch", lambda_type(string_type, class_type("Fable.Core.JS.Promise`1", [string_type]))]]);
+}
+
+export function AllergyFinderField_form<Values, Field, Output>(): ((arg0: ((arg0: Field$3<AllergyFinderField_Attributes, string, Values>) => Field)) => ((arg0: FieldConfig$4<AllergyFinderField_Attributes, string, Values, Output>) => Form$3<Values, Output, Field>)) {
+    return (build: ((arg0: Field$3<AllergyFinderField_Attributes, string, Values>) => Field)): ((arg0: FieldConfig$4<AllergyFinderField_Attributes, string, Values, Output>) => Form$3<Values, Output, Field>) => ((config: FieldConfig$4<AllergyFinderField_Attributes, string, Values, Output>): Form$3<Values, Output, Field> => field_1<string, AllergyFinderField_Attributes, Values, Field, Output>((v: string): boolean => {
+        if (isNullOrEmpty(v)) {
+            return true;
+        }
+        else {
+            return v === "[]";
+        }
+    }, build, config));
+}
+
+export type AllergyFinderField_DetailModalState_$union = 
+    | AllergyFinderField_DetailModalState<0>
+    | AllergyFinderField_DetailModalState<1>
+    | AllergyFinderField_DetailModalState<2>
+
+export type AllergyFinderField_DetailModalState_$cases = {
+    0: ["Closed", []],
+    1: ["Adding", [Option<OpenFdaSearchResult>]],
+    2: ["Editing", [AllergyFinderField_AllergyEntry]]
+}
+
+export function AllergyFinderField_DetailModalState_Closed() {
+    return new AllergyFinderField_DetailModalState<0>(0, []);
+}
+
+export function AllergyFinderField_DetailModalState_Adding(Item: Option<OpenFdaSearchResult>) {
+    return new AllergyFinderField_DetailModalState<1>(1, [Item]);
+}
+
+export function AllergyFinderField_DetailModalState_Editing(Item: AllergyFinderField_AllergyEntry) {
+    return new AllergyFinderField_DetailModalState<2>(2, [Item]);
+}
+
+export class AllergyFinderField_DetailModalState<Tag extends keyof AllergyFinderField_DetailModalState_$cases> extends Union<Tag, AllergyFinderField_DetailModalState_$cases[Tag][0]> {
+    constructor(readonly tag: Tag, readonly fields: AllergyFinderField_DetailModalState_$cases[Tag][1]) {
+        super();
+    }
+    cases() {
+        return ["Closed", "Adding", "Editing"];
+    }
+}
+
+export function AllergyFinderField_DetailModalState_$reflection(): TypeInfo {
+    return union_type("Fable.Form.Simple.Bulma.Fields.AllergyFinderField.AllergyFinderField.DetailModalState", [], AllergyFinderField_DetailModalState, () => [[], [["Item", option_type(OpenFdaSearchResult_$reflection())]], [["Item", AllergyFinderField_AllergyEntry_$reflection()]]]);
+}
+
+/**
+ * Severity badge
+ */
+export function AllergyFinderField_SeverityBadge(allergyFinderField_SeverityBadgeInputProps: any): ReactElement {
+    const severity: AllergyFinderField_AllergySeverity_$union = allergyFinderField_SeverityBadgeInputProps.severity;
+    return createElement<any>("span", {
+        className: `inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium border ${AllergyFinderField_severityColor(severity)}`,
+        children: AllergyFinderField_severityLabel(severity),
+    });
+}
+
+/**
+ * Category badge
+ */
+export function AllergyFinderField_CategoryBadge(allergyFinderField_CategoryBadgeInputProps: any): ReactElement {
+    let value: string;
+    const category: AllergyCategory_$union = allergyFinderField_CategoryBadgeInputProps.category;
+    return createElement<any>("span", createObj(ofArray([(value = "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium bg-blue-50 text-blue-700 border border-blue-200", ["className", value] as [string, any]), ["children", AllergyFinderField_categoryLabel(category)] as [string, any]])));
+}
+
+export function AllergyFinderField_FdaInsightsPanel(allergyFinderField_FdaInsightsPanelInputProps: any): ReactElement {
+    let ins: AllergenInsights, elems_5: Iterable<ReactElement>;
+    const substanceName: string = allergyFinderField_FdaInsightsPanelInputProps.substanceName;
+    const apiFetch: ((arg0: string) => Promise<string>) = allergyFinderField_FdaInsightsPanelInputProps.apiFetch;
+    const patternInput: [Option<AllergenInsights>, ((arg0: Option<AllergenInsights>) => void)] = reactApi.useState<Option<AllergenInsights>, Option<AllergenInsights>>(undefined);
+    const insights: Option<AllergenInsights> = patternInput[0];
+    const patternInput_1: [boolean, ((arg0: boolean) => void)] = reactApi.useState<boolean, boolean>(true);
+    const setLoading: ((arg0: boolean) => void) = patternInput_1[1];
+    const dependencies: any[] = [substanceName];
+    reactApi.useEffect((): void => {
+        setLoading(true);
+        const pr: Promise<void> = PromiseBuilder__Run_212F1D4B<void>(promise, PromiseBuilder__Delay_62FBFDE1<void>(promise, (): Promise<void> => (getAllergenInsights(apiFetch, substanceName).then((_arg: AllergenInsights): Promise<void> => {
+            patternInput[1](_arg);
+            setLoading(false);
+            return Promise.resolve();
+        }))));
+        void pr;
+    }, dependencies);
+    if (patternInput_1[0]) {
+        return createElement<any>("div", {
+            className: "rounded-lg border border-slate-200 bg-slate-50 p-3 text-sm text-slate-500",
+            children: "Loading FDA insights...",
+        });
+    }
+    else if (insights != null) {
+        if ((ins = value_284(insights), isEmpty_1(ins.Reactions) && (ins.LabelWarnings == null))) {
+            const ins_1: AllergenInsights = value_284(insights);
+            return defaultOf();
+        }
+        else {
+            const ins_2: AllergenInsights = value_284(insights);
+            return createElement<any>("div", createObj(ofArray([["className", "rounded-lg border border-slate-200 bg-slate-50 p-3 space-y-3"] as [string, any], (elems_5 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("div", {
+                className: "text-xs font-semibold uppercase tracking-wide text-slate-500",
+                children: "FDA Insights",
+            })), delay<ReactElement>((): Iterable<ReactElement> => {
+                let top5: FSharpList<CountResult>, maxCount: float64, elems_2: Iterable<ReactElement>;
+                return append<ReactElement>(!isEmpty_1(ins_2.Reactions) ? ((top5 = truncate<CountResult>(5, ins_2.Reactions), (maxCount = max<int32>(map<CountResult, int32>((r: CountResult): int32 => r.Count, top5), {
+                    Compare: comparePrimitives,
+                }), singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-1"] as [string, any], (elems_2 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("div", {
+                    className: "text-xs font-medium text-slate-600 mb-1",
+                    children: `Top Adverse Reactions (FAERS) — ${ins_2.TotalEvents} total reports`,
+                })), delay<ReactElement>((): Iterable<ReactElement> => map_1<CountResult, ReactElement>((r_1: CountResult): ReactElement => {
+                    let elems_1: Iterable<ReactElement>, elems: Iterable<ReactElement>;
+                    return createElement<any>("div", createObj(ofArray([["className", "flex items-center gap-2"] as [string, any], (elems_1 = [createElement<any>("div", {
+                        className: "w-28 text-xs text-slate-600 truncate",
+                        children: r_1.Term,
+                    }), createElement<any>("div", createObj(ofArray([["className", "flex-1 bg-slate-200 rounded-full h-2"] as [string, any], (elems = [createElement<any>("div", {
+                        className: "bg-blue-500 rounded-full h-2",
+                        style: {
+                            width: ((r_1.Count / maxCount) * 100) + "%",
+                        },
+                    })], ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])]))), createElement<any>("div", {
+                        className: "w-12 text-xs text-slate-500 text-right",
+                        children: int32ToString(r_1.Count),
+                    })], ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any])])));
+                }, top5))))), ["children", reactApi.Children.toArray(Array.from(elems_2))] as [string, any])]))))))) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => {
+                    let matchValue_2: Option<string>, c: string, c_1: string, elems_3: Iterable<ReactElement>;
+                    const matchValue_1: Option<LabelWarnings> = ins_2.LabelWarnings;
+                    if (matchValue_1 == null) {
+                        return empty_1<ReactElement>();
+                    }
+                    else {
+                        const warnings: LabelWarnings = value_284(matchValue_1);
+                        return append<ReactElement>((matchValue_2 = warnings.Contraindications, (matchValue_2 != null) ? (((c = value_284(matchValue_2), c.length > 0)) ? ((c_1 = value_284(matchValue_2), singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "text-xs space-y-1"] as [string, any], (elems_3 = [createElement<any>("div", {
+                            className: "font-semibold text-slate-600",
+                            children: "Contraindications",
+                        }), createElement<any>("div", {
+                            className: "text-slate-500 line-clamp-3",
+                            children: c_1,
+                        })], ["children", reactApi.Children.toArray(Array.from(elems_3))] as [string, any])])))))) : (empty_1<ReactElement>())) : (empty_1<ReactElement>())), delay<ReactElement>((): Iterable<ReactElement> => {
+                            let elems_4: Iterable<ReactElement>, w: string;
+                            const matchValue_3: Option<string> = warnings.Warnings;
+                            let matchResult: int32, w_1: string;
+                            if (matchValue_3 != null) {
+                                if ((w = value_284(matchValue_3), w.length > 0)) {
+                                    matchResult = 0;
+                                    w_1 = value_284(matchValue_3);
+                                }
+                                else {
+                                    matchResult = 1;
+                                }
+                            }
+                            else {
+                                matchResult = 1;
+                            }
+                            switch (matchResult) {
+                                case 0:
+                                    return singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "text-xs space-y-1"] as [string, any], (elems_4 = [createElement<any>("div", {
+                                        className: "font-semibold text-slate-600",
+                                        children: "Warnings",
+                                    }), createElement<any>("div", {
+                                        className: "text-slate-500 line-clamp-3",
+                                        children: w_1!,
+                                    })], ["children", reactApi.Children.toArray(Array.from(elems_4))] as [string, any])]))));
+                                default: {
+                                    return empty_1<ReactElement>();
+                                }
+                            }
+                        }));
+                    }
+                }));
+            })))), ["children", reactApi.Children.toArray(Array.from(elems_5))] as [string, any])])));
+        }
+    }
+    else {
+        return defaultOf();
+    }
+}
+
+export function AllergyFinderField_ReactionCheckboxes(allergyFinderField_ReactionCheckboxesInputProps: any): ReactElement {
+    let elems_3: Iterable<ReactElement>, elems_1: Iterable<ReactElement>, elems_2: Iterable<ReactElement>, value_16: string;
+    const onChange: ((arg0: FSharpList<string>) => void) = allergyFinderField_ReactionCheckboxesInputProps.onChange;
+    const selected: FSharpList<string> = allergyFinderField_ReactionCheckboxesInputProps.selected;
+    const substanceName: Option<string> = allergyFinderField_ReactionCheckboxesInputProps.substanceName;
+    const apiFetch: ((arg0: string) => Promise<string>) = allergyFinderField_ReactionCheckboxesInputProps.apiFetch;
+    const patternInput: [FSharpList<string>, ((arg0: FSharpList<string>) => void)] = reactApi.useState<FSharpList<string>, FSharpList<string>>(empty<string>());
+    const fdaReactions: FSharpList<string> = patternInput[0];
+    const patternInput_1: [string, ((arg0: string) => void)] = reactApi.useState<string, string>("");
+    const setCustomReaction: ((arg0: string) => void) = patternInput_1[1];
+    const customReaction: string = patternInput_1[0];
+    const dependencies: any[] = [substanceName];
+    reactApi.useEffect((): void => {
+        let sub: string;
+        let matchResult: int32, sub_1: string;
+        if (substanceName != null) {
+            if ((sub = value_284(substanceName), sub.length > 0)) {
+                matchResult = 0;
+                sub_1 = value_284(substanceName);
+            }
+            else {
+                matchResult = 1;
+            }
+        }
+        else {
+            matchResult = 1;
+        }
+        switch (matchResult) {
+            case 0: {
+                const pr: Promise<void> = PromiseBuilder__Run_212F1D4B<void>(promise, PromiseBuilder__Delay_62FBFDE1<void>(promise, (): Promise<void> => (getAllergenInsights(apiFetch, sub_1!).then((_arg: AllergenInsights): Promise<void> => {
+                    patternInput[1](map<CountResult, string>((r: CountResult): string => r.Term, truncate<CountResult>(8, _arg.Reactions)));
+                    return Promise.resolve();
+                }))));
+                void pr;
+                break;
+            }
+            case 1: {
+                break;
+            }
+        }
+    }, dependencies);
+    const allReactions: FSharpList<[string, boolean]> = append_1(map<string, [string, boolean]>((r_1: string): [string, boolean] => ([r_1, true] as [string, boolean]), fdaReactions), map<string, [string, boolean]>((r_2: string): [string, boolean] => ([r_2, false] as [string, boolean]), filter<string>((c: string): boolean => !exists<string>((f: string): boolean => (compare(f, c, 5) === 0), fdaReactions), ofArray<string>(AllergyFinderField_commonReactions))));
+    const addCustomReaction = (): void => {
+        const trimmed: string = customReaction.trim();
+        if ((trimmed.length > 0) && !contains<string>(trimmed, selected, {
+            Equals: (x_1: string, y_1: string): boolean => (x_1 === y_1),
+            GetHashCode: stringHash,
+        })) {
+            onChange(append_1(selected, singleton_1(trimmed)));
+            setCustomReaction("");
+        }
+    };
+    return createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems_3 = [createElement<any>("label", {
+        className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+        children: "Reactions",
+    }), createElement<any>("div", createObj(ofArray([["className", "flex flex-wrap gap-2"] as [string, any], (elems_1 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => collect<[string, boolean], Iterable<ReactElement>, ReactElement>((matchValue: [string, boolean]): Iterable<ReactElement> => {
+        let elems: Iterable<ReactElement>;
+        const reaction_1: string = matchValue[0];
+        const isChecked: boolean = contains<string>(reaction_1, selected, {
+            Equals: (x_2: string, y_2: string): boolean => (x_2 === y_2),
+            GetHashCode: stringHash,
+        });
+        return singleton<ReactElement>(createElement<any>("button", createObj(ofArray([["className", isChecked ? "rounded-full px-2.5 py-1 text-xs font-medium border bg-blue-100 text-blue-700 border-blue-300" : "rounded-full px-2.5 py-1 text-xs font-medium border bg-white text-slate-600 border-slate-200 hover:bg-slate-50"] as [string, any], ["onClick", (_arg_1: MouseEvent): void => {
+            const reaction: string = reaction_1;
+            if (contains<string>(reaction, selected, {
+                Equals: (x: string, y: string): boolean => (x === y),
+                GetHashCode: stringHash,
+            })) {
+                onChange(filter<string>((r_3: string): boolean => (r_3 !== reaction), selected));
+            }
+            else {
+                onChange(append_1(selected, singleton_1(reaction)));
+            }
+        }] as [string, any], (elems = [(matchValue[1] && !isChecked) ? (`* ${reaction_1}`) : reaction_1], ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])]))));
+    }, allReactions))), ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any])]))), createElement<any>("div", createObj(ofArray([["className", "flex gap-2"] as [string, any], (elems_2 = [createElement<any>("input", createObj(ofArray([(value_16 = "flex-1 rounded-md border border-slate-300 px-2.5 py-1.5 text-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30", ["className", value_16] as [string, any]), ["placeholder", "Add custom reaction..."] as [string, any], ["value", customReaction] as [string, any], ["onChange", (ev: Event): void => {
+        setCustomReaction(ev.target.value);
+    }] as [string, any], ["onKeyDown", (e: KeyboardEvent): void => {
+        if (e.key === "Enter") {
+            e.preventDefault();
+            addCustomReaction();
+        }
+    }] as [string, any]]))), createElement<any>("button", {
+        className: "rounded-md bg-slate-100 px-3 py-1.5 text-sm font-medium text-slate-600 hover:bg-slate-200",
+        children: "Add",
+        onClick: (_arg_2: MouseEvent): void => {
+            addCustomReaction();
+        },
+    })], ["children", reactApi.Children.toArray(Array.from(elems_2))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_3))] as [string, any])])));
+}
+
+export function AllergyFinderField_AllergyDetailModal(allergyFinderField_AllergyDetailModalInputProps: any): ReactElement {
+    let elems_14: Iterable<ReactElement>, elems_13: Iterable<ReactElement>, elems_28: Iterable<ReactElement>, elems_27: Iterable<ReactElement>;
+    const onSave: ((arg0: AllergyFinderField_AllergyEntry) => void) = allergyFinderField_AllergyDetailModalInputProps.onSave;
+    const onClose: (() => void) = allergyFinderField_AllergyDetailModalInputProps.onClose;
+    const modalState: AllergyFinderField_DetailModalState_$union = allergyFinderField_AllergyDetailModalInputProps.modalState;
+    const apiFetch: ((arg0: string) => Promise<string>) = allergyFinderField_AllergyDetailModalInputProps.apiFetch;
+    switch (modalState.tag) {
+        case /* Adding */ 1: {
+            const fdaResult: Option<OpenFdaSearchResult> = modalState.fields[0];
+            const initialName: string = defaultArg(map_2<OpenFdaSearchResult, string>((r: OpenFdaSearchResult): string => r.Name, fdaResult), "");
+            const initialSubstance: string = defaultArg(map_2<OpenFdaSearchResult, string>((r_1: OpenFdaSearchResult): string => r_1.SubstanceName, fdaResult), "");
+            const initialCategory: AllergyCategory_$union = defaultArg(map_2<OpenFdaSearchResult, AllergyCategory_$union>((r_2: OpenFdaSearchResult): AllergyCategory_$union => r_2.Category, fdaResult), AllergyCategory_Drug());
+            const initialNdc: Option<string> = bind<OpenFdaSearchResult, string>((r_3: OpenFdaSearchResult): Option<string> => r_3.NdcCode, fdaResult);
+            const patternInput: [string, ((arg0: string) => void)] = reactApi.useState<string, string>(initialName);
+            const name: string = patternInput[0];
+            const patternInput_1: [AllergyFinderField_AllergySeverity_$union, ((arg0: AllergyFinderField_AllergySeverity_$union) => void)] = reactApi.useState<AllergyFinderField_AllergySeverity_$union, AllergyFinderField_AllergySeverity_$union>(AllergyFinderField_AllergySeverity_Moderate());
+            const severity: AllergyFinderField_AllergySeverity_$union = patternInput_1[0];
+            const patternInput_2: [FSharpList<string>, ((arg0: FSharpList<string>) => void)] = reactApi.useState<FSharpList<string>, FSharpList<string>>(empty<string>());
+            const reactions: FSharpList<string> = patternInput_2[0];
+            const patternInput_3: [string, ((arg0: string) => void)] = reactApi.useState<string, string>("");
+            const remedy: string = patternInput_3[0];
+            const patternInput_4: [string, ((arg0: string) => void)] = reactApi.useState<string, string>("unknown");
+            const onset: string = patternInput_4[0];
+            const patternInput_5: [boolean, ((arg0: boolean) => void)] = reactApi.useState<boolean, boolean>(false);
+            const staffOnly: boolean = patternInput_5[0];
+            const patternInput_6: [string, ((arg0: string) => void)] = reactApi.useState<string, string>("");
+            const notes: string = patternInput_6[0];
+            const meta: string = defaultArg(map_2<OpenFdaSearchResult, string>((r_4: OpenFdaSearchResult): string => join(" · ", choose<Option<string>, string>((x: Option<string>): Option<string> => x, ofArray([r_4.DosageForm, r_4.Route, r_4.Strength]))), fdaResult), "");
+            const provenance: string = defaultArg(map_2<OpenFdaSearchResult, string>((r_5: OpenFdaSearchResult): string => join(" · ", choose<Option<string>, string>((x_1: Option<string>): Option<string> => x_1, ofArray([r_5.Manufacturer, map_2<string, string>((n: string): string => (`NDC ${n}`), r_5.NdcCode)]))), fdaResult), "");
+            return createElement<any>("div", createObj(ofArray([["className", "fixed inset-0 z-50 flex items-center justify-center bg-black/50"] as [string, any], ["onClick", (e: MouseEvent): void => {
+                if (equals(e.target, e.currentTarget)) {
+                    onClose();
+                }
+            }] as [string, any], (elems_14 = [createElement<any>("div", createObj(ofArray([["className", "bg-white rounded-xl shadow-xl max-w-lg w-full max-h-[90vh] overflow-y-auto mx-4 p-5 space-y-4"] as [string, any], ["onClick", (e_1: MouseEvent): void => {
+                e_1.stopPropagation();
+            }] as [string, any], (elems_13 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => {
+                let elems: Iterable<ReactElement>;
+                return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex items-center justify-between"] as [string, any], (elems = [createElement<any>("h3", {
+                    className: "text-lg font-semibold text-slate-900",
+                    children: "Add Allergy",
+                }), createElement<any>("button", {
+                    className: "text-slate-400 hover:text-slate-600 text-xl",
+                    dangerouslySetInnerHTML: {
+                        __html: "&times;",
+                    },
+                    onClick: (_arg: MouseEvent): void => {
+                        onClose();
+                    },
+                })], ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                    let matchValue: Option<OpenFdaSearchResult>, elems_3: Iterable<ReactElement>, value_50: string, r_6: OpenFdaSearchResult, elems_2: Iterable<ReactElement>;
+                    return append<ReactElement>((matchValue = fdaResult, (matchValue == null) ? singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-1"] as [string, any], (elems_3 = [createElement<any>("label", {
+                        className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                        children: "Allergen Name",
+                    }), createElement<any>("input", createObj(ofArray([(value_50 = "w-full rounded-md border border-slate-300 px-2.5 py-1.5 text-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30", ["className", value_50] as [string, any]), ["value", name] as [string, any], ["onChange", (ev: Event): void => {
+                        patternInput[1](ev.target.value);
+                    }] as [string, any], ["placeholder", "Enter allergen name"] as [string, any]])))], ["children", reactApi.Children.toArray(Array.from(elems_3))] as [string, any])])))) : ((r_6 = value_284(matchValue), singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "rounded-lg border border-slate-200 bg-slate-50 p-3 space-y-1"] as [string, any], (elems_2 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => {
+                        let elems_1: Iterable<ReactElement>;
+                        return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex items-start justify-between gap-2"] as [string, any], (elems_1 = [createElement<any>("span", {
+                            className: "font-semibold text-sm text-slate-900",
+                            children: name,
+                        }), createElement(AllergyFinderField_CategoryBadge, {
+                            category: initialCategory,
+                        })], ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((initialSubstance !== name) ? singleton<ReactElement>(createElement<any>("p", {
+                            className: "text-xs text-slate-500",
+                            children: initialSubstance,
+                        })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((meta.length > 0) ? singleton<ReactElement>(createElement<any>("p", {
+                            className: "text-[11px] text-slate-400",
+                            children: meta,
+                        })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => ((provenance.length > 0) ? singleton<ReactElement>(createElement<any>("p", {
+                            className: "text-[11px] text-slate-400",
+                            children: provenance,
+                        })) : empty_1<ReactElement>())))))));
+                    })), ["children", reactApi.Children.toArray(Array.from(elems_2))] as [string, any])]))))))), delay<ReactElement>((): Iterable<ReactElement> => {
+                        let elems_4: Iterable<ReactElement>;
+                        return append<ReactElement>(singleton<ReactElement>(createElement<any>("label", createObj(ofArray([["className", "flex items-center gap-2 text-sm cursor-pointer"] as [string, any], (elems_4 = [createElement<any>("input", {
+                            type: "checkbox",
+                            checked: staffOnly,
+                            onChange: (ev_1: Event): void => {
+                                const _arg_1: boolean = ev_1.target.checked;
+                                patternInput_5[1](!staffOnly);
+                            },
+                            className: "rounded border-slate-300",
+                        }), "Medical Staff Only"], ["children", reactApi.Children.toArray(Array.from(elems_4))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                            let elems_6: Iterable<ReactElement>, elems_5: Iterable<ReactElement>;
+                            return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems_6 = [createElement<any>("label", {
+                                className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                children: "Severity",
+                            }), createElement<any>("div", createObj(ofArray([["className", "flex flex-wrap gap-2"] as [string, any], (elems_5 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => collect<AllergyFinderField_AllergySeverity_$union, Iterable<ReactElement>, ReactElement>((sev: AllergyFinderField_AllergySeverity_$union): Iterable<ReactElement> => singleton<ReactElement>(createElement<any>("button", {
+                                className: equals(severity, sev) ? (`rounded-full px-3 py-1 text-xs font-medium border-2 ${AllergyFinderField_severityColor(sev)}`) : "rounded-full px-3 py-1 text-xs font-medium border border-slate-200 bg-white text-slate-600 hover:bg-slate-50",
+                                onClick: (_arg_2: MouseEvent): void => {
+                                    patternInput_1[1](sev);
+                                },
+                                children: AllergyFinderField_severityLabel(sev),
+                            })), [AllergyFinderField_AllergySeverity_Unknown(), AllergyFinderField_AllergySeverity_Mild(), AllergyFinderField_AllergySeverity_Moderate(), AllergyFinderField_AllergySeverity_Severe(), AllergyFinderField_AllergySeverity_LifeThreatening()]))), ["children", reactApi.Children.toArray(Array.from(elems_5))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_6))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                                const substanceForInsights: Option<string> = (initialCategory.tag === /* Drug */ 0) ? ((initialSubstance.length > 0) ? initialSubstance : undefined) : ((initialCategory.tag === /* Environmental */ 2) ? ((initialSubstance.length > 0) ? initialSubstance : undefined) : undefined);
+                                return append<ReactElement>(singleton<ReactElement>(createElement(AllergyFinderField_ReactionCheckboxes, {
+                                    apiFetch: apiFetch,
+                                    substanceName: unwrap(substanceForInsights),
+                                    selected: reactions,
+                                    onChange: patternInput_2[1],
+                                })), delay<ReactElement>((): Iterable<ReactElement> => {
+                                    let elems_7: Iterable<ReactElement>, value_89: string;
+                                    return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-1"] as [string, any], (elems_7 = [createElement<any>("label", {
+                                        className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                        children: "Remedy",
+                                    }), createElement<any>("textarea", createObj(ofArray([(value_89 = "w-full rounded-md border border-slate-300 px-2.5 py-1.5 text-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30", ["className", value_89] as [string, any]), ["value", remedy] as [string, any], ["onChange", (ev_2: Event): void => {
+                                        patternInput_3[1](ev_2.target.value);
+                                    }] as [string, any], ["placeholder", "e.g., Epipen, Benadryl 50mg, avoid exposure..."] as [string, any], ["rows", 2] as [string, any]])))], ["children", reactApi.Children.toArray(Array.from(elems_7))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                                        let elems_10: Iterable<ReactElement>, elems_9: Iterable<ReactElement>;
+                                        return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems_10 = [createElement<any>("label", {
+                                            className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                            children: "Onset Timing",
+                                        }), createElement<any>("div", createObj(ofArray([["className", "flex flex-wrap gap-3"] as [string, any], (elems_9 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => collect<[string, string], Iterable<ReactElement>, ReactElement>((matchValue_1: [string, string]): Iterable<ReactElement> => {
+                                            let elems_8: Iterable<ReactElement>;
+                                            const value_107: string = matchValue_1[0];
+                                            return singleton<ReactElement>(createElement<any>("label", createObj(ofArray([["className", "flex items-center gap-1.5 text-sm cursor-pointer"] as [string, any], (elems_8 = [createElement<any>("input", {
+                                                type: "radio",
+                                                name: "onset",
+                                                value: value_107,
+                                                checked: onset === value_107,
+                                                onChange: (ev_3: Event): void => {
+                                                    const _arg_3: string = ev_3.target.value;
+                                                    patternInput_4[1](value_107);
+                                                },
+                                            }), matchValue_1[1]], ["children", reactApi.Children.toArray(Array.from(elems_8))] as [string, any])]))));
+                                        }, [["immediate", "Immediate (<1hr)"] as [string, string], ["delayed", "Delayed (1-72hr)"] as [string, string], ["unknown", "Unknown"] as [string, string]]))), ["children", reactApi.Children.toArray(Array.from(elems_9))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_10))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                                            let elems_11: Iterable<ReactElement>, value_128: string;
+                                            return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-1"] as [string, any], (elems_11 = [createElement<any>("label", {
+                                                className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                                children: "Notes (optional)",
+                                            }), createElement<any>("textarea", createObj(ofArray([(value_128 = "w-full rounded-md border border-slate-300 px-2.5 py-1.5 text-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30", ["className", value_128] as [string, any]), ["value", notes] as [string, any], ["onChange", (ev_4: Event): void => {
+                                                patternInput_6[1](ev_4.target.value);
+                                            }] as [string, any], ["placeholder", "e.g., Diagnosed at age 12, confirmed by allergist..."] as [string, any], ["rows", 2] as [string, any]])))], ["children", reactApi.Children.toArray(Array.from(elems_11))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(((equals(initialCategory, AllergyCategory_Drug()) ? true : equals(initialCategory, AllergyCategory_Environmental())) && (initialSubstance.length > 0)) ? singleton<ReactElement>(createElement(AllergyFinderField_FdaInsightsPanel, {
+                                                apiFetch: apiFetch,
+                                                substanceName: initialSubstance,
+                                            })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => {
+                                                let elems_12: Iterable<ReactElement>;
+                                                return singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex justify-end gap-2 pt-2"] as [string, any], (elems_12 = [createElement<any>("button", {
+                                                    className: "rounded-md border border-slate-200 px-4 py-2 text-sm font-medium text-slate-600 hover:bg-slate-50",
+                                                    children: "Cancel",
+                                                    onClick: (_arg_4: MouseEvent): void => {
+                                                        onClose();
+                                                    },
+                                                }), createElement<any>("button", {
+                                                    className: "rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700",
+                                                    children: "Save Allergy",
+                                                    onClick: (_arg_5: MouseEvent): void => {
+                                                        let copyOfStruct: string;
+                                                        onSave(new AllergyFinderField_AllergyEntry((copyOfStruct = newGuid(), copyOfStruct), isNullOrWhiteSpace(name) ? "Unknown Allergen" : name, isNullOrWhiteSpace(initialSubstance) ? name : initialSubstance, initialNdc, initialCategory, severity, reactions, isNullOrWhiteSpace(remedy) ? undefined : remedy, onset, staffOnly, isNullOrWhiteSpace(notes) ? undefined : notes));
+                                                    },
+                                                })], ["children", reactApi.Children.toArray(Array.from(elems_12))] as [string, any])]))));
+                                            }))));
+                                        }));
+                                    }));
+                                }));
+                            }));
+                        }));
+                    }));
+                }));
+            })), ["children", reactApi.Children.toArray(Array.from(elems_13))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_14))] as [string, any])])));
+        }
+        case /* Editing */ 2: {
+            const existingEntry: AllergyFinderField_AllergyEntry = modalState.fields[0];
+            const name_69: string = reactApi.useState<string, string>(existingEntry.Name)[0];
+            const patternInput_8: [AllergyFinderField_AllergySeverity_$union, ((arg0: AllergyFinderField_AllergySeverity_$union) => void)] = reactApi.useState<AllergyFinderField_AllergySeverity_$union, AllergyFinderField_AllergySeverity_$union>(existingEntry.Severity);
+            const severity_1: AllergyFinderField_AllergySeverity_$union = patternInput_8[0];
+            const patternInput_9: [FSharpList<string>, ((arg0: FSharpList<string>) => void)] = reactApi.useState<FSharpList<string>, FSharpList<string>>(existingEntry.Reactions);
+            const reactions_1: FSharpList<string> = patternInput_9[0];
+            let patternInput_10: [string, ((arg0: string) => void)];
+            const initial_10: string = defaultArg(existingEntry.Remedy, "");
+            patternInput_10 = reactApi.useState<string, string>(initial_10);
+            const remedy_1: string = patternInput_10[0];
+            let patternInput_11: [string, ((arg0: string) => void)];
+            const initial_11: string = defaultArg(existingEntry.OnsetTiming, "unknown");
+            patternInput_11 = reactApi.useState<string, string>(initial_11);
+            const onset_1: string = patternInput_11[0];
+            const patternInput_12: [boolean, ((arg0: boolean) => void)] = reactApi.useState<boolean, boolean>(existingEntry.StaffOnly);
+            const staffOnly_1: boolean = patternInput_12[0];
+            let patternInput_13: [string, ((arg0: string) => void)];
+            const initial_13: string = defaultArg(existingEntry.Notes, "");
+            patternInput_13 = reactApi.useState<string, string>(initial_13);
+            const notes_1: string = patternInput_13[0];
+            return createElement<any>("div", createObj(ofArray([["className", "fixed inset-0 z-50 flex items-center justify-center bg-black/50"] as [string, any], ["onClick", (e_2: MouseEvent): void => {
+                if (equals(e_2.target, e_2.currentTarget)) {
+                    onClose();
+                }
+            }] as [string, any], (elems_28 = [createElement<any>("div", createObj(ofArray([["className", "bg-white rounded-xl shadow-xl max-w-lg w-full max-h-[90vh] overflow-y-auto mx-4 p-5 space-y-4"] as [string, any], ["onClick", (e_3: MouseEvent): void => {
+                e_3.stopPropagation();
+            }] as [string, any], (elems_27 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => {
+                let elems_15: Iterable<ReactElement>;
+                return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex items-center justify-between"] as [string, any], (elems_15 = [createElement<any>("h3", {
+                    className: "text-lg font-semibold text-slate-900",
+                    children: "Edit Allergy",
+                }), createElement<any>("button", {
+                    className: "text-slate-400 hover:text-slate-600 text-xl",
+                    dangerouslySetInnerHTML: {
+                        __html: "&times;",
+                    },
+                    onClick: (_arg_6: MouseEvent): void => {
+                        onClose();
+                    },
+                })], ["children", reactApi.Children.toArray(Array.from(elems_15))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                    let elems_17: Iterable<ReactElement>;
+                    return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "rounded-lg border border-slate-200 bg-slate-50 p-3 space-y-1"] as [string, any], (elems_17 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => {
+                        let elems_16: Iterable<ReactElement>;
+                        return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex items-start justify-between gap-2"] as [string, any], (elems_16 = [createElement<any>("span", {
+                            className: "font-semibold text-sm text-slate-900",
+                            children: existingEntry.Name,
+                        }), createElement(AllergyFinderField_CategoryBadge, {
+                            category: existingEntry.Category,
+                        })], ["children", reactApi.Children.toArray(Array.from(elems_16))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((existingEntry.SubstanceName !== existingEntry.Name) ? singleton<ReactElement>(createElement<any>("p", {
+                            className: "text-xs text-slate-500",
+                            children: existingEntry.SubstanceName,
+                        })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => {
+                            const matchValue_2: Option<string> = existingEntry.NdcCode;
+                            if (matchValue_2 == null) {
+                                return empty_1<ReactElement>();
+                            }
+                            else {
+                                return singleton<ReactElement>(createElement<any>("p", {
+                                    className: "text-[11px] text-slate-400",
+                                    children: `NDC ${value_284(matchValue_2)}`,
+                                }));
+                            }
+                        }))));
+                    })), ["children", reactApi.Children.toArray(Array.from(elems_17))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                        let elems_18: Iterable<ReactElement>;
+                        return append<ReactElement>(singleton<ReactElement>(createElement<any>("label", createObj(ofArray([["className", "flex items-center gap-2 text-sm cursor-pointer"] as [string, any], (elems_18 = [createElement<any>("input", {
+                            type: "checkbox",
+                            checked: staffOnly_1,
+                            onChange: (ev_5: Event): void => {
+                                const _arg_7: boolean = ev_5.target.checked;
+                                patternInput_12[1](!staffOnly_1);
+                            },
+                            className: "rounded border-slate-300",
+                        }), "Medical Staff Only"], ["children", reactApi.Children.toArray(Array.from(elems_18))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                            let elems_20: Iterable<ReactElement>, elems_19: Iterable<ReactElement>;
+                            return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems_20 = [createElement<any>("label", {
+                                className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                children: "Severity",
+                            }), createElement<any>("div", createObj(ofArray([["className", "flex flex-wrap gap-2"] as [string, any], (elems_19 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => collect<AllergyFinderField_AllergySeverity_$union, Iterable<ReactElement>, ReactElement>((sev_1: AllergyFinderField_AllergySeverity_$union): Iterable<ReactElement> => singleton<ReactElement>(createElement<any>("button", {
+                                className: equals(severity_1, sev_1) ? (`rounded-full px-3 py-1 text-xs font-medium border-2 ${AllergyFinderField_severityColor(sev_1)}`) : "rounded-full px-3 py-1 text-xs font-medium border border-slate-200 bg-white text-slate-600 hover:bg-slate-50",
+                                onClick: (_arg_8: MouseEvent): void => {
+                                    patternInput_8[1](sev_1);
+                                },
+                                children: AllergyFinderField_severityLabel(sev_1),
+                            })), [AllergyFinderField_AllergySeverity_Unknown(), AllergyFinderField_AllergySeverity_Mild(), AllergyFinderField_AllergySeverity_Moderate(), AllergyFinderField_AllergySeverity_Severe(), AllergyFinderField_AllergySeverity_LifeThreatening()]))), ["children", reactApi.Children.toArray(Array.from(elems_19))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_20))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                                let substanceForInsights_1: Option<string>;
+                                const matchValue_3: AllergyCategory_$union = existingEntry.Category;
+                                switch (matchValue_3.tag) {
+                                    case /* Drug */ 0:
+                                    case /* Environmental */ 2: {
+                                        substanceForInsights_1 = ((existingEntry.SubstanceName.length > 0) ? existingEntry.SubstanceName : undefined);
+                                        break;
+                                    }
+                                    default:
+                                        substanceForInsights_1 = undefined;
+                                }
+                                return append<ReactElement>(singleton<ReactElement>(createElement(AllergyFinderField_ReactionCheckboxes, {
+                                    apiFetch: apiFetch,
+                                    substanceName: unwrap(substanceForInsights_1),
+                                    selected: reactions_1,
+                                    onChange: patternInput_9[1],
+                                })), delay<ReactElement>((): Iterable<ReactElement> => {
+                                    let elems_21: Iterable<ReactElement>, value_222: string;
+                                    return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-1"] as [string, any], (elems_21 = [createElement<any>("label", {
+                                        className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                        children: "Remedy",
+                                    }), createElement<any>("textarea", createObj(ofArray([(value_222 = "w-full rounded-md border border-slate-300 px-2.5 py-1.5 text-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30", ["className", value_222] as [string, any]), ["value", remedy_1] as [string, any], ["onChange", (ev_6: Event): void => {
+                                        patternInput_10[1](ev_6.target.value);
+                                    }] as [string, any], ["placeholder", "e.g., Epipen, Benadryl 50mg..."] as [string, any], ["rows", 2] as [string, any]])))], ["children", reactApi.Children.toArray(Array.from(elems_21))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                                        let elems_24: Iterable<ReactElement>, elems_23: Iterable<ReactElement>;
+                                        return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems_24 = [createElement<any>("label", {
+                                            className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                            children: "Onset Timing",
+                                        }), createElement<any>("div", createObj(ofArray([["className", "flex flex-wrap gap-3"] as [string, any], (elems_23 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => collect<[string, string], Iterable<ReactElement>, ReactElement>((matchValue_4: [string, string]): Iterable<ReactElement> => {
+                                            let elems_22: Iterable<ReactElement>;
+                                            const value_240: string = matchValue_4[0];
+                                            return singleton<ReactElement>(createElement<any>("label", createObj(ofArray([["className", "flex items-center gap-1.5 text-sm cursor-pointer"] as [string, any], (elems_22 = [createElement<any>("input", createObj(toList<IReactProperty>(delay<IReactProperty>((): Iterable<IReactProperty> => append<IReactProperty>(singleton<IReactProperty>(["type", "radio"] as [string, any]), delay<IReactProperty>((): Iterable<IReactProperty> => append<IReactProperty>(singleton<IReactProperty>(["name", "onset-edit"] as [string, any]), delay<IReactProperty>((): Iterable<IReactProperty> => append<IReactProperty>(singleton<IReactProperty>(["value", value_240] as [string, any]), delay<IReactProperty>((): Iterable<IReactProperty> => append<IReactProperty>(singleton<IReactProperty>(["checked", onset_1 === value_240] as [string, any]), delay<IReactProperty>((): Iterable<IReactProperty> => singleton<IReactProperty>(["onChange", (ev_7: Event): void => {
+                                                const _arg_9: string = ev_7.target.value;
+                                                patternInput_11[1](value_240);
+                                            }] as [string, any]))))))))))))), matchValue_4[1]], ["children", reactApi.Children.toArray(Array.from(elems_22))] as [string, any])]))));
+                                        }, [["immediate", "Immediate (<1hr)"] as [string, string], ["delayed", "Delayed (1-72hr)"] as [string, string], ["unknown", "Unknown"] as [string, string]]))), ["children", reactApi.Children.toArray(Array.from(elems_23))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_24))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+                                            let elems_25: Iterable<ReactElement>, value_261: string;
+                                            return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-1"] as [string, any], (elems_25 = [createElement<any>("label", {
+                                                className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+                                                children: "Notes (optional)",
+                                            }), createElement<any>("textarea", createObj(ofArray([(value_261 = "w-full rounded-md border border-slate-300 px-2.5 py-1.5 text-sm placeholder:text-slate-400 focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-500/30", ["className", value_261] as [string, any]), ["value", notes_1] as [string, any], ["onChange", (ev_8: Event): void => {
+                                                patternInput_13[1](ev_8.target.value);
+                                            }] as [string, any], ["rows", 2] as [string, any]])))], ["children", reactApi.Children.toArray(Array.from(elems_25))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(((equals(existingEntry.Category, AllergyCategory_Drug()) ? true : equals(existingEntry.Category, AllergyCategory_Environmental())) && (existingEntry.SubstanceName.length > 0)) ? singleton<ReactElement>(createElement(AllergyFinderField_FdaInsightsPanel, {
+                                                apiFetch: apiFetch,
+                                                substanceName: existingEntry.SubstanceName,
+                                            })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => {
+                                                let elems_26: Iterable<ReactElement>;
+                                                return singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex justify-end gap-2 pt-2"] as [string, any], (elems_26 = [createElement<any>("button", {
+                                                    className: "rounded-md border border-slate-200 px-4 py-2 text-sm font-medium text-slate-600 hover:bg-slate-50",
+                                                    children: "Cancel",
+                                                    onClick: (_arg_10: MouseEvent): void => {
+                                                        onClose();
+                                                    },
+                                                }), createElement<any>("button", {
+                                                    className: "rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700",
+                                                    children: "Update",
+                                                    onClick: (_arg_11: MouseEvent): void => {
+                                                        onSave(new AllergyFinderField_AllergyEntry(existingEntry.Id, isNullOrWhiteSpace(name_69) ? existingEntry.Name : name_69, existingEntry.SubstanceName, existingEntry.NdcCode, existingEntry.Category, severity_1, reactions_1, isNullOrWhiteSpace(remedy_1) ? undefined : remedy_1, onset_1, staffOnly_1, isNullOrWhiteSpace(notes_1) ? undefined : notes_1));
+                                                    },
+                                                })], ["children", reactApi.Children.toArray(Array.from(elems_26))] as [string, any])]))));
+                                            }))));
+                                        }));
+                                    }));
+                                }));
+                            }));
+                        }));
+                    }));
+                }));
+            })), ["children", reactApi.Children.toArray(Array.from(elems_27))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_28))] as [string, any])])));
+        }
+        default:
+            return defaultOf();
+    }
+}
+
+export function AllergyFinderField_AllergySearchPopover(allergyFinderField_AllergySearchPopoverInputProps: any): ReactElement {
+    let elems_6: Iterable<ReactElement>, elems_5: Iterable<ReactElement>, elems_2: Iterable<ReactElement>, elems_3: Iterable<ReactElement>, elems_4: Iterable<ReactElement>;
+    const onClose: (() => void) = allergyFinderField_AllergySearchPopoverInputProps.onClose;
+    const onSelect: ((arg0: Option<OpenFdaSearchResult>) => void) = allergyFinderField_AllergySearchPopoverInputProps.onSelect;
+    const apiFetch: ((arg0: string) => Promise<string>) = allergyFinderField_AllergySearchPopoverInputProps.apiFetch;
+    const patternInput: [string, ((arg0: string) => void)] = reactApi.useState<string, string>("");
+    const query: string = patternInput[0];
+    const patternInput_1: [FSharpList<OpenFdaSearchResult>, ((arg0: FSharpList<OpenFdaSearchResult>) => void)] = reactApi.useState<FSharpList<OpenFdaSearchResult>, FSharpList<OpenFdaSearchResult>>(empty<OpenFdaSearchResult>());
+    const setResults: ((arg0: FSharpList<OpenFdaSearchResult>) => void) = patternInput_1[1];
+    const results: FSharpList<OpenFdaSearchResult> = patternInput_1[0];
+    const patternInput_2: [boolean, ((arg0: boolean) => void)] = reactApi.useState<boolean, boolean>(false);
+    const setIsSearching: ((arg0: boolean) => void) = patternInput_2[1];
+    const isSearching: boolean = patternInput_2[0];
+    const searchIdRef: IRefValue$1<int32> = reactApi.useRef(0);
+    const cleanupRef: IRefValue$1<Option<(() => void)>> = reactApi.useRef(undefined);
+    const dependencies: any[] = [query];
+    reactApi.useEffect((): void => {
+        const matchValue: Option<(() => void)> = cleanupRef.current;
+        if (matchValue == null) {
+        }
+        else {
+            value_284(matchValue)();
+        }
+        cleanupRef.current = undefined;
+        if (query.trim().length < 2) {
+            setResults(empty<OpenFdaSearchResult>());
+            setIsSearching(false);
+        }
+        else {
+            setIsSearching(true);
+            searchIdRef.current = (searchIdRef.current + 1);
+            const thisSearchId: int32 = searchIdRef.current | 0;
+            const timerId: int32 = setTimeout((): void => {
+                const pr: Promise<void> = PromiseBuilder__Run_212F1D4B<void>(promise, PromiseBuilder__Delay_62FBFDE1<void>(promise, (): Promise<void> => (searchAllergens(apiFetch, query).then((_arg: FSharpList<OpenFdaSearchResult>): Promise<void> => {
+                    if (searchIdRef.current === thisSearchId) {
+                        setResults(_arg);
+                        setIsSearching(false);
+                        return Promise.resolve();
+                    }
+                    else {
+                        return Promise.resolve();
+                    }
+                }))));
+                void pr;
+            }, 300) | 0;
+            cleanupRef.current = ((): void => {
+                clearTimeout(timerId);
+            });
+        }
+    }, dependencies);
+    const drugResults: FSharpList<OpenFdaSearchResult> = filter<OpenFdaSearchResult>((r: OpenFdaSearchResult): boolean => equals(r.Category, AllergyCategory_Drug()), results);
+    const foodResults: FSharpList<OpenFdaSearchResult> = filter<OpenFdaSearchResult>((r_1: OpenFdaSearchResult): boolean => equals(r_1.Category, AllergyCategory_Food()), results);
+    const envResults: FSharpList<OpenFdaSearchResult> = filter<OpenFdaSearchResult>((r_2: OpenFdaSearchResult): boolean => equals(r_2.Category, AllergyCategory_Environmental()), results);
+    const renderGroup = (label: string, items: FSharpList<OpenFdaSearchResult>): ReactElement => {
+        let elems_1: Iterable<ReactElement>;
+        if (isEmpty_1(items)) {
+            return defaultOf();
+        }
+        else {
+            return createElement<any>("div", createObj(singleton_1((elems_1 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("div", {
+                className: "px-3 py-1.5 text-[11px] font-semibold uppercase tracking-wider text-slate-400 bg-slate-50",
+                children: label,
+            })), delay<ReactElement>((): Iterable<ReactElement> => map_1<OpenFdaSearchResult, ReactElement>((r_4: OpenFdaSearchResult): ReactElement => {
+                let elems: Iterable<ReactElement>;
+                const r_3: OpenFdaSearchResult = r_4;
+                const meta: string = join(" · ", choose<Option<string>, string>((x: Option<string>): Option<string> => x, ofArray([r_3.DosageForm, r_3.Route, r_3.Strength])));
+                const provenance: string = join(" · ", choose<Option<string>, string>((x_1: Option<string>): Option<string> => x_1, ofArray([r_3.Manufacturer, map_2<string, string>((n: string): string => (`NDC ${n}`), r_3.NdcCode), map_2<int32, string>((c: int32): string => (`${c} reports`), r_3.ReportCount)])));
+                return createElement<any>("div", createObj(ofArray([["className", "px-3 py-2 cursor-pointer hover:bg-blue-50 border-b border-slate-100 last:border-0"] as [string, any], ["onClick", (_arg_1: MouseEvent): void => {
+                    onSelect(r_3);
+                }] as [string, any], (elems = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("div", {
+                    className: "text-sm font-medium text-slate-900",
+                    children: r_3.Name,
+                })), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((r_3.SubstanceName !== r_3.Name) ? singleton<ReactElement>(createElement<any>("div", {
+                    className: "text-xs text-slate-500",
+                    children: r_3.SubstanceName,
+                })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((meta.length > 0) ? singleton<ReactElement>(createElement<any>("div", {
+                    className: "text-[11px] text-slate-400",
+                    children: meta,
+                })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => ((provenance.length > 0) ? singleton<ReactElement>(createElement<any>("div", {
+                    className: "text-[11px] text-slate-400",
+                    children: provenance,
+                })) : empty_1<ReactElement>()))))))))), ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])])));
+            }, items))))), ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any]))));
+        }
+    };
+    return createElement<any>("div", createObj(ofArray([["className", "fixed inset-0 z-50 flex items-start justify-center pt-[15vh] bg-black/50"] as [string, any], ["onClick", (e: MouseEvent): void => {
+        if (equals(e.target, e.currentTarget)) {
+            onClose();
+        }
+    }] as [string, any], (elems_6 = [createElement<any>("div", createObj(ofArray([["className", "bg-white rounded-xl shadow-xl max-w-md w-full mx-4 overflow-hidden"] as [string, any], ["onClick", (e_1: MouseEvent): void => {
+        e_1.stopPropagation();
+    }] as [string, any], (elems_5 = [createElement<any>("div", createObj(ofArray([["className", "flex items-center gap-2 border-b border-slate-200 px-3 py-2"] as [string, any], (elems_2 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("span", {
+        className: "text-slate-400 text-sm",
+        children: "Search",
+    })), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("input", {
+        className: "flex-1 border-0 bg-transparent text-sm focus:outline-none placeholder:text-slate-400",
+        value: query,
+        onChange: (ev: Event): void => {
+            patternInput[1](ev.target.value);
+        },
+        placeholder: "Search allergies...",
+        autoFocus: true,
+    })), delay<ReactElement>((): Iterable<ReactElement> => (isSearching ? singleton<ReactElement>(createElement<any>("span", {
+        className: "text-xs text-slate-400 animate-pulse",
+        children: "...",
+    })) : empty_1<ReactElement>()))))))), ["children", reactApi.Children.toArray(Array.from(elems_2))] as [string, any])]))), createElement<any>("div", createObj(ofArray([["className", "max-h-[50vh] overflow-y-auto"] as [string, any], (elems_3 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => ((((query.trim().length >= 2) && !isSearching) && isEmpty_1(results)) ? singleton<ReactElement>(createElement<any>("div", {
+        className: "px-3 py-4 text-sm text-slate-500 text-center",
+        children: `No allergies found for "${query}"`,
+    })) : append<ReactElement>(singleton<ReactElement>(renderGroup("Drugs", drugResults)), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(renderGroup("Environmental", envResults)), delay<ReactElement>((): Iterable<ReactElement> => singleton<ReactElement>(renderGroup("Foods", foodResults))))))))), ["children", reactApi.Children.toArray(Array.from(elems_3))] as [string, any])]))), createElement<any>("div", createObj(ofArray([["className", "border-t border-slate-200 px-3 py-2"] as [string, any], (elems_4 = [createElement<any>("button", {
+        className: "w-full text-left text-sm text-blue-600 hover:text-blue-700 font-medium",
+        children: "+ Add custom allergen",
+        onClick: (_arg_2: MouseEvent): void => {
+            onSelect(undefined);
+        },
+    })], ["children", reactApi.Children.toArray(Array.from(elems_4))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_5))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_6))] as [string, any])])));
+}
+
+export function AllergyFinderField_AllergyCard(allergyFinderField_AllergyCardInputProps: any): ReactElement {
+    let elems_3: Iterable<ReactElement>;
+    const onRemove: (() => void) = allergyFinderField_AllergyCardInputProps.onRemove;
+    const onEdit: (() => void) = allergyFinderField_AllergyCardInputProps.onEdit;
+    const readOnly: boolean = allergyFinderField_AllergyCardInputProps.readOnly;
+    const entry: AllergyFinderField_AllergyEntry = allergyFinderField_AllergyCardInputProps.entry;
+    let reactionsPreview: string;
+    if (isEmpty_1(entry.Reactions)) {
+        reactionsPreview = "";
+    }
+    else {
+        const shown: string = join(", ", truncate<string>(3, entry.Reactions));
+        const overflow: int32 = (length(entry.Reactions) - 3) | 0;
+        reactionsPreview = ((overflow > 0) ? (`${shown} and ${overflow} more`) : shown);
+    }
+    return createElement<any>("div", createObj(ofArray([["className", `rounded-lg border border-slate-200 bg-white p-3 shadow-sm border-l-4 ${AllergyFinderField_severityBorderColor(entry.Severity)}`] as [string, any], (elems_3 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => {
+        let elems_1: Iterable<ReactElement>, elems: Iterable<ReactElement>;
+        return append<ReactElement>(singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex items-start justify-between gap-2 mb-1"] as [string, any], (elems_1 = [createElement<any>("span", {
+            className: "font-semibold text-sm text-slate-900",
+            children: entry.Name,
+        }), createElement<any>("div", createObj(ofArray([["className", "flex gap-1.5 shrink-0"] as [string, any], (elems = [createElement(AllergyFinderField_SeverityBadge, {
+            severity: entry.Severity,
+        }), createElement(AllergyFinderField_CategoryBadge, {
+            category: entry.Category,
+        })], ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])])))], ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((entry.SubstanceName !== entry.Name) ? singleton<ReactElement>(createElement<any>("p", {
+            className: "text-xs text-slate-500 mb-1",
+            children: entry.SubstanceName,
+        })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>((reactionsPreview.length > 0) ? singleton<ReactElement>(createElement<any>("p", {
+            className: "text-xs text-slate-600",
+            children: `Reactions: ${reactionsPreview}`,
+        })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => {
+            let matchValue: Option<string>;
+            return append<ReactElement>((matchValue = entry.Remedy, (matchValue == null) ? (empty_1<ReactElement>()) : singleton<ReactElement>(createElement<any>("p", {
+                className: "text-xs text-slate-600",
+                children: `Remedy: ${value_284(matchValue)}`,
+            }))), delay<ReactElement>((): Iterable<ReactElement> => {
+                let value_24: string;
+                return append<ReactElement>(entry.StaffOnly ? singleton<ReactElement>(createElement<any>("span", createObj(ofArray([(value_24 = "inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium bg-purple-50 text-purple-700 border border-purple-200 mt-1", ["className", value_24] as [string, any]), ["children", "Staff Only"] as [string, any]])))) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => {
+                    let elems_2: Iterable<ReactElement>;
+                    return !readOnly ? singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "flex justify-end gap-2 mt-2 pt-2 border-t border-slate-100"] as [string, any], (elems_2 = [createElement<any>("button", {
+                        className: "text-xs font-medium text-blue-600 hover:text-blue-700",
+                        children: "Edit",
+                        onClick: (_arg: MouseEvent): void => {
+                            onEdit();
+                        },
+                    }), createElement<any>("button", {
+                        className: "text-xs font-medium text-red-500 hover:text-red-600",
+                        children: "Remove",
+                        onClick: (_arg_1: MouseEvent): void => {
+                            onRemove();
+                        },
+                    })], ["children", reactApi.Children.toArray(Array.from(elems_2))] as [string, any])])))) : empty_1<ReactElement>();
+                }));
+            }));
+        }))))));
+    })), ["children", reactApi.Children.toArray(Array.from(elems_3))] as [string, any])])));
+}
+
+export function AllergyFinderField_AllergyFinderFieldComponent(config: StandardRenderFieldConfig$2<string, AllergyFinderField_Attributes>): ReactElement {
+    let elems_1: Iterable<ReactElement>;
+    const patternInput: [FSharpList<AllergyFinderField_AllergyEntry>, ((arg0: FSharpList<AllergyFinderField_AllergyEntry>) => void)] = reactApi.useState<(() => FSharpList<AllergyFinderField_AllergyEntry>), FSharpList<AllergyFinderField_AllergyEntry>>((): FSharpList<AllergyFinderField_AllergyEntry> => AllergyFinderField_parseAllergies(config.Value));
+    const allergies: FSharpList<AllergyFinderField_AllergyEntry> = patternInput[0];
+    const patternInput_1: [boolean, ((arg0: boolean) => void)] = reactApi.useState<boolean, boolean>(false);
+    const setShowSearch: ((arg0: boolean) => void) = patternInput_1[1];
+    const patternInput_2: [AllergyFinderField_DetailModalState_$union, ((arg0: AllergyFinderField_DetailModalState_$union) => void)] = reactApi.useState<AllergyFinderField_DetailModalState_$union, AllergyFinderField_DetailModalState_$union>(AllergyFinderField_DetailModalState_Closed());
+    const setDetailModal: ((arg0: AllergyFinderField_DetailModalState_$union) => void) = patternInput_2[1];
+    const detailModal: AllergyFinderField_DetailModalState_$union = patternInput_2[0];
+    const updateAndNotify = (newAllergies: FSharpList<AllergyFinderField_AllergyEntry>): void => {
+        patternInput[1](newAllergies);
+        config.OnChange(AllergyFinderField_serializeAllergies(newAllergies));
+    };
+    const readOnly: boolean = config.Disabled ? true : config.IsReadOnly;
+    return createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems_1 = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement<any>("label", {
+        className: "text-xs font-semibold uppercase tracking-wide text-slate-700",
+        children: config.Attributes.Label,
+    })), delay<ReactElement>((): Iterable<ReactElement> => {
+        let elems: Iterable<ReactElement>;
+        return append<ReactElement>(isEmpty_1(allergies) ? singleton<ReactElement>(createElement<any>("div", {
+            className: "rounded-lg border border-dashed border-slate-300 bg-slate-50 p-4 text-center text-sm text-slate-500",
+            children: "No allergies added",
+        })) : singleton<ReactElement>(createElement<any>("div", createObj(ofArray([["className", "space-y-2"] as [string, any], (elems = toList<ReactElement>(delay<ReactElement>((): Iterable<ReactElement> => map_1<AllergyFinderField_AllergyEntry, ReactElement>((entry_1: AllergyFinderField_AllergyEntry): ReactElement => createElement(AllergyFinderField_AllergyCard, {
+            entry: entry_1,
+            readOnly: readOnly,
+            onEdit: (): void => {
+                setDetailModal(AllergyFinderField_DetailModalState_Editing(entry_1));
+            },
+            onRemove: (): void => {
+                updateAndNotify(filter<AllergyFinderField_AllergyEntry>((a_2: AllergyFinderField_AllergyEntry): boolean => (a_2.Id !== entry_1.Id), allergies));
+            },
+        }), allergies))), ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])])))), delay<ReactElement>((): Iterable<ReactElement> => {
+            let value_13: string;
+            return append<ReactElement>(!readOnly ? singleton<ReactElement>(createElement<any>("button", createObj(ofArray([(value_13 = "inline-flex items-center gap-1.5 rounded-md bg-blue-50 px-3 py-1.5 text-sm font-medium text-blue-600 hover:bg-blue-100 border border-blue-200", ["className", value_13] as [string, any]), ["children", "+ Add Allergy"] as [string, any], ["onClick", (_arg: MouseEvent): void => {
+                setShowSearch(true);
+            }] as [string, any]])))) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(patternInput_1[0] ? singleton<ReactElement>(createElement(AllergyFinderField_AllergySearchPopover, {
+                apiFetch: config.Attributes.ApiFetch,
+                onSelect: (fdaResult: Option<OpenFdaSearchResult>): void => {
+                    setShowSearch(false);
+                    setDetailModal(AllergyFinderField_DetailModalState_Adding(fdaResult));
+                },
+                onClose: (): void => {
+                    setShowSearch(false);
+                },
+            })) : empty_1<ReactElement>(), delay<ReactElement>((): Iterable<ReactElement> => append<ReactElement>(singleton<ReactElement>(createElement(AllergyFinderField_AllergyDetailModal, {
+                apiFetch: config.Attributes.ApiFetch,
+                modalState: detailModal,
+                onClose: (): void => {
+                    setDetailModal(AllergyFinderField_DetailModalState_Closed());
+                },
+                onSave: (entry: AllergyFinderField_AllergyEntry): void => {
+                    switch (detailModal.tag) {
+                        case /* Adding */ 1: {
+                            if (!exists<AllergyFinderField_AllergyEntry>((a_1: AllergyFinderField_AllergyEntry): boolean => (compare(a_1.SubstanceName, entry.SubstanceName, 5) === 0), allergies)) {
+                                updateAndNotify(append_1(allergies, singleton_1(entry)));
+                            }
+                            break;
+                        }
+                        case /* Closed */ 0: {
+                            break;
+                        }
+                        default: {
+                            const existing: AllergyFinderField_AllergyEntry = detailModal.fields[0];
+                            updateAndNotify(map<AllergyFinderField_AllergyEntry, AllergyFinderField_AllergyEntry>((a: AllergyFinderField_AllergyEntry): AllergyFinderField_AllergyEntry => {
+                                if (a.Id === existing.Id) {
+                                    return entry;
+                                }
+                                else {
+                                    return a;
+                                }
+                            }, allergies));
+                        }
+                    }
+                    setDetailModal(AllergyFinderField_DetailModalState_Closed());
+                },
+            })), delay<ReactElement>((): Iterable<ReactElement> => ((config.ShowError && (config.Error != null)) ? singleton<ReactElement>(createElement<any>("p", {
+                className: "text-xs text-red-600 mt-1",
+                children: toString_1(value_284(config.Error)),
+            })) : empty_1<ReactElement>())))))));
+        }));
+    })))), ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any])])));
+}
+
+export class AllergyFinderField_Field$1<Values> extends IStandardField$3<Values, string, AllergyFinderField_Attributes> implements IField$1<Values> {
+    readonly innerField_1: Field$3<AllergyFinderField_Attributes, string, Values>;
+    constructor(innerField: Field$3<AllergyFinderField_Attributes, string, Values>) {
+        super(innerField);
+        this.innerField_1 = innerField;
+    }
+    "Fable.Form.Simple.Bulma.IStandardField`3.RenderFieldZ43FEF6DC"(config: StandardRenderFieldConfig$2<string, AllergyFinderField_Attributes>): ReactElement {
+        return createElement(AllergyFinderField_AllergyFinderFieldComponent, config);
+    }
+    MapFieldValues<NewValues>(update: ((arg0: Values) => $a)): IField$1<$a> {
+        const _: AllergyFinderField_Field$1<Values> = this;
+        return AllergyFinderField_Field$1_$ctor_2F8EC839<$a>(mapValues<Values, $a, AllergyFinderField_Attributes, string>(update, _.innerField_1));
+    }
+}
+
+export function AllergyFinderField_Field$1_$reflection(gen0: TypeInfo): TypeInfo {
+    return class_type("Fable.Form.Simple.Bulma.Fields.AllergyFinderField.AllergyFinderField.Field`1", [gen0], AllergyFinderField_Field$1, IStandardField$3_$reflection(gen0, string_type, AllergyFinderField_Attributes_$reflection()));
+}
+
+export function AllergyFinderField_Field$1_$ctor_2F8EC839<Values>(innerField: Field$3<AllergyFinderField_Attributes, string, Values>): AllergyFinderField_Field$1<Values> {
+    return new AllergyFinderField_Field$1(innerField);
+}
+
+export function Form_allergyFinderField<Values, Output>(config: FieldConfig$4<AllergyFinderField_Attributes, string, Values, Output>): Form$3<Values, Output, IField$1<Values>> {
+    return AllergyFinderField_form<Values, IField$1<Values>, Output>()(AllergyFinderField_Field$1_$ctor_2F8EC839)(config);
+}
+
+export const Form_pluginConfig: Spec_PluginFieldConfig = new Spec_PluginFieldConfig("Fable.Form.Simple.Bulma.Fields.AllergyFinderField", undefined, undefined);
+
+export const Form_PropertyKeys_AllergyCount: Shared_PluginPropertyKey = new Shared_PluginPropertyKey("af100001-af10-af10-af10-af10af10af10");
+
+export const Form_PropertyKeys_HasSevereAllergy: Shared_PluginPropertyKey = new Shared_PluginPropertyKey("af100002-af10-af10-af10-af10af10af10");
+
+export const Form_PropertyKeys_AllergiesJson: Shared_PluginPropertyKey = new Shared_PluginPropertyKey("af100003-af10-af10-af10-af10af10af10");
+
+export const Form_enhancedAllergyConverter: IPluginValueConverter = new IPluginValueConverter((fieldKey: Shared_FieldKey, pluginValue: any): Option<Shared_FieldValue_$union> => {
+    const json: string = toString_1(pluginValue);
+    const allergies: FSharpList<AllergyFinderField_AllergyEntry> = AllergyFinderField_parseAllergies(json);
+    return Shared_FieldValue_PluginData(ofArray([new Shared_PluginDataProperty(Form_PropertyKeys_AllergyCount, "allergy_count", "int", int32ToString(length(allergies)), "Allergy Count", undefined, "Number of recorded allergies"), new Shared_PluginDataProperty(Form_PropertyKeys_HasSevereAllergy, "has_severe_allergy", "bool", toString_1(exists<AllergyFinderField_AllergyEntry>((a: AllergyFinderField_AllergyEntry): boolean => {
+        if (equals(a.Severity, AllergyFinderField_AllergySeverity_Severe())) {
+            return true;
+        }
+        else {
+            return equals(a.Severity, AllergyFinderField_AllergySeverity_LifeThreatening());
+        }
+    }, allergies)), "Has Severe Allergy", undefined, "Whether patient has any severe or life-threatening allergies"), new Shared_PluginDataProperty(Form_PropertyKeys_AllergiesJson, "allergies_json", "json", json, "Allergies Data", undefined, "Full allergy data as JSON")]));
+}, (fieldValue: Shared_FieldValue_$union): Option<any> => ((fieldValue.tag === /* PluginData */ 3) ? orElseWith<any>(map_2<Shared_PluginDataProperty, any>((p_1: Shared_PluginDataProperty): any => p_1.Value, tryFind<Shared_PluginDataProperty>((p: Shared_PluginDataProperty): boolean => (p.Name === "allergies_json"), fieldValue.fields[0])), (): Option<any> => some("[]")) : ((fieldValue.tag === /* Single */ 0) ? some(fieldValue.fields[0].Value) : some("[]"))), (): Option<FSharpList<Shared_FieldOption>> => undefined, (): FSharpList<string> => ofArray(["allergy_count", "has_severe_allergy", "allergies_json"]), (propertyName: string): Option<Shared_PluginDataProperty> => ((propertyName === "allergy_count") ? (new Shared_PluginDataProperty(Form_PropertyKeys_AllergyCount, "allergy_count", "int", "0", "Allergy Count", undefined, "Number of recorded allergies")) : ((propertyName === "has_severe_allergy") ? (new Shared_PluginDataProperty(Form_PropertyKeys_HasSevereAllergy, "has_severe_allergy", "bool", "false", "Has Severe Allergy", undefined, "Whether patient has any severe or life-threatening allergies")) : ((propertyName === "allergies_json") ? (new Shared_PluginDataProperty(Form_PropertyKeys_AllergiesJson, "allergies_json", "json", "[]", "Allergies Data", undefined, "Full allergy data as JSON")) : undefined))), (propertyKey: Shared_PluginPropertyKey): Option<Shared_PluginDataProperty> => (equals(propertyKey, Form_PropertyKeys_AllergyCount) ? (new Shared_PluginDataProperty(Form_PropertyKeys_AllergyCount, "allergy_count", "int", "0", "Allergy Count", undefined, "Number of recorded allergies")) : (equals(propertyKey, Form_PropertyKeys_HasSevereAllergy) ? (new Shared_PluginDataProperty(Form_PropertyKeys_HasSevereAllergy, "has_severe_allergy", "bool", "false", "Has Severe Allergy", undefined, "Whether patient has any severe or life-threatening allergies")) : (equals(propertyKey, Form_PropertyKeys_AllergiesJson) ? (new Shared_PluginDataProperty(Form_PropertyKeys_AllergiesJson, "allergies_json", "json", "[]", "Allergies Data", undefined, "Full allergy data as JSON")) : undefined))), (propertyName_1: string, fieldValue_1: Shared_FieldValue_$union): Option<Shared_PluginDataProperty> => {
+    switch (fieldValue_1.tag) {
+        case /* PluginData */ 3:
+            return tryFind<Shared_PluginDataProperty>((p_2: Shared_PluginDataProperty): boolean => (p_2.Name === propertyName_1), fieldValue_1.fields[0]);
+        case /* Single */ 0: {
+            const answer_1: Shared_FieldAnswer = fieldValue_1.fields[0];
+            const allergies_1: FSharpList<AllergyFinderField_AllergyEntry> = AllergyFinderField_parseAllergies(answer_1.Value);
+            return (propertyName_1 === "allergy_count") ? (new Shared_PluginDataProperty(Form_PropertyKeys_AllergyCount, "allergy_count", "int", int32ToString(length(allergies_1)), "Allergy Count", undefined, "Number of recorded allergies")) : ((propertyName_1 === "has_severe_allergy") ? (new Shared_PluginDataProperty(Form_PropertyKeys_HasSevereAllergy, "has_severe_allergy", "bool", toString_1(exists<AllergyFinderField_AllergyEntry>((a_1: AllergyFinderField_AllergyEntry): boolean => {
+                if (equals(a_1.Severity, AllergyFinderField_AllergySeverity_Severe())) {
+                    return true;
+                }
+                else {
+                    return equals(a_1.Severity, AllergyFinderField_AllergySeverity_LifeThreatening());
+                }
+            }, allergies_1)), "Has Severe Allergy", undefined, "Whether patient has any severe or life-threatening allergies")) : ((propertyName_1 === "allergies_json") ? (new Shared_PluginDataProperty(Form_PropertyKeys_AllergiesJson, "allergies_json", "json", answer_1.Value, "Allergies Data", undefined, "Full allergy data as JSON")) : undefined));
+        }
+        default:
+            return undefined;
+    }
+}, (propertyKey_1: Shared_PluginPropertyKey, fieldValue_2: Shared_FieldValue_$union): Option<Shared_PluginDataProperty> => ((fieldValue_2.tag === /* PluginData */ 3) ? tryFind<Shared_PluginDataProperty>((p_3: Shared_PluginDataProperty): boolean => equals(p_3.PropertyKey, propertyKey_1), fieldValue_2.fields[0]) : undefined), (propertyName_2: string, value: string): FSharpResult$2_$union<void, string> => {
+    switch (propertyName_2) {
+        case "allergy_count": {
+            let matchValue: [boolean, int32];
+            let outArg = 0;
+            matchValue = ([tryParse(value, 511, false, 32, new FSharpRef<int32>((): int32 => outArg, (v: int32): void => {
+                outArg = (v | 0);
+            })), outArg] as [boolean, int32]);
+            let matchResult: int32;
+            if (matchValue[0]) {
+                if (matchValue[1] >= 0) {
+                    matchResult = 0;
+                }
+                else {
+                    matchResult = 1;
+                }
+            }
+            else {
+                matchResult = 1;
+            }
+            switch (matchResult) {
+                case 0:
+                    return FSharpResult$2_Ok<void, string>(undefined);
+                default:
+                    return FSharpResult$2_Error<void, string>("Allergy count must be a non-negative integer");
+            }
+        }
+        case "has_severe_allergy": {
+            const matchValue_1: string = value.toLowerCase();
+            switch (matchValue_1) {
+                case "true":
+                case "false":
+                    return FSharpResult$2_Ok<void, string>(undefined);
+                default:
+                    return FSharpResult$2_Error<void, string>("Must be true or false");
+            }
+        }
+        case "allergies_json":
+            return FSharpResult$2_Ok<void, string>(undefined);
+        default:
+            return FSharpResult$2_Error<void, string>(`Unknown property: ${propertyName_2}`);
+    }
+}, (fieldValue_3: Shared_FieldValue_$union): FSharpList<Shared_PluginDataProperty> => {
+    switch (fieldValue_3.tag) {
+        case /* PluginData */ 3:
+            return fieldValue_3.fields[0];
+        case /* Single */ 0: {
+            const answer_2: Shared_FieldAnswer = fieldValue_3.fields[0];
+            const allergies_2: FSharpList<AllergyFinderField_AllergyEntry> = AllergyFinderField_parseAllergies(answer_2.Value);
+            const hasSevere_2: boolean = exists<AllergyFinderField_AllergyEntry>((a_2: AllergyFinderField_AllergyEntry): boolean => {
+                if (equals(a_2.Severity, AllergyFinderField_AllergySeverity_Severe())) {
+                    return true;
+                }
+                else {
+                    return equals(a_2.Severity, AllergyFinderField_AllergySeverity_LifeThreatening());
+                }
+            }, allergies_2);
+            return ofArray([new Shared_PluginDataProperty(Form_PropertyKeys_AllergyCount, "allergy_count", "int", int32ToString(length(allergies_2)), "Allergy Count", undefined, "Number of recorded allergies"), new Shared_PluginDataProperty(Form_PropertyKeys_HasSevereAllergy, "has_severe_allergy", "bool", toString_1(hasSevere_2), "Has Severe Allergy", undefined, "Whether patient has any severe or life-threatening allergies"), new Shared_PluginDataProperty(Form_PropertyKeys_AllergiesJson, "allergies_json", "json", answer_2.Value, "Allergies Data", undefined, "Full allergy data as JSON")]);
+        }
+        default:
+            return empty<Shared_PluginDataProperty>();
+    }
+});
+
+export function Form_designerPreview(props: RenderPreviewProps$1<Spec_FieldType_$union>): ReactElement {
+    let elems_3: Iterable<ReactElement>, elems_2: Iterable<ReactElement>, elems: Iterable<ReactElement>, elems_1: Iterable<ReactElement>;
+    const children: Iterable<ReactElement> = [createElement<any>("div", createObj(Helpers_combineClasses("box", ofArray([["style", {
+        border: (((1 + "px ") + "dashed") + " ") + "hsl(0, 0%, 86%)",
+        backgroundColor: "hsl(0, 0%, 98%)",
+        padding: 16,
+    }] as [string, any], (elems_3 = [createElement<any>("div", {
+        className: "has-text-weight-bold",
+        children: "Allergy Finder",
+        style: {
+            marginBottom: 8,
+        },
+    }), createElement<any>("div", createObj(ofArray([["style", {
+        fontSize: 11 + "px",
+        color: "hsl(0, 0%, 50%)",
+    }] as [string, any], (elems_2 = [createElement<any>("div", createObj(ofArray([["style", {
+        borderLeft: (((3 + "px ") + "solid") + " ") + "#ef4444",
+        paddingLeft: 8,
+        marginBottom: 6,
+    }] as [string, any], (elems = [createElement<any>("div", {
+        children: "Penicillin — Severe",
+    }), createElement<any>("div", {
+        style: {
+            fontSize: 9 + "px",
+        },
+        children: "Reactions: Rash, Hives, Anaphylaxis",
+    })], ["children", reactApi.Children.toArray(Array.from(elems))] as [string, any])]))), createElement<any>("div", createObj(ofArray([["style", {
+        borderLeft: (((3 + "px ") + "solid") + " ") + "#f59e0b",
+        paddingLeft: 8,
+        marginBottom: 6,
+    }] as [string, any], (elems_1 = [createElement<any>("div", {
+        children: "Pollen — Moderate",
+    }), createElement<any>("div", {
+        style: {
+            fontSize: 9 + "px",
+        },
+        children: "Reactions: Sneezing, Congestion",
+    })], ["children", reactApi.Children.toArray(Array.from(elems_1))] as [string, any])]))), createElement<any>("div", {
+        style: {
+            marginTop: 8,
+            color: "hsl(217, 91%, 60%)",
+            fontWeight: 600,
+        },
+        children: "+ Add Allergy",
+    })], ["children", reactApi.Children.toArray(Array.from(elems_2))] as [string, any])]))), createElement<any>("div", {
+        style: {
+            fontSize: 10 + "px",
+            color: "hsl(0, 0%, 60%)",
+            marginTop: 8,
+        },
+        children: "OpenFDA-powered allergy search with detailed profiles",
+    })], ["children", reactApi.Children.toArray(Array.from(elems_3))] as [string, any])]))))];
+    return createElement<any>("div", {
+        className: "control",
+        children: reactApi.Children.toArray(Array.from(children)),
+    });
+}
+
+export function Form_markdownRenderer(field: Spec_FormField$1<Spec_FieldType_$union>, fieldDetails: FieldDetails): string {
+    let matchValue: Shared_FieldValue_$union;
+    const allergies: FSharpList<AllergyFinderField_AllergyEntry> = AllergyFinderField_parseAllergies((matchValue = fieldDetails.FieldValue, (matchValue.tag === /* Single */ 0) ? matchValue.fields[0].Value : ((matchValue.tag === /* PluginData */ 3) ? defaultArg(map_2<Shared_PluginDataProperty, string>((p_1: Shared_PluginDataProperty): string => p_1.Value, tryFind<Shared_PluginDataProperty>((p: Shared_PluginDataProperty): boolean => (p.Name === "allergies_json"), matchValue.fields[0])), "[]") : "[]")));
+    if (isEmpty_1(allergies)) {
+        return `**${field.Label}:** *[No allergies recorded]*`;
+    }
+    else {
+        let rows: FSharpList<string> = ofArray([`**${field.Label}**`, "", "| Allergen | Severity | Category | Reactions | Remedy |", "|----------|----------|----------|-----------|--------|"]);
+        const enumerator: IEnumerator<AllergyFinderField_AllergyEntry> = getEnumerator(allergies);
+        try {
+            while (enumerator["System.Collections.IEnumerator.MoveNext"]()) {
+                const a: AllergyFinderField_AllergyEntry = enumerator["System.Collections.Generic.IEnumerator`1.get_Current"]();
+                let sevEmoji: string;
+                const matchValue_1: AllergyFinderField_AllergySeverity_$union = a.Severity;
+                sevEmoji = ((matchValue_1.tag === /* Severe */ 3) ? "🟠" : ((matchValue_1.tag === /* Moderate */ 2) ? "🟡" : ((matchValue_1.tag === /* Mild */ 1) ? "🟢" : ((matchValue_1.tag === /* Unknown */ 0) ? "⚪" : "🔴"))));
+                const reactions: string = isEmpty_1(a.Reactions) ? "--" : join(", ", truncate<string>(3, a.Reactions));
+                const remedy: string = defaultArg(a.Remedy, "--");
+                rows = append_1(rows, singleton_1(`| **${a.Name}** | ${sevEmoji} ${AllergyFinderField_severityLabel(a.Severity)} | ${AllergyFinderField_categoryLabel(a.Category)} | ${reactions} | ${remedy} |`));
+            }
+        }
+        finally {
+            disposeSafe(enumerator as IDisposable);
+        }
+        return join("\n", rows);
+    }
+}
+
+//# sourceMappingURL=AllergyFinderField.ts.map