formanitor 0.0.10 → 0.0.12

package/dist/index.mjs

@@ -1,19 +1,20 @@
 import * as React11 from 'react';
-import React11__default, { createContext, useRef, useEffect, useContext, useState, useMemo } from 'react';
+import React11__default, { createContext, useContext, useRef, useEffect, useState, useMemo, useCallback } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { cva } from 'class-variance-authority';
 import * as SelectPrimitive from '@radix-ui/react-select';
-import { ChevronDown, ChevronUp, Check, Circle, X, Image, Upload, Trash2, PenTool, Plus, ChevronRight, Calendar as Calendar$1, Clock, ChevronLeft } from 'lucide-react';
+import { ChevronDown, ChevronUp, Check, Circle, X, Image, Upload, Trash2, Plus, PenTool, ChevronRight, Calendar as Calendar$1, ChevronLeft, RefreshCw, Clock } from 'lucide-react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { Slot } from '@radix-ui/react-slot';
-import { format } from 'date-fns';
+import { format, addDays, addWeeks, addMonths, differenceInCalendarDays, parseISO } from 'date-fns';
 import { DayPicker } from 'react-day-picker';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { useReactTable, getCoreRowModel, flexRender } from '@tanstack/react-table';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 
 // src/core/validate.ts
 var EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
@@ -178,6 +179,7 @@ var FormStore = class {
   config;
   // Cache for debounce
   saveTimeout = null;
+  draftCallbackTimeout = null;
   constructor(schema, config = {}) {
     this.schema = schema;
     this.config = config;
@@ -247,6 +249,34 @@ var FormStore = class {
     this.checkEvents(fieldId, "onValueChange", value);
     this.evaluate();
     this.notify();
+    this.scheduleDraftCallback();
+    if (!this.config.onDraftChange) {
+      this.scheduleSave();
+    }
+  }
+  /**
+   * Set multiple values at once (e.g. from AI analysis). Only updates keys that
+   * exist in the schema. Runs evaluate/notify/save once.
+   * @param partial Map of fieldId -> value
+   * @param options.touch If false, do not mark fields as touched (e.g. for AI-suggested values)
+   */
+  setValues(partial, options) {
+    const touch = options?.touch !== false;
+    let changed = false;
+    const newValues = { ...this.state.values };
+    const newTouched = { ...this.state.touched };
+    for (const [fieldId, value] of Object.entries(partial)) {
+      if (!this.fieldMap[fieldId]) continue;
+      if (newValues[fieldId] === value) continue;
+      newValues[fieldId] = value;
+      if (touch) newTouched[fieldId] = true;
+      changed = true;
+    }
+    if (!changed) return;
+    this.state.values = newValues;
+    this.state.touched = newTouched;
+    this.evaluate();
+    this.notify();
     this.scheduleSave();
   }
   setTouched(fieldId) {
@@ -283,6 +313,26 @@ var FormStore = class {
       this.save();
     }, 1e3);
   }
+  scheduleDraftCallback() {
+    if (!this.config.onDraftChange) return;
+    if (this.draftCallbackTimeout) {
+      clearTimeout(this.draftCallbackTimeout);
+    }
+    this.draftCallbackTimeout = setTimeout(() => {
+      const payload = {
+        // For consumer callbacks, send values in the same
+        // serialized shape used for outbound submissions so
+        // media/signature fields are wrapped consistently.
+        values: this.serializeValuesForSubmission(this.state.values),
+        meta: {
+          updatedAt: Date.now(),
+          workflowState: this.state.workflowState,
+          version: this.schema.version
+        }
+      };
+      this.config.onDraftChange?.(payload);
+    }, 2500);
+  }
   async save() {
     const payload = {
       values: this.state.values,
@@ -378,6 +428,36 @@ var FormStore = class {
               this.state.values[comp.target] = 0;
             }
           }
+        } else if (comp.type === "formula") {
+          const evalExpr = (expr) => {
+            if (expr.type === "field") {
+              return Number(this.state.values[expr.field]) || 0;
+            }
+            if (expr.type === "number") {
+              return expr.value;
+            }
+            const left = evalExpr(expr.left);
+            const right = evalExpr(expr.right);
+            switch (expr.op) {
+              case "+":
+                return left + right;
+              case "-":
+                return left - right;
+              case "*":
+                return left * right;
+              case "/":
+                return right === 0 ? 0 : left / right;
+              case "**":
+                return Math.pow(left, right);
+              default:
+                return 0;
+            }
+          };
+          const result = evalExpr(comp.expression);
+          const value = Number.isFinite(result) ? Math.round(result * 10) / 10 : "";
+          if (this.state.values[comp.target] !== value) {
+            this.state.values[comp.target] = value;
+          }
         }
       });
     }
@@ -470,6 +550,7 @@ var FormStore = class {
     let needsReeval = false;
     if (next.onUpload !== void 0) this.config.onUpload = next.onUpload;
     if (next.onEvent !== void 0) this.config.onEvent = next.onEvent;
+    if (next.onDraftChange !== void 0) this.config.onDraftChange = next.onDraftChange;
     if (next.role !== void 0 && next.role !== this.config.role) {
       this.config.role = next.role;
       needsReeval = true;
@@ -532,7 +613,12 @@ var FormStore = class {
   }
 };
 var FormContext = createContext(null);
-var FormProvider = ({ schema, config, children }) => {
+var FieldHandlersContext = createContext({});
+function useFieldHandlers(fieldId) {
+  const map = useContext(FieldHandlersContext);
+  return map[fieldId] ?? { onSearch: async () => [], recentlyUsed: [] };
+}
+var FormProvider = ({ schema, config, fieldHandlers, children }) => {
   const storeRef = useRef(null);
   if (!storeRef.current) {
     storeRef.current = new FormStore(schema, config);
@@ -545,7 +631,7 @@ var FormProvider = ({ schema, config, children }) => {
   useEffect(() => {
     storeRef.current?.load();
   }, []);
-  return /* @__PURE__ */ jsx(FormContext.Provider, { value: storeRef.current, children });
+  return /* @__PURE__ */ jsx(FormContext.Provider, { value: storeRef.current, children: /* @__PURE__ */ jsx(FieldHandlersContext.Provider, { value: fieldHandlers ?? {}, children }) });
 };
 function useFormStore() {
   const context = useContext(FormContext);
@@ -638,8 +724,9 @@ var Textarea = React11.forwardRef(
     return /* @__PURE__ */ jsx(
       "textarea",
       {
+        spellCheck: false,
         className: cn(
-          "flex w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          "flex w-full rounded-md border border-input bg-background px-3 py-2 text-sm placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
           height == null && "min-h-[80px]",
           className
         ),
@@ -651,6 +738,28 @@ var Textarea = React11.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
+
+// src/ui/themes/textareaThemes.ts
+var textareaThemes = {
+  "highlight-label": {
+    wrapperClassName: "rounded-md overflow-hidden flex flex-col border border-[#D0D0D0]",
+    labelClassName: "rounded-t-md bg-[#FEE8EC] px-3 py-1 text-sm shrink-0 z-[1] text-slate-600",
+    inputClassName: "rounded-t-none rounded-b-md border-0 border-t border-[#D0D0D0] text-xs resize-none -mt-1 min-w-0 bg-white text-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50"
+  }
+};
+
+// src/ui/themes/index.ts
+var themeRegistries = {
+  textarea: textareaThemes,
+  text: textareaThemes
+  // same themes can apply to single-line text if desired
+};
+function getThemeConfig(fieldType, themeName) {
+  if (!themeName) return void 0;
+  const registry = themeRegistries[fieldType];
+  if (!registry) return void 0;
+  return registry[themeName];
+}
 var TextWidget = ({ fieldId }) => {
   const { fieldDef, value, setValue, setTouched, error, disabled, touched } = useField(fieldId);
   const { state } = useForm();
@@ -659,12 +768,20 @@ var TextWidget = ({ fieldId }) => {
   const Component = fieldDef.type === "textarea" || fieldDef.type === "richtext" ? Textarea : Input;
   const isTextarea = fieldDef.type === "textarea" || fieldDef.type === "richtext";
   const height = isTextarea && "height" in fieldDef ? fieldDef.height : void 0;
-  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ jsxs(Label, { htmlFor: fieldId, children: [
-      fieldDef.label,
-      " ",
-      fieldDef.required && /* @__PURE__ */ jsx("span", { className: "text-red-500", children: "*" })
-    ] }),
+  const theme = getThemeConfig(
+    isTextarea ? "textarea" : "text",
+    fieldDef.theme
+  );
+  const wrapperClass = theme?.wrapperClassName ?? "space-y-2";
+  const labelClass = theme?.labelClassName;
+  const inputClass = cn(theme?.inputClassName, showError && "border-red-500");
+  const labelContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+    fieldDef.label,
+    " ",
+    fieldDef.required && /* @__PURE__ */ jsx("span", { className: "text-red-500", children: "*" })
+  ] });
+  return /* @__PURE__ */ jsxs("div", { className: wrapperClass, children: [
+    theme ? /* @__PURE__ */ jsx(Label, { htmlFor: fieldId, className: labelClass, children: labelContent }) : /* @__PURE__ */ jsx(Label, { htmlFor: fieldId, children: labelContent }),
     /* @__PURE__ */ jsx(
       Component,
       {
@@ -674,7 +791,7 @@ var TextWidget = ({ fieldId }) => {
         onBlur: setTouched,
         disabled,
         type: fieldDef.type === "number" ? "number" : "text",
-        className: showError ? "border-red-500" : "",
+        className: inputClass,
         ...isTextarea && { height }
       }
     ),
@@ -2250,135 +2367,1898 @@ var CheckboxWidget = ({ fieldId }) => {
     showError && /* @__PURE__ */ jsx("p", { className: "text-xs text-red-500", children: error })
   ] });
 };
-var FieldRenderer = ({ fieldId }) => {
-  const { fieldDef, visible } = useField(fieldId);
-  if (!visible || !fieldDef) {
-    return null;
+var AISuggestionsContext = createContext({});
+function useAISuggestions() {
+  return useContext(AISuggestionsContext);
+}
+var AISuggestionsProvider = AISuggestionsContext.Provider;
+var Dialog = DialogPrimitive.Root;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props
   }
-  switch (fieldDef.type) {
-    case "text":
-    case "number":
-      return /* @__PURE__ */ jsx(TextWidget, { fieldId });
-    case "textarea":
-    case "richtext":
-      return /* @__PURE__ */ jsx(TextWidget, { fieldId });
-    case "date":
-      return /* @__PURE__ */ jsx(DateWidget, { fieldId });
-    case "datetime":
-      return /* @__PURE__ */ jsx(DateTimeWidget, { fieldId });
-    case "select":
-      return /* @__PURE__ */ jsx(SelectWidget, { fieldId });
-    case "radio":
-      return /* @__PURE__ */ jsx(RadioWidget, { fieldId });
-    case "checkbox":
-      return /* @__PURE__ */ jsx(CheckboxWidget, { fieldId });
-    case "multiselect":
-      return /* @__PURE__ */ jsx(MultiSelectWidget, { fieldId });
-    case "repeatable":
-      return /* @__PURE__ */ jsx(RepeatableWidget, { fieldId });
-    case "image_upload":
-      return /* @__PURE__ */ jsx(ImageUploadWidget, { fieldId });
-    case "signature":
-      return /* @__PURE__ */ jsx(SignatureUploadWidget, { fieldId });
-    case "editable_table":
-      return /* @__PURE__ */ jsx(EditableTableWidget, { fieldId });
-    case "static_text": {
-      const def = fieldDef;
-      const size = def.size ?? "regular";
-      const labelClass = size === "large" ? "text-base" : "text-sm";
-      const descClass = size === "large" ? "text-sm" : "text-xs";
-      return /* @__PURE__ */ jsxs("div", { className: `${labelClass} text-muted-foreground`, children: [
-        def.label,
-        def.description && /* @__PURE__ */ jsx("p", { className: `mt-1 ${descClass} opacity-90`, children: def.description })
-      ] });
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
+  /* @__PURE__ */ jsx(DialogOverlay, {}),
+  /* @__PURE__ */ jsxs(
+    DialogPrimitive.Content,
+    {
+      ref,
+      className: cn(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
+          /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
     }
-    default:
-      return /* @__PURE__ */ jsxs("div", { className: "text-red-500", children: [
-        "Unknown field type: ",
-        fieldDef.type
-      ] });
+  )
+] }));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col space-y-1.5 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+DialogHeader.displayName = "DialogHeader";
+var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn(
+      "text-lg font-semibold leading-none tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
   }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+var AddEntityDialog = ({
+  open,
+  onClose,
+  title,
+  recentlyUsedSlot,
+  children,
+  actionSlot
+}) => {
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: (o) => !o && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-lg w-full p-0 gap-0 flex flex-col max-h-[90vh] overflow-hidden", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { className: "px-6 pt-6 pb-4 shrink-0", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-lg font-semibold", children: title }) }),
+    /* @__PURE__ */ jsxs("div", { className: "px-6 flex flex-col gap-4 overflow-y-auto flex-1 min-h-0 pb-4", children: [
+      recentlyUsedSlot && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Recently Used" }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: recentlyUsedSlot })
+      ] }),
+      children
+    ] }),
+    actionSlot != null && /* @__PURE__ */ jsx("div", { className: "px-6 py-4 flex justify-end shrink-0 border-t border-border bg-background", children: actionSlot })
+  ] }) });
 };
-var Section = ({ title, children }) => {
-  const [expanded, setExpanded] = useState(true);
-  const handleToggle = () => setExpanded((prev) => !prev);
-  const contentClassName = cn(
-    "overflow-hidden transition-[height] duration-200 ease-in-out",
-    !expanded && "hidden"
-  );
-  return /* @__PURE__ */ jsxs("div", { className: "mb-6 border rounded-lg bg-white shadow-sm overflow-hidden", children: [
-    /* @__PURE__ */ jsxs(
+function mapToMedication(result) {
+  return {
+    id: result.id,
+    brand_name: result.name,
+    generic_name: result.generic_name ?? "",
+    frequency: "custom",
+    is_custom: false,
+    duration_value: "3",
+    duration_unit: "days",
+    before_after: "AFTER FOOD",
+    morning: "0",
+    afternoon: "0",
+    night: "0",
+    notes: ""
+  };
+}
+function mapAIMedicationToMedication(ai) {
+  const id = typeof ai.id === "string" ? Number.parseInt(ai.id, 10) || 0 : Number(ai.id);
+  return {
+    id: Number.isNaN(id) ? 0 : id,
+    brand_name: ai.brand_name ?? "",
+    generic_name: ai.generic_name ?? "",
+    frequency: "custom",
+    is_custom: false,
+    duration_value: "3",
+    duration_unit: "days",
+    before_after: "AFTER FOOD",
+    morning: "1",
+    afternoon: "0",
+    night: "1",
+    notes: ai.reason ?? ""
+  };
+}
+function createCustomMedication(name, customId) {
+  return {
+    id: customId,
+    brand_name: name.trim(),
+    generic_name: "",
+    frequency: "custom",
+    is_custom: true,
+    duration_value: "3",
+    duration_unit: "days",
+    before_after: "AFTER FOOD",
+    morning: "0",
+    afternoon: "0",
+    night: "0",
+    notes: ""
+  };
+}
+function Spinner({
+  value,
+  onChange
+}) {
+  const num = parseInt(value, 10) || 0;
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+    /* @__PURE__ */ jsx(
       "button",
       {
         type: "button",
-        onClick: handleToggle,
-        className: "w-full flex items-center justify-between gap-2 p-4 text-left border-b hover:bg-gray-50/80 transition-colors",
-        children: [
-          /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium", children: title }),
-          /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 text-muted-foreground", "aria-hidden": true, children: expanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-5 w-5" }) })
-        ]
+        className: "text-muted-foreground hover:text-foreground cursor-pointer",
+        onClick: () => onChange(String(num + 1)),
+        children: /* @__PURE__ */ jsx(ChevronUp, { className: "h-3 w-3" })
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsx("div", { className: "p-4 pt-4 space-y-4 border-t-0", children }) })
-  ] });
-};
-var ColumnLayout = ({
-  columns,
-  label,
-  children
-}) => {
-  const gridCols = Math.max(1, Math.min(columns, 12));
-  const gridClass = `grid gap-4 w-full`;
-  const style = {
-    gridTemplateColumns: `repeat(${gridCols}, minmax(0, 1fr))`
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "mb-6", children: [
-    label != null && label !== "" && /* @__PURE__ */ jsx("div", { className: "mb-2 text-sm font-medium text-gray-700", children: label }),
-    /* @__PURE__ */ jsx("div", { className: gridClass, style, children })
+    /* @__PURE__ */ jsx("span", { className: "text-sm w-4 text-center leading-none", children: num }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "text-muted-foreground hover:text-foreground cursor-pointer",
+        onClick: () => onChange(String(Math.max(0, num - 1))),
+        children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3" })
+      }
+    )
   ] });
-};
-var DynamicForm = () => {
-  const store = useFormStore();
-  const schema = store.getSchema();
-  const { state } = useForm();
-  return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
-    /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
-      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold", children: schema.title }),
-      /* @__PURE__ */ jsxs("div", { className: "text-sm text-gray-500", children: [
-        "Version: ",
-        schema.version,
-        " | State: ",
-        state.workflowState
-      ] })
+}
+function MedicationCard({
+  med,
+  onUpdate,
+  onRemove
+}) {
+  const [notesOpen, setNotesOpen] = useState(false);
+  function set(key, val) {
+    onUpdate({ ...med, [key]: val });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "bg-gray-50 rounded-lg p-3 space-y-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+      /* @__PURE__ */ jsx("span", { className: "font-semibold text-sm flex-1 min-w-0 truncate", children: med.brand_name }),
+      /* @__PURE__ */ jsxs(
+        "select",
+        {
+          className: "text-xs border border-border rounded px-2 py-1 bg-white shrink-0",
+          value: med.frequency,
+          onChange: (e) => set("frequency", e.target.value),
+          children: [
+            /* @__PURE__ */ jsx("option", { value: "custom", children: "select frequency" }),
+            /* @__PURE__ */ jsx("option", { value: "OD", children: "OD" }),
+            /* @__PURE__ */ jsx("option", { value: "BD", children: "BD" }),
+            /* @__PURE__ */ jsx("option", { value: "TDS", children: "TDS" }),
+            /* @__PURE__ */ jsx("option", { value: "QID", children: "QID" }),
+            /* @__PURE__ */ jsx("option", { value: "SOS", children: "SOS" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "flex gap-4 items-center shrink-0", children: ["morning", "afternoon", "night"].map((slot) => /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "text-[10px] font-semibold uppercase text-muted-foreground tracking-wide",
+          children: slot === "afternoon" ? "AFTERNOON" : slot === "morning" ? "MORNING" : "NIGHT"
+        },
+        slot
+      )) }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onRemove,
+          className: "text-red-400 hover:text-red-600 shrink-0 p-1 cursor-pointer",
+          children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+        }
+      )
     ] }),
-    schema.layout.map((node) => {
-      if (node.type === "section") {
-        return /* @__PURE__ */ jsx(Section, { title: node.title, children: node.children.map(
-          (child, index) => typeof child === "string" ? /* @__PURE__ */ jsx(FieldRenderer, { fieldId: child }, child) : child.type === "column_layout" ? /* @__PURE__ */ jsx(
-            ColumnLayout,
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 shrink-0", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "text",
+            inputMode: "numeric",
+            pattern: "[0-9]*",
+            className: "w-11 text-sm border border-border rounded px-2 py-1 bg-white",
+            value: med.duration_value,
+            onChange: (e) => {
+              const v = e.target.value.replace(/\D/g, "");
+              set("duration_value", v === "" ? "" : v);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            className: "text-xs border border-border rounded px-2 py-1 bg-white",
+            value: med.duration_unit,
+            onChange: (e) => set("duration_unit", e.target.value),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "days", children: "days" }),
+              /* @__PURE__ */ jsx("option", { value: "weeks", children: "weeks" }),
+              /* @__PURE__ */ jsx("option", { value: "months", children: "months" })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex gap-2 items-center flex-1 min-w-0 justify-end", children: ["morning", "afternoon", "night"].map((slot) => /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center gap-0.5", children: /* @__PURE__ */ jsx(Spinner, { value: med[slot], onChange: (v) => set(slot, v) }) }, slot)) }),
+      /* @__PURE__ */ jsxs(
+        "select",
+        {
+          className: "text-xs border border-border rounded px-2 py-1 bg-white shrink-0",
+          value: med.before_after === "AFTER FOOD" ? "AF" : "BF",
+          onChange: (e) => set("before_after", e.target.value === "AF" ? "AFTER FOOD" : "BEFORE FOOD"),
+          children: [
+            /* @__PURE__ */ jsx("option", { value: "AF", children: "AF" }),
+            /* @__PURE__ */ jsx("option", { value: "BF", children: "BF" })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "button",
+        tabIndex: 0,
+        onClick: () => setNotesOpen((o) => !o),
+        onKeyDown: (e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            setNotesOpen((o) => !o);
+          }
+        },
+        className: cn(
+          "flex items-center gap-2 w-full text-left text-xs text-muted-foreground hover:text-foreground",
+          "cursor-pointer py-2 px-2 rounded border border-transparent hover:bg-gray-100/80 transition-colors"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            ChevronRight,
             {
-              columns: child.columns,
-              label: child.label,
-              children: child.children.map((fieldId) => /* @__PURE__ */ jsx(FieldRenderer, { fieldId }, fieldId))
-            },
-            child.id
-          ) : /* @__PURE__ */ jsx(React11__default.Fragment, {}, child.id ?? index)
-        ) }, node.id);
+              className: cn("h-3 w-3 shrink-0 transition-transform", notesOpen && "rotate-90")
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { children: "Medicine Notes" })
+        ]
       }
-      if (node.type === "column_layout") {
-        return /* @__PURE__ */ jsx(
-          ColumnLayout,
-          {
-            columns: node.columns,
-            label: node.label,
-            children: node.children.map((fieldId) => /* @__PURE__ */ jsx(FieldRenderer, { fieldId }, fieldId))
-          },
-          node.id
-        );
+    ),
+    notesOpen && /* @__PURE__ */ jsx("div", { className: "relative z-10 mt-0.5", children: /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        className: "block w-full text-xs border border-border rounded px-2 py-1 resize-none bg-white min-h-0",
+        rows: 2,
+        placeholder: "Add notes...",
+        value: med.notes,
+        onChange: (e) => set("notes", e.target.value)
       }
-      return null;
-    })
+    ) })
   ] });
+}
+var ADD_FEEDBACK_MS = 320;
+function SearchResultCard({
+  result,
+  isAdding,
+  onSelect
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: onSelect,
+      className: cn(
+        "w-full text-left border rounded-lg px-3 py-2 transition-all duration-300 ease-out cursor-pointer flex items-center justify-between gap-2",
+        isAdding ? "border-green-400 bg-green-50 scale-[0.98]" : "border-border bg-white hover:bg-gray-50"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 text-left", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold leading-tight truncate", children: result.name }),
+          result.generic_name && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground mt-0.5 truncate", children: [
+            "Generic: ",
+            result.generic_name
+          ] })
+        ] }),
+        isAdding && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 shrink-0 text-green-600" })
+      ]
+    }
+  );
+}
+var AddMedicationField = ({
+  label = "Medications",
+  value,
+  onChange,
+  onSearch,
+  recentlyUsed = [],
+  suggestedMedications = []
+}) => {
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [addingResultId, setAddingResultId] = useState(null);
+  const debounceRef = useRef(null);
+  const customIdRef = useRef(-1);
+  const valueRef = useRef([]);
+  const searchInputRef = useRef(null);
+  const safeValue = Array.isArray(value) ? value : [];
+  valueRef.current = safeValue;
+  const addedIds = new Set(safeValue.map((m) => String(m.id)));
+  useEffect(() => {
+    if (!open) {
+      setQuery("");
+      setResults([]);
+      setAddingResultId(null);
+    }
+  }, [open]);
+  function handleQueryChange(q) {
+    setQuery(q);
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    if (!q.trim()) {
+      setResults([]);
+      return;
+    }
+    debounceRef.current = setTimeout(async () => {
+      setLoading(true);
+      try {
+        const res = await onSearch(q);
+        setResults(res);
+      } finally {
+        setLoading(false);
+      }
+    }, 500);
+  }
+  function handleRecentlyUsedToggle(result) {
+    if (addedIds.has(String(result.id))) {
+      onChange(safeValue.filter((m) => String(m.id) !== String(result.id)));
+    } else {
+      onChange([...safeValue, mapToMedication(result)]);
+    }
+  }
+  function handleResultClick(result) {
+    if (addedIds.has(String(result.id))) return;
+    setAddingResultId(result.id);
+    setTimeout(() => {
+      onChange([...valueRef.current, mapToMedication(result)]);
+      setAddingResultId(null);
+      setQuery("");
+      setResults([]);
+      setTimeout(() => searchInputRef.current?.focus(), 0);
+    }, ADD_FEEDBACK_MS);
+  }
+  function handleSave() {
+    const trimmed = query.trim();
+    if (!trimmed) return;
+    const customId = customIdRef.current--;
+    onChange([...safeValue, createCustomMedication(trimmed, customId)]);
+    setQuery("");
+    setResults([]);
+  }
+  function handleAddSuggestion(ai) {
+    if (addedIds.has(String(ai.id))) return;
+    onChange([...safeValue, mapAIMedicationToMedication(ai)]);
+  }
+  function updateMed(index, updated) {
+    const next = [...safeValue];
+    next[index] = updated;
+    onChange(next);
+  }
+  function removeMed(index) {
+    onChange(safeValue.filter((_, i) => i !== index));
+  }
+  const recentlyUsedChips = recentlyUsed.map((r) => {
+    const isAdded = addedIds.has(String(r.id));
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => handleRecentlyUsedToggle(r),
+        className: cn(
+          "rounded-full border text-xs px-3 py-1 transition-colors cursor-pointer",
+          isAdded ? "border-green-300 bg-green-50 text-green-700" : "border-border bg-white hover:bg-gray-50"
+        ),
+        children: [
+          isAdded && /* @__PURE__ */ jsx("span", { className: "mr-1", children: "\u2713" }),
+          r.name
+        ]
+      },
+      r.id
+    );
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-md overflow-hidden flex flex-col border bg-white border-[#D0D0D0] space-y-3 p-3 h-fit", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: label }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setOpen(true),
+          className: "text-sm font-semibold text-purple-600 hover:text-purple-800 cursor-pointer",
+          children: "ADD"
+        }
+      )
+    ] }),
+    suggestedMedications.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-1.5 items-center", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground mr-1", children: "Suggestions:" }),
+      suggestedMedications.filter((s) => !addedIds.has(String(s.id))).map((s) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => handleAddSuggestion(s),
+          className: "inline-flex items-center gap-1 rounded-full border border-dashed border-purple-300 bg-purple-50/80 text-purple-800 text-xs px-2.5 py-1 hover:bg-purple-100 transition-colors cursor-pointer",
+          children: [
+            /* @__PURE__ */ jsx(Plus, { className: "h-3 w-3" }),
+            s.brand_name || s.generic_name || String(s.id)
+          ]
+        },
+        String(s.id)
+      ))
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "space-y-2", children: safeValue.map((med, i) => /* @__PURE__ */ jsx(
+      MedicationCard,
+      {
+        med,
+        onUpdate: (u) => updateMed(i, u),
+        onRemove: () => removeMed(i)
+      },
+      med.id
+    )) }),
+    /* @__PURE__ */ jsx(
+      AddEntityDialog,
+      {
+        open,
+        onClose: () => setOpen(false),
+        title: "Add Medication",
+        recentlyUsedSlot: recentlyUsedChips.length > 0 ? recentlyUsedChips : void 0,
+        actionSlot: /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            disabled: !query.trim(),
+            onClick: handleSave,
+            className: cn(
+              "rounded-md px-5 py-2 text-sm font-semibold bg-primary text-primary-foreground hover:bg-primary/90 transition-opacity cursor-pointer",
+              !query.trim() && "opacity-40 cursor-not-allowed"
+            ),
+            children: "Save Medicine"
+          }
+        ),
+        children: /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              ref: searchInputRef,
+              value: query,
+              onChange: (e) => handleQueryChange(e.target.value),
+              placeholder: "Search medicines...",
+              className: "border border-border rounded-md focus-visible:ring-0"
+            }
+          ),
+          loading && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground text-center py-2", children: "Searching\u2026" }),
+          !loading && results.length > 0 && /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-2 max-h-64 overflow-y-auto", children: results.map((r) => /* @__PURE__ */ jsx(
+            SearchResultCard,
+            {
+              result: r,
+              isAdding: addingResultId === r.id,
+              onSelect: () => handleResultClick(r)
+            },
+            r.id
+          )) })
+        ] })
+      }
+    )
+  ] });
+};
+var AddMedicationWidget = ({ fieldId }) => {
+  const { value, setValue } = useField(fieldId);
+  const handlers = useFieldHandlers(fieldId);
+  const { medications: suggestedMedications } = useAISuggestions();
+  const safeValue = Array.isArray(value) ? value : [];
+  return /* @__PURE__ */ jsx(
+    AddMedicationField,
+    {
+      value: safeValue,
+      onChange: setValue,
+      onSearch: handlers.onSearch,
+      recentlyUsed: handlers.recentlyUsed,
+      suggestedMedications
+    }
+  );
+};
+var ADD_FEEDBACK_MS2 = 320;
+function mapToInvestigation(result) {
+  return {
+    ...result,
+    label: result.name,
+    is_custom: false,
+    fromAI: false
+  };
+}
+var AddInvestigationField = ({
+  label = "Investigations",
+  value,
+  onChange,
+  onSearch,
+  recentlyUsed = []
+}) => {
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [addingId, setAddingId] = useState(null);
+  const debounceRef = useRef(null);
+  const valueRef = useRef([]);
+  const searchInputRef = useRef(null);
+  valueRef.current = value;
+  const addedIds = new Set(value.map((inv) => inv.id));
+  useEffect(() => {
+    if (!open) {
+      setQuery("");
+      setResults([]);
+      setAddingId(null);
+    }
+  }, [open]);
+  function handleQueryChange(q) {
+    setQuery(q);
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    if (!q.trim()) {
+      setResults([]);
+      return;
+    }
+    debounceRef.current = setTimeout(async () => {
+      setLoading(true);
+      try {
+        const res = await onSearch(q);
+        setResults(res);
+      } finally {
+        setLoading(false);
+      }
+    }, 500);
+  }
+  function addInvestigation(result) {
+    if (!addedIds.has(result.id)) {
+      onChange([...valueRef.current, mapToInvestigation(result)]);
+    }
+    setQuery("");
+    setResults([]);
+  }
+  function handleResultClick(result) {
+    if (addedIds.has(result.id)) return;
+    setAddingId(result.id);
+    setTimeout(() => {
+      addInvestigation(result);
+      setAddingId(null);
+      setTimeout(() => searchInputRef.current?.focus(), 0);
+    }, ADD_FEEDBACK_MS2);
+  }
+  function removeInvestigation(id) {
+    onChange(value.filter((inv) => inv.id !== id));
+  }
+  function handleRecentlyUsedToggle(result) {
+    if (addedIds.has(result.id)) {
+      removeInvestigation(result.id);
+    } else {
+      addInvestigation(result);
+    }
+  }
+  const recentlyUsedChips = recentlyUsed.map((r) => {
+    const isAdded = addedIds.has(r.id);
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => handleRecentlyUsedToggle(r),
+        className: cn(
+          "rounded-full border text-xs px-3 py-1 transition-colors",
+          isAdded ? "border-green-300 bg-green-50 text-green-700" : "border-border bg-white hover:bg-gray-50"
+        ),
+        children: [
+          isAdded && /* @__PURE__ */ jsx("span", { className: "mr-1", children: "\u2713" }),
+          r.name
+        ]
+      },
+      r.id
+    );
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-md overflow-hidden flex flex-col bg-white border border-[#D0D0D0] space-y-3 p-3 h-fit", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: label }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setOpen(true),
+          className: "text-sm font-semibold text-purple-600 hover:text-purple-800 cursor-pointer",
+          children: "ADD"
+        }
+      )
+    ] }),
+    value.length > 0 && /* @__PURE__ */ jsx("div", { className: "divide-y divide-border rounded-lg border border-border overflow-hidden", children: value.map((inv) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-center justify-between px-3 py-2 bg-white hover:bg-gray-50",
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "text-sm", children: inv.name }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => removeInvestigation(inv.id),
+              className: "text-muted-foreground hover:text-red-500 transition-colors cursor-pointer",
+              children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+            }
+          )
+        ]
+      },
+      inv.id
+    )) }),
+    /* @__PURE__ */ jsx(
+      AddEntityDialog,
+      {
+        open,
+        onClose: () => setOpen(false),
+        title: "Add Investigation",
+        recentlyUsedSlot: recentlyUsedChips.length > 0 ? recentlyUsedChips : void 0,
+        children: /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              ref: searchInputRef,
+              value: query,
+              onChange: (e) => handleQueryChange(e.target.value),
+              placeholder: "Search for an investigation...",
+              className: "border border-border rounded-md focus-visible:ring-0"
+            }
+          ),
+          loading && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground py-1", children: "Searching\u2026" }),
+          !loading && results.length > 0 && /* @__PURE__ */ jsx("div", { className: "border border-border rounded-md overflow-hidden", children: results.map((r) => {
+            const isAdding = addingId === r.id;
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleResultClick(r),
+                className: cn(
+                  "w-full text-left px-3 py-2 text-sm transition-all duration-300 ease-out border-b border-border last:border-b-0 cursor-pointer flex items-center justify-between gap-2",
+                  isAdding ? "bg-green-50 border-green-200" : "hover:bg-gray-50"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "truncate", children: r.name }),
+                  isAdding && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 shrink-0 text-green-600" })
+                ]
+              },
+              r.id
+            );
+          }) })
+        ] })
+      }
+    )
+  ] });
+};
+var AddInvestigationWidget = ({ fieldId }) => {
+  const { value, setValue } = useField(fieldId);
+  const handlers = useFieldHandlers(fieldId);
+  return /* @__PURE__ */ jsx(
+    AddInvestigationField,
+    {
+      value: value ?? [],
+      onChange: setValue,
+      onSearch: handlers.onSearch,
+      recentlyUsed: handlers.recentlyUsed
+    }
+  );
+};
+var ADD_FEEDBACK_MS3 = 320;
+function mapToProcedure(result) {
+  return {
+    ...result,
+    label: result.name,
+    is_custom: false,
+    fromAI: false
+  };
+}
+var AddProcedureField = ({
+  label = "Procedures",
+  value,
+  onChange,
+  onSearch,
+  recentlyUsed = []
+}) => {
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [addingId, setAddingId] = useState(null);
+  const debounceRef = useRef(null);
+  const valueRef = useRef([]);
+  const searchInputRef = useRef(null);
+  valueRef.current = value;
+  const addedIds = new Set(value.map((proc) => proc.id));
+  useEffect(() => {
+    if (!open) {
+      setQuery("");
+      setResults([]);
+      setAddingId(null);
+    }
+  }, [open]);
+  function handleQueryChange(q) {
+    setQuery(q);
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    if (!q.trim()) {
+      setResults([]);
+      return;
+    }
+    debounceRef.current = setTimeout(async () => {
+      setLoading(true);
+      try {
+        const res = await onSearch(q);
+        setResults(res);
+      } finally {
+        setLoading(false);
+      }
+    }, 500);
+  }
+  function addProcedure(result) {
+    if (!addedIds.has(result.id)) {
+      onChange([...valueRef.current, mapToProcedure(result)]);
+    }
+    setQuery("");
+    setResults([]);
+  }
+  function handleResultClick(result) {
+    if (addedIds.has(result.id)) return;
+    setAddingId(result.id);
+    setTimeout(() => {
+      addProcedure(result);
+      setAddingId(null);
+      setTimeout(() => searchInputRef.current?.focus(), 0);
+    }, ADD_FEEDBACK_MS3);
+  }
+  function removeProcedure(id) {
+    onChange(value.filter((proc) => proc.id !== id));
+  }
+  function handleRecentlyUsedToggle(result) {
+    if (addedIds.has(result.id)) {
+      removeProcedure(result.id);
+    } else {
+      addProcedure(result);
+    }
+  }
+  const recentlyUsedChips = recentlyUsed.map((r) => {
+    const isAdded = addedIds.has(r.id);
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => handleRecentlyUsedToggle(r),
+        className: cn(
+          "rounded-full border text-xs px-3 py-1 transition-colors",
+          isAdded ? "border-green-300 bg-green-50 text-green-700" : "border-border bg-white hover:bg-gray-50"
+        ),
+        children: [
+          isAdded && /* @__PURE__ */ jsx("span", { className: "mr-1", children: "\u2713" }),
+          r.name
+        ]
+      },
+      r.id
+    );
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-md overflow-hidden flex flex-col bg-white border border-[#D0D0D0] space-y-3 p-3 h-fit", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: label }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setOpen(true),
+          className: "text-sm font-semibold text-purple-600 hover:text-purple-800 cursor-pointer",
+          children: "ADD"
+        }
+      )
+    ] }),
+    value.length > 0 && /* @__PURE__ */ jsx("div", { className: "divide-y divide-border rounded-lg border border-border overflow-hidden", children: value.map((proc) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-center justify-between px-3 py-2 bg-white hover:bg-gray-50",
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "text-sm", children: proc.name }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => removeProcedure(proc.id),
+              className: "text-muted-foreground hover:text-red-500 transition-colors cursor-pointer",
+              children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+            }
+          )
+        ]
+      },
+      proc.id
+    )) }),
+    /* @__PURE__ */ jsx(
+      AddEntityDialog,
+      {
+        open,
+        onClose: () => setOpen(false),
+        title: "Add Procedure",
+        recentlyUsedSlot: recentlyUsedChips.length > 0 ? recentlyUsedChips : void 0,
+        children: /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              ref: searchInputRef,
+              value: query,
+              onChange: (e) => handleQueryChange(e.target.value),
+              placeholder: "Search for a procedure...",
+              className: "border border-border rounded-md focus-visible:ring-0"
+            }
+          ),
+          loading && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground py-1", children: "Searching\u2026" }),
+          !loading && results.length > 0 && /* @__PURE__ */ jsx("div", { className: "border border-border rounded-md overflow-hidden", children: results.map((r) => {
+            const isAdding = addingId === r.id;
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleResultClick(r),
+                className: cn(
+                  "w-full text-left px-3 py-2 text-sm transition-all duration-300 ease-out border-b border-border last:border-b-0 cursor-pointer flex items-center justify-between gap-2",
+                  isAdding ? "bg-green-50 border-green-200" : "hover:bg-gray-50"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "truncate", children: r.name }),
+                  isAdding && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 shrink-0 text-green-600" })
+                ]
+              },
+              r.id
+            );
+          }) })
+        ] })
+      }
+    )
+  ] });
+};
+var AddProcedureWidget = ({ fieldId }) => {
+  const { value, setValue } = useField(fieldId);
+  const handlers = useFieldHandlers(fieldId);
+  return /* @__PURE__ */ jsx(
+    AddProcedureField,
+    {
+      value: value ?? [],
+      onChange: setValue,
+      onSearch: handlers.onSearch,
+      recentlyUsed: handlers.recentlyUsed
+    }
+  );
+};
+function getStatusBasedClass(status) {
+  switch ((status || "").toLowerCase()) {
+    case "high":
+      return "bg-red-100 text-red-500";
+    case "medium":
+      return "bg-yellow-100 text-yellow-600";
+    case "low":
+      return "bg-green-100 text-green-600";
+    default:
+      return "bg-gray-200 text-gray-600";
+  }
+}
+function DiagnosisCard({ item, defaultOpen = false }) {
+  const [open, setOpen] = useState(defaultOpen);
+  return /* @__PURE__ */ jsxs("div", { className: "border border-gray-200 rounded-lg bg-[#F2F2F2] mb-2 last:mb-0 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setOpen((o) => !o),
+        className: cn(
+          "w-full text-left flex items-center gap-2 py-2 px-3 rounded-lg",
+          "cursor-pointer hover:bg-gray-200/60 transition-colors"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            ChevronRight,
+            {
+              className: cn("h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform", open && "rotate-90")
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-xs text-gray-500 font-medium", children: item.category.charAt(0).toUpperCase() + item.category.slice(1) }),
+            /* @__PURE__ */ jsx("div", { className: "text-sm text-black font-semibold mt-0.5 leading-tight", children: item.condition })
+          ] })
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 px-3 pb-3 pt-0 pl-9", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-xs font-semibold text-gray-500", children: [
+        /* @__PURE__ */ jsx("span", { children: "LIKELIHOOD" }),
+        /* @__PURE__ */ jsx("span", { children: "SEVERITY" }),
+        /* @__PURE__ */ jsx("span", { children: "TREATABILITY" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-between gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: cn("px-2.5 py-0.5 rounded-full text-xs font-bold shrink-0", getStatusBasedClass(item.likelihood)), children: item.likelihood }),
+        /* @__PURE__ */ jsx("span", { className: cn("px-2.5 py-0.5 rounded-full text-xs font-bold shrink-0", getStatusBasedClass(item.severity)), children: item.severity }),
+        /* @__PURE__ */ jsx("span", { className: cn("px-2.5 py-0.5 rounded-full text-xs font-bold shrink-0", getStatusBasedClass(item.treatability)), children: item.treatability })
+      ] }),
+      item.keyFeatures && item.keyFeatures.length > 0 && /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
+        /* @__PURE__ */ jsx("div", { className: "text-xs font-semibold text-gray-500 mb-0.5 uppercase tracking-wider", children: "Key Features" }),
+        /* @__PURE__ */ jsx("ul", { className: "list-disc pl-4 text-xs text-gray-700 space-y-0.5", children: item.keyFeatures.map((feature, i) => /* @__PURE__ */ jsx("li", { children: feature }, i)) })
+      ] }),
+      item.nextSteps && item.nextSteps.length > 0 && /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
+        /* @__PURE__ */ jsx("div", { className: "text-xs font-semibold text-gray-500 mb-0.5 uppercase tracking-wider", children: "Next Steps" }),
+        /* @__PURE__ */ jsx("ul", { className: "list-disc pl-4 text-xs text-gray-700 space-y-0.5", children: item.nextSteps.map((step, i) => /* @__PURE__ */ jsx("li", { children: step }, i)) })
+      ] })
+    ] })
+  ] });
+}
+var DifferentialDiagnosis = ({
+  differentialDiagnosis,
+  className = "",
+  height = "300px"
+}) => {
+  const hasItems = Array.isArray(differentialDiagnosis) && differentialDiagnosis.length > 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "rounded-md overflow-hidden flex flex-col border border-[#D0D0D0]",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "rounded-t-md bg-[#FEE8EC] px-3 py-1.5 text-xs shrink-0 z-[1] text-slate-600 flex items-center font-semibold", children: /* @__PURE__ */ jsx("span", { children: "Differential Diagnosis" }) }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "relative bg-white rounded-b-md border-t border-[#D0D0D0] overflow-y-auto p-3",
+              "focus-visible:outline-none"
+            ),
+            style: { minHeight: height, maxHeight: height },
+            children: [
+              hasItems ? differentialDiagnosis.map((item, idx) => /* @__PURE__ */ jsx(DiagnosisCard, { item, defaultOpen: idx === 0 }, idx)) : /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "No differential diagnosis yet." }),
+              /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-[30%] bg-gradient-to-t from-white via-white/80 to-transparent" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+var DifferentialDiagnosisWidget = ({ fieldId }) => {
+  const { value } = useField(fieldId);
+  const items = Array.isArray(value) ? value : [];
+  return /* @__PURE__ */ jsx(DifferentialDiagnosis, { differentialDiagnosis: items });
+};
+var Spinner2 = React11.forwardRef(
+  ({ className, size = "md", ...props }, ref) => {
+    const sizeClasses = {
+      sm: "h-4 w-4 border-2",
+      md: "h-6 w-6 border-2",
+      lg: "h-8 w-8 border-3"
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "animate-spin rounded-full border-primary border-t-transparent",
+          sizeClasses[size],
+          className
+        ),
+        ...props,
+        children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading..." })
+      }
+    );
+  }
+);
+Spinner2.displayName = "Spinner";
+function buildItems(data) {
+  const items = [];
+  const hasBP = data.blood_pressure_systolic != null || data.blood_pressure_diastolic != null;
+  if (hasBP) {
+    const sys = data.blood_pressure_systolic ?? "\u2013";
+    const dia = data.blood_pressure_diastolic ?? "\u2013";
+    items.push({ label: "BP", value: `${sys}/${dia}` });
+  }
+  if (data.heart_rate != null)
+    items.push({ label: "Heart Rate", value: `${data.heart_rate} bpm` });
+  if (data.respiratory_rate != null)
+    items.push({ label: "Resp. Rate", value: `${data.respiratory_rate}/min` });
+  if (data.oxygen_saturation != null)
+    items.push({ label: "SpO\u2082", value: `${data.oxygen_saturation}%` });
+  if (data.temperature != null)
+    items.push({ label: "Temp", value: `${data.temperature} \xB0F` });
+  if (data.height != null)
+    items.push({ label: "Height", value: `${data.height} cm` });
+  if (data.weight != null)
+    items.push({ label: "Weight", value: `${data.weight} kg` });
+  if (data.bmi != null)
+    items.push({ label: "BMI", value: `${data.bmi}` });
+  if (data.blood_sugar != null)
+    items.push({ label: "Blood Sugar", value: `${data.blood_sugar} mg/dL` });
+  if (data.circumference_of_head_in_cms != null)
+    items.push({ label: "Head Circ.", value: `${data.circumference_of_head_in_cms} cm` });
+  if (data.circumference_of_waist_in_cms != null)
+    items.push({ label: "Waist Circ.", value: `${data.circumference_of_waist_in_cms} cm` });
+  return items;
+}
+function formatRecordedAt(iso) {
+  if (!iso) return "";
+  try {
+    return new Date(iso).toLocaleString(void 0, {
+      day: "2-digit",
+      month: "short",
+      year: "numeric",
+      hour: "2-digit",
+      minute: "2-digit"
+    });
+  } catch {
+    return iso;
+  }
+}
+function VitalChip({ label, value }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0 rounded-md min-w-fit px-1.5", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[10px] font-sm text-gray-500 uppercase tracking-wide leading-none", children: label }),
+    /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-900 leading-tight", children: value })
+  ] });
+}
+var Vitals = ({
+  data,
+  loading = false,
+  error = null,
+  onRefresh,
+  className
+}) => {
+  const items = data ? buildItems(data) : [];
+  const hasItems = items.length > 0;
+  const recordedAt = data?.recorded_at ? formatRecordedAt(data.recorded_at) : null;
+  const notes = data?.notes?.trim() || null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "rounded-md overflow-hidden border border-[#D0D0D0] bg-white px-2 py-2",
+        className
+      ),
+      children: loading && !hasItems ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 py-1", children: [
+        /* @__PURE__ */ jsx(Spinner2, { size: "sm" }),
+        /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "Loading vitals\u2026" })
+      ] }) : error ? /* @__PURE__ */ jsx("p", { className: "text-xs text-red-500 py-1", children: error }) : hasItems ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-x-3 gap-y-1", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-x-2 gap-y-0.5", children: items.map((item) => /* @__PURE__ */ jsx(VitalChip, { ...item }, item.label)) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-end gap-0.5 shrink-0", children: [
+            recordedAt && /* @__PURE__ */ jsx("span", { className: "text-[10px] text-slate-500", children: recordedAt }),
+            onRefresh && /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: onRefresh,
+                disabled: loading,
+                className: cn(
+                  "flex items-center gap-0.5 text-[10px] font-medium text-slate-600",
+                  "hover:text-slate-900 transition-colors disabled:opacity-50 cursor-pointer"
+                ),
+                "aria-label": "Refresh vitals",
+                children: [
+                  /* @__PURE__ */ jsx(RefreshCw, { className: cn("h-2.5 w-2.5", loading && "animate-spin") }),
+                  /* @__PURE__ */ jsx("span", { children: "Refresh" })
+                ]
+              }
+            )
+          ] })
+        ] }),
+        notes && /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-600 pt-1.5 mt-0.5", children: notes })
+      ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 py-1", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "No vitals recorded." }),
+        onRefresh && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: onRefresh,
+            disabled: loading,
+            className: cn(
+              "flex items-center gap-0.5 text-[10px] font-medium text-slate-600",
+              "hover:text-slate-900 transition-colors disabled:opacity-50 shrink-0"
+            ),
+            "aria-label": "Refresh vitals",
+            children: [
+              /* @__PURE__ */ jsx(RefreshCw, { className: cn("h-2.5 w-2.5", loading && "animate-spin") }),
+              /* @__PURE__ */ jsx("span", { children: "Refresh" })
+            ]
+          }
+        )
+      ] })
+    }
+  );
+};
+var VitalsWidget = ({ fieldId }) => {
+  const { value, setValue, fieldDef } = useField(fieldId);
+  const handlers = useFieldHandlers(fieldId);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  console.log("[VitalsWidget] fieldId:", fieldId, "| onFetch present:", !!handlers.onFetch, "| value:", value);
+  const fetchVitals = useCallback(async () => {
+    if (!handlers.onFetch) return;
+    setLoading(true);
+    setError(null);
+    try {
+      const data = await handlers.onFetch();
+      console.log("[VitalsWidget] fetched data:", data);
+      setValue(data);
+    } catch {
+      setError("Failed to load vitals. Please try again.");
+    } finally {
+      setLoading(false);
+    }
+  }, [handlers, setValue]);
+  useEffect(() => {
+    fetchVitals();
+  }, []);
+  return /* @__PURE__ */ jsx(
+    Vitals,
+    {
+      label: fieldDef?.label ?? "Vitals",
+      data: value ?? null,
+      loading,
+      error,
+      onRefresh: handlers.onFetch ? fetchVitals : void 0
+    }
+  );
+};
+function normalizeOptions(response) {
+  if (Array.isArray(response)) {
+    return response.map((o) => ({ label: String(o.label), value: String(o.value) }));
+  }
+  if (response?.specializations?.length) {
+    return response.specializations.map((s) => ({ label: s, value: s }));
+  }
+  return [];
+}
+function normalizeValue(value) {
+  if (!value || !Array.isArray(value)) return [];
+  return value.map((item) => {
+    if (item && typeof item === "object" && "specialization" in item) {
+      const s = item.specialization;
+      const u = item.is_urgent;
+      return { specialization: String(s), is_urgent: Boolean(u) };
+    }
+    return { specialization: String(item), is_urgent: false };
+  });
+}
+var ReferralWidget = ({ fieldId }) => {
+  const { fieldDef, value, setValue, setTouched, error, disabled, touched } = useField(fieldId);
+  const handlers = useFieldHandlers(fieldId);
+  const [options, setOptions] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const { state } = useForm();
+  const showError = !!error && (touched || state.submitAttempted);
+  const selectedItems = normalizeValue(value);
+  const availableOptions = options.filter(
+    (opt) => !selectedItems.some((item) => item.specialization === opt.value)
+  );
+  const loadOptions = useCallback(async () => {
+    if (handlers.onFetchOptions) {
+      setLoading(true);
+      try {
+        const res = await handlers.onFetchOptions();
+        setOptions(normalizeOptions(res));
+      } finally {
+        setLoading(false);
+      }
+      return;
+    }
+    const def = fieldDef;
+    if (def?.options?.length) {
+      setOptions(def.options.map((o) => ({ label: String(o.label), value: String(o.value) })));
+    } else if (def?.dataSource) {
+      setLoading(true);
+      fetchOptions(def.dataSource.source, def.dataSource.params).then((opts) => setOptions(opts.map((o) => ({ label: String(o.label), value: String(o.value) })))).finally(() => setLoading(false));
+    } else {
+      setOptions([]);
+    }
+  }, [fieldDef, handlers]);
+  useEffect(() => {
+    if (!fieldDef) return;
+    loadOptions();
+  }, [fieldDef, loadOptions]);
+  const handleAdd = useCallback(
+    (specialization) => {
+      const next = [...selectedItems, { specialization, is_urgent: false }];
+      setValue(next);
+      setTouched();
+    },
+    [selectedItems, setValue, setTouched]
+  );
+  const handleRemove = useCallback(
+    (specialization) => {
+      const next = selectedItems.filter((item) => item.specialization !== specialization);
+      setValue(next);
+      setTouched();
+    },
+    [selectedItems, setValue, setTouched]
+  );
+  const handleToggleUrgent = useCallback(
+    (specialization) => {
+      const next = selectedItems.map(
+        (item) => item.specialization === specialization ? { ...item, is_urgent: !item.is_urgent } : item
+      );
+      setValue(next);
+      setTouched();
+    },
+    [selectedItems, setValue, setTouched]
+  );
+  if (!fieldDef) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxs(Label, { htmlFor: fieldId, children: [
+      "Referral to ",
+      fieldDef.required && /* @__PURE__ */ jsx("span", { className: "text-red-500", children: "*" })
+    ] }),
+    loading && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Loading..." }),
+    !loading && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          disabled,
+          value: "",
+          onValueChange: (val) => {
+            if (val) {
+              handleAdd(val);
+            }
+          },
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { id: fieldId, className: showError ? "border-red-500" : "", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select specializations..." }) }),
+            /* @__PURE__ */ jsxs(SelectContent, { children: [
+              availableOptions.map((opt) => /* @__PURE__ */ jsx(SelectItem, { value: opt.value, children: opt.label }, opt.value)),
+              availableOptions.length === 0 && /* @__PURE__ */ jsx("div", { className: "py-2 px-2 text-sm text-muted-foreground", children: "All specializations selected" })
+            ] })
+          ]
+        },
+        `referral-${selectedItems.map((i) => i.specialization).join(",")}`
+      ),
+      selectedItems.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5 mt-1.5", children: selectedItems.map((item) => {
+        const isUrgent = item.is_urgent;
+        const chipClass = isUrgent ? "inline-flex items-center gap-0.5 px-2 py-0.5 bg-red-100 text-red-800 border border-red-300 rounded-full text-xs max-w-full cursor-pointer hover:bg-red-200 transition-colors" : "inline-flex items-center gap-0.5 px-2 py-0.5 bg-blue-100 text-blue-800 rounded-full text-xs max-w-full cursor-pointer hover:bg-blue-200 transition-colors";
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: chipClass,
+            onClick: (e) => {
+              if (e.target instanceof HTMLElement && e.target.closest("button")) return;
+              handleToggleUrgent(item.specialization);
+            },
+            children: [
+              isUrgent && /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 bg-red-600 text-white text-[10px] font-bold px-1 py-0.5 rounded mr-1", children: "U" }),
+              /* @__PURE__ */ jsx("span", { className: "truncate max-w-[120px]", children: item.specialization }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    handleRemove(item.specialization);
+                  },
+                  className: "ml-0.5 text-blue-600 hover:text-blue-800 focus:outline-none flex-shrink-0 text-sm leading-none",
+                  "aria-label": `Remove ${item.specialization}`,
+                  children: "\xD7"
+                }
+              )
+            ]
+          },
+          item.specialization
+        );
+      }) }),
+      selectedItems.length === 0 && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: "No specializations selected" }),
+      selectedItems.length > 0 && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1.5", children: "Click a chip to mark as urgent" })
+    ] }),
+    showError && /* @__PURE__ */ jsx("p", { className: "text-xs text-red-500", children: error })
+  ] });
+};
+var Card = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn(
+      "rounded-lg border bg-card text-card-foreground shadow-sm",
+      className
+    ),
+    ...props
+  }
+));
+Card.displayName = "Card";
+var CardHeader = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn("flex flex-col space-y-1.5 p-6", className),
+    ...props
+  }
+));
+CardHeader.displayName = "CardHeader";
+var CardTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "h3",
+  {
+    ref,
+    className: cn(
+      "text-2xl font-semibold leading-none tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "p",
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+CardContent.displayName = "CardContent";
+var CardFooter = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn("flex items-center p-6 pt-0", className),
+    ...props
+  }
+));
+CardFooter.displayName = "CardFooter";
+var FOLLOWUP_TYPE_OPTIONS = [
+  { value: "no followup", label: "No Follow-up" },
+  { value: "one time", label: "One Time" }
+];
+var UNIT_OPTIONS = [
+  { value: "days", label: "Days" },
+  { value: "weeks", label: "Weeks" },
+  { value: "months", label: "Months" }
+];
+function durationToDays(valueNum, unit) {
+  const today = /* @__PURE__ */ new Date();
+  today.setHours(0, 0, 0, 0);
+  let target;
+  if (unit === "days") target = addDays(today, valueNum);
+  else if (unit === "weeks") target = addWeeks(today, valueNum);
+  else target = addMonths(today, valueNum);
+  return Math.max(0, differenceInCalendarDays(target, today));
+}
+function dateToDays(date) {
+  const today = /* @__PURE__ */ new Date();
+  today.setHours(0, 0, 0, 0);
+  const d = new Date(date);
+  d.setHours(0, 0, 0, 0);
+  return Math.max(0, differenceInCalendarDays(d, today));
+}
+function daysToDate(days) {
+  const today = /* @__PURE__ */ new Date();
+  today.setHours(0, 0, 0, 0);
+  return addDays(today, days);
+}
+function normalizeFollowup(value) {
+  if (value === false || value === null || value === void 0) return false;
+  if (typeof value !== "object") return false;
+  const o = value;
+  if (o.followupType !== "one time") return false;
+  if (typeof o.value === "string" && o.unit === "days") {
+    return { followupType: "one time", value: o.value, unit: "days" };
+  }
+  const today = /* @__PURE__ */ new Date();
+  today.setHours(0, 0, 0, 0);
+  if (o.mode === "date" && typeof o.date === "string") {
+    const d = parseLocalDate(o.date);
+    if (d) {
+      const days2 = dateToDays(d);
+      return { followupType: "one time", value: String(days2), unit: "days" };
+    }
+  }
+  const val = o.value != null ? Number(String(o.value)) : 7;
+  const u = o.unit === "weeks" || o.unit === "months" ? o.unit : "days";
+  const days = durationToDays(Number.isNaN(val) ? 7 : val, u);
+  return { followupType: "one time", value: String(days), unit: "days" };
+}
+function getDefaultDate() {
+  const d = /* @__PURE__ */ new Date();
+  d.setDate(d.getDate() + 7);
+  return d;
+}
+function parseLocalDate(dateString) {
+  if (!dateString) return null;
+  try {
+    return parseISO(dateString);
+  } catch {
+    const parts = dateString.split("-");
+    if (parts.length === 3) {
+      const y = parseInt(parts[0], 10);
+      const m = parseInt(parts[1], 10) - 1;
+      const d = parseInt(parts[2], 10);
+      if (!Number.isNaN(y) && !Number.isNaN(m) && !Number.isNaN(d)) {
+        return new Date(y, m, d);
+      }
+    }
+    return null;
+  }
+}
+var FollowupWidget = ({ fieldId }) => {
+  const { fieldDef, value, setValue, setTouched, error, disabled, visible } = useField(fieldId);
+  const followup = normalizeFollowup(value);
+  const [calendarOpen, setCalendarOpen] = useState(false);
+  const currentFollowupType = followup ? followup.followupType : "no followup";
+  const hasFollowup = followup !== false;
+  const [displayMode, setDisplayMode] = useState("duration");
+  const [displayUnit, setDisplayUnit] = useState("days");
+  const daysNum = hasFollowup ? parseInt(followup.value, 10) || 7 : 7;
+  const currentDate = hasFollowup ? daysToDate(daysNum) : null;
+  const followupMode = displayMode;
+  const currentValue = hasFollowup && displayUnit === "days" ? followup.value : hasFollowup ? String(
+    displayUnit === "weeks" ? Math.round(daysNum / 7) || 1 : Math.round(daysNum / 30) || 1
+  ) : "7";
+  const currentUnit = displayUnit;
+  const handleFollowupTypeChange = useCallback(
+    (newType) => {
+      setTouched();
+      if (newType === "no followup") {
+        setValue(false);
+        setCalendarOpen(false);
+        return;
+      }
+      setValue({
+        followupType: "one time",
+        value: hasFollowup ? followup.value : "7",
+        unit: "days"
+      });
+    },
+    [followup, hasFollowup, setValue, setTouched]
+  );
+  const handleModeChange = useCallback((newMode) => {
+    setDisplayMode(newMode);
+    if (newMode === "date") setCalendarOpen(false);
+  }, []);
+  const handleValueChange = useCallback(
+    (newValue) => {
+      setTouched();
+      const num = parseInt(newValue, 10);
+      const min = displayUnit === "days" ? 0 : 1;
+      const valid = (Number.isNaN(num) ? min : num) >= min || newValue === "";
+      if (!valid && newValue !== "") {
+        setValue({ followupType: "one time", value: String(displayUnit === "days" ? 0 : durationToDays(1, displayUnit)), unit: "days" });
+        return;
+      }
+      const days = durationToDays(Number.isNaN(num) ? displayUnit === "days" ? 0 : 1 : num, displayUnit);
+      setValue({ followupType: "one time", value: String(days), unit: "days" });
+    },
+    [displayUnit, setValue, setTouched]
+  );
+  const handleUnitChange = useCallback((newUnit) => {
+    setDisplayUnit(newUnit);
+  }, []);
+  const handleDateSelect = useCallback(
+    (selected) => {
+      setTouched();
+      setCalendarOpen(false);
+      if (!selected) return;
+      const days = dateToDays(selected);
+      setValue({ followupType: "one time", value: String(days), unit: "days" });
+    },
+    [setValue, setTouched]
+  );
+  if (!visible || !fieldDef) return null;
+  const minDate = /* @__PURE__ */ new Date();
+  minDate.setHours(0, 0, 0, 0);
+  const selectedDate = currentDate || getDefaultDate();
+  return /* @__PURE__ */ jsx(Card, { className: cn(error && "border-destructive"), children: /* @__PURE__ */ jsxs(CardContent, { className: "space-y-1 p-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between gap-2", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center flex-shrink-0 gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { className: "text-xs font-semibold text-muted-foreground", children: "Follow-up" }),
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          value: currentFollowupType,
+          onValueChange: (v) => handleFollowupTypeChange(v),
+          disabled,
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { className: "w-[140px] border-none bg-muted/50 text-xs py-1 focus:outline-none focus:ring-0 focus:ring-offset-0", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: FOLLOWUP_TYPE_OPTIONS.map((opt) => /* @__PURE__ */ jsx(SelectItem, { value: opt.value, className: "text-xs", children: opt.label }, opt.value)) })
+          ]
+        }
+      )
+    ] }) }),
+    currentFollowupType !== "no followup" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+        /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium text-muted-foreground", children: "Schedule by:" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 cursor-pointer", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "radio",
+                name: `followup-mode-${fieldId}`,
+                value: "duration",
+                checked: followupMode === "duration",
+                onChange: () => handleModeChange("duration"),
+                className: "h-4 w-4 text-primary focus:ring-primary",
+                disabled
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "Duration" })
+          ] }),
+          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 cursor-pointer", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "radio",
+                name: `followup-mode-${fieldId}`,
+                value: "date",
+                checked: followupMode === "date",
+                onChange: () => handleModeChange("date"),
+                className: "h-4 w-4 text-primary focus:ring-primary",
+                disabled
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "Date" })
+          ] })
+        ] })
+      ] }),
+      followupMode === "duration" && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-muted-foreground", children: "In" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "number",
+            min: currentUnit === "days" ? 0 : 1,
+            value: currentValue,
+            onChange: (e) => handleValueChange(e.target.value),
+            disabled,
+            className: "w-16 py-1.5 px-2 border border-input rounded-md text-center text-sm focus:outline-none focus:ring-2 focus:ring-ring",
+            placeholder: "7"
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Select,
+          {
+            value: currentUnit,
+            onValueChange: (v) => handleUnitChange(v),
+            disabled,
+            children: [
+              /* @__PURE__ */ jsx(SelectTrigger, { className: "w-[100px] h-8 text-xs", children: /* @__PURE__ */ jsx(SelectValue, { className: "text-xs" }) }),
+              /* @__PURE__ */ jsx(SelectContent, { children: UNIT_OPTIONS.map((opt) => /* @__PURE__ */ jsx(SelectItem, { value: opt.value, className: "text-xs", children: opt.label }, opt.value)) })
+            ]
+          }
+        )
+      ] }),
+      followupMode === "date" && /* @__PURE__ */ jsxs(Popover, { open: calendarOpen, onOpenChange: setCalendarOpen, children: [
+        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            className: "w-full justify-start text-left font-normal h-9",
+            disabled,
+            children: [
+              /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4 text-muted-foreground" }),
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: hasFollowup && currentDate ? format(currentDate, "MMM d, yyyy") : "Select date" })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx(
+          Calendar,
+          {
+            mode: "single",
+            selected: selectedDate,
+            onSelect: handleDateSelect,
+            disabled: (date) => date < minDate,
+            initialFocus: true
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+        "One-time appointment",
+        " ",
+        followupMode === "duration" ? `in ${currentValue} ${currentUnit}` : hasFollowup && currentDate ? `on ${format(currentDate, "MMM d, yyyy")}` : "date to be selected"
+      ] })
+    ] }),
+    error && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive", children: error })
+  ] }) });
+};
+var FieldRenderer = ({ fieldId }) => {
+  const { fieldDef, visible } = useField(fieldId);
+  if (!visible || !fieldDef) {
+    return null;
+  }
+  switch (fieldDef.type) {
+    case "text":
+    case "number":
+      return /* @__PURE__ */ jsx(TextWidget, { fieldId });
+    case "textarea":
+    case "richtext":
+      return /* @__PURE__ */ jsx(TextWidget, { fieldId });
+    case "date":
+      return /* @__PURE__ */ jsx(DateWidget, { fieldId });
+    case "datetime":
+      return /* @__PURE__ */ jsx(DateTimeWidget, { fieldId });
+    case "select":
+      return /* @__PURE__ */ jsx(SelectWidget, { fieldId });
+    case "radio":
+      return /* @__PURE__ */ jsx(RadioWidget, { fieldId });
+    case "checkbox":
+      return /* @__PURE__ */ jsx(CheckboxWidget, { fieldId });
+    case "multiselect":
+      return /* @__PURE__ */ jsx(MultiSelectWidget, { fieldId });
+    case "repeatable":
+      return /* @__PURE__ */ jsx(RepeatableWidget, { fieldId });
+    case "image_upload":
+      return /* @__PURE__ */ jsx(ImageUploadWidget, { fieldId });
+    case "signature":
+      return /* @__PURE__ */ jsx(SignatureUploadWidget, { fieldId });
+    case "editable_table":
+      return /* @__PURE__ */ jsx(EditableTableWidget, { fieldId });
+    case "medications":
+      return /* @__PURE__ */ jsx(AddMedicationWidget, { fieldId });
+    case "investigations":
+      return /* @__PURE__ */ jsx(AddInvestigationWidget, { fieldId });
+    case "procedures":
+      return /* @__PURE__ */ jsx(AddProcedureWidget, { fieldId });
+    case "differential_diagnosis":
+      return /* @__PURE__ */ jsx(DifferentialDiagnosisWidget, { fieldId });
+    case "vitals":
+      return /* @__PURE__ */ jsx(VitalsWidget, { fieldId });
+    case "referral":
+      return /* @__PURE__ */ jsx(ReferralWidget, { fieldId });
+    case "followup":
+      return /* @__PURE__ */ jsx(FollowupWidget, { fieldId });
+    case "static_text": {
+      const def = fieldDef;
+      const size = def.size ?? "regular";
+      const labelClass = size === "large" ? "text-base" : "text-sm";
+      const descClass = size === "large" ? "text-sm" : "text-xs";
+      return /* @__PURE__ */ jsxs("div", { className: `${labelClass} text-muted-foreground`, children: [
+        def.label,
+        def.description && /* @__PURE__ */ jsx("p", { className: `mt-1 ${descClass} opacity-90`, children: def.description })
+      ] });
+    }
+    default:
+      return /* @__PURE__ */ jsxs("div", { className: "text-red-500", children: [
+        "Unknown field type: ",
+        fieldDef.type
+      ] });
+  }
+};
+var Section = ({ title, children }) => {
+  const [expanded, setExpanded] = useState(true);
+  const handleToggle = () => setExpanded((prev) => !prev);
+  const contentClassName = cn(
+    "overflow-hidden transition-[height] duration-200 ease-in-out",
+    !expanded && "hidden"
+  );
+  return /* @__PURE__ */ jsxs("div", { className: "mb-6 border rounded-lg bg-white shadow-sm overflow-hidden", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: handleToggle,
+        className: "w-full flex items-center justify-between gap-2 p-4 text-left border-b hover:bg-gray-50/80 transition-colors",
+        children: [
+          /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium", children: title }),
+          /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 text-muted-foreground", "aria-hidden": true, children: expanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-5 w-5" }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsx("div", { className: "p-4 pt-4 space-y-4 border-t-0", children }) })
+  ] });
+};
+var ColumnLayout = ({
+  columns,
+  label,
+  children
+}) => {
+  const gridCols = Math.max(1, Math.min(columns, 12));
+  const gridClass = `grid gap-4 w-full`;
+  const style = {
+    gridTemplateColumns: `repeat(${gridCols}, minmax(0, 1fr))`
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "mb-6", children: [
+    label != null && label !== "" && /* @__PURE__ */ jsx("div", { className: "mb-2 text-sm font-medium text-gray-700", children: label }),
+    /* @__PURE__ */ jsx("div", { className: gridClass, style, children })
+  ] });
+};
+var DynamicForm = () => {
+  const store = useFormStore();
+  const schema = store.getSchema();
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold", children: schema.title }) }),
+    schema.layout.map((node) => {
+      if (node.type === "section") {
+        return /* @__PURE__ */ jsx(Section, { title: node.title, children: node.children.map(
+          (child, index) => typeof child === "string" ? /* @__PURE__ */ jsx(FieldRenderer, { fieldId: child }, child) : child.type === "column_layout" ? /* @__PURE__ */ jsx(
+            ColumnLayout,
+            {
+              columns: child.columns,
+              label: child.label,
+              children: child.children.map((fieldId) => /* @__PURE__ */ jsx(FieldRenderer, { fieldId }, fieldId))
+            },
+            child.id
+          ) : /* @__PURE__ */ jsx(React11__default.Fragment, {}, child.id ?? index)
+        ) }, node.id);
+      }
+      if (node.type === "column_layout") {
+        return /* @__PURE__ */ jsx(
+          ColumnLayout,
+          {
+            columns: node.columns,
+            label: node.label,
+            children: node.children.map((fieldId) => /* @__PURE__ */ jsx(FieldRenderer, { fieldId }, fieldId))
+          },
+          node.id
+        );
+      }
+      return null;
+    })
+  ] });
+};
+var SUGGESTION_KEYS = /* @__PURE__ */ new Set(["medications", "investigations", "procedures"]);
+function shallowEqualKeys(a, b) {
+  const keysA = Object.keys(a);
+  const keysB = Object.keys(b);
+  if (keysA.length !== keysB.length) return false;
+  for (const k of keysA) {
+    if (!keysB.includes(k) || a[k] !== b[k]) return false;
+  }
+  return true;
+}
+function normalizeAIMedications(arr) {
+  let parsed = arr;
+  if (typeof arr === "string") {
+    try {
+      parsed = JSON.parse(arr);
+    } catch {
+      return [];
+    }
+  }
+  if (!Array.isArray(parsed)) return [];
+  return parsed.filter((item) => item != null && typeof item === "object" && "id" in item && "brand_name" in item);
+}
+function normalizeDifferentialDiagnosis(val) {
+  let parsed = val;
+  if (typeof val === "string") {
+    try {
+      parsed = JSON.parse(val);
+    } catch {
+      return [];
+    }
+  }
+  if (parsed && typeof parsed === "object" && !Array.isArray(parsed)) {
+    const result = [];
+    for (const [category, group] of Object.entries(parsed)) {
+      if (!group || typeof group !== "object") continue;
+      const conditions = Array.isArray(group.conditions) ? group.conditions : [];
+      for (const cond of conditions) {
+        if (!cond || typeof cond !== "object") continue;
+        const {
+          condition,
+          likelihood,
+          severity,
+          treatability,
+          keyFeatures,
+          nextSteps
+        } = cond;
+        if (!condition || !likelihood || !severity || !treatability) continue;
+        result.push({
+          category,
+          condition,
+          likelihood,
+          severity,
+          treatability,
+          keyFeatures: Array.isArray(keyFeatures) ? keyFeatures : void 0,
+          nextSteps: Array.isArray(nextSteps) ? nextSteps : void 0
+        });
+      }
+    }
+    return result;
+  }
+  if (!Array.isArray(parsed)) return [];
+  return parsed.filter(
+    (item) => item != null && typeof item === "object" && "category" in item && "condition" in item && "likelihood" in item && "severity" in item && "treatability" in item
+  );
+}
+var SmartForm = ({
+  aiAnalysisResult
+}) => {
+  const store = useFormStore();
+  const schema = store.getSchema();
+  const prevAiResultRef = useRef(void 0);
+  const aiSuggestions = useMemo(() => {
+    if (aiAnalysisResult == null) return { medications: [] };
+    const medications = normalizeAIMedications(aiAnalysisResult.medications);
+    return { medications };
+  }, [aiAnalysisResult]);
+  useEffect(() => {
+    if (aiAnalysisResult == null || Object.keys(aiAnalysisResult).length === 0) return;
+    const prev = prevAiResultRef.current;
+    if (prev != null && prev === aiAnalysisResult && shallowEqualKeys(prev, aiAnalysisResult)) return;
+    prevAiResultRef.current = { ...aiAnalysisResult };
+    const DD_KEYS = /* @__PURE__ */ new Set(["differentialDiagnosis", "differentialdiagnosis"]);
+    const toApply = {};
+    for (const [key, val] of Object.entries(aiAnalysisResult)) {
+      if (!SUGGESTION_KEYS.has(key) && !DD_KEYS.has(key)) toApply[key] = val;
+    }
+    const rawDd = aiAnalysisResult.differentialDiagnosis ?? aiAnalysisResult.differentialdiagnosis;
+    if (rawDd != null) {
+      toApply.differentialdiagnosis = normalizeDifferentialDiagnosis(rawDd);
+    }
+    if (Object.keys(toApply).length > 0) store.setValues(toApply, { touch: false });
+  }, [store, aiAnalysisResult]);
+  const fieldIds = [];
+  function collect(child) {
+    if (typeof child === "string") {
+      fieldIds.push(child);
+    } else if (child.type === "column_layout") {
+      child.children.forEach((id) => fieldIds.push(id));
+    }
+  }
+  schema.layout.forEach((node) => {
+    if (node.type === "section") {
+      node.children.forEach(collect);
+    } else if (node.type === "column_layout") {
+      node.children.forEach((id) => fieldIds.push(id));
+    }
+  });
+  return /* @__PURE__ */ jsx(AISuggestionsProvider, { value: aiSuggestions, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-4 gap-2 w-full items-start", children: [
+    /* @__PURE__ */ jsx("div", { className: "col-span-1 flex flex-col gap-2", children: fieldIds.map((fieldId) => {
+      const fieldDef = store.getFieldDef(fieldId);
+      if (!fieldDef) return null;
+      const position = fieldDef.position ?? "center";
+      if (position !== "left") return null;
+      return /* @__PURE__ */ jsx(FieldRenderer, { fieldId }, fieldId);
+    }) }),
+    /* @__PURE__ */ jsx("div", { className: "col-span-2 grid grid-cols-2 gap-x-2 space-y-2", children: fieldIds.map((fieldId) => {
+      const fieldDef = store.getFieldDef(fieldId);
+      if (!fieldDef) return null;
+      const position = fieldDef.position ?? "center";
+      if (position !== "center") return null;
+      const colSpanRaw = fieldDef.colSpan ?? 1;
+      const colSpan = colSpanRaw === 2 ? 2 : 1;
+      return /* @__PURE__ */ jsx("div", { className: colSpan === 2 ? "col-span-2" : "col-span-1", children: /* @__PURE__ */ jsx(FieldRenderer, { fieldId }) }, fieldId);
+    }) }),
+    /* @__PURE__ */ jsx("div", { className: "col-span-1 flex flex-col gap-2", children: fieldIds.map((fieldId) => {
+      const fieldDef = store.getFieldDef(fieldId);
+      if (!fieldDef) return null;
+      const position = fieldDef.position ?? "center";
+      if (position !== "right") return null;
+      return /* @__PURE__ */ jsx(FieldRenderer, { fieldId }, fieldId);
+    }) })
+  ] }) });
 };
 var ReadOnlyText = ({ fieldDef, value }) => {
   if (!fieldDef) return null;
@@ -2906,6 +4786,6 @@ function createUploadHandler(options) {
   };
 }
 
-export { DynamicForm, EMAIL_REGEX, FieldRenderer, FormControls, FormProvider, FormStore, ImageUploadWidget, ReadOnlyForm, ReadOnlyImageUpload, ReadOnlySignature, ReadOnlyTable, SignatureUploadWidget, createUploadHandler, evaluateRules, useField, useForm, useFormStore, validateField, validateForm };
+export { AddInvestigationField, AddMedicationField, DifferentialDiagnosis, DynamicForm, EMAIL_REGEX, FieldRenderer, FormControls, FormProvider, FormStore, ImageUploadWidget, ReadOnlyForm, ReadOnlyImageUpload, ReadOnlySignature, ReadOnlyTable, SignatureUploadWidget, SmartForm, createUploadHandler, evaluateRules, useField, useFieldHandlers, useForm, useFormStore, validateField, validateForm };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map