@fileverse-dev/fortune-react 1.0.26 → 1.1.0

package/es/components/ChangeColor/index.js

@@ -1,41 +0,0 @@
-import { getSheetIndex } from "@fileverse-dev/fortune-core";
-import React, { useContext, useEffect, useState } from "react";
-import WorkbookContext from "../../context";
-import ColorPicker from "../Toolbar/ColorPicker";
-import "./index.css";
-import SVGIcon from "../SVGIcon";
-export var ChangeColor = function ChangeColor(_a) {
-  var triggerParentUpdate = _a.triggerParentUpdate;
-  var _b = useContext(WorkbookContext),
-    context = _b.context,
-    setContext = _b.setContext;
-  var _c = useState(context.luckysheetfile[getSheetIndex(context, context.currentSheetId)].color),
-    selectColor = _c[0],
-    setSelectColor = _c[1];
-  useEffect(function () {
-    setContext(function (ctx) {
-      if (ctx.allowEdit === false) return;
-      var index = getSheetIndex(ctx, ctx.currentSheetId);
-      ctx.luckysheetfile[index].color = selectColor;
-    });
-  }, [selectColor, setContext]);
-  return /*#__PURE__*/React.createElement("div", {
-    id: "fortune-change-color"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "color-reset",
-    onClick: function onClick() {
-      return setSelectColor(undefined);
-    },
-    tabIndex: 0
-  }, /*#__PURE__*/React.createElement(SVGIcon, {
-    name: "reset-color",
-    width: 16,
-    height: 16
-  }), "Reset"), /*#__PURE__*/React.createElement(ColorPicker, {
-    onPick: function onPick(color) {
-      triggerParentUpdate(true);
-      setSelectColor(color);
-      triggerParentUpdate(false);
-    }
-  }));
-};

package/es/components/ConditionFormat/ConditionRules.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-import "./index.css";
-declare const ConditionRules: React.FC<{
-    type: string;
-}>;
-export default ConditionRules;

package/es/components/ConditionFormat/ConditionRules.js

@@ -1,323 +0,0 @@
-import React, { useCallback, useContext, useEffect, useState } from "react";
-import "./index.css";
-import { locale, setConditionRules } from "@fileverse-dev/fortune-core";
-import produce from "immer";
-import { Button, Checkbox, Divider, IconButton, LucideIcon, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, TextField } from "@fileverse/ui";
-import WorkbookContext from "../../context";
-import { useDialog } from "../../hooks/useDialog";
-import { getDisplayedRangeTxt } from "../DataVerification/getDisplayedRangeTxt";
-import { injectDatepickerStyles } from "../../utils/datepickerStyles";
-injectDatepickerStyles();
-var ConditionRules = function ConditionRules(_a) {
-  var type = _a.type;
-  var _b = useContext(WorkbookContext),
-    context = _b.context,
-    setContext = _b.setContext;
-  var hideDialog = useDialog().hideDialog;
-  var _c = locale(context),
-    conditionformat = _c.conditionformat,
-    button = _c.button,
-    protection = _c.protection,
-    generalDialog = _c.generalDialog;
-  var _d = useState({
-      textColor: "#FFFFFF",
-      cellColor: "#D82E2A"
-    }),
-    colorRules = _d[0],
-    setColorRules = _d[1];
-  var dataSelectRange = useCallback(function (selectType) {
-    hideDialog();
-    setContext(function (ctx) {
-      ctx.conditionRules.textColor.color = colorRules.textColor;
-      ctx.conditionRules.cellColor.color = colorRules.cellColor;
-      ctx.rangeDialog.show = true;
-      ctx.rangeDialog.type = selectType;
-      ctx.rangeDialog.rangeTxt = ctx.conditionRules.rulesValue;
-      ctx.rangeDialog.singleSelect = false;
-    });
-  }, [colorRules.cellColor, colorRules.textColor, hideDialog, setContext]);
-  var close = useCallback(function (closeType) {
-    if (closeType === "confirm") {
-      setContext(function (ctx) {
-        ctx.conditionRules.textColor.color = colorRules.textColor;
-        ctx.conditionRules.cellColor.color = colorRules.cellColor;
-        setConditionRules(ctx, protection, generalDialog, conditionformat, ctx.conditionRules);
-      });
-    }
-    setContext(function (ctx) {
-      ctx.conditionRules = {
-        rulesType: "",
-        rulesValue: "",
-        textColor: {
-          check: true,
-          color: "#000000"
-        },
-        cellColor: {
-          check: true,
-          color: "#000000"
-        },
-        betweenValue: {
-          value1: "",
-          value2: ""
-        },
-        dateValue: "",
-        repeatValue: "0",
-        projectValue: "10"
-      };
-    });
-    hideDialog();
-  }, [colorRules, conditionformat, generalDialog, hideDialog, protection, setContext]);
-  useEffect(function () {
-    setContext(function (ctx) {
-      ctx.conditionRules.rulesType = type;
-      if (!ctx.rangeDialog) return;
-      var rangeDialogType = ctx.rangeDialog.type;
-      var rangeT = ctx.rangeDialog.rangeTxt;
-      if (rangeDialogType === "conditionRulesbetween1") {
-        ctx.conditionRules.betweenValue.value1 = rangeT;
-      } else if (rangeDialogType === "conditionRulesbetween2") {
-        ctx.conditionRules.betweenValue.value2 = rangeT;
-      } else if (rangeDialogType.indexOf("conditionRules") >= 0) {
-        ctx.conditionRules.rulesValue = rangeT;
-      } else if (rangeDialogType === "") {
-        ctx.conditionRules = {
-          rulesType: type,
-          rulesValue: "",
-          textColor: {
-            check: true,
-            color: "#000000"
-          },
-          cellColor: {
-            check: true,
-            color: "#000000"
-          },
-          betweenValue: {
-            value1: "",
-            value2: ""
-          },
-          dateValue: "",
-          repeatValue: "0",
-          projectValue: "10"
-        };
-      }
-      ctx.rangeDialog.type = "";
-      ctx.rangeDialog.rangeTxt = "";
-    });
-  }, []);
-  var titleType = type === "top10_percent" ? "top10" : type === "last10_percent" ? "last10" : type;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules"
-  }, !["aboveAverage", "belowAverage"].includes(type) && (/*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-value text-heading-xsm"
-  }, conditionformat["conditionformat_".concat(titleType, "_title")]), (type === "greaterThan" || type === "lessThan" || type === "equal" || type === "textContains") && (/*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement(TextField, {
-    value: context.conditionRules.rulesValue,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.conditionRules.rulesValue = value;
-      });
-    }
-  }))), type === "between" && (/*#__PURE__*/React.createElement("div", {
-    className: "w-full flex gap-2 items-center"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement(TextField, {
-    placeholder: "From",
-    value: context.conditionRules.betweenValue.value1,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.conditionRules.betweenValue.value1 = value;
-      });
-    }
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement(TextField, {
-    placeholder: "To",
-    value: context.conditionRules.betweenValue.value2,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.conditionRules.betweenValue.value2 = value;
-      });
-    }
-  })))), type === "occurrenceDate" && (/*#__PURE__*/React.createElement("div", {
-    className: "datepicker-toggle"
-  }, /*#__PURE__*/React.createElement("input", {
-    type: "date",
-    className: "datepicker-input",
-    value: context.conditionRules.dateValue,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.conditionRules.dateValue = value;
-      });
-    }
-  }), /*#__PURE__*/React.createElement("span", {
-    className: "datepicker-toggle-button"
-  }))), type === "duplicateValue" && (/*#__PURE__*/React.createElement(Select, {
-    value: context.conditionRules.repeatValue,
-    onValueChange: function onValueChange(value) {
-      setContext(function (ctx) {
-        ctx.conditionRules.repeatValue = value;
-      });
-    }
-  }, /*#__PURE__*/React.createElement(SelectTrigger, null, /*#__PURE__*/React.createElement(SelectValue, null)), /*#__PURE__*/React.createElement(SelectContent, {
-    className: "condition-rules-select"
-  }, /*#__PURE__*/React.createElement(SelectItem, {
-    value: "0"
-  }, conditionformat.duplicateValue), /*#__PURE__*/React.createElement(SelectItem, {
-    value: "1"
-  }, conditionformat.uniqueValue)))), (type === "top10" || type === "top10_percent" || type === "last10" || type === "last10_percent") && (/*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-project-box"
-  }, type === "top10" || type === "top10_percent" ? conditionformat.top : conditionformat.last, /*#__PURE__*/React.createElement("div", {
-    className: "flex items-center"
-  }, /*#__PURE__*/React.createElement(IconButton, {
-    icon: "Minus",
-    variant: "ghost",
-    className: "!bg-transparent",
-    disabled: Number(context.conditionRules.projectValue) <= 1,
-    onClick: function onClick() {
-      setContext(function (ctx) {
-        var current = Number(ctx.conditionRules.projectValue) || 0;
-        ctx.conditionRules.projectValue = String(Math.max(current - 1, 1));
-      });
-    }
-  }), /*#__PURE__*/React.createElement(TextField, {
-    className: "condition-rules-project-input pr-0",
-    type: "number",
-    min: 1,
-    max: type === "top10" || type === "last10" ? 10 : 100,
-    value: context.conditionRules.projectValue,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setContext(function (ctx) {
-        ctx.conditionRules.projectValue = value;
-      });
-    },
-    rightIcon: type === "top10" || type === "last10" ? (/*#__PURE__*/React.createElement("span", {
-      className: "color-icon-secondary"
-    }, conditionformat.oneself)) : (/*#__PURE__*/React.createElement("span", {
-      className: "color-icon-secondary"
-    }, "%"))
-  }), /*#__PURE__*/React.createElement(IconButton, {
-    icon: "Plus",
-    variant: "ghost",
-    className: "!bg-transparent",
-    disabled: Number(context.conditionRules.projectValue) >= (type === "top10" || type === "last10" ? 10 : 100),
-    onClick: function onClick() {
-      setContext(function (ctx) {
-        var current = Number(ctx.conditionRules.projectValue) || 0;
-        ctx.conditionRules.projectValue = String(current + 1);
-      });
-    }
-  })))))), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-value text-heading-xsm"
-  }, conditionformat.applyRange), /*#__PURE__*/React.createElement(TextField, {
-    rightIcon: /*#__PURE__*/React.createElement(LucideIcon, {
-      name: "Grid2x2",
-      size: "sm",
-      onClick: function onClick() {
-        dataSelectRange("conditionRules".concat(type));
-      }
-    }),
-    "aria-hidden": "true",
-    readOnly: true,
-    placeholder: conditionformat.selectRange,
-    value: getDisplayedRangeTxt(context),
-    onClick: function onClick() {
-      dataSelectRange("conditionRules".concat(type));
-    }
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-set-title text-heading-xsm"
-  }, "".concat(conditionformat.setAs, "\uFF1A")), /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-setbox"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-set"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-color"
-  }, /*#__PURE__*/React.createElement("span", {
-    id: "checkTextColor"
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    className: "border-2",
-    checked: context.conditionRules.textColor.check,
-    onCheckedChange: function onCheckedChange(e) {
-      var checked = e.target.checked;
-      setContext(function (ctx) {
-        ctx.conditionRules.textColor.check = checked;
-      });
-    }
-  })), /*#__PURE__*/React.createElement("label", {
-    htmlFor: "checkTextColor",
-    className: "condition-rules-label"
-  }, conditionformat.textColor), /*#__PURE__*/React.createElement("input", {
-    type: "color",
-    className: "condition-rules-select-color",
-    value: colorRules.textColor,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setColorRules(produce(function (draft) {
-        draft.textColor = value;
-      }));
-    }
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-set"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "condition-rules-color"
-  }, /*#__PURE__*/React.createElement("span", {
-    id: "checkCellColor"
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    className: "border-2",
-    checked: context.conditionRules.cellColor.check,
-    onCheckedChange: function onCheckedChange(e) {
-      var checked = e.target.checked;
-      setContext(function (ctx) {
-        ctx.conditionRules.cellColor.check = checked;
-      });
-    }
-  })), /*#__PURE__*/React.createElement("label", {
-    htmlFor: "checkCellColor",
-    className: "condition-rules-label"
-  }, conditionformat.cellColor), /*#__PURE__*/React.createElement("input", {
-    type: "color",
-    className: "condition-rules-select-color",
-    value: colorRules.cellColor,
-    onChange: function onChange(e) {
-      var value = e.target.value;
-      setColorRules(produce(function (draft) {
-        draft.cellColor = value;
-      }));
-    }
-  }))))), /*#__PURE__*/React.createElement(Divider, {
-    className: "w-full border-t-[1px]"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "flex gap-2 justify-end"
-  }, /*#__PURE__*/React.createElement(Button, {
-    variant: "secondary",
-    style: {
-      minWidth: "80px"
-    },
-    onClick: function onClick() {
-      close("close");
-    },
-    tabIndex: 0
-  }, button.cancel), /*#__PURE__*/React.createElement(Button, {
-    variant: "default",
-    style: {
-      minWidth: "80px"
-    },
-    onClick: function onClick() {
-      close("confirm");
-    },
-    tabIndex: 0
-  }, button.apply)));
-};
-export default ConditionRules;

package/es/components/ConditionFormat/index.css

@@ -1,210 +0,0 @@
-.condition-format-sub-menu {
-  position: absolute;
-  top: -12px;
-  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
-  background: #fff;
-  border: 1px solid hsl(var(--color-border-default));
-  border-radius: 8px;
-  cursor: default;
-  font-size: 14px;
-  z-index: 1004;
-  box-sizing: border-box;
-  user-select: none;
-  outline: none;
-  padding: 8px;
-  min-width: 190px;
-}
-
-.condition-format-item {
-  display: flex;
-  justify-content: space-between;
-  padding: 8px;
-  z-index: 1005;
-  border-radius: 4px;
-  cursor: pointer;
-}
-
-.condition-format-item:hover {
-  background: hsl(var(--color-bg-default-hover));
-  transition: all 0.2s ease-in-out;
-}
-
-.condition-format-item span {
-  font-size: 14px;
-  color: hsl(var(--color-text-secondary));
-  font-weight: 400;
-}
-
-.horizontal-line {
-  border-top: 1px solid #ebebeb;
-  margin-top: 6px;
-  margin-bottom: 6px;
-}
-
-.condition-rules .button-basic {
-  display: inline-block;
-  margin-bottom: 0;
-  font-weight: 400;
-  text-align: center;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  white-space: nowrap;
-  padding: 4px 8px;
-  font-size: 14px;
-  line-height: 1.42857143;
-  border-radius: 2px;
-  user-select: none;
-  margin-top: 10px;
-}
-
-.condition-rules .button-primary {
-  background: #0188fb;
-  border: 1px solid #0188fb;
-  color: #fff;
-  margin-right: 10px;
-}
-
-.condition-rules .button-close {
-  color: #333;
-  background-color: #fff;
-  border: 1px solid #ccc;
-}
-
-.condition-rules {
-  /* padding: 0px 42px 34px 42px; */
-  font-size: 14px;
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
-.condition-rules-title {
-  color: #000;
-  cursor: default;
-  font-size: 16px;
-  margin-bottom: 18px;
-}
-
-.condition-rules-value {
-  margin-bottom: 4px;
-}
-
-.condition-rules-inpbox {
-  width: 198px;
-  height: 28px;
-  border: 1px solid #d4d4d4;
-}
-
-.condition-rules-input {
-  width: 150px;
-  height: 28px;
-  padding: 0 10px;
-  border: none;
-  outline-style: none;
-  float: left;
-}
-
-.condition-relues-inputicon {
-  float: right;
-  margin-top: 2px;
-  margin-right: 5px;
-  cursor: pointer;
-}
-
-.condition-rules-set-title {
-  margin: 6px 0px;
-}
-
-.condition-rules-setbox {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.condition-rules-set {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.condition-rules-color {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.condition-rules-check {
-  /* float: left; */
-  /* margin-top: 10px; */
-}
-
-.condition-rules-label {
-  display: inline-block;
-  width: 70px;
-  user-select: none;
-}
-
-.condition-rules-select-color {
-  background: hsl(var(--color-bg-default));
-  width: 2.5rem;
-  height: 1.5rem;
-  border-radius: 4px;
-  padding: 0;
-  margin: 0;
-  cursor: pointer;
-}
-
-.condition-rules-between-box {
-  display: flex;
-  align-items: center;
-}
-
-.condition-rules-between-inpbox {
-  width: 108px;
-  height: 28px;
-  border: 1px solid #d4d4d4;
-}
-
-.condition-rules-between-input {
-  width: 60px;
-  height: 28px;
-  padding: 0 10px;
-  border: none;
-  outline-style: none;
-  float: left;
-}
-
-.condition-rules-date {
-  width: 100%;
-}
-
-.condition-rules-select {
-  width: 100%;
-  z-index: 999999;
-}
-
-.condition-rules-project-box {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.condition-rules-project-input {
-  margin: 0px;
-  width: fit-content;
-  max-width: 55px !important;
-}
-
-/* Hide arrows for Chrome, Safari, Edge */
-input[type="number"].condition-rules-project-input::-webkit-outer-spin-button,
-input[type="number"].condition-rules-project-input::-webkit-inner-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-/* Hide arrows for Firefox */
-input[type="number"].condition-rules-project-input {
-  -moz-appearance: textfield;
-}