react-native-bread 0.5.2 → 0.6.0

package/lib/commonjs/toast.js

@@ -1 +1,351 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ToastContainer=void 0;var t=require("react"),e=require("react-native"),i=require("react-native-gesture-handler"),o=function(t,e){if("function"==typeof WeakMap)var i=new WeakMap,o=new WeakMap;return function(t,e){if(!e&&t&&t.__esModule)return t;var n,s,a={__proto__:null,default:t};if(null===t||"object"!=typeof t&&"function"!=typeof t)return a;if(n=e?o:i){if(n.has(t))return n.get(t);n.set(t,a)}for(const e in t)"default"!==e&&{}.hasOwnProperty.call(t,e)&&((s=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(t,e))&&(s.get||s.set)?n(a,e,s):a[e]=t[e]);return a}(t,e)}(require("react-native-reanimated")),n=require("react-native-safe-area-context"),s=require("react-native-worklets"),a=require("./constants.js"),r=require("./icons/index.js"),l=require("./pool.js"),u=require("./toast-icons.js"),c=require("./toast-store.js"),d=require("./use-toast-state.js"),p=require("react/jsx-runtime");exports.ToastContainer=()=>{const{top:r,bottom:l}=(0,n.useSafeAreaInsets)(),{visibleToasts:u,theme:c,toastsWithIndex:T,isBottom:I,topToastRef:h,isBottomRef:f,isDismissibleRef:E}=(0,d.useToastState)(),m=(0,o.useSharedValue)(!1),x=(0,t.useMemo)(()=>i.Gesture.Pan().onStart(()=>{"worklet";m.set(!1)}).onUpdate(t=>{"worklet";if(!E.current.value)return;const e=h.current.value;if(!e)return;const{slot:i}=e,o=f.current.value,n=t.translationY,s=o?n:-n,r=o?-n:n;if(s>0){const e=o?Math.min(n,a.MAX_DRAG_CLAMP):Math.max(n,-a.MAX_DRAG_CLAMP);i.translationY.value=e;const r=s>a.DISMISS_THRESHOLD||(o?t.velocityY>a.DISMISS_VELOCITY_THRESHOLD:t.velocityY<-a.DISMISS_VELOCITY_THRESHOLD);m.set(r)}else{const t=a.MAX_DRAG_RESISTANCE*(1-Math.exp(-r/250));i.translationY.value=o?-Math.min(t,a.MAX_DRAG_RESISTANCE):Math.min(t,a.MAX_DRAG_RESISTANCE),m.value=!1}}).onEnd(()=>{"worklet";if(!E.current.value)return;const t=h.current.value;if(!t)return;const{slot:e}=t,i=f.current.value;if(m.value){e.progress.value=(0,o.withTiming)(0,{duration:a.EXIT_DURATION,easing:a.EASING});const n=i?a.SWIPE_EXIT_OFFSET:-a.SWIPE_EXIT_OFFSET;e.translationY.value=(0,o.withTiming)(e.translationY.value+n,{duration:a.EXIT_DURATION,easing:a.EASING}),(0,s.scheduleOnRN)(t.dismiss)}else e.translationY.value=(0,o.withTiming)(0,{duration:a.SPRING_BACK_DURATION,easing:a.EASING})}),[m,E,h,f]),v=(0,t.useCallback)(t=>{h.current.value=t},[h]);if(0===u.length)return null;const _=I?l:r,y=I?{bottom:_+c.offset+2}:{top:_+c.offset+2};return(0,p.jsx)(i.GestureDetector,{gesture:x,children:(0,p.jsx)(e.View,{style:[S.container,y],pointerEvents:"box-none",children:T.map(({toast:t,index:e})=>(0,p.jsx)(g,{toast:t,index:e,theme:c,position:c.position,isTopToast:0===e,registerTopToast:v},t.id))})})};const T=({toast:i,index:n,theme:s,position:d,isTopToast:T,registerTopToast:g})=>{const[I]=(0,t.useState)(()=>(0,l.getSlotIndex)(i.id)),h=l.animationPool[I],f=l.slotTrackers[I],E="bottom"===d,m=E?a.ENTRY_OFFSET:-a.ENTRY_OFFSET,x=E?a.EXIT_OFFSET:-a.EXIT_OFFSET,[v,_]=(0,t.useState)("loading"===i.type),[y,A]=(0,t.useState)(!1);(0,t.useEffect)(()=>{h.progress.value=0,h.translationY.value=0,h.stackIndex.value=n,h.progress.value=(0,o.withTiming)(1,{duration:a.ENTRY_DURATION,easing:a.EASING});const t=setTimeout(()=>A(!0),50);return()=>{clearTimeout(t),(0,l.releaseSlot)(i.id)}},[]);const w=(0,t.useCallback)(()=>{c.toastStore.hide(i.id)},[i.id]);(0,t.useEffect)(()=>{let t=null;return i.isExiting&&!f.wasExiting&&(f.wasExiting=!0,h.progress.value=(0,o.withTiming)(0,{duration:a.EXIT_DURATION,easing:a.EASING}),h.translationY.value=(0,o.withTiming)(x,{duration:a.EXIT_DURATION,easing:a.EASING})),f.initialized&&n!==f.prevIndex&&(h.stackIndex.value=(0,o.withTiming)(n,{duration:a.STACK_TRANSITION_DURATION,easing:a.EASING})),f.prevIndex=n,f.initialized=!0,"loading"===i.type?_(!0):v&&(t=setTimeout(()=>_(!1),a.ICON_ANIMATION_DURATION+50)),T&&g({slot:h,dismiss:w}),()=>{t&&clearTimeout(t),T&&g(null)}},[i.isExiting,n,h,f,x,i.type,v,T,g,w]);const C=v&&"loading"!==i.type,R=(0,o.useAnimatedStyle)(()=>{const t=(0,o.interpolate)(h.progress.value,[0,1],[m,0]),e=E?h.stackIndex.value*a.STACK_OFFSET_PER_ITEM:h.stackIndex.value*-a.STACK_OFFSET_PER_ITEM,i=1-h.stackIndex.value*a.STACK_SCALE_PER_ITEM,n=t+h.translationY.value+e,s=(0,o.interpolate)(h.progress.value,[0,1],[0,1]),r=E?h.translationY.value:-h.translationY.value,l=s*(r>0?(0,o.interpolate)(r,[0,130],[1,0],"clamp"):1);return{transform:[{translateY:n},{scale:i*(0,o.interpolate)(Math.abs(h.translationY.value),[0,50],[1,.98],"clamp")}],opacity:l,zIndex:1e3-Math.round(h.stackIndex.value)}}),{options:O}=i,M=s.colors[i.type];if(void 0!==O?.customContent){const t=O.customContent;return(0,p.jsx)(o.default.View,{style:[S.toast,S.customContentToast,E?S.toastBottom:S.toastTop,{backgroundColor:M.background},s.toastStyle,O.style,R],children:"function"==typeof t?t({id:i.id,dismiss:w,type:i.type,isExiting:!!i.isExiting}):t})}const N="loading"!==i.type&&(O?.showCloseButton??s.showCloseButton);return(0,p.jsxs)(o.default.View,{style:[S.toast,E?S.toastBottom:S.toastTop,{backgroundColor:M.background},s.rtl&&S.rtl,s.toastStyle,O?.style,R],children:[(0,p.jsx)(e.View,{style:S.iconContainer,children:y&&(C?(0,p.jsx)(u.AnimatedIcon,{type:i.type,color:M.accent,custom:O?.icon,config:s.icons[i.type]},i.type):(0,u.resolveIcon)(i.type,M.accent,O?.icon,s.icons[i.type]))}),(0,p.jsxs)(e.View,{style:S.textContainer,children:[(0,p.jsx)(e.Text,{maxFontSizeMultiplier:1.35,allowFontScaling:!1,style:[S.title,{color:M.accent},s.rtl&&{textAlign:"right"},s.titleStyle,O?.titleStyle],children:i.title}),i.description&&(0,p.jsx)(e.Text,{allowFontScaling:!1,maxFontSizeMultiplier:1.35,style:[S.description,s.rtl&&{textAlign:"right"},s.descriptionStyle,O?.descriptionStyle],children:i.description})]}),N&&(0,p.jsx)(e.Pressable,{style:S.closeButton,onPress:w,hitSlop:12,children:(0,p.jsx)(r.CloseIcon,{width:20,height:20})})]})},g=(0,t.memo)(T,(t,e)=>t.toast.id===e.toast.id&&t.toast.type===e.toast.type&&t.toast.title===e.toast.title&&t.toast.description===e.toast.description&&t.toast.isExiting===e.toast.isExiting&&t.index===e.index&&t.position===e.position&&t.theme===e.theme&&t.isTopToast===e.isTopToast),S=e.StyleSheet.create({container:{position:"absolute",left:16,right:16,zIndex:1e3},toast:{flexDirection:"row",alignItems:"center",gap:12,minHeight:36,borderRadius:20,borderCurve:"continuous",position:"absolute",left:0,right:0,paddingHorizontal:12,paddingVertical:10,shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.05,shadowRadius:24,elevation:8},customContentToast:{padding:0,paddingHorizontal:0,paddingVertical:0,overflow:"hidden"},rtl:{flexDirection:"row-reverse"},toastTop:{top:0},toastBottom:{bottom:0},iconContainer:{width:48,height:48,alignItems:"center",justifyContent:"center",marginLeft:8},textContainer:{flex:1,gap:1,justifyContent:"center"},title:{fontSize:14,fontWeight:"700",lineHeight:20},description:{color:"#6B7280",fontSize:12,fontWeight:"500",lineHeight:16},closeButton:{padding:4,alignItems:"center",justifyContent:"center"}});
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ToastContainer = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _reactNativeGestureHandler = require("react-native-gesture-handler");
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _reactNativeWorklets = require("react-native-worklets");
+var _constants = require("./constants.js");
+var _index = require("./icons/index.js");
+var _pool = require("./pool.js");
+var _toastIcons = require("./toast-icons.js");
+var _toastStore = require("./toast-store.js");
+var _useToastState = require("./use-toast-state.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const ToastContainer = () => {
+  const {
+    top,
+    bottom
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const {
+    visibleToasts,
+    theme,
+    toastsWithIndex,
+    isBottom,
+    topToastRef,
+    isBottomRef,
+    isDismissibleRef
+  } = (0, _useToastState.useToastState)();
+  const shouldDismiss = (0, _reactNativeReanimated.useSharedValue)(false);
+  const panGesture = (0, _react.useMemo)(() => _reactNativeGestureHandler.Gesture.Pan().onStart(() => {
+    "worklet";
+
+    shouldDismiss.set(false);
+  }).onUpdate(event => {
+    "worklet";
+
+    if (!isDismissibleRef.current.value) return;
+    const ref = topToastRef.current.value;
+    if (!ref) return;
+    const {
+      slot
+    } = ref;
+    const bottom = isBottomRef.current.value;
+    const rawY = event.translationY;
+    const dismissDrag = bottom ? rawY : -rawY;
+    const resistDrag = bottom ? -rawY : rawY;
+    if (dismissDrag > 0) {
+      const clampedY = bottom ? Math.min(rawY, _constants.MAX_DRAG_CLAMP) : Math.max(rawY, -_constants.MAX_DRAG_CLAMP);
+      slot.translationY.value = clampedY;
+      const shouldTriggerDismiss = dismissDrag > _constants.DISMISS_THRESHOLD || (bottom ? event.velocityY > _constants.DISMISS_VELOCITY_THRESHOLD : event.velocityY < -_constants.DISMISS_VELOCITY_THRESHOLD);
+      shouldDismiss.set(shouldTriggerDismiss);
+    } else {
+      const exponentialDrag = _constants.MAX_DRAG_RESISTANCE * (1 - Math.exp(-resistDrag / 250));
+      slot.translationY.value = bottom ? -Math.min(exponentialDrag, _constants.MAX_DRAG_RESISTANCE) : Math.min(exponentialDrag, _constants.MAX_DRAG_RESISTANCE);
+      shouldDismiss.value = false;
+    }
+  }).onEnd(() => {
+    "worklet";
+
+    if (!isDismissibleRef.current.value) return;
+    const ref = topToastRef.current.value;
+    if (!ref) return;
+    const {
+      slot
+    } = ref;
+    const bottom = isBottomRef.current.value;
+    if (shouldDismiss.value) {
+      slot.progress.value = (0, _reactNativeReanimated.withTiming)(0, {
+        duration: _constants.EXIT_DURATION,
+        easing: _constants.EASING
+      });
+      const exitOffset = bottom ? _constants.SWIPE_EXIT_OFFSET : -_constants.SWIPE_EXIT_OFFSET;
+      slot.translationY.value = (0, _reactNativeReanimated.withTiming)(slot.translationY.value + exitOffset, {
+        duration: _constants.EXIT_DURATION,
+        easing: _constants.EASING
+      });
+      (0, _reactNativeWorklets.scheduleOnRN)(ref.dismiss);
+    } else {
+      slot.translationY.value = (0, _reactNativeReanimated.withTiming)(0, {
+        duration: _constants.SPRING_BACK_DURATION,
+        easing: _constants.EASING
+      });
+    }
+  }), [shouldDismiss, isDismissibleRef, topToastRef, isBottomRef]);
+  const registerTopToast = (0, _react.useCallback)(values => {
+    topToastRef.current.value = values;
+  }, [topToastRef]);
+  if (visibleToasts.length === 0) return null;
+  const inset = isBottom ? bottom : top;
+  const positionStyle = isBottom ? {
+    bottom: inset + theme.offset + 2
+  } : {
+    top: inset + theme.offset + 2
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector, {
+    gesture: panGesture,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.container, positionStyle],
+      pointerEvents: "box-none",
+      children: toastsWithIndex.map(({
+        toast,
+        index
+      }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(MemoizedToastItem, {
+        toast: toast,
+        index: index,
+        theme: theme,
+        position: theme.position,
+        isTopToast: index === 0,
+        registerTopToast: registerTopToast
+      }, toast.id))
+    })
+  });
+};
+exports.ToastContainer = ToastContainer;
+const ToastItem = ({
+  toast,
+  index,
+  theme,
+  position,
+  isTopToast,
+  registerTopToast
+}) => {
+  const [slotIdx] = (0, _react.useState)(() => (0, _pool.getSlotIndex)(toast.id));
+  const slot = _pool.animationPool[slotIdx];
+  const tracker = _pool.slotTrackers[slotIdx];
+  const isBottom = position === "bottom";
+  const entryFromY = isBottom ? _constants.ENTRY_OFFSET : -_constants.ENTRY_OFFSET;
+  const exitToY = isBottom ? _constants.EXIT_OFFSET : -_constants.EXIT_OFFSET;
+  const [wasLoading, setWasLoading] = (0, _react.useState)(toast.type === "loading");
+  const [showIcon, setShowIcon] = (0, _react.useState)(false);
+
+  // biome-ignore lint/correctness/useExhaustiveDependencies: mount-only effect
+  (0, _react.useEffect)(() => {
+    slot.progress.value = 0;
+    slot.translationY.value = 0;
+    slot.stackIndex.value = index;
+    slot.progress.value = (0, _reactNativeReanimated.withTiming)(1, {
+      duration: _constants.ENTRY_DURATION,
+      easing: _constants.EASING
+    });
+    const iconTimeout = setTimeout(() => setShowIcon(true), 50);
+    return () => {
+      clearTimeout(iconTimeout);
+      (0, _pool.releaseSlot)(toast.id);
+    };
+  }, []);
+  const dismissToast = (0, _react.useCallback)(() => {
+    _toastStore.toastStore.hide(toast.id);
+  }, [toast.id]);
+  (0, _react.useEffect)(() => {
+    let loadingTimeout = null;
+    if (toast.isExiting && !tracker.wasExiting) {
+      tracker.wasExiting = true;
+      slot.progress.value = (0, _reactNativeReanimated.withTiming)(0, {
+        duration: _constants.EXIT_DURATION,
+        easing: _constants.EASING
+      });
+      slot.translationY.value = (0, _reactNativeReanimated.withTiming)(exitToY, {
+        duration: _constants.EXIT_DURATION,
+        easing: _constants.EASING
+      });
+    }
+    if (tracker.initialized && index !== tracker.prevIndex) {
+      slot.stackIndex.value = (0, _reactNativeReanimated.withTiming)(index, {
+        duration: _constants.STACK_TRANSITION_DURATION,
+        easing: _constants.EASING
+      });
+    }
+    tracker.prevIndex = index;
+    tracker.initialized = true;
+    if (toast.type === "loading") {
+      setWasLoading(true);
+    } else if (wasLoading) {
+      loadingTimeout = setTimeout(() => setWasLoading(false), _constants.ICON_ANIMATION_DURATION + 50);
+    }
+    if (isTopToast) {
+      registerTopToast({
+        slot: slot,
+        dismiss: dismissToast
+      });
+    }
+    return () => {
+      if (loadingTimeout) clearTimeout(loadingTimeout);
+      if (isTopToast) registerTopToast(null);
+    };
+  }, [toast.isExiting, index, slot, tracker, exitToY, toast.type, wasLoading, isTopToast, registerTopToast, dismissToast]);
+  const shouldAnimateIcon = wasLoading && toast.type !== "loading";
+  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    const baseTranslateY = (0, _reactNativeReanimated.interpolate)(slot.progress.value, [0, 1], [entryFromY, 0]);
+    const stackOffsetY = isBottom ? slot.stackIndex.value * _constants.STACK_OFFSET_PER_ITEM : slot.stackIndex.value * -_constants.STACK_OFFSET_PER_ITEM;
+    const stackScale = 1 - slot.stackIndex.value * _constants.STACK_SCALE_PER_ITEM;
+    const finalTranslateY = baseTranslateY + slot.translationY.value + stackOffsetY;
+    const progressOpacity = (0, _reactNativeReanimated.interpolate)(slot.progress.value, [0, 1], [0, 1]);
+    const dismissDirection = isBottom ? slot.translationY.value : -slot.translationY.value;
+    const dragOpacity = dismissDirection > 0 ? (0, _reactNativeReanimated.interpolate)(dismissDirection, [0, 130], [1, 0], "clamp") : 1;
+    const opacity = progressOpacity * dragOpacity;
+    const dragScale = (0, _reactNativeReanimated.interpolate)(Math.abs(slot.translationY.value), [0, 50], [1, 0.98], "clamp");
+    const scale = stackScale * dragScale;
+    return {
+      transform: [{
+        translateY: finalTranslateY
+      }, {
+        scale
+      }],
+      opacity,
+      zIndex: 1000 - Math.round(slot.stackIndex.value)
+    };
+  });
+  const {
+    options
+  } = toast;
+  const colors = theme.colors[toast.type];
+  if (options?.customContent !== undefined) {
+    const content = options.customContent;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
+      style: [styles.toast, styles.customContentToast, isBottom ? styles.toastBottom : styles.toastTop, {
+        backgroundColor: colors.background
+      }, theme.toastStyle, options.style, animatedStyle],
+      children: typeof content === "function" ? content({
+        id: toast.id,
+        dismiss: dismissToast,
+        type: toast.type,
+        isExiting: !!toast.isExiting
+      }) : content
+    });
+  }
+  const shouldShowCloseButton = toast.type !== "loading" && (options?.showCloseButton ?? theme.showCloseButton);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
+    style: [styles.toast, isBottom ? styles.toastBottom : styles.toastTop, {
+      backgroundColor: colors.background
+    }, theme.rtl && styles.rtl, theme.toastStyle, options?.style, animatedStyle],
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.iconContainer,
+      children: showIcon && (shouldAnimateIcon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_toastIcons.AnimatedIcon, {
+        type: toast.type,
+        color: colors.accent,
+        custom: options?.icon,
+        config: theme.icons[toast.type]
+      }, toast.type) : (0, _toastIcons.resolveIcon)(toast.type, colors.accent, options?.icon, theme.icons[toast.type]))
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.textContainer,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        maxFontSizeMultiplier: 1.35,
+        allowFontScaling: false,
+        style: [styles.title, {
+          color: colors.accent
+        }, theme.rtl && {
+          textAlign: "right"
+        }, theme.titleStyle, options?.titleStyle],
+        children: toast.title
+      }), toast.description && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        allowFontScaling: false,
+        maxFontSizeMultiplier: 1.35,
+        style: [styles.description, theme.rtl && {
+          textAlign: "right"
+        }, theme.descriptionStyle, options?.descriptionStyle],
+        children: toast.description
+      })]
+    }), shouldShowCloseButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+      style: styles.closeButton,
+      onPress: dismissToast,
+      hitSlop: 12,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.CloseIcon, {
+        width: 20,
+        height: 20
+      })
+    })]
+  });
+};
+const MemoizedToastItem = /*#__PURE__*/(0, _react.memo)(ToastItem, (prev, next) => {
+  return prev.toast.id === next.toast.id && prev.toast.type === next.toast.type && prev.toast.title === next.toast.title && prev.toast.description === next.toast.description && prev.toast.isExiting === next.toast.isExiting && prev.index === next.index && prev.position === next.position && prev.theme === next.theme && prev.isTopToast === next.isTopToast;
+});
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    position: "absolute",
+    left: 16,
+    right: 16,
+    zIndex: 1000
+  },
+  toast: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 12,
+    minHeight: 36,
+    borderRadius: 20,
+    borderCurve: "continuous",
+    position: "absolute",
+    left: 0,
+    right: 0,
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 8
+    },
+    shadowOpacity: 0.05,
+    shadowRadius: 24,
+    elevation: 8
+  },
+  customContentToast: {
+    padding: 0,
+    paddingHorizontal: 0,
+    paddingVertical: 0,
+    overflow: "hidden"
+  },
+  rtl: {
+    flexDirection: "row-reverse"
+  },
+  toastTop: {
+    top: 0
+  },
+  toastBottom: {
+    bottom: 0
+  },
+  iconContainer: {
+    width: 48,
+    height: 48,
+    alignItems: "center",
+    justifyContent: "center",
+    marginLeft: 8
+  },
+  textContainer: {
+    flex: 1,
+    gap: 1,
+    justifyContent: "center"
+  },
+  title: {
+    fontSize: 14,
+    fontWeight: "700",
+    lineHeight: 20
+  },
+  description: {
+    color: "#6B7280",
+    fontSize: 12,
+    fontWeight: "500",
+    lineHeight: 16
+  },
+  closeButton: {
+    padding: 4,
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
+//# sourceMappingURL=toast.js.map

package/lib/commonjs/types.js

@@ -1 +1,6 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/lib/commonjs/use-toast-state.js

@@ -1 +1,72 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useToastState=void 0;var t=require("react"),e=require("react-native-reanimated"),s=require("./toast-store.js");exports.useToastState=()=>{const[i,o]=(0,t.useState)([]),[n,a]=(0,t.useState)(()=>s.toastStore.getTheme()),r=(0,t.useRef)((0,e.makeMutable)(null)),u=(0,t.useRef)((0,e.makeMutable)("bottom"===n.position)),l=(0,t.useRef)((0,e.makeMutable)(!0)),m="bottom"===n.position,b=i.find(t=>!t.isExiting),c=b?.options?.dismissible??n.dismissible;(0,t.useEffect)(()=>{const t=s.toastStore.getState().visibleToasts,e=s.toastStore.getTheme();o(t);const i=t.find(t=>!t.isExiting);u.current.value="bottom"===e.position,l.current.value=i?.options?.dismissible??e.dismissible;let n=null,r=null;const m=s.toastStore.subscribe(t=>{n=t.visibleToasts,null===r&&(r=requestAnimationFrame(()=>{const t=n??s.toastStore.getState().visibleToasts,e=s.toastStore.getTheme();n&&(o(n),n=null),r=null,a(t=>t===e?t:e);const i=t.find(t=>!t.isExiting);u.current.value="bottom"===e.position,l.current.value=i?.options?.dismissible??e.dismissible}))});return m},[]);const d=(0,t.useMemo)(()=>{const t=new Map;let e=0;for(const s of i)t.set(s.id,s.isExiting?-1:e),s.isExiting||e++;return[...i].reverse().map(e=>({toast:e,index:t.get(e.id)??0}))},[i]);return{visibleToasts:i,theme:n,toastsWithIndex:d,isBottom:m,isTopDismissible:c,topToastRef:r,isBottomRef:u,isDismissibleRef:l}};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useToastState = void 0;
+var _react = require("react");
+var _reactNativeReanimated = require("react-native-reanimated");
+var _toastStore = require("./toast-store.js");
+const useToastState = () => {
+  const [visibleToasts, setVisibleToasts] = (0, _react.useState)([]);
+  const [theme, setTheme] = (0, _react.useState)(() => _toastStore.toastStore.getTheme());
+  const topToastRef = (0, _react.useRef)((0, _reactNativeReanimated.makeMutable)(null));
+  const isBottomRef = (0, _react.useRef)((0, _reactNativeReanimated.makeMutable)(theme.position === "bottom"));
+  const isDismissibleRef = (0, _react.useRef)((0, _reactNativeReanimated.makeMutable)(true));
+  const isBottom = theme.position === "bottom";
+  const topToast = visibleToasts.find(t => !t.isExiting);
+  const isTopDismissible = topToast?.options?.dismissible ?? theme.dismissible;
+  (0, _react.useEffect)(() => {
+    const initialToasts = _toastStore.toastStore.getState().visibleToasts;
+    const initialTheme = _toastStore.toastStore.getTheme();
+    setVisibleToasts(initialToasts);
+    const initialTopToast = initialToasts.find(t => !t.isExiting);
+    isBottomRef.current.value = initialTheme.position === "bottom";
+    isDismissibleRef.current.value = initialTopToast?.options?.dismissible ?? initialTheme.dismissible;
+    let pendingToasts = null;
+    let rafId = null;
+    const unsubscribe = _toastStore.toastStore.subscribe(state => {
+      pendingToasts = state.visibleToasts;
+      if (rafId === null) {
+        rafId = requestAnimationFrame(() => {
+          const currentToasts = pendingToasts ?? _toastStore.toastStore.getState().visibleToasts;
+          const currentTheme = _toastStore.toastStore.getTheme();
+          if (pendingToasts) {
+            setVisibleToasts(pendingToasts);
+            pendingToasts = null;
+          }
+          rafId = null;
+          setTheme(prev => prev === currentTheme ? prev : currentTheme);
+          const topToast = currentToasts.find(t => !t.isExiting);
+          isBottomRef.current.value = currentTheme.position === "bottom";
+          isDismissibleRef.current.value = topToast?.options?.dismissible ?? currentTheme.dismissible;
+        });
+      }
+    });
+    return unsubscribe;
+  }, []);
+  const toastsWithIndex = (0, _react.useMemo)(() => {
+    const indices = new Map();
+    let visualIndex = 0;
+    for (const t of visibleToasts) {
+      indices.set(t.id, t.isExiting ? -1 : visualIndex);
+      if (!t.isExiting) visualIndex++;
+    }
+    return [...visibleToasts].reverse().map(t => ({
+      toast: t,
+      index: indices.get(t.id) ?? 0
+    }));
+  }, [visibleToasts]);
+  return {
+    visibleToasts,
+    theme,
+    toastsWithIndex,
+    isBottom,
+    isTopDismissible,
+    topToastRef,
+    isBottomRef,
+    isDismissibleRef
+  };
+};
+exports.useToastState = useToastState;
+//# sourceMappingURL=use-toast-state.js.map

package/lib/module/constants.js

@@ -1 +1,21 @@
-"use strict";import{Easing as t}from"react-native-reanimated";export const ICON_SIZE=28;export const POOL_SIZE=5;export const ENTRY_DURATION=400;export const EXIT_DURATION=350;export const STACK_TRANSITION_DURATION=300;export const SPRING_BACK_DURATION=650;export const ICON_ANIMATION_DURATION=350;export const ENTRY_OFFSET=80;export const EXIT_OFFSET=100;export const SWIPE_EXIT_OFFSET=200;export const MAX_DRAG_CLAMP=180;export const MAX_DRAG_RESISTANCE=60;export const DISMISS_THRESHOLD=40;export const DISMISS_VELOCITY_THRESHOLD=300;export const STACK_OFFSET_PER_ITEM=10;export const STACK_SCALE_PER_ITEM=.05;export const EASING=t.bezier(.25,.1,.25,1);
+"use strict";
+
+import { Easing } from "react-native-reanimated";
+export const ICON_SIZE = 28;
+export const POOL_SIZE = 5;
+export const ENTRY_DURATION = 400;
+export const EXIT_DURATION = 350;
+export const STACK_TRANSITION_DURATION = 300;
+export const SPRING_BACK_DURATION = 650;
+export const ICON_ANIMATION_DURATION = 350;
+export const ENTRY_OFFSET = 80;
+export const EXIT_OFFSET = 100;
+export const SWIPE_EXIT_OFFSET = 200;
+export const MAX_DRAG_CLAMP = 180;
+export const MAX_DRAG_RESISTANCE = 60;
+export const DISMISS_THRESHOLD = 40;
+export const DISMISS_VELOCITY_THRESHOLD = 300;
+export const STACK_OFFSET_PER_ITEM = 10;
+export const STACK_SCALE_PER_ITEM = 0.05;
+export const EASING = Easing.bezier(0.25, 0.1, 0.25, 1.0);
+//# sourceMappingURL=constants.js.map

package/lib/module/icons/CloseIcon.js

@@ -1 +1,16 @@
-"use strict";import i,{Path as t}from"react-native-svg";import{jsx as e}from"react/jsx-runtime";export const CloseIcon=o=>e(i,{viewBox:"0 0 24 24",width:24,height:24,fill:"none",...o,children:e(t,{fill:o.fill??"#8993A4",d:"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41Z"})});
+"use strict";
+
+import Svg, { Path } from "react-native-svg";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const CloseIcon = props => /*#__PURE__*/_jsx(Svg, {
+  viewBox: "0 0 24 24",
+  width: 24,
+  height: 24,
+  fill: "none",
+  ...props,
+  children: /*#__PURE__*/_jsx(Path, {
+    fill: props.fill ?? "#8993A4",
+    d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41Z"
+  })
+});
+//# sourceMappingURL=CloseIcon.js.map

package/lib/module/icons/GreenCheck.js

@@ -1 +1,21 @@
-"use strict";import e,{Path as l}from"react-native-svg";import{jsx as i,jsxs as t}from"react/jsx-runtime";export const GreenCheck=a=>t(e,{viewBox:"0 0 30 31",width:30,height:31,fill:"none",...a,children:[i(l,{fill:a.fill??"#28B770",fillRule:"evenodd",d:"m19.866 13.152-5.772 5.773a.933.933 0 0 1-1.326 0L9.88 16.039a.938.938 0 0 1 1.325-1.327l2.225 2.224 5.109-5.11a.938.938 0 1 1 1.326 1.326Zm.28-9.652H9.602C5.654 3.5 3 6.276 3 10.409v9.935c0 4.131 2.654 6.906 6.602 6.906h10.543c3.95 0 6.605-2.775 6.605-6.906v-9.935c0-4.133-2.654-6.909-6.604-6.909Z",clipRule:"evenodd"}),i(l,{fill:"#fff",d:"m19.866 13.152-5.772 5.773a.933.933 0 0 1-1.326 0L9.88 16.039a.938.938 0 0 1 1.325-1.327l2.225 2.224 5.109-5.11a.938.938 0 1 1 1.326 1.326Z"})]});
+"use strict";
+
+import Svg, { Path } from "react-native-svg";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const GreenCheck = props => /*#__PURE__*/_jsxs(Svg, {
+  viewBox: "0 0 30 31",
+  width: 30,
+  height: 31,
+  fill: "none",
+  ...props,
+  children: [/*#__PURE__*/_jsx(Path, {
+    fill: props.fill ?? "#28B770",
+    fillRule: "evenodd",
+    d: "m19.866 13.152-5.772 5.773a.933.933 0 0 1-1.326 0L9.88 16.039a.938.938 0 0 1 1.325-1.327l2.225 2.224 5.109-5.11a.938.938 0 1 1 1.326 1.326Zm.28-9.652H9.602C5.654 3.5 3 6.276 3 10.409v9.935c0 4.131 2.654 6.906 6.602 6.906h10.543c3.95 0 6.605-2.775 6.605-6.906v-9.935c0-4.133-2.654-6.909-6.604-6.909Z",
+    clipRule: "evenodd"
+  }), /*#__PURE__*/_jsx(Path, {
+    fill: "#fff",
+    d: "m19.866 13.152-5.772 5.773a.933.933 0 0 1-1.326 0L9.88 16.039a.938.938 0 0 1 1.325-1.327l2.225 2.224 5.109-5.11a.938.938 0 1 1 1.326 1.326Z"
+  })]
+});
+//# sourceMappingURL=GreenCheck.js.map

package/lib/module/icons/InfoIcon.js

@@ -1 +1,18 @@
-"use strict";import e,{Path as i}from"react-native-svg";import{jsx as l}from"react/jsx-runtime";export const InfoIcon=o=>l(e,{viewBox:"0 0 24 24",width:24,height:24,fill:"none",...o,children:l(i,{fill:o.fill??"#EDBE43",fillRule:"evenodd",d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm1 15h-2v-6h2v6Zm0-8h-2V7h2v2Z",clipRule:"evenodd"})});
+"use strict";
+
+import Svg, { Path } from "react-native-svg";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const InfoIcon = props => /*#__PURE__*/_jsx(Svg, {
+  viewBox: "0 0 24 24",
+  width: 24,
+  height: 24,
+  fill: "none",
+  ...props,
+  children: /*#__PURE__*/_jsx(Path, {
+    fill: props.fill ?? "#EDBE43",
+    fillRule: "evenodd",
+    d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm1 15h-2v-6h2v6Zm0-8h-2V7h2v2Z",
+    clipRule: "evenodd"
+  })
+});
+//# sourceMappingURL=InfoIcon.js.map

package/lib/module/icons/RedX.js

@@ -1 +1,21 @@
-"use strict";import l,{Path as e}from"react-native-svg";import{jsx as i,jsxs as a}from"react/jsx-runtime";export const RedX=t=>a(l,{viewBox:"0 0 24 24",width:24,height:24,fill:"none",...t,children:[i(e,{fill:t.fill??"#F05964",fillRule:"evenodd",d:"M15.58 15.572a.935.935 0 0 1-1.326 0l-2.258-2.258-2.251 2.252a.938.938 0 0 1-1.326-1.325l2.251-2.252-2.252-2.254A.936.936 0 1 1 9.742 8.41l2.253 2.252 2.252-2.25a.939.939 0 0 1 1.325 1.325l-2.25 2.252 2.257 2.257a.938.938 0 0 1 0 1.326ZM17.271.126H6.727C2.777.125.125 2.9.125 7.032v9.936c0 4.13 2.652 6.907 6.603 6.907H17.27c3.95 0 6.605-2.776 6.605-6.907V7.032c0-4.132-2.654-6.907-6.604-6.907Z",clipRule:"evenodd"}),i(e,{fill:"#fff",d:"M15.58 15.572a.935.935 0 0 1-1.326 0l-2.258-2.258-2.251 2.252a.938.938 0 0 1-1.326-1.325l2.251-2.252-2.252-2.254A.936.936 0 1 1 9.742 8.41l2.253 2.252 2.252-2.25a.939.939 0 0 1 1.325 1.325l-2.25 2.252 2.257 2.257a.938.938 0 0 1 0 1.326Z"})]});
+"use strict";
+
+import Svg, { Path } from "react-native-svg";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const RedX = props => /*#__PURE__*/_jsxs(Svg, {
+  viewBox: "0 0 24 24",
+  width: 24,
+  height: 24,
+  fill: "none",
+  ...props,
+  children: [/*#__PURE__*/_jsx(Path, {
+    fill: props.fill ?? "#F05964",
+    fillRule: "evenodd",
+    d: "M15.58 15.572a.935.935 0 0 1-1.326 0l-2.258-2.258-2.251 2.252a.938.938 0 0 1-1.326-1.325l2.251-2.252-2.252-2.254A.936.936 0 1 1 9.742 8.41l2.253 2.252 2.252-2.25a.939.939 0 0 1 1.325 1.325l-2.25 2.252 2.257 2.257a.938.938 0 0 1 0 1.326ZM17.271.126H6.727C2.777.125.125 2.9.125 7.032v9.936c0 4.13 2.652 6.907 6.603 6.907H17.27c3.95 0 6.605-2.776 6.605-6.907V7.032c0-4.132-2.654-6.907-6.604-6.907Z",
+    clipRule: "evenodd"
+  }), /*#__PURE__*/_jsx(Path, {
+    fill: "#fff",
+    d: "M15.58 15.572a.935.935 0 0 1-1.326 0l-2.258-2.258-2.251 2.252a.938.938 0 0 1-1.326-1.325l2.251-2.252-2.252-2.254A.936.936 0 1 1 9.742 8.41l2.253 2.252 2.252-2.25a.939.939 0 0 1 1.325 1.325l-2.25 2.252 2.257 2.257a.938.938 0 0 1 0 1.326Z"
+  })]
+});
+//# sourceMappingURL=RedX.js.map

package/lib/module/icons/index.js

@@ -1 +1,7 @@
-"use strict";export{CloseIcon}from"./CloseIcon.js";export{GreenCheck}from"./GreenCheck.js";export{InfoIcon}from"./InfoIcon.js";export{RedX}from"./RedX.js";
+"use strict";
+
+export { CloseIcon } from "./CloseIcon.js";
+export { GreenCheck } from "./GreenCheck.js";
+export { InfoIcon } from "./InfoIcon.js";
+export { RedX } from "./RedX.js";
+//# sourceMappingURL=index.js.map

package/lib/module/index.js

@@ -1 +1,14 @@
-"use strict";export{CloseIcon,GreenCheck,InfoIcon,RedX}from"./icons/index.js";export{ToastContainer}from"./toast.js";export{toast}from"./toast-api.js";export{BreadLoaf}from"./toast-provider.js";export{toastStore}from"./toast-store.js";
+"use strict";
+
+// Main exports
+
+// Icons (for customization)
+export { CloseIcon, GreenCheck, InfoIcon, RedX } from "./icons/index.js";
+export { ToastContainer } from "./toast.js";
+export { toast } from "./toast-api.js";
+export { BreadLoaf, ToastPortal } from "./toast-provider.js";
+
+// Store (for advanced usage)
+export { toastStore } from "./toast-store.js";
+// Types
+//# sourceMappingURL=index.js.map

package/lib/module/pool.js

@@ -1 +1,47 @@
-"use strict";import{makeMutable as t}from"react-native-reanimated";import{POOL_SIZE as e}from"./constants.js";export const animationPool=Array.from({length:e},()=>({progress:t(0),translationY:t(0),stackIndex:t(0)}));export const slotTrackers=Array.from({length:e},()=>({wasExiting:!1,prevIndex:0,initialized:!1}));const r=new Map,s=new Set;export const getSlotIndex=t=>{if(r.has(t))return r.get(t)??0;for(let o=0;o<e;o++)if(!s.has(o))return r.set(t,o),s.add(o),slotTrackers[o].initialized=!1,slotTrackers[o].wasExiting=!1,slotTrackers[o].prevIndex=0,o;return 0};export const releaseSlot=t=>{const e=r.get(t);void 0!==e&&(s.delete(e),r.delete(t),slotTrackers[e].initialized=!1,slotTrackers[e].wasExiting=!1,slotTrackers[e].prevIndex=0)};
+"use strict";
+
+import { makeMutable } from "react-native-reanimated";
+import { POOL_SIZE } from "./constants.js";
+export const animationPool = Array.from({
+  length: POOL_SIZE
+}, () => ({
+  progress: makeMutable(0),
+  translationY: makeMutable(0),
+  stackIndex: makeMutable(0)
+}));
+export const slotTrackers = Array.from({
+  length: POOL_SIZE
+}, () => ({
+  wasExiting: false,
+  prevIndex: 0,
+  initialized: false
+}));
+const slotAssignments = new Map();
+const usedSlots = new Set();
+export const getSlotIndex = toastId => {
+  if (slotAssignments.has(toastId)) {
+    return slotAssignments.get(toastId) ?? 0;
+  }
+  for (let i = 0; i < POOL_SIZE; i++) {
+    if (!usedSlots.has(i)) {
+      slotAssignments.set(toastId, i);
+      usedSlots.add(i);
+      slotTrackers[i].initialized = false;
+      slotTrackers[i].wasExiting = false;
+      slotTrackers[i].prevIndex = 0;
+      return i;
+    }
+  }
+  return 0;
+};
+export const releaseSlot = toastId => {
+  const idx = slotAssignments.get(toastId);
+  if (idx !== undefined) {
+    usedSlots.delete(idx);
+    slotAssignments.delete(toastId);
+    slotTrackers[idx].initialized = false;
+    slotTrackers[idx].wasExiting = false;
+    slotTrackers[idx].prevIndex = 0;
+  }
+};
+//# sourceMappingURL=pool.js.map