@ledvance/base 1.3.83 → 1.3.84

package/package.json

@@ -4,7 +4,7 @@
   "name": "@ledvance/base",
   "pid": [],
   "uiid": "",
-  "version": "1.3.83",
+  "version": "1.3.84",
   "scripts": {
     "prepublishOnly": "python update-localazy.py"
   },

package/src/components/Cell.tsx

@@ -1,17 +1,23 @@
-import {IconFont, Utils} from 'tuya-panel-kit'
-import {StyleProp, Text, TextStyle, TouchableOpacity, View, ViewStyle} from 'react-native'
+import { IconFont, Utils } from 'tuya-panel-kit'
+import { StyleProp, Text, TextStyle, TouchableOpacity, View, ViewStyle, Image, ImageSourcePropType, ImageStyle } from 'react-native'
 import React from 'react'
 import ThemeType from "../config/themeType";
 
 const cx = Utils.RatioUtils.convertX
-const {withTheme} = Utils.ThemeUtils
+const { withTheme } = Utils.ThemeUtils
 
 interface CellProps {
   theme?: ThemeType
+  icon?: ImageSourcePropType
+  iconStyle?: StyleProp<ImageStyle>
   title: string,
   value: string,
   onPress: () => void,
+  needArrow?: boolean
   style?: StyleProp<ViewStyle>
+  contentStyle?: StyleProp<ViewStyle>
+  titleStyle?: StyleProp<TextStyle>
+  valueStyle?: StyleProp<TextStyle>
 }
 
 export default withTheme(function Cell(props: CellProps) {
@@ -26,38 +32,53 @@ export default withTheme(function Cell(props: CellProps) {
         backgroundColor: props.theme?.card.background,
       }, props.style]}
       onPress={props.onPress}>
-      <CellContent title={props.title} value={props.value}/>
+      <CellContent
+        icon={props.icon}
+        iconStyle={props.iconStyle}
+        title={props.title}
+        titleStyle={props.titleStyle}
+        value={props.value}
+        valueStyle={props.valueStyle}
+        needArrow={props.needArrow ?? true}
+        style={props.contentStyle}
+      />
     </TouchableOpacity>
   )
 }) as React.ComponentType<CellProps>
 
 interface CellContentProps {
   theme?: ThemeType
+  icon?: ImageSourcePropType
+  iconStyle?: StyleProp<ImageStyle>
   title: string
   value: string
   style?: StyleProp<ViewStyle>
   titleStyle?: StyleProp<TextStyle>
   valueStyle?: StyleProp<TextStyle>
-  iconStyle?: { color?: any, size?: number }
+  needArrow: boolean
+  arrowStyle?: { color?: any, size?: number }
 }
 
 const CellContentBase = (props: CellContentProps) => {
   return (
     <View
       style={[
-        {flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center'},
+        { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' },
         props.style,
       ]}>
-      <Text
-        style={[
-          {
-            fontSize: cx(14),
-            color: props.theme?.global.secondFontColor,
-            fontFamily: 'helvetica_neue_lt_std_roman',
-          },
-          props.titleStyle,
-        ]}>{props.title}</Text>
-      <View style={{flexDirection: 'row', alignItems: 'center'}}>
+      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
+        {props.icon && (<Image source={props.icon} style={[{ width: cx(24), height: cx(24), marginRight: cx(10) }, props.iconStyle]} />)}
+        <Text
+          style={[
+            {
+              fontSize: cx(14),
+              color: props.theme?.global.secondFontColor,
+              fontFamily: 'helvetica_neue_lt_std_roman',
+            },
+            props.titleStyle,
+          ]}>{props.title}</Text>
+      </View>
+      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
         <Text style={[
           {
             fontSize: cx(14),
@@ -66,11 +87,15 @@ const CellContentBase = (props: CellContentProps) => {
           },
           props.valueStyle,
         ]}>{props.value}</Text>
-        <View style={{width: cx(4)}}/>
-        <IconFont
-          name="arrow"
-          color={props.iconStyle?.color || props.theme?.global.secondFontColor}
-          size={props.iconStyle?.size || cx(11)}/>
+        <View style={{ width: cx(4) }} />
+        {
+          props.needArrow && (
+            <IconFont
+              name="arrow"
+              color={props.arrowStyle?.color || props.theme?.global.secondFontColor}
+              size={props.arrowStyle?.size || cx(11)} />
+          )
+        }
       </View>
     </View>
   )

package/src/config/dark-theme.ts

@@ -63,6 +63,12 @@ const darkTheme = {
     border: '#888888',
     fontColor: '#ffffff',
   },
+  tabBar: {
+    background: '#2a2a2a',
+    active: '#ffffff',
+    inactive: '#4a4a4a',
+    divider: '#e0e0e0',
+  },
   dialog: {
     width: cx(315), // 弹窗容器宽度
     bg: "#2a2a2a", // 弹窗背景色

package/src/config/light-theme.ts

@@ -63,6 +63,12 @@ const lightTheme = {
     border: '#666666',
     fontColor: '#000000',
   },
+  tabBar: {
+    background: '#ffffff',
+    active: '#ff6600',
+    inactive: '#666666',
+    divider: '#e0e0e0'
+  },
   dialog: {
     width: cx(315), // 弹窗容器宽度
     bg: "#ffffff", // 弹窗背景色

package/src/hooks/Hooks.ts

@@ -1,4 +1,5 @@
 import { useRoute, useNavigation } from '@react-navigation/core'
+import { Result } from 'models/modules/Result'
 import { useCallback, useEffect, useRef } from 'react'
 
 export function createParams<T>(params: T): T {
@@ -59,3 +60,54 @@ export function useDpResponseValidator(timeoutMs: number = 1000) {
     onDpResponse,
   };
 }
+
+interface IControlData {
+  colorMode: boolean
+  hue: number
+  saturation: number
+  value: number
+  brightness: number
+  temperature: number
+}
+
+interface IControlDataOptions {
+  mode?: 0 | 1 // 0: 跳变, 1: 渐变
+  saturationConvert?: (v: number) => number
+  valueConvert?: (v: number) => number
+  temperatureConvert?: (v: number) => number
+  brightnessConvert?: (v: number) => number
+}
+
+/**
+ * 通用控制支持device和group
+ * @param control Tuya Control Formatter
+ * @param sendValueFunc send tuya control function
+ * @returns 
+ */
+export function useControlData(control: any, sendValueFunc: (value: any) => Promise<Result<any>>): (
+  controlValue: IControlData,
+  options?: IControlDataOptions
+) => Promise<any> {
+  const setControlData = useCallback(
+    async (controlValue: IControlData, options: IControlDataOptions = {}) => {
+      const {
+        mode = 1,
+        saturationConvert = (v: number) => Math.round(v * 10),
+        valueConvert = (v: number) => Math.round(v * 10),
+        temperatureConvert = (v: number) => Math.round(v * 10),
+        brightnessConvert = (v: number) => Math.round(v * 10),
+      } = options
+      const value = control.format({
+        mode: mode,
+        hue: controlValue.colorMode ? controlValue.hue : 0,
+        saturation: controlValue.colorMode ? saturationConvert(controlValue.saturation) : 0,
+        value: controlValue.colorMode ? valueConvert(controlValue.value) : 0,
+        temperature: !controlValue.colorMode ? temperatureConvert(controlValue.temperature) : 0,
+        brightness: !controlValue.colorMode ? brightnessConvert(controlValue.brightness) : 0,
+      });
+      return await sendValueFunc(value)
+    },
+    []
+  );
+  return setControlData
+}