Repository URL to install this package:
Version:
0.9.5 ▾
|
ui-component-library
/
dist
/
components
/
molecules
/
ProductOptions
/
SelectOption
/
SelectOption.js
|
---|
"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("src/components/presets/ColorSelectDropDown");
const SelectDropDown_1 = require("src/components/molecules/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