yolap-click-addtag.html

<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="./yolap-behaviors.html">

<link rel="import" href="../iron-icons/iron-icons.html">
<link rel="import" href="../iron-icon/iron-icon.html">

<dom-module id="yolap-click-addtag">
	<style>
	    :host{
	      position: relative;
	      display: inline-block;
	      height: auto;
	      width: 100%;
	    }
	    :host .suggest{
	      height: inherit;
	      display: inline-block;
	      width: auto;
	      background: rgba(230,230,230,1);
	      padding: 2px 5px;
	      margin: 3px 1px;
	      border: solid 1px rgba(150,150,150,1);
		  cursor: pointer;
	    }
	</style>
	<template>
      <!-- <input type="text" id="input" value='' placeholder='Input search query' on-input='valueHandle'> -->
        <template is='dom-repeat' items='{{suggest}}'>
	    	<div class="suggest" on-click='select'>
	        	<span>{{item.name}}</span>
	        	<template is='dom-if' if='{{icon}}'>
	        		<iron-icon icon="{{icon}}"></iron-icon>
	        	</template>
	    	</div>
        </template>
	</template>
</dom-module>

<script>

Polymer({
	is: 'yolap-click-addtag',
	properties: {
		icon: {
			type: String,
		}
	},
	behaviors: [InputYolapBehavior, TypeaheadYolapBehavior],
});

</script>