<script>
/**
	Checkbox element with label

		// Can be created dynamically
		var checkboxButton = new OreeshCheckboxButton();
	
	
		<!-- Or via HTML -->
		<oreesh-checkbox-button label="1" value="0">Choose me</oreesh-checkbox-button>
		<oreesh-checkbox-button label="2" value="1">Choose me, too!</oreesh-checkbox-button>
		<oreesh-checkbox-button label="3" value="2" selected>I'm already selected</oreesh-checkbox-button>
		<oreesh-checkbox-button label="4" value="3" disabled>I'm disabled</oreesh-checkbox-button>
	
	@class oreesh-checkbox-button
**/
/**
	The label to display inside checkbox

	@attribute label
**/
/**
	The value when checked

	@attribute value
**/
/**
	Whether to make the element already selected

	@attribute selected
**/
/**
	Whether to make the element disabled

	@attribute disabled
**/
/**
	The element `border: none;` style

	@attribute no-border
**/
/**
	The element `border-color: transparent;` style

	@attribute no-border-color
**/
</script>
<dom-module id="oreesh-checkbox-button">
	<template>
		<link rel="stylesheet" is="custom-style" href="./oreesh-checkbox-button.css">
		<div class="buttonColumn">
			<div class="button">
				<paper-ripple center class="circle"></paper-ripple>
				<div class="focus-circle"></div>
				<div class="label">{{label}}</div>
				<img source="<%- svg.check_v %>" class="icon" />
			</div>
		</div>
		<div class="itemColumn">
			<content></content>
		</div>
	</template>
</dom-module>

<script src="./oreesh-checkbox-button.js"></script>