How to use the lit-html/lib/lit-extended.render function in lit-html

_render() {
    render(template(this), this);
  }

render() {
      render(this.template, this)
    }

$renderProps(){
    if(this.$lifecycle && this.$lifecycle.prerender){
      this.$lifecycle.prerender.call(this,this.$props);
    }
    var fragments = this.$render(this.$props);
    render(fragments,this.$shadow)
    if(this.$lifecycle && this.$lifecycle.postrender){
      this.$lifecycle.postrender.call(this,this.$props);
    }
  }
}

connectedCallback() {    
        if (!this.shadowRoot) this.attachShadow({ mode: 'open' });
  
        if (!this.hasAttribute('role'))
            this.setAttribute('role', 'simple');

        if (!this.hasAttribute('tabindex'))
            this.setAttribute('tabindex', '0');

        render(this.template, this.shadowRoot)    
    }

protected putPopup() {
    if (this.popup) {
      this.popup.remove();
      this.popup = undefined;
    }

    if (!this.props.popup) {
      return;
    }
    const latlong = [this.props.popup.lnglat.lng, this.props.popup.lnglat.lat];
    const el = document.createElement('div');
    el.classList.add('idly-gl');
    render(SelectorPopup(this.props.popup.ids, this.props.actions), el);
    this.popup = new Popup()
      .setLngLat(latlong)
      .setDOMContent(el)
      .addTo(this.gl);
  }

private _render(template: TemplateResult) {
		render(template, this.shadowRoot || this.attachShadow({ mode: 'open' }))
		this.renderedCallback()
	}