@ledvance/group-ui-biz-bundle 1.0.131 → 1.0.133

package/package.json

@@ -4,7 +4,7 @@
   "name": "@ledvance/group-ui-biz-bundle",
   "pid": [],
   "uiid": "",
-  "version": "1.0.131",
+  "version": "1.0.133",
   "scripts": {},
   "dependencies": {
     "@ledvance/base": "^1.x",

package/src/modules/energyConsumption/EnergyConsumptionCard.tsx

@@ -0,0 +1,249 @@
+import { DeviceInfo, NativeApi, queryDpIds } from '@ledvance/base/src/api/native'
+import Card from '@ledvance/base/src/components/Card'
+import Spacer from '@ledvance/base/src/components/Spacer'
+import ThemeType from '@ledvance/base/src/config/themeType'
+import I18n from '@ledvance/base/src/i18n'
+import { useGroupDevices, useUAGroupInfo } from '@ledvance/base/src/models/modules/NativePropsSlice'
+import { xLog } from '@ledvance/base/src/utils'
+import { localeNumber } from '@ledvance/base/src/utils/common'
+import { useIsFocused, useNavigation } from '@react-navigation/native'
+import { useReactive, useUpdateEffect } from 'ahooks'
+import React, { useEffect, useMemo, useRef } from 'react'
+import { Image, StyleSheet, Text, View } from 'react-native'
+import { Utils } from 'tuya-panel-kit'
+import { ui_biz_routerKey } from '../../navigation/Routers'
+import { getEnergyGenerationValue, } from './EnergyConsumptionActions'
+import { EnergyConsumptionPageProps } from './EnergyConsumptionPage'
+import Res from './res'
+
+const { convertX: cx } = Utils.RatioUtils
+const { withTheme } = Utils.ThemeUtils
+
+export interface EnergyConsumptionProp {
+  theme?: ThemeType
+  electricDpCode: string
+  powerDpCode: string
+  addEleDpCode: string
+}
+
+const SolarPlugPid = 'rcqe1i17x0vrvws7'
+
+const EnergyConsumptionCard = (props: EnergyConsumptionProp) => {
+  const navigation = useNavigation()
+  const isFocused = useIsFocused()
+  const uaGroupInfo = useUAGroupInfo()
+  const [groupDevices] = useGroupDevices()
+  const updateEnergy: any = useRef()
+
+  const state = useReactive({
+    solarPowerSum: 0,
+    solarCurrentSum: 0,
+    wifiPowerSum: 0,
+    wifiCurrentSum: 0,
+    totalPowerSum: 0,
+    totalCurrentSum: 0,
+    loading: false,
+    generationCache: {}
+  })
+
+  useEffect(() => {
+    if (groupDevices && groupDevices.length) {
+      getEnergyConsumption(groupDevices).then()
+    }
+  }, [groupDevices])
+
+  const isOnlyGeneration = useMemo(() => groupDevices.every(device => state.generationCache[device.tuyaDeviceId]), [groupDevices, JSON.stringify(state.generationCache)])
+  const hasGeneration = useMemo(() => groupDevices.some(device => state.generationCache[device.tuyaDeviceId]), [groupDevices, JSON.stringify(state.generationCache)])
+
+  useEffect(() => {
+    if (isFocused) {
+      updateEnergy.current = setInterval(() => {
+        xLog('setInterval========')
+        groupDevices.forEach(item => {
+          const jsonData = JSON.stringify([props.electricDpCode, props.powerDpCode])
+          queryDpIds(jsonData, item.tuyaDeviceId).then()
+        })
+        NativeApi.getGroupDevices(uaGroupInfo.tyGroupId).then(res => {
+          if (res.success && res.data) {
+            getEnergyConsumption(res.data).then()
+          }
+        })
+      }, 10000)
+    }
+
+    return () => clearInterval(updateEnergy.current)
+  }, [isFocused, groupDevices.length])
+
+  const isGenerationFromCache = async (tyPid: string, deviceId: string) => {
+    const cache = state.generationCache[deviceId]
+    if (cache !== undefined) {
+      return cache
+    }
+    const data = await getEnergyGenerationValue(deviceId)
+    const generationMode = data?.generationMode || false
+    const isGeneration = (tyPid === SolarPlugPid) !== generationMode
+    state.generationCache[deviceId] = isGeneration
+    return isGeneration
+  }
+
+  const getEnergyConsumption = async (groupDevices: DeviceInfo[]) => {
+    let power = 0
+    let current = 0
+    let solarPower = 0
+    let solarCurrent = 0
+    const powerDp = props.powerDpCode
+    const currentDp = props.electricDpCode
+
+    for (const device of groupDevices) {
+      if (device.dps) {
+        const isSolarDevice = await isGenerationFromCache(device.tyPid, device.tuyaDeviceId)
+        const dps = JSON.parse(device.dps)
+        if (isSolarDevice) {
+          solarPower += dps[powerDp] ?? 0
+          solarCurrent += dps[currentDp] ?? 0
+        } else {
+          power += dps[powerDp] ?? 0
+          current += dps[currentDp] ?? 0
+        }
+      }
+    }
+    state.wifiCurrentSum = current
+    state.wifiPowerSum = power / 10
+    state.solarCurrentSum = solarCurrent
+    state.solarPowerSum = solarPower / 10
+  }
+
+  useUpdateEffect(() => {
+    if (hasGeneration) {
+      if (isOnlyGeneration) {
+        state.totalCurrentSum = state.solarCurrentSum
+        state.totalPowerSum = state.solarPowerSum
+      } else {
+        state.totalCurrentSum = state.wifiCurrentSum - state.solarCurrentSum
+        state.totalPowerSum = state.wifiPowerSum - state.solarPowerSum
+      }
+    } else {
+      state.totalCurrentSum = state.wifiCurrentSum
+      state.totalPowerSum = state.wifiPowerSum
+    }
+  }, [state.solarCurrentSum, state.solarPowerSum, state.wifiCurrentSum, state.wifiPowerSum, isOnlyGeneration, hasGeneration])
+
+  const energyText = useMemo(() => {
+    return I18n.getLang(isOnlyGeneration ? 'sockets_headline_power' : !hasGeneration ? 'sockets_ce' : 'group_energytotal')
+  }, [hasGeneration, isOnlyGeneration])
+
+  const unitDivision = (str: string) => {
+    if (!str) {
+      return ['', '']
+    }
+    const strIndex = str.indexOf('(') || str.indexOf('（')
+    const unit = str.substring(strIndex)
+    const name = str.split(unit)[0]
+    return [name, unit]
+  }
+
+  const styles = StyleSheet.create({
+    consumedEnergyCard: {
+      marginHorizontal: cx(24),
+    },
+    consumedEnergyHeadline: {
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      alignItems: 'center',
+      marginHorizontal: cx(16),
+    },
+    consumedEnergyCardTitle: {
+      color: props.theme?.global.fontColor,
+      fontSize: cx(16),
+      // fontFamily: 'helvetica_neue_lt_std_bd',
+      fontWeight: 'bold',
+    },
+    consumedEnergyContent: {
+      flexDirection: 'row',
+    },
+    consumedEnergyItem: {
+      flex: 1,
+      alignItems: 'center',
+    },
+    consumedEnergyItemValue: {
+      color: props.theme?.global.secondBrand,
+      fontSize: cx(24),
+      // fontFamily: 'helvetica_neue_lt_std_bd',
+      fontWeight: 'bold',
+    },
+    consumedEnergyItemUnit: {
+      color: props.theme?.global.secondFontColor,
+      fontSize: cx(14),
+      fontFamily: 'helvetica_neue_lt_std_roman',
+      textAlign: 'center'
+    },
+    subContent: {
+      flex: 1,
+      alignItems: 'center',
+      marginBottom: cx(9)
+    },
+    valueText: {
+      fontSize: cx(24),
+      fontWeight: 'bold',
+      color: props.theme?.global.secondBrand,
+    },
+    titleText: {
+      fontFamily: 'helvetica_neue_lt_std_roman',
+      fontSize: cx(14),
+      color: props.theme?.global.secondFontColor,
+      textAlign: 'center',
+    },
+    unitText: {
+      fontFamily: 'helvetica_neue_lt_std_roman',
+      fontSize: cx(14),
+      color: props.theme?.global.secondFontColor,
+    },
+  })
+
+  const ConsumedEnergyItem = (props: { value: number, unit: string }) => {
+    return (
+      <View style={styles.subContent}>
+        <Text style={styles.valueText}>{(props.value) || 0}</Text>
+        <Spacer height={cx(4)}/>
+        <Text style={styles.titleText}>
+          {unitDivision(props.unit)[0]}
+        </Text>
+        <Text style={styles.titleText}>
+          {unitDivision(props.unit)[1]}
+        </Text>
+      </View>
+    )
+  }
+
+  return <Card
+    style={styles.consumedEnergyCard}
+    onPress={() => navigation.navigate(ui_biz_routerKey.group_ui_biz_energy_consumption, {
+      solarCurrentSum: state.solarCurrentSum,
+      solarPowerSum: state.solarPowerSum,
+      wifiCurrentSum: state.wifiCurrentSum,
+      wifiPowerSum: state.wifiPowerSum,
+      solarPlugGroup: groupDevices.filter(device => state.generationCache[device.tuyaDeviceId]).map(d => d.tuyaDeviceId),
+      wifiPlugGroup: groupDevices.filter(device => !state.generationCache[device.tuyaDeviceId]).map(d => d.tuyaDeviceId),
+      addEleDpCode: props.addEleDpCode,
+      backText: energyText
+    } as EnergyConsumptionPageProps)}>
+    <Spacer height={cx(16)}/>
+    <View style={styles.consumedEnergyHeadline}>
+      <Text
+        style={styles.consumedEnergyCardTitle}>{energyText}</Text>
+      <Image source={Res.energyChart} style={{ width: cx(24), height: cx(24), tintColor: props.theme?.icon.normal }}/>
+    </View>
+    <Spacer height={cx(18)}/>
+    <View style={styles.consumedEnergyContent}>
+      <ConsumedEnergyItem
+        value={localeNumber(state.totalPowerSum)}
+        unit={I18n.getLang('consumption_data_field2_value_text1')}/>
+      <ConsumedEnergyItem
+        value={localeNumber(state.totalCurrentSum)}
+        unit={I18n.getLang('consumption_data_field2_value_text2')}/>
+    </View>
+    <Spacer height={cx(17)}/>
+  </Card>
+}
+
+export default withTheme(EnergyConsumptionCard)

package/src/modules/energyConsumption/EnergyConsumptionChart.tsx

@@ -132,7 +132,7 @@ const EnergyConsumptionChart = (props: { theme?: ThemeType }) => {
         state.headlineText = `${monthFormat(month)} ${year}`;
         break
       case DateType.Day:
-        state.headlineText = `${day}/${month}/${year}\n${loopsText[dayOfWeek]}`;
+        state.headlineText = `${day}/${month}/${year} (${loopsText[dayOfWeek]})`;
         break
     }
   }, [state.dateType, state.headlineText]);

package/src/modules/energyConsumption/EnergyConsumptionPage.tsx

@@ -346,7 +346,20 @@ const EnergyConsumptionPage = (props: { theme?: ThemeType }) => {
             <Spacer height={cx(10)} />
           </Card>
           <Spacer />
-          <Card style={styles.cardContainer}>
+          <Card
+            style={styles.cardContainer}
+            onPress={() => {
+              navigation.navigate(ui_biz_routerKey.group_ui_biz_energy_consumption_chart, {
+                headlineText: chartHeadline,
+                chartData: state.isSolarMode ? state.solarOverviewList : state.wifiOverviewList,
+                price: state.price,
+                unit: state.unit,
+                addEleDpCode: params.addEleDpCode,
+                date: (new Date()).getFullYear().toString(),
+                deviceIdGroup: state.isSolarMode ? params.solarPlugGroup : params.wifiPlugGroup,
+              } as EnergyConsumptionChartProps)
+            }}
+          >
             <Text style={styles.cardTitle}>
               {I18n.getLang('consumption_data_field2_headline_text')}
             </Text>

package/src/modules/energyConsumption/component/NewBarChart.tsx

@@ -1,180 +1,182 @@
-import React, {useMemo, useRef} from 'react';
-import {View} from 'react-native';
-import ECharts from '@ledvance/react-native-echarts-pro';
-import I18n from "@ledvance/base/src/i18n";
-import ThemeType from "@ledvance/base/src/config/themeType";
-import {Utils} from "tuya-panel-kit";
-import {OverviewItem} from "../EnergyConsumptionPage";
+import ThemeType from '@ledvance/base/src/config/themeType'
+import I18n from '@ledvance/base/src/i18n'
+import ECharts from '@ledvance/react-native-echarts-pro'
+import React, { useMemo, useRef } from 'react'
+import { View } from 'react-native'
+import { Utils } from 'tuya-panel-kit'
+import { OverviewItem } from '../EnergyConsumptionPage'
 
-const {withTheme} = Utils.ThemeUtils
-const cx = Utils.RatioUtils.convertX;
+const { withTheme } = Utils.ThemeUtils
+const cx = Utils.RatioUtils.convertX
 
 interface BarChartProps {
-    theme?: ThemeType
-    data: OverviewItem[],
-    price: number,
-    unit: string,
-    height: number
+  theme?: ThemeType
+  data: OverviewItem[],
+  price: number,
+  unit: string,
+  height: number
 }
 
 const BarChartWithTouch = (props: BarChartProps) => {
-    const echarts = useRef();
-    const {data, height, price, unit, theme} = props;
-    const dataX = data?.map(item => {
-        return item.chartTitle;
-    });
-    const dataKwhY = data?.map(item => {
-        return Number(item.value);
-    });
-    const dataPriceY = data?.map(item => {
-        return ((isNaN(Number(item.value)) ? 0 : Number(item.value)) * price).toFixed(2);
-    });
-    const maxValue = useMemo(() => {
-        let max = Math.max(...dataKwhY)
-        if (max < 0.1) {
-            max += 0.02
-            max = max - (max % 0.02)
-        } else if (max < 1) {
-            max += 0.2
-            max = max - (max % 0.2)
-        } else if (max < 10) {
-            max = Math.ceil(max) + 2
-            max = max - (max % 2)
-        }
-        return max
-    }, [dataKwhY]);
-    const gridRight = useMemo(() => {
-        const max = Math.max(...dataPriceY.map(it => Number(it)))
-        return max > 999 ? '15%' : '10%'
-    }, [dataPriceY])
-    const option = {
-        tooltip: {
-            show: true,
-            triggerOn: 'click',
-            trigger: 'axis',
+  const echarts = useRef()
+  const { data, height, price, unit, theme } = props
+  const dataX = data?.map(item => {
+    return item.chartTitle
+  })
+  const dataKwhY = data?.map(item => {
+    return Number(item.value)
+  })
+  const dataPriceY = data?.map(item => {
+    return ((isNaN(Number(item.value)) ? 0 : Number(item.value)) * price).toFixed(2)
+  })
+  const maxValue = useMemo(() => {
+    let max = Math.max(...dataKwhY)
+    if (max < 0.1) {
+      max += 0.02
+      max = max - (max % 0.02)
+    } else if (max < 1) {
+      max += 0.2
+      max = max - (max % 0.2)
+    } else if (max < 10) {
+      max = Math.ceil(max) + 2
+      max = max - (max % 2)
+    }
+    return max
+  }, [dataKwhY])
+  const gridRight = useMemo(() => {
+    const max = Math.max(...dataPriceY.map(it => Number(it)))
+    return max > 999 ? '15%' : '10%'
+  }, [dataPriceY])
+  const option = {
+    tooltip: {
+      show: true,
+      triggerOn: 'click',
+      trigger: 'axis',
+    },
+    legend: {
+      show: true,
+      data: ['kWh', unit],
+      textStyle: {
+        color: theme?.global.fontColor,
+      }
+    },
+    grid: {
+      right: gridRight,
+    },
+    xAxis: {
+      data: dataX,
+      axisTick: {
+        show: false,
+      },
+      axisLabel: {
+        show: true,
+        color: props.theme?.global.secondFontColor,
+        interval: 'auto',
+        rotate: 45,
+        align: 'right',
+        verticalAlign: 'top'
+      }
+    },
+    yAxis: [{
+      type: 'value',
+      name: I18n.getLang('consumption_data_annual_bar_chart_text'),
+      max: Math.max(maxValue, 0.02),
+      min: 0,
+      position: 'left',
+      axisLabel: {
+        formatter: function (value) {
+          const kwh = parseFloat(value)
+          let toFixed = 2
+          if (kwh >= 100) {
+            toFixed = 0
+          } else if (kwh >= 10) {
+            toFixed = 1
+          }
+          return kwh.toFixed(toFixed)
         },
-        legend: {
-            show: true,
-            data: ['kWh', unit],
-            textStyle: {
-                color: theme?.global.fontColor,
-            }
+        color: props.theme?.global.secondFontColor,
+      },
+      nameTextStyle: {
+        fontSize: 14,
+        align: 'left',
+        padding: [0, 0, 0, cx(-30)],
+        color: props.theme?.global.secondFontColor,
+      },
+    }, {
+      type: 'value',
+      name: I18n.formatValue('format_unit', unit),
+      position: 'right',
+      alignTicks: true,
+      max: Math.ceil(price ? maxValue * price * 1.4 : 0),
+      min: 0,
+      minInterval: 1,
+      axisLabel: {
+        formatter: function (value) {
+          const price = parseFloat(value)
+          let toFixed = 2
+          if (price >= 100) {
+            toFixed = 0
+          } else if (price >= 10) {
+            toFixed = 1
+          }
+          return price.toFixed(toFixed)
         },
-        grid: {
-            right: gridRight,
+        color: props.theme?.global.secondFontColor,
+      },
+      nameTextStyle: {
+        fontSize: 14,
+        align: 'right',
+        padding: [0, cx(-30), 0, 0],
+        color: props.theme?.global.secondFontColor,
+      },
+    }],
+    series: [
+      {
+        name: 'kWh',
+        type: 'bar',
+        data: dataKwhY,
+        itemStyle: {
+          emphasis: {
+            color: '#FFC2A9', // Color when bar is clicked
+          },
+          color: '#FFC2A9',
+          borderRadius: 2,
         },
-        xAxis: {
-            data: dataX,
-            axisTick: {
-                show: false,
-            },
-            axisLabel: {
-                show: true,
-                color: props.theme?.global.secondFontColor,
-                interval: 0,
-            }
+        barMaxWidth: 10,
+        select: {
+          itemStyle: {
+            borderColor: '#FFC2A9',
+          }
         },
-        yAxis: [{
-            type: 'value',
-            name: I18n.getLang('consumption_data_annual_bar_chart_text'),
-            max: Math.max(maxValue, 0.02),
-            min: 0,
-            position: 'left',
-            axisLabel: {
-                formatter: function (value) {
-                    const kwh=parseFloat(value);
-                    let toFixed = 2;
-                    if (kwh >= 100) {
-                        toFixed = 0;
-                    } else if (kwh >= 10) {
-                        toFixed = 1;
-                    }
-                    return kwh.toFixed(toFixed);
-                },
-                color:props.theme?.global.secondFontColor,
-            },
-            nameTextStyle: {
-                fontSize: 14,
-                align:'left',
-                padding: [0, 0, 0, cx(-30)],
-                color: props.theme?.global.secondFontColor,
-            },
-        }, {
-            type: 'value',
-            name: I18n.formatValue('format_unit', unit),
-            position: 'right',
-            alignTicks: true,
-            max: Math.ceil(price ? maxValue * price * 1.4 : 0),
-            min: 0,
-            minInterval: 1,
-            axisLabel: {
-                formatter: function (value) {
-                    const price=parseFloat(value);
-                    let toFixed = 2;
-                    if (price >= 100) {
-                        toFixed = 0;
-                    } else if (price >= 10) {
-                        toFixed = 1;
-                    }
-                    return price.toFixed(toFixed);
-                },
-                color:props.theme?.global.secondFontColor,
-            },
-            nameTextStyle: {
-                fontSize: 14,
-                align:'right',
-                padding: [0, cx(-30), 0, 0],
-                color: props.theme?.global.secondFontColor,
-            },
-        }],
-        series: [
-            {
-                name: 'kWh',
-                type: 'bar',
-                data: dataKwhY,
-                itemStyle: {
-                    emphasis: {
-                        color: '#FFC2A9', // Color when bar is clicked
-                    },
-                    color: '#FFC2A9',
-                    borderRadius: 2,
-                },
-                barMaxWidth: 10,
-                select: {
-                    itemStyle: {
-                        borderColor: '#FFC2A9',
-                    }
-                },
-                selectedMode: 'single',
-            },
-            {
-                name: unit,
-                type: 'line',
-                data: dataPriceY,
-                yAxisIndex: 1,
-                smooth: true,
-                showSymbol: false,
-                color: '#F49431',
-                selectedMode: "single",
-            }
-        ],
-        dataZoom: {
-            start: 0,
-            type: "inside",
-            maxValueSpan: 5,
-            zoomLock: true,
-        },
-        customMapData: {}
-    };
-    return (
-      <View style={{flex: 1}}>
-          <ECharts
-            option={option}
-            ref={echarts}
-            height={height}
-          />
-      </View>
-    );
-};
+        selectedMode: 'single',
+      },
+      {
+        name: unit,
+        type: 'line',
+        data: dataPriceY,
+        yAxisIndex: 1,
+        smooth: true,
+        showSymbol: false,
+        color: '#F49431',
+        selectedMode: 'single',
+      }
+    ],
+    dataZoom: {
+      start: 0,
+      type: 'inside',
+      zoomLock: true,
+    },
+    customMapData: {}
+  }
+  return (
+    <View style={{ flex: 1 }}>
+      <ECharts
+        option={option}
+        ref={echarts}
+        height={height}
+      />
+    </View>
+  )
+}
 
 export default withTheme(BarChartWithTouch)

package/src/modules/energyConsumption/res/index.ts

@@ -0,0 +1,3 @@
+export default {
+  energyChart: require('./energy-chart.png')
+}

package/src/modules/fixedTimeForPlug/FixedTimeForPlugDetailPage.tsx

@@ -17,7 +17,7 @@ import Spacer from "@ledvance/base/src/components/Spacer";
 import Summary from "./Summary";
 import {parseHour12} from "@tuya/tuya-panel-lamp-sdk/lib/utils";
 import DeleteButton from "@ledvance/base/src/components/DeleteButton";
-import LdvPickerView from "@ledvance/base/src/components/ldvPickerView";
+import LdvPickerView from "@ledvance/base/src/components/LdvPickerView";
 import ThemeType from '@ledvance/base/src/config/themeType'
 
 const {parseTimer} = Utils.TimeUtils

package/src/modules/fixedTimingForLight/FixedTimingForLightDetailPage.tsx

@@ -20,7 +20,7 @@ import Card from "@ledvance/base/src/components/Card";
 import LdvSwitch from "@ledvance/base/src/components/ldvSwitch";
 import LampAdjustView from "@ledvance/base/src/components/LampAdjustView";
 import {parseHour12} from "@tuya/tuya-panel-lamp-sdk/lib/utils";
-import LdvPickerView from "@ledvance/base/src/components/ldvPickerView";
+import LdvPickerView from "@ledvance/base/src/components/LdvPickerView";
 import ThemeType from '@ledvance/base/src/config/themeType'
 
 const {parseTimer} = Utils.TimeUtils

package/src/modules/sleepWakeUp/SleepWakeUpDetailPage.tsx

@@ -7,7 +7,7 @@ import res from '@ledvance/base/src/res';
 import { TimerPicker, Utils } from 'tuya-panel-kit';
 import { useReactive, useUpdateEffect } from 'ahooks';
 import TextField from '@ledvance/base/src/components/TextField';
-import LdvPickerView from '@ledvance/base/src/components/ldvPickerView';
+import LdvPickerView from '@ledvance/base/src/components/LdvPickerView';
 import LdvWeekView from '@ledvance/base/src/components/weekSelect';
 import {
   convertMinutesTo12HourFormat,

package/src/modules/switchInching/SwitchInching.tsx

@@ -4,7 +4,7 @@ import Page from "@ledvance/base/src/components/Page";
 import {useUAGroupInfo} from "@ledvance/base/src/models/modules/NativePropsSlice";
 import {useNavigation} from '@react-navigation/native'
 import {SwitchButton, Utils} from "tuya-panel-kit";
-import LdvPickerView from "@ledvance/base/src/components/ldvPickerView";
+import LdvPickerView from "@ledvance/base/src/components/LdvPickerView";
 import I18n from '@ledvance/base/src/i18n'
 import {defSwitchInching, SwitchInchingItem, SwitchInchingPageParams, useSwitchInching} from "./SwitchInchingAction";
 import ThemeType from '@ledvance/base/src/config/themeType'

package/src/modules/timer/TimerPage.tsx

@@ -4,7 +4,7 @@ import I18n from '@ledvance/base/src/i18n'
 import Page from '@ledvance/base/src/components/Page'
 import {Utils} from 'tuya-panel-kit'
 import {useUAGroupInfo} from '@ledvance/base/src/models/modules/NativePropsSlice'
-import LdvPickerView from '@ledvance/base/src/components/ldvPickerView'
+import LdvPickerView from '@ledvance/base/src/components/LdvPickerView'
 import {useReactive} from 'ahooks'
 import Spacer from '@ledvance/base/src/components/Spacer'
 import DeleteButton from '@ledvance/base/src/components/DeleteButton'

package/tsconfig.json

@@ -1,51 +1,76 @@
 {
-    "compilerOptions": {
-        /* Basic Options */
-        "target": "ES2017",
-        /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
-        "module": "commonjs",
-        /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
-        "jsx": "react",
-        /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
+  "compilerOptions": {
+    /* Basic Options */
+    "target": "ES2017",
+    "lib": ["es2017"],
+    /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
+    "module": "commonjs",
+    /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
+    "jsx": "react",
+    /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
 
-        /* Strict Type-Checking Options */
-        /* "strict": true                         /* Enable all strict type-checking options. */
-        "noImplicitAny": false,
-        /* Raise error on expressions and declarations with an implied 'any' type. */
-        "strictNullChecks": true,
-        /* Enable strict null checks. */
+    /* Strict Type-Checking Options */
+    /* "strict": true                         /* Enable all strict type-checking options. */
+    "noImplicitAny": false,
+    /* Raise error on expressions and declarations with an implied 'any' type. */
+    "strictNullChecks": true,
+    /* Enable strict null checks. */
 
-        /* Additional Checks */
-        "noUnusedLocals": true,
-        /* Report errors on unused locals. */
-        "noUnusedParameters": true,
-        /* Report errors on unused parameters. */
+    /* Additional Checks */
+    "noUnusedLocals": true,
+    /* Report errors on unused locals. */
+    "noUnusedParameters": true,
+    /* Report errors on unused parameters. */
 
-        /* .d.ts config */
-        "declaration": true,
-        "emitDeclarationOnly": true,
-
-        /* Module Resolution Options */
-        "moduleResolution": "node",
-        /* Specify module resolution strategy: 'node' (Node.js) or 'classic'  */
-        "types": ["react", "react-native"],
-        /* Type declaration files to be included in compilation. */
-        "typeRoots": ["@types/*.d.ts"],
-        "allowSyntheticDefaultImports": true,
-        /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
-        "esModuleInterop": true,
-        /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
-        "baseUrl": "./src",
-        "paths": {
-            "@api": ["./api"],
-            "@components": ["./components"],
-            "@config": ["./config"],
-            "@i18n": ["./i18n"],
-            "@models": ["./models"],
-            "@res": ["./res"],
-            "@utils": ["./utils"]
-        }
-    },
-    "include": ["src/**/*.ts","src/**/*.tsx"],
-    "exclude": ["node_modules",".yalc"]
+    /* .d.ts config */
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    /* Module Resolution Options */
+    "moduleResolution": "node",
+    /* Specify module resolution strategy: 'node' (Node.js) or 'classic'  */
+    "types": [
+      "react",
+      "react-native"
+    ],
+    /* Type declaration files to be included in compilation. */
+    "typeRoots": [
+      "@types/*.d.ts"
+    ],
+    "allowSyntheticDefaultImports": true,
+    /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
+    "esModuleInterop": true,
+    /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
+    "baseUrl": "./src",
+    "paths": {
+      "@api": [
+        "./api"
+      ],
+      "@components": [
+        "./components"
+      ],
+      "@config": [
+        "./config"
+      ],
+      "@i18n": [
+        "./i18n"
+      ],
+      "@models": [
+        "./models"
+      ],
+      "@res": [
+        "./res"
+      ],
+      "@utils": [
+        "./utils"
+      ]
+    }
+  },
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules",
+    ".yalc"
+  ]
 }