update

package.json

 {
 	"name": "boxdialer",
-	"version": "4.8.79",
+	"version": "4.8.80",
 	"description": "",
 	"main": "src/boxDialer.js",
 	"scripts": {

src/components/setting/index.jsx

@@ -20,9 +20,11 @@ const SettingComponent = ({
             id: uuidv4(),
             title: 'Test-1',
             icon: <FormatPaintIcon className={'leftIcons'} />,
-            Content: ({keyItem}) => {
-                console.log('settingComponent_allData: ', keyItem)
-                return <SettingMainStyle.RightSelectInfoOneBlock key={keyItem}><StyleComponent /></SettingMainStyle.RightSelectInfoOneBlock>
+            Content: () => {
+                // return <div></div>
+                return <SettingMainStyle.RightSelectInfoOneBlock>
+                    <StyleComponent />
+                </SettingMainStyle.RightSelectInfoOneBlock>
             }
 
         },
@@ -30,7 +32,10 @@ const SettingComponent = ({
             id: uuidv4(),
             title: 'Test-2',
             icon: <BuildIcon className={'leftIcons'} />,
-            Content: ({ keyItem }) => <SettingMainStyle.RightSelectInfoOneBlock key={keyItem}><FixComponent /></SettingMainStyle.RightSelectInfoOneBlock>
+            Content: () => {
+                // return <div></div>
+                return <SettingMainStyle.RightSelectInfoOneBlock><FixComponent /></SettingMainStyle.RightSelectInfoOneBlock>
+            }
         }
     ]
 
@@ -61,7 +66,7 @@ const SettingComponent = ({
         </SettingMainStyle.LeftMenu>
         <SettingMainStyle.RightSelectInfo id={'data'}>
             {
-                allData?.map(({ Content, id }) => <Content keyItem={id} />)
+                allData?.map(({ Content, id }) => <Content key={id} />)
             }
         </SettingMainStyle.RightSelectInfo>
 

src/components/settingComponents/styleComponent/index.jsx

@@ -34,7 +34,7 @@ const StyleComponent = () => {
             aria-label="Restricted values"
             defaultValue={50}
             step={null}
-            value={typeof useColorConfigStore.state.sizePixel === 'undefined' ? true : useColorConfigStore.state.sizePixel}
+            value={typeof useColorConfigStore.state.sizePixel === 'undefined' ? 1 : useColorConfigStore.state.sizePixel}
             marks={marks}
             onChange={(e) => useColorConfigStore.setColor({ name: 'sizePixel', value: e.target.value })}
         /></div>
@@ -44,9 +44,11 @@ const StyleComponent = () => {
             onChange={(e) => useColorConfigStore.setColor({ name: 'switchAnim', value: e.target.checked })} />
     },]
 
-    return (<StyleBlock>
-        <MiniTable data={tableData} gap={'10px'} />
-    </StyleBlock>)
+    return (
+        <StyleBlock>
+            <MiniTable data={tableData} gap={'10px'} />
+        </StyleBlock>
+    )
 }
 
 export default StyleComponent