How to use the gui/element.createFromNode function in gui

return root.querySelectorAll(query).map((el) => {
        return Element.createFromNode(el, query);
      });
    }

_nextTabIndex(ev) {
    const nextElement = GUI.getNextElement(ev.shiftKey, document.activeElement, this._$root);
    if ( nextElement ) {
      if ( DOM.$hasClass(nextElement, 'gui-data-view') ) {
        Element.createFromNode(nextElement).focus();
      } else {
        try {
          nextElement.focus();
        } catch ( e ) {}
      }
    }
  }

tagName = tagName || el.tagName.toLowerCase();
  const isDataView = tagName.match(/^gui\-(tree|icon|list|file)\-view$/);

  if ( param === 'value' && !isDataView) {
    if ( (['gui-text', 'gui-password', 'gui-textarea', 'gui-slider', 'gui-select', 'gui-select-list']).indexOf(tagName) >= 0 ) {
      return el.querySelector('input, textarea, select').value;
    }
    if ( (['gui-checkbox', 'gui-radio', 'gui-switch']).indexOf(tagName) >= 0 ) {
      return !!el.querySelector('input').checked;
      //return el.querySelector('input').value === 'on';
    }
    return null;
  }

  if ( (param === 'value' || param === 'selected') && isDataView ) {
    return GUIElement.createFromNode(el).values();
  }

  return el.getAttribute('data-' + param);
}

_findByQuery(query, root, all) {
    root = root || this._getRoot();

    if ( !(root instanceof window.Node) ) {
      return all ? [] : null;
    }

    if ( all ) {
      return root.querySelectorAll(query).map((el) => {
        return Element.createFromNode(el, query);
      });
    }

    const el = root.querySelector(query);
    return Element.createFromNode(el, query);
  }

resolveItems(iter.menu, nroot);
        entry.appendChild(nroot);
      }
      if ( iter.onClick ) {
        const index = callbackMap.push(iter.onClick);
        entry.setAttribute('data-callback-id', String(index - 1));
      }
      par.appendChild(entry);
    });
  }

  if ( !root ) {
    root = GUI.createElement('gui-menu', {});
    resolveItems(items || [], root);

    GUIElement.createFromNode(root, null, 'gui-menu').build(true);

    Events.$bind(root, 'mouseover', function(ev, pos) {
      if ( ev.target && ev.target.tagName === 'GUI-MENU-ENTRY' ) {
        setTimeout(() => {
          clampSubMenu(ev.target.querySelector('gui-menu'));
        }, 1);
      }
    }, true);

    Events.$bind(root, 'click', function(ev, pos) {
      clickWrapper(ev, pos, function(ev, pos, t, orig, isExpander) {
        const index = parseInt(t.getAttribute('data-callback-id'), 10);
        if ( callbackMap[index] ) {
          callbackMap[index](ev, pos);
        }

pel.children.forEach((child, i) => {
      if ( child && child.tagName.toLowerCase() === 'gui-menu-entry') {
        GUIElement.createFromNode(child).build(null, winRef);

        cb(child, level);
      }
    });
  }