fix: stabilize multi-select autocomplete values

src/components/XinyuanAutocomplete.jsx

 import {
   ChevronDown,
+  Check,
   Close,
   FIELD_SUFFIX_ICON_STYLE,
   Search,
@@ -25,6 +26,10 @@ function getSelectedKeySet(selectionMode, selectedKey, selectedKeys) {
   return new Set(selectedKey === null || selectedKey === undefined ? [] : [selectedKey]);
 }
 
+function toSelectionKey(value) {
+  return String(value ?? '');
+}
+
 export default function XinyuanAutocomplete({
   'aria-label': ariaLabel,
   className,
@@ -59,8 +64,12 @@ export default function XinyuanAutocomplete({
     selectedKey,
     selectedKeys,
   );
+  const selectedKeyStringSet = new Set(
+    Array.from(selectedKeySet).map(toSelectionKey),
+  );
   const selectedOptions = options.filter((option) =>
-    selectedKeySet.has(option.id),
+    selectedKeySet.has(option.id) ||
+    selectedKeyStringSet.has(toSelectionKey(option.id)),
   );
   const resolvedValueText =
     valueText ??
@@ -69,9 +78,40 @@ export default function XinyuanAutocomplete({
       : placeholder);
   const rootSelectionProps =
     selectionMode === 'multiple'
-      ? { selectedKeys }
+      ? { selectedKeys: selectedKeyStringSet }
       : { selectedKey };
+  const listBoxSelectionProps =
+    selectionMode === 'multiple'
+      ? {
+          selectionMode,
+          selectedKeys: selectedKeyStringSet,
+        }
+      : {};
   const visibleOptions = isLoading || errorText ? [] : options;
+  const handleMultipleOptionPress = (option) => {
+    if (
+      selectionMode !== 'multiple' ||
+      !onSelectionChange ||
+      option?.isDisabled
+    ) {
+      return;
+    }
+
+    const optionKey = toSelectionKey(option.id);
+    if (!optionKey) {
+      return;
+    }
+
+    const nextKeys = new Set(
+      Array.from(selectedKeyStringSet).filter(Boolean),
+    );
+    if (nextKeys.has(optionKey)) {
+      nextKeys.delete(optionKey);
+    } else {
+      nextKeys.add(optionKey);
+    }
+    onSelectionChange(nextKeys);
+  };
 
   return (
     <Autocomplete
@@ -125,7 +165,11 @@ export default function XinyuanAutocomplete({
           </SearchField>
           <ListBox
             aria-label={ariaLabel || placeholder}
+            dependencies={[
+              Array.from(selectedKeyStringSet).sort().join('\u0000'),
+            ]}
             items={visibleOptions}
+            {...listBoxSelectionProps}
             renderEmptyState={() => (
               <div
                 className="grid min-h-20 place-items-center px-3 py-4"
@@ -135,11 +179,17 @@ export default function XinyuanAutocomplete({
               </div>
             )}
           >
-            {(option) => (
+            {(option) => {
+              const isSelected = selectedKeyStringSet.has(toSelectionKey(option.id));
+
+              return (
                 <ListBox.Item
                   id={option.id}
                   isDisabled={option.isDisabled}
                   textValue={option.textValue || option.label}
+                  {...(selectionMode === 'multiple'
+                    ? { onPress: () => handleMultipleOptionPress(option) }
+                    : {})}
                 >
                   {renderOption ? (
                     renderOption(option)
@@ -148,9 +198,19 @@ export default function XinyuanAutocomplete({
                       {option.label}
                     </Label>
                   )}
+                  {selectionMode === 'multiple' ? (
+                    <span
+                      aria-hidden="true"
+                      className="ml-auto inline-flex w-5 justify-center text-foreground"
+                    >
+                      {isSelected ? <Check size={14} /> : null}
+                    </span>
+                  ) : (
                     <ListBox.ItemIndicator />
-              </ListBox.Item>
                   )}
+                </ListBox.Item>
+              );
+            }}
           </ListBox>
         </Autocomplete.Filter>
       </Autocomplete.Popover>

src/pages/RecordDetailDrawer/components/TailwindEditableField.jsx

@@ -258,6 +258,10 @@ function UserSelector({ value, onChange, multiple, variant }) {
 function FieldOptionSelect({ multiple, onChange, options, value, variant }) {
   const values = multiple ? toArray(value).map(String) : [String(value || '')];
   const selectedOptions = options.filter((option) => values.includes(String(option.value)));
+  const autocompleteOptions = options.map((option) => ({
+    id: String(option.value),
+    label: option.label,
+  }));
   const displayValue = selectedOptions.length
     ? selectedOptions.map((option) => option.label).join('、')
     : '请选择';
@@ -265,7 +269,11 @@ function FieldOptionSelect({ multiple, onChange, options, value, variant }) {
     ? {
         selectedKeys: new Set(values),
         onSelectionChange: (keys) =>
-          onChange(keys === 'all' ? options.map((option) => option.value) : [...keys]),
+          onChange(
+            keys === 'all'
+              ? autocompleteOptions.map((option) => option.id)
+              : [...keys],
+          ),
       }
     : {
         selectedKey: values[0] || null,
@@ -276,10 +284,7 @@ function FieldOptionSelect({ multiple, onChange, options, value, variant }) {
     <XinyuanAutocomplete
       {...selectProps}
       aria-label="选择字段值"
-      options={options.map((option) => ({
-        id: String(option.value),
-        label: option.label,
-      }))}
+      options={autocompleteOptions}
       placeholder="请选择"
       selectionMode={multiple ? 'multiple' : 'single'}
       valueText={displayValue}