@fileverse-dev/fortune-react 1.2.67 → 1.2.69-conditional-1

package/lib/components/ConditionFormat/formating.css

@@ -0,0 +1,103 @@
+.toolbar-container {
+  width: 100%;
+  max-width: 896px;
+  background-color: white;
+  border-radius: 4px;
+  border: 1px solid hsl(var(--color-border-default, #E8EBEC));
+  overflow: hidden;
+}
+
+.toolbar-header {
+  background-color: #dcfce7;
+  padding: 4px 16px;
+  border-radius: var(--border-radius-sm, 4px) var(--border-radius-sm, 4px) var(--border-radius-none, 0) var(--border-radius-none, 0);
+border-bottom: 1px solid hsl(var(--color-border-default, #E8EBEC));
+background: hsl(var(--color-bg-success-light, #DDFBDF));
+}
+
+.toolbar-title {
+  color: hsl(var(--color-text-success, #177E23));
+font-family: "Helvetica Neue";
+font-size: 14px;
+font-style: normal;
+font-weight: 400;
+line-height: 20px;
+}
+
+.toolbar-content {
+  padding: 4px;
+  display: flex;
+  gap: 16px;
+  align-items: center;
+}
+
+.toolbar-button {
+  width: 48px;
+  height: 48px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: white;
+  border: 1px solid #e5e7eb;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  padding: 0;
+}
+
+.toolbar-button:hover {
+  background-color: #f9fafb;
+  border-color: #d1d5db;
+}
+
+.toolbar-button:active {
+  transform: scale(0.95);
+}
+
+.button-text {
+  font-size: 24px;
+  color: #1f2937;
+  font-weight: 500;
+}
+
+.button-text.bold {
+  font-weight: 700;
+}
+
+.button-text.italic {
+  font-style: italic;
+  font-family: Georgia, serif;
+}
+
+.button-text.underline {
+  text-decoration: underline;
+  text-decoration-thickness: 2px;
+  text-underline-offset: 2px;
+}
+
+.button-text.strikethrough {
+  text-decoration: line-through;
+  text-decoration-thickness: 2px;
+}
+
+.button-text.color-button {
+  position: relative;
+  color: #16a34a;
+}
+
+.button-text.color-button::after {
+  content: "";
+  position: absolute;
+  bottom: -4px;
+  left: 0;
+  right: 0;
+  height: 3px;
+  background-color: #16a34a;
+  border-radius: 2px;
+}
+
+.button-icon {
+  width: 24px;
+  height: 24px;
+  color: #1f2937;
+}

package/lib/components/ConditionFormat/index.css

@@ -115,7 +115,7 @@
 }
 
 .condition-rules-set-title {
-  margin: 6px 0px;
+  margin: 0px 0px 16px 0px;
 }
 
 .condition-rules-setbox {
@@ -149,13 +149,23 @@
 }
 
 .condition-rules-select-color {
-  background: hsl(var(--color-bg-default));
-  width: 2.5rem;
-  height: 1.5rem;
-  border-radius: 4px;
+  background: transparent;
+  width: 16px;
+  height: 4px;
+  border-radius: 0px;
+  border: none;
   padding: 0;
   margin: 0;
   cursor: pointer;
+  outline: none;
+}
+
+input[type="color"]::-webkit-color-swatch-wrapper {
+  padding: 0;
+}
+
+input[type="color"]::-webkit-color-swatch {
+  border: 1px solid #d4d4d4;
 }
 
 .condition-rules-between-box {
@@ -210,3 +220,50 @@ input[type="number"].condition-rules-project-input::-webkit-inner-spin-button {
 input[type="number"].condition-rules-project-input {
   -moz-appearance: textfield;
 }
+
+.condition-list-parent {
+  padding: 12px 8px;
+  gap: 12px;
+}
+
+.condition-list-parent:hover {
+  background-color: hsl(var(--color-bg-default-hover));
+}
+
+.condition-list-pill {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 44px;
+  height: 56px;
+  padding: 4px 16px;
+  gap: 10px;
+  border-radius: 4px;
+  border: 1px solid #E8EBEC;
+}
+
+.condition-list-text {
+  font-family: "Helvetica Neue";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 20px;
+}
+
+.condition-list-type {
+  color: hsl(var(--color-text-default, #363B3F));
+  font-family: "Helvetica Neue";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 20px;
+}
+
+.condition-list-range {
+  color: hsl(var(--color-text-secondary, #77818A));
+  font-family: "Helvetica Neue";
+  font-size: 12px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px;
+}

package/lib/components/ConditionFormat/index.js

@@ -235,11 +235,7 @@ var ConditionalFormat = function ConditionalFormat(_a) {
           style: {
             padding: "6px 10px"
           },
-          onClick: function onClick() {
-            setContext(function (ctx) {
-              (0, _fortuneCore.updateItem)(ctx, "delSheet");
-            });
-          },
+          onClick: function onClick() {},
           tabIndex: 0
         }, conditionformat[v]);
       }))));

package/lib/components/ContextMenu/index.js

@@ -20,7 +20,6 @@ var _Divider = _interopRequireDefault(require("./Divider"));
 require("./index.css");
 var _Menu = _interopRequireDefault(require("./Menu"));
 require("tippy.js/dist/tippy.css");
-var _ConditionFormat = _interopRequireDefault(require("../ConditionFormat"));
 var _SVGIcon = _interopRequireDefault(require("../SVGIcon"));
 var _LucideIcon = require("../../components/SheetOverlay/LucideIcon");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -995,50 +994,20 @@ var ContextMenu = function ContextMenu() {
       }), /*#__PURE__*/_react.default.createElement("p", null, rightclick.link)));
     }
     if (name === "conditionFormat") {
-      var closeContextMenu = function closeContextMenu() {
-        return setContext(function (ctx) {
-          ctx.contextMenu = {};
-        });
-      };
-      return /*#__PURE__*/_react.default.createElement(_react2.default, {
+      return /*#__PURE__*/_react.default.createElement(_Menu.default, {
         key: name,
-        placement: "right-start",
-        interactive: true,
-        interactiveBorder: 50,
-        offset: [0, 0],
-        arrow: false,
-        zIndex: 3000,
-        appendTo: document.body,
-        onShow: function onShow() {
-          setActiveMenu("conditionFormat");
-        },
-        onHide: function onHide() {
-          if (activeMenu === "conditionFormat") setActiveMenu("");
-        },
-        content: /*#__PURE__*/_react.default.createElement("div", {
-          style: {
-            minWidth: 220
-          }
-        }, /*#__PURE__*/_react.default.createElement(_ConditionFormat.default, {
-          items: ["highlightCellRules", "itemSelectionRules", "-", "deleteRule"],
-          setOpen: closeContextMenu
-        })),
-        trigger: "mouseenter focus",
-        hideOnClick: false
-      }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Menu.default, {
-        isActive: activeMenu === "conditionFormat"
-      }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "flex items-center justify-between w-full"
+        onClick: function onClick() {
+          if (context.allowEdit === false) return;
+          setContext(function (draftCtx) {
+            draftCtx.contextMenu = {};
+          });
+          window.conditionalFormatClick(context.luckysheet_select_save);
+        }
       }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "flex items-center gap-2 context-item"
+        className: "context-item"
       }, /*#__PURE__*/_react.default.createElement(_ui.LucideIcon, {
         name: "PaintbrushVertical"
-      }), /*#__PURE__*/_react.default.createElement("p", null, rightclick.conditionFormat || "Conditional Format")), /*#__PURE__*/_react.default.createElement(_ui.LucideIcon, {
-        name: "ChevronRight",
-        width: 16,
-        height: 16,
-        className: "color-text-secondary w-4 h-4"
-      })))));
+      }), /*#__PURE__*/_react.default.createElement("p", null, "Conditional formatting")));
     }
     if (name === "clear-format") {
       return /*#__PURE__*/_react.default.createElement(_Menu.default, {

package/lib/components/DataVerification/RangeDialog.js

@@ -10,7 +10,6 @@ var _ui = require("@fileverse/ui");
 var _react = _interopRequireWildcard(require("react"));
 var _context = _interopRequireDefault(require("../../context"));
 var _useDialog = require("../../hooks/useDialog");
-var _ConditionRules = _interopRequireDefault(require("../ConditionFormat/ConditionRules"));
 require("./index.css");
 var _getDisplayedRangeTxt = require("./getDisplayedRangeTxt");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -27,26 +26,13 @@ var RangeDialog = function RangeDialog() {
     rangeTxt2 = _c[0],
     setRangeTxt2 = _c[1];
   var close = (0, _react.useCallback)(function () {
-    var _a;
+    var _a, _b;
     setContext(function (ctx) {
       ctx.rangeDialog.show = false;
       ctx.rangeDialog.singleSelect = false;
     });
     (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
-    if (!context.rangeDialog) return;
-    var rangeDialogType = context.rangeDialog.type;
-    if (rangeDialogType.indexOf("between") >= 0) {
-      showDialog(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, {
-        type: "between"
-      }), undefined, (0, _fortuneCore.locale)(context).conditionformat.conditionformat_between);
-      return;
-    }
-    if (rangeDialogType.indexOf("conditionRules") >= 0) {
-      var rulesType = rangeDialogType.substring("conditionRules".length, rangeDialogType.length);
-      showDialog(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, {
-        type: rulesType
-      }), undefined, (0, _fortuneCore.locale)(context).conditionformat["conditionformat_".concat(rulesType)]);
-    }
+    (_b = document.getElementById("conditional-format-button")) === null || _b === void 0 ? void 0 : _b.click();
   }, [setContext, showDialog, context]);
   (0, _react.useEffect)(function () {
     setRangeTxt2((0, _getDisplayedRangeTxt.getDisplayedRangeTxt)(context));

package/lib/components/SheetOverlay/helper.d.ts

@@ -2,6 +2,7 @@ export declare function moveCursorToEnd(editableDiv: HTMLDivElement): void;
 export declare function getCursorPosition(editableDiv: HTMLDivElement): number;
 export declare function isLetterNumberPattern(str: string): boolean;
 export declare function removeLastSpan(htmlString: string): string;
+export declare function numberToColumn(colNumber: number): string;
 export declare function incrementColumn(cell: string): string;
 export declare function decrementColumn(cell: string): string;
 export declare function incrementRow(cell: string): string;

package/lib/components/SheetOverlay/helper.js

@@ -11,6 +11,7 @@ exports.incrementColumn = incrementColumn;
 exports.incrementRow = incrementRow;
 exports.isLetterNumberPattern = isLetterNumberPattern;
 exports.moveCursorToEnd = moveCursorToEnd;
+exports.numberToColumn = numberToColumn;
 exports.removeLastSpan = removeLastSpan;
 function moveCursorToEnd(editableDiv) {
   editableDiv.focus();

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

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

package/lib/components/Toolbar/conditionalFormatPortal.js

@@ -0,0 +1,20 @@
+"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,
+    context = _a.context;
+  var container = document.getElementById("placeholder-conditional-format");
+  if (!visible || !container) return null;
+  return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, {
+    context: context
+  }), container);
+};
+var _default = exports.default = ConditionalFormatPortal;

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

@@ -1,7 +1,7 @@
 import React from "react";
 import { Cell } from "@fileverse-dev/fortune-core";
 import "./index.css";
-export declare const getLucideIcon: (title: string) => "Ethereum" | "DollarSign" | "" | "ChevronDown" | "Undo" | "Redo" | "PaintRoller" | "Bold" | "Italic" | "Strikethrough" | "Underline" | "AlignLeft" | "AlignCenter" | "AlignRight" | "ArrowUpFromLine" | "AlignVerticalMiddle" | "ArrowDownToLine" | "TextOverflow" | "WrapText" | "TextClip" | "Baseline" | "PaintBucket" | "Border" | "MergeHorizontal" | "Percent" | "DecimalsArrowLeft" | "DecimalsArrowRight" | "PaintbrushVertical" | "Filter" | "Link" | "MessageSquarePlus" | "Image" | "Sigma" | "ShieldCheck" | "Search" | "DuneChart" | "Ellipsis";
+export declare const getLucideIcon: (title: string) => "Ethereum" | "DollarSign" | "" | "ChevronDown" | "Bold" | "Italic" | "Underline" | "Strikethrough" | "PaintBucket" | "Undo" | "Redo" | "PaintRoller" | "AlignLeft" | "AlignCenter" | "AlignRight" | "ArrowUpFromLine" | "AlignVerticalMiddle" | "ArrowDownToLine" | "TextOverflow" | "WrapText" | "TextClip" | "Baseline" | "Border" | "MergeHorizontal" | "Percent" | "DecimalsArrowLeft" | "DecimalsArrowRight" | "PaintbrushVertical" | "Filter" | "Link" | "MessageSquarePlus" | "Image" | "Sigma" | "ShieldCheck" | "Search" | "DuneChart" | "Ellipsis";
 export declare const CurrencySelector: ({ cell, defaultTextFormat, toolTipText, }: {
     cell: Cell | null | undefined;
     defaultTextFormat: string;

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"));
@@ -21,7 +22,6 @@ var _useDialog = require("../../hooks/useDialog");
 var _useAlert = require("../../hooks/useAlert");
 var _SplitColumn = require("../SplitColumn");
 var _LocationCondition = require("../LocationCondition");
-var _ConditionFormat = _interopRequireDefault(require("../ConditionFormat"));
 var _CustomButton = _interopRequireDefault(require("./CustomButton"));
 var _CustomColor = require("./CustomColor");
 var _FormatSearch = require("../FormatSearch");
@@ -407,7 +407,6 @@ var CurrencySelector = exports.CurrencySelector = function CurrencySelector(_a)
               return __generator(this, function (_a) {
                 switch (_a.label) {
                   case 0:
-                    console.log(opt, "kjbdnfgjbksndfjbkdnbksdfjkn");
                     if (!(opt.type === "crypto")) return [3, 2];
                     return [4, (0, _convertCellsToCrypto.convertCellsToCrypto)({
                       context: context,
@@ -610,6 +609,9 @@ var Toolbar = function Toolbar(_a) {
   var _p = (0, _react.useState)(false),
     showDataValidation = _p[0],
     setShowDataValidation = _p[1];
+  var _q = (0, _react.useState)(false),
+    showConditionalFormat = _q[0],
+    setShowConditionalFormat = _q[1];
   var dataVerificationClick = function dataVerificationClick(selectedCells) {
     var _a;
     var selection = _fortuneCore.api.getSelection(context);
@@ -628,8 +630,27 @@ var Toolbar = function Toolbar(_a) {
       setShowDataValidation(true);
     }, 100);
   };
+  var conditionalFormatClick = function conditionalFormatClick(selectedCells) {
+    var _a;
+    var selection = _fortuneCore.api.getSelection(context);
+    if (!selection && !selectedCells) {
+      setContext(function (ctx) {
+        _fortuneCore.api.setSelection(ctx, [{
+          row: [0, 0],
+          column: [0, 0]
+        }], {
+          id: context.currentSheetId
+        });
+      });
+    }
+    (_a = document.getElementById("conditional-format-button")) === null || _a === void 0 ? void 0 : _a.click();
+    setTimeout(function () {
+      setShowConditionalFormat(true);
+    }, 100);
+  };
   (0, _react.useEffect)(function () {
     window.dataVerificationClick = dataVerificationClick;
+    window.conditionalFormatClick = conditionalFormatClick;
   }, []);
   var getToolbarItem = (0, _react.useCallback)(function (name, i) {
     var _a, _b, _c, _d, _e, _f, _g;
@@ -746,7 +767,6 @@ var Toolbar = function Toolbar(_a) {
           return /*#__PURE__*/_react.default.createElement(_Select.Option, {
             key: value,
             onClick: function onClick() {
-              console.log("format", value);
               setOpen(false);
               setContext(function (ctx) {
                 var d = (0, _fortuneCore.getFlowdata)(ctx);
@@ -1126,18 +1146,16 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "conditionFormat") {
-      var items_4 = ["highlightCellRules", "itemSelectionRules", "-", "deleteRule"];
-      return /*#__PURE__*/_react.default.createElement(_Combo.default, {
-        iconId: "conditionFormat",
+      return /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
+        text: "Conditional Format",
+        placement: "bottom"
+      }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+        id: "conditionFormat",
+        iconId: name,
+        tooltip: tooltip,
         key: name,
-        tooltip: toolbar.conditionalFormat,
-        showArrow: false
-      }, function (setOpen) {
-        return /*#__PURE__*/_react.default.createElement(_ConditionFormat.default, {
-          items: items_4,
-          setOpen: setOpen
-        });
-      });
+        onClick: conditionalFormatClick
+      }));
     }
     if (name === "image") {
       return /*#__PURE__*/_react.default.createElement(_Button.default, {
@@ -1344,7 +1362,7 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "border") {
-      var items_5 = [{
+      var items_4 = [{
         text: border.borderTop,
         value: "border-top",
         icon: "BorderTop"
@@ -1399,7 +1417,7 @@ var Toolbar = function Toolbar(_a) {
       }, function (setOpen) {
         return /*#__PURE__*/_react.default.createElement("div", {
           className: "fortune-toolbar-select fortune-border-grid"
-        }, items_5.map(function (_a) {
+        }, items_4.map(function (_a) {
           var value = _a.value,
             icon = _a.icon;
           return /*#__PURE__*/_react.default.createElement("div", {
@@ -1420,7 +1438,7 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "freeze") {
-      var items_6 = [{
+      var items_5 = [{
         text: freezen.freezenRowRange,
         value: "freeze-row"
       }, {
@@ -1444,7 +1462,7 @@ var Toolbar = function Toolbar(_a) {
           });
         }
       }, function (setOpen) {
-        return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_6.map(function (_a) {
+        return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_5.map(function (_a) {
           var text = _a.text,
             value = _a.value;
           return /*#__PURE__*/_react.default.createElement(_Select.Option, {
@@ -1466,7 +1484,7 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "text-wrap") {
-      var items_7 = [{
+      var items_6 = [{
         text: textWrap.clip,
         iconId: "text-clip",
         value: "clip"
@@ -1479,9 +1497,9 @@ var Toolbar = function Toolbar(_a) {
         iconId: "text-wrap",
         value: "wrap"
       }];
-      var curr_3 = items_7[0];
+      var curr_3 = items_6[0];
       if ((cell === null || cell === void 0 ? void 0 : cell.tb) != null) {
-        curr_3 = _lodash.default.get(items_7, cell.tb);
+        curr_3 = _lodash.default.get(items_6, cell.tb);
       }
       return /*#__PURE__*/_react.default.createElement(_Combo.default, {
         iconId: curr_3.iconId,
@@ -1498,7 +1516,7 @@ var Toolbar = function Toolbar(_a) {
             justifyContent: "center",
             gap: 4
           }
-        }, items_7.map(function (_a) {
+        }, items_6.map(function (_a) {
           var iconId = _a.iconId,
             value = _a.value;
           return /*#__PURE__*/_react.default.createElement(_ui.IconButton, {
@@ -1529,7 +1547,7 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "text-rotation") {
-      var items_8 = [{
+      var items_7 = [{
         text: rotation.none,
         iconId: "text-rotation-none",
         value: "none"
@@ -1554,9 +1572,9 @@ var Toolbar = function Toolbar(_a) {
         iconId: "text-rotation-down",
         value: "rotation-down"
       }];
-      var curr = items_8[0];
+      var curr = items_7[0];
       if ((cell === null || cell === void 0 ? void 0 : cell.tr) != null) {
-        curr = _lodash.default.get(items_8, cell.tr);
+        curr = _lodash.default.get(items_7, cell.tr);
       }
       return /*#__PURE__*/_react.default.createElement(_Combo.default, {
         iconId: curr.iconId,
@@ -1564,7 +1582,7 @@ var Toolbar = function Toolbar(_a) {
         tooltip: toolbar.textRotate,
         showArrow: false
       }, function (setOpen) {
-        return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_8.map(function (_a) {
+        return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_7.map(function (_a) {
           var text = _a.text,
             iconId = _a.iconId,
             value = _a.value;
@@ -1589,7 +1607,7 @@ var Toolbar = function Toolbar(_a) {
       });
     }
     if (name === "filter") {
-      var items_9 = [{
+      var items_8 = [{
         iconId: "sort-asc",
         value: "sort-asc",
         text: sort.asc,
@@ -1639,7 +1657,7 @@ var Toolbar = function Toolbar(_a) {
           style: {
             minWidth: "11.25rem"
           }
-        }, items_9.map(function (_a, index) {
+        }, items_8.map(function (_a, index) {
           var text = _a.text,
             iconId = _a.iconId,
             value = _a.value,
@@ -1694,6 +1712,9 @@ 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,
+    context: context
   }), /*#__PURE__*/_react.default.createElement("input", {
     id: "fortune-img-upload",
     className: "test-fortune-img-upload",

package/lib/components/Workbook/api.d.ts

@@ -1197,4 +1197,8 @@ export declare function generateAPIs(context: Context, setContext: (recipe: (ctx
     getRefs: () => any;
     getShowDialog: () => typeof useDialog;
     getSplitColComponent: () => import("react").FC<{}>;
+    getConditionalFormatComponent: () => import("react").FC<{
+        type?: string | undefined;
+        context?: any;
+    }>;
 };

package/lib/components/Workbook/api.js

@@ -10,6 +10,7 @@ var _lodash = _interopRequireDefault(require("lodash"));
 var _cryptoApi = require("../../utils/cryptoApi");
 var _useDialog = require("../../hooks/useDialog");
 var _SplitColumn = require("../../components/SplitColumn");
+var _ConditionRules = _interopRequireDefault(require("../ConditionFormat/ConditionRules"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 var __assign = void 0 && (void 0).__assign || function () {
   __assign = Object.assign || function (t) {
@@ -459,6 +460,9 @@ function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cel
     },
     getSplitColComponent: function getSplitColComponent() {
       return _SplitColumn.SplitColumn;
+    },
+    getConditionalFormatComponent: function getConditionalFormatComponent() {
+      return _ConditionRules.default;
     }
   };
 }

package/lib/components/Workbook/index.d.ts

@@ -1204,5 +1204,9 @@ declare const Workbook: React.ForwardRefExoticComponent<Settings & AdditionalPro
     getRefs: () => any;
     getShowDialog: () => typeof import("../../hooks/useDialog").useDialog;
     getSplitColComponent: () => React.FC<{}>;
+    getConditionalFormatComponent: () => React.FC<{
+        type?: string | undefined;
+        context?: any;
+    }>;
 }>>;
 export default Workbook;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fileverse-dev/fortune-react",
-  "version": "1.2.67",
+  "version": "1.2.69-conditional-1",
   "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.67",
+    "@fileverse-dev/fortune-core": "1.2.69-conditional-1",
     "@fileverse/ui": "^4.1.7-patch-40",
     "@tippyjs/react": "^4.2.6",
     "@types/regenerator-runtime": "^0.13.6",