updated react-openapi

react-openapi/src/components/fields/renderers/FkSelectField.tsx

@@ -0,0 +1,38 @@
+import React from "react";
+import { FormControl, InputLabel, Select, MenuItem, FormHelperText } from "@mui/material";
+import type { FieldConfig } from "../../../types";
+
+interface Props {
+  field: FieldConfig;
+  value: any;
+  onChange: (value: any) => void;
+  error?: string;
+  fkOptions?: { value: any; label: string }[];
+  onOpen?: () => void;
+}
+
+export function FkSelectField({ field, value, onChange, error, fkOptions, onOpen }: Props) {
+  console.log(`[FkSelectField] render field="${field.name}" fkOptions=${fkOptions ? `${fkOptions.length} items` : "undefined"} value=${value}`);
+  return (
+    <FormControl fullWidth size="small" error={!!error}>
+      <InputLabel>{field.label}</InputLabel>
+      <Select
+        value={value ?? ""}
+        label={field.label}
+        onChange={(e) => onChange(e.target.value)}
+        onOpen={() => onOpen?.()}
+        disabled={field.readOnly}
+      >
+        <MenuItem value="">
+          <em>None</em>
+        </MenuItem>
+        {(fkOptions ?? []).map((opt) => (
+          <MenuItem key={opt.value} value={opt.value}>
+            {opt.label}
+          </MenuItem>
+        ))}
+      </Select>
+      {field.description && <FormHelperText>{field.description}</FormHelperText>}
+    </FormControl>
+  );
+}