frontend/src/components/Combobox/Combobox.tsx

@@ -25,6 +25,7 @@ export interface ComboboxProps<T> {
   onChange?: (value: string | string[]) => void;
   /** Called when search term changes. When provided, local filtering is disabled (assumes API filtering). */
   onSearchChange?: (term: string) => void;
+  error?: boolean;
 }
 
 const widthClasses: Record<ComboboxSize, string> = {
@@ -77,6 +78,7 @@ export default function Combobox<T>({
   value,
   onChange,
   onSearchChange,
+  error = false,
 }: ComboboxProps<T>) {
   // Convert value (undefined | string | string[]) to always be an array
   const selectedValues: string[] =
@@ -226,6 +228,7 @@ export default function Combobox<T>({
         fullWidth={fullWidth || !!customWidth}
         customWidth={customWidth}
         Icon={SearchIcon}
+        error={error}
       />
 
       {isOpen && (

frontend/src/components/ParticipantPicker/ParticipantPicker.tsx

@@ -20,6 +20,8 @@ export interface ParticipantPickerProps<T>
   customWidth?: string;
   /** Called when search term changes. When provided, local filtering is disabled (assumes API filtering). */
   onSearchChange?: (term: string) => void;
+  error?: boolean;
+  message?: string;
 }
 
 const widthClasses: Record<ComboboxSize, string> = {
@@ -43,6 +45,8 @@ export default function ParticipantPicker<T>({
   fullWidth = false,
   customWidth,
   onSearchChange,
+  error = false,
+  message,
   className,
   style,
   ...props
@@ -80,6 +84,7 @@ export default function ParticipantPicker<T>({
         fullWidth
         multiple
         onSearchChange={onSearchChange}
+        error={error}
       />
       {selectedOptions.length > 0 && (
         <div className="flex flex-col gap-(--spacing-sm)">
@@ -93,6 +98,9 @@ export default function ParticipantPicker<T>({
           ))}
         </div>
       )}
+      {message && (
+        <span className="body-light-sm text-base-ink-strong">{message}</span>
+      )}
     </div>
   );
 }