@fileverse-dev/fortune-react 1.0.2-mod-71 → 1.0.2-mod-72

package/dist/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const API_KEY_PLACEHOLDER: Record<string, string>;
+export declare const COMIMG_SOON_FUNCTIONS: string[];

package/dist/index.css

@@ -1042,7 +1042,6 @@ html::-webkit-scrollbar-button {
 .luckysheet-formula-search-c
   .luckysheet-formula-search-item
   .luckysheet-formula-search-func {
-  color: #363b3f;
   font-size: 14px;
 }
 

package/dist/index.esm.css

@@ -1042,7 +1042,6 @@ html::-webkit-scrollbar-button {
 .luckysheet-formula-search-c
   .luckysheet-formula-search-item
   .luckysheet-formula-search-func {
-  color: #363b3f;
   font-size: 14px;
 }
 

package/dist/index.esm.js

@@ -3,9 +3,10 @@ import React, { useContext, useRef, useState, useMemo, useCallback, useEffect, u
 import produce, { applyPatches, enablePatches, produceWithPatches } from 'immer';
 import _ from 'lodash';
 import { Tooltip, LucideIcon, TextField, Button as Button$1, cn, IconButton, Checkbox, Divider as Divider$2, Table, TableHeader, TableRow, TableHead, TableBody, TableCell, Select as Select$1, SelectTrigger, SelectValue, SelectContent, SelectItem as SelectItem$1, Popover, PopoverTrigger, PopoverContent, RadioGroup, RadioGroupItem, Label } from '@fileverse/ui';
+import { SERVICE_API_KEY } from '@fileverse-dev/formulajs/crypto-constants';
+export * from '@fileverse-dev/formulajs/crypto-constants';
 import regeneratorRuntime from 'regenerator-runtime';
 import Tippy from '@tippyjs/react';
-export * from '@fileverse-dev/formulajs/crypto-constants';
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -795,6 +796,11 @@ var ContentEditable = function ContentEditable(_ref) {
   }));
 };
 
+var API_KEY_PLACEHOLDER = Object.fromEntries(Object.values(SERVICE_API_KEY).map(function (key) {
+  return [key, "".concat(key.replace(/_/g, " ").replace(/\bAPI\b/, "API key"))];
+}));
+var COMIMG_SOON_FUNCTIONS = ["UNISWAP", "ARTEMIS", "FIREFLY", "AAVE", "AERODOME", "PENDLE"];
+
 var FormulaSearch = function FormulaSearch(props) {
   var _context$luckysheet_s;
   var _useContext = useContext(WorkbookContext),
@@ -819,7 +825,10 @@ var FormulaSearch = function FormulaSearch(props) {
   useEffect(function () {
     calcuatePopUpPlacement();
   });
-  if (_.isEmpty(context.functionCandidates)) return null;
+  var isComingSoon = function isComingSoon(name) {
+    return COMIMG_SOON_FUNCTIONS.includes(name);
+  };
+  if (_.isEmpty(context.functionCandidates) && _.isEmpty(context.defaultCandidates)) return null;
   return /*#__PURE__*/React.createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
     ref: hintRef,
     id: "luckysheet-formula-search-c",
@@ -827,11 +836,74 @@ var FormulaSearch = function FormulaSearch(props) {
     style: {
       top: top
     }
-  }), context.functionCandidates.map(function (v, index) {
+  }), context.defaultCandidates.length > 0 && (/*#__PURE__*/React.createElement("div", {
+    style: {
+      marginBottom: "4px"
+    },
+    className: "w-full flex flex-col p-2 gap-1"
+  }, /*#__PURE__*/React.createElement("h4", {
+    className: "text-helper-sm-bold color-text-secondary"
+  }, "Onchain functions"), /*#__PURE__*/React.createElement("p", {
+    className: "text-helper-text-sm color-text-secondary"
+  }, "What is data block description lorem ipsum dolor sit"))), context.defaultCandidates.length > 0 ? (/*#__PURE__*/React.createElement(React.Fragment, null, context.defaultCandidates.slice(0, 5).map(function (v, index) {
     return /*#__PURE__*/React.createElement("div", {
       key: v.n,
       "data-func": v.n,
-      className: "luckysheet-formula-search-item ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
+      style: {
+        cursor: isComingSoon(v.n) ? "not-allowed" : "pointer"
+      },
+      className: "luckysheet-formula-search-item  ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "space-between"
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-formula-search-func ".concat(isComingSoon(v.n) ? "color-text-secondary" : "color-text-default", "  text-body-sm")
+    }, v.n), /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "end",
+        minWidth: "68px",
+        alignItems: "center",
+        gap: "6px"
+      }
+    }, v.LOGO && (/*#__PURE__*/React.createElement("img", {
+      src: v.LOGO,
+      alt: "Service Logo",
+      style: {
+        width: "16px"
+      }
+    })), v.API_KEY && (/*#__PURE__*/React.createElement(Tooltip, {
+      text: localStorage.getItem(v.API_KEY) ? "API Key added" : "API key required"
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        borderRadius: "4px",
+        backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
+        width: "16px",
+        height: "16px"
+      },
+      className: "flex justify-center"
+    }, /*#__PURE__*/React.createElement(LucideIcon, {
+      name: "Key",
+      style: {
+        color: localStorage.getItem(v.API_KEY) ? "white" : "#77818A",
+        width: "12px",
+        height: "12px"
+      }
+    })))))), /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm  ".concat(isComingSoon(v.n) ? "color-text-secondary" : "color-text-default")
+    }, isComingSoon(v.n) ? "Coming soon to dSheets" : v.d));
+  }), /*#__PURE__*/React.createElement("p", {
+    style: {
+      padding: "10px"
+    },
+    className: "text-helper-text-sm-bold color-text-secondary"
+  }, "Functions"), context.defaultCandidates.slice(5, context.defaultCandidates.length).map(function (v) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: v.n,
+      "data-func": v.n,
+      className: "luckysheet-formula-search-item"
     }, /*#__PURE__*/React.createElement("div", {
       style: {
         display: "flex",
@@ -846,13 +918,57 @@ var FormulaSearch = function FormulaSearch(props) {
         width: "68px",
         height: "20px",
         alignItems: "center",
-        gap: "4px"
+        gap: "6px"
+      }
+    }, v.LOGO && (/*#__PURE__*/React.createElement("img", {
+      src: v.LOGO,
+      alt: "Service Logo",
+      style: {
+        width: "16px"
+      }
+    })), v.API_KEY && (/*#__PURE__*/React.createElement("div", {
+      style: {
+        borderRadius: "4px",
+        backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
+        width: "16px",
+        height: "16px"
+      },
+      className: "flex justify-center"
+    }, /*#__PURE__*/React.createElement(LucideIcon, {
+      name: "Key",
+      style: {
+        color: localStorage.getItem(v.API_KEY) ? "white" : "#77818A",
+        width: "12px",
+        height: "12px"
+      }
+    }))))), /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm color-text-secondary"
+    }, v.d));
+  }))) : (/*#__PURE__*/React.createElement(React.Fragment, null, context.functionCandidates.map(function (v, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: v.n,
+      "data-func": v.n,
+      className: "luckysheet-formula-search-item ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "space-between"
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-formula-search-func color-text-default text-body-sm"
+    }, v.n), /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "end",
+        width: "68px",
+        alignItems: "center",
+        gap: "6px"
       }
     }, v.LOGO && (/*#__PURE__*/React.createElement("img", {
       src: v.LOGO,
       alt: "Service Logo",
       style: {
-        width: "20px"
+        width: "16px"
       }
     })), v.API_KEY && (/*#__PURE__*/React.createElement(Tooltip, {
       text: localStorage.getItem(v.API_KEY) ? "API Key added" : "API Key required"
@@ -874,7 +990,7 @@ var FormulaSearch = function FormulaSearch(props) {
     })))))), /*#__PURE__*/React.createElement("div", {
       className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm color-text-secondary"
     }, v.d));
-  }), /*#__PURE__*/React.createElement("hr", {
+  }))), /*#__PURE__*/React.createElement("hr", {
     className: "color-border-default mb-2 mt-4 "
   }), /*#__PURE__*/React.createElement("div", {
     style: {
@@ -1041,16 +1157,16 @@ var FormulaHint = function FormulaHint(props) {
     style: {
       display: "flex",
       justifyContent: "end",
-      width: "68px",
+      minWidth: "68px",
       height: "20px",
       alignItems: "center",
-      gap: "4px"
+      gap: "6px"
     }
   }, fn.LOGO && (/*#__PURE__*/React.createElement("img", {
     src: fn.LOGO,
     alt: "Service Logo",
     style: {
-      width: "20px"
+      width: "16px"
     }
   })), fn.API_KEY && (/*#__PURE__*/React.createElement("div", {
     style: {
@@ -1323,7 +1439,7 @@ var InputBox = function InputBox() {
     var textEditor = document.getElementById("luckysheet-rich-text-editor");
     if (!textEditor) return;
     var searchTxt = ((_getrangeseleciton = getrangeseleciton()) === null || _getrangeseleciton === void 0 ? void 0 : _getrangeseleciton.textContent) || "";
-    var deleteCount = searchTxt.length;
+    var deleteCount = searchTxt === "=" ? 0 : searchTxt.length;
     textEditor.focus();
     var selection = window.getSelection();
     if (!selection || selection.rangeCount === 0) return;
@@ -1347,6 +1463,7 @@ var InputBox = function InputBox() {
     selection.addRange(range);
     setContext(function (draftCtx) {
       draftCtx.functionCandidates = [];
+      draftCtx.defaultCandidates = [];
       draftCtx.functionHint = formulaName;
     });
   }, [setContext]);
@@ -1491,7 +1608,7 @@ var InputBox = function InputBox() {
     onKeyDown: onKeyDown,
     onPaste: onPaste,
     allowEdit: edit ? !isHidenRC : edit
-  })), (context.functionCandidates.length > 0 || context.functionHint) && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormulaSearch, {
+  })), (context.functionCandidates.length > 0 || context.functionHint || context.defaultCandidates.length > 0) && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormulaSearch, {
     onMouseOver: function onMouseOver(e) {
       if (document.getElementById("luckysheet-formula-search-c")) {
         var hoveredItem = e.target.closest(".luckysheet-formula-search-item");

package/dist/index.js

@@ -7,9 +7,9 @@ var React = require('react');
 var produce = require('immer');
 var _ = require('lodash');
 var ui = require('@fileverse/ui');
+var cryptoConstants = require('@fileverse-dev/formulajs/crypto-constants');
 var regeneratorRuntime = require('regenerator-runtime');
 var Tippy = require('@tippyjs/react');
-var cryptoConstants = require('@fileverse-dev/formulajs/crypto-constants');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -807,6 +807,11 @@ var ContentEditable = function ContentEditable(_ref) {
   }));
 };
 
+var API_KEY_PLACEHOLDER = Object.fromEntries(Object.values(cryptoConstants.SERVICE_API_KEY).map(function (key) {
+  return [key, "".concat(key.replace(/_/g, " ").replace(/\bAPI\b/, "API key"))];
+}));
+var COMIMG_SOON_FUNCTIONS = ["UNISWAP", "ARTEMIS", "FIREFLY", "AAVE", "AERODOME", "PENDLE"];
+
 var FormulaSearch = function FormulaSearch(props) {
   var _context$luckysheet_s;
   var _useContext = React.useContext(WorkbookContext),
@@ -831,7 +836,10 @@ var FormulaSearch = function FormulaSearch(props) {
   React.useEffect(function () {
     calcuatePopUpPlacement();
   });
-  if (___default['default'].isEmpty(context.functionCandidates)) return null;
+  var isComingSoon = function isComingSoon(name) {
+    return COMIMG_SOON_FUNCTIONS.includes(name);
+  };
+  if (___default['default'].isEmpty(context.functionCandidates) && ___default['default'].isEmpty(context.defaultCandidates)) return null;
   return /*#__PURE__*/React__default['default'].createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
     ref: hintRef,
     id: "luckysheet-formula-search-c",
@@ -839,11 +847,74 @@ var FormulaSearch = function FormulaSearch(props) {
     style: {
       top: top
     }
-  }), context.functionCandidates.map(function (v, index) {
+  }), context.defaultCandidates.length > 0 && (/*#__PURE__*/React__default['default'].createElement("div", {
+    style: {
+      marginBottom: "4px"
+    },
+    className: "w-full flex flex-col p-2 gap-1"
+  }, /*#__PURE__*/React__default['default'].createElement("h4", {
+    className: "text-helper-sm-bold color-text-secondary"
+  }, "Onchain functions"), /*#__PURE__*/React__default['default'].createElement("p", {
+    className: "text-helper-text-sm color-text-secondary"
+  }, "What is data block description lorem ipsum dolor sit"))), context.defaultCandidates.length > 0 ? (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, context.defaultCandidates.slice(0, 5).map(function (v, index) {
     return /*#__PURE__*/React__default['default'].createElement("div", {
       key: v.n,
       "data-func": v.n,
-      className: "luckysheet-formula-search-item ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
+      style: {
+        cursor: isComingSoon(v.n) ? "not-allowed" : "pointer"
+      },
+      className: "luckysheet-formula-search-item  ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
+    }, /*#__PURE__*/React__default['default'].createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "space-between"
+      }
+    }, /*#__PURE__*/React__default['default'].createElement("div", {
+      className: "luckysheet-formula-search-func ".concat(isComingSoon(v.n) ? "color-text-secondary" : "color-text-default", "  text-body-sm")
+    }, v.n), /*#__PURE__*/React__default['default'].createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "end",
+        minWidth: "68px",
+        alignItems: "center",
+        gap: "6px"
+      }
+    }, v.LOGO && (/*#__PURE__*/React__default['default'].createElement("img", {
+      src: v.LOGO,
+      alt: "Service Logo",
+      style: {
+        width: "16px"
+      }
+    })), v.API_KEY && (/*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
+      text: localStorage.getItem(v.API_KEY) ? "API Key added" : "API key required"
+    }, /*#__PURE__*/React__default['default'].createElement("div", {
+      style: {
+        borderRadius: "4px",
+        backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
+        width: "16px",
+        height: "16px"
+      },
+      className: "flex justify-center"
+    }, /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
+      name: "Key",
+      style: {
+        color: localStorage.getItem(v.API_KEY) ? "white" : "#77818A",
+        width: "12px",
+        height: "12px"
+      }
+    })))))), /*#__PURE__*/React__default['default'].createElement("div", {
+      className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm  ".concat(isComingSoon(v.n) ? "color-text-secondary" : "color-text-default")
+    }, isComingSoon(v.n) ? "Coming soon to dSheets" : v.d));
+  }), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      padding: "10px"
+    },
+    className: "text-helper-text-sm-bold color-text-secondary"
+  }, "Functions"), context.defaultCandidates.slice(5, context.defaultCandidates.length).map(function (v) {
+    return /*#__PURE__*/React__default['default'].createElement("div", {
+      key: v.n,
+      "data-func": v.n,
+      className: "luckysheet-formula-search-item"
     }, /*#__PURE__*/React__default['default'].createElement("div", {
       style: {
         display: "flex",
@@ -858,13 +929,57 @@ var FormulaSearch = function FormulaSearch(props) {
         width: "68px",
         height: "20px",
         alignItems: "center",
-        gap: "4px"
+        gap: "6px"
+      }
+    }, v.LOGO && (/*#__PURE__*/React__default['default'].createElement("img", {
+      src: v.LOGO,
+      alt: "Service Logo",
+      style: {
+        width: "16px"
+      }
+    })), v.API_KEY && (/*#__PURE__*/React__default['default'].createElement("div", {
+      style: {
+        borderRadius: "4px",
+        backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
+        width: "16px",
+        height: "16px"
+      },
+      className: "flex justify-center"
+    }, /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
+      name: "Key",
+      style: {
+        color: localStorage.getItem(v.API_KEY) ? "white" : "#77818A",
+        width: "12px",
+        height: "12px"
+      }
+    }))))), /*#__PURE__*/React__default['default'].createElement("div", {
+      className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm color-text-secondary"
+    }, v.d));
+  }))) : (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, context.functionCandidates.map(function (v, index) {
+    return /*#__PURE__*/React__default['default'].createElement("div", {
+      key: v.n,
+      "data-func": v.n,
+      className: "luckysheet-formula-search-item ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
+    }, /*#__PURE__*/React__default['default'].createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "space-between"
+      }
+    }, /*#__PURE__*/React__default['default'].createElement("div", {
+      className: "luckysheet-formula-search-func color-text-default text-body-sm"
+    }, v.n), /*#__PURE__*/React__default['default'].createElement("div", {
+      style: {
+        display: "flex",
+        justifyContent: "end",
+        width: "68px",
+        alignItems: "center",
+        gap: "6px"
       }
     }, v.LOGO && (/*#__PURE__*/React__default['default'].createElement("img", {
       src: v.LOGO,
       alt: "Service Logo",
       style: {
-        width: "20px"
+        width: "16px"
       }
     })), v.API_KEY && (/*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
       text: localStorage.getItem(v.API_KEY) ? "API Key added" : "API Key required"
@@ -886,7 +1001,7 @@ var FormulaSearch = function FormulaSearch(props) {
     })))))), /*#__PURE__*/React__default['default'].createElement("div", {
       className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm color-text-secondary"
     }, v.d));
-  }), /*#__PURE__*/React__default['default'].createElement("hr", {
+  }))), /*#__PURE__*/React__default['default'].createElement("hr", {
     className: "color-border-default mb-2 mt-4 "
   }), /*#__PURE__*/React__default['default'].createElement("div", {
     style: {
@@ -1053,16 +1168,16 @@ var FormulaHint = function FormulaHint(props) {
     style: {
       display: "flex",
       justifyContent: "end",
-      width: "68px",
+      minWidth: "68px",
       height: "20px",
       alignItems: "center",
-      gap: "4px"
+      gap: "6px"
     }
   }, fn.LOGO && (/*#__PURE__*/React__default['default'].createElement("img", {
     src: fn.LOGO,
     alt: "Service Logo",
     style: {
-      width: "20px"
+      width: "16px"
     }
   })), fn.API_KEY && (/*#__PURE__*/React__default['default'].createElement("div", {
     style: {
@@ -1335,7 +1450,7 @@ var InputBox = function InputBox() {
     var textEditor = document.getElementById("luckysheet-rich-text-editor");
     if (!textEditor) return;
     var searchTxt = ((_getrangeseleciton = fortuneCore.getrangeseleciton()) === null || _getrangeseleciton === void 0 ? void 0 : _getrangeseleciton.textContent) || "";
-    var deleteCount = searchTxt.length;
+    var deleteCount = searchTxt === "=" ? 0 : searchTxt.length;
     textEditor.focus();
     var selection = window.getSelection();
     if (!selection || selection.rangeCount === 0) return;
@@ -1359,6 +1474,7 @@ var InputBox = function InputBox() {
     selection.addRange(range);
     setContext(function (draftCtx) {
       draftCtx.functionCandidates = [];
+      draftCtx.defaultCandidates = [];
       draftCtx.functionHint = formulaName;
     });
   }, [setContext]);
@@ -1503,7 +1619,7 @@ var InputBox = function InputBox() {
     onKeyDown: onKeyDown,
     onPaste: onPaste,
     allowEdit: edit ? !isHidenRC : edit
-  })), (context.functionCandidates.length > 0 || context.functionHint) && (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(FormulaSearch, {
+  })), (context.functionCandidates.length > 0 || context.functionHint || context.defaultCandidates.length > 0) && (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(FormulaSearch, {
     onMouseOver: function onMouseOver(e) {
       if (document.getElementById("luckysheet-formula-search-c")) {
         var hoveredItem = e.target.closest(".luckysheet-formula-search-item");

package/dist/index.umd.css

@@ -1042,7 +1042,6 @@ html::-webkit-scrollbar-button {
 .luckysheet-formula-search-c
   .luckysheet-formula-search-item
   .luckysheet-formula-search-func {
-  color: #363b3f;
   font-size: 14px;
 }