feat: dropdown combobox option (langflow-ai#2991)

* Removed default variable as true

* added combobox to dropdown

* Fixed types on strRenderComponents

* Added type of combobox

* Created combobox option on backend

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

src/backend/base/langflow/base/constants.py

@@ -20,6 +20,7 @@
     "required",
     "list",
     "multiline",
+    "combobox",
     "fileTypes",
     "password",
     "input_types",

src/backend/base/langflow/inputs/input_mixin.py

@@ -141,6 +141,11 @@ class MultilineMixin(BaseModel):
     multiline: CoalesceBool = True
 
 
+class ComboboxMixin(BaseModel):
+    combobox: CoalesceBool = False
+    """Variable that defines if the user can insert custom values in the dropdown."""
+
+
 class TableMixin(BaseModel):
     table_schema: Optional[TableSchema | list[Column]] = None
 

src/backend/base/langflow/inputs/inputs.py

@@ -11,6 +11,7 @@
     BaseInputMixin,
     DatabaseLoadMixin,
     DropDownMixin,
+    ComboboxMixin,
     FieldTypes,
     FileMixin,
     InputTraceMixin,
@@ -292,7 +293,7 @@ class DictInput(BaseInputMixin, ListableInputMixin, InputTraceMixin):
     value: Optional[dict] = {}
 
 
-class DropdownInput(BaseInputMixin, DropDownMixin, MetadataTraceMixin):
+class DropdownInput(BaseInputMixin, DropDownMixin, MetadataTraceMixin, ComboboxMixin):
     """
     Represents a dropdown input field.
 
@@ -307,6 +308,7 @@ class DropdownInput(BaseInputMixin, DropDownMixin, MetadataTraceMixin):
 
     field_type: Optional[SerializableFieldTypes] = FieldTypes.TEXT
     options: list[str] = Field(default_factory=list)
+    combobox: CoalesceBool = False
 
 
 class MultiselectInput(BaseInputMixin, ListableInputMixin, DropDownMixin, MetadataTraceMixin):

src/frontend/src/components/dropdownComponent/index.tsx

@@ -25,7 +25,7 @@ export default function Dropdown({
   isLoading,
   value,
   options,
-  combobox = true,
+  combobox,
   onSelect,
   editNode = false,
   id = "",

src/frontend/src/components/parameterRenderComponent/component/strRenderComponent/index.tsx

@@ -1,3 +1,5 @@
+import { handleOnNewValueType } from "@/CustomNodes/hooks/use-handle-new-value";
+import { InputFieldType } from "@/types/api";
 import Dropdown from "../../../dropdownComponent";
 import InputGlobalComponent from "../../../inputGlobalComponent";
 import InputListComponent from "../../../inputListComponent";
@@ -12,6 +14,14 @@ export function StrRenderComponent({
   handleOnNewValue,
   editNode,
   id,
+}: {
+  templateData: Partial<InputFieldType>;
+  value: any;
+  name: string;
+  disabled: boolean;
+  handleOnNewValue: handleOnNewValueType;
+  editNode: boolean;
+  id: string;
 }) {
   const onChange = (value: any, dbValue?: boolean, skipSnapshot?: boolean) => {
     handleOnNewValue({ value, load_from_db: dbValue }, { skipSnapshot });
@@ -65,6 +75,7 @@ export function StrRenderComponent({
         editNode={editNode}
         options={templateData.options}
         onSelect={onChange}
+        combobox={templateData.combobox}
         value={value ?? "Choose an option"}
         id={`dropdown_${id}`}
       />

src/frontend/src/types/api/index.ts

@@ -74,6 +74,7 @@ export type InputFieldType = {
   real_time_refresh?: boolean;
   refresh_button?: boolean;
   refresh_button_text?: string;
+  combobox?: boolean;
   [key: string]: any;
 };
 

src/frontend/src/types/components/index.ts

@@ -97,7 +97,7 @@ export type InputGlobalComponentType = {
   disabled: boolean;
   onChange: (value: string, dbValue: boolean, snapshot?: boolean) => void;
   name: string;
-  data: InputFieldType;
+  data: Partial<InputFieldType>;
   editNode?: boolean;
   playgroundDisabled?: boolean;
 };