RomanNum3ral
/
ai-toolkit
mirror of https://github.com/ostris/ai-toolkit.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix issue where the window would scroll to and hilight custom items in the select box

This commit is contained in:
Jaret Burkett 2026-07-01 13:57:56 -06:00
parent 4e50535478
commit 733e14cb58
1 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
ui/src/components/formInputs.tsx
View File

@ -326,6 +326,7 @@ export const CreatableSelectInput = (props: CreatableSelectInputProps) => {
}
const [isCustom, setIsCustom] = React.useState(!isInOptions && !!value);
const customInputRef = React.useRef<HTMLInputElement>(null);
// Build select options with "Custom" at the top
const customOption: SelectOption = { value: CUSTOM_SELECT_VALUE, label: 'Custom' };
@ -386,6 +387,8 @@ export const CreatableSelectInput = (props: CreatableSelectInputProps) => {
if (val === CUSTOM_SELECT_VALUE) {
setIsCustom(true);
onChange('');
// focus the custom input only when the user actively selects "Custom"
requestAnimationFrame(() => customInputRef.current?.focus());
} else {
setIsCustom(false);
onChange(val);
@ -396,13 +399,13 @@ export const CreatableSelectInput = (props: CreatableSelectInputProps) => {
</div>
{isCustom && (
<input
ref={customInputRef}
type="text"
value={value}
onChange={e => onChange(e.target.value)}
className={`${inputClasses} flex-1 min-w-0`}
placeholder={props.placeholder ?? 'Enter custom value'}
disabled={props.disabled}
autoFocus
/>
)}
</div>