Components¶

Chat Input¶

The ChatInput widget is a combination of a TextInput widget and a Button. When the input is submitted the TextInput widget is cleared and ready to accept a new input.

If you need a ChatInput widget you can copy the code from here.

Source code for component_chat_input.py

"""
The `ChatInput` widget is a combination of a `TextInput` widget and a `Button`.
When the input is submitted the `TextInput` widget is cleared and ready to accept
a new input.

If you need a `ChatInput` widget you can copy the code from
[here](https://github.com/holoviz-topics/panel-chat-examples/blob/main/panel_chat_examples/components/chat_input.py).
"""
import panel as pn

from panel_chat_examples.components import ChatInput

pn.extension()

chat_input = ChatInput(placeholder="Say something")


def message(prompt):
    if not prompt:
        return ""
    return f"User has sent the following prompt: **{prompt}**"


pn.Column(pn.bind(message, chat_input.param.value), chat_input, margin=25).servable()

The EnvironmentWidgetBase class enables you to manage variable values from a combination of custom values, environment variables and user input.

Its very useful when you don't have the resources to provide API keys for services like OpenAI. It will determine which variables have not been set as environment variables and ask the user for them.

Source code for component_environment_widget.py

"""
The [`EnvironmentWidgetBase`](https://github.com/holoviz-topics/panel-chat-examples/blob/main/panel_chat_examples/_environment_widget.py)
class enables you to manage variable values from a combination of custom values,
environment variables and user input.

Its very useful when you don't have the resources to provide API keys for services
like OpenAI. It will determine which variables have not been set as environment
variables and ask the user for them.
"""
# Longer term we should try to get this widget included in Panel
import panel as pn
import param

from panel_chat_examples import EnvironmentWidgetBase

pn.extension()


class EnvironmentWidget(EnvironmentWidgetBase):
    """An example Environment Widget for managing environment variables"""

    OPENAI_API_KEY = param.String(doc="A key for the OpenAI api")
    WEAVIATE_API_KEY = param.String(doc="A key for the Weaviate api")
    LANGCHAIN_API_KEY = param.String(doc="A key for the LangChain api")


environment = EnvironmentWidget(max_width=1000)
pn.template.FastListTemplate(
    title="Environment Widget",
    sidebar=[environment],
    main=[
        __doc__,
        pn.Column(
            environment.param.variables_set,
            environment.param.variables_not_set,
        ),
    ],
).servable()

Status¶

The Status indicator can report progress in steps and with detailed context.

If you need a Status widget you can copy the code from here.

Source code for component_status.py

"""
The `Status` *indicator* can report progress in steps and with
detailed context.

If you need a `Status` widget you can copy the code from
[here](https://github.com/holoviz-topics/panel-chat-examples/blob/main/panel_chat_examples/components/chat_input/components/status.py).
"""
import time

import panel as pn

from panel_chat_examples.components import Status

status = Status("Downloading data...", sizing_mode="stretch_width")


def run(_):
    with status.report() as progress:
        status.collapsed = False
        progress("Searching for data...")
        time.sleep(1.5)
        progress("Downloading data...")
        time.sleep(1.5)
        progress("Validating data...")
        time.sleep(1.5)
        status.collapsed = True


run_button = pn.widgets.Button(
    name="Run", on_click=run, button_type="primary", button_style="outline"
)

pn.Column(
    status,
    run_button,
).servable()

Components¶

Chat Input¶

Environment Widget¶

Status¶