Fix lit linting: input-tags should only handle text, not numbers.

This commit is contained in:
John Livingston 2024-06-12 18:59:34 +02:00
parent d4692c81e0
commit 724e8fdce9
No known key found for this signature in database
GPG Key ID: B17B5640CE66CDBC
2 changed files with 11 additions and 15 deletions

View File

@ -553,7 +553,6 @@ export class DynamicTableFormElement extends LivechatElement {
propertyValue: Array<string | number>, propertyValue: Array<string | number>,
originalIndex: number): TemplateResult => { originalIndex: number): TemplateResult => {
return html`<livechat-tags-input return html`<livechat-tags-input
.type=${'text'}
.name=${inputName} .name=${inputName}
class=${classMap( class=${classMap(
Object.assign( Object.assign(

View File

@ -12,23 +12,20 @@ import { repeat } from 'lit/directives/repeat.js'
@customElement('livechat-tags-input') @customElement('livechat-tags-input')
export class TagsInputElement extends LivechatElement { export class TagsInputElement extends LivechatElement {
@property({ attribute: false })
public type?: string = 'text'
@property({ attribute: false }) @property({ attribute: false })
public name?: string public name?: string
@property({ attribute: false }) @property({ attribute: false })
public min?: string public min?: number
@property({ attribute: false }) @property({ attribute: false })
public max?: string public max?: number
@property({ attribute: false }) @property({ attribute: false })
public maxlength?: string public maxlength?: number
@property({ attribute: false }) @property({ attribute: false })
public minlength?: string public minlength?: number
@state() @state()
private _inputValue?: string = '' private _inputValue?: string = ''
@ -37,10 +34,10 @@ export class TagsInputElement extends LivechatElement {
public inputPlaceholder?: string = '' public inputPlaceholder?: string = ''
@property({ attribute: false }) @property({ attribute: false })
public datalist?: Array<string | number> public datalist?: string[]
@property({ reflect: true }) @property({ reflect: true, type: Array })
public value: Array<string | number> = [] public value: string[] = []
@state() @state()
private _searchedTagsIndex: number[] = [] private _searchedTagsIndex: number[] = []
@ -113,7 +110,7 @@ export class TagsInputElement extends LivechatElement {
)} )}
</ul> </ul>
<input <input
type=${ifDefined(this.type)} type="text"
name=${ifDefined(this.name)} name=${ifDefined(this.name)}
id="${this.id ?? 'tags-input'}-input" id="${this.id ?? 'tags-input'}-input"
list="${this.id ?? 'tags-input'}-input-datalist" list="${this.id ?? 'tags-input'}-input-datalist"
@ -126,8 +123,8 @@ export class TagsInputElement extends LivechatElement {
@keyup=${(e: KeyboardEvent) => this._handleKeyUp(e)} @keyup=${(e: KeyboardEvent) => this._handleKeyUp(e)}
@input=${(e: InputEvent) => this._handleInputEvent(e)} @input=${(e: InputEvent) => this._handleInputEvent(e)}
@change=${(e: Event) => e.stopPropagation()} @change=${(e: Event) => e.stopPropagation()}
.value=${this._inputValue} .value=${this._inputValue ?? ''}
.placeholder=${this.inputPlaceholder} /> placeholder=${ifDefined(this.inputPlaceholder)} />
${(this.datalist) ${(this.datalist)
? html`<datalist id="${this.id ?? 'tags-input'}-datalist"> ? html`<datalist id="${this.id ?? 'tags-input'}-datalist">
${(this.datalist ?? []).map((value) => html`<option value=${value}>`)} ${(this.datalist ?? []).map((value) => html`<option value=${value}>`)}
@ -296,7 +293,7 @@ export class TagsInputElement extends LivechatElement {
if (inputValue?.length) { if (inputValue?.length) {
for (const [i, tag] of this.value.entries()) { for (const [i, tag] of this.value.entries()) {
if ((tag as string).toLowerCase().includes(inputValue.toLowerCase())) { if (tag.toLowerCase().includes(inputValue.toLowerCase())) {
searchedTags.push(i) searchedTags.push(i)
} }
} }