How to use snabbdom-selector - 8 common examples

To help you get started, we’ve selected a few snabbdom-selector examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github snabbdom / snabbdom-template / index.js View on Github external
vt = hToVDOM(vToHTML(vt)) // how to clone?
    }
    else {
      vt = hToVDOM(templates[0])
      vt = Array.isArray(vt)? vNode('div', {}, vt): vt // wrap div around array of elems
    }
  }
  else if ( 'object' === typeof templates ) {
    vt = hToVDOM(vToHTML(templates)) // fixes glitch copying templates
  }
  else {
    vt = hToVDOM(templates)
    vt = Array.isArray(vt)? vNode('div', {}, vt): vt // wrap div around array of elems
  }
  if ( contentvars.sel && contentvars.data ) { // vtree
    var tar = vTSel('.template', vt)
    if ( tar.length ) {
      tar[0].children = contentvars && [contentvars] || undefined
    }
    else { console.log('Template selector not found.') }
  }
  else {
    Object.keys(contentvars).forEach(function (sel) {
      var value = contentvars[sel]
      var target = vTSel(sel, vt)
      if ( target.length ) {
        target = target[0]
        if ( 'string' === typeof value || 'number' === typeof value ) {
          target.children = [vNode('span', value)]
        }
        else if ( 'object' === typeof value  ) {
          Object.keys(value).forEach(function (prop) {
github snabbdom / snabbdom-template / index.js View on Github external
vt = templates.reduce(function(prev, next) {
        var ret = hToVDOM(next)
        ret = Array.isArray(ret)? vNode('div', {}, ret): ret // wrap div around array of elems
        var tar = vTSel('.template', ret)
        if ( tar.length ) {
          tar[0].children = prev && prev.children || undefined
        }
        else { console.log('Template selector not found.') }
        return ret
      }, start)
      vt = hToVDOM(vToHTML(vt)) // how to clone?
github snabbdom / snabbdom-template / index.js View on Github external
Object.keys(valprop).forEach(function (mapkey) {
                var subtmpl = hToVDOM(vToHTML(vTSel(mapkey, target)[0])) // how else to clone?
                if ( '_map' === prop ) { target.children = [] }
                valprop[mapkey].forEach(function (cvars) {
                  var mapd
                  if ( 'string' === typeof cvars ) {
                    subtmpl.children = [vNode('span', cvars)]
                    mapd = hToVDOM(vToHTML(subtmpl)) // how to clone?
                  }
                  else if ( 'object' === typeof cvars ) {
                    mapd = vDT(subtmpl, cvars)
                  }
                  switch ( prop ) {
                    case '_mapprepend': target.children.unshift(mapd); break
                    default: target.children.push(mapd); break
                  }
                })
              })
github snabbdom / snabbdom-template / index.js View on Github external
Object.keys(contentvars).forEach(function (sel) {
      var value = contentvars[sel]
      var target = vTSel(sel, vt)
      if ( target.length ) {
        target = target[0]
        if ( 'string' === typeof value || 'number' === typeof value ) {
          target.children = [vNode('span', value)]
        }
        else if ( 'object' === typeof value  ) {
          Object.keys(value).forEach(function (prop) {
            var targetprops = target.data.attrs = target.data.attrs || {}
            var valprop = value[prop]
            if ( '_html' === prop ) {
              target.children = [vNode('span', valprop)]
            }
            else if ( '_append' === prop ) {
              target.children.push(vNode('div', valprop))
            }
            else if ( '_prepend' === prop ) {
github cyclejs / cyclejs / dom / src / VNodeWrapper.ts View on Github external
public call(vnode: VNode | null): VNode {
    if (isDocFrag(this.rootElement)) {
      return this.wrapDocFrag(vnode === null ? [] : [vnode]);
    }
    if (vnode === null) {
      return this.wrap([]);
    }
    const {tagName: selTagName, id: selId} = selectorParser(vnode);
    const vNodeClassName = classNameFromVNode(vnode);
    const vNodeData = vnode.data || {};
    const vNodeDataProps = vNodeData.props || {};
    const {id: vNodeId = selId} = vNodeDataProps;

    const isVNodeAndRootElementIdentical =
      typeof vNodeId === 'string' &&
      vNodeId.toUpperCase() === this.rootElement.id.toUpperCase() &&
      selTagName.toUpperCase() === this.rootElement.tagName.toUpperCase() &&
      vNodeClassName.toUpperCase() === this.rootElement.className.toUpperCase();

    if (isVNodeAndRootElementIdentical) {
      return vnode;
    }

    return this.wrap([vnode]);
  }
github cyclejs / cyclejs / dom / src / VNodeWrapper.ts View on Github external
public call(vnode: VNode | null): VNode {
    if (isDocFrag(this.rootElement)) {
      return this.wrapDocFrag(vnode === null ? [] : [vnode]);
    }
    if (vnode === null) {
      return this.wrap([]);
    }
    const {tagName: selTagName, id: selId} = selectorParser(vnode);
    const vNodeClassName = classNameFromVNode(vnode);
    const vNodeData = vnode.data || {};
    const vNodeDataProps = vNodeData.props || {};
    const {id: vNodeId = selId} = vNodeDataProps;

    const isVNodeAndRootElementIdentical =
      typeof vNodeId === 'string' &&
      vNodeId.toUpperCase() === this.rootElement.id.toUpperCase() &&
      selTagName.toUpperCase() === this.rootElement.tagName.toUpperCase() &&
      vNodeClassName.toUpperCase() === this.rootElement.className.toUpperCase();

    if (isVNodeAndRootElementIdentical) {
      return vnode;
    }

    return this.wrap([vnode]);