<?js
  var data = obj;
  this.propsTypeParams = data.propsTypeParams;
  this.classTypeParams = data.classTypeParams;
  this.classTypeParamsDeclaration = data.classTypeParamsDeclaration;
  this.propsClassTypeParams = data.propsClassTypeParams;
  var props = data.properties? Object.keys(data.properties).sort(): undefined;
  var methods = data.methods? Object.keys(data.methods).sort(): undefined;

  if (data.imports){
    for (let i = 0; i < data.imports.length; i++){ ?>
<?js= data.imports[i] ?>
  <?js
    }
  }?>
export interface <?js= data.vcomponentName ?><?js= data.classTypeParamsDeclaration ?> extends JetElement<<?js= settablePropertiesInterface ?><?js= data.propsTypeParams ?>>, <?js= settablePropertiesInterface ?><?js= data.propsTypeParams ?> {
<?js
  if (data.properties) {
    data.propsToInclude = 'readOnly';
    data.typeParams = this.propsTypeParams;
    ?>
    <?js= this.partial('properties.tmpl', data) ?>
  <?js
  } ?>
  addEventListener<T extends keyof <?js= data.eventMapInterface ?><?js= data.classTypeParams ?>>(type: T, listener: (this: HTMLElement, ev: <?js= data.eventMapInterface ?><?js= data.classTypeParams ?>[T]) => any, options?: (boolean|AddEventListenerOptions)): void;
  addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: (boolean|AddEventListenerOptions)): void;
  getProperty<T extends keyof <?js= data.settablePropertiesInterface ?><?js= data.propsTypeParams ?>>(property: T): <?js= data.vcomponentName ?><?js= data.classTypeParams ?>[T];
  getProperty(property: string): any;
  setProperty<T extends keyof <?js= data.settablePropertiesInterface ?><?js= data.propsTypeParams ?>>(property: T, value: <?js= data.settablePropertiesInterface ?><?js= data.propsTypeParams ?>[T]): void;
  setProperty<T extends string>(property: T, value: JetSetPropertyType<T, <?js= data.settablePropertiesInterface ?><?js= data.propsTypeParams ?>>): void;
  setProperties(properties: <?js= data.settablePropertiesLenientInterface ?><?js= data.propsTypeParams ?>): void;
  <?js
  for (let m of methods) {?>
  <?js= m ?>: <?js= data.vcomponentClassName ?><?js= this.classTypeParams ?>['<?js= m ?>'];
  <?js
  }?>
}
<?js= this.partial('namespace.tmpl', { data, props, componentName: data.vcomponentName }) ?>
export interface <?js= data.eventMapInterface ?><?js= this.classTypeParamsDeclaration ?> extends HTMLElementEventMap {
<?js
for (let event in data.events) {
  let eventPropEvent = `'${event}': ${data.vcomponentName}.${event}`;
  const eventDetailType = data.events[event]['evnDetailTypeParamsDeclaration'];
  if (eventDetailType && eventDetailType.indexOf('<') > -1 && eventDetailType.indexOf('>') > 1) {
    eventPropEvent = `'${event}': ${data.vcomponentName}.${event}${this.propsTypeParams};`
  } ?>
  <?js= eventPropEvent ?>
<?js
}
if (props){
  for (let prop of props) {
    let propEvent = `'${prop}Changed': JetElementCustomEventStrict<${data.vcomponentName}${data.classTypeParams}["${prop}"]>;`; ?>
  <?js= propEvent ?>
<?js
  }
}?>
}
export interface <?js= data.settablePropertiesInterface ?><?js= data.propsClassTypeParamsDeclaration ?> extends JetSettableProperties {
<?js
if (data.properties) {
    data.propsToInclude = 'settable';
    data.typeParams = propsClassTypeParams;
  ?>
  <?js= this.partial('properties.tmpl', data) ?>
<?js
} ?>
}
export interface <?js= data.settablePropertiesLenientInterface ?><?js= data.propsClassTypeParamsDeclaration ?> extends Partial<<?js= data.settablePropertiesInterface ?><?js= data.propsClassTypeParams?>> {
  [key: string]: any;
}
<?js
if (data.legacyComponentName){ ?>
export type <?js= data.legacyComponentNameWithGenerics ?> = <?js= data.vcomponentName ?><?js= data.classTypeParamsDeclaration ?>;
<?js= this.partial('namespace.tmpl', { data, props, componentName: data.legacyComponentName }) ?>
export type <?js= data.legacyEventMapInterface ?> = <?js= data.eventMapInterface ?><?js= this.classTypeParamsDeclaration ?>;
export type <?js= data.legacySettablePropertiesInterface ?> = <?js= data.settablePropertiesInterface ?><?js= data.propsClassTypeParamsDeclaration ?>;
export type <?js= data.legacySettablePropertiesLenientInterface ?> = <?js= data.settablePropertiesLenientInterface ?><?js= data.propsClassTypeParamsDeclaration ?>;
<?js
}?>

<?js= this.partial('jsxInterfaces.tmpl', data) ?>

