docs: updates for release (#6762)

* chat-io-new-inputs

* split-text-new-inputs-and-outputs

* update-structured-data-io

* bump-python-prereq-to-3.13

* reactflow

* structured-output-component

* chat-io-page-cleanup

* typo

* collapse-nav-by-default

* move-up-api-in-sidebar

* add-text-output-to-duck-duck-go

* Apply suggestions from code review

Co-authored-by: Edwin Jose <edwin.jose@datastax.com>

* clarify-chat-and-text-inputs

* changes-for-text-io

* no-playground-output

* Apply suggestions from code review

Co-authored-by: KimberlyFields <46325568+KimberlyFields@users.noreply.github.com>

* code-review

---------

Co-authored-by: Edwin Jose <edwin.jose@datastax.com>
Co-authored-by: KimberlyFields <46325568+KimberlyFields@users.noreply.github.com>
This commit is contained in:
Mendon Kissling 2025-02-25 18:08:18 -05:00 • committed by GitHub
commit c57ed6f464
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 127 additions and 75 deletions

View file

@ -139,19 +139,39 @@ It provides flexibility in managing message storage and retrieval within a chat
This component transforms LLM responses into structured data formats. This component transforms LLM responses into structured data formats.
### Input In this example from the **Financial Support Parser** template, the **Structured Output** component transforms unstructured financial reports into structured data.
![Structured output example](/img/component-structured-output.png)
The connected LLM model is prompted by the **Structured Output** component's `Format Instructions` parameter to extract structured output from the unstructured text. `Format Instructions` is utilized as the system prompt for the **Structured Output** component.
In the **Structured Output** component, click the **Open table** button to view the `Output Schema` table.
The `Output Schema` parameter defines the structure and data types for the model's output using a table with the following fields:
* **Name**: The name of the output field.
* **Description**: The purpose of the output field.
* **Type**: The data type of the output field. The available types are `str`, `int`, `float`, `bool`, `list`, or `dict`. The default is `text`.
* **Multiple**: This feature is deprecated. Currently, it is set to `True` by default if you expect multiple values for a single field. For example, a `list` of `features` is set to `True` to contain multiple values, such as `["waterproof", "durable", "lightweight"]`. Default: `True`.
The **Parse DataFrame** component parses the structured output into a template for orderly presentation in chat output. The template receives the values from the `output_schema` table with curly braces.
For example, the template `EBITDA: {EBITDA} , Net Income: {NET_INCOME} , GROSS_PROFIT: {GROSS_PROFIT}` presents the extracted values in the **Playground** as `EBITDA: 900 million , Net Income: 500 million , GROSS_PROFIT: 1.2 billion`.
### Inputs
| Name | Display Name | Info | | Name | Display Name | Info |
|------|--------------|------| |------|--------------|------|
| llm | Language Model | The language model to use to generate the structured output. | | llm | Language Model | The language model to use to generate the structured output. |
| input_value | Input message | The input message for the language model to process. | | input_value | Input Message | The input message to the language model. |
| schema_name | Schema Name | Provide a name for the output data schema. | | system_prompt | Format Instructions | Instructions to the language model for formatting the output. |
| output_schema | Output Schema | Define the structure and data types for the model's output. | | schema_name | Schema Name | The name for the output data schema. |
| multiple | Generate Multiple | Set to True if the model should generate a list of outputs instead of a single output. | | output_schema | Output Schema | Defines the structure and data types for the model's output.|
| multiple | Generate Multiple | [Deprecated] Always set to `True`. |
### Output ### Outputs
| Name | Display Name | Info | | Name | Display Name | Info |
|------|--------------|------| |------|--------------|------|
| stored_messages | Stored Messages | structured output based on the defined schema. | | structured_output | Structured Output | The structured output is a Data object based on the defined schema. |
| structured_output_dataframe | DataFrame | The structured output converted to a [DataFrame](/concepts-objects#dataframe-object) format. |

View file

@ -5,30 +5,35 @@ slug: /components-io
# Input and output components in Langflow # Input and output components in Langflow
This category of components defines where data enters and exits your flow. They dynamically alter the Playground and can be renamed to facilitate building and maintaining your flows. Input and output components define where data enters and exits your flow.
The difference between Chat Input and Text Input components is the output format, the number of configurable fields, and the way they are displayed in the Playground. Both components accept user input and return a `Message` object, but serve different purposes.
The **Text Input** component accepts a text string input and returns a `Message` object containing only the input text. The output does not appear in the **Playground**.
The **Chat Input** component accepts multiple input types including text, files, and metadata, and returns a `Message` object containing the text along with sender information, session ID, and file attachments.
The **Chat Input** component provides an interactive chat interface in the **Playground**.
## Chat Input ## Chat Input
This component collects user input from the chat. This component collects user input as `Text` strings from the chat and wraps it in a [Message](/concepts-objects) object that includes the input text, sender information, session ID, file attachments, and styling properties.
The Chat Input component creates a [Message](/concepts-objects) object that includes the input text, sender information, session ID, file attachments, and styling properties. It can optionally store the message in a chat history.
It can optionally store the message in a chat history and supports customization of the message appearance.
### Inputs ### Inputs
| Name | Display Name | Info | Type | | Name | Display Name | Info |
|------|--------------|------|------| |------|--------------|------|
|input_value|Text|Message to be passed as input.|MultilineInput| |input_value|Text|The Message to be passed as input.
|should_store_message|Store Messages|Store the message in the history.|BoolInput| |should_store_message|Store Messages|Store the message in the history.|
|sender|Sender Type|Type of sender.|DropdownInput| |sender|Sender Type|The type of sender.|
|sender_name|Sender Name|Name of the sender.|MessageTextInput| |sender_name|Sender Name|The name of the sender.|
|session_id|Session ID|The session ID of the chat. If empty, the current session ID parameter will be used.|MessageTextInput| |session_id|Session ID|The session ID of the chat. If empty, the current session ID parameter is used.|
|files|Files|Files to be sent with the message.|FileInput| |files|Files|The files to be sent with the message.|
|background_color|Background Color|The background color of the icon.|MessageTextInput| |background_color|Background Color|The background color of the icon.|
|chat_icon|Icon|The icon of the message.|MessageTextInput| |chat_icon|Icon|The icon of the message.|
|text_color|Text Color|The text color of the name|MessageTextInput| |text_color|Text Color|The text color of the name.|
### Outputs ### Outputs
@ -36,17 +41,37 @@ It can optionally store the message in a chat history and supports customization
|------|--------------|------| |------|--------------|------|
|message|Message|The resulting chat message object with all specified properties.| |message|Message|The resulting chat message object with all specified properties.|
### Message method
The `ChatInput` class provides an asynchronous method to create and store a `Message` object based on the input parameters.
The `Message` object is created in the `message_response` method of the ChatInput class using the `Message.create()` factory method.
```python
message = await Message.create(
text=self.input_value,
sender=self.sender,
sender_name=self.sender_name,
session_id=self.session_id,
files=self.files,
properties={
"background_color": background_color,
"text_color": text_color,
"icon": icon,
},
)
```
## Text Input ## Text Input
The Text Input component adds an Input field on the Playground. The **Text Input** component accepts a text string input and returns a `Message` object containing only the input text.
The Text Input component offers one input field for text, while the Chat Input has multiple fields for various chat-related features. The output does not appear in the **Playground**.
### Inputs ### Inputs
| Name | Display Name | Info | Type | | Name | Display Name | Info |
|------|--------------|------|------| |------|--------------|------|
|input_value|Text|Text to be passed as input.|MultilineInput| |input_value|Text|The text/content to be passed as output.|
### Outputs ### Outputs
@ -57,22 +82,27 @@ The Text Input component offers one input field for text, while the Chat Input h
## Chat Output ## Chat Output
The Chat Output component creates a [Message](/concepts-objects) object that includes the input text, sender information, session ID, and styling properties. The **Chat Output** component creates a [Message](/concepts-objects#message-object) object that includes the input text, sender information, session ID, and styling properties.
It can optionally store the message in a chat history and supports customization of the message appearance, including background color, icon, and text color.
The component accepts the following input types.
* [Data](/concepts-objects#data-object)
* [DataFrame](/concepts-objects#dataframe-object)
* [Message](/concepts-objects#message-object)
### Inputs ### Inputs
| Name | Display Name | Info | Type | | Name | Display Name | Info |
|------|--------------|------|------| |------|--------------|------|
|input_value|Text|Message to be passed as output.|MessageInput| |input_value|Text|The message to be passed as output.|
|should_store_message|Store Messages|Store the message in the history.|BoolInput| |should_store_message|Store Messages|The flag to store the message in the history.|
|sender|Sender Type|Type of sender.|DropdownInput| |sender|Sender Type|The type of sender.|
|sender_name|Sender Name|Name of the sender.|MessageTextInput| |sender_name|Sender Name|The name of the sender.|
|session_id|Session ID|The session ID of the chat. If empty, the current session ID parameter will be used.|MessageTextInput| |session_id|Session ID|The session ID of the chat. If empty, the current session ID parameter is used.|
|data_template|Data Template|Template to convert data to text. If left empty, it will be dynamically set to the data's text key.|MessageTextInput| |data_template|Data Template|The template to convert Data to Text. If the option is left empty, it is dynamically set to the Data's text key.|
|background_color|Background Color|The background color of the icon.|MessageTextInput| |background_color|Background Color|The background color of the icon.|
|chat_icon|Icon|The icon of the message.|MessageTextInput| |chat_icon|Icon|The icon of the message.|
|text_color|Text Color|The text color of the name|MessageTextInput| |text_color|Text Color|The text color of the name.|
|clean_data|Basic Clean Data|When enabled, `DataFrame` inputs are cleaned when converted to text. Cleaning removes empty rows, empty lines in cells, and multiple newlines.|
### Outputs ### Outputs
@ -83,15 +113,15 @@ It can optionally store the message in a chat history and supports customization
## Text Output ## Text Output
The TextOutputComponent displays text output in the **Playground**. The **Text Output** takes a single input of text and returns a [Message](/concepts-objects) object containing that text.
It takes a single input of text and returns a [Message](/concepts-objects) object containing that text.
The component is simpler compared to the Chat Output but focuses solely on displaying text without additional chat-specific features or customizations. The output does not appear in the **Playground**.
### Inputs ### Inputs
| Name | Display Name | Info | Type | | Name | Display Name | Info |
|------|--------------|------|------| |------|--------------|------|
|input_value|Text|Text to be passed as output.|MultilineInput| |input_value|Text|The text to be passed as output.|
### Outputs ### Outputs

View file

@ -326,17 +326,18 @@ This component splits text into chunks based on specified criteria.
| Name | Display Name | Info | | Name | Display Name | Info |
|------|--------------|------| |------|--------------|------|
| data_inputs | Data Inputs | The data to split | | data_inputs | Input Documents | The data to split.The component accepts [Data](/concepts-objects#data-object) or [DataFrame](/concepts-objects#dataframe-object) objects. |
| chunk_overlap | Chunk Overlap | Number of characters to overlap between chunks | | chunk_overlap | Chunk Overlap | The number of characters to overlap between chunks. Default: `200`. |
| chunk_size | Chunk Size | Maximum number of characters in each chunk | | chunk_size | Chunk Size | The maximum number of characters in each chunk. Default: `1000`. |
| separator | Separator | Character to split on (defaults to newline) | | separator | Separator | The character to split on. Default: `newline`. |
| text_key | Text Key | The key to use for the text column (advanced). Default: `text`. |
### Outputs ### Outputs
| Name | Display Name | Info | | Name | Display Name | Info |
|------|--------------|------| |------|--------------|------|
| chunks | Chunks | List of split text chunks as [Data](/concepts-objects#data-object) objects. | | chunks | Chunks | List of split text chunks as [Data](/concepts-objects#data-object) objects. |
| dataframe | DataFrame | The chunks as a DataFrame | | dataframe | DataFrame | List of split text chunks as [DataFrame](/concepts-objects#dataframe-object) objects. |
## Update data ## Update data

View file

@ -168,15 +168,16 @@ This component performs web searches using the [DuckDuckGo](https://www.duckduck
| Name | Display Name | Info | | Name | Display Name | Info |
|------|--------------|------| |------|--------------|------|
| input_value | Search Query | The search query to be used for the DuckDuckGo search | | input_value | Search Query | The search query to execute with DuckDuckGo. |
| max_results | Max Results | Maximum number of results to return | | max_results | Max Results | The maximum number of search results to return. Default: `5`. |
| max_snippet_length | Max Snippet Length | Maximum length of each result snippet | | max_snippet_length | Max Snippet Length | The maximum length of each result snippet. Default: `100`.|
### Outputs ### Outputs
| Name | Display Name | Info | | Name | Display Name | Info |
|------|--------------|------| |------|--------------|------|
| data | Data | List of search results as Data objects | | data | [Data](/concepts-objects#data-object) | List of search results as Data objects containing snippets and full content. |
| text | Text | Search results formatted as a single text string. |
## Exa Search ## Exa Search

View file

@ -21,7 +21,7 @@ A flow can be as simple as the [basic prompting flow](/get-started-quickstart),
* Each component has a **Configuration** menu. Click the **Code** pane to see a component's underlying Python code. * Each component has a **Configuration** menu. Click the **Code** pane to see a component's underlying Python code.
* Components are connected with **edges** to form flows. * Components are connected with **edges** to form flows.
If you're familiar with [ReactFlow](https://reactflow.dev/learn), a **flow** is a node-based application, a **component** is a node, and the connections between components are **edges**. If you're familiar with [React Flow](https://reactflow.dev/learn), a **flow** is a node-based application, a **component** is a node, and the connections between components are **edges**.
When a flow is run, Langflow builds a Directed Acyclic Graph (DAG) graph object from the nodes (components) and edges (connections between components), with the nodes sorted to determine the order of execution. The graph build calls the individual components' `def_build` functions to validate and prepare the nodes. This graph is then processed in dependency order. Each node is built and executed sequentially, with results from each built node being passed to nodes that are dependent on the previous node's results. When a flow is run, Langflow builds a Directed Acyclic Graph (DAG) graph object from the nodes (components) and edges (connections between components), with the nodes sorted to determine the order of execution. The graph build calls the individual components' `def_build` functions to validate and prepare the nodes. This graph is then processed in dependency order. Each node is built and executed sequentially, with results from each built node being passed to nodes that are dependent on the previous node's results.

View file

@ -11,7 +11,7 @@ Install Langflow locally with [uv (recommended)](https://docs.astral.sh/uv/getti
### Prerequisites ### Prerequisites
- [Python 3.10 to 3.12](https://www.python.org/downloads/release/python-3100/) installed - [Python 3.10 to 3.13](https://www.python.org/downloads/release/python-3100/) installed
- [uv](https://docs.astral.sh/uv/getting-started/installation/), [pip](https://pypi.org/project/pip/), or [pipx](https://pipx.pypa.io/stable/installation/) installed - [uv](https://docs.astral.sh/uv/getting-started/installation/), [pip](https://pypi.org/project/pip/), or [pipx](https://pipx.pypa.io/stable/installation/) installed
- Before installing Langflow, we recommend creating a virtual environment to isolate your Python dependencies with [uv](https://docs.astral.sh/uv/pip/environments), [venv](https://docs.python.org/3/library/venv.html), or [conda](https://anaconda.org/anaconda/conda) - Before installing Langflow, we recommend creating a virtual environment to isolate your Python dependencies with [uv](https://docs.astral.sh/uv/pip/environments), [venv](https://docs.python.org/3/library/venv.html), or [conda](https://anaconda.org/anaconda/conda)

View file

@ -37,7 +37,7 @@ const config = {
docs: { docs: {
routeBasePath: "/", // Serve the docs at the site's root routeBasePath: "/", // Serve the docs at the site's root
sidebarPath: require.resolve("./sidebars.js"), // Use sidebars.js file sidebarPath: require.resolve("./sidebars.js"), // Use sidebars.js file
sidebarCollapsed: false, sidebarCollapsed: true,
beforeDefaultRemarkPlugins: [ beforeDefaultRemarkPlugins: [
[ [
remarkCodeHike, remarkCodeHike,

View file

@ -96,6 +96,22 @@ module.exports = {
"Deployment/deployment-render", "Deployment/deployment-render",
], ],
}, },
{
type: "category",
label: "API reference",
items: [
{
type: "link",
label: "API documentation",
href: "/api",
},
{
type: "doc",
id: "API-Reference/api-reference-api-examples",
label: "API examples",
},
],
},
{ {
type: "category", type: "category",
label: "Integrations", label: "Integrations",
@ -144,22 +160,6 @@ module.exports = {
"Contributing/contributing-telemetry", "Contributing/contributing-telemetry",
], ],
}, },
{
type: "category",
label: "API reference",
items: [
{
type: "link",
label: "API documentation",
href: "/api",
},
{
type: "doc",
id: "API-Reference/api-reference-api-examples",
label: "API examples",
},
],
},
{ {
type: "category", type: "category",
label: "Changelog", label: "Changelog",

Binary file not shown.

After

Width:  |  Height:  |  Size: 408 KiB