Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 | 1x 1x 1x 1x 18x 1x 18x 18x 9x 9x 18x 18x 9x 18x 3x 18x 18x 18x 1x | var
mfExtend = require( './mfExtend' ),
util = require( './util' ),
View = require( './View' ),
IconButton = require( './IconButton' );
/**
* A wrapper for creating a button.
* FIXME: T343036 This file should be combined with IconButton, all gadgets/extentions
* using Button.js and IconButton.js will need to be updated to reflect this
*
* @class Button
* @extends View
*
* @param {Object} options Configuration options
*/
function Button( options ) {
View.call( this, options );
}
mfExtend( Button, View, {
/**
* @inheritdoc
* @memberof IconButton
* @instance
*/
preRender() {
// Mapping existing props to Codex props used in IconButton
var action = 'default';
if ( this.options.progressive ) {
action = 'progressive';
} else Iif ( this.options.destructive ) {
action = 'destructive';
}
var weight = this.options.quiet ? 'quiet' : 'normal';
if ( this.options.progressive || this.options.destructive ) {
weight = 'primary';
}
if ( this.options.block ) {
this.options.additionalClassNames += ' mf-button-block';
}
var options = util.extend( {
weight,
action,
isIconOnly: false,
icon: null
}, this.options );
this._button = new IconButton( options );
this.options._buttonHTML = this._button.$el.get( 0 ).outerHTML;
},
/**
* @inheritdoc
* @memberof Button
* @instance
*/
isTemplateMode: true,
/**
* @memberof Button
* @instance
* @mixes View#defaults
* @property {Object} defaults Default options hash.
* @property {string} defaults.tagName The name of the tag in which the button is wrapped.
* @property {boolean} defaults.block is stacked button
* @property {boolean} defaults.progressive is progressive action
* @property {boolean} defaults.quiet is quiet button
* @property {boolean} defaults.destructive is destructive action
* @property {string} defaults.additionalClassNames Additional class name(s).
* @property {string} defaults.href url
* @property {string} defaults.label of button
* @property {boolean} defaults.disabled should only be used with tagName button
*/
defaults: {
tagName: 'a',
disabled: false,
block: undefined,
progressive: undefined,
destructive: undefined,
quiet: undefined,
additionalClassNames: '',
href: undefined,
label: undefined,
size: 'medium'
},
/**
* @memberof Button
* @instance
*/
template: util.template( '{{{_buttonHTML}}}' )
} );
module.exports = Button;
|