2016-11-02 16:12:13 -06:00

79 lines
2.0 KiB
JavaScript

module.exports = require('marko/widgets').defineComponent({
template: require.resolve('./template.marko'),
getInitialState: function(input) {
return {
size: input.size || 'normal',
variant: input.variant || 'primary',
className: input['class'],
attrs: input['*']
};
},
getInitialBody: function(input) {
return input.label || input.renderBody;
},
getTemplateData: function(state, input) {
var rootAttrs = {};
var classParts = ['app-button'];
var type = 'button';
var variant = state.variant;
if (variant !== 'primary') {
classParts.push('app-button-' + variant);
}
var size = state.size;
if (size !== 'normal') {
classParts.push('app-button-' + size);
}
var className = state.className;
if (className) {
classParts.push(className);
}
var splatAttrs = state.attrs;
if (splatAttrs) {
for (var splatAttr in splatAttrs) {
if (splatAttrs.hasOwnProperty(splatAttr)) {
rootAttrs[splatAttr] = splatAttrs[splatAttr];
}
}
}
rootAttrs['class'] = classParts.join(' ');
return {
type: type,
rootAttrs: rootAttrs
};
},
handleClick: function(event) {
// Every Widget instance is also an EventEmitter instance.
// We will emit a custom "click" event when a DOM click event
// is triggered
this.emit('click', {
event: event // Pass along the DOM event in case it is helpful to others
});
},
// Add any other methods here
setVariant: function(variant) {
this.setState('variant', variant);
},
setSize: function(size) {
this.setState('size', size);
},
setLabel: function(label) {
this.setState('label', label);
},
getSize: function() {
return this.state.size;
}
});