@fileverse-dev/fortune-react 1.3.12-mixed-a → 1.3.13-create-1

package/lib/components/SheetOverlay/FormulaSearch/index.d.ts

@@ -1,4 +1,6 @@
 import React from "react";
 import "./index.css";
-declare const FormulaSearch: React.FC<React.HTMLAttributes<HTMLDivElement>>;
+declare const FormulaSearch: React.FC<React.HTMLAttributes<HTMLDivElement> & {
+    from?: string;
+}>;
 export default FormulaSearch;

package/lib/components/SheetOverlay/FormulaSearch/index.js

@@ -23,11 +23,21 @@ var __assign = void 0 && (void 0).__assign || function () {
   };
   return __assign.apply(this, arguments);
 };
-var FormulaSearch = function FormulaSearch(props) {
-  var _a;
-  var _b = (0, _react.useContext)(_context.default),
-    context = _b.context,
-    isAuthorized = _b.settings.isAuthorized;
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var FormulaSearch = function FormulaSearch(_a) {
+  var _b, _c, _d;
+  var from = _a.from,
+    divProps = __rest(_a, ["from"]);
+  var _e = (0, _react.useContext)(_context.default),
+    context = _e.context,
+    isAuthorized = _e.settings.isAuthorized;
   var authedFunction = ["COINGECKO", "ETHERSCAN", "DEFILLAMA", "GNOSIS", "BASE", "EOA", "PNL", "SAFE", "BLOCKSCOUT", "LENS", "FARCASTER", "Ethereum", "SMARTCONTRACT", "DUNESIM"];
   var filteredDefaultCandidates = context.defaultCandidates.filter(function (item) {
     return !authedFunction.includes(item.n);
@@ -39,39 +49,58 @@ var FormulaSearch = function FormulaSearch(props) {
   var finalFunctionCandidates = isAuthorized ? context.functionCandidates : context.functionCandidates.filter(function (item) {
     return item.t !== 20;
   });
-  var firstSelection = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0];
+  var firstSelection = (_b = context.luckysheet_select_save) === null || _b === void 0 ? void 0 : _b[0];
+  var cellHeightPx = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) != null ? Number(firstSelection.height_move) : 24;
+  var belowCellTop = cellHeightPx + 4;
   var hintRef = (0, _react.useRef)(null);
-  var _c = (0, _react.useState)(0),
-    top = _c[0],
-    setTop = _c[1];
-  var calcuatePopUpPlacement = function calcuatePopUpPlacement() {
-    var _a, _b, _c, _d, _e, _f;
-    if (!((_a = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top) === null || _a === void 0 ? void 0 : _a.toString()) || !((_b = firstSelection.height_move) === null || _b === void 0 ? void 0 : _b.toString()) || !hintRef.current) return;
-    var hintHeight = 360;
-    var inputBoxTop = parseInt(((_c = document.getElementById("luckysheet-input-box")) === null || _c === void 0 ? void 0 : _c.style.top) || "0", 10) - 85;
-    var inputBottom = inputBoxTop + firstSelection.height_move;
-    var availableBelow = window.innerHeight - inputBottom;
-    var hintAbove = hintHeight > availableBelow;
-    var selectionHeight = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0;
-    var divOffset = ((_d = hintRef.current) === null || _d === void 0 ? void 0 : _d.offsetHeight) || 0;
-    var topV = hintAbove ? selectionHeight - (divOffset + 80) : selectionHeight + 4;
-    var el = (_e = document.getElementsByClassName("fx-hint")) === null || _e === void 0 ? void 0 : _e[0];
-    if (el && ((_f = el === null || el === void 0 ? void 0 : el.style) === null || _f === void 0 ? void 0 : _f.display) !== "none") {
+  var _f = (0, _react.useState)(belowCellTop),
+    top = _f[0],
+    setTop = _f[1];
+  var applyPlacement = (0, _react.useCallback)(function () {
+    var _a;
+    if ((firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top) == null || firstSelection.height_move == null) {
+      setTop(belowCellTop);
+      return;
+    }
+    var fromFx = from === "fx";
+    var cellH = Number(firstSelection.height_move) || cellHeightPx;
+    if (fromFx) {
+      setTop(25);
+      return;
+    }
+    var innerEl = hintRef.current;
+    var popupHeight = Math.min((innerEl === null || innerEl === void 0 ? void 0 : innerEl.offsetHeight) || 360, 360);
+    var inputBox = document.getElementById("luckysheet-input-box");
+    var rect = inputBox === null || inputBox === void 0 ? void 0 : inputBox.getBoundingClientRect();
+    if (!rect) {
+      setTop(cellH + 4);
+      return;
+    }
+    var cellBottomViewport = rect.top + cellH;
+    var availableBelow = window.innerHeight - cellBottomViewport - 12;
+    var preferBelow = popupHeight <= availableBelow;
+    var topV = preferBelow ? cellH + 4 : -(popupHeight + 8);
+    var fxHint = (_a = document.getElementsByClassName("fx-hint")) === null || _a === void 0 ? void 0 : _a[0];
+    if (fxHint && fxHint.style.display !== "none") {
       topV = 25;
     }
     setTop(topV);
-  };
-  (0, _react.useEffect)(function () {
-    calcuatePopUpPlacement();
-  });
+  }, [belowCellTop, cellHeightPx, firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move, firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top, from]);
+  (0, _react.useLayoutEffect)(function () {
+    applyPlacement();
+    var id = requestAnimationFrame(applyPlacement);
+    return function () {
+      cancelAnimationFrame(id);
+    };
+  }, [applyPlacement, (_c = context.defaultCandidates) === null || _c === void 0 ? void 0 : _c.length, (_d = context.functionCandidates) === null || _d === void 0 ? void 0 : _d.length, context.functionHint]);
   if (_lodash.default.isEmpty(context.functionCandidates) && _lodash.default.isEmpty(context.defaultCandidates)) return null;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "flex color-border-default border flex-col luckysheet-formula-search-c-p custom-scroll ".concat((props === null || props === void 0 ? void 0 : props.from) === "fx" ? "fx-search" : "cell-search"),
+    className: "flex color-border-default border flex-col luckysheet-formula-search-c-p custom-scroll ".concat(from === "fx" ? "fx-search" : "cell-search"),
     id: "luckysheet-formula-search-c-p",
     style: {
       top: top
     }
-  }, /*#__PURE__*/_react.default.createElement("div", __assign({}, props, {
+  }, /*#__PURE__*/_react.default.createElement("div", __assign({}, divProps, {
     ref: hintRef,
     id: "luckysheet-formula-search-c",
     className: "luckysheet-formula-search-c"