Content
Updated by Eric Schubert 1 day ago
# Pattern Input Component
## Context and Problem Statement
We need a component which allows us to define patterns containing free text combined with predefined options, that can be selected from a auto-completion/suggestion list.
We did some explorational coding and developed a component using primer base view components and native browser API (in prototype state).
## Decision Drivers
* The component needs to be maintained in future.
* The component must be reusable in different contexts, e.g.
* work package subject configuration
* File Link upload naming
* project name configuration
* The UX for creating the pattern must be intuitive. ❓ (how to measure it?? UI/UX maybe has better words for it.)
* The component must be accessible in regard to WCAG 2.0.
* Angular is considered to be discontinued. ❓
## Considered Options
* Editable container with custom made autocompleter style
* Editable container (text-based) with autocompletion and syntax highlighting
* Editable container with ng-select
* Draggable Editable container with draggable autocompleter with custom text
* Editable container with suggestion hover menu
* Text-only input
## Decision Outcome
_What is the correct decision?_
### Consequences
* _What will be the consequences?_
### Confirmation
_Who confirms this decision?_
## Pros and Cons of the Options
### Option 1
Description
* Good, because ...
* Neutral, because ...
* Bad, because ...
### Option 2
Description
* Good, because ...
* Neutral, because ...
* Bad, because ...
###
## More Information
_Anything people might be interested in._
## Context and Problem Statement
We need a component which allows us to define patterns containing free text combined with predefined options, that can be selected from a auto-completion/suggestion list.
We did some explorational coding and developed a component using primer base view components and native browser API (in prototype state).
## Decision Drivers
* The component needs to be maintained in future.
* The component must be reusable in different contexts, e.g.
* work package subject configuration
* File Link upload naming
* project name configuration
* The UX for creating the pattern must be intuitive. ❓ (how to measure it?? UI/UX maybe has better words for it.)
* The component must be accessible in regard to WCAG 2.0.
* Angular is considered to be discontinued. ❓
## Considered Options
* Editable container with custom made autocompleter style
* Editable container (text-based) with autocompletion and syntax highlighting
* Editable container with ng-select
* Draggable
* Editable container with suggestion hover menu
* Text-only input
## Decision Outcome
_What is the correct decision?_
### Consequences
* _What will be the consequences?_
### Confirmation
_Who confirms this decision?_
## Pros and Cons of the Options
### Option 1
Description
* Good, because ...
* Neutral, because ...
* Bad, because ...
### Option 2
Description
* Good, because ...
* Neutral, because ...
* Bad, because ...
###
## More Information
_Anything people might be interested in._