dhre-ui-kit 0.0.262 → 0.0.263
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/lib/index.d.ts +1 -0
- package/lib/index.js +87 -84
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +87 -84
- package/lib/index.mjs.map +1 -1
- package/package.json +1 -1
package/lib/index.d.ts
CHANGED
|
@@ -371,6 +371,7 @@ declare const _default$g: (props: AccordionProps) => React$1.JSX.Element;
|
|
|
371
371
|
interface ToastProps {
|
|
372
372
|
sucessIcon: React$1.ReactElement;
|
|
373
373
|
errorIcon: React$1.ReactElement;
|
|
374
|
+
containerStyle?: ViewStyle;
|
|
374
375
|
}
|
|
375
376
|
interface ToastRef {
|
|
376
377
|
showToast: (message: string, duration?: number, isSuccess?: boolean, buttonText?: string | null, buttonAction?: (() => void) | null) => void;
|
package/lib/index.js
CHANGED
|
@@ -2108,97 +2108,100 @@ const styles$l = reactNative.StyleSheet.create({
|
|
|
2108
2108
|
}
|
|
2109
2109
|
});
|
|
2110
2110
|
|
|
2111
|
-
const Toast = React__default["default"].forwardRef(
|
|
2112
|
-
|
|
2113
|
-
|
|
2114
|
-
|
|
2115
|
-
|
|
2116
|
-
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
|
|
2122
|
-
|
|
2123
|
-
|
|
2124
|
-
|
|
2125
|
-
|
|
2126
|
-
|
|
2127
|
-
|
|
2128
|
-
|
|
2129
|
-
|
|
2130
|
-
|
|
2131
|
-
|
|
2132
|
-
|
|
2133
|
-
|
|
2134
|
-
|
|
2135
|
-
|
|
2136
|
-
|
|
2137
|
-
|
|
2138
|
-
|
|
2139
|
-
|
|
2140
|
-
|
|
2141
|
-
|
|
2142
|
-
|
|
2143
|
-
|
|
2144
|
-
|
|
2145
|
-
|
|
2146
|
-
|
|
2147
|
-
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
}, [visible]);
|
|
2154
|
-
React__default["default"].useImperativeHandle(ref, () => ({
|
|
2155
|
-
showToast
|
|
2156
|
-
}));
|
|
2157
|
-
return visible ? /* @__PURE__ */ React__default["default"].createElement(
|
|
2158
|
-
reactNative.Animated.View,
|
|
2159
|
-
{
|
|
2160
|
-
style: [
|
|
2161
|
-
styles$l.container,
|
|
2162
|
-
{ bottom },
|
|
2163
|
-
{ backgroundColor: isSuccess ? "#00B578" : "#EB0542" }
|
|
2164
|
-
],
|
|
2165
|
-
testID: "TOAST"
|
|
2166
|
-
},
|
|
2167
|
-
/* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$l.toastContainer }, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$l.innerContainer }, /* @__PURE__ */ React__default["default"].createElement(reactNative.Pressable, { onPress: hideToast }, isSuccess ? sucessIcon : errorIcon), /* @__PURE__ */ React__default["default"].createElement(
|
|
2168
|
-
CustomTypography,
|
|
2169
|
-
{
|
|
2170
|
-
variant: "L2_REGULAR",
|
|
2171
|
-
text: message,
|
|
2172
|
-
style: styles$l.messageText
|
|
2111
|
+
const Toast = React__default["default"].forwardRef(
|
|
2112
|
+
({ sucessIcon, errorIcon, containerStyle }, ref) => {
|
|
2113
|
+
const [visible, setVisible] = React.useState(false);
|
|
2114
|
+
const [message, setMessage] = React.useState("");
|
|
2115
|
+
const [isSuccess, setIsSuccess] = React.useState(true);
|
|
2116
|
+
const [btnText, setBtnText] = React.useState(null);
|
|
2117
|
+
const [onBtnPress, setOnBtnPress] = React.useState(null);
|
|
2118
|
+
const [progress, setProgress] = React.useState(0);
|
|
2119
|
+
const bottom = React.useRef(new reactNative.Animated.Value(-80)).current;
|
|
2120
|
+
const showToast = (toastMessage, duration = 3e3, success = true, buttonText = null, buttonAction = null) => {
|
|
2121
|
+
setMessage(toastMessage);
|
|
2122
|
+
setIsSuccess(success);
|
|
2123
|
+
setBtnText(buttonText);
|
|
2124
|
+
setOnBtnPress(() => buttonAction);
|
|
2125
|
+
setVisible(true);
|
|
2126
|
+
reactNative.Animated.timing(bottom, {
|
|
2127
|
+
toValue: 20,
|
|
2128
|
+
duration: 500,
|
|
2129
|
+
useNativeDriver: false
|
|
2130
|
+
}).start();
|
|
2131
|
+
setTimeout(() => {
|
|
2132
|
+
hideToast();
|
|
2133
|
+
}, duration);
|
|
2134
|
+
};
|
|
2135
|
+
const hideToast = () => {
|
|
2136
|
+
reactNative.Animated.timing(bottom, {
|
|
2137
|
+
toValue: -80,
|
|
2138
|
+
duration: 500,
|
|
2139
|
+
useNativeDriver: false
|
|
2140
|
+
}).start(() => {
|
|
2141
|
+
setVisible(false);
|
|
2142
|
+
setMessage("");
|
|
2143
|
+
});
|
|
2144
|
+
};
|
|
2145
|
+
const simulateProgress = () => {
|
|
2146
|
+
setProgress((prev) => prev + 0.1 > 1 ? 1 : prev + 0.1);
|
|
2147
|
+
};
|
|
2148
|
+
React.useEffect(() => {
|
|
2149
|
+
if (visible) {
|
|
2150
|
+
setProgress(0);
|
|
2151
|
+
const interval = setInterval(simulateProgress, 180);
|
|
2152
|
+
return () => clearInterval(interval);
|
|
2173
2153
|
}
|
|
2174
|
-
|
|
2175
|
-
|
|
2154
|
+
}, [visible]);
|
|
2155
|
+
React__default["default"].useImperativeHandle(ref, () => ({
|
|
2156
|
+
showToast
|
|
2157
|
+
}));
|
|
2158
|
+
return visible ? /* @__PURE__ */ React__default["default"].createElement(
|
|
2159
|
+
reactNative.Animated.View,
|
|
2176
2160
|
{
|
|
2177
|
-
style:
|
|
2178
|
-
|
|
2179
|
-
|
|
2161
|
+
style: [
|
|
2162
|
+
styles$l.container,
|
|
2163
|
+
{ bottom },
|
|
2164
|
+
{ backgroundColor: isSuccess ? "#00B578" : "#EB0542" },
|
|
2165
|
+
containerStyle
|
|
2166
|
+
],
|
|
2167
|
+
testID: "TOAST"
|
|
2180
2168
|
},
|
|
2181
|
-
/* @__PURE__ */ React__default["default"].createElement(
|
|
2169
|
+
/* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$l.toastContainer }, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$l.innerContainer }, /* @__PURE__ */ React__default["default"].createElement(reactNative.Pressable, { onPress: hideToast }, isSuccess ? sucessIcon : errorIcon), /* @__PURE__ */ React__default["default"].createElement(
|
|
2182
2170
|
CustomTypography,
|
|
2183
2171
|
{
|
|
2184
|
-
variant: "
|
|
2185
|
-
text:
|
|
2186
|
-
style: styles$l.
|
|
2172
|
+
variant: "L2_REGULAR",
|
|
2173
|
+
text: message,
|
|
2174
|
+
style: styles$l.messageText
|
|
2175
|
+
}
|
|
2176
|
+
), btnText && /* @__PURE__ */ React__default["default"].createElement(
|
|
2177
|
+
reactNative.Pressable,
|
|
2178
|
+
{
|
|
2179
|
+
style: styles$l.button,
|
|
2180
|
+
onPress: onBtnPress || void 0,
|
|
2181
|
+
testID: "TOAST-BTN"
|
|
2182
|
+
},
|
|
2183
|
+
/* @__PURE__ */ React__default["default"].createElement(
|
|
2184
|
+
CustomTypography,
|
|
2185
|
+
{
|
|
2186
|
+
variant: "L2_BOLD",
|
|
2187
|
+
text: btnText,
|
|
2188
|
+
style: styles$l.buttonText
|
|
2189
|
+
}
|
|
2190
|
+
)
|
|
2191
|
+
))),
|
|
2192
|
+
/* @__PURE__ */ React__default["default"].createElement(
|
|
2193
|
+
Progress__namespace.Bar,
|
|
2194
|
+
{
|
|
2195
|
+
progress,
|
|
2196
|
+
width: width - horizontalScale(48),
|
|
2197
|
+
height: 3,
|
|
2198
|
+
color: isSuccess ? "#024324" : "#851D41",
|
|
2199
|
+
borderColor: "transparent"
|
|
2187
2200
|
}
|
|
2188
2201
|
)
|
|
2189
|
-
)
|
|
2190
|
-
|
|
2191
|
-
|
|
2192
|
-
{
|
|
2193
|
-
progress,
|
|
2194
|
-
width: width - horizontalScale(48),
|
|
2195
|
-
height: 3,
|
|
2196
|
-
color: isSuccess ? "#024324" : "#851D41",
|
|
2197
|
-
borderColor: "transparent"
|
|
2198
|
-
}
|
|
2199
|
-
)
|
|
2200
|
-
) : null;
|
|
2201
|
-
});
|
|
2202
|
+
) : null;
|
|
2203
|
+
}
|
|
2204
|
+
);
|
|
2202
2205
|
Toast.displayName = "Toast";
|
|
2203
2206
|
|
|
2204
2207
|
const styles$k = reactNative.StyleSheet.create({
|