Tesserae

TagsInput

Description

A form input that lets the user assemble a list of short string values ("tags" or "chips") by typing them in and confirming each with a delimiter key (default: Enter or ,). Tags can be removed with the backspace key when the entry field is empty, or by clicking the remove affordance on each tag.

Usage

API reference

class

TagsInput

public sealed class TagsInput : IComponent, IHasMarginPadding

A form input that lets the user assemble a list of short string values ("tags" or "chips") by typing them in and confirming each with a delimiter key (default: or ). Tags can be removed with the backspace key when the entry field is empty, or by clicking the small "×" affordance next to each tag.

Constructors

Constructor
TagsInput
public TagsInput() : this(Array.Empty<string>())

Creates a new, empty tags input.

Constructor
TagsInput
public TagsInput(params string[] initialTags)

Creates a tags input pre-populated with the given initial tags.

Properties

Property
TagsInput.Tags
public IReadOnlyList<string> Tags

Gets the current list of tags in insertion order.

Property
TagsInput.Placeholder
public string Placeholder { get ; set ; }

Gets or sets the placeholder shown in the inline entry field.

Property
TagsInput.AllowDuplicates
public bool AllowDuplicates { get ; set ; }

Gets or sets whether the same tag value can appear more than once. Defaults to .

Property
TagsInput.MaxTags
public int MaxTags { get ; set ; }

Gets or sets the maximum number of tags accepted. Defaults to no limit.

Property
TagsInput.Margin
public string Margin { get ; set ; }

Gets or sets the outer container's CSS margin.

Property
TagsInput.Padding
public string Padding { get ; set ; }

Gets or sets the outer container's CSS padding.

Methods

Method
TagsInput.SetPlaceholder
public TagsInput SetPlaceholder(string placeholder)

Sets the placeholder text shown in the inline entry field.

Method
TagsInput.AllowingDuplicates
public TagsInput AllowingDuplicates()

Allows the same tag value to be added more than once.

Method
TagsInput.WithMaxTags
public TagsInput WithMaxTags(int max)

Caps the number of tags that can be added.

Method
TagsInput.WithDelimiters
public TagsInput WithDelimiters(params char[] delimiters)

Sets the characters (in addition to ) that finalize the current entry into a tag. Defaults to ; pass an empty array to require exclusively.

Method
TagsInput.WithNormalizer
public TagsInput WithNormalizer(Func<string, string> normalizer)

Sets a normalizer applied to every value before it becomes a tag (default: ). Return or empty to reject the value silently.

Method
TagsInput.OnTagAdded
public TagsInput OnTagAdded(Action<string> handler)

Registers a callback fired whenever a new tag is added.

Method
TagsInput.OnTagRemoved
public TagsInput OnTagRemoved(Action<string> handler)

Registers a callback fired whenever a tag is removed.

Method
TagsInput.OnChange
public TagsInput OnChange(Action handler)

Registers a callback fired whenever the tag list changes for any reason.

Method
TagsInput.AsObservable
public IObservable<IReadOnlyList<string>> AsObservable()

Returns an observable that emits the latest tag list whenever it changes. Useful for binding into chains and other reactive composition primitives.

Method
TagsInput.Add
public bool Add(string tag)

Programmatically adds a tag (subject to duplicate/max checks and the normalizer).

Returns

if the tag was added; if rejected.

Method
TagsInput.Remove
public bool Remove(string tag)

Removes the first occurrence of the given tag, if present.

Method
TagsInput.Clear
public TagsInput Clear()

Clears every tag from the input.

Method
TagsInput.Render
public HTMLElement Render()

Renders the input's container element.

See also

© 2026 Tesserae. All rights reserved.