How to use the zoid.create function in zoid

import zoid from 'zoid'
import { config } from '../../config'

const helloWorld = zoid.create({
  tag: 'hello-world', // This has to be unique per js loaded on the page
  url: `${config.baseUrl}/child.html`
})

jQuery(".hadron-iframe").show();      
      return;
    }

    var data = this.getHadronAttributes()
    data.botIsSecure = this.isSecure;

    var hadronAppUrl  
    if (process.env.NODE_ENV == 'development') {
      hadronAppUrl = 'hadron.app.html'  
    } else if (process.env.NODE_ENV == 'production') {
      hadronAppUrl = HADRON_URL + 'hadron.app.html'
    }

    if (!window.hadronLauncherIframe) {
      window.hadronLauncherIframe = zoid.create({
      tag: 'hadron-iframe-handler', // This has to be unique per js loaded on the page
      url: hadronAppUrl,
      
      containerTemplate: ({ uid, frame, prerenderFrame, doc, props, event, dimensions : { width, height } }) => {
          const CLASS = {
            VISIBLE:   'visible',
            INVISIBLE: 'invisible'
          };
          let div = doc.createElement('div');        
          div.setAttribute('id', uid);
          
          const style = doc.createElement('style');
          if (props.cspNonce) {
              style.setAttribute('nonce', props.cspNonce);
          }
          style.appendChild(doc.createTextNode(`

position: 'bottom-left',
        bgColor: false,
        textColor: false,
        textAlign: 'left',
        icon: false,
        beforeShow: function () {},
        afterShown: function () {},
        beforeHide: function () {},
        afterHidden: function () {},
        onClick: function () {}
    };

})( jQuery, window, document );

//conect iframe with parent
zoid.create({
    tag: 'hadron-iframe-handler', // This has to be unique per js loaded on the page
    url: 'hadron.app.html'
  })

var inControl;
window.inControl = inControl = new Hadron("inControl", "#hadron-container");
inControl.runControl();

import zoid from 'zoid'
import { config } from '../../config'

const element = 'zoid-component'
const options = {}

const helloWorld = zoid.create({
  tag: 'hello-world', // This has to be unique per js loaded on the page
  url: `${config.baseUrl}/child.html`
})

helloWorld.render(options, element)

import zoid from 'zoid'
import { config } from '../../config'

const zoidComponentInit = zoid.create({
  tag: 'zoid-presentation', // This has to be unique per js loaded on the page
  url: `${config.baseUrl}/child.html`
})

// --------------------------------------------------
// Passing Options
// const element = document.querySelector('#title')
// element.innerHTML = window.xprops.alternateText

// document.addEventListener('click', () => {
//   window.xprops.updateBackgroundColor('card', 'pink')
// }, false)