PromptInput

info

The @ui5/webcomponents-ai package is under development and considered experimental - components' APIs are subject to change.

The ui5-ai-prompt-input component allows the user to write custom instructions in natural language, so that AI is guided to generate content tailored to user needs.

Note: The web component is in an experimental state

ES6 Module Import

`import "@ui5/webcomponents-ai/dist/PromptInput.js

Basic Sample

Properties

value

Description	Defines the value of the component.
Type	string
Default	""
Since	2.0.0

placeholder

Description	Defines a short hint intended to aid the user with data entry when the component has no value.
Type	string | undefined
Default	undefined
Since	2.0.0

label

Description	Defines the label of the input field.
Type	string | undefined
Default	undefined
Since	2.0.0

showClearIcon

Description	Defines whether the clear icon of the input will be shown.
Type	boolean
Default	false
Since	2.0.0

showExceededText

Description	Determines whether the characters exceeding the maximum allowed character count are visible in the component. If set to false, the user is not allowed to enter more characters than what is set in the maxlength property. If set to true the characters exceeding the maxlength value are selected on paste and the counter below the component displays their number.
Type	boolean
Default	false
Since	2.0.0

disabled

Description	Defines whether the component is in disabled state. Note: A disabled component is completely noninteractive.
Type	boolean
Default	false
Since	2.0.0

readonly

Description	Defines whether the component is read-only. Note: A read-only component is not editable, but still provides visual feedback upon user interaction.
Type	boolean
Default	false
Since	2.0.0

maxlength

Description	Sets the maximum number of characters available in the input field.
Type	number | undefined
Default	undefined
Since	2.0.0

valueState

Description	Defines the value state of the component.
Type	"None" | "Positive" | "Critical" | "Negative" | "Information"
Default	"None"
Since	2.0.0

Slots

valueStateMessage

Description	Defines the value state message that will be displayed as pop up under the component. The value state message slot should contain only one root element. Note: If not specified, a default text (in the respective language) will be displayed. Note: The valueStateMessage would be displayed, when the component is in Information, Critical or Negative value state.
Type	Array<HTMLElement>
Since	2.0.0

Events

submit

Description	Fired when the input operation has finished by pressing Enter or AI button is clicked.
Type	CustomEvent
Since	2.0.0

input

Description	Fired when the value of the component changes at each keystroke, and when a suggestion item has been selected.
Type	CustomEvent
Since	2.0.0

change

Description	Fired when the input operation has finished by pressing Enter or on focusout.
Type	CustomEvent
Since	2.0.0

Methods

No methods available for this component.

CSS Parts

No CSS parts available for this component.