"use strict";

var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
  var c = arguments.length,
      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
      d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};

var __importDefault = this && this.__importDefault || function (mod) {
  return mod && mod.__esModule ? mod : {
    "default": mod
  };
};

Object.defineProperty(exports, "__esModule", {
  value: true
});
/**
 * @file @todo split up
 * @file @todo select dropdown in src/ui styled with presets
 */

const react_1 = __importDefault(require("react"));

const mobx_react_1 = require("xmobx/mobx-react");

const exotic_1 = require("exotic");

const chain_able_boost_1 = require("chain-able-boost");

const ColorSelectDropDown_1 = require("../../../presets/ColorSelectDropDown");

const SelectDropDown_1 = require("../../SelectDropDown");

const deps_1 = require("../deps");

const renderActiveItem = (props, state) => {
  const attributes = Object.assign({}, props);

  if (!props.label) {
    attributes.label = props.type;
  }

  if (state.isVisible) {
    attributes.label = props.type;
    attributes.isVisible = state.isVisible;
  }

  return react_1.default.createElement(SelectDropDown_1.ActiveOption, Object.assign({}, attributes));
};

const SelectAdapter = props => react_1.default.createElement(SelectDropDown_1.SelectDropDown, Object.assign({}, props, {
  renderActiveItem: renderActiveItem
}));

const StyledSelect = styled.withComponent(SelectAdapter)`
  span {
    width: 100%;
  }
`;

function toLabel(type) {
  switch (type) {
    case 'style':
      return 'Fit';

    case 'color':
      return 'Color';

    case 'size1':
      return 'Size';

    default:
      return chain_able_boost_1.firstToUpperCase(type);
  }
}

const removeDisabled = option => !option.isDisabled;

let SelectOption = class SelectOption extends react_1.default.Component {
  get attributes() {
    const {
      list,
      onClick,
      type
    } = this.props;
    const convertToOption = deps_1.convertToOptionFor(type);
    const options = list.filter(removeDisabled).map(convertToOption);
    return {
      options,
      onChange: onClick,
      // @todo needs more fix
      type: toLabel(type)
    };
  }

  get view() {
    const {
      attributes
    } = this;

    if (attributes.type === 'Color') {
      return react_1.default.createElement(ColorSelectDropDown_1.ColorSelectDropDown, Object.assign({}, attributes, {
        renderActiveItem: renderActiveItem
      }));
    } else {
      return react_1.default.createElement(StyledSelect, Object.assign({}, attributes));
    }
  }

  render() {
    const {
      view
    } = this;
    return view;
  }

};
SelectOption.defaultProps = {
  selectedValue: undefined,
  onClick: exotic_1.NO_OP,
  list: exotic_1.EMPTY_ARRAY,
  type: ''
};
SelectOption = __decorate([mobx_react_1.observer], SelectOption);
exports.default = SelectOption; //# sourceMappingURL=SelectOption.js.map