Use new hook name in examples

szhsin · Nov 12, 2024 · b0142cd · b0142cd
1 parent 1ed54d9
commit b0142cd
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 9 deletions.
diff --git a/example/src/components/BasicExample.js b/example/src/components/BasicExample.js
@@ -1,10 +1,10 @@
 import { useState } from 'react';
-import useTransition from 'react-transition-state';
+import { useTransitionState } from 'react-transition-state';
 import { CodeSandbox } from './CodeSandbox';
 
 const BasicExample = () => {
   const [unmountOnExit, setUnmountOnExit] = useState(true);
-  const [{ status, isMounted }, toggle] = useTransition({
+  const [{ status, isMounted }, toggle] = useTransitionState({
     timeout: 500,
     initialEntered: true,
     preEnter: true,

diff --git a/example/src/components/StyledExample.js b/example/src/components/StyledExample.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import styled from 'styled-components';
-import { useTransition } from 'react-transition-state';
+import { useTransitionState } from 'react-transition-state';
 import { CodeSandbox } from './CodeSandbox';
 
 const Container = styled.div`
@@ -25,7 +25,7 @@ const Box = styled.div`
 `;
 
 const StyledExample = () => {
-  const [{ status, isMounted }, toggle] = useTransition({
+  const [{ status, isMounted }, toggle] = useTransitionState({
     timeout: 500,
     mountOnEnter: true,
     unmountOnExit: true,

diff --git a/example/src/components/SwitchTransition.js b/example/src/components/SwitchTransition.js
@@ -1,7 +1,7 @@
-import { useTransition } from 'react-transition-state';
+import { useTransitionState } from 'react-transition-state';
 
 // Ideal for creating switch transition for a small number of elements
-// Use `useTransition` hook once for each element in the switch transition
+// Use `useTransitionState` hook once for each element in the switch transition
 export const SwitchTransition = () => {
   const transitionProps = {
     timeout: 300,
@@ -10,11 +10,11 @@ export const SwitchTransition = () => {
     preEnter: true
   };
 
-  const [state1, toggle1] = useTransition({
+  const [state1, toggle1] = useTransitionState({
     ...transitionProps,
     initialEntered: true
   });
-  const [state2, toggle2] = useTransition(transitionProps);
+  const [state2, toggle2] = useTransitionState(transitionProps);
   const toggle = () => {
     toggle1();
     toggle2();

diff --git a/example/src/components/SwitchTransitionMap.js b/example/src/components/SwitchTransitionMap.js
@@ -3,7 +3,7 @@ import { useTransitionMap } from 'react-transition-state';
 
 // Creating switch transitions for a large number of elements,
 // or the number of elements is only known at runtime.
-// `useTransition` doesn't suffice as React hook has the limitation that it cannot be called in a loop
+// `useTransitionState` doesn't suffice as React hook has the limitation that it cannot be called in a loop
 const NUMBER_OF_BUTTONS = 5;
 const buttonArray = new Array(NUMBER_OF_BUTTONS).fill(0).map((_, i) => `Button ${i + 1}`);