Example on displaying clear button with vaadin-date-picker-light
ismarslomic opened this issue · 1 comments
ismarslomic commented
Hi,
I'm using vaadin-date-picker-light
with custom input component, example:
<vaadin-date-picker-light
.disabled=${this.disabled}
@value-changed=${this._valueChanged}
attr-for-value="value"
.i18n=${i18n}
>
<paper-input .label=${this.label} no-label-float>
<ha-svg-icon slot="suffix" .path=${mdiCalendar}></ha-svg-icon>
</paper-input>
</vaadin-date-picker-light>
How can I add icon for clearing selected date, similar to the clear-button-visible
property for vaadin-date-picker
?
ismarslomic commented
Posting solution on my own question:
<vaadin-date-picker-light
.disabled=${this.disabled}
@value-changed=${this._valueChanged}
attr-for-value="value"
.i18n=${i18n}
>
<paper-input .label=${this.label} no-label-float>
<ha-svg-icon slot="suffix" .path=${mdiCalendar}></ha-svg-icon>
<ha-svg-icon
slot="suffix"
part="clear-button"
.path=${mdiDelete}
@click=${this._clearDueDate}
>
</ha-svg-icon>
</paper-input>
</vaadin-date-picker-light>