@fileverse-dev/fortune-react 1.0.2-mod-34 → 1.0.2-mod-36

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.
package/dist/index.js CHANGED
@@ -184,7 +184,7 @@ function _regenerator() {
184
184
  i = p[t],
185
185
  d = G.p,
186
186
  l = i[2];
187
- r > 3 ? (o = l === n) && (c = i[4] || 3, u = i[5] === e ? i[3] : i[5], i[4] = 3, i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
187
+ r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
188
188
  }
189
189
  if (o || r > 1) return a;
190
190
  throw y = !0, n;
@@ -2571,8 +2571,18 @@ function useDialog() {
2571
2571
  };
2572
2572
  }
2573
2573
 
2574
+ var datepickerStyles = "\n .datepicker-toggle {\n display: inline-block;\n position: relative;\n width: 100%;\n }\n \n .datepicker-toggle-button {\n opacity: 0.3;\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n width: 16px;\n height: 16px;\n background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxyZWN0IHg9IjMiIHk9IjQiIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgcng9IjIiIHJ5PSIyIj48L3JlY3Q+PGxpbmUgeDE9IjE2IiB5MT0iMiIgeDI9IjE2IiB5Mj0iNiI+PC9saW5lPjxsaW5lIHgxPSI4IiB5MT0iMiIgeDI9IjgiIHkyPSI2Ij48L2xpbmU+PGxpbmUgeDE9IjMiIHkxPSIxMCIgeDI9IjIxIiB5Mj0iMTAiPjwvbGluZT48L3N2Zz4=');\n background-repeat: no-repeat;\n background-position: center;\n pointer-events: none;\n }\n \n .datepicker-input {\n width: 100%;\n padding: 8px 12px;\n border: 1px solid #e2e8f0;\n border-radius: 6px;\n font-size: 14px;\n line-height: 1.5;\n color: #1a202c;\n background-color: #fff;\n cursor: pointer;\n }\n \n .datepicker-input::-webkit-calendar-picker-indicator {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n cursor: pointer;\n opacity: 0;\n }\n \n .datepicker-input:focus {\n outline: none;\n border-color: #4299e1;\n box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.1);\n }\n";
2575
+ var injectDatepickerStyles = function injectDatepickerStyles() {
2576
+ if (typeof document !== "undefined") {
2577
+ var styleSheet = document.createElement("style");
2578
+ styleSheet.textContent = datepickerStyles;
2579
+ document.head.appendChild(styleSheet);
2580
+ }
2581
+ };
2582
+
2583
+ injectDatepickerStyles();
2574
2584
  var DataVerification = function DataVerification() {
2575
- var _context$dataVerifica, _context$dataVerifica2, _context$dataVerifica3, _context$dataVerifica4, _context$dataVerifica5, _context$dataVerifica6, _context$dataVerifica7, _context$dataVerifica8, _context$dataVerifica9, _context$dataVerifica0, _context$dataVerifica1, _context$dataVerifica10, _context$dataVerifica11, _context$dataVerifica12, _context$dataVerifica13, _context$dataVerifica14, _context$dataVerifica15, _context$dataVerifica16, _context$dataVerifica17, _context$dataVerifica18, _context$dataVerifica19, _context$dataVerifica20, _context$dataVerifica21, _context$dataVerifica22, _context$dataVerifica23;
2585
+ var _context$dataVerifica, _context$dataVerifica2, _context$dataVerifica3, _context$dataVerifica4, _context$dataVerifica5, _context$dataVerifica6, _context$dataVerifica7, _context$dataVerifica8, _context$dataVerifica9, _context$dataVerifica0, _context$dataVerifica1, _context$dataVerifica10, _context$dataVerifica11;
2576
2586
  var _useContext = React.useContext(WorkbookContext),
2577
2587
  context = _useContext.context,
2578
2588
  setContext = _useContext.setContext;
@@ -2581,15 +2591,11 @@ var DataVerification = function DataVerification() {
2581
2591
  hideDialog = _useDialog.hideDialog;
2582
2592
  var _locale = fortuneCore.locale(context),
2583
2593
  dataVerification = _locale.dataVerification,
2584
- toolbar = _locale.toolbar,
2585
2594
  button = _locale.button,
2586
2595
  generalDialog = _locale.generalDialog;
2587
- var _useState = React.useState(["between", "notBetween", "equal", "notEqualTo", "moreThanThe", "lessThan", "greaterOrEqualTo", "lessThanOrEqualTo"]),
2596
+ var _useState = React.useState(["between", "notBetween", "equal", "notEqualTo", "earlierThan", "noEarlierThan", "laterThan", "noLaterThan"]),
2588
2597
  _useState2 = _slicedToArray(_useState, 1),
2589
- numberCondition = _useState2[0];
2590
- var _useState3 = React.useState(["between", "notBetween", "equal", "notEqualTo", "earlierThan", "noEarlierThan", "laterThan", "noLaterThan"]),
2591
- _useState4 = _slicedToArray(_useState3, 1),
2592
- dateCondition = _useState4[0];
2598
+ dateCondition = _useState2[0];
2593
2599
  var dataSelectRange = React.useCallback(function (type, value) {
2594
2600
  hideDialog();
2595
2601
  setContext(function (ctx) {
@@ -2724,48 +2730,36 @@ var DataVerification = function DataVerification() {
2724
2730
  return /*#__PURE__*/React__default['default'].createElement("div", {
2725
2731
  id: "fortune-data-verification"
2726
2732
  }, /*#__PURE__*/React__default['default'].createElement("div", {
2727
- className: "title"
2728
- }, toolbar.dataVerification), /*#__PURE__*/React__default['default'].createElement("div", {
2729
- className: "box"
2733
+ className: "flex flex-col gap-4"
2730
2734
  }, /*#__PURE__*/React__default['default'].createElement("div", {
2731
- className: "box-item",
2732
- style: {
2733
- borderTop: "1px solid #E1E4E8"
2734
- }
2735
+ className: "flex flex-col"
2735
2736
  }, /*#__PURE__*/React__default['default'].createElement("div", {
2736
- className: "box-item-title"
2737
- }, dataVerification.cellRange), /*#__PURE__*/React__default['default'].createElement("div", {
2738
- className: "data-verification-range"
2739
- }, /*#__PURE__*/React__default['default'].createElement("input", {
2740
- className: "formulaInputFocus",
2741
- spellCheck: "false",
2737
+ className: "text-heading-xsm mb-2"
2738
+ }, dataVerification.cellRange), /*#__PURE__*/React__default['default'].createElement(ui.TextField, {
2739
+ rightIcon: /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
2740
+ name: "Grid2x2",
2741
+ size: "sm"
2742
+ }),
2743
+ "aria-hidden": "true",
2744
+ readOnly: true,
2742
2745
  value: (_context$dataVerifica = context.dataVerification.dataRegulation) === null || _context$dataVerifica === void 0 ? void 0 : _context$dataVerifica.rangeTxt,
2743
2746
  onChange: function onChange(e) {
2744
2747
  var value = e.target.value;
2745
2748
  setContext(function (ctx) {
2746
2749
  ctx.dataVerification.dataRegulation.rangeTxt = value;
2747
2750
  });
2748
- }
2749
- }), /*#__PURE__*/React__default['default'].createElement("i", {
2750
- className: "icon",
2751
- "aria-hidden": "true",
2751
+ },
2752
2752
  onClick: function onClick() {
2753
2753
  hideDialog();
2754
2754
  dataSelectRange("rangeTxt", context.dataVerification.dataRegulation.value1);
2755
- },
2756
- tabIndex: 0
2757
- }, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
2758
- name: "tab",
2759
- width: 18
2760
- })))), /*#__PURE__*/React__default['default'].createElement("div", {
2761
- className: "box-item"
2755
+ }
2756
+ })), /*#__PURE__*/React__default['default'].createElement("div", {
2757
+ className: "flex flex-col"
2762
2758
  }, /*#__PURE__*/React__default['default'].createElement("div", {
2763
- className: "box-item-title"
2764
- }, dataVerification.verificationCondition), /*#__PURE__*/React__default['default'].createElement("select", {
2765
- className: "data-verification-type-select",
2759
+ className: "text-heading-xsm mb-2"
2760
+ }, dataVerification.verificationCondition), /*#__PURE__*/React__default['default'].createElement(ui.Select, {
2766
2761
  value: context.dataVerification.dataRegulation.type,
2767
- onChange: function onChange(e) {
2768
- var value = e.target.value;
2762
+ onValueChange: function onValueChange(value) {
2769
2763
  setContext(function (ctx) {
2770
2764
  ctx.dataVerification.dataRegulation.type = value;
2771
2765
  if (value === "dropdown" || value === "checkbox") {
@@ -2781,18 +2775,14 @@ var DataVerification = function DataVerification() {
2781
2775
  ctx.dataVerification.dataRegulation.value2 = "";
2782
2776
  });
2783
2777
  }
2784
- }, ["dropdown", "checkbox", "number", "number_integer", "number_decimal", "text_content", "text_length", "date", "validity"].map(function (v) {
2785
- return /*#__PURE__*/React__default['default'].createElement("option", {
2778
+ }, /*#__PURE__*/React__default['default'].createElement(ui.SelectTrigger, null, /*#__PURE__*/React__default['default'].createElement(ui.SelectValue, null)), /*#__PURE__*/React__default['default'].createElement(ui.SelectContent, null, ["dropdown", "checkbox", "date"].map(function (v) {
2779
+ return /*#__PURE__*/React__default['default'].createElement(ui.SelectItem, {
2786
2780
  value: v,
2787
2781
  key: v
2788
2782
  }, dataVerification[v]);
2789
- })), ((_context$dataVerifica2 = context.dataVerification) === null || _context$dataVerifica2 === void 0 ? void 0 : (_context$dataVerifica3 = _context$dataVerifica2.dataRegulation) === null || _context$dataVerifica3 === void 0 ? void 0 : _context$dataVerifica3.type) === "dropdown" && (/*#__PURE__*/React__default['default'].createElement("div", {
2790
- className: "show-box-item"
2791
- }, /*#__PURE__*/React__default['default'].createElement("div", {
2792
- className: "data-verification-range"
2793
- }, /*#__PURE__*/React__default['default'].createElement("input", {
2794
- className: "formulaInputFocus",
2795
- spellCheck: "false",
2783
+ }))), ((_context$dataVerifica2 = context.dataVerification) === null || _context$dataVerifica2 === void 0 ? void 0 : (_context$dataVerifica3 = _context$dataVerifica2.dataRegulation) === null || _context$dataVerifica3 === void 0 ? void 0 : _context$dataVerifica3.type) === "dropdown" && (/*#__PURE__*/React__default['default'].createElement("div", {
2784
+ className: "mt-4"
2785
+ }, /*#__PURE__*/React__default['default'].createElement(ui.TextField, {
2796
2786
  value: context.dataVerification.dataRegulation.value1,
2797
2787
  placeholder: dataVerification.placeholder1,
2798
2788
  onChange: function onChange(e) {
@@ -2801,39 +2791,28 @@ var DataVerification = function DataVerification() {
2801
2791
  ctx.dataVerification.dataRegulation.value1 = value;
2802
2792
  });
2803
2793
  }
2804
- }), /*#__PURE__*/React__default['default'].createElement("i", {
2805
- className: "icon",
2806
- "aria-hidden": "true",
2807
- onClick: function onClick() {
2808
- return dataSelectRange("dropDown", context.dataVerification.dataRegulation.value1);
2809
- },
2810
- tabIndex: 0
2811
- }, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
2812
- name: "tab",
2813
- width: 18
2814
- }))), /*#__PURE__*/React__default['default'].createElement("div", {
2815
- className: "check"
2816
- }, /*#__PURE__*/React__default['default'].createElement("input", {
2817
- type: "checkbox",
2794
+ }), /*#__PURE__*/React__default['default'].createElement("div", {
2795
+ className: "mt-4 flex items-center"
2796
+ }, /*#__PURE__*/React__default['default'].createElement(ui.Checkbox, {
2797
+ className: "border-2",
2818
2798
  checked: context.dataVerification.dataRegulation.type2 === "true",
2819
- id: "mul",
2820
- onChange: function onChange(e) {
2799
+ onCheckedChange: function onCheckedChange(e) {
2821
2800
  var checked = e.target.checked;
2822
2801
  setContext(function (ctx) {
2823
2802
  ctx.dataVerification.dataRegulation.type2 = "".concat(checked);
2824
2803
  });
2825
2804
  }
2826
- }), /*#__PURE__*/React__default['default'].createElement("label", {
2827
- htmlFor: "mul"
2805
+ }), /*#__PURE__*/React__default['default'].createElement("span", {
2806
+ className: "ml-2"
2828
2807
  }, dataVerification.allowMultiSelect)))), ((_context$dataVerifica4 = context.dataVerification) === null || _context$dataVerifica4 === void 0 ? void 0 : (_context$dataVerifica5 = _context$dataVerifica4.dataRegulation) === null || _context$dataVerifica5 === void 0 ? void 0 : _context$dataVerifica5.type) === "checkbox" && (/*#__PURE__*/React__default['default'].createElement("div", {
2829
- className: "show-box-item"
2808
+ className: "mt-4 space-y-2"
2830
2809
  }, /*#__PURE__*/React__default['default'].createElement("div", {
2831
- className: "check-box"
2832
- }, /*#__PURE__*/React__default['default'].createElement("span", null, dataVerification.selected, " \u2014\u2014 "), /*#__PURE__*/React__default['default'].createElement("input", {
2833
- type: "text",
2834
- className: "data-verification-value1",
2835
- placeholder: dataVerification.placeholder2,
2810
+ className: "flex items-center gap-2"
2811
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
2812
+ className: "data-verification-checkbox-label"
2813
+ }, dataVerification.selected), /*#__PURE__*/React__default['default'].createElement(ui.TextField, {
2836
2814
  value: (_context$dataVerifica6 = context.dataVerification) === null || _context$dataVerifica6 === void 0 ? void 0 : (_context$dataVerifica7 = _context$dataVerifica6.dataRegulation) === null || _context$dataVerifica7 === void 0 ? void 0 : _context$dataVerifica7.value1,
2815
+ placeholder: dataVerification.placeholder2,
2837
2816
  onChange: function onChange(e) {
2838
2817
  var value = e.target.value;
2839
2818
  setContext(function (ctx) {
@@ -2841,129 +2820,41 @@ var DataVerification = function DataVerification() {
2841
2820
  });
2842
2821
  }
2843
2822
  })), /*#__PURE__*/React__default['default'].createElement("div", {
2844
- className: "check-box"
2845
- }, /*#__PURE__*/React__default['default'].createElement("span", null, dataVerification.notSelected, " \u2014\u2014 "), /*#__PURE__*/React__default['default'].createElement("input", {
2846
- type: "text",
2847
- className: "data-verification-value2",
2848
- placeholder: dataVerification.placeholder2,
2823
+ className: "flex items-center gap-2"
2824
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
2825
+ className: "data-verification-checkbox-label"
2826
+ }, dataVerification.notSelected), /*#__PURE__*/React__default['default'].createElement(ui.TextField, {
2849
2827
  value: (_context$dataVerifica8 = context.dataVerification) === null || _context$dataVerifica8 === void 0 ? void 0 : (_context$dataVerifica9 = _context$dataVerifica8.dataRegulation) === null || _context$dataVerifica9 === void 0 ? void 0 : _context$dataVerifica9.value2,
2828
+ placeholder: dataVerification.placeholder2,
2850
2829
  onChange: function onChange(e) {
2851
2830
  var value = e.target.value;
2852
2831
  setContext(function (ctx) {
2853
2832
  ctx.dataVerification.dataRegulation.value2 = value;
2854
2833
  });
2855
2834
  }
2856
- })))), (((_context$dataVerifica0 = context.dataVerification) === null || _context$dataVerifica0 === void 0 ? void 0 : (_context$dataVerifica1 = _context$dataVerifica0.dataRegulation) === null || _context$dataVerifica1 === void 0 ? void 0 : _context$dataVerifica1.type) === "number" || ((_context$dataVerifica10 = context.dataVerification) === null || _context$dataVerifica10 === void 0 ? void 0 : (_context$dataVerifica11 = _context$dataVerifica10.dataRegulation) === null || _context$dataVerifica11 === void 0 ? void 0 : _context$dataVerifica11.type) === "number_integer" || ((_context$dataVerifica12 = context.dataVerification) === null || _context$dataVerifica12 === void 0 ? void 0 : (_context$dataVerifica13 = _context$dataVerifica12.dataRegulation) === null || _context$dataVerifica13 === void 0 ? void 0 : _context$dataVerifica13.type) === "number_decimal" || ((_context$dataVerifica14 = context.dataVerification) === null || _context$dataVerifica14 === void 0 ? void 0 : (_context$dataVerifica15 = _context$dataVerifica14.dataRegulation) === null || _context$dataVerifica15 === void 0 ? void 0 : _context$dataVerifica15.type) === "text_length") && (/*#__PURE__*/React__default['default'].createElement("div", {
2857
- className: "show-box-item"
2858
- }, /*#__PURE__*/React__default['default'].createElement("select", {
2859
- className: "data-verification-type-select",
2860
- value: context.dataVerification.dataRegulation.type2,
2861
- onChange: function onChange(e) {
2862
- var value = e.target.value;
2863
- setContext(function (ctx) {
2864
- ctx.dataVerification.dataRegulation.type2 = value;
2865
- ctx.dataVerification.dataRegulation.value1 = "";
2866
- ctx.dataVerification.dataRegulation.value2 = "";
2867
- });
2868
- }
2869
- }, numberCondition.map(function (v) {
2870
- return /*#__PURE__*/React__default['default'].createElement("option", {
2871
- value: v,
2872
- key: v
2873
- }, dataVerification[v]);
2874
- })), context.dataVerification.dataRegulation.type2 === "between" || context.dataVerification.dataRegulation.type2 === "notBetween" ? (/*#__PURE__*/React__default['default'].createElement("div", {
2875
- className: "input-box"
2876
- }, /*#__PURE__*/React__default['default'].createElement("input", {
2877
- type: "number",
2878
- placeholder: "1",
2879
- value: context.dataVerification.dataRegulation.value1,
2880
- onChange: function onChange(e) {
2881
- var value = e.target.value;
2882
- setContext(function (ctx) {
2883
- ctx.dataVerification.dataRegulation.value1 = value;
2884
- });
2885
- }
2886
- }), /*#__PURE__*/React__default['default'].createElement("span", null, "-"), /*#__PURE__*/React__default['default'].createElement("input", {
2887
- type: "number",
2888
- placeholder: "100",
2889
- value: context.dataVerification.dataRegulation.value2,
2890
- onChange: function onChange(e) {
2891
- var value = e.target.value;
2892
- setContext(function (ctx) {
2893
- ctx.dataVerification.dataRegulation.value2 = value;
2894
- });
2895
- }
2896
- }))) : (/*#__PURE__*/React__default['default'].createElement("div", {
2897
- className: "input-box"
2898
- }, /*#__PURE__*/React__default['default'].createElement("input", {
2899
- type: "number",
2900
- style: {
2901
- width: "100%"
2902
- },
2903
- placeholder: dataVerification.placeholder3,
2904
- value: context.dataVerification.dataRegulation.value1,
2905
- onChange: function onChange(e) {
2906
- var value = e.target.value;
2907
- setContext(function (ctx) {
2908
- ctx.dataVerification.dataRegulation.value1 = value;
2909
- });
2910
- }
2911
- }))))), ((_context$dataVerifica16 = context.dataVerification) === null || _context$dataVerifica16 === void 0 ? void 0 : (_context$dataVerifica17 = _context$dataVerifica16.dataRegulation) === null || _context$dataVerifica17 === void 0 ? void 0 : _context$dataVerifica17.type) === "text_content" && (/*#__PURE__*/React__default['default'].createElement("div", {
2912
- className: "show-box-item"
2913
- }, /*#__PURE__*/React__default['default'].createElement("select", {
2914
- className: "data-verification-type-select",
2835
+ })))), ((_context$dataVerifica0 = context.dataVerification) === null || _context$dataVerifica0 === void 0 ? void 0 : (_context$dataVerifica1 = _context$dataVerifica0.dataRegulation) === null || _context$dataVerifica1 === void 0 ? void 0 : _context$dataVerifica1.type) === "date" && (/*#__PURE__*/React__default['default'].createElement("div", {
2836
+ className: "mt-4"
2837
+ }, /*#__PURE__*/React__default['default'].createElement(ui.Select, {
2915
2838
  value: context.dataVerification.dataRegulation.type2,
2916
- onChange: function onChange(e) {
2917
- var value = e.target.value;
2918
- setContext(function (ctx) {
2919
- ctx.dataVerification.dataRegulation.type2 = value;
2920
- ctx.dataVerification.dataRegulation.value1 = "";
2921
- ctx.dataVerification.dataRegulation.value2 = "";
2922
- });
2923
- }
2924
- }, ["include", "exclude", "equal"].map(function (v) {
2925
- return /*#__PURE__*/React__default['default'].createElement("option", {
2926
- value: v,
2927
- key: v
2928
- }, dataVerification[v]);
2929
- })), /*#__PURE__*/React__default['default'].createElement("div", {
2930
- className: "input-box"
2931
- }, /*#__PURE__*/React__default['default'].createElement("input", {
2932
- type: "text",
2933
- style: {
2934
- width: "100%"
2935
- },
2936
- placeholder: dataVerification.placeholder4,
2937
- value: context.dataVerification.dataRegulation.value1,
2938
- onChange: function onChange(e) {
2939
- var value = e.target.value;
2940
- setContext(function (ctx) {
2941
- ctx.dataVerification.dataRegulation.value1 = value;
2942
- });
2943
- }
2944
- })))), ((_context$dataVerifica18 = context.dataVerification) === null || _context$dataVerifica18 === void 0 ? void 0 : (_context$dataVerifica19 = _context$dataVerifica18.dataRegulation) === null || _context$dataVerifica19 === void 0 ? void 0 : _context$dataVerifica19.type) === "date" && (/*#__PURE__*/React__default['default'].createElement("div", {
2945
- className: "show-box-item"
2946
- }, /*#__PURE__*/React__default['default'].createElement("select", {
2947
- className: "data-verification-type-select",
2948
- value: context.dataVerification.dataRegulation.type2,
2949
- onChange: function onChange(e) {
2950
- var value = e.target.value;
2839
+ onValueChange: function onValueChange(value) {
2951
2840
  setContext(function (ctx) {
2952
2841
  ctx.dataVerification.dataRegulation.type2 = value;
2953
2842
  ctx.dataVerification.dataRegulation.value1 = "";
2954
2843
  ctx.dataVerification.dataRegulation.value2 = "";
2955
2844
  });
2956
2845
  }
2957
- }, dateCondition.map(function (v) {
2958
- return /*#__PURE__*/React__default['default'].createElement("option", {
2846
+ }, /*#__PURE__*/React__default['default'].createElement(ui.SelectTrigger, null, /*#__PURE__*/React__default['default'].createElement(ui.SelectValue, null)), /*#__PURE__*/React__default['default'].createElement(ui.SelectContent, null, dateCondition.map(function (v) {
2847
+ return /*#__PURE__*/React__default['default'].createElement(ui.SelectItem, {
2959
2848
  value: v,
2960
2849
  key: v
2961
2850
  }, dataVerification[v]);
2962
- })), context.dataVerification.dataRegulation.type2 === "between" || context.dataVerification.dataRegulation.type2 === "notBetween" ? (/*#__PURE__*/React__default['default'].createElement("div", {
2963
- className: "input-box"
2851
+ }))), context.dataVerification.dataRegulation.type2 === "between" || context.dataVerification.dataRegulation.type2 === "notBetween" ? (/*#__PURE__*/React__default['default'].createElement("div", {
2852
+ className: "mt-4 flex gap-2 items-center"
2853
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
2854
+ className: "datepicker-toggle"
2964
2855
  }, /*#__PURE__*/React__default['default'].createElement("input", {
2965
2856
  type: "date",
2966
- placeholder: "1",
2857
+ className: "datepicker-input",
2967
2858
  value: context.dataVerification.dataRegulation.value1,
2968
2859
  onChange: function onChange(e) {
2969
2860
  var value = e.target.value;
@@ -2971,9 +2862,13 @@ var DataVerification = function DataVerification() {
2971
2862
  ctx.dataVerification.dataRegulation.value1 = value;
2972
2863
  });
2973
2864
  }
2974
- }), /*#__PURE__*/React__default['default'].createElement("span", null, "-"), /*#__PURE__*/React__default['default'].createElement("input", {
2865
+ }), /*#__PURE__*/React__default['default'].createElement("span", {
2866
+ className: "datepicker-toggle-button"
2867
+ })), /*#__PURE__*/React__default['default'].createElement("span", null, "-"), /*#__PURE__*/React__default['default'].createElement("div", {
2868
+ className: "datepicker-toggle"
2869
+ }, /*#__PURE__*/React__default['default'].createElement("input", {
2975
2870
  type: "date",
2976
- placeholder: "100",
2871
+ className: "datepicker-input",
2977
2872
  value: context.dataVerification.dataRegulation.value2,
2978
2873
  onChange: function onChange(e) {
2979
2874
  var value = e.target.value;
@@ -2981,13 +2876,15 @@ var DataVerification = function DataVerification() {
2981
2876
  ctx.dataVerification.dataRegulation.value2 = value;
2982
2877
  });
2983
2878
  }
2984
- }))) : (/*#__PURE__*/React__default['default'].createElement("div", {
2985
- className: "input-box"
2879
+ }), /*#__PURE__*/React__default['default'].createElement("span", {
2880
+ className: "datepicker-toggle-button"
2881
+ })))) : (/*#__PURE__*/React__default['default'].createElement("div", {
2882
+ className: "mt-4"
2883
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
2884
+ className: "datepicker-toggle"
2986
2885
  }, /*#__PURE__*/React__default['default'].createElement("input", {
2987
2886
  type: "date",
2988
- style: {
2989
- width: "100%"
2990
- },
2887
+ className: "datepicker-input",
2991
2888
  placeholder: dataVerification.placeholder3,
2992
2889
  value: context.dataVerification.dataRegulation.value1,
2993
2890
  onChange: function onChange(e) {
@@ -2996,57 +2893,35 @@ var DataVerification = function DataVerification() {
2996
2893
  ctx.dataVerification.dataRegulation.value1 = value;
2997
2894
  });
2998
2895
  }
2999
- }))))), ((_context$dataVerifica20 = context.dataVerification) === null || _context$dataVerifica20 === void 0 ? void 0 : (_context$dataVerifica21 = _context$dataVerifica20.dataRegulation) === null || _context$dataVerifica21 === void 0 ? void 0 : _context$dataVerifica21.type) === "validity" && (/*#__PURE__*/React__default['default'].createElement("div", {
3000
- className: "show-box-item"
3001
- }, /*#__PURE__*/React__default['default'].createElement("select", {
3002
- className: "data-verification-type-select",
3003
- value: context.dataVerification.dataRegulation.type2,
3004
- onChange: function onChange(e) {
3005
- var value = e.target.value;
3006
- setContext(function (ctx) {
3007
- ctx.dataVerification.dataRegulation.type2 = value;
3008
- ctx.dataVerification.dataRegulation.value1 = "";
3009
- ctx.dataVerification.dataRegulation.value2 = "";
3010
- });
3011
- }
3012
- }, ["identificationNumber", "phoneNumber"].map(function (v) {
3013
- return /*#__PURE__*/React__default['default'].createElement("option", {
3014
- value: v,
3015
- key: v
3016
- }, dataVerification[v]);
3017
- }))))), /*#__PURE__*/React__default['default'].createElement("div", {
3018
- className: "box-item"
2896
+ }), /*#__PURE__*/React__default['default'].createElement("span", {
2897
+ className: "datepicker-toggle-button"
2898
+ }))))))), /*#__PURE__*/React__default['default'].createElement(ui.Divider, {
2899
+ className: "w-full border-t-[1px]"
2900
+ }), /*#__PURE__*/React__default['default'].createElement("div", {
2901
+ className: "flex flex-col gap-2"
3019
2902
  }, ["prohibitInput", "hintShow"].map(function (v) {
3020
2903
  return /*#__PURE__*/React__default['default'].createElement("div", {
3021
- className: "check",
3022
- key: "div".concat(v)
3023
- }, /*#__PURE__*/React__default['default'].createElement("input", {
3024
- type: "checkbox",
3025
- id: v,
3026
- key: "input".concat(v),
2904
+ key: v,
2905
+ className: "flex items-center"
2906
+ }, /*#__PURE__*/React__default['default'].createElement(ui.Checkbox, {
2907
+ className: "border-2",
3027
2908
  checked: context.dataVerification.dataRegulation[v],
3028
- onChange: function onChange() {
2909
+ onCheckedChange: function onCheckedChange(e) {
2910
+ var checked = e.target.checked;
3029
2911
  setContext(function (ctx) {
3030
2912
  var _ctx$dataVerification5;
3031
2913
  var dataRegulation = (_ctx$dataVerification5 = ctx.dataVerification) === null || _ctx$dataVerification5 === void 0 ? void 0 : _ctx$dataVerification5.dataRegulation;
3032
2914
  if (v === "prohibitInput") {
3033
- dataRegulation.prohibitInput = !dataRegulation.prohibitInput;
2915
+ dataRegulation.prohibitInput = checked;
3034
2916
  } else if (v === "hintShow") {
3035
- dataRegulation.hintShow = !dataRegulation.hintShow;
2917
+ dataRegulation.hintShow = checked;
3036
2918
  }
3037
2919
  });
3038
2920
  }
3039
- }), /*#__PURE__*/React__default['default'].createElement("label", {
3040
- htmlFor: v,
3041
- key: "label".concat(v)
2921
+ }), /*#__PURE__*/React__default['default'].createElement("span", {
2922
+ className: "ml-2"
3042
2923
  }, dataVerification[v]));
3043
- }), ((_context$dataVerifica22 = context.dataVerification) === null || _context$dataVerifica22 === void 0 ? void 0 : (_context$dataVerifica23 = _context$dataVerifica22.dataRegulation) === null || _context$dataVerifica23 === void 0 ? void 0 : _context$dataVerifica23.hintShow) && (/*#__PURE__*/React__default['default'].createElement("div", {
3044
- className: "input-box"
3045
- }, /*#__PURE__*/React__default['default'].createElement("input", {
3046
- type: "text",
3047
- style: {
3048
- width: "100%"
3049
- },
2924
+ }), ((_context$dataVerifica10 = context.dataVerification) === null || _context$dataVerifica10 === void 0 ? void 0 : (_context$dataVerifica11 = _context$dataVerifica10.dataRegulation) === null || _context$dataVerifica11 === void 0 ? void 0 : _context$dataVerifica11.hintShow) && (/*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(ui.TextField, {
3050
2925
  placeholder: dataVerification.placeholder5,
3051
2926
  value: context.dataVerification.dataRegulation.hintValue,
3052
2927
  onChange: function onChange(e) {
@@ -3055,25 +2930,37 @@ var DataVerification = function DataVerification() {
3055
2930
  ctx.dataVerification.dataRegulation.hintValue = value;
3056
2931
  });
3057
2932
  }
3058
- }))))), /*#__PURE__*/React__default['default'].createElement("div", {
3059
- className: "button-basic button-primary",
2933
+ }))))), /*#__PURE__*/React__default['default'].createElement(ui.Divider, {
2934
+ className: "w-full border-t-[1px] my-4"
2935
+ }), /*#__PURE__*/React__default['default'].createElement("div", {
2936
+ className: "flex gap-2 justify-between items-center"
2937
+ }, /*#__PURE__*/React__default['default'].createElement(ui.Button, {
2938
+ variant: "secondary",
2939
+ style: {
2940
+ minWidth: "80px"
2941
+ },
3060
2942
  onClick: function onClick() {
3061
- btn("confirm");
2943
+ btn("close");
2944
+ }
2945
+ }, button.cancel), /*#__PURE__*/React__default['default'].createElement("div", {
2946
+ className: "flex gap-2"
2947
+ }, /*#__PURE__*/React__default['default'].createElement(ui.Button, {
2948
+ variant: "secondary",
2949
+ style: {
2950
+ minWidth: "80px"
3062
2951
  },
3063
- tabIndex: 0
3064
- }, button.confirm), /*#__PURE__*/React__default['default'].createElement("div", {
3065
- className: "button-basic button-close",
3066
2952
  onClick: function onClick() {
3067
2953
  btn("delete");
2954
+ }
2955
+ }, dataVerification.deleteVerification), /*#__PURE__*/React__default['default'].createElement(ui.Button, {
2956
+ variant: "default",
2957
+ style: {
2958
+ minWidth: "80px"
3068
2959
  },
3069
- tabIndex: 0
3070
- }, dataVerification.deleteVerification), /*#__PURE__*/React__default['default'].createElement("div", {
3071
- className: "button-basic button-close",
3072
2960
  onClick: function onClick() {
3073
- btn("close");
3074
- },
3075
- tabIndex: 0
3076
- }, button.cancel));
2961
+ btn("confirm");
2962
+ }
2963
+ }, button.confirm))));
3077
2964
  };
3078
2965
 
3079
2966
  function getDisplayedRangeTxt(context) {
@@ -3085,12 +2972,7 @@ function getDisplayedRangeTxt(context) {
3085
2972
  return (_context$rangeDialog$ = (_context$rangeDialog = context.rangeDialog) === null || _context$rangeDialog === void 0 ? void 0 : _context$rangeDialog.rangeTxt) !== null && _context$rangeDialog$ !== void 0 ? _context$rangeDialog$ : "";
3086
2973
  }
3087
2974
 
3088
- var datepickerStyles = "\n .datepicker-toggle {\n display: inline-block;\n position: relative;\n width: 100%;\n }\n \n .datepicker-toggle-button {\n opacity: 0.3;\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n width: 16px;\n height: 16px;\n background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxyZWN0IHg9IjMiIHk9IjQiIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgcng9IjIiIHJ5PSIyIj48L3JlY3Q+PGxpbmUgeDE9IjE2IiB5MT0iMiIgeDI9IjE2IiB5Mj0iNiI+PC9saW5lPjxsaW5lIHgxPSI4IiB5MT0iMiIgeDI9IjgiIHkyPSI2Ij48L2xpbmU+PGxpbmUgeDE9IjMiIHkxPSIxMCIgeDI9IjIxIiB5Mj0iMTAiPjwvbGluZT48L3N2Zz4=');\n background-repeat: no-repeat;\n background-position: center;\n pointer-events: none;\n }\n \n .datepicker-input {\n width: 100%;\n padding: 8px 12px;\n border: 1px solid #e2e8f0;\n border-radius: 6px;\n font-size: 14px;\n line-height: 1.5;\n color: #1a202c;\n background-color: #fff;\n cursor: pointer;\n }\n \n .datepicker-input::-webkit-calendar-picker-indicator {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n cursor: pointer;\n opacity: 0;\n }\n \n .datepicker-input:focus {\n outline: none;\n border-color: #4299e1;\n box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.1);\n }\n";
3089
- if (typeof document !== "undefined") {
3090
- var styleSheet = document.createElement("style");
3091
- styleSheet.textContent = datepickerStyles;
3092
- document.head.appendChild(styleSheet);
3093
- }
2975
+ injectDatepickerStyles();
3094
2976
  var ConditionRules = function ConditionRules(_ref) {
3095
2977
  var type = _ref.type;
3096
2978
  var _useContext = React.useContext(WorkbookContext),
@@ -3411,7 +3293,8 @@ var RangeDialog = function RangeDialog() {
3411
3293
  showDialog = _useDialog.showDialog;
3412
3294
  var _locale = fortuneCore.locale(context),
3413
3295
  dataVerification = _locale.dataVerification,
3414
- button = _locale.button;
3296
+ button = _locale.button,
3297
+ toolbar = _locale.toolbar;
3415
3298
  var _useState = React.useState(getDisplayedRangeTxt(context)),
3416
3299
  _useState2 = _slicedToArray(_useState, 2),
3417
3300
  rangeTxt2 = _useState2[0],
@@ -3436,7 +3319,7 @@ var RangeDialog = function RangeDialog() {
3436
3319
  }), undefined, fortuneCore.locale(context).conditionformat["conditionformat_".concat(rulesType)]);
3437
3320
  return;
3438
3321
  }
3439
- showDialog(/*#__PURE__*/React__default['default'].createElement(DataVerification, null));
3322
+ showDialog(/*#__PURE__*/React__default['default'].createElement(DataVerification, null), undefined, toolbar.dataVerification);
3440
3323
  }, [setContext, showDialog, context]);
3441
3324
  React.useEffect(function () {
3442
3325
  setRangeTxt2(getDisplayedRangeTxt(context));
@@ -3625,7 +3508,7 @@ var DropDownList = function DropDownList() {
3625
3508
  arr.splice(index, 1);
3626
3509
  }
3627
3510
  setSelected(arr);
3628
- fortuneCore.setDropcownValue(ctx, v, arr);
3511
+ fortuneCore.setDropdownValue(ctx, v, arr);
3629
3512
  });
3630
3513
  },
3631
3514
  tabIndex: 0
@@ -4095,8 +3978,9 @@ var SheetOverlay = function SheetOverlay() {
4095
3978
  display: "none"
4096
3979
  }
4097
3980
  }, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
4098
- name: "combo-arrow",
4099
- width: 16
3981
+ name: "caret-down-fill",
3982
+ width: 16,
3983
+ height: 16
4100
3984
  })), context.dataVerificationDropDownList && /*#__PURE__*/React__default['default'].createElement(DropDownList, null), /*#__PURE__*/React__default['default'].createElement("div", {
4101
3985
  id: "luckysheet-dataVerification-showHintBox",
4102
3986
  className: "luckysheet-mousedown-cancel",
@@ -4415,6 +4299,9 @@ var Combo = function Combo(_ref) {
4415
4299
  setPopupPosition = _useState4[1];
4416
4300
  var popupRef = React.useRef(null);
4417
4301
  var buttonRef = React.useRef(null);
4302
+ var isLucideIcon = React.useMemo(function () {
4303
+ return (iconId === null || iconId === void 0 ? void 0 : iconId.startsWith("align-")) || ["text-overflow", "text-wrap", "text-clip"].includes(iconId);
4304
+ }, [iconId]);
4418
4305
  useOutsideClick(popupRef, function () {
4419
4306
  setOpen(false);
4420
4307
  });
@@ -4442,7 +4329,7 @@ var Combo = function Combo(_ref) {
4442
4329
  }, /*#__PURE__*/React__default['default'].createElement("div", {
4443
4330
  ref: buttonRef,
4444
4331
  className: "fortune-toolbar-combo"
4445
- }, /*#__PURE__*/React__default['default'].createElement("div", {
4332
+ }, !isLucideIcon ? (/*#__PURE__*/React__default['default'].createElement("div", {
4446
4333
  className: "fortune-toolbar-combo-button",
4447
4334
  onClick: function onClick(e) {
4448
4335
  if (_onClick) {
@@ -4461,7 +4348,13 @@ var Combo = function Combo(_ref) {
4461
4348
  name: iconId
4462
4349
  })) : (/*#__PURE__*/React__default['default'].createElement("span", {
4463
4350
  className: "fortune-toolbar-combo-text"
4464
- }, text !== undefined ? text : ""))), showArrow && (/*#__PURE__*/React__default['default'].createElement("div", {
4351
+ }, text !== undefined ? text : "")))) : (/*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
4352
+ icon: getIcon(iconId),
4353
+ variant: "ghost",
4354
+ onClick: function onClick() {
4355
+ return setOpen(!open);
4356
+ }
4357
+ })), showArrow && (/*#__PURE__*/React__default['default'].createElement("div", {
4465
4358
  className: "fortune-toolbar-combo-arrow",
4466
4359
  onClick: function onClick() {
4467
4360
  return setOpen(!open);
@@ -5366,6 +5259,30 @@ var FormatSearch = function FormatSearch(_ref) {
5366
5259
  }, button.cancel)));
5367
5260
  };
5368
5261
 
5262
+ var getIcon = function getIcon(title) {
5263
+ switch (title) {
5264
+ case "align-left":
5265
+ return "AlignLeft";
5266
+ case "align-center":
5267
+ return "AlignCenter";
5268
+ case "align-right":
5269
+ return "AlignRight";
5270
+ case "align-top":
5271
+ return "ArrowUpFromLine";
5272
+ case "align-middle":
5273
+ return "AlignVerticalMiddle";
5274
+ case "align-bottom":
5275
+ return "ArrowDownFromLine";
5276
+ case "text-overflow":
5277
+ return "TextOverflow";
5278
+ case "text-wrap":
5279
+ return "WrapText";
5280
+ case "text-clip":
5281
+ return "TextClip";
5282
+ default:
5283
+ return "";
5284
+ }
5285
+ };
5369
5286
  var Toolbar = function Toolbar(_ref) {
5370
5287
  var _context$luckysheet_s, _flowdata$row, _settings$customToolb;
5371
5288
  var setMoreItems = _ref.setMoreItems,
@@ -5702,27 +5619,38 @@ var Toolbar = function Toolbar(_ref) {
5702
5619
  tooltip: toolbar.horizontalAlign,
5703
5620
  showArrow: false
5704
5621
  }, function (setOpen) {
5705
- return /*#__PURE__*/React__default['default'].createElement(Select, null, items.map(function (_ref3) {
5706
- var text = _ref3.text,
5707
- title = _ref3.title;
5708
- return /*#__PURE__*/React__default['default'].createElement(Option, {
5622
+ return /*#__PURE__*/React__default['default'].createElement(Select, {
5623
+ style: {
5624
+ minWidth: "fit-content",
5625
+ display: "flex",
5626
+ flexDirection: "row",
5627
+ alignItems: "center",
5628
+ justifyContent: "center",
5629
+ gap: 4
5630
+ }
5631
+ }, items.map(function (_ref3) {
5632
+ var _$find2;
5633
+ var title = _ref3.title;
5634
+ return /*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
5709
5635
  key: title,
5636
+ isActive: ((_$find2 = ___default['default'].find(items, function (item) {
5637
+ return "".concat(item.value) === "".concat(cell === null || cell === void 0 ? void 0 : cell.ht);
5638
+ })) === null || _$find2 === void 0 ? void 0 : _$find2.title) === title,
5639
+ icon: getIcon(title),
5640
+ variant: "ghost",
5710
5641
  onClick: function onClick() {
5711
5642
  setContext(function (ctx) {
5712
5643
  fortuneCore.handleHorizontalAlign(ctx, refs.cellInput.current, title.replace("align-", ""));
5713
5644
  });
5714
5645
  setOpen(false);
5715
- }
5716
- }, /*#__PURE__*/React__default['default'].createElement("div", {
5717
- className: "fortune-toolbar-menu-line"
5718
- }, text, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
5719
- name: title
5720
- })));
5646
+ },
5647
+ tabIndex: 0
5648
+ });
5721
5649
  }));
5722
5650
  });
5723
5651
  }
5724
5652
  if (name === "vertical-align") {
5725
- var _$find2;
5653
+ var _$find3;
5726
5654
  var _items = [{
5727
5655
  title: "align-top",
5728
5656
  text: align.top,
@@ -5737,29 +5665,40 @@ var Toolbar = function Toolbar(_ref) {
5737
5665
  value: 2
5738
5666
  }];
5739
5667
  return /*#__PURE__*/React__default['default'].createElement(Combo, {
5740
- iconId: ((_$find2 = ___default['default'].find(_items, function (item) {
5668
+ iconId: ((_$find3 = ___default['default'].find(_items, function (item) {
5741
5669
  return "".concat(item.value) === "".concat(cell === null || cell === void 0 ? void 0 : cell.vt);
5742
- })) === null || _$find2 === void 0 ? void 0 : _$find2.title) || "align-top",
5670
+ })) === null || _$find3 === void 0 ? void 0 : _$find3.title) || "align-top",
5743
5671
  key: name,
5744
5672
  tooltip: toolbar.verticalAlign,
5745
5673
  showArrow: false
5746
5674
  }, function (setOpen) {
5747
- return /*#__PURE__*/React__default['default'].createElement(Select, null, _items.map(function (_ref4) {
5748
- var text = _ref4.text,
5749
- title = _ref4.title;
5750
- return /*#__PURE__*/React__default['default'].createElement(Option, {
5675
+ return /*#__PURE__*/React__default['default'].createElement(Select, {
5676
+ style: {
5677
+ minWidth: "fit-content",
5678
+ display: "flex",
5679
+ flexDirection: "row",
5680
+ alignItems: "center",
5681
+ justifyContent: "center",
5682
+ gap: 4
5683
+ }
5684
+ }, _items.map(function (_ref4) {
5685
+ var _$find4;
5686
+ var title = _ref4.title;
5687
+ return /*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
5751
5688
  key: title,
5689
+ isActive: ((_$find4 = ___default['default'].find(_items, function (item) {
5690
+ return "".concat(item.value) === "".concat(cell === null || cell === void 0 ? void 0 : cell.vt);
5691
+ })) === null || _$find4 === void 0 ? void 0 : _$find4.title) === title,
5692
+ icon: getIcon(title),
5693
+ variant: "ghost",
5752
5694
  onClick: function onClick() {
5753
5695
  setContext(function (ctx) {
5754
5696
  fortuneCore.handleVerticalAlign(ctx, refs.cellInput.current, title.replace("align-", ""));
5755
5697
  });
5756
5698
  setOpen(false);
5757
- }
5758
- }, /*#__PURE__*/React__default['default'].createElement("div", {
5759
- className: "fortune-toolbar-menu-line"
5760
- }, text, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
5761
- name: title
5762
- })));
5699
+ },
5700
+ tabIndex: 0
5701
+ });
5763
5702
  }));
5764
5703
  });
5765
5704
  }
@@ -5834,7 +5773,7 @@ var Toolbar = function Toolbar(_ref) {
5834
5773
  key: name,
5835
5774
  onClick: function onClick() {
5836
5775
  if (context.allowEdit === false) return;
5837
- showDialog(/*#__PURE__*/React__default['default'].createElement(DataVerification, null));
5776
+ showDialog(/*#__PURE__*/React__default['default'].createElement(DataVerification, null), undefined, toolbar.dataVerification);
5838
5777
  }
5839
5778
  });
5840
5779
  }
@@ -6308,12 +6247,23 @@ var Toolbar = function Toolbar(_ref) {
6308
6247
  tooltip: toolbar.textWrap,
6309
6248
  showArrow: false
6310
6249
  }, function (setOpen) {
6311
- return /*#__PURE__*/React__default['default'].createElement(Select, null, _items6.map(function (_ref1) {
6312
- var text = _ref1.text,
6313
- iconId = _ref1.iconId,
6250
+ return /*#__PURE__*/React__default['default'].createElement(Select, {
6251
+ style: {
6252
+ minWidth: "fit-content",
6253
+ display: "flex",
6254
+ flexDirection: "row",
6255
+ alignItems: "center",
6256
+ justifyContent: "center",
6257
+ gap: 4
6258
+ }
6259
+ }, _items6.map(function (_ref1) {
6260
+ var iconId = _ref1.iconId,
6314
6261
  value = _ref1.value;
6315
- return /*#__PURE__*/React__default['default'].createElement(Option, {
6262
+ return /*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
6316
6263
  key: value,
6264
+ isActive: _curr.value === value,
6265
+ icon: getIcon(iconId),
6266
+ variant: "ghost",
6317
6267
  onClick: function onClick() {
6318
6268
  setContext(function (ctx) {
6319
6269
  var d = fortuneCore.getFlowdata(ctx);
@@ -6321,12 +6271,9 @@ var Toolbar = function Toolbar(_ref) {
6321
6271
  fortuneCore.updateFormat(ctx, refs.cellInput.current, d, "tb", value);
6322
6272
  });
6323
6273
  setOpen(false);
6324
- }
6325
- }, /*#__PURE__*/React__default['default'].createElement("div", {
6326
- className: "fortune-toolbar-menu-line"
6327
- }, text, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
6328
- name: iconId
6329
- })));
6274
+ },
6275
+ tabIndex: 0
6276
+ });
6330
6277
  }));
6331
6278
  });
6332
6279
  }
@@ -9663,6 +9610,21 @@ var SVGDefines = function SVGDefines(_ref) {
9663
9610
  "clip-rule": "evenodd",
9664
9611
  d: "M12.75 2.25C13.1642 2.25 13.5 2.58579 13.5 3V15C13.5 15.4142 13.1642 15.75 12.75 15.75C12.3358 15.75 12 15.4142 12 15V3C12 2.58579 12.3358 2.25 12.75 2.25Z",
9665
9612
  fill: "#363B3F"
9613
+ })), /*#__PURE__*/React__default['default'].createElement("symbol", {
9614
+ id: "caret-down-fill",
9615
+ width: "14",
9616
+ height: "14",
9617
+ viewBox: "0 0 14 14",
9618
+ fill: "none"
9619
+ }, /*#__PURE__*/React__default['default'].createElement("rect", {
9620
+ width: "14",
9621
+ height: "14",
9622
+ rx: "4",
9623
+ fill: "black",
9624
+ "fill-opacity": "0.1"
9625
+ }), /*#__PURE__*/React__default['default'].createElement("path", {
9626
+ d: "M6.64775 8.97978L3.77152 6.10355C3.45654 5.78857 3.67962 5.25 4.12507 5.25H9.87753C10.323 5.25 10.5461 5.78857 10.2311 6.10355L7.35486 8.97978C7.15959 9.17504 6.84301 9.17504 6.64775 8.97978Z",
9627
+ fill: "#363B3F"
9666
9628
  }))));
9667
9629
  };
9668
9630