@fileverse-dev/fortune-react 1.2.3 → 1.2.5

package/es/components/DataVerification/ColorPicker.js

@@ -104,14 +104,14 @@ export var ColorSection = function ColorSection(_a) {
       title: color.name
     }));
   }), /*#__PURE__*/React.createElement("div", {
-    className: "w-full flex justify-center",
+    className: "w-full flex justify-center color-picker-reset-btn",
     onClick: function onClick() {
       onPick("228, 232, 237");
       setIsOpen(false);
     }
   }, /*#__PURE__*/React.createElement(IconButton, {
     icon: "DropletOff",
-    size: "md",
+    size: "sm",
     variant: "ghost",
     className: "color-picker-icon"
   }), /*#__PURE__*/React.createElement(Button, {

package/es/components/DataVerification/DropdownList.js

@@ -146,8 +146,15 @@ var DropDownList = function DropDownList() {
         display: isMul && selected.indexOf(v) >= 0 ? "inline" : "none"
       }
     }), v);
+  }), /*#__PURE__*/React.createElement("hr", {
+    style: {
+      border: "none",
+      height: "1px",
+      background: "hsl(var(--color-bg-default-hover, #F2F4F5))",
+      marginBottom: "4px"
+    }
   }), /*#__PURE__*/React.createElement("div", {
-    className: "w-full flex align-center",
+    className: "w-full flex align-center edit-dropdown",
     style: {
       height: "28px"
     },
@@ -159,11 +166,14 @@ var DropDownList = function DropDownList() {
     icon: "Pencil",
     size: "sm",
     variant: "ghost",
-    className: "color-picker-icon pt-2 color-picker"
+    className: "color-picker-icon color-picker edit-dropdown",
+    style: {
+      paddingTop: "0px !important"
+    }
   }), /*#__PURE__*/React.createElement(Button, {
     size: "md",
     variant: "ghost",
-    className: "color-picker-reset color-picker"
+    className: "color-picker-reset color-picker edit-dropdown"
   }, "Edit")));
 };
 export default DropDownList;

package/es/components/DataVerification/DropdownOption.js

@@ -47,7 +47,20 @@ var DynamicInputList = function DynamicInputList(_a) {
     });
   };
   useEffect(function () {
-    handleAdd();
+    if (optionItems.length === 0) {
+      var nextNum_1 = 1;
+      setOptionItems(function (prev) {
+        return __spreadArray(__spreadArray([], prev, true), [{
+          id: createId(),
+          value: "Option ".concat(nextNum_1),
+          color: "228, 232, 237"
+        }, {
+          id: createId(),
+          value: "Option ".concat(nextNum_1 + 1),
+          color: "228, 232, 237"
+        }], false);
+      });
+    }
   }, []);
   var handleRemove = function handleRemove(index) {
     setOptionItems(function (prev) {

package/es/components/DataVerification/index.css

@@ -201,6 +201,15 @@
   min-width: 100px;
 }
 
+.color-picker-reset-btn {
+    height: 30px;
+    border-radius: 6px;
+}
+
+.color-picker-reset-btn:hover {
+    background: hsl(var(--color-bg-default-hover, #F2F4F5))!important;
+}
+
 .color-picker:hover {
   background: hsl(var(--color-bg-default-hover, #F2F4F5))!important;
 }
@@ -212,15 +221,20 @@
 }
 
 .color-picker-reset {
+  height: 30px !important;
+  padding-top: 0px !important;
+  padding-bottom: 0px !important;
   min-width: 0px !important;
   padding-left: 0px !important;
   margin-left: 0px !important;
 }
 
-.color-picker-reset:hover {
-  background-color: white!important;
+.edit-dropdown {
+  height: 28px!important;
+  border-radius: 5px;
 }
 
-.color-picker-icon:hover {
-  background-color: white!important;
+.edit-dropdown:hover {
+  height: 28px!important;
+  background: hsl(var(--color-bg-default-hover, #F2F4F5))!important;
 }

package/es/components/DataVerification/index.js

@@ -215,6 +215,18 @@ var DataVerification = function DataVerification() {
       }
     });
   }, []);
+  var rangeOnClick = function rangeOnClick() {
+    var _a;
+    (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
+    hideDialog();
+    dataSelectRange("rangeTxt", context.dataVerification.dataRegulation.value1);
+  };
+  var rangeOnChange = function rangeOnChange(e) {
+    var value = e.target.value;
+    setContext(function (ctx) {
+      ctx.dataVerification.dataRegulation.rangeTxt = value;
+    });
+  };
   return /*#__PURE__*/React.createElement("div", {
     id: "fortune-data-verification"
   }, /*#__PURE__*/React.createElement("div", {
@@ -230,23 +242,19 @@ var DataVerification = function DataVerification() {
   }, dataVerification.cellRange), /*#__PURE__*/React.createElement(TextField, {
     rightIcon: /*#__PURE__*/React.createElement(LucideIcon, {
       name: "Grid2x2",
-      size: "sm"
+      size: "sm",
+      onClick: rangeOnClick,
+      onChange: rangeOnChange,
+      style: {
+        cursor: "pointer",
+        color: "#363B3F"
+      }
     }),
     "aria-hidden": "true",
     readOnly: true,
     value: (_a = context.dataVerification.dataRegulation) === null || _a === void 0 ? void 0 : _a.rangeTxt,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.dataVerification.dataRegulation.rangeTxt = value;
-      });
-    },
-    onClick: function onClick() {
-      var _a;
-      (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
-      hideDialog();
-      dataSelectRange("rangeTxt", context.dataVerification.dataRegulation.value1);
-    }
+    onChange: rangeOnChange,
+    onClick: rangeOnClick
   })), /*#__PURE__*/React.createElement("div", {
     className: "flex flex-col"
   }, /*#__PURE__*/React.createElement("div", {
@@ -299,9 +307,17 @@ var DataVerification = function DataVerification() {
   }, /*#__PURE__*/React.createElement("span", {
     className: "data-verification-checkbox-label"
   }, dataVerification.selected), /*#__PURE__*/React.createElement(TextField, {
+    onMouseDown: function onMouseDown(e) {
+      e.stopPropagation();
+      e.target.focus();
+    },
+    onKeyDown: function onKeyDown(e) {
+      e.stopPropagation();
+    },
     value: (_g = (_f = context.dataVerification) === null || _f === void 0 ? void 0 : _f.dataRegulation) === null || _g === void 0 ? void 0 : _g.value1,
     placeholder: dataVerification.placeholder2,
     onChange: function onChange(e) {
+      e.stopPropagation();
       var value = e.target.value;
       setContext(function (ctx) {
         ctx.dataVerification.dataRegulation.value1 = value;

package/es/components/SheetOverlay/ColumnHeader.js

@@ -195,15 +195,6 @@ var ColumnHeader = function ColumnHeader() {
   useEffect(function () {
     containerRef.current.scrollLeft = context.scrollLeft;
   }, [context.scrollLeft]);
-  var _h = useState(0),
-    hovered = _h[0],
-    setHovered = _h[1];
-  var onMouseMoveHideRight = useCallback(function () {
-    setHovered(-21);
-  }, []);
-  var onMouseLeaveHideRight = useCallback(function () {
-    setHovered(0);
-  }, []);
   return /*#__PURE__*/React.createElement("div", {
     ref: containerRef,
     className: "fortune-col-header",

package/lib/components/DataVerification/ColorPicker.js

@@ -112,14 +112,14 @@ var ColorSection = exports.ColorSection = function ColorSection(_a) {
       title: color.name
     }));
   }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "w-full flex justify-center",
+    className: "w-full flex justify-center color-picker-reset-btn",
     onClick: function onClick() {
       onPick("228, 232, 237");
       setIsOpen(false);
     }
   }, /*#__PURE__*/_react.default.createElement(_ui.IconButton, {
     icon: "DropletOff",
-    size: "md",
+    size: "sm",
     variant: "ghost",
     className: "color-picker-icon"
   }), /*#__PURE__*/_react.default.createElement(_ui.Button, {

package/lib/components/DataVerification/DropdownList.js

@@ -155,8 +155,15 @@ var DropDownList = function DropDownList() {
         display: isMul && selected.indexOf(v) >= 0 ? "inline" : "none"
       }
     }), v);
+  }), /*#__PURE__*/_react.default.createElement("hr", {
+    style: {
+      border: "none",
+      height: "1px",
+      background: "hsl(var(--color-bg-default-hover, #F2F4F5))",
+      marginBottom: "4px"
+    }
   }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "w-full flex align-center",
+    className: "w-full flex align-center edit-dropdown",
     style: {
       height: "28px"
     },
@@ -168,11 +175,14 @@ var DropDownList = function DropDownList() {
     icon: "Pencil",
     size: "sm",
     variant: "ghost",
-    className: "color-picker-icon pt-2 color-picker"
+    className: "color-picker-icon color-picker edit-dropdown",
+    style: {
+      paddingTop: "0px !important"
+    }
   }), /*#__PURE__*/_react.default.createElement(_ui.Button, {
     size: "md",
     variant: "ghost",
-    className: "color-picker-reset color-picker"
+    className: "color-picker-reset color-picker edit-dropdown"
   }, "Edit")));
 };
 var _default = exports.default = DropDownList;

package/lib/components/DataVerification/DropdownOption.js

@@ -54,7 +54,20 @@ var DynamicInputList = function DynamicInputList(_a) {
     });
   };
   (0, _react.useEffect)(function () {
-    handleAdd();
+    if (optionItems.length === 0) {
+      var nextNum_1 = 1;
+      setOptionItems(function (prev) {
+        return __spreadArray(__spreadArray([], prev, true), [{
+          id: createId(),
+          value: "Option ".concat(nextNum_1),
+          color: "228, 232, 237"
+        }, {
+          id: createId(),
+          value: "Option ".concat(nextNum_1 + 1),
+          color: "228, 232, 237"
+        }], false);
+      });
+    }
   }, []);
   var handleRemove = function handleRemove(index) {
     setOptionItems(function (prev) {

package/lib/components/DataVerification/index.css

@@ -201,6 +201,15 @@
   min-width: 100px;
 }
 
+.color-picker-reset-btn {
+    height: 30px;
+    border-radius: 6px;
+}
+
+.color-picker-reset-btn:hover {
+    background: hsl(var(--color-bg-default-hover, #F2F4F5))!important;
+}
+
 .color-picker:hover {
   background: hsl(var(--color-bg-default-hover, #F2F4F5))!important;
 }
@@ -212,15 +221,20 @@
 }
 
 .color-picker-reset {
+  height: 30px !important;
+  padding-top: 0px !important;
+  padding-bottom: 0px !important;
   min-width: 0px !important;
   padding-left: 0px !important;
   margin-left: 0px !important;
 }
 
-.color-picker-reset:hover {
-  background-color: white!important;
+.edit-dropdown {
+  height: 28px!important;
+  border-radius: 5px;
 }
 
-.color-picker-icon:hover {
-  background-color: white!important;
+.edit-dropdown:hover {
+  height: 28px!important;
+  background: hsl(var(--color-bg-default-hover, #F2F4F5))!important;
 }

package/lib/components/DataVerification/index.js

@@ -224,6 +224,18 @@ var DataVerification = function DataVerification() {
       }
     });
   }, []);
+  var rangeOnClick = function rangeOnClick() {
+    var _a;
+    (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
+    hideDialog();
+    dataSelectRange("rangeTxt", context.dataVerification.dataRegulation.value1);
+  };
+  var rangeOnChange = function rangeOnChange(e) {
+    var value = e.target.value;
+    setContext(function (ctx) {
+      ctx.dataVerification.dataRegulation.rangeTxt = value;
+    });
+  };
   return /*#__PURE__*/_react.default.createElement("div", {
     id: "fortune-data-verification"
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -239,23 +251,19 @@ var DataVerification = function DataVerification() {
   }, dataVerification.cellRange), /*#__PURE__*/_react.default.createElement(_ui.TextField, {
     rightIcon: /*#__PURE__*/_react.default.createElement(_ui.LucideIcon, {
       name: "Grid2x2",
-      size: "sm"
+      size: "sm",
+      onClick: rangeOnClick,
+      onChange: rangeOnChange,
+      style: {
+        cursor: "pointer",
+        color: "#363B3F"
+      }
     }),
     "aria-hidden": "true",
     readOnly: true,
     value: (_a = context.dataVerification.dataRegulation) === null || _a === void 0 ? void 0 : _a.rangeTxt,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.dataVerification.dataRegulation.rangeTxt = value;
-      });
-    },
-    onClick: function onClick() {
-      var _a;
-      (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
-      hideDialog();
-      dataSelectRange("rangeTxt", context.dataVerification.dataRegulation.value1);
-    }
+    onChange: rangeOnChange,
+    onClick: rangeOnClick
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: "flex flex-col"
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -308,9 +316,17 @@ var DataVerification = function DataVerification() {
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "data-verification-checkbox-label"
   }, dataVerification.selected), /*#__PURE__*/_react.default.createElement(_ui.TextField, {
+    onMouseDown: function onMouseDown(e) {
+      e.stopPropagation();
+      e.target.focus();
+    },
+    onKeyDown: function onKeyDown(e) {
+      e.stopPropagation();
+    },
     value: (_g = (_f = context.dataVerification) === null || _f === void 0 ? void 0 : _f.dataRegulation) === null || _g === void 0 ? void 0 : _g.value1,
     placeholder: dataVerification.placeholder2,
     onChange: function onChange(e) {
+      e.stopPropagation();
       var value = e.target.value;
       setContext(function (ctx) {
         ctx.dataVerification.dataRegulation.value1 = value;

package/lib/components/SheetOverlay/ColumnHeader.js

@@ -204,15 +204,6 @@ var ColumnHeader = function ColumnHeader() {
   (0, _react.useEffect)(function () {
     containerRef.current.scrollLeft = context.scrollLeft;
   }, [context.scrollLeft]);
-  var _h = (0, _react.useState)(0),
-    hovered = _h[0],
-    setHovered = _h[1];
-  var onMouseMoveHideRight = (0, _react.useCallback)(function () {
-    setHovered(-21);
-  }, []);
-  var onMouseLeaveHideRight = (0, _react.useCallback)(function () {
-    setHovered(0);
-  }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
     ref: containerRef,
     className: "fortune-col-header",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fileverse-dev/fortune-react",
-  "version": "1.2.3",
+  "version": "1.2.5",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "module": "es/index.js",
@@ -16,7 +16,7 @@
     "tsc": "tsc"
   },
   "dependencies": {
-    "@fileverse-dev/fortune-core": "1.2.3",
+    "@fileverse-dev/fortune-core": "1.2.5",
     "@fileverse/ui": "^4.1.7-patch-21",
     "@tippyjs/react": "^4.2.6",
     "@types/regenerator-runtime": "^0.13.6",