PromptBox

The PromptBox component captures, displays, and submits user prompts or messages.

PromptBox Overview

The PromptBox component is a flexible, customizable input interface for interacting with LLMs and chatbots, enabling users to compose, view, and submit prompts or messages. Built on native HTML <input> and <textarea> elements, it offers single-line, multi-line, or auto-resize options for displaying text, making it optimized for AI prompts and conversational interfaces. The component supports user input, file uploads, speech-to-text conversion, and provides extensive customization options for layout configurations.

Live Demo

States
Modifiers
Variant

Appearance

PromptBoxes provide built-in styling options that grant visually appealing and flexible rendering experience.

States

Depending on the action you want to imply through its appearance, the Telerik and Kendo UI PromptBox can acquire and can be rendered in the following states:

  • A PromptBox in its normal state is active, but the user is not interacting with it. This is the default state of the component. It can contain an explanatory placeholder text or an already prefilled text.
  • k-hover—The hover state of a PromptBox is applied when the user hovers over the component but does not click it. The mouse pointer changes to indicate that you can type into the component.
  • k-focus—The focus state of the PromptBox is triggered when the user navigates to the component by keyboard, voice, or mouse click. This state must highlight the PromptBox so that it covers all accessibility requirements.
  • k-disabled—The disabled state of the PromptBox indicates that the user cannot interact with the component. When disabled, the component has no interactive behavior, it is faded out and slightly out of focus, which helps the user to distinguish it from the active elements on the page.

Framework-Specific Documentation

For specific information about the component, refer to its official product documentation:

Feedback