/** @jsx createElement */

import { createElement, Component, PropTypes } from 'rax';
import View from 'nuke-view';
import Icon from 'nuke-icon';
import { connectStyle } from 'nuke-theme-provider';
import stylesProvider from './styles';

class Feedback extends Component {
  constructor() {
    super();
  }
  render() {
    const styles = this.props.themeStyle;
    const { style = {}, type, children } = this.props;

    const iconType =
      {
        success: 'success-fill',
        error: 'delete-fill',
        warning: 'warning-fill',
      }[type] || type;

    return (
      <View style={[styles.feedback, style]}>
        <Icon style={[styles.icon, styles[`icon-${type}`]]} name={iconType} />
        <View style={styles.content}>{children}</View>
      </View>
    );
  }
}
Feedback.propTypes = {
  type: PropTypes.oneOf(['success', 'error', 'warning']),
  style: PropTypes.any,
  children: PropTypes.any,
};

Feedback.defaultTypes = {
  type: 'success',
  style: {},
  children: null,
};
Feedback.displayName = 'Feedback';

const StyledFeedback = connectStyle(stylesProvider)(Feedback);

export default StyledFeedback;