@goldenpine/react-form-builder2 0.20.3-build.3 → 0.20.3-build.30

package/lib/form-elements/component-label.js

@@ -13,17 +13,30 @@ var ComponentLabel = function ComponentLabel(props) {
   if (!labelText) {
     return null;
   }
+
+  // Since we use <div> to replace <span> in the label in form-elements-edit.jsx to support multiple-line labels,
+  // we need to ensure that the required label, *,  is inserted correctly.
+  // If it's simply appended the label string, it will show on a new line.
+  // The workaround is to insert it before the first closing </div> or </li> tag if it exists,
+  // so it appears at the end of the first line of the label.
+  var updatedLabel = labelText;
+  if (hasRequiredLabel) {
+    var insertSpan = '<span class="label-required" style="color:red;">*</span>';
+    var closingTagRegex = /<\/(div|li)>/i; // case-insensitive match for </div> or </li>
+
+    if (closingTagRegex.test(labelText)) {
+      updatedLabel = labelText.replace(closingTagRegex, "".concat(insertSpan, "</$1>"));
+    } else {
+      // Neither </div> nor </li> found — append at the end
+      updatedLabel = labelText + insertSpan;
+    }
+  }
   return /*#__PURE__*/_react["default"].createElement("label", {
     className: props.className || 'form-label'
   }, /*#__PURE__*/_react["default"].createElement("span", {
     dangerouslySetInnerHTML: {
-      __html: labelText
-    }
-  }), hasRequiredLabel && /*#__PURE__*/_react["default"].createElement("span", {
-    className: "label-required",
-    style: {
-      color: "red"
+      __html: updatedLabel
     }
-  }, "*"));
+  }));
 };
 var _default = exports["default"] = ComponentLabel;

package/lib/form-elements/custom-element.js

@@ -37,6 +37,7 @@ var CustomElement = /*#__PURE__*/function (_Component) {
       var props = {};
       props.name = this.props.data.field_name;
       props.defaultValue = this.props.defaultValue;
+      var labelHidden = this.props.data.labelHidden || false;
       if (this.props.mutable && this.props.data.forwardRef) {
         props.ref = this.inputField;
       }
@@ -57,10 +58,10 @@ var CustomElement = /*#__PURE__*/function (_Component) {
       }, /*#__PURE__*/_react["default"].createElement(_componentHeader["default"], this.props), bare ? /*#__PURE__*/_react["default"].createElement(Element, (0, _extends2["default"])({
         data: this.props.data
       }, this.props.data.props, props)) : /*#__PURE__*/_react["default"].createElement("div", {
-        className: "form-group"
-      }, /*#__PURE__*/_react["default"].createElement(_componentLabel["default"], (0, _extends2["default"])({
-        className: "form-label"
-      }, this.props)), /*#__PURE__*/_react["default"].createElement(Element, (0, _extends2["default"])({
+        className: "mb-3"
+      }, /*#__PURE__*/_react["default"].createElement(_componentLabel["default"], (0, _extends2["default"])({}, this.props, {
+        className: ["form-label", this.props.className, labelHidden ? "d-none" : ""].filter(Boolean).join(" ")
+      })), /*#__PURE__*/_react["default"].createElement(Element, (0, _extends2["default"])({
         data: this.props.data
       }, this.props.data.props, props))));
     }

package/lib/form-elements/date-picker.js

@@ -65,6 +65,7 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
       props.type = 'date';
       props.className = 'form-control';
       props.name = this.props.data.field_name;
+      var labelHidden = this.props.data.labelHidden || false;
       var readOnly = this.props.data.readOnly || this.props.read_only;
       var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
       var placeholderText = this.state.formatMask.toLowerCase();
@@ -80,8 +81,8 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
         className: baseClasses,
         style: _objectSpread({}, this.props.style)
       }, /*#__PURE__*/_react["default"].createElement(_componentHeader["default"], this.props), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "form-group"
-      }, /*#__PURE__*/_react["default"].createElement(_componentLabel["default"], this.props), /*#__PURE__*/_react["default"].createElement("div", null, readOnly && /*#__PURE__*/_react["default"].createElement("input", {
+        className: "mb-3"
+      }, !labelHidden && /*#__PURE__*/_react["default"].createElement(_componentLabel["default"], this.props), /*#__PURE__*/_react["default"].createElement("div", null, readOnly && /*#__PURE__*/_react["default"].createElement("input", {
         type: "text",
         name: props.name,
         ref: props.ref,