@fileverse-dev/fortune-react 1.2.64-patch-1 → 1.2.64-patch-2

package/es/components/Toolbar/conditionalFormatPortal.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+declare const ConditionalFormatPortal: ({ visible }: {
+    visible: boolean;
+}) => React.ReactPortal | null;
+export default ConditionalFormatPortal;

package/es/components/Toolbar/conditionalFormatPortal.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { createPortal } from "react-dom";
+import ConditionRules from "../ConditionFormat/ConditionRules";
+var ConditionalFormatPortal = function ConditionalFormatPortal(_a) {
+  var visible = _a.visible;
+  var container = document.getElementById("placeholder-conditional-format");
+  if (!visible || !container) return null;
+  return /*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(ConditionRules, null), container);
+};
+export default ConditionalFormatPortal;

package/es/components/Toolbar/index.js

@@ -127,6 +127,7 @@ import { toolbarItemClickHandler, handleTextBackground, handleTextColor, handleT
 import _ from "lodash";
 import { IconButton, LucideIcon, Tooltip, Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from "@fileverse/ui";
 import DataVerificationPortal from "./dataVerificationPortal";
+import ConditionalFormatPortal from "./conditionalFormatPortal";
 import WorkbookContext from "../../context";
 import "./index.css";
 import Button from "./Button";
@@ -595,6 +596,9 @@ var Toolbar = function Toolbar(_a) {
   var _o = useState(false),
     showDataValidation = _o[0],
     setShowDataValidation = _o[1];
+  var _p = useState(false),
+    showConditionalFormat = _p[0],
+    setShowConditionalFormat = _p[1];
   var dataVerificationClick = function dataVerificationClick(selectedCells) {
     var _a;
     var selection = api.getSelection(context);
@@ -631,6 +635,9 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     (_a = document.getElementById("conditional-format-button")) === null || _a === void 0 ? void 0 : _a.click();
+    setTimeout(function () {
+      setShowConditionalFormat(true);
+    }, 100);
   };
   var getToolbarItem = useCallback(function (name, i) {
     var _a, _b, _c, _d, _e, _f, _g;
@@ -1676,6 +1683,8 @@ var Toolbar = function Toolbar(_a) {
     "aria-label": toolbar.toolbar
   }, /*#__PURE__*/React.createElement(DataVerificationPortal, {
     visible: showDataValidation
+  }), /*#__PURE__*/React.createElement(ConditionalFormatPortal, {
+    visible: showConditionalFormat
   }), /*#__PURE__*/React.createElement("input", {
     id: "fortune-img-upload",
     className: "test-fortune-img-upload",

package/lib/components/Toolbar/conditionalFormatPortal.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+declare const ConditionalFormatPortal: ({ visible }: {
+    visible: boolean;
+}) => React.ReactPortal | null;
+export default ConditionalFormatPortal;

package/lib/components/Toolbar/conditionalFormatPortal.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactDom = require("react-dom");
+var _ConditionRules = _interopRequireDefault(require("../ConditionFormat/ConditionRules"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var ConditionalFormatPortal = function ConditionalFormatPortal(_a) {
+  var visible = _a.visible;
+  var container = document.getElementById("placeholder-conditional-format");
+  if (!visible || !container) return null;
+  return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, null), container);
+};
+var _default = exports.default = ConditionalFormatPortal;

package/lib/components/Toolbar/index.js

@@ -10,6 +10,7 @@ var _fortuneCore = require("@fileverse-dev/fortune-core");
 var _lodash = _interopRequireDefault(require("lodash"));
 var _ui = require("@fileverse/ui");
 var _dataVerificationPortal = _interopRequireDefault(require("./dataVerificationPortal"));
+var _conditionalFormatPortal = _interopRequireDefault(require("./conditionalFormatPortal"));
 var _context = _interopRequireDefault(require("../../context"));
 require("./index.css");
 var _Button = _interopRequireDefault(require("./Button"));
@@ -604,6 +605,9 @@ var Toolbar = function Toolbar(_a) {
   var _o = (0, _react.useState)(false),
     showDataValidation = _o[0],
     setShowDataValidation = _o[1];
+  var _p = (0, _react.useState)(false),
+    showConditionalFormat = _p[0],
+    setShowConditionalFormat = _p[1];
   var dataVerificationClick = function dataVerificationClick(selectedCells) {
     var _a;
     var selection = _fortuneCore.api.getSelection(context);
@@ -640,6 +644,9 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     (_a = document.getElementById("conditional-format-button")) === null || _a === void 0 ? void 0 : _a.click();
+    setTimeout(function () {
+      setShowConditionalFormat(true);
+    }, 100);
   };
   var getToolbarItem = (0, _react.useCallback)(function (name, i) {
     var _a, _b, _c, _d, _e, _f, _g;
@@ -1685,6 +1692,8 @@ var Toolbar = function Toolbar(_a) {
     "aria-label": toolbar.toolbar
   }, /*#__PURE__*/_react.default.createElement(_dataVerificationPortal.default, {
     visible: showDataValidation
+  }), /*#__PURE__*/_react.default.createElement(_conditionalFormatPortal.default, {
+    visible: showConditionalFormat
   }), /*#__PURE__*/_react.default.createElement("input", {
     id: "fortune-img-upload",
     className: "test-fortune-img-upload",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fileverse-dev/fortune-react",
-  "version": "1.2.64-patch-1",
+  "version": "1.2.64-patch-2",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "module": "es/index.js",
@@ -16,7 +16,7 @@
     "tsc": "tsc"
   },
   "dependencies": {
-    "@fileverse-dev/fortune-core": "1.2.64-patch-1",
+    "@fileverse-dev/fortune-core": "1.2.64-patch-2",
     "@fileverse/ui": "^4.1.7-patch-40",
     "@tippyjs/react": "^4.2.6",
     "@types/regenerator-runtime": "^0.13.6",