function Button(parent)
{
	Component.call(this, parent, "div");

	this.element.style.cursor = "pointer";

	/**
	 * If the button is disabled, it cannot be clicked.
	 *
	 * @attribute disabled
	 * @type {boolean}
	 */
	var disabled = false;
	Object.defineProperty(this, "disabled",
		{
			get: function() {return disabled;},
			set: function(value) {this.setDisabled(value);}
		});

	/**
	 * Base style of the button shown normally.
	 *
	 * @attribute styleBase
	 * @type {Object}
	 */
	this.styleBase = {backgroundColor: "var(--bar-color)"};

	/**
	 * Base style of the button shown when the mouse is over the button.
	 *
	 * @attribute stylePointerOver
	 * @type {Object}
	 */
	this.stylePointerOver = {backgroundColor: "var(--button-over-color)"};

	/**
	 * Disabled style shown when the button is disabled.
	 *
	 * @attribute styleDisabled
	 * @type {Object}
	 */
	this.styleDisabled = {backgroundColor: "var(--color-graph)"};

	this.setStyles(this.styleBase);
	this.preventDragEvents();

	var self = this;

	this.addEvent("mouseenter", function()
	{
		if (!self.disabled)
		{
			self.setStyles(self.stylePointerOver);
		}
	});

	this.addEvent("mouseleave", function()
	{
		if (!self.disabled)
		{
			self.setStyles(self.styleBase);
		}
	});
}
Base button class.

@class Button
@extends {Component}
@param {Component} parent Parent element.