@fileverse-dev/fortune-react 1.0.2-mod-28-patch-1 → 1.0.2-mod-28-patch-3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.esm.js +85 -13
  2. package/dist/index.js +85 -13
  3. package/dist/index.umd.js +85 -13
  4. package/dist/index.umd.min.js +1 -1
  5. package/package.json +2 -2
package/dist/index.esm.js CHANGED
@@ -820,7 +820,7 @@ var FormulaSearch = function FormulaSearch(props) {
820
820
  })), v.API_KEY && (/*#__PURE__*/React.createElement("div", {
821
821
  style: {
822
822
  borderRadius: "4px",
823
- backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#F9A92B"),
823
+ backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
824
824
  width: "16px",
825
825
  height: "16px"
826
826
  },
@@ -856,6 +856,10 @@ var FormulaHint = function FormulaHint(props) {
856
856
  _useState6 = _slicedToArray(_useState5, 2),
857
857
  isKeyAdded = _useState6[0],
858
858
  setApiKeyAdded = _useState6[1];
859
+ var _useState7 = useState(false),
860
+ _useState8 = _slicedToArray(_useState7, 2),
861
+ showFunctionBody = _useState8[0],
862
+ setShouldShowFunctionBody = _useState8[1];
859
863
  useEffect(function () {
860
864
  if (fn) {
861
865
  setApiKeyAdded(!!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY));
@@ -863,12 +867,16 @@ var FormulaHint = function FormulaHint(props) {
863
867
  setShowAPInput(!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY));
864
868
  }
865
869
  }, [fn]);
870
+ var apiKeyPlaceholder = {
871
+ ETHERSCAN_API_KEY: "Etherscan API key"
872
+ };
866
873
  if (!fn) return null;
867
874
  return /*#__PURE__*/React.createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
868
875
  id: "luckysheet-formula-help-c",
869
876
  className: "luckysheet-formula-help-c",
870
877
  style: {
871
- border: "1px solid ".concat(fn.BRAND_COLOR),
878
+ borderWidth: "1px",
879
+ borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "#F8F9FA",
872
880
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
873
881
  width: "340px",
874
882
  padding: "0px"
@@ -886,13 +894,17 @@ var FormulaHint = function FormulaHint(props) {
886
894
  className: "fa fa-angle-up",
887
895
  "aria-hidden": "true"
888
896
  })), /*#__PURE__*/React.createElement("div", {
889
- className: "flex items-center justify-between",
897
+ onClick: function onClick() {
898
+ setShouldShowFunctionBody(!showFunctionBody);
899
+ },
900
+ className: "flex cursor-pointer items-center justify-between",
890
901
  style: {
891
902
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
892
- padding: "10px"
903
+ padding: "10px",
904
+ borderRadius: "10px"
893
905
  }
894
906
  }, /*#__PURE__*/React.createElement("div", {
895
- className: "luckysheet-formula-help-title-formula color-text-default"
907
+ className: " flex-grow color-text-default"
896
908
  }, /*#__PURE__*/React.createElement("code", {
897
909
  style: {
898
910
  fontWeight: 500
@@ -947,7 +959,11 @@ var FormulaHint = function FormulaHint(props) {
947
959
  width: "12px",
948
960
  height: "12px"
949
961
  }
950
- }))))), /*#__PURE__*/React.createElement("div", {
962
+ }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LucideIcon, {
963
+ name: showFunctionBody ? "ChevronUp" : "ChevronDown",
964
+ width: 16,
965
+ height: 16
966
+ })))), showFunctionBody && (/*#__PURE__*/React.createElement("div", {
951
967
  className: "luckysheet-formula-help-content",
952
968
  style: {
953
969
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA")
@@ -975,7 +991,7 @@ var FormulaHint = function FormulaHint(props) {
975
991
  },
976
992
  className: "text-heading-xsm color-text-default"
977
993
  }, isKeyAdded ? "API key provided" : "API key is required"), /*#__PURE__*/React.createElement(LucideIcon, {
978
- name: "ChevronDown",
994
+ name: showAPInput ? "ChevronUp" : "ChevronDown",
979
995
  width: 24,
980
996
  height: 24
981
997
  })), showAPInput && (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", {
@@ -983,13 +999,13 @@ var FormulaHint = function FormulaHint(props) {
983
999
  margin: "0 0 16px 0"
984
1000
  },
985
1001
  className: "text-body-sm color-text-default"
986
- }, "This function is require API key. Please paste it below and\n press 'Ok'."), /*#__PURE__*/React.createElement("div", {
1002
+ }, "This function requires an API key. Please paste it below and\n press 'Ok'."), /*#__PURE__*/React.createElement("div", {
987
1003
  className: "w-full"
988
1004
  }, /*#__PURE__*/React.createElement(TextField, {
989
1005
  value: API_KEY,
990
1006
  id: "function-api-key",
991
1007
  type: "text",
992
- placeholder: "API key",
1008
+ placeholder: apiKeyPlaceholder[fn.API_KEY],
993
1009
  onChange: function onChange(e) {
994
1010
  setAPI_KEY(e.target.value);
995
1011
  setApiKeyAdded(false);
@@ -1041,7 +1057,7 @@ var FormulaHint = function FormulaHint(props) {
1041
1057
  }, ")")))), /*#__PURE__*/React.createElement("div", {
1042
1058
  className: "luckysheet-formula-help-content-detail",
1043
1059
  style: {
1044
- paddingBottom: "8px"
1060
+ paddingBottom: "16px"
1045
1061
  }
1046
1062
  }, /*#__PURE__*/React.createElement("div", {
1047
1063
  className: ""
@@ -1056,7 +1072,7 @@ var FormulaHint = function FormulaHint(props) {
1056
1072
  className: "luckysheet-arguments-help-parameter-content text-helper-text-sm"
1057
1073
  }, fn.d))), /*#__PURE__*/React.createElement("div", {
1058
1074
  style: {
1059
- paddingTop: "6px"
1075
+ paddingTop: "16px"
1060
1076
  },
1061
1077
  className: "luckysheet-formula-help-content-param"
1062
1078
  }, fn.p.map(function (param) {
@@ -1079,10 +1095,12 @@ var FormulaHint = function FormulaHint(props) {
1079
1095
  marginTop: "2px"
1080
1096
  }
1081
1097
  }, param.detail));
1082
- })))), /*#__PURE__*/React.createElement("div", {
1098
+ }))))), /*#__PURE__*/React.createElement("div", {
1083
1099
  style: {
1084
1100
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
1085
- padding: "8px"
1101
+ padding: "8px",
1102
+ borderBottomLeftRadius: "10px",
1103
+ borderBottomRightRadius: "10px"
1086
1104
  },
1087
1105
  className: "w-full"
1088
1106
  }, /*#__PURE__*/React.createElement("p", {
@@ -1233,6 +1251,48 @@ var InputBox = function InputBox() {
1233
1251
  e.stopPropagation();
1234
1252
  }
1235
1253
  }, [getActiveFormula, setContext]);
1254
+ var selectActiveFormulaOnClick = useCallback(function (e) {
1255
+ var activeFormula = getActiveFormula();
1256
+ var formulaNameDiv = activeFormula === null || activeFormula === void 0 ? void 0 : activeFormula.querySelector(".luckysheet-formula-search-func");
1257
+ if (formulaNameDiv) {
1258
+ var formulaName = formulaNameDiv.textContent;
1259
+ var textEditor = document.getElementById("luckysheet-rich-text-editor");
1260
+ if (textEditor) {
1261
+ var _getrangeseleciton2;
1262
+ var searchTxt = ((_getrangeseleciton2 = getrangeseleciton()) === null || _getrangeseleciton2 === void 0 ? void 0 : _getrangeseleciton2.textContent) || "";
1263
+ var deleteCount = searchTxt.length;
1264
+ textEditor.focus();
1265
+ var selection = window.getSelection();
1266
+ if ((selection === null || selection === void 0 ? void 0 : selection.rangeCount) === 0) return;
1267
+ var range = selection === null || selection === void 0 ? void 0 : selection.getRangeAt(0);
1268
+ if (deleteCount !== 0 && range) {
1269
+ var startOffset = Math.max(range.startOffset - deleteCount, 0);
1270
+ var endOffset = range.startOffset;
1271
+ range.setStart(range.startContainer, startOffset);
1272
+ range.setEnd(range.startContainer, endOffset);
1273
+ range.deleteContents();
1274
+ }
1275
+ var functionStr = "<span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span>");
1276
+ var lParStr = "<span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>";
1277
+ var functionNode = new DOMParser().parseFromString(functionStr, "text/html").body.childNodes[0];
1278
+ var lParNode = new DOMParser().parseFromString(lParStr, "text/html").body.childNodes[0];
1279
+ if (range === null || range === void 0 ? void 0 : range.startContainer.parentNode) {
1280
+ range === null || range === void 0 ? void 0 : range.setStart(range.startContainer.parentNode, 1);
1281
+ }
1282
+ range === null || range === void 0 ? void 0 : range.insertNode(lParNode);
1283
+ range === null || range === void 0 ? void 0 : range.insertNode(functionNode);
1284
+ range === null || range === void 0 ? void 0 : range.collapse();
1285
+ selection === null || selection === void 0 ? void 0 : selection.removeAllRanges();
1286
+ if (range) selection === null || selection === void 0 ? void 0 : selection.addRange(range);
1287
+ setContext(function (draftCtx) {
1288
+ draftCtx.functionCandidates = [];
1289
+ draftCtx.functionHint = formulaName;
1290
+ });
1291
+ }
1292
+ e.preventDefault();
1293
+ e.stopPropagation();
1294
+ }
1295
+ }, [getActiveFormula, setContext]);
1236
1296
  var onKeyDown = useCallback(function (e) {
1237
1297
  lastKeyDownEventRef.current = new KeyboardEvent(e.type, e.nativeEvent);
1238
1298
  preText.current = inputRef.current.innerText;
@@ -1352,6 +1412,18 @@ var InputBox = function InputBox() {
1352
1412
  })), document.activeElement === inputRef.current && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormulaSearch, {
1353
1413
  style: {
1354
1414
  top: ((firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0) + 4
1415
+ },
1416
+ onMouseOver: function onMouseOver(e) {
1417
+ if (document.getElementById("luckysheet-formula-search-c")) {
1418
+ var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
1419
+ if (!hoveredItem) return;
1420
+ clearSearchItemActiveClass();
1421
+ hoveredItem.classList.add("luckysheet-formula-search-item-active");
1422
+ }
1423
+ e.preventDefault();
1424
+ },
1425
+ onClick: function onClick(e) {
1426
+ selectActiveFormulaOnClick(e);
1355
1427
  }
1356
1428
  }), /*#__PURE__*/React.createElement(FormulaHint, {
1357
1429
  style: {
package/dist/index.js CHANGED
@@ -832,7 +832,7 @@ var FormulaSearch = function FormulaSearch(props) {
832
832
  })), v.API_KEY && (/*#__PURE__*/React__default['default'].createElement("div", {
833
833
  style: {
834
834
  borderRadius: "4px",
835
- backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#F9A92B"),
835
+ backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
836
836
  width: "16px",
837
837
  height: "16px"
838
838
  },
@@ -868,6 +868,10 @@ var FormulaHint = function FormulaHint(props) {
868
868
  _useState6 = _slicedToArray(_useState5, 2),
869
869
  isKeyAdded = _useState6[0],
870
870
  setApiKeyAdded = _useState6[1];
871
+ var _useState7 = React.useState(false),
872
+ _useState8 = _slicedToArray(_useState7, 2),
873
+ showFunctionBody = _useState8[0],
874
+ setShouldShowFunctionBody = _useState8[1];
871
875
  React.useEffect(function () {
872
876
  if (fn) {
873
877
  setApiKeyAdded(!!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY));
@@ -875,12 +879,16 @@ var FormulaHint = function FormulaHint(props) {
875
879
  setShowAPInput(!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY));
876
880
  }
877
881
  }, [fn]);
882
+ var apiKeyPlaceholder = {
883
+ ETHERSCAN_API_KEY: "Etherscan API key"
884
+ };
878
885
  if (!fn) return null;
879
886
  return /*#__PURE__*/React__default['default'].createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
880
887
  id: "luckysheet-formula-help-c",
881
888
  className: "luckysheet-formula-help-c",
882
889
  style: {
883
- border: "1px solid ".concat(fn.BRAND_COLOR),
890
+ borderWidth: "1px",
891
+ borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "#F8F9FA",
884
892
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
885
893
  width: "340px",
886
894
  padding: "0px"
@@ -898,13 +906,17 @@ var FormulaHint = function FormulaHint(props) {
898
906
  className: "fa fa-angle-up",
899
907
  "aria-hidden": "true"
900
908
  })), /*#__PURE__*/React__default['default'].createElement("div", {
901
- className: "flex items-center justify-between",
909
+ onClick: function onClick() {
910
+ setShouldShowFunctionBody(!showFunctionBody);
911
+ },
912
+ className: "flex cursor-pointer items-center justify-between",
902
913
  style: {
903
914
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
904
- padding: "10px"
915
+ padding: "10px",
916
+ borderRadius: "10px"
905
917
  }
906
918
  }, /*#__PURE__*/React__default['default'].createElement("div", {
907
- className: "luckysheet-formula-help-title-formula color-text-default"
919
+ className: " flex-grow color-text-default"
908
920
  }, /*#__PURE__*/React__default['default'].createElement("code", {
909
921
  style: {
910
922
  fontWeight: 500
@@ -959,7 +971,11 @@ var FormulaHint = function FormulaHint(props) {
959
971
  width: "12px",
960
972
  height: "12px"
961
973
  }
962
- }))))), /*#__PURE__*/React__default['default'].createElement("div", {
974
+ }))), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
975
+ name: showFunctionBody ? "ChevronUp" : "ChevronDown",
976
+ width: 16,
977
+ height: 16
978
+ })))), showFunctionBody && (/*#__PURE__*/React__default['default'].createElement("div", {
963
979
  className: "luckysheet-formula-help-content",
964
980
  style: {
965
981
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA")
@@ -987,7 +1003,7 @@ var FormulaHint = function FormulaHint(props) {
987
1003
  },
988
1004
  className: "text-heading-xsm color-text-default"
989
1005
  }, isKeyAdded ? "API key provided" : "API key is required"), /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
990
- name: "ChevronDown",
1006
+ name: showAPInput ? "ChevronUp" : "ChevronDown",
991
1007
  width: 24,
992
1008
  height: 24
993
1009
  })), showAPInput && (/*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("p", {
@@ -995,13 +1011,13 @@ var FormulaHint = function FormulaHint(props) {
995
1011
  margin: "0 0 16px 0"
996
1012
  },
997
1013
  className: "text-body-sm color-text-default"
998
- }, "This function is require API key. Please paste it below and\n press 'Ok'."), /*#__PURE__*/React__default['default'].createElement("div", {
1014
+ }, "This function requires an API key. Please paste it below and\n press 'Ok'."), /*#__PURE__*/React__default['default'].createElement("div", {
999
1015
  className: "w-full"
1000
1016
  }, /*#__PURE__*/React__default['default'].createElement(ui.TextField, {
1001
1017
  value: API_KEY,
1002
1018
  id: "function-api-key",
1003
1019
  type: "text",
1004
- placeholder: "API key",
1020
+ placeholder: apiKeyPlaceholder[fn.API_KEY],
1005
1021
  onChange: function onChange(e) {
1006
1022
  setAPI_KEY(e.target.value);
1007
1023
  setApiKeyAdded(false);
@@ -1053,7 +1069,7 @@ var FormulaHint = function FormulaHint(props) {
1053
1069
  }, ")")))), /*#__PURE__*/React__default['default'].createElement("div", {
1054
1070
  className: "luckysheet-formula-help-content-detail",
1055
1071
  style: {
1056
- paddingBottom: "8px"
1072
+ paddingBottom: "16px"
1057
1073
  }
1058
1074
  }, /*#__PURE__*/React__default['default'].createElement("div", {
1059
1075
  className: ""
@@ -1068,7 +1084,7 @@ var FormulaHint = function FormulaHint(props) {
1068
1084
  className: "luckysheet-arguments-help-parameter-content text-helper-text-sm"
1069
1085
  }, fn.d))), /*#__PURE__*/React__default['default'].createElement("div", {
1070
1086
  style: {
1071
- paddingTop: "6px"
1087
+ paddingTop: "16px"
1072
1088
  },
1073
1089
  className: "luckysheet-formula-help-content-param"
1074
1090
  }, fn.p.map(function (param) {
@@ -1091,10 +1107,12 @@ var FormulaHint = function FormulaHint(props) {
1091
1107
  marginTop: "2px"
1092
1108
  }
1093
1109
  }, param.detail));
1094
- })))), /*#__PURE__*/React__default['default'].createElement("div", {
1110
+ }))))), /*#__PURE__*/React__default['default'].createElement("div", {
1095
1111
  style: {
1096
1112
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
1097
- padding: "8px"
1113
+ padding: "8px",
1114
+ borderBottomLeftRadius: "10px",
1115
+ borderBottomRightRadius: "10px"
1098
1116
  },
1099
1117
  className: "w-full"
1100
1118
  }, /*#__PURE__*/React__default['default'].createElement("p", {
@@ -1245,6 +1263,48 @@ var InputBox = function InputBox() {
1245
1263
  e.stopPropagation();
1246
1264
  }
1247
1265
  }, [getActiveFormula, setContext]);
1266
+ var selectActiveFormulaOnClick = React.useCallback(function (e) {
1267
+ var activeFormula = getActiveFormula();
1268
+ var formulaNameDiv = activeFormula === null || activeFormula === void 0 ? void 0 : activeFormula.querySelector(".luckysheet-formula-search-func");
1269
+ if (formulaNameDiv) {
1270
+ var formulaName = formulaNameDiv.textContent;
1271
+ var textEditor = document.getElementById("luckysheet-rich-text-editor");
1272
+ if (textEditor) {
1273
+ var _getrangeseleciton2;
1274
+ var searchTxt = ((_getrangeseleciton2 = fortuneCore.getrangeseleciton()) === null || _getrangeseleciton2 === void 0 ? void 0 : _getrangeseleciton2.textContent) || "";
1275
+ var deleteCount = searchTxt.length;
1276
+ textEditor.focus();
1277
+ var selection = window.getSelection();
1278
+ if ((selection === null || selection === void 0 ? void 0 : selection.rangeCount) === 0) return;
1279
+ var range = selection === null || selection === void 0 ? void 0 : selection.getRangeAt(0);
1280
+ if (deleteCount !== 0 && range) {
1281
+ var startOffset = Math.max(range.startOffset - deleteCount, 0);
1282
+ var endOffset = range.startOffset;
1283
+ range.setStart(range.startContainer, startOffset);
1284
+ range.setEnd(range.startContainer, endOffset);
1285
+ range.deleteContents();
1286
+ }
1287
+ var functionStr = "<span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span>");
1288
+ var lParStr = "<span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>";
1289
+ var functionNode = new DOMParser().parseFromString(functionStr, "text/html").body.childNodes[0];
1290
+ var lParNode = new DOMParser().parseFromString(lParStr, "text/html").body.childNodes[0];
1291
+ if (range === null || range === void 0 ? void 0 : range.startContainer.parentNode) {
1292
+ range === null || range === void 0 ? void 0 : range.setStart(range.startContainer.parentNode, 1);
1293
+ }
1294
+ range === null || range === void 0 ? void 0 : range.insertNode(lParNode);
1295
+ range === null || range === void 0 ? void 0 : range.insertNode(functionNode);
1296
+ range === null || range === void 0 ? void 0 : range.collapse();
1297
+ selection === null || selection === void 0 ? void 0 : selection.removeAllRanges();
1298
+ if (range) selection === null || selection === void 0 ? void 0 : selection.addRange(range);
1299
+ setContext(function (draftCtx) {
1300
+ draftCtx.functionCandidates = [];
1301
+ draftCtx.functionHint = formulaName;
1302
+ });
1303
+ }
1304
+ e.preventDefault();
1305
+ e.stopPropagation();
1306
+ }
1307
+ }, [getActiveFormula, setContext]);
1248
1308
  var onKeyDown = React.useCallback(function (e) {
1249
1309
  lastKeyDownEventRef.current = new KeyboardEvent(e.type, e.nativeEvent);
1250
1310
  preText.current = inputRef.current.innerText;
@@ -1364,6 +1424,18 @@ var InputBox = function InputBox() {
1364
1424
  })), document.activeElement === inputRef.current && (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(FormulaSearch, {
1365
1425
  style: {
1366
1426
  top: ((firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0) + 4
1427
+ },
1428
+ onMouseOver: function onMouseOver(e) {
1429
+ if (document.getElementById("luckysheet-formula-search-c")) {
1430
+ var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
1431
+ if (!hoveredItem) return;
1432
+ clearSearchItemActiveClass();
1433
+ hoveredItem.classList.add("luckysheet-formula-search-item-active");
1434
+ }
1435
+ e.preventDefault();
1436
+ },
1437
+ onClick: function onClick(e) {
1438
+ selectActiveFormulaOnClick(e);
1367
1439
  }
1368
1440
  }), /*#__PURE__*/React__default['default'].createElement(FormulaHint, {
1369
1441
  style: {
package/dist/index.umd.js CHANGED
@@ -102134,7 +102134,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102134
102134
  })), v.API_KEY && (/*#__PURE__*/React__default['default'].createElement("div", {
102135
102135
  style: {
102136
102136
  borderRadius: "4px",
102137
- backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#F9A92B"),
102137
+ backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
102138
102138
  width: "16px",
102139
102139
  height: "16px"
102140
102140
  },
@@ -102170,6 +102170,10 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102170
102170
  _useState6 = _slicedToArray(_useState5, 2),
102171
102171
  isKeyAdded = _useState6[0],
102172
102172
  setApiKeyAdded = _useState6[1];
102173
+ var _useState7 = React.useState(false),
102174
+ _useState8 = _slicedToArray(_useState7, 2),
102175
+ showFunctionBody = _useState8[0],
102176
+ setShouldShowFunctionBody = _useState8[1];
102173
102177
  React.useEffect(function () {
102174
102178
  if (fn) {
102175
102179
  setApiKeyAdded(!!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY));
@@ -102177,12 +102181,16 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102177
102181
  setShowAPInput(!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY));
102178
102182
  }
102179
102183
  }, [fn]);
102184
+ var apiKeyPlaceholder = {
102185
+ ETHERSCAN_API_KEY: "Etherscan API key"
102186
+ };
102180
102187
  if (!fn) return null;
102181
102188
  return /*#__PURE__*/React__default['default'].createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
102182
102189
  id: "luckysheet-formula-help-c",
102183
102190
  className: "luckysheet-formula-help-c",
102184
102191
  style: {
102185
- border: "1px solid ".concat(fn.BRAND_COLOR),
102192
+ borderWidth: "1px",
102193
+ borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "#F8F9FA",
102186
102194
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
102187
102195
  width: "340px",
102188
102196
  padding: "0px"
@@ -102200,13 +102208,17 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102200
102208
  className: "fa fa-angle-up",
102201
102209
  "aria-hidden": "true"
102202
102210
  })), /*#__PURE__*/React__default['default'].createElement("div", {
102203
- className: "flex items-center justify-between",
102211
+ onClick: function onClick() {
102212
+ setShouldShowFunctionBody(!showFunctionBody);
102213
+ },
102214
+ className: "flex cursor-pointer items-center justify-between",
102204
102215
  style: {
102205
102216
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
102206
- padding: "10px"
102217
+ padding: "10px",
102218
+ borderRadius: "10px"
102207
102219
  }
102208
102220
  }, /*#__PURE__*/React__default['default'].createElement("div", {
102209
- className: "luckysheet-formula-help-title-formula color-text-default"
102221
+ className: " flex-grow color-text-default"
102210
102222
  }, /*#__PURE__*/React__default['default'].createElement("code", {
102211
102223
  style: {
102212
102224
  fontWeight: 500
@@ -102261,7 +102273,11 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102261
102273
  width: "12px",
102262
102274
  height: "12px"
102263
102275
  }
102264
- }))))), /*#__PURE__*/React__default['default'].createElement("div", {
102276
+ }))), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(be, {
102277
+ name: showFunctionBody ? "ChevronUp" : "ChevronDown",
102278
+ width: 16,
102279
+ height: 16
102280
+ })))), showFunctionBody && (/*#__PURE__*/React__default['default'].createElement("div", {
102265
102281
  className: "luckysheet-formula-help-content",
102266
102282
  style: {
102267
102283
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA")
@@ -102289,7 +102305,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102289
102305
  },
102290
102306
  className: "text-heading-xsm color-text-default"
102291
102307
  }, isKeyAdded ? "API key provided" : "API key is required"), /*#__PURE__*/React__default['default'].createElement(be, {
102292
- name: "ChevronDown",
102308
+ name: showAPInput ? "ChevronUp" : "ChevronDown",
102293
102309
  width: 24,
102294
102310
  height: 24
102295
102311
  })), showAPInput && (/*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("p", {
@@ -102297,13 +102313,13 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102297
102313
  margin: "0 0 16px 0"
102298
102314
  },
102299
102315
  className: "text-body-sm color-text-default"
102300
- }, "This function is require API key. Please paste it below and\n press 'Ok'."), /*#__PURE__*/React__default['default'].createElement("div", {
102316
+ }, "This function requires an API key. Please paste it below and\n press 'Ok'."), /*#__PURE__*/React__default['default'].createElement("div", {
102301
102317
  className: "w-full"
102302
102318
  }, /*#__PURE__*/React__default['default'].createElement(I0, {
102303
102319
  value: API_KEY,
102304
102320
  id: "function-api-key",
102305
102321
  type: "text",
102306
- placeholder: "API key",
102322
+ placeholder: apiKeyPlaceholder[fn.API_KEY],
102307
102323
  onChange: function onChange(e) {
102308
102324
  setAPI_KEY(e.target.value);
102309
102325
  setApiKeyAdded(false);
@@ -102355,7 +102371,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102355
102371
  }, ")")))), /*#__PURE__*/React__default['default'].createElement("div", {
102356
102372
  className: "luckysheet-formula-help-content-detail",
102357
102373
  style: {
102358
- paddingBottom: "8px"
102374
+ paddingBottom: "16px"
102359
102375
  }
102360
102376
  }, /*#__PURE__*/React__default['default'].createElement("div", {
102361
102377
  className: ""
@@ -102370,7 +102386,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102370
102386
  className: "luckysheet-arguments-help-parameter-content text-helper-text-sm"
102371
102387
  }, fn.d))), /*#__PURE__*/React__default['default'].createElement("div", {
102372
102388
  style: {
102373
- paddingTop: "6px"
102389
+ paddingTop: "16px"
102374
102390
  },
102375
102391
  className: "luckysheet-formula-help-content-param"
102376
102392
  }, fn.p.map(function (param) {
@@ -102393,10 +102409,12 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102393
102409
  marginTop: "2px"
102394
102410
  }
102395
102411
  }, param.detail));
102396
- })))), /*#__PURE__*/React__default['default'].createElement("div", {
102412
+ }))))), /*#__PURE__*/React__default['default'].createElement("div", {
102397
102413
  style: {
102398
102414
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
102399
- padding: "8px"
102415
+ padding: "8px",
102416
+ borderBottomLeftRadius: "10px",
102417
+ borderBottomRightRadius: "10px"
102400
102418
  },
102401
102419
  className: "w-full"
102402
102420
  }, /*#__PURE__*/React__default['default'].createElement("p", {
@@ -102547,6 +102565,48 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102547
102565
  e.stopPropagation();
102548
102566
  }
102549
102567
  }, [getActiveFormula, setContext]);
102568
+ var selectActiveFormulaOnClick = React.useCallback(function (e) {
102569
+ var activeFormula = getActiveFormula();
102570
+ var formulaNameDiv = activeFormula === null || activeFormula === void 0 ? void 0 : activeFormula.querySelector(".luckysheet-formula-search-func");
102571
+ if (formulaNameDiv) {
102572
+ var formulaName = formulaNameDiv.textContent;
102573
+ var textEditor = document.getElementById("luckysheet-rich-text-editor");
102574
+ if (textEditor) {
102575
+ var _getrangeseleciton2;
102576
+ var searchTxt = ((_getrangeseleciton2 = getrangeseleciton()) === null || _getrangeseleciton2 === void 0 ? void 0 : _getrangeseleciton2.textContent) || "";
102577
+ var deleteCount = searchTxt.length;
102578
+ textEditor.focus();
102579
+ var selection = window.getSelection();
102580
+ if ((selection === null || selection === void 0 ? void 0 : selection.rangeCount) === 0) return;
102581
+ var range = selection === null || selection === void 0 ? void 0 : selection.getRangeAt(0);
102582
+ if (deleteCount !== 0 && range) {
102583
+ var startOffset = Math.max(range.startOffset - deleteCount, 0);
102584
+ var endOffset = range.startOffset;
102585
+ range.setStart(range.startContainer, startOffset);
102586
+ range.setEnd(range.startContainer, endOffset);
102587
+ range.deleteContents();
102588
+ }
102589
+ var functionStr = "<span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span>");
102590
+ var lParStr = "<span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>";
102591
+ var functionNode = new DOMParser().parseFromString(functionStr, "text/html").body.childNodes[0];
102592
+ var lParNode = new DOMParser().parseFromString(lParStr, "text/html").body.childNodes[0];
102593
+ if (range === null || range === void 0 ? void 0 : range.startContainer.parentNode) {
102594
+ range === null || range === void 0 ? void 0 : range.setStart(range.startContainer.parentNode, 1);
102595
+ }
102596
+ range === null || range === void 0 ? void 0 : range.insertNode(lParNode);
102597
+ range === null || range === void 0 ? void 0 : range.insertNode(functionNode);
102598
+ range === null || range === void 0 ? void 0 : range.collapse();
102599
+ selection === null || selection === void 0 ? void 0 : selection.removeAllRanges();
102600
+ if (range) selection === null || selection === void 0 ? void 0 : selection.addRange(range);
102601
+ setContext(function (draftCtx) {
102602
+ draftCtx.functionCandidates = [];
102603
+ draftCtx.functionHint = formulaName;
102604
+ });
102605
+ }
102606
+ e.preventDefault();
102607
+ e.stopPropagation();
102608
+ }
102609
+ }, [getActiveFormula, setContext]);
102550
102610
  var onKeyDown = React.useCallback(function (e) {
102551
102611
  lastKeyDownEventRef.current = new KeyboardEvent(e.type, e.nativeEvent);
102552
102612
  preText.current = inputRef.current.innerText;
@@ -102666,6 +102726,18 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
102666
102726
  })), document.activeElement === inputRef.current && (/*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(FormulaSearch, {
102667
102727
  style: {
102668
102728
  top: ((firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0) + 4
102729
+ },
102730
+ onMouseOver: function onMouseOver(e) {
102731
+ if (document.getElementById("luckysheet-formula-search-c")) {
102732
+ var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
102733
+ if (!hoveredItem) return;
102734
+ clearSearchItemActiveClass();
102735
+ hoveredItem.classList.add("luckysheet-formula-search-item-active");
102736
+ }
102737
+ e.preventDefault();
102738
+ },
102739
+ onClick: function onClick(e) {
102740
+ selectActiveFormulaOnClick(e);
102669
102741
  }
102670
102742
  }), /*#__PURE__*/React__default['default'].createElement(FormulaHint, {
102671
102743
  style: {