How to use the basis.dom.createElement function in basis

{
          listContext = DOM.createElement('UL');
          result.push(listContext);
        }
        listContext.appendChild(lines[i]);
      }
      else
      {
        listContext = null;
        result.push(lines[i]);
      }
    }
    return result;
  }

  var typeSplitter = DOM.createElement('SPAN.splitter', '|');
  function parseTypes(text){
    var parts = (text || '').split(/\s*\|\s*/);
    var result = DOM.createFragment();
    var node;
    for (var i = 0; i < parts.length; i++)
    {
      if (i)
        result.appendChild(typeSplitter.cloneNode(true));

      var descr = mapDO[parts[i]];
      if (descr)
        node = DOM.createElement(basis.string.format('A[href=#{fullPath}].doclink-{kind}', descr.data), parts[i]);
      else
      {
        var m = parts[i].match(/^Array\.\<(.+)\>/);
        if (m && (descr = mapDO[m[1]]))

var m = line.match(/^\s*(.+):(\r\n?|\n\r?)/);
      var h;
      if (m)
      {
        h = DOM.createElement('SPAN.definition', m[1]);
        line = line.substr(m[0].length);
      }

      var parts = line.split(/\{([a-z0-9\_\.\#]+)\}/i);
      for (var i = 1; i < parts.length; i += 2)
      {
        var mapPath = parts[i].replace(/#/, '.prototype.');
        var descr = mapDO[mapPath];
        if (descr)
          parts[i] = DOM.createElement(basis.string.format('A[href=#{fullPath}].doclink-{kind}', descr.data), descr.data.title);
        else
          parts[i] = '{' + parts[i] + '}';
      }

      return DOM.createElement(listItem ? 'LI' : 'P', h, parts);
    }).filter(basis.fn.$isNotNull));

function parseTypes(text){
    var parts = (text || '').split(/\s*\|\s*/);
    var result = DOM.createFragment();
    var node;
    for (var i = 0; i < parts.length; i++)
    {
      if (i)
        result.appendChild(typeSplitter.cloneNode(true));

      var descr = mapDO[parts[i]];
      if (descr)
        node = DOM.createElement(basis.string.format('A[href=#{fullPath}].doclink-{kind}', descr.data), parts[i]);
      else
      {
        var m = parts[i].match(/^Array\.\<(.+)\>/);
        if (m && (descr = mapDO[m[1]]))
          node = DOM.createFragment('Array.<', DOM.createElement(basis.string.format('A[href=#{fullPath}].doclink-{kind}', descr.data), m[1]), '>');
        else
          node = DOM.createText(parts[i]);
      }

      result.appendChild(node);
    }
    return result;
  }

var inspectMode = new Value({ value: false });

var overlay = domUtils.createElement({
  css: {
    pointerEvents: 'none',
    transition: 'all .05s',
    position: 'absolute',
    top: 0,
    bottom: 0,
    left: 0,
    right: 0,
    zIndex: 10000,
    background: 'rgba(110,163,217,0.7)'
  }
});
var boxElement = domUtils.createElement({
  css: {
    visibility: 'hidden',
    position: 'absolute'
  }
});

function pickHandler(event) {
  event.die();

  if (event.mouseRight) {
    stopInspect();
    return;
  }

  var target = pickupTarget.value;

parse: function(){
      var newData = this.data;
      var result = DOM.createFragment();

      if (newData.file)
      {
        var filename = basis.path.relative(newData.file);
        result.appendChild(
          DOM.createElement(basis.string.format('A.location[href="source_viewer.html?file={0}#{1}"][target="_blank"]', filename, newData.line),
            basis.path.basename(filename) + ':' + newData.line
          )
        );
      }

      if (newData.tags)
      {
        var tags = DOM.wrap(basis.object.keys(basis.object.slice(newData.tags, tagLabels)), { 'SPAN.tag': basis.fn.$true });
        if (tags.length)
          result.appendChild(DOM.createElement('.tags', tags));

        if (newData.tags.description)
        {
          if (!newData.tags.description_)
            newData.tags.description_ = parseDescription(newData.tags.description);

basis.object.iterate({ ret: newData.tags.returns }, function(key, value){
                var types = value.type.replace(/=$/, '');
                return DOM.createElement('LI.param',
                  DOM.createElement('SPAN.types', parseTypes(types)),
                  parseDescription(value.description || '')
                );
              })
            )

function addStyleSheet(url, title){
    var element = dom.createElement(!url ? 'style[type="text/css"]' : basis.string.format('link[type="text/css"][rel="{alt}stylesheet"][href="{url}"]', {
      alt: title ? 'alternate ' : '',
      url: url.replace(/\"/g, '\\"')
    }));

    basis.doc.head.add(element);

    return makeStyleSheetCompatible(element.sheet || element.styleSheet);
  }

basis.object.iterate(newData.tags.param, function(key, value){
                var types = value.type.replace(/=$/, '');
                var isOptional = types != value.type;

                return DOM.createElement('LI.param' + (isOptional ? '.optional' : ''),
                  DOM.createElement('SPAN.name', key),
                  DOM.createElement('SPAN.types', parseTypes(types)),
                  (isOptional ? ' (optional)' : ''),
                  parseDescription(value.description || '')
                );
              })
            )

var Balloon = require('basis.ui.popup').Balloon;

var fileAPI = require('api').ns('file');
var inspectBasis = require('devpanel').inspectBasis;
var inspectBasisTemplate = inspectBasis.require('basis.template');
var inspectBasisTemplateMarker = inspectBasis.require('basis.template.const').MARKER;
var inspectBasisEvent = inspectBasis.require('basis.dom.event');

var document = global.document;
var templateInfo = resource('../view/template-info/index.js');

var inspect = require('api').inspect;
var inspecting = false;
var inspectDepth = 0;

var overlay = domUtils.createElement({
  css: {
    pointerEvents: 'none',
    transition: 'all .05s',
    position: 'absolute',
    top: 0,
    bottom: 0,
    left: 0,
    right: 0,
    zIndex: 10000,
    background: 'rgba(110,163,217,0.7)'
  }
});
var boxElement = domUtils.createElement({
  css: {
    visibility: 'hidden',
    position: 'absolute'