@goldenpine/react-form-builder2 0.18.4-patch.1 → 0.20.3-build.1

package/lib/toolbar-draggable-item.js

@@ -5,56 +5,52 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
 var _reactDnd = require("react-dnd");
 var _ItemTypes = _interopRequireDefault(require("./ItemTypes"));
 var _UUID = _interopRequireDefault(require("./UUID"));
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /**
+/**
   * <ToolbarItem />
   */
-var cardSource = {
-  beginDrag: function beginDrag(props) {
-    return {
-      id: _UUID["default"].uuid(),
-      index: -1,
-      data: props.data,
-      onCreate: props.onCreate
-    };
-  }
-};
-var ToolbarItem = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2["default"])(ToolbarItem, _React$Component);
-  var _super = _createSuper(ToolbarItem);
-  function ToolbarItem() {
-    (0, _classCallCheck2["default"])(this, ToolbarItem);
-    return _super.apply(this, arguments);
-  }
-  (0, _createClass2["default"])(ToolbarItem, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        connectDragSource = _this$props.connectDragSource,
-        data = _this$props.data,
-        onClick = _this$props.onClick;
-      if (!connectDragSource) return null;
-      return connectDragSource(/*#__PURE__*/_react["default"].createElement("li", {
-        onClick: onClick
-      }, /*#__PURE__*/_react["default"].createElement("i", {
-        className: data.icon
-      }), data.name));
+
+var ToolbarItem = function ToolbarItem(_ref) {
+  var data = _ref.data,
+    onCreate = _ref.onCreate,
+    onClick = _ref.onClick;
+  // Setup drag functionality using the useDrag hook
+  var _useDrag = (0, _reactDnd.useDrag)({
+      type: _ItemTypes["default"].CARD,
+      item: function item() {
+        return {
+          id: _UUID["default"].uuid(),
+          index: -1,
+          data: data,
+          onCreate: onCreate
+        };
+      },
+      collect: function collect(monitor) {
+        return {
+          isDragging: monitor.isDragging()
+        };
+      }
+    }),
+    _useDrag2 = (0, _slicedToArray2["default"])(_useDrag, 2),
+    isDragging = _useDrag2[0].isDragging,
+    drag = _useDrag2[1];
+
+  // Apply slight opacity while dragging for better UX
+  var opacity = isDragging ? 0.5 : 1;
+  return /*#__PURE__*/_react["default"].createElement("li", {
+    ref: drag,
+    onClick: onClick,
+    style: {
+      opacity: opacity,
+      cursor: 'move'
     }
-  }]);
-  return ToolbarItem;
-}(_react["default"].Component);
-var _default = (0, _reactDnd.DragSource)(_ItemTypes["default"].CARD, cardSource, function (connect) {
-  return {
-    connectDragSource: connect.dragSource()
-  };
-})(ToolbarItem);
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: data.icon
+  }), data.name);
+};
+var _default = ToolbarItem;
 exports["default"] = _default;

package/lib/toolbar.js

@@ -459,7 +459,7 @@ var Toolbar = /*#__PURE__*/function (_React$Component) {
     key: "addCustomOptions",
     value: function addCustomOptions(item, elementOptions) {
       if (item.type === 'custom') {
-        var customOptions = Object.assign({}, item, elementOptions);
+        var customOptions = _objectSpread(_objectSpread({}, item), elementOptions);
         customOptions.custom = true;
         customOptions.component = item.component || null;
         customOptions.custom_options = item.custom_options || [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@goldenpine/react-form-builder2",
-  "version": "0.18.4-patch.1",
+  "version": "0.20.3-build.1",
   "description": "A complete form builder for react.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
@@ -27,46 +27,38 @@
     "drop"
   ],
   "engines": {
-    "node": ">=12.0.0"
+    "node": ">=18.0.0"
   },
   "author": "Kiho Chang",
-  "contributors": [
-    {
-      "name": "Zach Robichaud",
-      "email": "zach2825@gmail.com",
-      "url": "https://turtlebytes.com"
-    }
-  ],
   "dependencies": {
     "beedle": "^0.8.1",
     "classnames": "^2.2.6",
-    "cors": "^2.8.5",
     "date-fns": "^2.16.1",
     "draft-js": "^0.11.7",
-    "draftjs-to-html": "^0.9.1",
+    "draftjs-to-html": "^0.8.4",
     "es6-promise": "^4.2.8",
     "fbemitter": "^3.0.0",
     "file-saver": "^2.0.5",
     "immutability-helper": "^3.1.1",
     "isomorphic-fetch": "^3.0.0",
     "prop-types": "^15.7.2",
-    "react-bootstrap-slider": "^2.2.3",
-    "react-datepicker": "^3.4.1",
-    "react-dnd": "^11.1.3",
-    "react-dnd-html5-backend": "^11.1.3",
-    "react-draft-wysiwyg": "^1.14.7",
-    "react-intl": "^5.24.3",
-    "react-select": "^3.2.0",
-    "react-signature-canvas": "^1.0.3",
-    "react-textarea-autosize": "^7.1.2",
+    "react-bootstrap-slider": "^3.0.0",
+    "react-datepicker": "^8.3.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
+    "react-draft-wysiwyg": "^1.15.0",
+    "react-intl": "^7.1.11",
+    "react-select": "^5.10.1",
+    "react-signature-canvas": "^1.1.0-alpha.2",
+    "react-textarea-autosize": "^8.5.9",
     "xss": "^1.0.8"
   },
   "peerDependencies": {
-    "react": ">=16.8.6",
-    "react-dom": ">=16.8.6"
+    "react": ">=18.3.1",
+    "react-dom": ">=18.3.1"
   },
   "devDependencies": {
-    "@babel/cli": "^7.26.4",
+    "@babel/cli": "^7.12.10",
     "@babel/core": "^7.12.10",
     "@babel/plugin-proposal-class-properties": "^7.12.1",
     "@babel/plugin-proposal-json-strings": "^7.12.1",
@@ -74,7 +66,7 @@
     "@babel/plugin-syntax-import-meta": "^7.10.4",
     "@babel/plugin-transform-runtime": "^7.17.10",
     "@babel/preset-env": "^7.12.11",
-    "@babel/preset-react": "^7.26.3",
+    "@babel/preset-react": "^7.14.5",
     "@babel/runtime-corejs2": "^7.12.5",
     "add": "^2.0.6",
     "babel-eslint": "^10.1.0",
@@ -89,19 +81,19 @@
     "eslint-plugin-react": "^7.22.0",
     "express": "^4.17.1",
     "multer": "^1.4.2",
-    "react": "^16.14.0",
-    "react-dom": "^16.14.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "rimraf": "^3.0.2",
-    "sass": "^1.52.3",
-    "sass-loader": "^10.0.0",
-    "style-loader": "^1.3.0",
-    "webpack": "^4.46.0",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.2"
+    "sass": "^1.88.0",
+    "sass-loader": "^16.0.5",
+    "style-loader": "^4.0.0",
+    "webpack": "^5.99.8",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.1"
   },
   "scripts": {
     "build": "NODE_OPTIONS=--openssl-legacy-provider webpack --mode production --config webpack.production.config.js",
-    "build:dev": "NODE_OPTIONS=--openssl-legacy-provider webpack --mode development",
+    "build:dev": "webpack --mode development",
     "build:umd": "webpack --mode development --config webpack.production.config.js",
     "build:style": "sass ./scss/application.scss dist/app.css --style compressed",
     "build:lib": "npm run transpile && npm run build:style",
@@ -110,7 +102,7 @@
     "copy:dist": "copyfiles -f \"./dist/*\" \"./public/dist\"",
     "prepublishOnly": "npm run clean && NODE_OPTIONS=--openssl-legacy-provider npm run build:lib && NODE_OPTIONS=--openssl-legacy-provider npm run build",
     "watch": "webpack --watch",
-    "start": "NODE_OPTIONS=--openssl-legacy-provider webpack-dev-server --hot --mode development",
+    "start": "NODE_OPTIONS=--openssl-legacy-provider && webpack-dev-server --hot --mode development",
     "serve:api": "node server/index.js",
     "pretranspile": "rimraf lib",
     "transpile": "babel --out-dir lib src --copy-files"