patowens · September 28, 2015 00:09
diff --git a/index.html b/index.html
 <dropdown>
  <span class="handle { expanded: is_open }" onclick={ toggle }>{ opts.title }</span>
  <ul>
    <li each={ items } onclick={ select }></li>
  </ul>
 </dropdown>
diff --git a/index.js b/index.js

 // require your favourite things..
 var dependency = require('your-favourite-lib');

 // logic comes here..

 this.items = [
  { title: 'hello' },
  { title: 'world' }
 ];

 toggle() {
  this.is_open = !this.is_open;
 };

 select(e) {
  console.log('you have selected: ', e.target);
 };

 this.on('mount', function() {
  this.is_open = false;
  // do things, perhaps with famous etc..
 });
diff --git a/index.scss b/index.scss

 // allowing scss please

 dropdown {
  
  span ul {
    display:none;
  }

  span.expanded ul {
    display: "";
  }

 }
diff --git a/page.html b/page.html
 <html>
  <head></head>
  <body>
    <h1>Hello world, this is my page</h1>
    <dropdown title="click here!" items={ someArrayOfItems }></dropdown>
  </body>
 </html>
diff --git a/test.js b/test.js
 testComponent('dropdown', {title="click here!", items: [{ title: 'hello', 'world'}] },  function(err, document) {
    f = feryt(document);
    f.find('.handle').equals("click here!")
 });
	<dropdown>
	<span class="handle { expanded: is_open }" onclick={ toggle }>{ opts.title }</span>
	<ul>
	<li each={ items } onclick={ select }></li>
	</ul>
	</dropdown>

	// require your favourite things..
	var dependency = require('your-favourite-lib');

	// logic comes here..

	this.items = [
	{ title: 'hello' },
	{ title: 'world' }
	];

	toggle() {
	this.is_open = !this.is_open;
	};

	select(e) {
	console.log('you have selected: ', e.target);
	};

	this.on('mount', function() {
	this.is_open = false;
	// do things, perhaps with famous etc..
	});
	<html>
	<head></head>
	<body>
	<h1>Hello world, this is my page</h1>
	<dropdown title="click here!" items={ someArrayOfItems }></dropdown>
	</body>
	</html>
	testComponent('dropdown', {title="click here!", items: [{ title: 'hello', 'world'}] }, function(err, document) {
	f = feryt(document);
	f.find('.handle').equals("click here!")
	});