react-native-toast-message 2.0.0-beta.1 → 2.0.2

package/CHANGELOG.md

@@ -9,6 +9,96 @@ Headers are one of:
 
 - `Added`, `Changed`, `Removed`, `Fixed` or `Breaking`.
 
+## [2.0.2]
+
+### Fixed
+
+- Fast swipe up re-creates the toast [#280](https://github.com/calintamas/react-native-toast-message/issues/280)
+
+## [2.0.1]
+
+### Fixed
+
+- `ansi-regex` vulnerability by upgrading to `@testing-library/jest-native v4.0.4` ([#277](https://github.com/calintamas/react-native-toast-message/pull/277))
+
+## [2.0.0]
+
+### Breaking
+
+- Setting the `ref` is no longer required when rendering the `Toast` component in your app's entry point. Ref storage is now handled internally using [React.createRef](https://reactjs.org/docs/react-api.html#reactcreateref). This should improve ref access reliability at runtime.
+
+  ```js
+    // App.jsx
+    import Toast from 'react-native-toast-message';
+
+    export function App(props) {
+      return (
+        <>
+          {/* ... */}
+          <Toast />
+        </>
+      );
+    }
+  ```
+
+- When you want to have the Toast visible inside a Modal, you no longer need to set a separate `ref`.
+
+  Simply render the `Toast` component inside the Modal, as well as in your app's entry point. When the Modal is visible, the `ref` from inside the Modal will be automatically used.
+
+- `onHide` callback is now always called when the Toast hides (does not matter if `autoHide` was `true` / `false`).
+
+- `inProgress` state has been removed and can no longer be relied upon in a custom Toast config.
+
+- `style` and `height` props from the Toast component were removed; with the purpose of achieving a cleaner API design. The only way to change the style / layout of different Toast types is through the `config` prop (fixes [#204](https://github.com/calintamas/react-native-toast-message/issues/204)).
+
+### Added
+
+- on the `BaseToast` component, the following props were added: `touchableContainerProps`, `contentContainerProps`, `text1Props`, `text2Props` , `text1NumberOfLines`, `text2NumberOfLines` (fixes [#112](https://github.com/calintamas/react-native-toast-message/issues/112), [#133](https://github.com/calintamas/react-native-toast-message/issues/133)).
+
+- on the `Toast` component, the following callbacks were added as props: `onShow` , `onHide` and `onPress` (fixes [#143](https://github.com/calintamas/react-native-toast-message/issues/143)).
+
+- A new `ToastShowParams` type is exported (fixes [#192](https://github.com/calintamas/react-native-toast-message/issues/192)).
+
+### Changed
+
+- `topOffset` and `bottomOffset` are now by default `40px`
+- New test ids on `BaseToast` component: `toastTouchableContainer`, `toastContentContainer`, `toastText1` and `toastText2`.
+
+### Removed
+
+- Success, error and info leading icons were removed from the package (to make it as lightweight as possible).
+
+  It's now possible to pass them via render functions (for more flexibility, see issues regarding svg support, using components as icons, etc) on `BaseToast` component, example below:
+
+  ```js
+  const toastConfig = {
+    success: (props) => (
+      <BaseToast
+        {...props}
+        renderLeadingIcon={() => <Image />}
+        renderTrailingIcon={() => <Image />}
+      />
+    )
+  }
+  ```
+
+  Fixes [#188](https://github.com/calintamas/react-native-toast-message/issues/188), [#203](https://github.com/calintamas/react-native-toast-message/issues/203), [#245](https://github.com/calintamas/react-native-toast-message/issues/245), [#250](https://github.com/calintamas/react-native-toast-message/issues/250).
+
+- Trailing close icon has been removed from default components `BaseToast`, `SuccessToast`, `ErrorToast` and `InfoToast`. Fixes [#167](https://github.com/calintamas/react-native-toast-message/issues/167).
+
+### Fixed
+
+- Failed prop type: Invalid props.text2Style key fontSize supplied to BaseToast [#174](https://github.com/calintamas/react-native-toast-message/issues/174).
+- Changing Font Family does not work [#176](https://github.com/calintamas/react-native-toast-message/issues/176)
+- Text1 not showing on Android [#194](https://github.com/calintamas/react-native-toast-message/issues/194)
+- Toast background is Transparent [#219](https://github.com/calintamas/react-native-toast-message/issues/219)
+- TypeError: Cannot read property 'show' of null [#232](https://github.com/calintamas/react-native-toast-message/issues/232)
+- textStyle1 styles not been applied [#233](https://github.com/calintamas/react-native-toast-message/issues/233)
+- Typescript-class component toast message in modal usage [#172](https://github.com/calintamas/react-native-toast-message/issues/172)
+- Getting last toast along with native prompt [#149](https://github.com/calintamas/react-native-toast-message/issues/149)
+- When modal request permission appear then the modal toast on the previous screen also appears -> android [#226](https://github.com/calintamas/react-native-toast-message/issues/226)
+- autoHide: false crashes on android [#256](https://github.com/calintamas/react-native-toast-message/issues/256)
+
 ## [1.6.0]
 
 ### Added

package/README.md

@@ -3,7 +3,7 @@
 [![npm version](https://img.shields.io/npm/v/react-native-toast-message)](https://www.npmjs.com/package/react-native-toast-message)
 [![npm downloads](https://img.shields.io/npm/dw/react-native-toast-message)](https://www.npmjs.com/package/react-native-toast-message)
 [![Build](https://github.com/calintamas/react-native-toast-message/workflows/tests/badge.svg)](https://github.com/calintamas/react-native-toast-message/actions?query=workflow%3Atests)
-[![Coverage Status](https://coveralls.io/repos/github/calintamas/react-native-toast-message/badge.svg)](https://coveralls.io/github/calintamas/react-native-toast-message)
+[![Coverage Status](https://coveralls.io/repos/github/calintamas/react-native-toast-message/badge.svg?branch=master)](https://coveralls.io/github/calintamas/react-native-toast-message?branch=master)
 [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
 
 Animated toast message component for React Native.
@@ -20,6 +20,8 @@ Animated toast message component for React Native.
 
 ## Documentation
 
+> This is the documentation for `react-native-toast-message@v2`, which has a similar API to v1, but contains a few important changes. [Read the complete changelog](./CHANGELOG.md#200).
+
 - [Quick start](./docs/quick-start.md)
 - [API](./docs/api.md)
 - [Create custom layouts](./docs/custom-layouts.md)

package/lib/src/components/AnimatedContainer.d.ts

@@ -11,6 +11,12 @@ export declare type AnimatedContainerProps = {
     onHide: () => void;
     onRestorePosition?: () => void;
 };
+/**
+ * Produces a positive damping value.
+ *
+ * To note: `moveY` becomes negative when going off-screen. By making sure the value
+ * produced is always positive, we avoid issues like: https://github.com/calintamas/react-native-toast-message/issues/280
+ */
 export declare function dampingFor(gesture: PanResponderGestureState, position: ToastPosition): number;
 export declare function animatedValueFor(gesture: PanResponderGestureState, position: ToastPosition, damping: number): number;
 export declare function AnimatedContainer({ children, isVisible, position, topOffset, bottomOffset, keyboardOffset, onHide, onRestorePosition }: AnimatedContainerProps): JSX.Element;

package/lib/src/components/AnimatedContainer.js

@@ -6,15 +6,21 @@ import { noop } from '../utils/func';
 import { bound } from '../utils/number';
 import { getTestId } from '../utils/test-id';
 import { styles } from './AnimatedContainer.styles';
+/**
+ * Produces a positive damping value.
+ *
+ * To note: `moveY` becomes negative when going off-screen. By making sure the value
+ * produced is always positive, we avoid issues like: https://github.com/calintamas/react-native-toast-message/issues/280
+ */
 export function dampingFor(gesture, position) {
     const { moveY } = gesture;
     switch (position) {
         case 'bottom': {
             const { height: screenHeight } = Dimensions.get('screen');
-            return screenHeight - moveY;
+            return Math.abs(screenHeight - moveY);
         }
         case 'top':
-            return moveY;
+            return Math.abs(moveY);
         default:
             throw new Error(`Toast position: ${position} not implemented`);
     }

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "react-native-toast-message",
-  "version": "2.0.0-beta.1",
+  "version": "2.0.2",
   "description": "Toast message component for React Native",
   "main": "./lib/index.js",
-  "types": "./lib/types/index.d.ts",
+  "types": "./lib/index.d.ts",
   "files": [
     "/lib"
   ],
@@ -27,7 +27,7 @@
   "license": "MIT",
   "devDependencies": {
     "@babel/core": "^7.15.8",
-    "@testing-library/jest-native": "^4.0.2",
+    "@testing-library/jest-native": "^4.0.4",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/react-native": "^8.0.0",
     "@types/jest": "^27.0.1",