<clearable-field>

Adds a button to allow you to clear the contents of a <input type="text"> or <input type="date"> field.

Slots

• default slot - The default unnamed slot should hold the input field to be made clearable. It will be visible to the parent form.
• clear-button-text - This slot allows you to customise the text of the clear button. Defaults to ×.

CSS parts

• clearable-field::part(clear-button) - Targets the clear <button> part of the component, to allow styling to be applied.

Example

Code