UNPKG

sws-frontend

Version:

sws frontend project

54 lines 3.17 kB
"use strict"; var __rest = (this && this.__rest) || function (s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0) t[p[i]] = s[p[i]]; return t; }; Object.defineProperty(exports, "__esModule", { value: true }); var React = require("react"); var bootstrap_1 = require("../commons/bootstrap"); var react_bootstrap_1 = require("react-bootstrap"); var field_1 = require("./field"); require("./listfield.css"); var onFieldChange = function (e, index, fields, onChange) { var _fields; if (fields.length <= 1) { _fields = [e.target.value]; } else { _fields = fields; // TODO do it better _fields[index] = e.target.value; } onChange(e, _fields); }; var onAdd = function (e, fields, onChange) { // what to do with the app state (defined externally) var index = fields.length - 1; onChange(e, fields.concat([""])); }; var onRemove = function (e, index, fields, onChange) { onChange(e, fields.filter(function (el, idx, array) { return index !== idx; })); }; exports.ListField = function (props) { var children = props.children, p = __rest(props, ["children"]); var fields = p.fields || []; return React.createElement(field_1.Field, { className: p.className, name: p.name, validation: p.validation, comment: p.comment, noLabel: p.noLabel }, fields.length > 0 && fields.filter(function (el, idx, array) { return idx < array.length - 1; }).map(function (key, index) { return React.createElement(bootstrap_1.InputGroup, { key: index }, React.createElement(bootstrap_1.FormControl, { type: "text", placeholder: p.placeholder || "type a " + p.name.toLowerCase() + "...", disabled: true, onChange: function (c) { return onFieldChange(c, index, fields, p.onChange); }, value: fields[index] }), React.createElement(bootstrap_1.InputGroup.Button, null, React.createElement(react_bootstrap_1.Button, { className: "Button", onClick: function (e) { return onRemove(e, index, fields, p.onChange); } }, React.createElement("i", { className: "material-icons" }, "remove")))); }), React.createElement(bootstrap_1.InputGroup, null, React.createElement(bootstrap_1.FormControl, { retype: "text", placeholder: p.placeholder || "type a " + p.name.toLowerCase() + "...", disabled: p.disabled ? p.disabled : false, onChange: function (c) { return onFieldChange(c, fields.length - 1, fields, p.onChange); }, value: fields[fields.length - 1] }), React.createElement(bootstrap_1.InputGroup.Button, null, React.createElement(react_bootstrap_1.Button, { className: "Button", onClick: function (e) { return onAdd(e, fields, p.onChange); } }, React.createElement("i", { className: "material-icons" }, "add"))))); }; exports.default = exports.ListField; //# sourceMappingURL=listfield.js.map