chem-generic-ui 0.1.47 → 0.1.50

package/dist/components/fields/GenPropertiesFields.js

@@ -0,0 +1,616 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.GenWFNext = exports.GenTextFormula = exports.GenPropertiesUpload = exports.GenPropertiesTextArea = exports.GenPropertiesText = exports.GenPropertiesTable = exports.GenPropertiesSystemDefined = exports.GenPropertiesSelect = exports.GenPropertiesNumber = exports.GenPropertiesInputGroup = exports.GenPropertiesDrop = exports.GenPropertiesCheckbox = exports.GenPropertiesCalculate = exports.GenDummy = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactBootstrap = require("react-bootstrap");
+
+var _reactSelect = _interopRequireDefault(require("react-select"));
+
+var _reactDropzone = _interopRequireDefault(require("react-dropzone"));
+
+var _uuid = require("uuid");
+
+var _lodash = require("lodash");
+
+var _FieldLabel = _interopRequireDefault(require("./FieldLabel"));
+
+var _utils = require("../tools/utils");
+
+var _GenericElDropTarget = _interopRequireDefault(require("../dnd/GenericElDropTarget"));
+
+var _TableRecord = _interopRequireDefault(require("../table/TableRecord"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var GenPropertiesCalculate = function GenPropertiesCalculate(opt) {
+  var fields = opt.layer && opt.layer.fields || [];
+  var showVal = 0;
+  var showTxt = null;
+  var newFormula = opt.formula;
+  var calFields = (0, _lodash.filter)(fields, function (o) {
+    return o.type === 'integer' || o.type === 'system-defined';
+  });
+  var regF = /[a-zA-Z0-9]+/gm; // eslint-disable-next-line max-len
+
+  var varFields = opt.formula && opt.formula.match(regF) ? opt.formula.match(regF).sort(function (a, b) {
+    return b.length - a.length;
+  }) : [];
+  varFields.forEach(function (fi) {
+    if (!isNaN(fi)) return;
+    var tmpField = calFields.find(function (e) {
+      return e.field === fi;
+    });
+
+    if (typeof tmpField === 'undefined' || tmpField == null) {
+      newFormula = newFormula.replace(fi, 0);
+    } else {
+      newFormula = tmpField.type === 'system-defined' ? newFormula.replace(fi, parseFloat((0, _utils.unitConvToBase)(tmpField) || 0)) : newFormula.replace(fi, parseFloat(tmpField.value || 0));
+    }
+  });
+
+  if (opt.type === 'formula-field') {
+    try {
+      showVal = eval(newFormula);
+      showTxt = !isNaN(showVal) ? parseFloat(showVal.toFixed(5)) : 0;
+    } catch (e) {
+      if (e instanceof SyntaxError) {
+        showTxt = e.message;
+      }
+    }
+  }
+
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "text",
+    value: showTxt,
+    onChange: opt.onChange,
+    className: "readonly",
+    readOnly: "readonly",
+    required: false,
+    placeholder: opt.placeholder,
+    min: 0
+  }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Button, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
+    placement: "bottom",
+    overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
+      id: "update_calculation_field"
+    }, "adjust")
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    active: true,
+    className: "clipboardBtn",
+    onClick: function onClick() {
+      return opt.onChange(showTxt);
+    }
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fa fa-arrow-right",
+    "aria-hidden": "true"
+  })))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "text",
+    value: opt.value,
+    onChange: opt.onChange,
+    required: false,
+    placeholder: opt.placeholder,
+    min: 0
+  })));
+};
+
+exports.GenPropertiesCalculate = GenPropertiesCalculate;
+
+var GenPropertiesCheckbox = function GenPropertiesCheckbox(opt) {
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Checkbox, {
+    name: opt.field,
+    checked: opt.value,
+    onChange: opt.onChange,
+    disabled: opt.readOnly
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl.Static, null, opt.label)));
+};
+
+exports.GenPropertiesCheckbox = GenPropertiesCheckbox;
+
+var GenPropertiesDrop = function GenPropertiesDrop(opt) {
+  var className = opt.isRequired ? 'drop_generic_properties field_required' : 'drop_generic_properties';
+  var createOpt = null;
+
+  if (opt.value.is_new === true) {
+    createOpt = /*#__PURE__*/_react.default.createElement("div", {
+      className: "sample_radios"
+    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
+      placement: "top",
+      overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
+        id: (0, _uuid.v4)()
+      }, "associate with this sample")
+    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Radio, {
+      name: "dropS_".concat(opt.value.el_id),
+      disabled: opt.value.isAssoc === true,
+      checked: opt.value.cr_opt === 0,
+      onChange: function onChange() {
+        return opt.onChange(_objectSpread(_objectSpread({}, opt.value), {}, {
+          cr_opt: 0
+        }));
+      },
+      inline: true
+    }, "Current")), /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
+      placement: "top",
+      overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
+        id: (0, _uuid.v4)()
+      }, "split from the sample first and then associate with it")
+    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Radio, {
+      name: "dropS_".concat(opt.value.el_id),
+      checked: opt.value.cr_opt === 1,
+      onChange: function onChange() {
+        return opt.onChange(_objectSpread(_objectSpread({}, opt.value), {}, {
+          cr_opt: 1
+        }));
+      },
+      inline: true
+    }, "Split")), /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
+      placement: "top",
+      overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
+        id: (0, _uuid.v4)()
+      }, "duplicate the sample first and then associate with it")
+    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Radio, {
+      name: "dropS_".concat(opt.value.el_id),
+      checked: opt.value.cr_opt === 2,
+      onChange: function onChange() {
+        return opt.onChange(_objectSpread(_objectSpread({}, opt.value), {}, {
+          cr_opt: 2
+        }));
+      },
+      inline: true
+    }, "Copy")));
+  }
+
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  var defaultIcon = opt.type === 'drag_element' ? /*#__PURE__*/_react.default.createElement("span", {
+    className: "fa fa-link icon_generic_nav indicator"
+  }) : /*#__PURE__*/_react.default.createElement("span", {
+    className: "icon-sample indicator"
+  });
+  var dragTarget = opt.isPreview === true ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "target"
+  }, defaultIcon) : /*#__PURE__*/_react.default.createElement(_GenericElDropTarget.default, {
+    opt: opt,
+    onDrop: opt.onChange
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl.Static, {
+    style: {
+      paddingBottom: '0px'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: className
+  }, dragTarget, createOpt, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
+    placement: "top",
+    overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
+      id: (0, _uuid.v4)()
+    }, "remove")
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    className: "btn_del",
+    bsStyle: "danger",
+    bsSize: "xsmall",
+    onClick: function onClick() {
+      return opt.onChange({});
+    }
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fa fa-trash-o",
+    "aria-hidden": "true"
+  })))))));
+};
+
+exports.GenPropertiesDrop = GenPropertiesDrop;
+
+var GenDummy = function GenDummy() {
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, {
+    className: "text_generic_properties"
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "text",
+    className: "dummy",
+    readOnly: true
+  }));
+};
+
+exports.GenDummy = GenDummy;
+
+var GenPropertiesInputGroup = function GenPropertiesInputGroup(opt) {
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+
+  var fLab = function fLab(e) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: (0, _uuid.v4)(),
+      className: "form-control g_input_group_label"
+    }, e.value);
+  };
+
+  var fTxt = function fTxt(e) {
+    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+      className: "g_input_group",
+      key: e.id,
+      type: e.type,
+      name: e.id,
+      value: e.value,
+      onChange: function onChange(o) {
+        return opt.onSubChange(o, e.id, opt.f_obj);
+      }
+    });
+  };
+
+  var fUnit = function fUnit(e) {
+    return /*#__PURE__*/_react.default.createElement("span", {
+      key: "".concat(e.id, "_GenPropertiesInputGroup"),
+      className: "input-group",
+      style: {
+        width: '100%'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+      key: e.id,
+      type: "number",
+      name: e.id,
+      value: e.value,
+      onChange: function onChange(o) {
+        return opt.onSubChange(o, e.id, opt.f_obj);
+      },
+      min: 1
+    }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Button, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+      active: true,
+      onClick: function onClick() {
+        return opt.onSubChange(e, e.id, opt.f_obj);
+      },
+      bsStyle: "success"
+    }, (0, _utils.genUnitSup)((0, _utils.genUnit)(e.option_layers, e.value_system).label) || '')));
+  };
+
+  var subs = opt.f_obj && opt.f_obj.sub_fields && opt.f_obj.sub_fields.map(function (e) {
+    if (e.type === 'label') {
+      return fLab(e);
+    }
+
+    if (e.type === 'system-defined') {
+      return fUnit(e);
+    }
+
+    return fTxt(e);
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, {
+    style: {
+      display: 'flex'
+    }
+  }, subs));
+};
+
+exports.GenPropertiesInputGroup = GenPropertiesInputGroup;
+
+var GenPropertiesNumber = function GenPropertiesNumber(opt) {
+  var className = opt.isEditable ? 'editable' : 'readonly';
+  className = opt.isRequired && opt.isEditable ? 'required' : className;
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "number",
+    value: opt.value,
+    onChange: opt.onChange,
+    className: className,
+    readOnly: opt.readOnly,
+    required: opt.isRequired,
+    placeholder: opt.placeholder,
+    min: 1
+  }));
+};
+
+exports.GenPropertiesNumber = GenPropertiesNumber;
+
+var GenPropertiesSelect = function GenPropertiesSelect(opt) {
+  var options = opt.options.map(function (op) {
+    return {
+      value: op.key,
+      name: op.key,
+      label: op.label
+    };
+  });
+  var className = opt.isEditable ? 'select_generic_properties_editable' : 'select_generic_properties_readonly';
+  className = opt.isRequired && opt.isEditable ? 'select_generic_properties_required' : className;
+  className = "".concat(className, " status-select");
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  var val = options.find(function (o) {
+    return o.value === opt.value;
+  }) || null;
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactSelect.default, {
+    isClearable: true,
+    menuContainerStyle: {
+      position: 'absolute'
+    },
+    name: opt.field,
+    multi: false,
+    options: options,
+    value: val,
+    onChange: opt.onChange,
+    className: className,
+    disabled: opt.readOnly
+  }));
+};
+
+exports.GenPropertiesSelect = GenPropertiesSelect;
+
+var GenPropertiesSystemDefined = function GenPropertiesSystemDefined(opt) {
+  var className = opt.isEditable ? 'editable' : 'readonly';
+  className = opt.isRequired && opt.isEditable ? 'required' : className;
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "number",
+    value: opt.value,
+    onChange: opt.onChange,
+    className: className,
+    readOnly: opt.readOnly,
+    required: opt.isRequired,
+    placeholder: opt.placeholder,
+    min: 1
+  }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Button, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    disabled: opt.readOnly,
+    active: true,
+    onClick: opt.onClick,
+    bsStyle: "success"
+  }, (0, _utils.genUnitSup)((0, _utils.genUnit)(opt.option_layers, opt.value_system).label) || ''))));
+};
+
+exports.GenPropertiesSystemDefined = GenPropertiesSystemDefined;
+
+var GenPropertiesTable = function GenPropertiesTable(opt) {
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_TableRecord.default, {
+    key: "grid_".concat(opt.f_obj.field),
+    opt: opt
+  }));
+};
+
+exports.GenPropertiesTable = GenPropertiesTable;
+
+var GenPropertiesText = function GenPropertiesText(opt) {
+  var className = opt.isEditable ? 'editable' : 'readonly';
+  className = opt.isRequired && opt.isEditable ? 'required' : className;
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, {
+    className: "text_generic_properties"
+  }, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "text",
+    value: opt.value,
+    onChange: opt.onChange,
+    className: className,
+    readOnly: opt.readOnly,
+    required: opt.isRequired,
+    placeholder: opt.placeholder
+  }));
+};
+
+exports.GenPropertiesText = GenPropertiesText;
+
+var GenPropertiesTextArea = function GenPropertiesTextArea(opt) {
+  var className = opt.isEditable ? 'editable' : 'readonly';
+  className = opt.isRequired && opt.isEditable ? 'required' : className;
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, {
+    className: "text_generic_properties"
+  }, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    componentClass: "textarea",
+    value: opt.value,
+    onChange: opt.onChange,
+    className: className,
+    readOnly: opt.readOnly,
+    required: opt.isRequired,
+    placeholder: opt.placeholder
+  }));
+};
+
+exports.GenPropertiesTextArea = GenPropertiesTextArea;
+
+var GenTextFormula = function GenTextFormula(opt) {
+  var layers = opt.layers;
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  var subs = [];
+  (opt.f_obj && opt.f_obj.text_sub_fields).map(function (e) {
+    var layer = e.layer,
+        field = e.field,
+        separator = e.separator;
+
+    if (field && field !== '') {
+      if (field.includes('[@@]')) {
+        var fds = field.split('[@@]');
+
+        if (fds && fds.length === 2) {
+          var fdt = ((layers[layer] || {}).fields || []).find(function (f) {
+            return f.field === fds[0] && f.type === 'table';
+          });
+          (fdt && fdt.sub_values || []).forEach(function (svv) {
+            if (svv && svv[fds[1]] && svv[fds[1]] !== '') {
+              subs.push(svv[fds[1]]);
+              subs.push(separator);
+            }
+          });
+        }
+      } else {
+        var fd = ((layers[layer] || {}).fields || []).find(function (f) {
+          return f.field === field;
+        });
+
+        if (fd && fd.value && fd.value !== '') {
+          subs.push(fd.value);
+          subs.push(separator);
+        }
+      }
+    }
+
+    return true;
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, {
+    className: "text_generic_properties"
+  }, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "text",
+    value: subs.join(''),
+    className: "readonly",
+    readOnly: true,
+    required: false
+  }));
+};
+
+exports.GenTextFormula = GenTextFormula;
+
+var renderListGroupItem = function renderListGroupItem(opt, attachment) {
+  var delBtn = /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    bsSize: "xsmall",
+    id: attachment.uid,
+    className: "button-right",
+    onClick: function onClick() {
+      return opt.onChange(_objectSpread(_objectSpread({}, opt.value), {}, {
+        action: 'd',
+        uid: attachment.uid
+      }));
+    }
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fa fa-times",
+    "aria-hidden": "true"
+  }));
+
+  var filename = attachment.aid ? /*#__PURE__*/_react.default.createElement("a", {
+    onClick: function onClick() {
+      return (0, _utils.downloadFile)({
+        contents: "/api/v1/attachments/".concat(attachment.aid),
+        name: attachment.filename
+      });
+    },
+    style: {
+      cursor: 'pointer'
+    }
+  }, attachment.filename) : attachment.filename;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "generic_grid"
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", null, delBtn), /*#__PURE__*/_react.default.createElement("div", {
+    className: "generic_grid_row"
+  }, filename), /*#__PURE__*/_react.default.createElement("div", {
+    className: "generic_grid_row"
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, {
+    bsSize: "small"
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl, {
+    type: "text",
+    value: attachment.label || '',
+    onChange: function onChange(e) {
+      return opt.onChange(_objectSpread(_objectSpread({}, opt.value), {}, {
+        action: 'l',
+        uid: attachment.uid,
+        val: e
+      }));
+    }
+  })))));
+};
+
+var GenPropertiesUpload = function GenPropertiesUpload(opt) {
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  var attachments = opt.value && opt.value.files || [];
+  if (opt.isSearchCriteria) return /*#__PURE__*/_react.default.createElement("div", null, "(This is an upload)");
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, {
+    className: "text_generic_properties"
+  }, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormControl.Static, {
+    style: {
+      paddingBottom: '0px'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_reactDropzone.default, {
+    id: "dropzone",
+    onDrop: function onDrop(e) {
+      return opt.onChange(_objectSpread(_objectSpread({}, opt.value), {}, {
+        action: 'f',
+        val: e
+      }));
+    },
+    style: {
+      height: 30,
+      width: '100%',
+      border: '3px dashed lightgray'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      textAlign: 'center',
+      paddingTop: 6,
+      color: 'gray'
+    }
+  }, "Drop File, or Click to Select."))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.ListGroup, null, attachments.map(function (attachment) {
+    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.ListGroupItem, {
+      key: attachment.id,
+      className: "generic_files"
+    }, renderListGroupItem(opt, attachment));
+  })));
+};
+
+exports.GenPropertiesUpload = GenPropertiesUpload;
+
+var GenWFNext = function GenWFNext(opt) {
+  var options = (opt.f_obj.wf_options || []).map(function (op) {
+    var label = op.label.match(/(.*)\(.*\)/);
+    return {
+      value: op.key,
+      name: op.key,
+      label: label[1] === '' ? label[0] : label[1]
+    };
+  });
+  var className = opt.isEditable ? 'select_generic_properties_editable' : 'select_generic_properties_readonly';
+  className = opt.isRequired && opt.isEditable ? 'select_generic_properties_required' : className;
+  className = "".concat(className, " status-select");
+  var fieldHeader = opt.label === '' ? null : /*#__PURE__*/_react.default.createElement(_FieldLabel.default, {
+    label: opt.label,
+    desc: opt.description
+  });
+  var val = options.find(function (o) {
+    return o.value === opt.value;
+  }) || null;
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.FormGroup, null, fieldHeader, /*#__PURE__*/_react.default.createElement(_reactSelect.default, {
+    menuContainerStyle: {
+      position: 'absolute'
+    },
+    name: opt.field,
+    multi: false,
+    options: options,
+    value: val,
+    onChange: opt.onChange,
+    className: className,
+    disabled: opt.readOnly
+  }));
+};
+
+exports.GenWFNext = GenWFNext;