@fileverse-dev/fortune-react 1.1.94 → 1.1.96

package/es/components/DataVerification/DropdownOption.js

@@ -242,7 +242,7 @@ var DynamicInputList = function DynamicInputList(_a) {
         return handleChange(index, e.target.value);
       },
       "aria-label": "Option ".concat(index + 1)
-    })), /*#__PURE__*/React.createElement(IconButton, {
+    })), optionItems.length > 1 && (/*#__PURE__*/React.createElement(IconButton, {
       icon: "Trash2",
       type: "button",
       variant: "ghost",
@@ -252,9 +252,9 @@ var DynamicInputList = function DynamicInputList(_a) {
       className: "",
       "aria-label": "Delete row ".concat(index + 1),
       title: "Delete"
-    }));
+    })));
   })), /*#__PURE__*/React.createElement("div", {
-    className: "mt-8"
+    className: ""
   }, /*#__PURE__*/React.createElement(Button, {
     variant: "secondary",
     onClick: handleAdd,

package/es/components/DataVerification/index.js

@@ -62,9 +62,7 @@ var DataVerification = function DataVerification() {
     var selectRow = (_c = (_b = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.row) === null || _c === void 0 ? void 0 : _c[0];
     var selectCol = (_f = (_e = (_d = context.luckysheet_select_save) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.column) === null || _f === void 0 ? void 0 : _f[0];
     var sheetIndex = getSheetIndex();
-    console.log('sheetIndex', sheetIndex);
     var dataVerificationInfo = (_h = (_g = context.luckysheetfile[sheetIndex]) === null || _g === void 0 ? void 0 : _g.dataVerification) !== null && _h !== void 0 ? _h : {};
-    console.log('dataVerificationInfo', dataVerificationInfo);
     if (!dataVerificationInfo) return;
     var value = (_j = dataVerificationInfo === null || dataVerificationInfo === void 0 ? void 0 : dataVerificationInfo["".concat(selectRow, "_").concat(selectCol)]) === null || _j === void 0 ? void 0 : _j.value1;
     var color = (_k = dataVerificationInfo === null || dataVerificationInfo === void 0 ? void 0 : dataVerificationInfo["".concat(selectRow, "_").concat(selectCol)]) === null || _k === void 0 ? void 0 : _k.color;
@@ -220,7 +218,11 @@ var DataVerification = function DataVerification() {
   return /*#__PURE__*/React.createElement("div", {
     id: "fortune-data-verification"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-4"
+    className: "flex flex-col gap-4",
+    style: {
+      width: "345px",
+      padding: "16px"
+    }
   }, /*#__PURE__*/React.createElement("div", {
     className: "flex flex-col"
   }, /*#__PURE__*/React.createElement("div", {
@@ -417,16 +419,13 @@ var DataVerification = function DataVerification() {
   }))))), /*#__PURE__*/React.createElement(Divider, {
     className: "w-full border-t-[1px] my-4"
   }), /*#__PURE__*/React.createElement("div", {
-    className: "flex gap-2 justify-between items-center"
-  }, /*#__PURE__*/React.createElement(Button, {
-    variant: "secondary",
+    className: "flex gap-2 justify-between items-center",
     style: {
-      minWidth: "80px"
-    },
-    onClick: function onClick() {
-      btn("close");
+      width: "345px",
+      paddingRight: "16px",
+      justifyContent: "flex-end"
     }
-  }, button.cancel), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "flex gap-2"
   }, /*#__PURE__*/React.createElement(Button, {
     variant: "secondary",

package/es/components/Toolbar/dataVerificationPortal.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+declare const DataVerificationPortal: ({ visible }: {
+    visible: boolean;
+}) => React.ReactPortal | null;
+export default DataVerificationPortal;

package/es/components/Toolbar/dataVerificationPortal.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { createPortal } from "react-dom";
+import DataVerification from "../DataVerification";
+var DataVerificationPortal = function DataVerificationPortal(_a) {
+  var visible = _a.visible;
+  var container = document.getElementById("placeholder-data-verification");
+  if (!visible || !container) return null;
+  return /*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(DataVerification, null), container);
+};
+export default DataVerificationPortal;

package/es/components/Toolbar/index.js

@@ -123,8 +123,9 @@ var __spreadArray = this && this.__spreadArray || function (to, from, pack) {
   return to.concat(ar || Array.prototype.slice.call(from));
 };
 import React, { useContext, useCallback, useRef, useEffect, useState } from "react";
-import ReactDOM from 'react-dom/client';
+import DataVerificationPortal from "./dataVerificationPortal";
 import { toolbarItemClickHandler, handleTextBackground, handleTextColor, handleTextSize, normalizedCellAttr, getFlowdata, newComment, editComment, deleteComment, showHideComment, showHideAllComments, autoSelectionFormula, handleSum, locale, handleMerge, handleBorder, toolbarItemSelectedFunc, handleFreeze, insertImage, showImgChooser, updateFormat, handleSort, handleHorizontalAlign, handleVerticalAlign, handleScreenShot, createFilter, clearFilter, applyLocation, insertDuneChart } from "@fileverse-dev/fortune-core";
+import { setSelection, getSelection } from "@fileverse-dev/fortune-core/lib/api";
 import _ from "lodash";
 import { IconButton, LucideIcon, Tooltip, Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from "@fileverse/ui";
 import WorkbookContext from "../../context";
@@ -137,7 +138,6 @@ import SVGIcon from "../SVGIcon";
 import { useDialog } from "../../hooks/useDialog";
 import { SplitColumn } from "../SplitColumn";
 import { LocationCondition } from "../LocationCondition";
-import DataVerification from "../DataVerification";
 import ConditionalFormat from "../ConditionFormat";
 import CustomButton from "./CustomButton";
 import { CustomColor } from "./CustomColor";
@@ -585,6 +585,9 @@ var Toolbar = function Toolbar(_a) {
       }
     }
   }, [itemLocations, setMoreItems, settings.toolbarItems.length, sheetWidth, isDesktop]);
+  var _o = useState(false),
+    showDataValidation = _o[0],
+    setShowDataValidation = _o[1];
   var getToolbarItem = useCallback(function (name, i) {
     var _a, _b, _c, _d, _e, _f, _g;
     var tooltip = toolbar[name];
@@ -961,24 +964,31 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "dataVerification") {
-      return /*#__PURE__*/React.createElement(Button, {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DataVerificationPortal, {
+        visible: showDataValidation
+      }), /*#__PURE__*/React.createElement(Button, {
         iconId: name,
         tooltip: tooltip,
         key: name,
         onClick: function onClick() {
           var _a;
+          var selection = getSelection(context);
+          if (!selection) {
+            setContext(function (ctx) {
+              setSelection(ctx, [{
+                row: [0, 0],
+                column: [0, 0]
+              }], {
+                id: context.currentSheetId
+              });
+            });
+          }
           (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
           setTimeout(function () {
-            var target = document.getElementById('placeholder-data-validation');
-            console.log("Target for DataValidation:", target);
-            console.log("DataValidationComponent:", DataVerification);
-            if (target) {
-              var root = ReactDOM.createRoot(target);
-              root.render(/*#__PURE__*/React.createElement(DataVerification, null));
-            }
+            setShowDataValidation(true);
           }, 100);
         }
-      });
+      }));
     }
     if (name === "locationCondition") {
       var items_3 = [{

package/es/components/Workbook/api.d.ts

@@ -4,7 +4,6 @@ import { SetContextOptions } from "../../context";
 export declare function generateAPIs(context: Context, setContext: (recipe: (ctx: Context) => void, options?: SetContextOptions) => void, handleUndo: () => void, handleRedo: () => void, settings: Required<Settings>, cellInput: HTMLDivElement | null, scrollbarX: HTMLDivElement | null, scrollbarY: HTMLDivElement | null, globalCache: GlobalCache | null): {
     applyOp: (ops: Op[]) => void;
     getCryptoPrice: typeof getCryptoPrice;
-    DataVerificationComponent: import("react").FC<{}>;
     getCellValue: (row: number, column: number, options?: api.CommonOptions & {
         type?: keyof Cell;
     }) => any;

package/es/components/Workbook/api.js

@@ -9,7 +9,6 @@ var __assign = this && this.__assign || function () {
   return __assign.apply(this, arguments);
 };
 import { addSheet, api, deleteRowCol, deleteSheet, insertRowCol, opToPatch, createFilterOptions, getSheetIndex, locale, setCaretPosition, newComment } from "@fileverse-dev/fortune-core";
-import DataVerification from "../DataVerification";
 import { applyPatches } from "immer";
 import _ from "lodash";
 import { getCryptoPrice } from "../../utils/cryptoApi";
@@ -67,7 +66,6 @@ export function generateAPIs(context, setContext, handleUndo, handleRedo, settin
       });
     },
     getCryptoPrice: getCryptoPrice,
-    DataVerificationComponent: DataVerification,
     getCellValue: function getCellValue(row, column, options) {
       if (options === void 0) {
         options = {};

package/es/components/Workbook/index.d.ts

@@ -11,7 +11,6 @@ type AdditionalProps = {
 declare const Workbook: React.ForwardRefExoticComponent<Settings & AdditionalProps & React.RefAttributes<{
     applyOp: (ops: Op[]) => void;
     getCryptoPrice: typeof getCryptoPrice;
-    DataVerificationComponent: React.FC<{}>;
     getCellValue: (row: number, column: number, options?: api.CommonOptions & {
         type?: "error" | "rt" | "f" | "m" | "v" | "mc" | "ct" | "qp" | "spl" | "bg" | "lo" | "baseValue" | "baseCurrency" | "baseCurrencyPrice" | "isDataBlockFormula" | "ps" | "hl" | keyof import("@fileverse-dev/fortune-core").CellStyle | undefined;
     }) => any;

package/lib/components/DataVerification/DropdownOption.js

@@ -249,7 +249,7 @@ var DynamicInputList = function DynamicInputList(_a) {
         return handleChange(index, e.target.value);
       },
       "aria-label": "Option ".concat(index + 1)
-    })), /*#__PURE__*/_react.default.createElement(_ui.IconButton, {
+    })), optionItems.length > 1 && (/*#__PURE__*/_react.default.createElement(_ui.IconButton, {
       icon: "Trash2",
       type: "button",
       variant: "ghost",
@@ -259,9 +259,9 @@ var DynamicInputList = function DynamicInputList(_a) {
       className: "",
       "aria-label": "Delete row ".concat(index + 1),
       title: "Delete"
-    }));
+    })));
   })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "mt-8"
+    className: ""
   }, /*#__PURE__*/_react.default.createElement(_ui.Button, {
     variant: "secondary",
     onClick: handleAdd,

package/lib/components/DataVerification/index.js

@@ -71,9 +71,7 @@ var DataVerification = function DataVerification() {
     var selectRow = (_c = (_b = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.row) === null || _c === void 0 ? void 0 : _c[0];
     var selectCol = (_f = (_e = (_d = context.luckysheet_select_save) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.column) === null || _f === void 0 ? void 0 : _f[0];
     var sheetIndex = getSheetIndex();
-    console.log('sheetIndex', sheetIndex);
     var dataVerificationInfo = (_h = (_g = context.luckysheetfile[sheetIndex]) === null || _g === void 0 ? void 0 : _g.dataVerification) !== null && _h !== void 0 ? _h : {};
-    console.log('dataVerificationInfo', dataVerificationInfo);
     if (!dataVerificationInfo) return;
     var value = (_j = dataVerificationInfo === null || dataVerificationInfo === void 0 ? void 0 : dataVerificationInfo["".concat(selectRow, "_").concat(selectCol)]) === null || _j === void 0 ? void 0 : _j.value1;
     var color = (_k = dataVerificationInfo === null || dataVerificationInfo === void 0 ? void 0 : dataVerificationInfo["".concat(selectRow, "_").concat(selectCol)]) === null || _k === void 0 ? void 0 : _k.color;
@@ -229,7 +227,11 @@ var DataVerification = function DataVerification() {
   return /*#__PURE__*/_react.default.createElement("div", {
     id: "fortune-data-verification"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "flex flex-col gap-4"
+    className: "flex flex-col gap-4",
+    style: {
+      width: "345px",
+      padding: "16px"
+    }
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "flex flex-col"
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -426,16 +428,13 @@ var DataVerification = function DataVerification() {
   }))))), /*#__PURE__*/_react.default.createElement(_ui.Divider, {
     className: "w-full border-t-[1px] my-4"
   }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "flex gap-2 justify-between items-center"
-  }, /*#__PURE__*/_react.default.createElement(_ui.Button, {
-    variant: "secondary",
+    className: "flex gap-2 justify-between items-center",
     style: {
-      minWidth: "80px"
-    },
-    onClick: function onClick() {
-      btn("close");
+      width: "345px",
+      paddingRight: "16px",
+      justifyContent: "flex-end"
     }
-  }, button.cancel), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     className: "flex gap-2"
   }, /*#__PURE__*/_react.default.createElement(_ui.Button, {
     variant: "secondary",

package/lib/components/Toolbar/dataVerificationPortal.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+declare const DataVerificationPortal: ({ visible }: {
+    visible: boolean;
+}) => React.ReactPortal | null;
+export default DataVerificationPortal;

package/lib/components/Toolbar/dataVerificationPortal.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactDom = require("react-dom");
+var _DataVerification = _interopRequireDefault(require("../DataVerification"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var DataVerificationPortal = function DataVerificationPortal(_a) {
+  var visible = _a.visible;
+  var container = document.getElementById("placeholder-data-verification");
+  if (!visible || !container) return null;
+  return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_DataVerification.default, null), container);
+};
+var _default = exports.default = DataVerificationPortal;

package/lib/components/Toolbar/index.js

@@ -6,8 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getLucideIcon = exports.default = exports.CurrencySelector = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _client = _interopRequireDefault(require("react-dom/client"));
+var _dataVerificationPortal = _interopRequireDefault(require("./dataVerificationPortal"));
 var _fortuneCore = require("@fileverse-dev/fortune-core");
+var _api = require("@fileverse-dev/fortune-core/lib/api");
 var _lodash = _interopRequireDefault(require("lodash"));
 var _ui = require("@fileverse/ui");
 var _context = _interopRequireDefault(require("../../context"));
@@ -20,7 +21,6 @@ var _SVGIcon = _interopRequireDefault(require("../SVGIcon"));
 var _useDialog = require("../../hooks/useDialog");
 var _SplitColumn = require("../SplitColumn");
 var _LocationCondition = require("../LocationCondition");
-var _DataVerification = _interopRequireDefault(require("../DataVerification"));
 var _ConditionFormat = _interopRequireDefault(require("../ConditionFormat"));
 var _CustomButton = _interopRequireDefault(require("./CustomButton"));
 var _CustomColor = require("./CustomColor");
@@ -594,6 +594,9 @@ var Toolbar = function Toolbar(_a) {
       }
     }
   }, [itemLocations, setMoreItems, settings.toolbarItems.length, sheetWidth, isDesktop]);
+  var _o = (0, _react.useState)(false),
+    showDataValidation = _o[0],
+    setShowDataValidation = _o[1];
   var getToolbarItem = (0, _react.useCallback)(function (name, i) {
     var _a, _b, _c, _d, _e, _f, _g;
     var tooltip = toolbar[name];
@@ -970,24 +973,31 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "dataVerification") {
-      return /*#__PURE__*/_react.default.createElement(_Button.default, {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dataVerificationPortal.default, {
+        visible: showDataValidation
+      }), /*#__PURE__*/_react.default.createElement(_Button.default, {
         iconId: name,
         tooltip: tooltip,
         key: name,
         onClick: function onClick() {
           var _a;
+          var selection = (0, _api.getSelection)(context);
+          if (!selection) {
+            setContext(function (ctx) {
+              (0, _api.setSelection)(ctx, [{
+                row: [0, 0],
+                column: [0, 0]
+              }], {
+                id: context.currentSheetId
+              });
+            });
+          }
           (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
           setTimeout(function () {
-            var target = document.getElementById('placeholder-data-validation');
-            console.log("Target for DataValidation:", target);
-            console.log("DataValidationComponent:", _DataVerification.default);
-            if (target) {
-              var root = _client.default.createRoot(target);
-              root.render(/*#__PURE__*/_react.default.createElement(_DataVerification.default, null));
-            }
+            setShowDataValidation(true);
           }, 100);
         }
-      });
+      }));
     }
     if (name === "locationCondition") {
       var items_3 = [{

package/lib/components/Workbook/api.d.ts

@@ -4,7 +4,6 @@ import { SetContextOptions } from "../../context";
 export declare function generateAPIs(context: Context, setContext: (recipe: (ctx: Context) => void, options?: SetContextOptions) => void, handleUndo: () => void, handleRedo: () => void, settings: Required<Settings>, cellInput: HTMLDivElement | null, scrollbarX: HTMLDivElement | null, scrollbarY: HTMLDivElement | null, globalCache: GlobalCache | null): {
     applyOp: (ops: Op[]) => void;
     getCryptoPrice: typeof getCryptoPrice;
-    DataVerificationComponent: import("react").FC<{}>;
     getCellValue: (row: number, column: number, options?: api.CommonOptions & {
         type?: keyof Cell;
     }) => any;

package/lib/components/Workbook/api.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.generateAPIs = generateAPIs;
 var _fortuneCore = require("@fileverse-dev/fortune-core");
-var _DataVerification = _interopRequireDefault(require("../DataVerification"));
 var _immer = require("immer");
 var _lodash = _interopRequireDefault(require("lodash"));
 var _cryptoApi = require("../../utils/cryptoApi");
@@ -74,7 +73,6 @@ function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cel
       });
     },
     getCryptoPrice: _cryptoApi.getCryptoPrice,
-    DataVerificationComponent: _DataVerification.default,
     getCellValue: function getCellValue(row, column, options) {
       if (options === void 0) {
         options = {};

package/lib/components/Workbook/index.d.ts

@@ -11,7 +11,6 @@ type AdditionalProps = {
 declare const Workbook: React.ForwardRefExoticComponent<Settings & AdditionalProps & React.RefAttributes<{
     applyOp: (ops: Op[]) => void;
     getCryptoPrice: typeof getCryptoPrice;
-    DataVerificationComponent: React.FC<{}>;
     getCellValue: (row: number, column: number, options?: api.CommonOptions & {
         type?: "error" | "rt" | "f" | "m" | "v" | "mc" | "ct" | "qp" | "spl" | "bg" | "lo" | "baseValue" | "baseCurrency" | "baseCurrencyPrice" | "isDataBlockFormula" | "ps" | "hl" | keyof import("@fileverse-dev/fortune-core").CellStyle | undefined;
     }) => any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fileverse-dev/fortune-react",
-  "version": "1.1.94",
+  "version": "1.1.96",
   "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.1.94",
+    "@fileverse-dev/fortune-core": "1.1.96",
     "@fileverse/ui": "^4.1.7-patch-21",
     "@tippyjs/react": "^4.2.6",
     "@types/regenerator-runtime": "^0.13.6",