@fileverse-dev/fortune-react 1.1.0 → 1.1.2

package/es/components/CryptoDenominationSelector/index.css

@@ -0,0 +1,67 @@
+.crypto-denomination-selector {
+  min-width: 240px;
+  font-family: inherit;
+  color: hsl(var(--color-text-default));
+}
+
+.cds-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  line-height: 20px;
+}
+.cds-row input[type="number"] {
+  width: 40px;
+  height: 28px;
+  text-align: center;
+  border: 1px solid hsl(var(--color-border-default));
+  border-radius: 6px;
+  font-size: 14px;
+  padding: 0 4px;
+  margin: 0 4px;
+}
+
+/* Chrome, Safari, Edge, Opera */
+.cds-row input::-webkit-outer-spin-button,
+.cds-row input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Firefox */
+.cds-row input[type=number] {
+  -moz-appearance: textfield;
+}
+
+.cds-list {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  margin-top: 8px;
+}
+.cds-option {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 12px;
+  border-radius: 8px;
+  font-size: 14px;
+  line-height: 20px;
+  cursor: pointer;
+  transition: background 0.13s;
+  position: relative;
+}
+.cds-option.selected {
+  background: hsl(var(--color-bg-default-selected));
+}
+.cds-option:hover {
+  background: hsl(var(--color-bg-default-hover));
+}
+.cds-icon {
+  width: 16px;
+  height: 16px;
+  display: inline-block;
+  background-size: contain;
+  background-repeat: no-repeat;
+}

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

@@ -0,0 +1,8 @@
+import React from "react";
+import "./index.css";
+interface CryptoDenominationSelectorProps {
+    initialDecimals?: number;
+    children: React.ReactNode;
+}
+declare const CryptoDenominationSelector: React.FC<CryptoDenominationSelectorProps>;
+export default CryptoDenominationSelector;

package/es/components/CryptoDenominationSelector/index.js

@@ -0,0 +1,271 @@
+var __awaiter = this && this.__awaiter || function (thisArg, _arguments, P, generator) {
+  function adopt(value) {
+    return value instanceof P ? value : new P(function (resolve) {
+      resolve(value);
+    });
+  }
+  return new (P || (P = Promise))(function (resolve, reject) {
+    function fulfilled(value) {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+    function rejected(value) {
+      try {
+        step(generator["throw"](value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+    function step(result) {
+      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
+    }
+    step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
+};
+var __generator = this && this.__generator || function (thisArg, body) {
+  var _ = {
+      label: 0,
+      sent: function sent() {
+        if (t[0] & 1) throw t[1];
+        return t[1];
+      },
+      trys: [],
+      ops: []
+    },
+    f,
+    y,
+    t,
+    g;
+  return g = {
+    next: verb(0),
+    "throw": verb(1),
+    "return": verb(2)
+  }, typeof Symbol === "function" && (g[Symbol.iterator] = function () {
+    return this;
+  }), g;
+  function verb(n) {
+    return function (v) {
+      return step([n, v]);
+    };
+  }
+  function step(op) {
+    if (f) throw new TypeError("Generator is already executing.");
+    while (g && (g = 0, op[0] && (_ = 0)), _) try {
+      if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+      if (y = 0, t) op = [op[0] & 2, t.value];
+      switch (op[0]) {
+        case 0:
+        case 1:
+          t = op;
+          break;
+        case 4:
+          _.label++;
+          return {
+            value: op[1],
+            done: false
+          };
+        case 5:
+          _.label++;
+          y = op[1];
+          op = [0];
+          continue;
+        case 7:
+          op = _.ops.pop();
+          _.trys.pop();
+          continue;
+        default:
+          if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+            _ = 0;
+            continue;
+          }
+          if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+            _.label = op[1];
+            break;
+          }
+          if (op[0] === 6 && _.label < t[1]) {
+            _.label = t[1];
+            t = op;
+            break;
+          }
+          if (t && _.label < t[2]) {
+            _.label = t[2];
+            _.ops.push(op);
+            break;
+          }
+          if (t[2]) _.ops.pop();
+          _.trys.pop();
+          continue;
+      }
+      op = body.call(thisArg, _);
+    } catch (e) {
+      op = [6, e];
+      y = 0;
+    } finally {
+      f = t = 0;
+    }
+    if (op[0] & 5) throw op[1];
+    return {
+      value: op[0] ? op[1] : void 0,
+      done: true
+    };
+  }
+};
+import React, { useState, useContext, useCallback, useMemo } from "react";
+import { getFlowdata, normalizedCellAttr } from "@fileverse-dev/fortune-core";
+import { IconButton, LucideIcon, Popover, PopoverContent, PopoverTrigger } from "@fileverse/ui";
+import "./index.css";
+import SVGIcon from "../SVGIcon";
+import WorkbookContext from "../../context";
+import { convertCellsToCrypto } from "../../utils/convertCellsToCrypto";
+import { updateCellsDecimalFormat } from "../../utils/updateCellsDecimalFormat";
+var CRYPTO_OPTIONS = [{
+  label: "Bitcoin (BTC)",
+  value: "BTC",
+  icon: "Btc"
+}, {
+  label: "Ethereum (ETH)",
+  value: "ETH",
+  icon: "Ethereum"
+}, {
+  label: "Solana (SOL)",
+  value: "SOL",
+  icon: "Solana"
+}];
+var CryptoDenominationSelector = function CryptoDenominationSelector(_a) {
+  var _b = _a.initialDecimals,
+    initialDecimals = _b === void 0 ? 6 : _b,
+    children = _a.children;
+  var _c = useContext(WorkbookContext),
+    setContext = _c.setContext,
+    context = _c.context;
+  var activeCryptoCurrency = useMemo(function () {
+    var _a, _b;
+    var firstSelection = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0];
+    var flowdata = getFlowdata(context);
+    if (!firstSelection || !flowdata) return null;
+    var row = firstSelection.row_focus;
+    var col = firstSelection.column_focus;
+    if (row == null || col == null) return null;
+    var cell = (_b = flowdata[row]) === null || _b === void 0 ? void 0 : _b[col];
+    if (!cell) return null;
+    var curr = normalizedCellAttr(cell, "ct");
+    if (!(curr === null || curr === void 0 ? void 0 : curr.fa)) return null;
+    var found = CRYPTO_OPTIONS.find(function (option) {
+      return curr.fa.includes(option.value);
+    });
+    return found ? found.value : null;
+  }, [context]);
+  var _d = useState(initialDecimals),
+    decimals = _d[0],
+    setDecimals = _d[1];
+  var _e = useState(false),
+    open = _e[0],
+    setOpen = _e[1];
+  var handleDenominationChange = useCallback(function (newDenomination) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            return [4, convertCellsToCrypto({
+              context: context,
+              setContext: setContext,
+              denomination: newDenomination,
+              decimals: decimals
+            })];
+          case 1:
+            _a.sent();
+            return [2];
+        }
+      });
+    });
+  }, [context, setContext, decimals]);
+  var handleDecimalsChange = useCallback(function (newDecimals) {
+    setDecimals(newDecimals);
+    updateCellsDecimalFormat({
+      context: context,
+      setContext: setContext,
+      decimals: newDecimals
+    });
+  }, [context, setContext]);
+  var handleTriggerClick = useCallback(function (e) {
+    e.preventDefault();
+    e.stopPropagation();
+    if (context.allowEdit === false) {
+      return;
+    }
+    setOpen(!open);
+  }, [open, context.allowEdit]);
+  return /*#__PURE__*/React.createElement(Popover, {
+    open: open,
+    onOpenChange: setOpen
+  }, /*#__PURE__*/React.createElement(PopoverTrigger, {
+    asChild: true
+  }, /*#__PURE__*/React.createElement("div", {
+    onClick: handleTriggerClick
+  }, children)), /*#__PURE__*/React.createElement(PopoverContent, {
+    align: "end",
+    side: "bottom",
+    sideOffset: 4,
+    className: "p-2"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "crypto-denomination-selector"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "cds-row px-2"
+  }, /*#__PURE__*/React.createElement("span", null, "Decimal places:"), /*#__PURE__*/React.createElement("span", {
+    className: "flex items-center"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    icon: "Minus",
+    variant: "ghost",
+    size: "sm",
+    className: "!bg-transparent",
+    disabled: decimals === 1,
+    onClick: function onClick() {
+      return handleDecimalsChange(Math.max(1, decimals - 1));
+    }
+  }), /*#__PURE__*/React.createElement("input", {
+    type: "number",
+    min: 1,
+    max: 18,
+    value: decimals,
+    onChange: function onChange(e) {
+      return handleDecimalsChange(Math.max(1, Math.min(18, Number(e.target.value))));
+    }
+  }), /*#__PURE__*/React.createElement(IconButton, {
+    icon: "Plus",
+    variant: "ghost",
+    size: "sm",
+    className: "!bg-transparent",
+    disabled: decimals === 18,
+    onClick: function onClick() {
+      return handleDecimalsChange(Math.min(18, decimals + 1));
+    }
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "cds-list"
+  }, CRYPTO_OPTIONS.map(function (opt) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: opt.value,
+      className: "flex items-center justify-between cds-option".concat(activeCryptoCurrency === opt.value ? " selected" : ""),
+      onClick: function onClick() {
+        return handleDenominationChange(opt.value);
+      }
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "flex items-center gap-2"
+    }, activeCryptoCurrency === opt.value ? (/*#__PURE__*/React.createElement(LucideIcon, {
+      name: "Check",
+      className: "w-4 h-4"
+    })) : (/*#__PURE__*/React.createElement("div", {
+      className: "w-4 h-4"
+    })), opt.label), /*#__PURE__*/React.createElement(LucideIcon, {
+      name: opt.icon,
+      className: "cds-icon"
+    }), opt.value === "SOL" && (/*#__PURE__*/React.createElement(SVGIcon, {
+      name: "solana",
+      width: 16,
+      height: 16
+    })));
+  })))));
+};
+export default CryptoDenominationSelector;

package/es/components/CustomSort/index.css

@@ -0,0 +1,23 @@
+.fortune-sort-title {
+  background-color: #fff;
+  color: #000;
+  cursor: default;
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 24px;
+  margin: 0 0 16px;
+}
+
+.fortune-sort-modal > div {
+  margin-bottom: 10px;
+}
+
+.fortune-sort-tablec td {
+  padding: 5px;
+  white-space: nowrap;
+}
+
+.fortune-sort-button {
+  margin-top: 10px;
+  margin-bottom: 25px;
+}

package/{dist/packages/react/src → es}/components/CustomSort/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import "./index.css";
-declare const CustomSort: React.FC<{}>;
-export default CustomSort;
+import React from "react";
+import "./index.css";
+declare const CustomSort: React.FC<{}>;
+export default CustomSort;

package/es/components/CustomSort/index.js

@@ -0,0 +1,113 @@
+import { getSheetIndex, indexToColumnChar, locale, sortSelection } from "@fileverse-dev/fortune-core";
+import React, { useCallback, useContext, useEffect, useState } from "react";
+import WorkbookContext from "../../context";
+import "./index.css";
+import { useDialog } from "../../hooks/useDialog";
+var CustomSort = function CustomSort() {
+  var _a = useState([]),
+    rangeColChar = _a[0],
+    setRangeColChar = _a[1];
+  var _b = useState(true),
+    ascOrDesc = _b[0],
+    setAscOrDesc = _b[1];
+  var _c = useContext(WorkbookContext),
+    context = _c.context,
+    setContext = _c.setContext;
+  var _d = useState("0"),
+    selectedValue = _d[0],
+    setSelectedValue = _d[1];
+  var _e = useState(false),
+    isTitleChange = _e[0],
+    setIstitleChange = _e[1];
+  var sort = locale(context).sort;
+  var hideDialog = useDialog().hideDialog;
+  var col_start = context.luckysheet_select_save[0].column[0];
+  var col_end = context.luckysheet_select_save[0].column[1];
+  var row_start = context.luckysheet_select_save[0].row[0];
+  var row_end = context.luckysheet_select_save[0].row[1];
+  var sheetIndex = getSheetIndex(context, context.currentSheetId);
+  var handleSelectChange = function handleSelectChange(event) {
+    setSelectedValue(event.target.value);
+  };
+  var handleRadioChange = useCallback(function (e) {
+    var sortValue = e.target.value;
+    setAscOrDesc(sortValue === "asc");
+  }, []);
+  var handleTitleChange = useCallback(function (e) {
+    var value = e.target.checked;
+    setIstitleChange(value);
+  }, []);
+  useEffect(function () {
+    var _a, _b;
+    var list = [];
+    if (isTitleChange) {
+      for (var i = col_start; i <= col_end; i += 1) {
+        var cell = (_b = (_a = context.luckysheetfile[sheetIndex].data) === null || _a === void 0 ? void 0 : _a[row_start]) === null || _b === void 0 ? void 0 : _b[i];
+        var colHeaderValue = (cell === null || cell === void 0 ? void 0 : cell.m) || (cell === null || cell === void 0 ? void 0 : cell.v);
+        if (colHeaderValue) {
+          list.push(colHeaderValue);
+        } else {
+          var ColumnChar = indexToColumnChar(i);
+          list.push("".concat(sort.columnOperation, " ").concat(ColumnChar));
+        }
+      }
+    } else {
+      for (var i = col_start; i <= col_end; i += 1) {
+        var ColumnChar = indexToColumnChar(i);
+        list.push(ColumnChar);
+      }
+    }
+    setRangeColChar(list);
+  }, [col_end, col_start, context.luckysheetfile, isTitleChange, row_start, sheetIndex, sort.columnOperation]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "fortune-sort"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "fortune-sort-title"
+  }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", null, sort.sortRangeTitle), indexToColumnChar(col_start), row_start + 1, /*#__PURE__*/React.createElement("span", null, sort.sortRangeTitleTo), indexToColumnChar(col_end), row_end + 1)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    className: "fortune-sort-modal"
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    id: "fortune-sort-haveheader",
+    onChange: handleTitleChange
+  }), /*#__PURE__*/React.createElement("span", null, sort.hasTitle)), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-sort-tablec"
+  }, /*#__PURE__*/React.createElement("table", {
+    cellSpacing: "0"
+  }, /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
+    style: {
+      width: "190px"
+    }
+  }, sort.sortBy, /*#__PURE__*/React.createElement("select", {
+    name: "sort_0",
+    onChange: handleSelectChange
+  }, rangeColChar.map(function (col, index) {
+    return /*#__PURE__*/React.createElement("option", {
+      value: index,
+      key: index
+    }, col);
+  }))), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
+    type: "radio",
+    value: "asc",
+    defaultChecked: true,
+    name: "sort_0",
+    onChange: handleRadioChange
+  }), /*#__PURE__*/React.createElement("span", null, sort.asc)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
+    type: "radio",
+    value: "desc",
+    name: "sort_0",
+    onChange: handleRadioChange
+  }), /*#__PURE__*/React.createElement("span", null, sort.desc))))))))), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-sort-button"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "button-basic button-primary",
+    onClick: function onClick() {
+      setContext(function (draftCtx) {
+        sortSelection(draftCtx, ascOrDesc, parseInt(selectedValue, 10));
+        draftCtx.contextMenu = {};
+      });
+      hideDialog();
+    },
+    tabIndex: 0
+  }, sort.confirm)));
+};
+export default CustomSort;

package/{dist/packages/react/src → es}/components/DataVerification/DropdownList.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import "./index.css";
-declare const DropDownList: React.FC;
-export default DropDownList;
+import React from "react";
+import "./index.css";
+declare const DropDownList: React.FC;
+export default DropDownList;

package/es/components/DataVerification/DropdownList.js

@@ -0,0 +1,126 @@
+import { getCellValue, getDropdownList, getFlowdata, getSheetIndex, mergeBorder, setDropdownValue } from "@fileverse-dev/fortune-core";
+import React, { useCallback, useContext, useEffect, useRef, useState } from "react";
+import WorkbookContext from "../../context";
+import { useOutsideClick } from "../../hooks/useOutsideClick";
+import SVGIcon from "../SVGIcon";
+import "./index.css";
+var DropDownList = function DropDownList() {
+  var _a = useContext(WorkbookContext),
+    context = _a.context,
+    setContext = _a.setContext;
+  var containerRef = useRef(null);
+  var _b = useState([]),
+    list = _b[0],
+    setList = _b[1];
+  var _c = useState(false),
+    isMul = _c[0],
+    setIsMul = _c[1];
+  var _d = useState(),
+    position = _d[0],
+    setPosition = _d[1];
+  var _e = useState([]),
+    selected = _e[0],
+    setSelected = _e[1];
+  var close = useCallback(function () {
+    setContext(function (ctx) {
+      ctx.dataVerificationDropDownList = false;
+    });
+  }, [setContext]);
+  useOutsideClick(containerRef, close, [close]);
+  useEffect(function () {
+    var _a, _b;
+    if (!context.luckysheet_select_save) return;
+    var last = context.luckysheet_select_save[context.luckysheet_select_save.length - 1];
+    var rowIndex = last.row_focus;
+    var colIndex = last.column_focus;
+    if (rowIndex == null || colIndex == null) return;
+    var row = context.visibledatarow[rowIndex];
+    var col_pre = colIndex === 0 ? 0 : context.visibledatacolumn[colIndex - 1];
+    var d = getFlowdata(context);
+    if (!d) return;
+    var margeSet = mergeBorder(context, d, rowIndex, colIndex);
+    if (margeSet) {
+      _a = margeSet.row, row = _a[1];
+      _b = margeSet.column, col_pre = _b[0];
+    }
+    var index = getSheetIndex(context, context.currentSheetId);
+    var dataVerification = context.luckysheetfile[index].dataVerification;
+    var item = dataVerification["".concat(rowIndex, "_").concat(colIndex)];
+    var dropdownList = getDropdownList(context, item.value1);
+    var cellValue = getCellValue(rowIndex, colIndex, d);
+    if (cellValue) {
+      setSelected(cellValue.toString().split(","));
+    }
+    setList(dropdownList);
+    setPosition({
+      left: col_pre,
+      top: row
+    });
+    setIsMul(item.type2 === "true");
+  }, []);
+  useEffect(function () {
+    if (!context.luckysheet_select_save) return;
+    var last = context.luckysheet_select_save[context.luckysheet_select_save.length - 1];
+    var rowIndex = last.row_focus;
+    var colIndex = last.column_focus;
+    if (rowIndex == null || colIndex == null) return;
+    var index = getSheetIndex(context, context.currentSheetId);
+    var dataVerification = context.luckysheetfile[index].dataVerification;
+    var item = dataVerification["".concat(rowIndex, "_").concat(colIndex)];
+    if (item.type2 !== "true") return;
+    var d = getFlowdata(context);
+    if (!d) return;
+    var cellValue = getCellValue(rowIndex, colIndex, d);
+    if (cellValue) {
+      setSelected(cellValue.toString().split(","));
+    }
+  }, [context.luckysheetfile]);
+  return /*#__PURE__*/React.createElement("div", {
+    id: "luckysheet-dataVerification-dropdown-List",
+    style: position,
+    ref: containerRef,
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    },
+    onChange: function onChange(e) {
+      return e.stopPropagation();
+    },
+    onKeyDown: function onKeyDown(e) {
+      return e.stopPropagation();
+    },
+    onMouseDown: function onMouseDown(e) {
+      return e.stopPropagation();
+    },
+    onMouseUp: function onMouseUp(e) {
+      return e.stopPropagation();
+    },
+    tabIndex: 0
+  }, list.map(function (v, i) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "dropdown-List-item",
+      key: i,
+      onClick: function onClick() {
+        setContext(function (ctx) {
+          var arr = selected;
+          var index = arr.indexOf(v);
+          if (index < 0) {
+            arr.push(v);
+          } else {
+            arr.splice(index, 1);
+          }
+          setSelected(arr);
+          setDropdownValue(ctx, v, arr);
+        });
+      },
+      tabIndex: 0
+    }, /*#__PURE__*/React.createElement(SVGIcon, {
+      name: "check",
+      width: 12,
+      style: {
+        verticalAlign: "middle",
+        display: isMul && selected.indexOf(v) >= 0 ? "inline" : "none"
+      }
+    }), v);
+  }));
+};
+export default DropDownList;

package/{dist/packages/react/src → es}/components/DataVerification/RangeDialog.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import "./index.css";
-declare const RangeDialog: React.FC;
-export default RangeDialog;
+import React from "react";
+import "./index.css";
+declare const RangeDialog: React.FC;
+export default RangeDialog;