jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Fixed dropdown appearing in input

Browse source
This commit is contained in:
Lucas Oliveira 2024-03-28 18:32:56 +02:00
commit 4c153c05c5
1 changed files with 33 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

58
src/frontend/src/components/inputComponent/index.tsx
View file

@ -99,12 +99,16 @@ export default function InputComponent({
type="text" type="text"
onBlur={onInputLostFocus} onBlur={onInputLostFocus}
value={ value={
selectedOption !== "" || !onChange ? selectedOption : value (selectedOption !== "" || !onChange) && setSelectedOption
? selectedOption
: value
} }
autoFocus={autoFocus} autoFocus={autoFocus}
disabled={disabled} disabled={disabled}
onClick={() => { onClick={() => {
(selectedOption !== "" || !onChange) && setShowOptions(true); (selectedOption !== "" || !onChange) &&
setSelectedOption &&
setShowOptions(true);
}} }}
required={required} required={required}
className={classNames( className={classNames(
@ -206,10 +210,12 @@ export default function InputComponent({
<div <div
className={cn( className={cn(
"pointer-events-auto absolute inset-y-0 h-full w-full cursor-pointer", "pointer-events-auto absolute inset-y-0 h-full w-full cursor-pointer",
selectedOption !== "" || !onChange ? "" : "hidden" (selectedOption !== "" || !onChange) && setSelectedOption
? ""
: "hidden"
)} )}
onClick={ onClick={
selectedOption !== "" || !onChange (selectedOption !== "" || !onChange) && setSelectedOption
? (e) => { ? (e) => {
setShowOptions((old) => !old); setShowOptions((old) => !old);
e.preventDefault(); e.preventDefault();
@ -221,30 +227,32 @@ export default function InputComponent({
</> </>
)} )}
<span {setSelectedOption && (
className={cn( <span
password && selectedOption === "" ? "right-8" : "right-0",
"absolute inset-y-0 flex items-center pr-2.5"
)}
>
<button
onClick={() => {
setShowOptions(!showOptions);
}}
className={cn( className={cn(
selectedOption !== "" password && selectedOption === "" ? "right-8" : "right-0",
? "text-medium-indigo" "absolute inset-y-0 flex items-center pr-2.5"
: "text-muted-foreground",
"hover:text-accent-foreground"
)} )}
> >
<ForwardedIconComponent <button
name={optionsIcon} onClick={() => {
className={"h-4 w-4"} setShowOptions(!showOptions);
aria-hidden="true" }}
/> className={cn(
</button> selectedOption !== ""
</span> ? "text-medium-indigo"
: "text-muted-foreground",
"hover:text-accent-foreground"
)}
>
<ForwardedIconComponent
name={optionsIcon}
className={"h-4 w-4"}
aria-hidden="true"
/>
</button>
</span>
)}
{password && selectedOption === "" && ( {password && selectedOption === "" && (
<button <button