@insticc/genericform 1.0.11 → 2.0.1

package/build/FormFields/CustomSearch.js

@@ -4,49 +4,66 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _semanticUiReact = require("semantic-ui-react");
+var _defaults = require("./defaults");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+/**
+ * Search-with-results. Semantic UI Search is kept — no native equivalent.
+ * onChange / handleResultSelect keep Semantic UI's own signatures because
+ * they are passed directly from the parent application's handlers.
+ */
 var CustomSearch = function CustomSearch(_ref) {
   var onChange = _ref.onChange,
     handleResultSelect = _ref.handleResultSelect,
     resultRenderer = _ref.resultRenderer,
     name = _ref.name,
     displayName = _ref.displayName,
-    value = _ref.value,
-    isLoading = _ref.isLoading,
-    options = _ref.options,
-    mainDivStyle = _ref.mainDivStyle,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? "" : _ref$value,
+    _ref$options = _ref.options,
+    options = _ref$options === void 0 ? [] : _ref$options,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    placeholder = _ref.placeholder,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required,
+    error = _ref.error,
+    _ref$tooltip = _ref.tooltip,
+    tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip,
+    _ref$showHelp = _ref.showHelp,
+    showHelp = _ref$showHelp === void 0 ? false : _ref$showHelp,
+    _ref$helpText = _ref.helpText,
+    helpText = _ref$helpText === void 0 ? "" : _ref$helpText,
+    _ref$mainDivStyle = _ref.mainDivStyle,
+    mainDivStyle = _ref$mainDivStyle === void 0 ? {} : _ref$mainDivStyle,
     _ref$labelStyle = _ref.labelStyle,
-    labelStyle = _ref$labelStyle === void 0 ? {
-      width: '161px',
-      fontSize: '10pt',
-      textAlign: 'left'
-    } : _ref$labelStyle,
-    _ref$componentStyle = _ref.componentStyle,
-    componentStyle = _ref$componentStyle === void 0 ? {
-      maxWidth: 350,
-      display: 'inline-block',
-      margin: '0 0 1em'
-    } : _ref$componentStyle;
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "searchDiv",
+    labelStyle = _ref$labelStyle === void 0 ? {} : _ref$labelStyle,
+    _ref$spanStyle = _ref.spanStyle,
+    spanStyle = _ref$spanStyle === void 0 ? {} : _ref$spanStyle,
+    _ref$inputStyle = _ref.inputStyle,
+    inputStyle = _ref$inputStyle === void 0 ? {} : _ref$inputStyle,
+    _ref$tooltipStyle = _ref.tooltipStyle,
+    tooltipStyle = _ref$tooltipStyle === void 0 ? {} : _ref$tooltipStyle;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ufg-field-group",
     id: name,
-    key: name,
     style: mainDivStyle
-  }, /*#__PURE__*/_react["default"].createElement("label", {
-    htmlFor: "form-input-" + name,
-    style: labelStyle
-  }, displayName), /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Search, {
-    style: componentStyle,
+  }, (0, _defaults.labelJsx)(name, labelStyle, displayName, required, spanStyle, showHelp, helpText), /*#__PURE__*/React.createElement(_semanticUiReact.Search, {
+    id: "form-input-".concat(name),
+    style: inputStyle,
     loading: isLoading,
-    onResultSelect: handleResultSelect,
-    onSearchChange: onChange,
+    placeholder: placeholder || displayName,
+    value: value,
     results: options,
     resultRenderer: resultRenderer,
-    value: value
-  }));
+    onResultSelect: handleResultSelect,
+    onSearchChange: onChange,
+    disabled: disabled,
+    className: error ? "error" : undefined
+  }), (0, _defaults.errorJsx)(error), (0, _defaults.tooltipJsx)(tooltip, tooltipStyle));
 };
 CustomSearch.propTypes = {
   onChange: _propTypes["default"].func.isRequired,
@@ -55,10 +72,19 @@ CustomSearch.propTypes = {
   name: _propTypes["default"].string.isRequired,
   displayName: _propTypes["default"].string,
   value: _propTypes["default"].string,
-  isLoading: _propTypes["default"].bool,
   options: _propTypes["default"].array.isRequired,
+  isLoading: _propTypes["default"].bool,
+  placeholder: _propTypes["default"].string,
+  disabled: _propTypes["default"].bool,
+  required: _propTypes["default"].bool,
+  error: _propTypes["default"].string,
+  tooltip: _propTypes["default"].string,
+  showHelp: _propTypes["default"].bool,
+  helpText: _propTypes["default"].string,
   mainDivStyle: _propTypes["default"].object,
   labelStyle: _propTypes["default"].object,
-  componentStyle: _propTypes["default"].object
+  spanStyle: _propTypes["default"].object,
+  inputStyle: _propTypes["default"].object,
+  tooltipStyle: _propTypes["default"].object
 };
 var _default = exports["default"] = CustomSearch;

package/build/FormFields/CustomSeparator.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+/**
+ * Visual separator — no interaction props.
+ */
+var CustomSeparator = function CustomSeparator(_ref) {
+  var _ref$mainDivStyle = _ref.mainDivStyle,
+    mainDivStyle = _ref$mainDivStyle === void 0 ? {} : _ref$mainDivStyle;
+  return /*#__PURE__*/_react["default"].createElement("hr", {
+    className: "ufg-separator",
+    style: mainDivStyle
+  });
+};
+CustomSeparator.propTypes = {
+  mainDivStyle: _propTypes["default"].object
+};
+var _default = exports["default"] = CustomSeparator;

package/build/FormFields/CustomTextArea.js

@@ -4,70 +4,68 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _semanticUiReact = require("semantic-ui-react");
+var _react = require("react");
+var _defaults = require("./defaults");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-var defaultStyles = {
-  mainDiv: {},
-  label: {
-    fontWeight: 'normal !important',
-    marginTop: 10,
-    width: 350,
-    fontSize: '10pt'
-  },
-  component: {
-    minWidth: 350,
-    fontSize: '16px !important',
-    height: '90%'
-  },
-  tooltip: {
-    fontSize: '11px'
-  }
-};
+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); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var CustomTextArea = function CustomTextArea(_ref) {
   var onChange = _ref.onChange,
     name = _ref.name,
     displayName = _ref.displayName,
-    value = _ref.value,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? "" : _ref$value,
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     _ref$required = _ref.required,
     required = _ref$required === void 0 ? false : _ref$required,
+    placeholder = _ref.placeholder,
+    _ref$rows = _ref.rows,
+    rows = _ref$rows === void 0 ? 10 : _ref$rows,
+    height = _ref.height,
+    error = _ref.error,
+    _ref$tooltip = _ref.tooltip,
+    tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip,
+    _ref$showHelp = _ref.showHelp,
+    showHelp = _ref$showHelp === void 0 ? false : _ref$showHelp,
+    _ref$helpText = _ref.helpText,
+    helpText = _ref$helpText === void 0 ? "" : _ref$helpText,
     _ref$mainDivStyle = _ref.mainDivStyle,
-    mainDivStyle = _ref$mainDivStyle === void 0 ? defaultStyles.mainDiv : _ref$mainDivStyle,
+    mainDivStyle = _ref$mainDivStyle === void 0 ? {} : _ref$mainDivStyle,
     _ref$labelStyle = _ref.labelStyle,
-    labelStyle = _ref$labelStyle === void 0 ? defaultStyles.label : _ref$labelStyle,
-    _ref$componentStyle = _ref.componentStyle,
-    componentStyle = _ref$componentStyle === void 0 ? defaultStyles.component : _ref$componentStyle,
+    labelStyle = _ref$labelStyle === void 0 ? {} : _ref$labelStyle,
+    _ref$spanStyle = _ref.spanStyle,
+    spanStyle = _ref$spanStyle === void 0 ? {} : _ref$spanStyle,
+    _ref$inputStyle = _ref.inputStyle,
+    inputStyle = _ref$inputStyle === void 0 ? {} : _ref$inputStyle,
     _ref$tooltipStyle = _ref.tooltipStyle,
-    tooltipStyle = _ref$tooltipStyle === void 0 ? defaultStyles.tooltip : _ref$tooltipStyle,
-    _ref$tooltip = _ref.tooltip,
-    tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip;
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "textAreaDiv",
+    tooltipStyle = _ref$tooltipStyle === void 0 ? {} : _ref$tooltipStyle;
+  var handleChange = (0, _react.useCallback)(function (e) {
+    return onChange === null || onChange === void 0 ? void 0 : onChange(name, e.target.value);
+  }, [onChange, name]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ufg-field-group",
     id: name,
-    key: name,
     style: mainDivStyle
-  }, /*#__PURE__*/_react["default"].createElement(_semanticUiReact.Form.TextArea, {
-    inline: true,
-    id: "form-input-" + name,
-    key: name,
-    style: componentStyle,
-    placeholder: displayName,
-    label: /*#__PURE__*/_react["default"].createElement("label", {
-      htmlFor: "form-input-" + name,
-      style: labelStyle
-    }, displayName),
+  }, (0, _defaults.labelJsx)(name, labelStyle, displayName, required, spanStyle, showHelp, helpText), /*#__PURE__*/React.createElement("textarea", {
+    id: "form-input-".concat(name),
     name: name,
     value: value,
-    onChange: onChange,
+    placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : displayName,
     disabled: disabled,
     required: required,
-    rows: 10
-  }), tooltip != "" ? /*#__PURE__*/_react["default"].createElement("label", {
-    style: tooltipStyle
-  }, tooltip) : null);
+    rows: rows,
+    className: "ufg-textarea".concat(error ? " error" : ""),
+    style: _objectSpread(_objectSpread({}, inputStyle), height ? {
+      height: height
+    } : {}),
+    onChange: handleChange
+  }), (0, _defaults.errorJsx)(error), (0, _defaults.tooltipJsx)(tooltip, tooltipStyle));
 };
 CustomTextArea.propTypes = {
   onChange: _propTypes["default"].func.isRequired,
@@ -76,9 +74,17 @@ CustomTextArea.propTypes = {
   value: _propTypes["default"].string,
   disabled: _propTypes["default"].bool,
   required: _propTypes["default"].bool,
+  placeholder: _propTypes["default"].string,
+  rows: _propTypes["default"].number,
+  height: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  error: _propTypes["default"].string,
+  tooltip: _propTypes["default"].string,
+  showHelp: _propTypes["default"].bool,
+  helpText: _propTypes["default"].string,
   mainDivStyle: _propTypes["default"].object,
   labelStyle: _propTypes["default"].object,
-  componentStyle: _propTypes["default"].object,
+  spanStyle: _propTypes["default"].object,
+  inputStyle: _propTypes["default"].object,
   tooltipStyle: _propTypes["default"].object
 };
 var _default = exports["default"] = CustomTextArea;

package/build/FormFields/CustomToggle.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = require("react");
+var _defaults = require("./defaults");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+/** onChange(name, value: bool) */
+var CustomToggle = function CustomToggle(_ref) {
+  var onChange = _ref.onChange,
+    name = _ref.name,
+    displayName = _ref.displayName,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? false : _ref$value,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required,
+    error = _ref.error,
+    _ref$tooltip = _ref.tooltip,
+    tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip,
+    _ref$showHelp = _ref.showHelp,
+    showHelp = _ref$showHelp === void 0 ? false : _ref$showHelp,
+    _ref$helpText = _ref.helpText,
+    helpText = _ref$helpText === void 0 ? "" : _ref$helpText,
+    _ref$mainDivStyle = _ref.mainDivStyle,
+    mainDivStyle = _ref$mainDivStyle === void 0 ? {} : _ref$mainDivStyle,
+    _ref$labelStyle = _ref.labelStyle,
+    labelStyle = _ref$labelStyle === void 0 ? {} : _ref$labelStyle,
+    _ref$spanStyle = _ref.spanStyle,
+    spanStyle = _ref$spanStyle === void 0 ? {} : _ref$spanStyle,
+    _ref$inputStyle = _ref.inputStyle,
+    inputStyle = _ref$inputStyle === void 0 ? {} : _ref$inputStyle,
+    _ref$tooltipStyle = _ref.tooltipStyle,
+    tooltipStyle = _ref$tooltipStyle === void 0 ? {} : _ref$tooltipStyle;
+  var handleClick = (0, _react.useCallback)(function () {
+    return !disabled && (onChange === null || onChange === void 0 ? void 0 : onChange(name, !value));
+  }, [onChange, name, value, disabled]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ufg-field-group",
+    id: name,
+    style: mainDivStyle
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ufg-toggle-wrapper"
+  }, (0, _defaults.labelJsx)(name, labelStyle, displayName, required, spanStyle, showHelp, helpText), /*#__PURE__*/React.createElement("div", {
+    className: "ufg-toggle-track".concat(value ? " active" : "").concat(disabled ? " disabled" : ""),
+    style: inputStyle,
+    onClick: handleClick
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ufg-toggle-thumb"
+  }))), (0, _defaults.errorJsx)(error), (0, _defaults.tooltipJsx)(tooltip, tooltipStyle));
+};
+CustomToggle.propTypes = {
+  onChange: _propTypes["default"].func.isRequired,
+  name: _propTypes["default"].string.isRequired,
+  displayName: _propTypes["default"].string,
+  value: _propTypes["default"].bool,
+  disabled: _propTypes["default"].bool,
+  required: _propTypes["default"].bool,
+  error: _propTypes["default"].string,
+  tooltip: _propTypes["default"].string,
+  showHelp: _propTypes["default"].bool,
+  helpText: _propTypes["default"].string,
+  mainDivStyle: _propTypes["default"].object,
+  labelStyle: _propTypes["default"].object,
+  spanStyle: _propTypes["default"].object,
+  inputStyle: _propTypes["default"].object,
+  tooltipStyle: _propTypes["default"].object
+};
+var _default = exports["default"] = CustomToggle;

package/build/FormFields/defaults.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.errorJsx = errorJsx;
+exports.labelJsx = labelJsx;
+exports.tooltipJsx = tooltipJsx;
+function labelJsx(name, labelStyle, displayName, required, spanStyle, showHelp, helpText) {
+  return /*#__PURE__*/React.createElement("label", {
+    className: "ufg-label",
+    htmlFor: "form-input-".concat(name),
+    style: labelStyle
+  }, displayName, required && /*#__PURE__*/React.createElement("span", {
+    className: "ufg-required",
+    style: spanStyle
+  }, " *"), showHelp && helpText && /*#__PURE__*/React.createElement("span", {
+    className: "ufg-help-icon",
+    title: helpText
+  }, " \u24D8"));
+}
+function errorJsx(error) {
+  return error && /*#__PURE__*/React.createElement("span", {
+    className: "ufg-error-message"
+  }, error);
+}
+function tooltipJsx(tooltip, tooltipStyle) {
+  return tooltip && /*#__PURE__*/React.createElement("span", {
+    className: "ufg-tooltip",
+    style: tooltipStyle
+  }, tooltip);
+}