@insticc/genericform 1.0.7 → 1.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,51 +1,71 @@
1
1
  "use strict";
2
2
 
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
7
  exports["default"] = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
7
9
  var _semanticUiReact = require("semantic-ui-react");
10
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
11
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
12
+ var defaultStyles = {
13
+ mainDiv: {},
14
+ label: {
15
+ display: "inline-block",
16
+ fontSize: "10pt",
17
+ textAlign: "center",
18
+ margin: "0 5px"
19
+ },
20
+ component: {
21
+ display: "inline-block",
22
+ margin: 0
23
+ },
24
+ tooltip: {}
25
+ };
8
26
  var CustomCheckbox = function CustomCheckbox(_ref) {
9
- var _onChange = _ref.onChange,
27
+ var onChange = _ref.onChange,
10
28
  name = _ref.name,
11
29
  displayName = _ref.displayName,
12
- checked = _ref.checked,
30
+ _ref$checked = _ref.checked,
31
+ checked = _ref$checked === void 0 ? false : _ref$checked,
13
32
  _ref$disabled = _ref.disabled,
14
33
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
15
34
  _ref$showHelp = _ref.showHelp,
16
35
  showHelp = _ref$showHelp === void 0 ? false : _ref$showHelp,
17
- _ref$helpText = _ref.helpText,
18
- helpText = _ref$helpText === void 0 ? "" : _ref$helpText,
19
- _ref$checkBoxCss = _ref.checkBoxCss,
20
- checkBoxCss = _ref$checkBoxCss === void 0 ? {
21
- display: 'inline-block',
22
- margin: '0px 0px'
23
- } : _ref$checkBoxCss,
24
- _ref$labelCss = _ref.labelCss,
25
- labelCss = _ref$labelCss === void 0 ? {
26
- display: 'inline-block',
27
- fontSize: '10pt',
28
- textAlign: 'center',
29
- margin: '0px 5px'
30
- } : _ref$labelCss;
31
- return /*#__PURE__*/React.createElement("div", {
36
+ _ref$tooltip = _ref.tooltip,
37
+ tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip,
38
+ _ref$mainDivStyle = _ref.mainDivStyle,
39
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
40
+ _ref$labelStyle = _ref.labelStyle,
41
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
42
+ _ref$componentStyle = _ref.componentStyle,
43
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle,
44
+ _ref$tooltipStyle = _ref.tooltipStyle,
45
+ tooltipStyle = _ref$tooltipStyle === void 0 ? defaultStyles.tooltip : _ref$tooltipStyle;
46
+ var handleChange = (0, _react.useCallback)(function (e, _ref2) {
47
+ var checked = _ref2.checked;
48
+ onChange === null || onChange === void 0 || onChange(name, checked);
49
+ }, [onChange, name]);
50
+ return /*#__PURE__*/_react["default"].createElement("div", {
32
51
  className: "checkboxDiv",
33
52
  id: name,
34
- key: name
35
- }, /*#__PURE__*/React.createElement(_semanticUiReact.Form.Checkbox, {
53
+ key: name,
54
+ style: mainDivStyle
55
+ }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.Checkbox, {
56
+ id: "form-input-".concat(name),
36
57
  type: "checkbox",
37
- style: checkBoxCss,
58
+ style: componentStyle,
38
59
  checked: checked,
39
- onChange: function onChange(checked) {
40
- return _onChange(name);
41
- },
60
+ onChange: handleChange,
42
61
  disabled: disabled
43
- }), /*#__PURE__*/React.createElement("label", {
62
+ }), /*#__PURE__*/_react["default"].createElement("label", {
44
63
  htmlFor: "form-input-" + name,
45
- style: labelCss
46
- }, displayName, " ", showHelp ? /*#__PURE__*/React.createElement(_semanticUiReact.Icon, {
64
+ style: labelStyle
65
+ }, displayName, " ", showHelp && tooltip && /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Icon, {
47
66
  name: "help circle",
48
- title: helpText
49
- }) : null));
67
+ title: tooltip,
68
+ style: tooltipStyle
69
+ })));
50
70
  };
51
71
  var _default = exports["default"] = CustomCheckbox;
@@ -1,29 +1,37 @@
1
1
  "use strict";
2
2
 
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
7
  exports["default"] = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
7
9
  var _reactDatetime = _interopRequireDefault(require("react-datetime"));
8
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
9
- var divStyleDefault = {
10
- display: 'flex',
11
- alignItems: 'baseline'
11
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
12
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
13
+ var defaultStyles = {
14
+ mainDiv: {
15
+ display: "flex",
16
+ alignItems: "baseline",
17
+ gap: "8px"
12
18
  },
13
- labelStyleDefault = {
14
- width: '161px',
15
- fontSize: '10pt',
16
- textAlign: 'left'
19
+ label: {
20
+ width: 160,
21
+ fontSize: "10pt",
22
+ textAlign: "left"
17
23
  },
18
- datetimeComponentStyleDefault = {
24
+ component: {
19
25
  maxWidth: 350,
20
- display: 'inline-block'
26
+ display: "inline-block"
21
27
  },
22
- tooltipStyleDefault = {
23
- fontSize: '11px'
24
- };
28
+ tooltip: {
29
+ fontSize: "11px",
30
+ color: "#666"
31
+ }
32
+ };
25
33
  var CustomDatePicker = function CustomDatePicker(_ref) {
26
- var _onChange = _ref.onChange,
34
+ var onChange = _ref.onChange,
27
35
  name = _ref.name,
28
36
  displayName = _ref.displayName,
29
37
  value = _ref.value,
@@ -34,38 +42,41 @@ var CustomDatePicker = function CustomDatePicker(_ref) {
34
42
  _ref$tooltip = _ref.tooltip,
35
43
  tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip,
36
44
  _ref$mainDivStyle = _ref.mainDivStyle,
37
- mainDivStyle = _ref$mainDivStyle === void 0 ? divStyleDefault : _ref$mainDivStyle,
45
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
38
46
  _ref$labelStyle = _ref.labelStyle,
39
- labelStyle = _ref$labelStyle === void 0 ? labelStyleDefault : _ref$labelStyle,
47
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
40
48
  _ref$componentStyle = _ref.componentStyle,
41
- componentStyle = _ref$componentStyle === void 0 ? datetimeComponentStyleDefault : _ref$componentStyle,
49
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle,
42
50
  _ref$tooltipStyle = _ref.tooltipStyle,
43
- tooltipStyle = _ref$tooltipStyle === void 0 ? tooltipStyleDefault : _ref$tooltipStyle,
51
+ tooltipStyle = _ref$tooltipStyle === void 0 ? defaultStyles.tooltip : _ref$tooltipStyle,
44
52
  _ref$dateFormat = _ref.dateFormat,
45
- dateFormat = _ref$dateFormat === void 0 ? "DD/MM/YYYY" : _ref$dateFormat;
46
- return /*#__PURE__*/React.createElement("div", {
53
+ dateFormat = _ref$dateFormat === void 0 ? "DD/MM/YYYY" : _ref$dateFormat,
54
+ _ref$timeFormat = _ref.timeFormat,
55
+ timeFormat = _ref$timeFormat === void 0 ? false : _ref$timeFormat;
56
+ var handleChange = (0, _react.useCallback)(function (date) {
57
+ return onChange === null || onChange === void 0 ? void 0 : onChange(date, name);
58
+ }, [onChange, name]);
59
+ return /*#__PURE__*/_react["default"].createElement("div", {
47
60
  className: "datePickerDiv",
48
61
  key: name,
49
- id: 'form-dateDiv-' + name,
62
+ id: "form-dateDiv-".concat(name),
50
63
  style: mainDivStyle
51
- }, /*#__PURE__*/React.createElement("label", {
52
- id: 'form-datelabel-' + name,
53
- htmlFor: "form-date-" + name,
64
+ }, /*#__PURE__*/_react["default"].createElement("label", {
65
+ id: "form-datelabel-".concat(name),
66
+ htmlFor: "form-date-".concat(name),
54
67
  style: labelStyle
55
- }, displayName), /*#__PURE__*/React.createElement(_reactDatetime["default"], {
56
- style: componentStyle,
57
- id: "form-date-" + name,
68
+ }, displayName), /*#__PURE__*/_react["default"].createElement(_reactDatetime["default"], {
69
+ id: "form-date-".concat(name),
58
70
  value: value,
59
71
  dateFormat: dateFormat,
60
- onChange: function onChange(date) {
61
- return _onChange(date, name);
62
- },
72
+ timeFormat: timeFormat,
73
+ onChange: handleChange,
63
74
  input: true,
64
- timeFormat: false,
65
75
  disabled: disabled,
66
- required: required
67
- }), tooltip != "" ? /*#__PURE__*/React.createElement("label", {
76
+ required: required,
77
+ style: componentStyle
78
+ }), tooltip && /*#__PURE__*/_react["default"].createElement("label", {
68
79
  style: tooltipStyle
69
- }, tooltip) : null);
80
+ }, tooltip));
70
81
  };
71
82
  var _default = exports["default"] = CustomDatePicker;
@@ -16,37 +16,42 @@ var CustomInput = function CustomInput(_ref) {
16
16
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
17
17
  _ref$required = _ref.required,
18
18
  required = _ref$required === void 0 ? false : _ref$required,
19
- _ref$style = _ref.style,
20
- style = _ref$style === void 0 ? null : _ref$style,
21
- _ref$inputStyle = _ref.inputStyle,
22
- inputStyle = _ref$inputStyle === void 0 ? null : _ref$inputStyle,
19
+ _ref$mainDivStyle = _ref.mainDivStyle,
20
+ mainDivStyle = _ref$mainDivStyle === void 0 ? {
21
+ marginBottom: '13px'
22
+ } : _ref$mainDivStyle,
23
+ _ref$labelStyle = _ref.labelStyle,
24
+ labelStyle = _ref$labelStyle === void 0 ? {
25
+ width: '161px',
26
+ fontSize: '10pt',
27
+ textAlign: 'left'
28
+ } : _ref$labelStyle,
29
+ _ref$spanStyle = _ref.spanStyle,
30
+ spanStyle = _ref$spanStyle === void 0 ? {
31
+ color: '#db2828',
32
+ position: 'relative',
33
+ top: '-2px'
34
+ } : _ref$spanStyle,
35
+ _ref$componentStyle = _ref.componentStyle,
36
+ componentStyle = _ref$componentStyle === void 0 ? {
37
+ minWidth: 350,
38
+ fontSize: '16px !important'
39
+ } : _ref$componentStyle,
40
+ tooltipStyle = _ref.tooltipStyle,
23
41
  className = _ref.className;
24
42
  return /*#__PURE__*/_react["default"].createElement("div", {
25
43
  className: "inputDiv",
26
44
  id: name,
27
- style: style ? style : {
28
- marginBottom: '13px'
29
- },
45
+ style: mainDivStyle,
30
46
  key: name
31
47
  }, /*#__PURE__*/_react["default"].createElement("label", {
32
48
  htmlFor: 'form-input-' + name,
33
- style: {
34
- width: '161px',
35
- fontSize: '10pt',
36
- textAlign: 'left'
37
- }
49
+ style: labelStyle
38
50
  }, displayName, " ", required && /*#__PURE__*/_react["default"].createElement("span", {
39
- style: {
40
- color: '#db2828',
41
- position: 'relative',
42
- top: '-2px'
43
- }
51
+ style: spanStyle
44
52
  }, "*")), /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.Input, {
45
53
  inline: true,
46
- style: inputStyle ? inputStyle : {
47
- minWidth: 350,
48
- fontSize: '16px !important'
49
- },
54
+ style: componentStyle,
50
55
  id: "form-input-" + name,
51
56
  placeholder: displayName,
52
57
  name: name,
@@ -9,22 +9,24 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default":
9
9
  var CustomLabel = function CustomLabel(_ref) {
10
10
  var name = _ref.name,
11
11
  displayName = _ref.displayName,
12
- _ref$style = _ref.style,
13
- style = _ref$style === void 0 ? null : _ref$style;
12
+ _ref$mainDivStyle = _ref.mainDivStyle,
13
+ mainDivStyle = _ref$mainDivStyle === void 0 ? {
14
+ marginBottom: '13px'
15
+ } : _ref$mainDivStyle,
16
+ _ref$labelStyle = _ref.labelStyle,
17
+ labelStyle = _ref$labelStyle === void 0 ? {
18
+ width: '161px',
19
+ fontSize: '10pt',
20
+ textAlign: 'left'
21
+ } : _ref$labelStyle;
14
22
  return /*#__PURE__*/_react["default"].createElement("div", {
15
23
  className: "labelDiv",
16
24
  id: name,
17
25
  key: name,
18
- style: style ? style : {
19
- marginBottom: '13px'
20
- }
26
+ style: mainDivStyle
21
27
  }, /*#__PURE__*/_react["default"].createElement("label", {
22
28
  htmlFor: 'form-input-' + name,
23
- style: {
24
- width: '161px',
25
- fontSize: '10pt',
26
- textAlign: 'left'
27
- }
29
+ style: labelStyle
28
30
  }, displayName));
29
31
  };
30
32
  var _default = exports["default"] = CustomLabel;
@@ -20,39 +20,43 @@ var CustomNumberInput = function CustomNumberInput(_ref) {
20
20
  showHelp = _ref$showHelp === void 0 ? false : _ref$showHelp,
21
21
  _ref$helpText = _ref.helpText,
22
22
  helpText = _ref$helpText === void 0 ? "" : _ref$helpText,
23
- _ref$style = _ref.style,
24
- style = _ref$style === void 0 ? null : _ref$style,
23
+ mainDivStyle = _ref.mainDivStyle,
24
+ _ref$componentStyle = _ref.componentStyle,
25
+ componentStyle = _ref$componentStyle === void 0 ? {
26
+ minWidth: 50,
27
+ fontSize: '16px !important'
28
+ } : _ref$componentStyle,
29
+ _ref$labelStyle = _ref.labelStyle,
30
+ labelStyle = _ref$labelStyle === void 0 ? {
31
+ fontWeight: 'normal !important',
32
+ marginTop: 10,
33
+ width: 150,
34
+ fontSize: '10pt'
35
+ } : _ref$labelStyle,
36
+ _ref$tooltipStyle = _ref.tooltipStyle,
37
+ tooltipStyle = _ref$tooltipStyle === void 0 ? {
38
+ fontSize: '11px'
39
+ } : _ref$tooltipStyle,
25
40
  _ref$tooltip = _ref.tooltip,
26
41
  tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip;
27
42
  return /*#__PURE__*/_react["default"].createElement("div", {
28
43
  className: "inputNumberDiv",
29
44
  id: name,
30
- key: name
31
- }, /*#__PURE__*/_react["default"].createElement("div", {
32
- style: {
33
- display: 'inline-block',
34
- margin: '0 0 1em'
35
- }
45
+ key: name,
46
+ style: mainDivStyle
36
47
  }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.Input, {
37
48
  inline: true,
38
- style: style ? style : {
39
- minWidth: 50,
40
- fontSize: '16px !important'
41
- },
49
+ style: componentStyle,
42
50
  id: "form-input-" + name,
43
51
  placeholder: name,
44
52
  type: "number",
45
53
  label: /*#__PURE__*/_react["default"].createElement("label", {
46
54
  "for": "form-input-" + name,
47
- style: {
48
- fontWeight: 'normal !important',
49
- marginTop: 10,
50
- width: 150,
51
- fontSize: '10pt'
52
- }
55
+ style: labelStyle
53
56
  }, displayName, " ", showHelp ? /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Icon, {
54
57
  name: "user circle help",
55
- title: helpText
58
+ title: helpText,
59
+ style: tooltipStyle
56
60
  }) : null),
57
61
  name: name,
58
62
  defaultValue: value,
@@ -60,9 +64,7 @@ var CustomNumberInput = function CustomNumberInput(_ref) {
60
64
  disabled: disabled,
61
65
  required: required
62
66
  }), tooltip != "" ? /*#__PURE__*/_react["default"].createElement("label", {
63
- style: {
64
- fontSize: '11px'
65
- }
66
- }, tooltip) : null));
67
+ style: tooltipStyle
68
+ }, tooltip) : null);
67
69
  };
68
70
  var _default = exports["default"] = CustomNumberInput;
@@ -16,6 +16,12 @@ var CustomRadioButton = function CustomRadioButton(_ref) {
16
16
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
17
17
  _ref$showHelp = _ref.showHelp,
18
18
  showHelp = _ref$showHelp === void 0 ? false : _ref$showHelp,
19
+ _ref$componentStyle = _ref.componentStyle,
20
+ componentStyle = _ref$componentStyle === void 0 ? {
21
+ display: 'inline-block',
22
+ margin: '0'
23
+ } : _ref$componentStyle,
24
+ tooltipStyle = _ref.tooltipStyle,
19
25
  _ref$helpText = _ref.helpText,
20
26
  helpText = _ref$helpText === void 0 ? "" : _ref$helpText;
21
27
  return /*#__PURE__*/_react["default"].createElement("div", {
@@ -23,10 +29,7 @@ var CustomRadioButton = function CustomRadioButton(_ref) {
23
29
  className: "radioButtonDiv",
24
30
  key: name
25
31
  }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.Radio, {
26
- style: {
27
- display: 'inline-block',
28
- margin: '0'
29
- },
32
+ style: componentStyle,
30
33
  label: displayName,
31
34
  name: name,
32
35
  checked: checked,
@@ -36,7 +39,8 @@ var CustomRadioButton = function CustomRadioButton(_ref) {
36
39
  disabled: disabled
37
40
  }), showHelp ? /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Icon, {
38
41
  name: "help circle",
39
- title: helpText
42
+ title: helpText,
43
+ style: tooltipStyle
40
44
  }) : null);
41
45
  };
42
46
  var _default = exports["default"] = CustomRadioButton;
@@ -15,24 +15,30 @@ var CustomSearch = function CustomSearch(_ref) {
15
15
  displayName = _ref.displayName,
16
16
  value = _ref.value,
17
17
  isLoading = _ref.isLoading,
18
- options = _ref.options;
19
- return /*#__PURE__*/_react["default"].createElement("div", {
20
- className: "searchDiv",
21
- id: name,
22
- key: name
23
- }, /*#__PURE__*/_react["default"].createElement("label", {
24
- htmlFor: "form-input-" + name,
25
- style: {
18
+ options = _ref.options,
19
+ mainDivStyle = _ref.mainDivStyle,
20
+ _ref$labelStyle = _ref.labelStyle,
21
+ labelStyle = _ref$labelStyle === void 0 ? {
26
22
  width: '161px',
27
23
  fontSize: '10pt',
28
24
  textAlign: 'left'
29
- }
30
- }, displayName), /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Search, {
31
- style: {
25
+ } : _ref$labelStyle,
26
+ _ref$componentStyle = _ref.componentStyle,
27
+ componentStyle = _ref$componentStyle === void 0 ? {
32
28
  maxWidth: 350,
33
29
  display: 'inline-block',
34
30
  margin: '0 0 1em'
35
- },
31
+ } : _ref$componentStyle;
32
+ return /*#__PURE__*/_react["default"].createElement("div", {
33
+ className: "searchDiv",
34
+ id: name,
35
+ key: name,
36
+ style: mainDivStyle
37
+ }, /*#__PURE__*/_react["default"].createElement("label", {
38
+ htmlFor: "form-input-" + name,
39
+ style: labelStyle
40
+ }, displayName), /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Search, {
41
+ style: componentStyle,
36
42
  loading: isLoading,
37
43
  onResultSelect: handleResultSelect,
38
44
  onSearchChange: onChange,
@@ -7,6 +7,23 @@ exports["default"] = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _semanticUiReact = require("semantic-ui-react");
9
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ var defaultStyles = {
11
+ mainDiv: {},
12
+ label: {
13
+ fontWeight: 'normal !important',
14
+ marginTop: 10,
15
+ width: 350,
16
+ fontSize: '10pt'
17
+ },
18
+ component: {
19
+ minWidth: 350,
20
+ fontSize: '16px !important',
21
+ height: '90%'
22
+ },
23
+ tooltip: {
24
+ fontSize: '11px'
25
+ }
26
+ };
10
27
  var CustomTextArea = function CustomTextArea(_ref) {
11
28
  var onChange = _ref.onChange,
12
29
  name = _ref.name,
@@ -16,34 +33,30 @@ var CustomTextArea = function CustomTextArea(_ref) {
16
33
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
17
34
  _ref$required = _ref.required,
18
35
  required = _ref$required === void 0 ? false : _ref$required,
19
- _ref$height = _ref.height,
20
- height = _ref$height === void 0 ? '90%' : _ref$height,
21
- _ref$style = _ref.style,
22
- style = _ref$style === void 0 ? null : _ref$style,
36
+ _ref$mainDivStyle = _ref.mainDivStyle,
37
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
38
+ _ref$labelStyle = _ref.labelStyle,
39
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
40
+ _ref$componentStyle = _ref.componentStyle,
41
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle,
42
+ _ref$tooltipStyle = _ref.tooltipStyle,
43
+ tooltipStyle = _ref$tooltipStyle === void 0 ? defaultStyles.tooltip : _ref$tooltipStyle,
23
44
  _ref$tooltip = _ref.tooltip,
24
45
  tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip;
25
46
  return /*#__PURE__*/_react["default"].createElement("div", {
26
47
  className: "textAreaDiv",
27
48
  id: name,
28
- key: name
49
+ key: name,
50
+ style: mainDivStyle
29
51
  }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.TextArea, {
30
52
  inline: true,
31
- key: name,
32
- style: style ? style : {
33
- minWidth: 350,
34
- fontSize: '16px !important',
35
- height: height
36
- },
37
53
  id: "form-input-" + name,
54
+ key: name,
55
+ style: componentStyle,
38
56
  placeholder: displayName,
39
57
  label: /*#__PURE__*/_react["default"].createElement("label", {
40
58
  htmlFor: "form-input-" + name,
41
- style: {
42
- fontWeight: 'normal !important',
43
- marginTop: 10,
44
- width: 350,
45
- fontSize: '10pt'
46
- }
59
+ style: labelStyle
47
60
  }, displayName),
48
61
  name: name,
49
62
  value: value,
@@ -52,9 +65,7 @@ var CustomTextArea = function CustomTextArea(_ref) {
52
65
  required: required,
53
66
  rows: 10
54
67
  }), tooltip != "" ? /*#__PURE__*/_react["default"].createElement("label", {
55
- style: {
56
- fontSize: '11px'
57
- }
68
+ style: tooltipStyle
58
69
  }, tooltip) : null);
59
70
  };
60
71
  var _default = exports["default"] = CustomTextArea;
@@ -7,6 +7,24 @@ exports["default"] = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _semanticUiReact = require("semantic-ui-react");
9
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ var defaultStyles = {
11
+ mainDiv: {},
12
+ label: {
13
+ width: '161px',
14
+ fontSize: '10pt',
15
+ textAlign: 'left'
16
+ },
17
+ span: {
18
+ color: '#db2828',
19
+ position: 'relative',
20
+ top: '-2px'
21
+ },
22
+ component: {
23
+ display: 'inline-block',
24
+ margin: '0'
25
+ },
26
+ tooltip: {}
27
+ };
10
28
  var MultipleCheckbox = function MultipleCheckbox(_ref) {
11
29
  var _onChange = _ref.onChange,
12
30
  name = _ref.name,
@@ -14,30 +32,26 @@ var MultipleCheckbox = function MultipleCheckbox(_ref) {
14
32
  options = _ref.options,
15
33
  _ref$required = _ref.required,
16
34
  required = _ref$required === void 0 ? false : _ref$required,
17
- _ref$divStyle = _ref.divStyle,
18
- divStyle = _ref$divStyle === void 0 ? null : _ref$divStyle,
35
+ _ref$mainDivStyle = _ref.mainDivStyle,
36
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
19
37
  _ref$labelStyle = _ref.labelStyle,
20
- labelStyle = _ref$labelStyle === void 0 ? null : _ref$labelStyle,
21
- _ref$checkboxDivStyle = _ref.checkboxDivStyle,
22
- checkboxDivStyle = _ref$checkboxDivStyle === void 0 ? null : _ref$checkboxDivStyle;
38
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
39
+ _ref$spanStyle = _ref.spanStyle,
40
+ spanStyle = _ref$spanStyle === void 0 ? defaultStyles.span : _ref$spanStyle,
41
+ _ref$componentStyle = _ref.componentStyle,
42
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle,
43
+ _ref$tooltipStyle = _ref.tooltipStyle,
44
+ tooltipStyle = _ref$tooltipStyle === void 0 ? defaultStyles.tooltip : _ref$tooltipStyle;
23
45
  return /*#__PURE__*/_react["default"].createElement("div", {
24
46
  key: name,
25
47
  id: name,
26
48
  className: "multipleCheckboxDiv",
27
- style: divStyle
49
+ style: mainDivStyle
28
50
  }, /*#__PURE__*/_react["default"].createElement("label", {
29
51
  htmlFor: 'form-input-' + name,
30
- style: labelStyle ? labelStyle : {
31
- width: '161px',
32
- fontSize: '10pt',
33
- textAlign: 'left'
34
- }
52
+ style: labelStyle
35
53
  }, displayName, " ", required && /*#__PURE__*/_react["default"].createElement("span", {
36
- style: {
37
- color: '#db2828',
38
- position: 'relative',
39
- top: '-2px'
40
- }
54
+ style: spanStyle
41
55
  }, "*")), /*#__PURE__*/_react["default"].createElement("div", {
42
56
  className: "multipleCheckboxGroupDiv"
43
57
  }, options.map(function (option, index) {
@@ -47,10 +61,7 @@ var MultipleCheckbox = function MultipleCheckbox(_ref) {
47
61
  style: checkboxDivStyle
48
62
  }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.Checkbox, {
49
63
  type: "checkbox",
50
- style: {
51
- display: 'inline-block',
52
- margin: '0'
53
- },
64
+ style: componentStyle,
54
65
  label: option.label,
55
66
  name: option.name,
56
67
  checked: option.checked,
@@ -60,7 +71,8 @@ var MultipleCheckbox = function MultipleCheckbox(_ref) {
60
71
  disabled: option.disabled
61
72
  }), option.showHelp ? /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Icon, {
62
73
  name: "help circle",
63
- title: option.helpText
74
+ title: option.helpText,
75
+ style: tooltipStyle
64
76
  }) : null);
65
77
  })));
66
78
  };
@@ -7,6 +7,9 @@ exports["default"] = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _semanticUiReact = require("semantic-ui-react");
9
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ var defaultStyles = {
11
+ mainDiv: {}
12
+ };
10
13
  var MultipleDropdown = function MultipleDropdown(_ref) {
11
14
  var onChange = _ref.onChange,
12
15
  name = _ref.name,
@@ -14,24 +17,23 @@ var MultipleDropdown = function MultipleDropdown(_ref) {
14
17
  value = _ref.value,
15
18
  _ref$disabled = _ref.disabled,
16
19
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
17
- options = _ref.options;
20
+ options = _ref.options,
21
+ _ref$mainDivStyle = _ref.mainDivStyle,
22
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
23
+ _ref$labelStyle = _ref.labelStyle,
24
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
25
+ _ref$componentStyle = _ref.componentStyle,
26
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle;
18
27
  return /*#__PURE__*/_react["default"].createElement("div", {
19
28
  className: "multipleDropdownDiv",
20
29
  id: name,
21
- key: name
30
+ key: name,
31
+ style: mainDivStyle
22
32
  }, /*#__PURE__*/_react["default"].createElement("label", {
23
33
  htmlFor: "form-input-" + name,
24
- style: {
25
- width: '161px',
26
- fontSize: '10pt',
27
- textAlign: 'left'
28
- }
34
+ style: labelStyle
29
35
  }, displayName), /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Dropdown, {
30
- style: {
31
- maxWidth: 350,
32
- display: 'inline-block',
33
- margin: '0 0 1em'
34
- },
36
+ style: componentStyle,
35
37
  placeholder: "Select " + name,
36
38
  name: name,
37
39
  fluid: true,
@@ -7,36 +7,50 @@ exports["default"] = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _semanticUiReact = require("semantic-ui-react");
9
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ var defaultStyles = {
11
+ mainDiv: {},
12
+ label: {
13
+ width: '161px',
14
+ fontSize: '10pt',
15
+ textAlign: 'left'
16
+ },
17
+ span: {
18
+ color: '#db2828',
19
+ position: 'relative',
20
+ top: '-2px'
21
+ },
22
+ component: {
23
+ display: 'inline-block',
24
+ margin: '0'
25
+ }
26
+ };
10
27
  var MultipleRadioButton = function MultipleRadioButton(_ref) {
11
28
  var _onChange = _ref.onChange,
12
29
  name = _ref.name,
13
30
  displayName = _ref.displayName,
14
- divStyle = _ref.divStyle,
15
- _ref$labelStyle = _ref.labelStyle,
16
- labelStyle = _ref$labelStyle === void 0 ? null : _ref$labelStyle,
17
31
  _ref$required = _ref.required,
18
32
  required = _ref$required === void 0 ? false : _ref$required,
19
33
  options = _ref.options,
20
34
  radioButtonDivStyle = _ref.radioButtonDivStyle,
21
- component = _ref.component;
35
+ component = _ref.component,
36
+ _ref$mainDivStyle = _ref.mainDivStyle,
37
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
38
+ _ref$labelStyle = _ref.labelStyle,
39
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
40
+ _ref$spanStyle = _ref.spanStyle,
41
+ spanStyle = _ref$spanStyle === void 0 ? defaultStyles.span : _ref$spanStyle,
42
+ _ref$componentStyle = _ref.componentStyle,
43
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle;
22
44
  return /*#__PURE__*/_react["default"].createElement("div", {
23
45
  id: name,
24
46
  className: "multipleRadioDiv",
25
47
  key: name,
26
- style: divStyle
48
+ style: mainDivStyle
27
49
  }, /*#__PURE__*/_react["default"].createElement("label", {
28
50
  htmlFor: 'form-input-' + name,
29
- style: labelStyle ? labelStyle : {
30
- width: '161px',
31
- fontSize: '10pt',
32
- textAlign: 'left'
33
- }
51
+ style: labelStyle
34
52
  }, displayName, " ", required && /*#__PURE__*/_react["default"].createElement("span", {
35
- style: {
36
- color: '#db2828',
37
- position: 'relative',
38
- top: '-2px'
39
- }
53
+ style: spanStyle
40
54
  }, "*")), /*#__PURE__*/_react["default"].createElement("div", {
41
55
  className: "multipleRadioGroupDiv",
42
56
  style: radioButtonDivStyle
@@ -45,10 +59,7 @@ var MultipleRadioButton = function MultipleRadioButton(_ref) {
45
59
  key: index,
46
60
  className: "radioButtonDiv"
47
61
  }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.Radio, {
48
- style: {
49
- display: 'inline-block',
50
- margin: '0'
51
- },
62
+ style: componentStyle,
52
63
  label: option.label,
53
64
  name: option.name,
54
65
  checked: option.checked,
@@ -8,6 +8,26 @@ var _react = _interopRequireDefault(require("react"));
8
8
  var _reactDatetime = _interopRequireDefault(require("react-datetime"));
9
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
10
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
11
+ var defaultStyles = {
12
+ mainDiv: {
13
+ display: 'flex',
14
+ alignItems: 'center'
15
+ },
16
+ label: {
17
+ width: '161px',
18
+ fontSize: '10pt',
19
+ textAlign: 'left'
20
+ },
21
+ span: {
22
+ color: '#db2828',
23
+ position: 'relative',
24
+ top: '-2px'
25
+ },
26
+ component: {
27
+ maxWidth: 350,
28
+ display: 'inline-block'
29
+ }
30
+ };
11
31
  var YearDatePicker = function YearDatePicker(_ref) {
12
32
  var _onChange = _ref.onChange,
13
33
  name = _ref.name,
@@ -17,52 +37,56 @@ var YearDatePicker = function YearDatePicker(_ref) {
17
37
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
18
38
  _ref$required = _ref.required,
19
39
  required = _ref$required === void 0 ? false : _ref$required,
20
- _ref$style = _ref.style,
21
- style = _ref$style === void 0 ? null : _ref$style,
40
+ _ref$mainDivStyle = _ref.mainDivStyle,
41
+ mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
42
+ _ref$labelStyle = _ref.labelStyle,
43
+ labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
44
+ _ref$spanStyle = _ref.spanStyle,
45
+ spanStyle = _ref$spanStyle === void 0 ? defaultStyles.span : _ref$spanStyle,
46
+ _ref$componentStyle = _ref.componentStyle,
47
+ componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle,
22
48
  _ref$currentMaxYear = _ref.currentMaxYear,
23
- currentMaxYear = _ref$currentMaxYear === void 0 ? false : _ref$currentMaxYear;
49
+ currentMaxYear = _ref$currentMaxYear === void 0 ? false : _ref$currentMaxYear,
50
+ _ref$dateFormat = _ref.dateFormat,
51
+ dateFormat = _ref$dateFormat === void 0 ? "YYYY" : _ref$dateFormat,
52
+ _ref$timeFormat = _ref.timeFormat,
53
+ timeFormat = _ref$timeFormat === void 0 ? false : _ref$timeFormat,
54
+ _ref$input = _ref.input,
55
+ input = _ref$input === void 0 ? true : _ref$input,
56
+ _ref$viewMode = _ref.viewMode,
57
+ viewMode = _ref$viewMode === void 0 ? "years" : _ref$viewMode,
58
+ _ref$minYear = _ref.minYear,
59
+ minYear = _ref$minYear === void 0 ? 2000 : _ref$minYear,
60
+ _ref$placeholder = _ref.placeholder,
61
+ placeholder = _ref$placeholder === void 0 ? "Select year" : _ref$placeholder;
24
62
  return /*#__PURE__*/_react["default"].createElement("div", {
25
63
  className: "yearDateDiv",
26
64
  key: name,
27
65
  id: 'form-dateYearDiv-' + name,
28
- style: style ? style : {
29
- display: 'flex',
30
- alignItems: 'center'
31
- }
66
+ style: mainDivStyle
32
67
  }, /*#__PURE__*/_react["default"].createElement("label", {
33
68
  id: 'form-dateYearlabel-' + name,
34
69
  htmlFor: "form-dateYear-" + name,
35
- style: {
36
- width: '161px',
37
- fontSize: '10pt',
38
- textAlign: 'left'
39
- }
70
+ style: labelStyle
40
71
  }, displayName, " ", required && /*#__PURE__*/_react["default"].createElement("span", {
41
- style: {
42
- color: '#db2828',
43
- position: 'relative',
44
- top: '-2px'
45
- }
72
+ style: spanStyle
46
73
  }, "*")), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_reactDatetime["default"], {
47
- style: {
48
- maxWidth: 350,
49
- display: 'inline-block'
50
- },
74
+ style: componentStyle,
51
75
  id: "form-dateYear-" + name,
52
76
  value: value,
53
- dateFormat: "YYYY",
54
- timeFormat: false,
55
- input: true,
77
+ dateFormat: dateFormat,
78
+ timeFormat: timeFormat,
79
+ input: input,
56
80
  onChange: function onChange(date) {
57
81
  return _onChange(date, name);
58
82
  },
59
- viewMode: "years",
83
+ viewMode: viewMode,
60
84
  disabled: disabled,
61
85
  isValidDate: function isValidDate(current) {
62
86
  if (currentMaxYear) {
63
87
  var year = current.year();
64
88
  var currentYear = new Date().getFullYear();
65
- return year >= 2000 && year <= currentYear;
89
+ return year >= minYear && year <= currentYear;
66
90
  }
67
91
  return true;
68
92
  },
@@ -73,7 +97,7 @@ var YearDatePicker = function YearDatePicker(_ref) {
73
97
  }));
74
98
  },
75
99
  inputProps: {
76
- placeholder: "Select year"
100
+ placeholder: placeholder
77
101
  }
78
102
  })));
79
103
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@insticc/genericform",
3
- "version": "1.0.7",
3
+ "version": "1.0.9",
4
4
  "description": "a generic form with various types of fields",
5
5
  "main": "build/index.js",
6
6
  "scripts": {