wclr/esnextbin.md

## esnextbin.md

      
    Raw
  

              esnextbin.md
            
          
    made with esnextbin

  
## index.html
<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>ESNextbin Sketch</title>
  <!-- put additional styles and scripts here -->
</head>
<body>
  <!-- put markup and other contents here -->
</body>
</html>

## index.js
// write ES2015 code and import modules from npm
// and then press "Execute" to run your program
import {run} from '@cycle/xstream-run'
import {makeDOMDriver, div, button} from '@cycle/dom'
import xs from 'xstream'
import delay from 'xstream/extra/delay'

const {of, merge} = xs
//
const Main = ({DOM}) => {

  return {
    DOM: merge(
      of(div('.wrapper', ['WRAPPER1']))
      of(div('.wrapper', ['WRAPPER2', button('click')])).compose(delay(100))
    )
  }
}


run(Main, {
  DOM: makeDOMDriver('body')
})

## package.json
{
  "name": "esnextbin-sketch",
  "version": "0.0.0",
  "@cycle/dom": "*",
  "xstream": "*",
  "@cycle/xstream-run": "*",
  "dependencies": {
    "@cycle/xstream-run": "3.1.0",
    "@cycle/dom": "12.2.5",
    "xstream": "6.4.1"
  }
}

## transpiled.js
/*
unknown: Unexpected token (15:6)
  13 |     DOM: merge(
  14 |       of(div('.wrapper', ['WRAPPER1']))
> 15 |       of(div('.wrapper', ['WRAPPER2', button('click')])).compose(delay(100))
     |       ^
  16 |     )
  17 |   }
  18 | }
*/
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>ESNextbin Sketch</title>
	<!-- put additional styles and scripts here -->
	</head>
	<body>
	<!-- put markup and other contents here -->
	</body>
	</html>
	// write ES2015 code and import modules from npm
	// and then press "Execute" to run your program
	import {run} from '@cycle/xstream-run'
	import {makeDOMDriver, div, button} from '@cycle/dom'
	import xs from 'xstream'
	import delay from 'xstream/extra/delay'

	const {of, merge} = xs
	//
	const Main = ({DOM}) => {

	return {
	DOM: merge(
	of(div('.wrapper', ['WRAPPER1']))
	of(div('.wrapper', ['WRAPPER2', button('click')])).compose(delay(100))
	)
	}
	}


	run(Main, {
	DOM: makeDOMDriver('body')
	})
	{
	"name": "esnextbin-sketch",
	"version": "0.0.0",
	"@cycle/dom": "*",
	"xstream": "*",
	"@cycle/xstream-run": "*",
	"dependencies": {
	"@cycle/xstream-run": "3.1.0",
	"@cycle/dom": "12.2.5",
	"xstream": "6.4.1"
	}
	}
	/*
	unknown: Unexpected token (15:6)
	13 \| DOM: merge(
	14 \| of(div('.wrapper', ['WRAPPER1']))
	> 15 \| of(div('.wrapper', ['WRAPPER2', button('click')])).compose(delay(100))
	\| ^
	16 \| )
	17 \| }
	18 \| }
	*/