new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

GitHub Primer · all subjects

text-input-with-tokens

9 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Text input with tokens purpose and use case

Text input with tokens is an input for a value that is a list. Items can be added or removed from the list, but individual items cannot be edited inline. This kind of input is most commonly used with an autocomplete component to let users select items from a predetermined list of options.

Text input with tokens anatomy

Text input with tokens has the same anatomy as a regular text input component, but the input's value is a list instead of a single string of text.

Text input with tokens configuration options

The text input with tokens can be configured with all of the same options as the regular text input component.

Text input with tokens wrapping behavior

The list of tokens can be constrained to a single line or be wrapped to multiple lines. When wrapping is disabled and the list exceeds the width of the input, the input will scroll horizontally.

Text input with tokens max height constraint

When tokens wrap, the height of the input can be constrained to a maximum height. Once the rows exceed the maximum height, the input will scroll vertically.

Text input with tokens truncation behavior

You may limit the number of tokens that are visible. However, all tokens will be visible while the text input is focused.

Text input with tokens variant selection

You may choose any of Primer's token components, but you cannot mix different token components in a single input. You may also choose the size of the tokens and whether or not the token's remove button is shown.

Move focus between tokens keyboard interaction

When tabbing to the input, the input element receives focus. When the text cursor is at the beginning of the input, users can use the Left Arrow key to move focus to the last token. Once any token has focus, users can use the Right Arrow and Left Arrow keys to move focus to the previous or next token.

Remove tokens interaction

A token may be removed by focusing it and pressing the Backspace key, or by clicking the token's remove button. If a user presses Backspace and the text cursor is at the beginning of the input, the last token will be removed but the input will be populated with its text value.

Give your agent this brain