@fileverse-dev/fortune-react 1.2.68 → 1.2.69

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 (33) hide show
  1. package/es/components/ConditionFormat/ConditionRules.d.ts +3 -1
  2. package/es/components/ConditionFormat/ConditionRules.js +423 -80
  3. package/es/components/ConditionFormat/formating.css +103 -0
  4. package/es/components/ConditionFormat/index.css +62 -5
  5. package/es/components/ConditionFormat/index.js +2 -6
  6. package/es/components/ContextMenu/index.js +10 -41
  7. package/es/components/DataVerification/RangeDialog.js +0 -15
  8. package/es/components/SheetOverlay/helper.d.ts +1 -0
  9. package/es/components/SheetOverlay/helper.js +1 -1
  10. package/es/components/Toolbar/conditionalFormatPortal.d.ts +6 -0
  11. package/es/components/Toolbar/conditionalFormatPortal.js +13 -0
  12. package/es/components/Toolbar/index.d.ts +1 -1
  13. package/es/components/Toolbar/index.js +49 -28
  14. package/es/components/Workbook/api.d.ts +4 -0
  15. package/es/components/Workbook/api.js +4 -0
  16. package/es/components/Workbook/index.d.ts +4 -0
  17. package/lib/components/ConditionFormat/ConditionRules.d.ts +3 -1
  18. package/lib/components/ConditionFormat/ConditionRules.js +421 -78
  19. package/lib/components/ConditionFormat/formating.css +103 -0
  20. package/lib/components/ConditionFormat/index.css +62 -5
  21. package/lib/components/ConditionFormat/index.js +1 -5
  22. package/lib/components/ContextMenu/index.js +10 -41
  23. package/lib/components/DataVerification/RangeDialog.js +0 -15
  24. package/lib/components/SheetOverlay/helper.d.ts +1 -0
  25. package/lib/components/SheetOverlay/helper.js +1 -0
  26. package/lib/components/Toolbar/conditionalFormatPortal.d.ts +6 -0
  27. package/lib/components/Toolbar/conditionalFormatPortal.js +20 -0
  28. package/lib/components/Toolbar/index.d.ts +1 -1
  29. package/lib/components/Toolbar/index.js +49 -28
  30. package/lib/components/Workbook/api.d.ts +4 -0
  31. package/lib/components/Workbook/api.js +4 -0
  32. package/lib/components/Workbook/index.d.ts +4 -0
  33. package/package.json +2 -2
@@ -0,0 +1,103 @@
1
+ .toolbar-container {
2
+ width: 100%;
3
+ max-width: 896px;
4
+ background-color: white;
5
+ border-radius: 4px;
6
+ border: 1px solid hsl(var(--color-border-default, #E8EBEC));
7
+ overflow: hidden;
8
+ }
9
+
10
+ .toolbar-header {
11
+ background-color: #dcfce7;
12
+ padding: 4px 16px;
13
+ border-radius: var(--border-radius-sm, 4px) var(--border-radius-sm, 4px) var(--border-radius-none, 0) var(--border-radius-none, 0);
14
+ border-bottom: 1px solid hsl(var(--color-border-default, #E8EBEC));
15
+ background: hsl(var(--color-bg-success-light, #DDFBDF));
16
+ }
17
+
18
+ .toolbar-title {
19
+ color: hsl(var(--color-text-success, #177E23));
20
+ font-family: "Helvetica Neue";
21
+ font-size: 14px;
22
+ font-style: normal;
23
+ font-weight: 400;
24
+ line-height: 20px;
25
+ }
26
+
27
+ .toolbar-content {
28
+ padding: 4px;
29
+ display: flex;
30
+ gap: 16px;
31
+ align-items: center;
32
+ }
33
+
34
+ .toolbar-button {
35
+ width: 48px;
36
+ height: 48px;
37
+ display: flex;
38
+ align-items: center;
39
+ justify-content: center;
40
+ background-color: white;
41
+ border: 1px solid #e5e7eb;
42
+ border-radius: 6px;
43
+ cursor: pointer;
44
+ transition: all 0.2s ease;
45
+ padding: 0;
46
+ }
47
+
48
+ .toolbar-button:hover {
49
+ background-color: #f9fafb;
50
+ border-color: #d1d5db;
51
+ }
52
+
53
+ .toolbar-button:active {
54
+ transform: scale(0.95);
55
+ }
56
+
57
+ .button-text {
58
+ font-size: 24px;
59
+ color: #1f2937;
60
+ font-weight: 500;
61
+ }
62
+
63
+ .button-text.bold {
64
+ font-weight: 700;
65
+ }
66
+
67
+ .button-text.italic {
68
+ font-style: italic;
69
+ font-family: Georgia, serif;
70
+ }
71
+
72
+ .button-text.underline {
73
+ text-decoration: underline;
74
+ text-decoration-thickness: 2px;
75
+ text-underline-offset: 2px;
76
+ }
77
+
78
+ .button-text.strikethrough {
79
+ text-decoration: line-through;
80
+ text-decoration-thickness: 2px;
81
+ }
82
+
83
+ .button-text.color-button {
84
+ position: relative;
85
+ color: #16a34a;
86
+ }
87
+
88
+ .button-text.color-button::after {
89
+ content: "";
90
+ position: absolute;
91
+ bottom: -4px;
92
+ left: 0;
93
+ right: 0;
94
+ height: 3px;
95
+ background-color: #16a34a;
96
+ border-radius: 2px;
97
+ }
98
+
99
+ .button-icon {
100
+ width: 24px;
101
+ height: 24px;
102
+ color: #1f2937;
103
+ }
@@ -115,7 +115,7 @@
115
115
  }
116
116
 
117
117
  .condition-rules-set-title {
118
- margin: 6px 0px;
118
+ margin: 0px 0px 16px 0px;
119
119
  }
120
120
 
121
121
  .condition-rules-setbox {
@@ -149,13 +149,23 @@
149
149
  }
150
150
 
151
151
  .condition-rules-select-color {
152
- background: hsl(var(--color-bg-default));
153
- width: 2.5rem;
154
- height: 1.5rem;
155
- border-radius: 4px;
152
+ background: transparent;
153
+ width: 16px;
154
+ height: 4px;
155
+ border-radius: 0px;
156
+ border: none;
156
157
  padding: 0;
157
158
  margin: 0;
158
159
  cursor: pointer;
160
+ outline: none;
161
+ }
162
+
163
+ input[type="color"]::-webkit-color-swatch-wrapper {
164
+ padding: 0;
165
+ }
166
+
167
+ input[type="color"]::-webkit-color-swatch {
168
+ border: 1px solid #d4d4d4;
159
169
  }
160
170
 
161
171
  .condition-rules-between-box {
@@ -210,3 +220,50 @@ input[type="number"].condition-rules-project-input::-webkit-inner-spin-button {
210
220
  input[type="number"].condition-rules-project-input {
211
221
  -moz-appearance: textfield;
212
222
  }
223
+
224
+ .condition-list-parent {
225
+ padding: 12px 8px;
226
+ gap: 12px;
227
+ }
228
+
229
+ .condition-list-parent:hover {
230
+ background-color: hsl(var(--color-bg-default-hover));
231
+ }
232
+
233
+ .condition-list-pill {
234
+ display: flex;
235
+ align-items: center;
236
+ justify-content: center;
237
+ width: 44px;
238
+ height: 56px;
239
+ padding: 4px 16px;
240
+ gap: 10px;
241
+ border-radius: 4px;
242
+ border: 1px solid #E8EBEC;
243
+ }
244
+
245
+ .condition-list-text {
246
+ font-family: "Helvetica Neue";
247
+ font-size: 14px;
248
+ font-style: normal;
249
+ font-weight: 500;
250
+ line-height: 20px;
251
+ }
252
+
253
+ .condition-list-type {
254
+ color: hsl(var(--color-text-default, #363B3F));
255
+ font-family: "Helvetica Neue";
256
+ font-size: 14px;
257
+ font-style: normal;
258
+ font-weight: 500;
259
+ line-height: 20px;
260
+ }
261
+
262
+ .condition-list-range {
263
+ color: hsl(var(--color-text-secondary, #77818A));
264
+ font-family: "Helvetica Neue";
265
+ font-size: 12px;
266
+ font-style: normal;
267
+ font-weight: 400;
268
+ line-height: 16px;
269
+ }
@@ -235,11 +235,7 @@ var ConditionalFormat = function ConditionalFormat(_a) {
235
235
  style: {
236
236
  padding: "6px 10px"
237
237
  },
238
- onClick: function onClick() {
239
- setContext(function (ctx) {
240
- (0, _fortuneCore.updateItem)(ctx, "delSheet");
241
- });
242
- },
238
+ onClick: function onClick() {},
243
239
  tabIndex: 0
244
240
  }, conditionformat[v]);
245
241
  }))));
@@ -20,7 +20,6 @@ var _Divider = _interopRequireDefault(require("./Divider"));
20
20
  require("./index.css");
21
21
  var _Menu = _interopRequireDefault(require("./Menu"));
22
22
  require("tippy.js/dist/tippy.css");
23
- var _ConditionFormat = _interopRequireDefault(require("../ConditionFormat"));
24
23
  var _SVGIcon = _interopRequireDefault(require("../SVGIcon"));
25
24
  var _LucideIcon = require("../../components/SheetOverlay/LucideIcon");
26
25
  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() {
995
994
  }), /*#__PURE__*/_react.default.createElement("p", null, rightclick.link)));
996
995
  }
997
996
  if (name === "conditionFormat") {
998
- var closeContextMenu = function closeContextMenu() {
999
- return setContext(function (ctx) {
1000
- ctx.contextMenu = {};
1001
- });
1002
- };
1003
- return /*#__PURE__*/_react.default.createElement(_react2.default, {
997
+ return /*#__PURE__*/_react.default.createElement(_Menu.default, {
1004
998
  key: name,
1005
- placement: "right-start",
1006
- interactive: true,
1007
- interactiveBorder: 50,
1008
- offset: [0, 0],
1009
- arrow: false,
1010
- zIndex: 3000,
1011
- appendTo: document.body,
1012
- onShow: function onShow() {
1013
- setActiveMenu("conditionFormat");
1014
- },
1015
- onHide: function onHide() {
1016
- if (activeMenu === "conditionFormat") setActiveMenu("");
1017
- },
1018
- content: /*#__PURE__*/_react.default.createElement("div", {
1019
- style: {
1020
- minWidth: 220
1021
- }
1022
- }, /*#__PURE__*/_react.default.createElement(_ConditionFormat.default, {
1023
- items: ["highlightCellRules", "itemSelectionRules", "-", "deleteRule"],
1024
- setOpen: closeContextMenu
1025
- })),
1026
- trigger: "mouseenter focus",
1027
- hideOnClick: false
1028
- }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Menu.default, {
1029
- isActive: activeMenu === "conditionFormat"
1030
- }, /*#__PURE__*/_react.default.createElement("div", {
1031
- className: "flex items-center justify-between w-full"
999
+ onClick: function onClick() {
1000
+ if (context.allowEdit === false) return;
1001
+ setContext(function (draftCtx) {
1002
+ draftCtx.contextMenu = {};
1003
+ });
1004
+ window.conditionalFormatClick(context.luckysheet_select_save);
1005
+ }
1032
1006
  }, /*#__PURE__*/_react.default.createElement("div", {
1033
- className: "flex items-center gap-2 context-item"
1007
+ className: "context-item"
1034
1008
  }, /*#__PURE__*/_react.default.createElement(_ui.LucideIcon, {
1035
1009
  name: "PaintbrushVertical"
1036
- }), /*#__PURE__*/_react.default.createElement("p", null, rightclick.conditionFormat || "Conditional Format")), /*#__PURE__*/_react.default.createElement(_ui.LucideIcon, {
1037
- name: "ChevronRight",
1038
- width: 16,
1039
- height: 16,
1040
- className: "color-text-secondary w-4 h-4"
1041
- })))));
1010
+ }), /*#__PURE__*/_react.default.createElement("p", null, "Conditional formatting")));
1042
1011
  }
1043
1012
  if (name === "clear-format") {
1044
1013
  return /*#__PURE__*/_react.default.createElement(_Menu.default, {
@@ -10,7 +10,6 @@ var _ui = require("@fileverse/ui");
10
10
  var _react = _interopRequireWildcard(require("react"));
11
11
  var _context = _interopRequireDefault(require("../../context"));
12
12
  var _useDialog = require("../../hooks/useDialog");
13
- var _ConditionRules = _interopRequireDefault(require("../ConditionFormat/ConditionRules"));
14
13
  require("./index.css");
15
14
  var _getDisplayedRangeTxt = require("./getDisplayedRangeTxt");
16
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -33,20 +32,6 @@ var RangeDialog = function RangeDialog() {
33
32
  ctx.rangeDialog.singleSelect = false;
34
33
  });
35
34
  (_a = document.getElementById("data-verification-button")) === null || _a === void 0 ? void 0 : _a.click();
36
- if (!context.rangeDialog) return;
37
- var rangeDialogType = context.rangeDialog.type;
38
- if (rangeDialogType.indexOf("between") >= 0) {
39
- showDialog(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, {
40
- type: "between"
41
- }), undefined, (0, _fortuneCore.locale)(context).conditionformat.conditionformat_between);
42
- return;
43
- }
44
- if (rangeDialogType.indexOf("conditionRules") >= 0) {
45
- var rulesType = rangeDialogType.substring("conditionRules".length, rangeDialogType.length);
46
- showDialog(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, {
47
- type: rulesType
48
- }), undefined, (0, _fortuneCore.locale)(context).conditionformat["conditionformat_".concat(rulesType)]);
49
- }
50
35
  }, [setContext, showDialog, context]);
51
36
  (0, _react.useEffect)(function () {
52
37
  setRangeTxt2((0, _getDisplayedRangeTxt.getDisplayedRangeTxt)(context));
@@ -2,6 +2,7 @@ export declare function moveCursorToEnd(editableDiv: HTMLDivElement): void;
2
2
  export declare function getCursorPosition(editableDiv: HTMLDivElement): number;
3
3
  export declare function isLetterNumberPattern(str: string): boolean;
4
4
  export declare function removeLastSpan(htmlString: string): string;
5
+ export declare function numberToColumn(colNumber: number): string;
5
6
  export declare function incrementColumn(cell: string): string;
6
7
  export declare function decrementColumn(cell: string): string;
7
8
  export declare function incrementRow(cell: string): string;
@@ -11,6 +11,7 @@ exports.incrementColumn = incrementColumn;
11
11
  exports.incrementRow = incrementRow;
12
12
  exports.isLetterNumberPattern = isLetterNumberPattern;
13
13
  exports.moveCursorToEnd = moveCursorToEnd;
14
+ exports.numberToColumn = numberToColumn;
14
15
  exports.removeLastSpan = removeLastSpan;
15
16
  function moveCursorToEnd(editableDiv) {
16
17
  editableDiv.focus();
@@ -0,0 +1,6 @@
1
+ import React from "react";
2
+ declare const ConditionalFormatPortal: ({ visible, context, }: {
3
+ visible: boolean;
4
+ context: any;
5
+ }) => React.ReactPortal | null;
6
+ export default ConditionalFormatPortal;
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _reactDom = require("react-dom");
9
+ var _ConditionRules = _interopRequireDefault(require("../ConditionFormat/ConditionRules"));
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
+ var ConditionalFormatPortal = function ConditionalFormatPortal(_a) {
12
+ var visible = _a.visible,
13
+ context = _a.context;
14
+ var container = document.getElementById("placeholder-conditional-format");
15
+ if (!visible || !container) return null;
16
+ return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_ConditionRules.default, {
17
+ context: context
18
+ }), container);
19
+ };
20
+ var _default = exports.default = ConditionalFormatPortal;
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  import { Cell } from "@fileverse-dev/fortune-core";
3
3
  import "./index.css";
4
- 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";
4
+ 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";
5
5
  export declare const CurrencySelector: ({ cell, defaultTextFormat, toolTipText, }: {
6
6
  cell: Cell | null | undefined;
7
7
  defaultTextFormat: string;
@@ -10,6 +10,7 @@ var _fortuneCore = require("@fileverse-dev/fortune-core");
10
10
  var _lodash = _interopRequireDefault(require("lodash"));
11
11
  var _ui = require("@fileverse/ui");
12
12
  var _dataVerificationPortal = _interopRequireDefault(require("./dataVerificationPortal"));
13
+ var _conditionalFormatPortal = _interopRequireDefault(require("./conditionalFormatPortal"));
13
14
  var _context = _interopRequireDefault(require("../../context"));
14
15
  require("./index.css");
15
16
  var _Button = _interopRequireDefault(require("./Button"));
@@ -21,7 +22,6 @@ var _useDialog = require("../../hooks/useDialog");
21
22
  var _useAlert = require("../../hooks/useAlert");
22
23
  var _SplitColumn = require("../SplitColumn");
23
24
  var _LocationCondition = require("../LocationCondition");
24
- var _ConditionFormat = _interopRequireDefault(require("../ConditionFormat"));
25
25
  var _CustomButton = _interopRequireDefault(require("./CustomButton"));
26
26
  var _CustomColor = require("./CustomColor");
27
27
  var _FormatSearch = require("../FormatSearch");
@@ -407,7 +407,6 @@ var CurrencySelector = exports.CurrencySelector = function CurrencySelector(_a)
407
407
  return __generator(this, function (_a) {
408
408
  switch (_a.label) {
409
409
  case 0:
410
- console.log(opt, "kjbdnfgjbksndfjbkdnbksdfjkn");
411
410
  if (!(opt.type === "crypto")) return [3, 2];
412
411
  return [4, (0, _convertCellsToCrypto.convertCellsToCrypto)({
413
412
  context: context,
@@ -610,6 +609,9 @@ var Toolbar = function Toolbar(_a) {
610
609
  var _p = (0, _react.useState)(false),
611
610
  showDataValidation = _p[0],
612
611
  setShowDataValidation = _p[1];
612
+ var _q = (0, _react.useState)(false),
613
+ showConditionalFormat = _q[0],
614
+ setShowConditionalFormat = _q[1];
613
615
  var dataVerificationClick = function dataVerificationClick(selectedCells) {
614
616
  var _a;
615
617
  var selection = _fortuneCore.api.getSelection(context);
@@ -628,8 +630,27 @@ var Toolbar = function Toolbar(_a) {
628
630
  setShowDataValidation(true);
629
631
  }, 100);
630
632
  };
633
+ var conditionalFormatClick = function conditionalFormatClick(selectedCells) {
634
+ var _a;
635
+ var selection = _fortuneCore.api.getSelection(context);
636
+ if (!selection && !selectedCells) {
637
+ setContext(function (ctx) {
638
+ _fortuneCore.api.setSelection(ctx, [{
639
+ row: [0, 0],
640
+ column: [0, 0]
641
+ }], {
642
+ id: context.currentSheetId
643
+ });
644
+ });
645
+ }
646
+ (_a = document.getElementById("conditional-format-button")) === null || _a === void 0 ? void 0 : _a.click();
647
+ setTimeout(function () {
648
+ setShowConditionalFormat(true);
649
+ }, 100);
650
+ };
631
651
  (0, _react.useEffect)(function () {
632
652
  window.dataVerificationClick = dataVerificationClick;
653
+ window.conditionalFormatClick = conditionalFormatClick;
633
654
  }, []);
634
655
  var getToolbarItem = (0, _react.useCallback)(function (name, i) {
635
656
  var _a, _b, _c, _d, _e, _f, _g;
@@ -746,7 +767,6 @@ var Toolbar = function Toolbar(_a) {
746
767
  return /*#__PURE__*/_react.default.createElement(_Select.Option, {
747
768
  key: value,
748
769
  onClick: function onClick() {
749
- console.log("format", value);
750
770
  setOpen(false);
751
771
  setContext(function (ctx) {
752
772
  var d = (0, _fortuneCore.getFlowdata)(ctx);
@@ -1126,18 +1146,16 @@ var Toolbar = function Toolbar(_a) {
1126
1146
  });
1127
1147
  }
1128
1148
  if (name === "conditionFormat") {
1129
- var items_4 = ["highlightCellRules", "itemSelectionRules", "-", "deleteRule"];
1130
- return /*#__PURE__*/_react.default.createElement(_Combo.default, {
1131
- iconId: "conditionFormat",
1149
+ return /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
1150
+ text: "Conditional Format",
1151
+ placement: "bottom"
1152
+ }, /*#__PURE__*/_react.default.createElement(_Button.default, {
1153
+ id: "conditionFormat",
1154
+ iconId: name,
1155
+ tooltip: tooltip,
1132
1156
  key: name,
1133
- tooltip: toolbar.conditionalFormat,
1134
- showArrow: false
1135
- }, function (setOpen) {
1136
- return /*#__PURE__*/_react.default.createElement(_ConditionFormat.default, {
1137
- items: items_4,
1138
- setOpen: setOpen
1139
- });
1140
- });
1157
+ onClick: conditionalFormatClick
1158
+ }));
1141
1159
  }
1142
1160
  if (name === "image") {
1143
1161
  return /*#__PURE__*/_react.default.createElement(_Button.default, {
@@ -1344,7 +1362,7 @@ var Toolbar = function Toolbar(_a) {
1344
1362
  });
1345
1363
  }
1346
1364
  if (name === "border") {
1347
- var items_5 = [{
1365
+ var items_4 = [{
1348
1366
  text: border.borderTop,
1349
1367
  value: "border-top",
1350
1368
  icon: "BorderTop"
@@ -1399,7 +1417,7 @@ var Toolbar = function Toolbar(_a) {
1399
1417
  }, function (setOpen) {
1400
1418
  return /*#__PURE__*/_react.default.createElement("div", {
1401
1419
  className: "fortune-toolbar-select fortune-border-grid"
1402
- }, items_5.map(function (_a) {
1420
+ }, items_4.map(function (_a) {
1403
1421
  var value = _a.value,
1404
1422
  icon = _a.icon;
1405
1423
  return /*#__PURE__*/_react.default.createElement("div", {
@@ -1420,7 +1438,7 @@ var Toolbar = function Toolbar(_a) {
1420
1438
  });
1421
1439
  }
1422
1440
  if (name === "freeze") {
1423
- var items_6 = [{
1441
+ var items_5 = [{
1424
1442
  text: freezen.freezenRowRange,
1425
1443
  value: "freeze-row"
1426
1444
  }, {
@@ -1444,7 +1462,7 @@ var Toolbar = function Toolbar(_a) {
1444
1462
  });
1445
1463
  }
1446
1464
  }, function (setOpen) {
1447
- return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_6.map(function (_a) {
1465
+ return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_5.map(function (_a) {
1448
1466
  var text = _a.text,
1449
1467
  value = _a.value;
1450
1468
  return /*#__PURE__*/_react.default.createElement(_Select.Option, {
@@ -1466,7 +1484,7 @@ var Toolbar = function Toolbar(_a) {
1466
1484
  });
1467
1485
  }
1468
1486
  if (name === "text-wrap") {
1469
- var items_7 = [{
1487
+ var items_6 = [{
1470
1488
  text: textWrap.clip,
1471
1489
  iconId: "text-clip",
1472
1490
  value: "clip"
@@ -1479,9 +1497,9 @@ var Toolbar = function Toolbar(_a) {
1479
1497
  iconId: "text-wrap",
1480
1498
  value: "wrap"
1481
1499
  }];
1482
- var curr_3 = items_7[0];
1500
+ var curr_3 = items_6[0];
1483
1501
  if ((cell === null || cell === void 0 ? void 0 : cell.tb) != null) {
1484
- curr_3 = _lodash.default.get(items_7, cell.tb);
1502
+ curr_3 = _lodash.default.get(items_6, cell.tb);
1485
1503
  }
1486
1504
  return /*#__PURE__*/_react.default.createElement(_Combo.default, {
1487
1505
  iconId: curr_3.iconId,
@@ -1498,7 +1516,7 @@ var Toolbar = function Toolbar(_a) {
1498
1516
  justifyContent: "center",
1499
1517
  gap: 4
1500
1518
  }
1501
- }, items_7.map(function (_a) {
1519
+ }, items_6.map(function (_a) {
1502
1520
  var iconId = _a.iconId,
1503
1521
  value = _a.value;
1504
1522
  return /*#__PURE__*/_react.default.createElement(_ui.IconButton, {
@@ -1529,7 +1547,7 @@ var Toolbar = function Toolbar(_a) {
1529
1547
  });
1530
1548
  }
1531
1549
  if (name === "text-rotation") {
1532
- var items_8 = [{
1550
+ var items_7 = [{
1533
1551
  text: rotation.none,
1534
1552
  iconId: "text-rotation-none",
1535
1553
  value: "none"
@@ -1554,9 +1572,9 @@ var Toolbar = function Toolbar(_a) {
1554
1572
  iconId: "text-rotation-down",
1555
1573
  value: "rotation-down"
1556
1574
  }];
1557
- var curr = items_8[0];
1575
+ var curr = items_7[0];
1558
1576
  if ((cell === null || cell === void 0 ? void 0 : cell.tr) != null) {
1559
- curr = _lodash.default.get(items_8, cell.tr);
1577
+ curr = _lodash.default.get(items_7, cell.tr);
1560
1578
  }
1561
1579
  return /*#__PURE__*/_react.default.createElement(_Combo.default, {
1562
1580
  iconId: curr.iconId,
@@ -1564,7 +1582,7 @@ var Toolbar = function Toolbar(_a) {
1564
1582
  tooltip: toolbar.textRotate,
1565
1583
  showArrow: false
1566
1584
  }, function (setOpen) {
1567
- return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_8.map(function (_a) {
1585
+ return /*#__PURE__*/_react.default.createElement(_Select.default, null, items_7.map(function (_a) {
1568
1586
  var text = _a.text,
1569
1587
  iconId = _a.iconId,
1570
1588
  value = _a.value;
@@ -1589,7 +1607,7 @@ var Toolbar = function Toolbar(_a) {
1589
1607
  });
1590
1608
  }
1591
1609
  if (name === "filter") {
1592
- var items_9 = [{
1610
+ var items_8 = [{
1593
1611
  iconId: "sort-asc",
1594
1612
  value: "sort-asc",
1595
1613
  text: sort.asc,
@@ -1639,7 +1657,7 @@ var Toolbar = function Toolbar(_a) {
1639
1657
  style: {
1640
1658
  minWidth: "11.25rem"
1641
1659
  }
1642
- }, items_9.map(function (_a, index) {
1660
+ }, items_8.map(function (_a, index) {
1643
1661
  var text = _a.text,
1644
1662
  iconId = _a.iconId,
1645
1663
  value = _a.value,
@@ -1694,6 +1712,9 @@ var Toolbar = function Toolbar(_a) {
1694
1712
  "aria-label": toolbar.toolbar
1695
1713
  }, /*#__PURE__*/_react.default.createElement(_dataVerificationPortal.default, {
1696
1714
  visible: showDataValidation
1715
+ }), /*#__PURE__*/_react.default.createElement(_conditionalFormatPortal.default, {
1716
+ visible: showConditionalFormat,
1717
+ context: context
1697
1718
  }), /*#__PURE__*/_react.default.createElement("input", {
1698
1719
  id: "fortune-img-upload",
1699
1720
  className: "test-fortune-img-upload",
@@ -1197,4 +1197,8 @@ export declare function generateAPIs(context: Context, setContext: (recipe: (ctx
1197
1197
  getRefs: () => any;
1198
1198
  getShowDialog: () => typeof useDialog;
1199
1199
  getSplitColComponent: () => import("react").FC<{}>;
1200
+ getConditionalFormatComponent: () => import("react").FC<{
1201
+ type?: string | undefined;
1202
+ context?: any;
1203
+ }>;
1200
1204
  };
@@ -10,6 +10,7 @@ var _lodash = _interopRequireDefault(require("lodash"));
10
10
  var _cryptoApi = require("../../utils/cryptoApi");
11
11
  var _useDialog = require("../../hooks/useDialog");
12
12
  var _SplitColumn = require("../../components/SplitColumn");
13
+ var _ConditionRules = _interopRequireDefault(require("../ConditionFormat/ConditionRules"));
13
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
15
  var __assign = void 0 && (void 0).__assign || function () {
15
16
  __assign = Object.assign || function (t) {
@@ -459,6 +460,9 @@ function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cel
459
460
  },
460
461
  getSplitColComponent: function getSplitColComponent() {
461
462
  return _SplitColumn.SplitColumn;
463
+ },
464
+ getConditionalFormatComponent: function getConditionalFormatComponent() {
465
+ return _ConditionRules.default;
462
466
  }
463
467
  };
464
468
  }
@@ -1204,5 +1204,9 @@ declare const Workbook: React.ForwardRefExoticComponent<Settings & AdditionalPro
1204
1204
  getRefs: () => any;
1205
1205
  getShowDialog: () => typeof import("../../hooks/useDialog").useDialog;
1206
1206
  getSplitColComponent: () => React.FC<{}>;
1207
+ getConditionalFormatComponent: () => React.FC<{
1208
+ type?: string | undefined;
1209
+ context?: any;
1210
+ }>;
1207
1211
  }>>;
1208
1212
  export default Workbook;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fileverse-dev/fortune-react",
3
- "version": "1.2.68",
3
+ "version": "1.2.69",
4
4
  "main": "lib/index.js",
5
5
  "types": "lib/index.d.ts",
6
6
  "module": "es/index.js",
@@ -16,7 +16,7 @@
16
16
  "tsc": "tsc"
17
17
  },
18
18
  "dependencies": {
19
- "@fileverse-dev/fortune-core": "1.2.68",
19
+ "@fileverse-dev/fortune-core": "1.2.69",
20
20
  "@fileverse/ui": "^4.1.7-patch-40",
21
21
  "@tippyjs/react": "^4.2.6",
22
22
  "@types/regenerator-runtime": "^0.13.6",