@ledvance/base 1.3.104 → 1.3.106
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/package.json +1 -1
- package/src/components/AdvanceCard.tsx +1 -1
- package/src/components/ApplyForDeviceItem.tsx +2 -2
- package/src/components/ApplyForText.tsx +1 -1
- package/src/components/Battery.tsx +88 -0
- package/src/components/BatteryPercentageView.tsx +47 -42
- package/src/components/BatteryStateView.tsx +2 -2
- package/src/components/Cell.tsx +2 -2
- package/src/components/ColorAdjustView.tsx +5 -4
- package/src/components/ColorTempAdjustView.tsx +4 -3
- package/src/components/ColorsLine.tsx +2 -0
- package/src/components/DeleteButton.tsx +1 -1
- package/src/components/DiySceneItem.tsx +2 -3
- package/src/components/DrawToolView.tsx +8 -5
- package/src/components/HybridSwitchView.tsx +1 -1
- package/src/components/InfoText.tsx +1 -1
- package/src/components/MoodColorsLine.tsx +4 -2
- package/src/components/OptionGroup.tsx +3 -3
- package/src/components/Page.tsx +16 -15
- package/src/components/SocketItem.tsx +2 -2
- package/src/components/Summary.tsx +1 -1
- package/src/components/Tag.tsx +1 -1
- package/src/components/TextButton.tsx +1 -1
- package/src/components/TextField.tsx +2 -2
- package/src/components/TextFieldStyleButton.tsx +2 -2
- package/src/components/UATabTitle.tsx +1 -1
- package/src/components/UATabs.tsx +1 -1
- package/src/components/ldvColorSlider.tsx +50 -46
- package/src/components/ldvSlider.tsx +2 -2
- package/src/components/ldvTemperatureSlider.tsx +2 -2
- package/src/components/ldvTopBar.tsx +1 -1
- package/src/components/segmentControl.tsx +2 -2
- package/src/i18n/strings.ts +88 -88
package/package.json
CHANGED
|
@@ -102,7 +102,7 @@ const styles = StyleSheet.create({
|
|
|
102
102
|
marginHorizontal: cx(16),
|
|
103
103
|
fontSize: cx(14),
|
|
104
104
|
textAlign: 'center',
|
|
105
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
105
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
106
106
|
},
|
|
107
107
|
subtitle: {
|
|
108
108
|
fontSize: cx(10),
|
|
@@ -48,7 +48,7 @@ const ApplyForDeviceItem = (props: ApplyForDeviceItemProps) => {
|
|
|
48
48
|
marginStart: cx(8),
|
|
49
49
|
color: props.theme?.global.fontColor,
|
|
50
50
|
fontSize: cx(16),
|
|
51
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
51
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
52
52
|
},
|
|
53
53
|
deviceRoomInfo: {
|
|
54
54
|
marginStart: cx(38),
|
|
@@ -65,7 +65,7 @@ const ApplyForDeviceItem = (props: ApplyForDeviceItemProps) => {
|
|
|
65
65
|
marginHorizontal: cx(12),
|
|
66
66
|
color: props.theme?.tag.fontColor,
|
|
67
67
|
fontSize: cx(10),
|
|
68
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
68
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
69
69
|
},
|
|
70
70
|
offlineIcon: {
|
|
71
71
|
minWidth: cx(24),
|
|
@@ -25,7 +25,7 @@ const ApplyForText = (props: ApplyForTextProps) => {
|
|
|
25
25
|
color: props.theme?.global.secondFontColor,
|
|
26
26
|
fontSize: cx(16),
|
|
27
27
|
letterSpacing: cx(0.12),
|
|
28
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
28
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
29
29
|
},
|
|
30
30
|
icon: {
|
|
31
31
|
tintColor: props.theme?.global.secondFontColor,
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import { View, ColorPropType, ViewStyle, StyleProp } from 'react-native';
|
|
3
|
+
import Svg, { Path, Polygon } from 'react-native-svg';
|
|
4
|
+
import { Utils } from 'tuya-panel-kit';
|
|
5
|
+
|
|
6
|
+
const { convertX: cx } = Utils.RatioUtils;
|
|
7
|
+
|
|
8
|
+
// 电池外壳SVG路径 (常量)
|
|
9
|
+
const WRAP_BATTERY_D =
|
|
10
|
+
'M6.5,0 C6.77614237,-5.07265313e-17 7,0.223857625 7,0.5 L7,1 L9.5,1 C10.3284271,1 11,1.67157288 11,2.5 L11,17.5 C11,18.3284271 10.3284271,19 9.5,19 L1.5,19 C0.671572875,19 0,18.3284271 0,17.5 L0,2.5 C0,1.67157288 0.671572875,1 1.5,1 L4,1 L4,0.5 C4,0.223857625 4.22385763,5.07265313e-17 4.5,0 L6.5,0 Z M9.5,2 L1.5,2 C1.22385763,2 1,2.22385763 1,2.5 L1,17.5 C1,17.7761424 1.22385763,18 1.5,18 L9.5,18 C9.77614237,18 10,17.7761424 10,17.5 L10,2.5 C10,2.2385763 9.77614237,2 9.5,2 Z';
|
|
11
|
+
|
|
12
|
+
// "粗壮"闪电图标
|
|
13
|
+
const LIGHTNING_D = 'M6,5 L3.5,10 L5,10 L5,14 L7.5,9 L6,9 L6,5 Z';
|
|
14
|
+
|
|
15
|
+
// 定义组件的Props类型
|
|
16
|
+
interface BatteryProps {
|
|
17
|
+
size?: number;
|
|
18
|
+
batteryColor?: ColorPropType;
|
|
19
|
+
value?: number;
|
|
20
|
+
highColor?: ColorPropType;
|
|
21
|
+
middleColor?: ColorPropType;
|
|
22
|
+
lowColor?: ColorPropType;
|
|
23
|
+
onCalcColor?: (top: number, high: string, middle: string, low: string) => string;
|
|
24
|
+
charging?: boolean;
|
|
25
|
+
chargingColor?: ColorPropType;
|
|
26
|
+
style?: StyleProp<ViewStyle>;
|
|
27
|
+
batteryRotation?: number; // *** 新增 prop,用于控制电池旋转角度 ***
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
const Battery: React.FC<BatteryProps> = ({
|
|
31
|
+
size = cx(10),
|
|
32
|
+
batteryColor = 'rgba(0,0,0,.5)',
|
|
33
|
+
value = 80,
|
|
34
|
+
highColor = '#70CF98',
|
|
35
|
+
middleColor = '#F5A623',
|
|
36
|
+
lowColor = '#FF4444',
|
|
37
|
+
onCalcColor,
|
|
38
|
+
charging = false,
|
|
39
|
+
chargingColor = '#3AC400',
|
|
40
|
+
style,
|
|
41
|
+
batteryRotation = 0, // 默认为0,不旋转
|
|
42
|
+
}) => {
|
|
43
|
+
|
|
44
|
+
const top = useMemo(() => {
|
|
45
|
+
const boundedValue = Math.max(0, Math.min(100, value));
|
|
46
|
+
return 17 - (14 * boundedValue) / 100;
|
|
47
|
+
}, [value]);
|
|
48
|
+
|
|
49
|
+
const insideColor = useMemo(() => {
|
|
50
|
+
if (typeof onCalcColor === 'function') {
|
|
51
|
+
const customColor = onCalcColor(top, highColor, middleColor, lowColor);
|
|
52
|
+
if (customColor) return customColor;
|
|
53
|
+
}
|
|
54
|
+
if (value >= 50) return highColor;
|
|
55
|
+
if (value >= 20) return middleColor;
|
|
56
|
+
return lowColor;
|
|
57
|
+
}, [value, top, highColor, middleColor, lowColor, onCalcColor]);
|
|
58
|
+
|
|
59
|
+
const batteryLevelPoints = `2 ${top} 9 ${top} 9 17 2 17`;
|
|
60
|
+
|
|
61
|
+
const svgWidth = 1.1 * size;
|
|
62
|
+
const svgHeight = 1.9 * size;
|
|
63
|
+
|
|
64
|
+
return (
|
|
65
|
+
// 1. 将旋转应用到根View上
|
|
66
|
+
<View style={[{ transform: [{ rotate: `${batteryRotation}deg` }] }, style]}>
|
|
67
|
+
<Svg width={svgWidth} height={svgHeight} viewBox="0 0 11 19">
|
|
68
|
+
<Path d={WRAP_BATTERY_D} fill={batteryColor} />
|
|
69
|
+
<Polygon points={batteryLevelPoints} fill={insideColor as string} />
|
|
70
|
+
{charging && (
|
|
71
|
+
<Path
|
|
72
|
+
d={LIGHTNING_D}
|
|
73
|
+
fill={chargingColor as string}
|
|
74
|
+
stroke="white"
|
|
75
|
+
strokeWidth={0.2}
|
|
76
|
+
strokeLinejoin="round"
|
|
77
|
+
// 2. 对闪电图标进行“反向旋转”
|
|
78
|
+
rotation={-batteryRotation}
|
|
79
|
+
// 3. 指定旋转中心为SVG画布的中心
|
|
80
|
+
origin="5.5, 9.5"
|
|
81
|
+
/>
|
|
82
|
+
)}
|
|
83
|
+
</Svg>
|
|
84
|
+
</View>
|
|
85
|
+
);
|
|
86
|
+
};
|
|
87
|
+
|
|
88
|
+
export default Battery;
|
|
@@ -1,23 +1,25 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
1
|
+
import React, { useCallback, useMemo } from 'react'
|
|
2
|
+
import { StyleSheet, Text } from 'react-native'
|
|
3
|
+
import { Utils } from 'tuya-panel-kit'
|
|
4
|
+
import ThemeType from '../config/themeType'
|
|
5
5
|
import I18n from '../i18n'
|
|
6
|
+
import Battery from './Battery'
|
|
7
|
+
import Card from './Card'
|
|
6
8
|
import Spacer from './Spacer'
|
|
7
|
-
import ThemeType from '../config/themeType'
|
|
8
9
|
|
|
9
10
|
const cx = Utils.RatioUtils.convertX
|
|
10
|
-
const {withTheme} = Utils.ThemeUtils
|
|
11
|
+
const { withTheme } = Utils.ThemeUtils
|
|
11
12
|
type BatteryProps = {
|
|
12
13
|
value: number
|
|
13
14
|
lowValue?: number
|
|
14
15
|
middleValue?: number
|
|
15
16
|
highValue?: number
|
|
17
|
+
charging?: boolean
|
|
16
18
|
theme?: ThemeType
|
|
17
19
|
}
|
|
18
20
|
|
|
19
21
|
const BatteryPercentageView = (props: BatteryProps) => {
|
|
20
|
-
const {value, middleValue = 10, highValue = 90} = props
|
|
22
|
+
const { value, middleValue = 10, highValue = 90 } = props
|
|
21
23
|
const calcColor = (_: any, normalColor: string, lowColor: string, emptyColor: string) => {
|
|
22
24
|
if (value >= highValue) {
|
|
23
25
|
return normalColor
|
|
@@ -28,50 +30,53 @@ const BatteryPercentageView = (props: BatteryProps) => {
|
|
|
28
30
|
}
|
|
29
31
|
}
|
|
30
32
|
|
|
31
|
-
const
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
33
|
+
const getStyles = useCallback(() => {
|
|
34
|
+
return StyleSheet.create({
|
|
35
|
+
container: {
|
|
36
|
+
flexDirection: 'row',
|
|
37
|
+
alignItems: 'center',
|
|
38
|
+
},
|
|
39
|
+
title: {
|
|
40
|
+
marginStart: cx(16),
|
|
41
|
+
marginVertical: cx(18),
|
|
42
|
+
color: props.theme?.global.fontColor,
|
|
43
|
+
fontSize: cx(16),
|
|
44
|
+
fontWeight: 'bold',
|
|
45
|
+
},
|
|
46
|
+
content: {
|
|
47
|
+
marginEnd: cx(16),
|
|
48
|
+
width: cx(60),
|
|
49
|
+
color: props.theme?.global.fontColor,
|
|
50
|
+
textAlign: 'right',
|
|
51
|
+
fontSize: cx(14),
|
|
52
|
+
},
|
|
53
|
+
low: {
|
|
54
|
+
color: props.theme?.global.error
|
|
55
|
+
}
|
|
56
|
+
})
|
|
57
|
+
}, [props.theme])
|
|
58
|
+
|
|
59
|
+
const styles = getStyles()
|
|
55
60
|
|
|
56
61
|
return (
|
|
57
62
|
<Card
|
|
58
63
|
style={{ marginHorizontal: cx(24) }}
|
|
59
|
-
containerStyle={
|
|
64
|
+
containerStyle={styles.container}
|
|
60
65
|
>
|
|
61
66
|
<Text
|
|
62
67
|
style={styles.title}>
|
|
63
68
|
{I18n.getLang('motion_detector_battery__state4')}
|
|
64
69
|
</Text>
|
|
65
|
-
<Spacer height={0} style={{ flex: 1 }}
|
|
66
|
-
<
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
70
|
+
<Spacer height={0} style={{ flex: 1 }}/>
|
|
71
|
+
<Battery
|
|
72
|
+
value={props.value}
|
|
73
|
+
onCalcColor={calcColor}
|
|
74
|
+
charging={props.charging}
|
|
75
|
+
size={cx(30)}
|
|
76
|
+
batteryColor={props.theme?.global.secondFontColor}
|
|
77
|
+
middleColor="#999999"
|
|
78
|
+
batteryRotation={90}
|
|
79
|
+
/>
|
|
75
80
|
<Text style={[styles.content, value <= middleValue ? styles.low : null]}>{value}%</Text>
|
|
76
81
|
</Card>
|
|
77
82
|
)
|
|
@@ -69,7 +69,7 @@ const styles = StyleSheet.create({
|
|
|
69
69
|
marginVertical: cx(18),
|
|
70
70
|
color: '#000',
|
|
71
71
|
fontSize: cx(16),
|
|
72
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
72
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
73
73
|
},
|
|
74
74
|
|
|
75
75
|
batteryRotate: {
|
|
@@ -82,6 +82,6 @@ const styles = StyleSheet.create({
|
|
|
82
82
|
marginEnd: cx(16),
|
|
83
83
|
color: '#000',
|
|
84
84
|
fontSize: cx(14),
|
|
85
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
85
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
86
86
|
},
|
|
87
87
|
});
|
package/src/components/Cell.tsx
CHANGED
|
@@ -111,7 +111,7 @@ const CellContentBase = (props: CellContentProps) => {
|
|
|
111
111
|
{
|
|
112
112
|
fontSize: cx(14),
|
|
113
113
|
color: props.theme?.global.secondFontColor,
|
|
114
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
114
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
115
115
|
},
|
|
116
116
|
props.titleStyle,
|
|
117
117
|
]}>{props.title}</Text>
|
|
@@ -123,7 +123,7 @@ const CellContentBase = (props: CellContentProps) => {
|
|
|
123
123
|
{
|
|
124
124
|
fontSize: cx(14),
|
|
125
125
|
color: props.theme?.global.secondFontColor,
|
|
126
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
126
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
127
127
|
},
|
|
128
128
|
props.valueStyle,
|
|
129
129
|
]}>{props.value}</Text>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {View} from 'react-native'
|
|
2
2
|
import React, {useCallback} from 'react'
|
|
3
3
|
import LdvColorSlider from './ldvColorSlider'
|
|
4
|
-
import {hex2Hsv, hsv2Hex} from '
|
|
4
|
+
import {hex2Hsv, hsv2Hex} from '@utils'
|
|
5
5
|
import LdvPresetView from './ldvPresetView'
|
|
6
6
|
import LdvSaturation from './ldvSaturation'
|
|
7
7
|
import LdvColorBrightness from './ldvColorBrightness'
|
|
@@ -9,12 +9,11 @@ import I18n from '../i18n/index'
|
|
|
9
9
|
import RectColorAndBrightPicker from './rect-color-and-bright-picker'
|
|
10
10
|
import {Utils} from "tuya-panel-kit";
|
|
11
11
|
import {useReactive, useUpdateEffect} from "ahooks";
|
|
12
|
-
import {useNewPalette} from "../models/modules/NativePropsSlice";
|
|
12
|
+
import {useNewPalette, useIsPad} from "../models/modules/NativePropsSlice";
|
|
13
13
|
|
|
14
|
-
const cx = Utils.RatioUtils
|
|
14
|
+
const {convertX: cx, width: screenWidth} = Utils.RatioUtils
|
|
15
15
|
const scaleUp = (value) => value * 10
|
|
16
16
|
const scaleDown = (value) => Math.round(value / 10)
|
|
17
|
-
const width = Utils.RatioUtils.width - cx(80)
|
|
18
17
|
|
|
19
18
|
export interface ColorAdjustViewProps {
|
|
20
19
|
h: number
|
|
@@ -30,6 +29,8 @@ export interface ColorAdjustViewProps {
|
|
|
30
29
|
|
|
31
30
|
const NewColorPicker = React.memo((props: ColorAdjustViewProps) => {
|
|
32
31
|
const { h = 0, s = 100, v = 100, minBrightness, onHSVChange, onHSVChangeComplete } = props
|
|
32
|
+
const isPad = useIsPad()
|
|
33
|
+
const width = isPad ? cx(screenWidth - 10) : (screenWidth - 80)
|
|
33
34
|
const state = useReactive({
|
|
34
35
|
hue: h,
|
|
35
36
|
saturation: scaleUp(s),
|
|
@@ -9,13 +9,12 @@ import I18n from '../i18n/index'
|
|
|
9
9
|
import {cctToColor} from '../utils/cctUtils'
|
|
10
10
|
import RectColorAndBrightPicker from "./rect-color-and-bright-picker";
|
|
11
11
|
import {useReactive, useUpdateEffect} from 'ahooks'
|
|
12
|
-
import { useNewPalette } from 'models/modules/NativePropsSlice'
|
|
12
|
+
import { useNewPalette, useIsPad } from 'models/modules/NativePropsSlice'
|
|
13
13
|
|
|
14
|
-
const {convertX: cx} = Utils.RatioUtils
|
|
14
|
+
const {convertX: cx, width: screenWidth} = Utils.RatioUtils
|
|
15
15
|
|
|
16
16
|
const scaleUp = (value: number) => value * 10;
|
|
17
17
|
const scaleDown = (value: number) => Math.round(value / 10);
|
|
18
|
-
const width = Utils.RatioUtils.width - cx(80);
|
|
19
18
|
|
|
20
19
|
export interface ColorTempAdjustViewProps {
|
|
21
20
|
colorTemp: number
|
|
@@ -41,6 +40,8 @@ const NewColorTempPicker = React.memo((props: ColorTempAdjustViewProps) => {
|
|
|
41
40
|
onBrightnessChange,
|
|
42
41
|
onBrightnessChangeComplete,
|
|
43
42
|
} = props
|
|
43
|
+
const isPad = useIsPad()
|
|
44
|
+
const width = isPad ? cx(screenWidth - 10) : (screenWidth - 80)
|
|
44
45
|
const state = useReactive({
|
|
45
46
|
temperature: scaleUp(colorTemp),
|
|
46
47
|
brightness: scaleUp(brightness),
|
|
@@ -35,7 +35,7 @@ const DeleteButton = (props: DeleteButtonProps) => {
|
|
|
35
35
|
<Text style={[{
|
|
36
36
|
color: props.theme?.button.fontColor,
|
|
37
37
|
fontSize: cx(16),
|
|
38
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
38
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
39
39
|
}, textStyle]}>{text}</Text>
|
|
40
40
|
</TouchableOpacity>
|
|
41
41
|
)
|
|
@@ -44,7 +44,7 @@ const DiySceneItem = (props: DiySceneItemProps) => {
|
|
|
44
44
|
flex: 1,
|
|
45
45
|
color: props.theme?.global.fontColor,
|
|
46
46
|
fontSize: cx(16),
|
|
47
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
47
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
48
48
|
lineHeight: cx(20),
|
|
49
49
|
},
|
|
50
50
|
checkbox: {
|
|
@@ -52,7 +52,6 @@ const DiySceneItem = (props: DiySceneItemProps) => {
|
|
|
52
52
|
height: cx(45),
|
|
53
53
|
marginTop: cx(-5),
|
|
54
54
|
marginBottom: cx(-10),
|
|
55
|
-
fontWeight: 'bold',
|
|
56
55
|
},
|
|
57
56
|
moodTypeItem: {
|
|
58
57
|
flexDirection: 'row',
|
|
@@ -68,7 +67,7 @@ const DiySceneItem = (props: DiySceneItemProps) => {
|
|
|
68
67
|
color: props.theme?.tag.fontColor,
|
|
69
68
|
fontSize: cx(10),
|
|
70
69
|
textAlignVertical: 'center',
|
|
71
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
70
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
72
71
|
lineHeight: cx(16),
|
|
73
72
|
},
|
|
74
73
|
})
|
|
@@ -14,6 +14,7 @@ import Stepper from './Stepper'
|
|
|
14
14
|
import StripLightView from './StripLightView'
|
|
15
15
|
import { nativeEventEmitter } from '../api/nativeEventEmitter'
|
|
16
16
|
import ThemeType from '../config/themeType'
|
|
17
|
+
import { useIsPad } from '../models/modules/NativePropsSlice'
|
|
17
18
|
|
|
18
19
|
const { convertX: cx } = Utils.RatioUtils
|
|
19
20
|
const { withTheme } = Utils.ThemeUtils
|
|
@@ -66,6 +67,7 @@ interface DrawToolViewProps extends PropsWithChildren<ViewProps> {
|
|
|
66
67
|
}
|
|
67
68
|
|
|
68
69
|
const DrawToolView = (props: DrawToolViewProps) => {
|
|
70
|
+
const isPad = useIsPad()
|
|
69
71
|
const state = useReactive({
|
|
70
72
|
visible: props.ledNumModalVisible || false,
|
|
71
73
|
ledNum: props.ledNum || 5,
|
|
@@ -98,8 +100,9 @@ const DrawToolView = (props: DrawToolViewProps) => {
|
|
|
98
100
|
}
|
|
99
101
|
|
|
100
102
|
const height = useMemo(() => {
|
|
101
|
-
|
|
102
|
-
|
|
103
|
+
const base = isPad ? 100 : 52
|
|
104
|
+
return cx(base * Math.ceil((props.nodes.length / (props.fixCount || 5))))
|
|
105
|
+
}, [props.nodes, isPad])
|
|
103
106
|
|
|
104
107
|
const getBlockColor = useCallback(() => {
|
|
105
108
|
if (props.isColorMode) {
|
|
@@ -124,7 +127,7 @@ const DrawToolView = (props: DrawToolViewProps) => {
|
|
|
124
127
|
color: props.theme?.global.fontColor,
|
|
125
128
|
fontSize: cx(16),
|
|
126
129
|
marginLeft: cx(10),
|
|
127
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
130
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
128
131
|
fontWeight: 'bold',
|
|
129
132
|
},
|
|
130
133
|
adjustButtons: {
|
|
@@ -161,8 +164,8 @@ const DrawToolView = (props: DrawToolViewProps) => {
|
|
|
161
164
|
</TouchableOpacity>
|
|
162
165
|
{!props.hideDisableLight && <TouchableOpacity
|
|
163
166
|
accessibilityLabel='AdjustButton'
|
|
164
|
-
|
|
165
|
-
|
|
167
|
+
accessibilityHint='3'
|
|
168
|
+
accessibilityState={{ checked: props.adjustType === 3 }}
|
|
166
169
|
onPress={() => {
|
|
167
170
|
props.setAdjustType(3)
|
|
168
171
|
}}>
|
|
@@ -31,7 +31,7 @@ const HybridSwitchView = (props: HybridSwitchViewProps) => {
|
|
|
31
31
|
color: props.theme?.global.fontColor,
|
|
32
32
|
fontSize: cx(16),
|
|
33
33
|
fontWeight: 'bold',
|
|
34
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
34
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
35
35
|
},
|
|
36
36
|
switchPanel: {
|
|
37
37
|
width: cx(120),
|
|
@@ -3,8 +3,9 @@ import React from 'react'
|
|
|
3
3
|
import {Utils} from 'tuya-panel-kit'
|
|
4
4
|
import {StyleProp, StyleSheet, ViewStyle} from 'react-native'
|
|
5
5
|
import ColorsLine from './ColorsLine'
|
|
6
|
+
import {useIsPad} from '../models/modules/NativePropsSlice'
|
|
6
7
|
|
|
7
|
-
const cx = Utils.RatioUtils
|
|
8
|
+
const { convertX: cx, width: screenWidth } = Utils.RatioUtils
|
|
8
9
|
|
|
9
10
|
export type MoodColorsLineType = 'gradient' | 'separate'
|
|
10
11
|
|
|
@@ -17,7 +18,8 @@ interface MoodColorsLineProps {
|
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
export default function MoodColorsLine(props: MoodColorsLineProps) {
|
|
20
|
-
const
|
|
21
|
+
const isPad = useIsPad()
|
|
22
|
+
const width = props.width || (isPad ? cx(screenWidth - 10) : (screenWidth - 80))
|
|
21
23
|
const height = props.height || cx(24)
|
|
22
24
|
if (props.type === 'separate' || props.colors.length < 2) {
|
|
23
25
|
return (<ColorsLine colors={props.colors} style={{width, height}} nodeStyle={props.nodeStyle}/>)
|
|
@@ -36,7 +36,7 @@ const OptionGroup = (props: OptionGroupProps) => {
|
|
|
36
36
|
color: props.theme?.global.fontColor,
|
|
37
37
|
fontSize: cx(14),
|
|
38
38
|
fontWeight: 'bold',
|
|
39
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
39
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
40
40
|
},
|
|
41
41
|
modeSelectCard: {
|
|
42
42
|
marginHorizontal: cx(8),
|
|
@@ -60,12 +60,12 @@ const OptionGroup = (props: OptionGroupProps) => {
|
|
|
60
60
|
itemTitle: {
|
|
61
61
|
color: props.theme?.global.fontColor,
|
|
62
62
|
fontSize: cx(14),
|
|
63
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
63
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
64
64
|
},
|
|
65
65
|
itemContent: {
|
|
66
66
|
color: props.theme?.global.secondFontColor,
|
|
67
67
|
fontSize: cx(14),
|
|
68
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
68
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
69
69
|
},
|
|
70
70
|
})
|
|
71
71
|
|
package/src/components/Page.tsx
CHANGED
|
@@ -30,6 +30,7 @@ interface PageProps extends PropsWithChildren<ViewProps> {
|
|
|
30
30
|
greeneryIcon?: string | undefined | number
|
|
31
31
|
loading?: boolean
|
|
32
32
|
info?: React.ReactNode
|
|
33
|
+
accessibilityHint?: string
|
|
33
34
|
}
|
|
34
35
|
|
|
35
36
|
const Page = (props: PageProps) => {
|
|
@@ -73,7 +74,7 @@ const Page = (props: PageProps) => {
|
|
|
73
74
|
<>
|
|
74
75
|
<View
|
|
75
76
|
accessibilityLabel='Page'
|
|
76
|
-
accessibilityHint={props.headlineText}
|
|
77
|
+
accessibilityHint={props.accessibilityHint || props.headlineText}
|
|
77
78
|
style={[{ flex: 1, position: 'relative', backgroundColor: props.theme?.global.background }, props.style]}
|
|
78
79
|
>
|
|
79
80
|
<LDVTopBar
|
|
@@ -89,25 +90,25 @@ const Page = (props: PageProps) => {
|
|
|
89
90
|
onRightButtonPress={props.rightButtonIconClick}
|
|
90
91
|
rightButtonDisabled={disabled}/>
|
|
91
92
|
{(!!props.headlineText || !!props.headlineContent) &&
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
93
|
+
<LdvTopName
|
|
94
|
+
title={props.headlineText}
|
|
95
|
+
rightIcon={props.headlineIcon}
|
|
96
|
+
rightIconClick={props.onHeadlineIconClick}
|
|
97
|
+
showGreenery={props.showGreenery}
|
|
98
|
+
greeneryIcon={props.greeneryIcon}
|
|
99
|
+
headlineIconContent={props.headlineIconContent}
|
|
100
|
+
headlineTopContent={props.headlineTopContent}
|
|
101
|
+
headlineContent={props.headlineContent}
|
|
102
|
+
info={props.info}
|
|
102
103
|
/>}
|
|
103
104
|
{props.children}
|
|
104
105
|
</View>
|
|
105
106
|
{!!props.loading && <Toast.Loading
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
107
|
+
style={{ zIndex: 999, elevation: 10 }}
|
|
108
|
+
show={props.loading}
|
|
109
|
+
onFinish={() => {
|
|
109
110
|
|
|
110
|
-
|
|
111
|
+
}}/>}
|
|
111
112
|
</>
|
|
112
113
|
)
|
|
113
114
|
}
|
|
@@ -32,7 +32,7 @@ function SocketItem(props: SocketItemProps) {
|
|
|
32
32
|
title: {
|
|
33
33
|
fontSize: cx(16),
|
|
34
34
|
color: props.theme?.global.fontColor,
|
|
35
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
35
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
36
36
|
fontWeight: 'bold',
|
|
37
37
|
},
|
|
38
38
|
icon: {
|
|
@@ -46,7 +46,7 @@ function SocketItem(props: SocketItemProps) {
|
|
|
46
46
|
name: {
|
|
47
47
|
fontSize: cx(14),
|
|
48
48
|
color: props.theme?.global.fontColor,
|
|
49
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
49
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
50
50
|
},
|
|
51
51
|
})
|
|
52
52
|
|
package/src/components/Tag.tsx
CHANGED
|
@@ -27,7 +27,7 @@ export default function TextButton(props: TextButtonProps) {
|
|
|
27
27
|
<Text style={[{
|
|
28
28
|
color: '#f60',
|
|
29
29
|
fontSize: cx(14),
|
|
30
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
30
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
31
31
|
}, props.textStyle]}>{props.text}</Text>
|
|
32
32
|
</TouchableOpacity>
|
|
33
33
|
)
|
|
@@ -27,7 +27,7 @@ const TextField = (props: TextFieldProps) => {
|
|
|
27
27
|
fontSize: cx(12),
|
|
28
28
|
marginStart: cx(13),
|
|
29
29
|
color: props.theme?.global.secondFontColor,
|
|
30
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
30
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
31
31
|
},
|
|
32
32
|
textInputGroup: {
|
|
33
33
|
flexDirection: 'row',
|
|
@@ -42,7 +42,7 @@ const TextField = (props: TextFieldProps) => {
|
|
|
42
42
|
marginEnd: cx(6),
|
|
43
43
|
fontSize: cx(16),
|
|
44
44
|
color: props.theme?.textInput.fontColor,
|
|
45
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
45
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
46
46
|
},
|
|
47
47
|
iconTouchable: {
|
|
48
48
|
marginEnd: cx(18),
|
|
@@ -23,7 +23,7 @@ const TextFieldStyleButton = (props: TextFieldStyleButtonProps) => {
|
|
|
23
23
|
fontSize: cx(12),
|
|
24
24
|
marginStart: cx(13),
|
|
25
25
|
color: props.theme?.global.secondFontColor,
|
|
26
|
-
fontFamily: 'helvetica_neue_lt_std_bd',
|
|
26
|
+
// fontFamily: 'helvetica_neue_lt_std_bd',
|
|
27
27
|
},
|
|
28
28
|
textGroup: {
|
|
29
29
|
flexDirection: 'row',
|
|
@@ -41,7 +41,7 @@ const TextFieldStyleButton = (props: TextFieldStyleButtonProps) => {
|
|
|
41
41
|
marginEnd: cx(6),
|
|
42
42
|
fontSize: cx(16),
|
|
43
43
|
color: props.theme?.textInput.fontColor,
|
|
44
|
-
fontFamily: 'helvetica_neue_lt_std_roman',
|
|
44
|
+
// fontFamily: 'helvetica_neue_lt_std_roman',
|
|
45
45
|
},
|
|
46
46
|
line: {
|
|
47
47
|
height: 1,
|