What is the best wat to get hold of an existing tomselect when using TypeScript with type safety

[marceloverdijk]

What is the best wat to get hold of an existing tomselect when using TypeScript with type safety

import type TomSelect from 'tom-select'

// The TomSelect itself was already created out of my reach.
const $countryFilter = $('#country-filter')[0] as HTMLElement

// Now cast and call .tomselect
// Is this the best way to do this? The casting is painful for the eye ;-)
// With other libs like noUiSlider I can simply do:  as noUiSlider.target
const $tomselect = ($countryFilter as unknown as TomSelect).tomselect

$tomselect.on('change', () => applyFilters())

[Chosco]

For me, it works with an own interface.

import TomSelect from 'tom-select';

interface HTMLElementTomSelect extends HTMLElement {
    tomselect?: TomSelect;
} // interface HTMLElementTomSelect

// and then
const _tom_select = ($countryFilter as HTMLElementTomSelect).tomselect;
if (_tom_select) {
	_tom_select.setValue(_value);
} // if (_tom_select)

I think the TomInput interface (tom-select/src/types/core.ts) should be used, but I can't get it to work.

export interface TomInput extends HTMLElement{
    tomselect               ?: TomSelect;
    disabled                : boolean;
    readOnly                ?: boolean;
    required                : boolean;
    value                   : string;
    type                    : string;
    validity                : ValidityState;
}

maybe someone else may help out here?