Skip to content

[EuiInlineEdit] Creating the EuiInlineEdit Component #3928

@jloleysens

Description

@jloleysens

In the Ingest Node Pipelines plugin in Kibana (Home > Stack Management > Ingest Node Pipelines) there is a component that provides an "in-place" or "inline" text editing UX. Specifically when editing a pipeline (see gif).

This component/behaviour seems well suited to living in EUI and should have an accompanying style guide explaining where it can be useful.

For instance, a capability like this can help make certain editing experiences more streamlined while not cluttering up the UI with text boxes or sending users through multiple clicks to edit a value. This is different to the more typical flow of see a thing, click to expand the details, then click edit. Only then is the user presented with a text field to enter or edit a value.

At an implementation level, this could be part of the existing text field component and simply be a prop that gets set to adapt the appearance.

Gif

Aug-17-2020 11-15-21

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions