@tarmiz/react-native-toast - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

dist/toast.d.ts

@@ -14,4 +14,6 @@ import React from "react";
     noMargin?: boolean;
+    leftColor?: string;
+    rightColor?: string;
 };
-export declare const CustomToast: ({ message, status, noMargin, }: CustomToastProps) => React.JSX.Element;
+export declare const CustomToast: ({ message, status, noMargin, leftColor, rightColor, }: CustomToastProps) => React.JSX.Element;
 type NotificationIconProps = {
@@ -35,2 +37,4 @@ size?: number | string;
     duration?: number;
+    leftColor?: string;
+    rightColor?: string;
 };
@@ -40,2 +44,4 @@ interface ShowOptions {
     duration?: number;
+    leftColor?: string;
+    rightColor?: string;
 }
@@ -42,0 +48,0 @@ export declare const useBlurToast: () => {

dist/toast.js

@@ -28,3 +28,3 @@ import React from "react";
 };
-export const CustomToast = ({ message, status = "success", noMargin = false, }) => {
+export const CustomToast = ({ message, status = "success", noMargin = false, leftColor, rightColor, }) => {
     const getIconConfig = () => {
@@ -61,2 +61,4 @@ const size = hp("2.5%");
     const { icon, color } = getIconConfig();
+    const gradientLeft = leftColor !== null && leftColor !== void 0 ? leftColor : `${color}80`;
+    const gradientRight = rightColor !== null && rightColor !== void 0 ? rightColor : palette.shadowWhite;
     const insets = useSafeAreaInsets();
@@ -74,3 +76,3 @@ const topPadding = noMargin ? 0 : insets.top > 0 ? insets.top : hp("2%");
         ]}>
-      <LinearGradient colors={[`${color}80`, palette.shadowWhite]} start={{ x: 0, y: 0.75 }} end={{ x: 1, y: 0.25 }} style={StyleSheet.absoluteFillObject}/>
+      <LinearGradient colors={[gradientLeft, gradientRight]} start={{ x: 0, y: 0.75 }} end={{ x: 1, y: 0.25 }} style={StyleSheet.absoluteFillObject}/>
       <View style={styles.content}>
@@ -114,2 +116,4 @@ <View style={[styles.shadowIcon, { backgroundColor: `${color}1F` }]}>
     const [type, setType] = React.useState("success");
+    const [leftColor, setLeftColor] = React.useState();
+    const [rightColor, setRightColor] = React.useState();
     const opacity = useSharedValue(0);
@@ -149,2 +153,4 @@ const translateY = useSharedValue(-20);
             setType(resolveType(opts === null || opts === void 0 ? void 0 : opts.type));
+            setLeftColor(opts === null || opts === void 0 ? void 0 : opts.leftColor);
+            setRightColor(opts === null || opts === void 0 ? void 0 : opts.rightColor);
         }
@@ -154,2 +160,4 @@ else {
             setType(resolveType(arg.type));
+            setLeftColor(arg.leftColor);
+            setRightColor(arg.rightColor);
         }
@@ -188,3 +196,3 @@ setVisible(true);
         return (<Animated.View pointerEvents="box-none" style={[styles.floatingWrapper, aStyle, { top: insets.top }]}>
-        <CustomToast message={message} status={type} noMargin/>
+        <CustomToast message={message} status={type} noMargin leftColor={leftColor} rightColor={rightColor}/>
       </Animated.View>);
@@ -191,0 +199,0 @@ };

package.json

 {
   "name": "@tarmiz/react-native-toast",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Reusable custom toast components and hook for React Native",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -8,3 +8,3 @@ # react-native-toast
 ```bash
-yarn add @mokhles_tarmiz/react-native-toast
+yarn add @tarmiz/react-native-toast
 yarn add react-native-reanimated react-native-safe-area-context react-native-responsive-screen lucide-react-native expo-blur expo-linear-gradient
@@ -18,3 +18,3 @@ ```
 import { Pressable, Text, View } from "react-native";
-import { ALERT_TYPE, useBlurToast } from "@mokhles_tarmiz/react-native-toast";
+import { ALERT_TYPE, useBlurToast } from "@tarmiz/react-native-toast";
 
@@ -33,2 +33,4 @@ export const Example = () => {
               duration: 3000,
+              leftColor: "#000000",
+              rightColor: "transparent",
             })
@@ -46,1 +48,3 @@ }
 ```
+
+You can pass any valid color for `leftColor` and `rightColor` (for example `"black"`, `"white"`, `"transparent"`, hex, or rgba). If omitted, the toast uses default colors based on the alert type.

No alert changes

Improved metrics

Total package byte prevSize

13220

8.77%

Lines of code

298

4.93%

Number of lines in readme file

47

9.3%

No dependency changes