Top Menu

Jump to content
Home
    Modules
      • Projects
      • Activity
      • Work packages
      • Gantt charts
      • Calendars
      • Team planners
      • Boards
      • News
    • Getting started
    • Introduction video
      Welcome to OpenProject Community
      Get a quick overview of project management and team collaboration with OpenProject. You can restart this video from the help menu.

    • Help and support
    • Upgrade to Enterprise edition
    • User guides
    • Videos
    • Shortcuts
    • Community forum
    • Enterprise support

    • Additional resources
    • Data privacy and security policy
    • Digital accessibility (DE)
    • OpenProject website
    • Security alerts / Newsletter
    • OpenProject blog
    • Release notes
    • Report a bug
    • Development roadmap
    • Add and edit translations
    • API documentation
  • Sign in
      Forgot your password?

      or sign in with your existing account

      OpenProject ID Google

Side Menu

  • Overview
  • Activity
    Activity
  • Roadmap
  • Work packages
    Work packages
  • Gantt charts
    Gantt charts
  • Team planners
    Team planners
  • Boards
    Boards
  • Wiki
    Wiki
  • Forums

Content

Updated by Eric Schubert 5 months 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._

Back

Loading...