pixel-react-excel-sheet 1.0.15 → 1.0.16

package/lib/index.esm.js

@@ -32001,7 +32001,11 @@ const ExcelToolBar = ({
   const [underLine, setUnderLine] = useState('underline');
   const [selectedFontFamily, setSelectedFontFamily] = useState({
     label: 'Times New Roman',
-    value: '"Times New Roman"'
+    value: 'Times New Roman'
+  });
+  const [selectedFontSize, setSelectedFontSize] = useState({
+    label: '11',
+    value: '11'
   });
   const [colorContainer, setColorPicker] = useState({
     color: 'var(--error-light)',
@@ -32134,11 +32138,12 @@ const ExcelToolBar = ({
           className: "ff-excel-toolbar-font-family",
           children: jsx(Select$1, {
             showLabel: false,
-            optionZIndex: 10000,
+            optionZIndex: 1000,
             onChange: e => {
+              console.log(e);
               setSelectedFontFamily({
                 label: e.label,
-                value: e.value
+                value: e.label
               });
               setFontFamily(data, e.label);
             },
@@ -32154,14 +32159,17 @@ const ExcelToolBar = ({
           className: "ff-excel-toolbar-font-size",
           children: jsx(Select$1, {
             showLabel: false,
-            optionZIndex: 5000,
+            optionZIndex: 1000,
             required: false,
-            onChange: e => setFontSize(data, e.value),
+            onChange: e => {
+              setSelectedFontSize({
+                label: e.label,
+                value: e.value
+              });
+              setFontSize(data, e.value);
+            },
             optionsList: fontSize,
-            selectedOption: {
-              label: '11',
-              value: '11'
-            }
+            selectedOption: selectedFontSize
           })
         })
       })]
@@ -32237,7 +32245,7 @@ const ExcelToolBar = ({
             name: getUnderlineIcon()
           }), jsx(MenuOption, {
             iconName: "arrow_down",
-            zIndex: 2000,
+            zIndex: 1000,
             iconSize: 12,
             options: underlineTypeIcon,
             tooltipPlacement: "top",
@@ -32320,7 +32328,7 @@ const ExcelToolBar = ({
           }), jsx(MenuOption, {
             iconName: "arrow_down",
             iconSize: 12,
-            zIndex: 5000,
+            zIndex: 1000,
             options: borderTypeIcon,
             tooltipPlacement: "top",
             variant: "light",
@@ -32601,7 +32609,7 @@ const Spreadsheet = props => {
 var css_248z$j = ".ff-excel-book {\n  z-index: 1000;\n}\n.ff-excel-book .ff-excel-sheet {\n  position: static;\n  top: 0;\n}\n.ff-excel-book .ff-excel-sheet-bar {\n  position: static;\n  max-width: 100%;\n  margin-left: 60px;\n  display: flex;\n  height: 36px;\n  align-items: center;\n  color: var(--brand2-color);\n  box-shadow: 0px 0px 4px -1px var(--toggle-strip-shadow);\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-add-sheet-icon {\n  position: fixed;\n  margin-top: 4px;\n  padding: 0px 6px;\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container {\n  padding-left: 40px;\n  height: 36px;\n  display: flex;\n  overflow-x: auto;\n  align-items: center;\n  scrollbar-width: none;\n  scrollbar-color: var(--hover-color) transparent;\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container::-webkit-scrollbar-thumb {\n  border-radius: 5px;\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container::-webkit-scrollbar {\n  height: 0px;\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container .ff-excel-tab-list {\n  margin-top: 2px;\n  padding: 10px 9px;\n  min-width: max-content;\n  cursor: pointer;\n  display: flex;\n  background-color: var(--hover-color);\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container .ff-excel-tab-list.active {\n  background-color: var(--excel-sheet-button-color);\n}\n.ff-excel-book .ff-excel-sheet-bar .ff-excel-tab-container .ff-excel-tab-list:focus {\n  outline: none;\n  text-decoration: none;\n}";
 styleInject(css_248z$j);
 
-var css_248z$i = ".ff-excel-menu {\n  position: absolute;\n  border: 1px solid var(--option-card-border-color);\n  background: var(--option-card-bg-color);\n  border-radius: 4px;\n  margin: 2px;\n  min-height: 32px;\n  min-width: 111px;\n  white-space: nowrap;\n  z-index: 200;\n}\n.ff-excel-menu .ff-excel-menu-options {\n  color: var(--text-color);\n  cursor: pointer;\n  border-radius: 3px;\n  display: flex;\n  align-items: center;\n  padding: 4px;\n  gap: 8px;\n}\n.ff-excel-menu .ff-excel-menu-options:hover {\n  background-color: var(--hover-color);\n}\n.ff-excel-menu .ff-excel-menu-options label {\n  cursor: pointer;\n}";
+var css_248z$i = ".ff-excel-menu {\n  position: absolute;\n  border: 1px solid var(--option-card-border-color);\n  background: var(--option-card-bg-color);\n  border-radius: 4px;\n  margin: 2px;\n  min-height: 32px;\n  min-width: 111px;\n  white-space: nowrap;\n  z-index: 2000;\n}\n.ff-excel-menu .ff-excel-menu-options {\n  color: var(--text-color);\n  cursor: pointer;\n  border-radius: 3px;\n  display: flex;\n  align-items: center;\n  padding: 4px;\n  gap: 8px;\n}\n.ff-excel-menu .ff-excel-menu-options:hover {\n  background-color: var(--hover-color);\n}\n.ff-excel-menu .ff-excel-menu-options label {\n  cursor: pointer;\n}";
 styleInject(css_248z$i);
 
 const ExcelContextMenu = ({
@@ -32977,8 +32985,8 @@ const ExcelFile = ({
     setContextMenu({
       open: true,
       position: {
-        x: event.pageX - 50,
-        y: event.pageY - 350
+        x: event.pageX - 0,
+        y: event.pageY - 50
       },
       options: options
     });