@ledvance/base 1.3.104 → 1.3.106

package/src/components/UATabTitle.tsx

@@ -19,7 +19,7 @@ const UATabTitle = (props: UATabTitleProps) => {
     tabsTitle: {
       color: props.theme?.global.fontColor,
       fontSize: cx(14),
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
   })
 

package/src/components/UATabs.tsx

@@ -42,7 +42,7 @@ const UATabs = (props: UATabsProps) => {
     },
     tabText: {
       fontSize: cx(14),
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
   })
 

package/src/components/ldvColorSlider.tsx

@@ -1,10 +1,11 @@
-import React from 'react'
+import React, { useMemo } from 'react'
 import {StyleProp, StyleSheet, Text, View, ViewStyle} from 'react-native'
 import {LinearGradient, Slider, Utils} from 'tuya-panel-kit'
 import {Rect} from 'react-native-svg'
 import ThemeType from '../config/themeType'
+import { useIsPad } from '../models/modules/NativePropsSlice'
 
-const cx = Utils.RatioUtils.convertX
+const { convertX: cx, width: screenWidth } = Utils.RatioUtils
 const { withTheme } = Utils.ThemeUtils
 
 const temperatures = {
@@ -42,12 +43,56 @@ interface LdvColorSliderProps {
 
 const LdvColorSlider = (props: LdvColorSliderProps) => {
   const {title, type, onSlidingComplete, thumbColor, value} = props
+  const isPad = useIsPad()
   let dataSource = type === TEMP_KEY ? temperatures : colors
   let max = type === TEMP_KEY ? 100 : 359
   let min = type === TEMP_KEY ? 0 : 0
-  const width = props.width || (Utils.RatioUtils.width - cx(80))
+  const width = props.width || (isPad ? cx(screenWidth - 10) : (screenWidth - 80))
 
-  const styles = StyleSheet.create({
+  const styles = useMemo(() => getStyles(props.theme), [props.theme])
+
+  return (
+    <View style={[styles.container, props.style]}>
+      <Text accessibilityLabel={"Color"} accessibilityHint={`${value}`} style={styles.title}>
+        {title}
+      </Text>
+      <Slider.Horizontal
+        accessibilityLabel={"ColorSliderHorizontal"}
+        style={{...styles.shadeSlider, width}}
+        styles={{track: styles.sliderTrack, thumb: {...styles.shadeThumb, backgroundColor: thumbColor}}}
+        maximumValue={max}
+        minimumValue={min}
+        value={value}
+        stepValue={1}
+        canTouchTrack={true}
+        theme={{
+          trackRadius: cx(15),
+        }}
+        onlyMaximumTrack={true}
+        renderMaximumTrack={() => {
+          return (
+            <View style={{flex: 1, borderRadius: cx(15)}}>
+              <LinearGradient
+                style={{...styles.sliderLinearGradient, width}}
+                x1="0%"
+                y1="0%"
+                x2="100%"
+                y2="0%"
+                stops={dataSource}>
+                <Rect {...styles.sliderLinearGradient} width={width}/>
+              </LinearGradient>
+            </View>
+          )
+        }}
+        onValueChange={props.onValueChange}
+        onSlidingComplete={onSlidingComplete}
+      />
+    </View>
+  )
+}
+
+const getStyles = (theme?: ThemeType) =>
+  StyleSheet.create({
     container: {
       height: cx(57),
       flexDirection: 'column',
@@ -56,8 +101,7 @@ const LdvColorSlider = (props: LdvColorSliderProps) => {
     title: {
       marginTop: cx(4),
       fontSize: cx(14),
-      color: props.theme?.global.fontColor,
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      color: theme?.global.fontColor,
     },
     shadeSlider: {
       marginTop: cx(8),
@@ -94,44 +138,4 @@ const LdvColorSlider = (props: LdvColorSliderProps) => {
     },
   })
 
-  return (
-    <View style={[styles.container, props.style]}>
-      <Text accessibilityLabel={"Color"} accessibilityHint={`${value}`} style={styles.title}>
-        {title}
-      </Text>
-      <Slider.Horizontal
-        accessibilityLabel={"ColorSliderHorizontal"}
-        style={{...styles.shadeSlider, width}}
-        styles={{track: styles.sliderTrack, thumb: {...styles.shadeThumb, backgroundColor: thumbColor}}}
-        maximumValue={max}
-        minimumValue={min}
-        value={value}
-        stepValue={1}
-        canTouchTrack={true}
-        theme={{
-          trackRadius: cx(15),
-        }}
-        onlyMaximumTrack={true}
-        renderMaximumTrack={() => {
-          return (
-            <View style={{flex: 1, borderRadius: cx(15)}}>
-              <LinearGradient
-                style={{...styles.sliderLinearGradient, width}}
-                x1="0%"
-                y1="0%"
-                x2="100%"
-                y2="0%"
-                stops={dataSource}>
-                <Rect {...styles.sliderLinearGradient} width={width}/>
-              </LinearGradient>
-            </View>
-          )
-        }}
-        onValueChange={props.onValueChange}
-        onSlidingComplete={onSlidingComplete}
-      />
-    </View>
-  )
-}
-
 export default withTheme(LdvColorSlider)

package/src/components/ldvSlider.tsx

@@ -46,13 +46,13 @@ const LdvSlider = (props: LdvSliderProps) => {
       marginTop: cx(10),
       fontSize: cx(14),
       color: props.theme?.global.fontColor,
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
     title: {
       marginTop: cx(10),
       fontSize: cx(14),
       color: props.theme?.global.fontColor,
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
     slider: {
       marginTop: cx(8),

package/src/components/ldvTemperatureSlider.tsx

@@ -99,13 +99,13 @@ const styles = StyleSheet.create({
     marginTop: cx(10),
     fontSize: cx(14),
     color: '#000',
-    fontFamily: 'helvetica_neue_lt_std_roman',
+    // fontFamily: 'helvetica_neue_lt_std_roman',
   },
   title: {
     marginTop: cx(4),
     fontSize: cx(14),
     color: '#000',
-    fontFamily: 'helvetica_neue_lt_std_roman',
+    // fontFamily: 'helvetica_neue_lt_std_roman',
   },
   shadeSlider: {
     marginTop: cx(8),

package/src/components/ldvTopBar.tsx

@@ -46,7 +46,7 @@ const LDVTopBar = (props: TopBarProps) => {
               maxWidth: cx(290),
               color: props.theme?.global.brand,
               fontSize: cx(16),
-              fontFamily: 'helvetica_neue_lt_std_roman',
+              // fontFamily: 'helvetica_neue_lt_std_roman',
             }}>{props.title}</Text>
         </View>
       </TouchableOpacity>

package/src/components/segmentControl.tsx

@@ -36,7 +36,7 @@ const SegmentControl = (props) => {
           style={{
             color: props.theme?.segment.fontColor,
             fontSize: convertX(12),
-            fontFamily: isFirst ? 'helvetica_neue_lt_std_bd' : 'helvetica_neue_lt_std_roman',
+            // fontFamily: isFirst ? 'helvetica_neue_lt_std_bd' : 'helvetica_neue_lt_std_roman',
             marginVertical: convertX(10),
           }}>
           {title1}
@@ -63,7 +63,7 @@ const SegmentControl = (props) => {
           style={{
             color: props.theme?.segment.fontColor,
             fontSize: convertX(12),
-            fontFamily: isFirst ? 'helvetica_neue_lt_std_roman' : 'helvetica_neue_lt_std_bd',
+            // fontFamily: isFirst ? 'helvetica_neue_lt_std_roman' : 'helvetica_neue_lt_std_bd',
             marginVertical: convertX(10),
           }}>
           {title2}