import { getElement } from '@stencil/core' ; import { isInstanceOf } from '../../../utils/unit' ; import { WritableProps } from './PlayerProps' ; export const STATE_CHANGE_EVENT = 'vmStateChange' ; export type StateChange < T = WritableProps , P extends keyof T = keyof T > = { by : HTMLElement ; prop : P ; value : T [ P ] ; } ; export type Dispatcher = < P extends keyof WritableProps > ( prop : P , value : WritableProps [ P ] ) => void ; param ref export const createDispatcher = ( ref ) : Dispatcher => ( prop , value ) => { const el = isInstanceOf ( ref , HTMLElement ) ? ref : getElement ( ref ) ; const event = new CustomEvent < StateChange > ( STATE_CHANGE_EVENT , { bubbles : true , composed : true , detail : { by : el , prop , value } , } ) ; el . dispatchEvent ( event ) ; } ;