@ledvance/ui-biz-bundle 1.1.59 → 1.1.61

package/src/newModules/biorhythm/circular/Progress.tsx

@@ -0,0 +1,372 @@
+import React, { Component } from 'react'
+import { StyleSheet, View } from 'react-native'
+
+import ItemIcon from './ItemIcon'
+import Svg, { Circle } from 'react-native-svg'
+import iconList from '../iconListData'
+import { cctToColor } from '@ledvance/base/src/utils/cctUtils'
+
+export default class Progress extends Component<any> {
+  timeIconList: any[]
+  timer: any
+  state: any
+
+  constructor(props) {
+    super(props)
+    const { timeIconList } = this.props
+
+    this.timeIconList = timeIconList.map(item => ({ ...item }))
+    this.state = {
+      iconDataList: this.timeIconList,
+    }
+  }
+
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (nextProps) {
+      const { timeIconList, planEdit } = nextProps
+      if (timeIconList.length !== this.state.iconDataList.length || planEdit) {
+        this.timeIconList = timeIconList.map(item => ({ ...item }))
+        this.setState({ iconDataList: this.timeIconList })
+      }
+    }
+  }
+
+  componentWillUnmount() {
+    if (this.timer) {
+      clearTimeout(this.timer)
+      this.timer = null
+    }
+  }
+
+  render() {
+    //radius 大圆半径,annularHeight 环宽
+    const { radius, annularHeight } = this.props
+    const { iconDataList } = this.state
+    //换算颜色
+    if (iconDataList && iconDataList.length > 0) {
+      //排序从小到大
+      let min
+      for (let i = 0; i < iconDataList.length; i++) {
+        for (let j = i; j < iconDataList.length; j++) {
+          const iData = iconDataList[i].newStartTime ? iconDataList[i].newStartTime : iconDataList[i].time
+          const jData = iconDataList[j].newStartTime ? iconDataList[j].newStartTime : iconDataList[j].time
+          if (iData > jData) {
+            min = iconDataList[j]
+            iconDataList[j] = iconDataList[i]
+            iconDataList[i] = min
+          }
+        }
+      }
+
+      //取出色温、亮度
+      for (const elem of iconDataList) {
+        const { action } = elem
+
+        if (elem.light) {
+          continue
+        }
+
+        if (elem.colorTemp) {
+          continue
+        }
+
+        action.map((item) => {
+          const { uri, startValue } = item
+          if (uri.indexOf('Brightness') !== -1) {
+            elem.light = startValue
+          } else if (uri.indexOf('ColorTemperature') !== -1) {
+            let clrTemp = (startValue - 2700) / 38
+            let colorObj = this.getColorTempStringVale(clrTemp) //占比换算成色值
+            //console.log(' 色值数据 ----------> ',colorObj)
+
+            elem.colorTemp = colorObj.normalColor
+            elem.rgbColor = colorObj.rgbColor
+          }
+        })
+      }
+    }
+
+    //有多少个时间点就分为几段弧
+    let linearGradientList: any[] = []
+    for (let c = 0; c < iconDataList.length; c++) {
+      let tmpIndex = c + 1
+      if (tmpIndex > iconDataList.length - 1) {
+        tmpIndex = 0
+      }
+      let statRGBColer = iconDataList[c].rgbColor
+      let iconDataRgbClr = iconDataList[tmpIndex].rgbColor
+
+      let startTimes = iconDataList[c].time
+      let endTimes = iconDataList[tmpIndex].time
+
+      let totalMins = Math.abs(endTimes - startTimes)
+      if (tmpIndex === 0) {
+        totalMins = 1440 - startTimes + endTimes
+      }
+
+      let circleLength = (Math.PI * 2) / (24 * 60) * (totalMins)
+      let timeAngle = 360 / (24 * 60) * startTimes
+
+      // console.log('--- 开始时间 ---------->： ',iconDataList[c].startTime,'分钟数：',startTimes);
+      // console.log('--- 结束时间 ---------->： ',iconDataList[tmpIndex].startTime,'分钟数：',endTimes);
+      // console.log('--- 分段时长 ----------> ',totalMins);
+      // console.log('--- 弧长 ----------> ',circleLength);
+
+      linearGradientList.push({
+        startRbg: statRGBColer,
+        endRgb: this.props.gradient && statRGBColer || iconDataRgbClr,
+        circleLength: circleLength,
+        startAngle: timeAngle,
+        brightness: iconDataList[c].brightness
+      })
+    }
+
+    //console.log('--- 分段数据 ----------> ',linearGradientList)
+    let aCircleList: any[] = []
+    for (let l = 0; l < linearGradientList.length; l++) {
+      const elem = linearGradientList[l]
+      let startRGB = elem.startRbg
+      let endRGB = elem.endRgb
+      const brightness = elem.brightness || 0;
+      //兼容不支持色温的灯
+      if (!startRGB || !endRGB) {
+        startRGB = [122, 122, 122]
+        endRGB = [122, 122, 122]
+      }
+
+      //计算各时间段颜色变化值
+      const arcArr: () => any = () => {
+        let progressLength = (this.props.radius - 18) * elem.circleLength //每段的弧长
+        const step = 60 // 设置到100则已经比较难看出来颜色断层
+        const gradientColor = (startRGB, endRGB, step) => {
+          let startR = startRGB[0]
+          let startG = startRGB[1]
+          let startB = startRGB[2]
+          let endR = endRGB[0]
+          let endG = endRGB[1]
+          let endB = endRGB[2]
+          let sR = (endR - startR) / step // 总差值
+          let sG = (endG - startG) / step
+          let sB = (endB - startB) / step
+          let colorArr: any[] = []
+          for (let i = 0; i < step; i++) {
+            let color = Number(brightness) === 0 ? 'rgb(0, 0, 0)' : (this.props.isSupportTemperature && cctToColor(1)) || `rgb(${parseInt(sR * i + startR, 10)},
+                  ${parseInt(sG * i + startG, 10)},
+                  ${parseInt(sB * i + startB, 10)},
+                  ${Number(brightness) / 100}
+                  )`
+
+            colorArr.push(color)
+          }
+          return colorArr
+        }
+
+        let colorArr = gradientColor(startRGB, endRGB, step)
+        // 计算每个步进中的弧长
+        let arcLengthArr = colorArr.map((color, index) => ({
+          arcLength: [index * (progressLength / step), 10000000],
+          color: color,
+          arcAngle: elem.startAngle,
+        }))
+
+        //circleTotalLength = circleTotalLength + progressLength;
+        arcLengthArr.reverse() //数组倒序
+        return arcLengthArr
+      }
+
+      aCircleList = aCircleList.concat(arcArr())
+    }
+
+    let radiusValue = (this.props.radius).toString() //圆心坐标
+    let circleR = (this.props.radius - 22).toString() // 半径长度 （不包含宽度值）
+    const circleView = aCircleList.map((d, index) => {
+      return (
+        <Circle
+          key={`c${index}`}
+          cx={radiusValue}
+          cy={radiusValue}
+          r={circleR}
+          stroke={d.color}
+          strokeDasharray={d.arcLength}
+          strokeWidth="44"
+          rotation={-(90 - d.arcAngle)}
+          originX={radiusValue}
+          originY={radiusValue}
+          //strokeOpacity = {1.0}
+          strokeLinecap="butt"
+          fill="none"
+        />
+      )
+    })
+
+    const setImg = (id) => {
+      const imgIcon = iconList?.find(val => val?.id === id)?.icon
+      return imgIcon
+    }
+
+    return (
+      <View /*style = {{ backgroundColor: '#000000'}}*/>
+
+        <Svg width={this.props.radius * 2} height={this.props.radius * 2}>
+
+          {iconDataList.length > 0 ? circleView :
+            <Circle
+              cx={radiusValue}
+              cy={radiusValue}
+              r={circleR}
+              strokeWidth="44"
+              stroke={'#DEDEDE'}
+              fill={'none'} />}
+        </Svg>
+
+        {/*----- 环上图标 ------*/}
+        {this.timeIconList && this.timeIconList.map((item) => {
+
+          const { time } = item
+
+          //时间对应的弧度
+          let timeAngle = (Math.PI * 2) / (24 * 60) * time
+          let newRadius = radius - annularHeight + 22
+
+          //1.5 为解决将圆当作一个点处理代理的误差
+          let leftValeu = newRadius + (Math.sin(timeAngle) * newRadius) + 1.5
+          let topValue = newRadius - (Math.cos(timeAngle) * newRadius) + 1.5
+          const type = typeof item?.icon === 'string'
+
+          return (
+            <ItemIcon
+              key={item.index}
+              leftValeu={leftValeu}
+              topValue={topValue}
+              imageSource={setImg(item?.iconId) || type && { uri: item?.icon } || item?.icon}
+              circularRadius={newRadius}
+              onPanMoving={(_xValue, _yValue, angle) => {
+
+                if (this.timer) {
+                  clearTimeout(this.timer)
+                  this.timer = null
+                }
+
+                //角度转换为表盘时间
+                let angleValue = angle
+                let angleMins = 24 * 60 / 360//每度多少分钟
+                let totalMins = Math.abs(angleMins * angleValue)
+                item.time = totalMins
+
+                this.setState({ iconDataList: [].concat(iconDataList) })
+              }}
+
+              onPanMoveEnd={() => {
+                const { ret, failMinutes } = this.checkTimesFormat(item.time)
+                if (!ret) {
+                  let changeMinutes = (failMinutes || 0) + 60
+                  if (changeMinutes > 60 * 24) {
+                    changeMinutes = 30
+                  }
+                  item.time = changeMinutes
+                  this.setState({ iconDataList: [].concat(iconDataList) }, () => {
+                    this.playTimeChangeCallBack(item.index, Math.round(changeMinutes))
+                  })
+                } else {
+                  this.playTimeChangeCallBack(item.index, Math.round(item.time))
+                }
+              }}
+            />
+          )
+        })}
+
+        {/*----- 环内视图 ------*/}
+        <View
+          style={[
+            styles.contentView,
+            {
+              left: (this.props.annularHeight),
+              top: this.props.annularHeight,
+              width: (this.props.radius - this.props.annularHeight) * 2,
+              height: (this.props.radius - this.props.annularHeight) * 2,
+              borderRadius: this.props.radius,
+            },
+          ]}>
+          {this.props.children}
+        </View>
+      </View>
+    )
+  }
+
+  //时间调整回调业务层
+  playTimeChangeCallBack(id: number, time: number) {
+    const { onPanMoved } = this.props
+
+    if (this.timer) {
+      clearTimeout(this.timer)
+      this.timer = null
+    }
+
+    //延时0.5秒后更新计划
+    this.timer = setTimeout(() => {
+      onPanMoved && onPanMoved(id, time)
+    }, 500)
+  }
+
+  //判断时间是否合法
+  checkTimesFormat(newTimeMinutes) {
+    for (const elem of this.timeIconList) {
+      const { time } = elem
+      if (time === newTimeMinutes) {
+        continue
+      }
+      if (Math.abs(time - newTimeMinutes) < 15) {
+        return { ret: false, failMinutes: time }
+      }
+    }
+
+    return { ret: true }
+  }
+
+  getColorTempStringVale(colorTempInt) {
+    // 蓝色：80CBFF  黄色：FFCD66
+    let limitBottomColor = '#FFCD66'
+    let limitTopColor = '#80CBFF'
+
+    if (parseInt(colorTempInt) >= 100) {
+      return { rgbColor: [128, 203, 255], normalColor: limitTopColor }
+    }
+
+    if (parseInt(colorTempInt) <= 0) {
+      return { rgbColor: [255, 205, 102], normalColor: limitBottomColor }
+    }
+
+    let redStat = parseInt('FF', 16)
+    let redEnd = parseInt('80', 16)
+    let redStep = Math.round(redStat + ((redEnd - redStat) / 100) * colorTempInt)
+
+    let gStart = parseInt('CD', 16)
+    let gEnd = parseInt('CB', 16)
+    let gStep = Math.round(gStart + ((gEnd - gStart) / 100) * colorTempInt)
+
+    let bStart = parseInt('66', 16)
+    let bEnd = parseInt('FF', 16)
+    let bStep = Math.round(bStart + ((bEnd - bStart) / 100) * colorTempInt)
+
+    let colorVale = '#' + redStep.toString(16) + gStep.toString(16) + bStep.toString(16)
+    // console.log('色温值 -----------> colorVale: ',colorVale);
+
+    let colorRGBAry = [redStep, gStep, bStep]
+    return { rgbColor: colorRGBAry, normalColor: colorVale }
+  }
+}
+
+const styles = StyleSheet.create({
+  contentView: {
+    position: 'absolute',
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#FFFFFF',
+    borderRadius: 130,
+  },
+  angleView: {
+    height: 260,
+    width: 260,
+    borderRadius: 130,
+  },
+})

package/src/newModules/biorhythm/circular/TimeCircular.d.ts

@@ -0,0 +1,11 @@
+import { Plan } from '../BiorhythmBean';
+interface TimeCircularProps {
+    planList: Plan[];
+    onPanMoved?: (id: number, time: string) => void;
+    planEdit?: Boolean;
+    replaceStatus?: Boolean;
+    gradient?: Boolean;
+    isSupportTemperature: boolean;
+}
+declare const TimeCircular: (props?: TimeCircularProps) => any;
+export default TimeCircular;

package/src/newModules/biorhythm/circular/TimeCircular.tsx

@@ -0,0 +1,64 @@
+import React from 'react'
+import {Image, StyleSheet, View} from 'react-native'
+import Progress from './Progress'
+import {Plan} from '../BiorhythmBean'
+import BiologicalRes from '../res/BiologicalRes'
+import { useCreation } from 'ahooks'
+import { useSystemTimeFormate } from '@ledvance/base/src/models/modules/NativePropsSlice'
+
+interface TimeCircularProps {
+  planList: Plan[]
+  onPanMoved?: (id: number, time: number) => void
+  planEdit?: Boolean
+  replaceStatus?: Boolean
+  gradient?: Boolean
+  isSupportTemperature: boolean
+}
+
+const TimeCircular = (
+  props: TimeCircularProps = {
+    planList: [],
+    planEdit: false,
+    replaceStatus: false,
+    gradient: false,
+    isSupportTemperature: false,
+  },
+) => {
+  const {planList, onPanMoved, planEdit, replaceStatus, gradient, isSupportTemperature} = props
+  const styles = dynamicStyleSheet
+  const is24Hour = useSystemTimeFormate()
+  const enabledPlanList = planList.filter(plan => plan.enable)
+  const timeDialPic = useCreation(() =>{
+    if(is24Hour){
+      return replaceStatus ? BiologicalRes.ic_warning_amber_sun : BiologicalRes.ic_warning_amber_new
+    }else{
+      return replaceStatus ? BiologicalRes.ic_warning_amber_sun_12 : BiologicalRes.ic_warning_amber_new_12
+    }
+  }, [is24Hour, replaceStatus])
+
+  return (
+    <View style={styles.container}>
+      <Progress
+        radius={130}
+        annularHeight={44}
+        timeIconList={enabledPlanList}
+        planEdit={planEdit}
+        gradient={gradient}
+        isSupportTemperature={isSupportTemperature}
+        onPanMoved={(id: number, time: number) => {
+          onPanMoved && onPanMoved(id, time)
+        }}>
+        <Image source={timeDialPic} style={{width: 172, height: 172}}/>
+      </Progress>
+    </View>
+  )
+}
+
+const dynamicStyleSheet = StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+})
+
+export default TimeCircular

package/src/newModules/biorhythm/iconListData.ts

@@ -0,0 +1,30 @@
+import BiologicalRes from './res/BiologicalRes'
+
+const iconList = [
+  {id: 1, icon: BiologicalRes.biorhythom_Icon1, selectStatus: false, disabled: false},
+  {id: 2, icon: BiologicalRes.biorhythom_Icon2, selectStatus: false, disabled: false},
+  {id: 3, icon: BiologicalRes.biorhythom_Icon3, selectStatus: false, disabled: false},
+  {id: 4, icon: BiologicalRes.biorhythom_Icon4, selectStatus: false, disabled: false},
+  {id: 5, icon: BiologicalRes.biorhythom_Icon5, selectStatus: false, disabled: false},
+  {id: 6, icon: BiologicalRes.biorhythom_Icon6, selectStatus: false, disabled: false},
+  {id: 7, icon: BiologicalRes.biorhythom_Icon7, selectStatus: false, disabled: false},
+  {id: 8, icon: BiologicalRes.biorhythom_Icon8, selectStatus: false, disabled: false},
+  {id: 9, icon: BiologicalRes.biorhythom_Icon9, selectStatus: false, disabled: false},
+  {id: 10, icon: BiologicalRes.biorhythom_Icon10, selectStatus: false, disabled: false},
+  {id: 11, icon: BiologicalRes.biorhythom_Icon11, selectStatus: false, disabled: false},
+  {id: 12, icon: BiologicalRes.biorhythom_Icon12, selectStatus: false, disabled: false},
+  {id: 13, icon: BiologicalRes.biorhythom_Icon13, selectStatus: false, disabled: false},
+  {id: 14, icon: BiologicalRes.biorhythom_Icon14, selectStatus: false, disabled: false},
+  {id: 15, icon: BiologicalRes.biorhythom_Icon15, selectStatus: false, disabled: false},
+  {id: 16, icon: BiologicalRes.biorhythom_Icon16, selectStatus: false, disabled: false},
+  {id: 17, icon: BiologicalRes.biorhythom_Icon17, selectStatus: false, disabled: false},
+  {id: 18, icon: BiologicalRes.biorhythom_Icon18, selectStatus: false, disabled: false},
+  {id: 19, icon: BiologicalRes.biorhythom_Icon19, selectStatus: false, disabled: false},
+  {id: 20, icon: BiologicalRes.biorhythom_Icon20, selectStatus: false, disabled: false},
+  {id: 21, icon: BiologicalRes.biorhythom_Icon21, selectStatus: false, disabled: false},
+  {id: 22, icon: BiologicalRes.biorhythom_Icon22, selectStatus: false, disabled: false},
+  {id: 23, icon: BiologicalRes.biorhythom_Icon23, selectStatus: false, disabled: false},
+  {id: 24, icon: BiologicalRes.biorhythom_Icon24, selectStatus: false, disabled: false},
+]
+
+export default iconList

package/src/newModules/biorhythm/pIdList.ts

@@ -0,0 +1,36 @@
+const pIdList = [
+  '2tb7pu47xmtakusc',
+  'jde6i6cjuqafvhep',
+  'nertorg6rigv9kcs',
+  'upbvn0aceeduokg8',
+  'vz1ecmcefgtcjmze',
+  '9pub2u7xzwe3luhn',
+  'eyqghznptocb0c09',
+  'qrj3ubhrz2udkkp3',
+  'edlnwro9m0jhogfk',
+  'qaf91tzgkjhzxdlg',
+  'yy0mpo6vahmhhnyx',
+  'pfdsrf1aa9p2iqm7',
+  'aanbfdroxoikeemq',
+  'n19x26xmhzsoduoc',
+  'cnwub7a6xrvr8tg1',
+  'ix2a1uedckqziihs',
+  'hlodwjcku419f9q3',
+  'ntdbtyr4e5rk0nva',
+  'ck9ujelnqptkc2gu',
+  'poor3eeaue1xtmtj',
+  'f84gfg5bqwopeh6b',
+  '11w17umtgr8i7pzr',
+  'bivme7hztqwtansf',
+  '3eeippeoos24ebym',
+  'greysrcf5qraouxc',
+  'zadmgcev0sjzfzxx',
+  'wdk5pdrtqlguvbhx',
+  'rfzv1m0tt7bczqaf',
+  'qusibjjgjyarjs6w',
+  'hqad0c0jizozhhzl',
+  'bvctkpyefwowjfnh',
+  'z7g5wwtayzypqhdo',
+]
+
+export default pIdList

package/src/newModules/biorhythm/res/BiologicalRes.d.ts

@@ -0,0 +1,43 @@
+declare const _default: {
+    ic_warning_amber_sun: any;
+    ic_warning_amber_sun_12: any;
+    ic_warning_amber_new: any;
+    ic_warning_amber_new_12: any;
+    biorhythom_add: any;
+    biorhythom_select_rightIcon: any;
+    biorhythom_Icon1: any;
+    biorhythom_Icon2: any;
+    biorhythom_Icon3: any;
+    biorhythom_Icon4: any;
+    biorhythom_Icon5: any;
+    biorhythom_Icon6: any;
+    biorhythom_Icon7: any;
+    biorhythom_Icon8: any;
+    biorhythom_Icon9: any;
+    biorhythom_Icon10: any;
+    biorhythom_Icon11: any;
+    biorhythom_Icon12: any;
+    biorhythom_Icon13: any;
+    biorhythom_Icon14: any;
+    biorhythom_Icon15: any;
+    biorhythom_Icon16: any;
+    biorhythom_Icon17: any;
+    biorhythom_Icon18: any;
+    biorhythom_Icon19: any;
+    biorhythom_Icon20: any;
+    biorhythom_Icon21: any;
+    biorhythom_Icon22: any;
+    biorhythom_Icon23: any;
+    biorhythom_Icon24: any;
+    rhythm_icon1: string;
+    rhythm_icon1_1: any;
+    rhythm_icon2: string;
+    rhythm_icon2_1: any;
+    rhythm_icon3: string;
+    rhythm_icon3_1: any;
+    rhythm_icon4: string;
+    rhythm_icon4_1: any;
+    rhythm_icon12_1: any;
+    rhythm_icon12: string;
+};
+export default _default;

package/src/newModules/biorhythm/res/BiologicalRes.ts

@@ -0,0 +1,42 @@
+export default {
+  ic_warning_amber_sun: require('./Biological_Rhythm.png'),
+  ic_warning_amber_sun_12: require('./Biological_Rhythm_12.png'),
+  ic_warning_amber_new: require('./Biological_Rhythm_new.png'),
+  ic_warning_amber_new_12: require('./Biological_Rhythm_new_12.png'),
+  biorhythom_add: require('./iconsMaterialOutlinedArrowsNavAdd.png'),
+  biorhythom_select_rightIcon: require('./iconsMaterialOutlinedArrowsNavArrowForwardIos.png'),
+  biorhythom_Icon1: require('./iconsMaterialOutlinedWheatherWbTwilight.png'),
+  biorhythom_Icon2: require('./iconsMaterialOutlinedWheatherWbSunny.png'),
+  biorhythom_Icon3: require('./iconsMaterialOutlinedWheatherBedtime.png'),
+  biorhythom_Icon4: require('./iconsMaterialOutlinedWheatherPartlyCloudyDay.png'),
+  biorhythom_Icon5: require('./iconsMaterialOutlinedTimeAccessAlarm.png'),
+  biorhythom_Icon6: require('./iconsMaterialOutlinedOtherNotificationsNone.png'),
+  biorhythom_Icon7: require('./iconsMaterialOutlinedBuildingsHome.png'),
+  biorhythom_Icon8: require('./iconsMaterialOutlinedOtherBed.png'),
+  biorhythom_Icon9: require('./iconsMaterialOutlinedOtherChair.png'),
+  biorhythom_Icon10: require('./iconsMaterialOutlinedOtherDirectionsCar.png'),
+  biorhythom_Icon11: require('./iconsMaterialOutlinedOtherBusinessCenter.png'),
+  biorhythom_Icon12: require('./iconsMaterialOutlinedAccountGroups.png'),
+  biorhythom_Icon13: require('./iconsMaterialOutlinedOtherMenuBook.png'),
+  biorhythom_Icon14: require('./iconsMaterialOutlinedOtherHeadphones.png'),
+  biorhythom_Icon15: require('./iconsMaterialOutlinedOtherMusicNote.png'),
+  biorhythom_Icon16: require('./iconsMaterialOutlinedOtherFitnessCenter.png'),
+  biorhythom_Icon17: require('./iconsMaterialOutlinedOtherSportsEsports.png'),
+  biorhythom_Icon18: require('./iconsMaterialOutlinedOtherTv.png'),
+  biorhythom_Icon19: require('./iconsMaterialOutlinedOtherRestaurant.png'),
+  biorhythom_Icon20: require('./iconsMaterialOutlinedOtherCoffee.png'),
+  biorhythom_Icon21: require('./iconsMaterialOutlinedWheatherStarOutline.png'),
+  biorhythom_Icon22: require('./iconsMaterialOutlinedEditorFavoriteBorder.png'),
+  biorhythom_Icon23: require('./iconsMaterialOutlinedOtherSentimentSatisfied.png'),
+  biorhythom_Icon24: require('./iconsMaterialOutlinedOtherPottedPlant.png'),
+  rhythm_icon1: 'rhythm_icon1',
+  rhythm_icon1_1: require('./iconsMaterialOutlinedWheatherWbTwilight.png'),
+  rhythm_icon2: 'rhythm_icon2',
+  rhythm_icon2_1: require('./iconsMaterialOutlinedWheatherWbSunny.png'),
+  rhythm_icon3: 'rhythm_icon3',
+  rhythm_icon3_1: require('./iconsMaterialOutlinedOtherChair.png'),
+  rhythm_icon4: 'rhythm_icon4',
+  rhythm_icon4_1: require('./iconsMaterialOutlinedWheatherBedtime.png'),
+  rhythm_icon12_1: require('./iconsMaterialOutlinedTimeAccessAlarm.png'),
+  rhythm_icon12: 'rhythm_icon12',
+}