react-native-ui-lib 7.40.1-snapshot.6836 → 7.40.1-snapshot.6844

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-lib",
-  "version": "7.40.1-snapshot.6836",
+  "version": "7.40.1-snapshot.6844",
   "main": "src/index.js",
   "types": "src/index.d.ts",
   "author": "Ethan Sharabi <ethan.shar@gmail.com>",

package/src/components/drawer/index.d.ts

@@ -5,7 +5,9 @@ interface DrawerItemProps {
     width?: number;
     background?: string;
     text?: string;
+    textColor?: string;
     icon?: number;
+    iconColor?: string;
     onPress?: Function;
     keepOpen?: boolean;
     style?: ViewStyle;

package/src/components/drawer/index.js

@@ -229,14 +229,14 @@ class Drawer extends PureComponent {
         {!item.customElement && item.icon && <Animated.Image source={item.icon} style={[styles.actionIcon, {
         width: itemsIconSize,
         height: itemsIconSize,
-        tintColor: itemsTintColor,
+        tintColor: item.iconColor || itemsTintColor,
         opacity,
         transform: [{
           scale
         }]
       }]} />}
         {!item.customElement && item.text && <Animated.Text style={[styles.actionText, {
-        color: itemsTintColor,
+        color: item.textColor || itemsTintColor,
         opacity,
         transform: [{
           scale

package/src/components/timeline/Point.js

@@ -49,14 +49,17 @@ const Point = props => {
   }, [type, color, label, removeIconBackground, icon]);
   const renderPointContent = () => {
     const {
-      removeIconBackground
+      removeIconBackground,
+      labelColor
     } = props;
     const tintColor = removeIconBackground ? Colors.$iconDefault : Colors.$iconDefaultLight;
     const iconSize = removeIconBackground ? undefined : ICON_SIZE;
     if (icon) {
       return <Icon tintColor={tintColor} {...iconProps} size={iconSize} source={icon} />;
     } else if (label) {
-      return <Text recorderTag={'unmask'} $textDefaultLight subtextBold>{label}</Text>;
+      return <Text recorderTag={'unmask'} $textDefaultLight subtextBold color={labelColor}>
+          {label}
+        </Text>;
     }
   };
   return <View center style={pointStyle} onLayout={onLayout}>

package/src/components/timeline/index.js

@@ -1,6 +1,7 @@
 import React, { useCallback, useMemo, useEffect, useState, useRef } from 'react';
 import { StyleSheet } from 'react-native';
 import { Colors, Spacings } from "../../style";
+import { useThemeProps } from "../../hooks";
 import View from "../view";
 import Point from "./Point";
 import Line from "./Line";
@@ -9,12 +10,13 @@ export { TimelineProps, PointProps as TimelinePointProps, LineProps as TimelineL
 const CONTENT_CONTAINER_PADDINGS = Spacings.s2;
 const ENTRY_POINT_HEIGHT = 2;
 const Timeline = props => {
+  const themeProps = useThemeProps(props, 'Timeline');
   const {
     topLine,
     bottomLine,
     point,
     children
-  } = props;
+  } = themeProps;
   const [anchorMeasurements, setAnchorMeasurements] = useState();
   const [contentContainerMeasurements, setContentContainerMeasurements] = useState();
   const [pointMeasurements, setPointMeasurements] = useState();

package/src/components/timeline/types.d.ts

@@ -32,6 +32,7 @@ export type PointProps = {
     iconProps?: IconProps;
     removeIconBackground?: boolean;
     label?: number;
+    labelColor?: string;
     /** to align point to this view's center */
     anchorRef?: React.MutableRefObject<undefined>;
 };