react-transition-state 2.1.3 → 2.3.0

package/README.md

@@ -22,7 +22,7 @@ Inspired by the [React Transition Group](https://github.com/reactjs/react-transi
 
 ## State diagram
 
-![state-diagram](https://user-images.githubusercontent.com/41896553/142855447-cb8d8730-f8fb-4296-a3db-d1523b0fa2d9.png) The `initialEntered` and `mountOnEnter` props are omitted from the diagram to keep it less convoluted. [Please read more details at the API section](#usetransition-hook).
+![state-diagram](https://user-images.githubusercontent.com/41896553/142855447-cb8d8730-f8fb-4296-a3db-d1523b0fa2d9.png) The `initialEntered` and `mountOnEnter` props are omitted from the diagram to keep it less convoluted. [Please read more details at the API section](#usetransitionstate-hook).
 
 <br/>
 
@@ -43,11 +43,10 @@ yarn add react-transition-state
 ### CSS example
 
 ```jsx
-import { useTransition } from 'react-transition-state';
-/* or import useTransition from 'react-transition-state'; */
+import { useTransitionState } from 'react-transition-state';
 
 function Example() {
-  const [state, toggle] = useTransition({ timeout: 750, preEnter: true });
+  const [state, toggle] = useTransitionState({ timeout: 750, preEnter: true });
   return (
     <div>
       <button onClick={() => toggle()}>toggle</button>
@@ -83,7 +82,7 @@ export default Example;
 
 ```jsx
 import styled from 'styled-components';
-import { useTransition } from 'react-transition-state';
+import { useTransitionState } from 'react-transition-state';
 
 const Box = styled.div`
   transition: all 500ms;
@@ -97,7 +96,7 @@ const Box = styled.div`
 `;
 
 function StyledExample() {
-  const [{ status, isMounted }, toggle] = useTransition({
+  const [{ status, isMounted }, toggle] = useTransitionState({
     timeout: 500,
     mountOnEnter: true,
     unmountOnExit: true,
@@ -134,7 +133,7 @@ export default StyledExample;
 
 You can create switch transition effects using one of the provided hooks,
 
-- `useTransition` if the number of elements participating in the switch transition is static.
+- `useTransitionState` if the number of elements participating in the switch transition is static.
 - `useTransitionMap` if the number of elements participating in the switch transition is dynamic and only known at runtime.
 
 **[Edit on CodeSandbox](https://codesandbox.io/p/sandbox/react-switch-transition-x87jt8)**
@@ -173,10 +172,10 @@ This [CodeSandbox example](https://codesandbox.io/s/react-transition-state-vs-gr
 
 ## API
 
-### `useTransition` Hook
+### `useTransitionState` Hook
 
 ```typescript
-function useTransition(
+function useTransitionState(
   options?: TransitionOptions
 ): [TransitionState, (toEnter?: boolean) => void, () => void];
 ```
@@ -197,7 +196,7 @@ function useTransition(
 
 #### Return value
 
-The `useTransition` Hook returns a tuple of values in the following order:
+The `useTransitionState` Hook returns a tuple of values in the following order:
 
 1. state:
 
@@ -231,11 +230,11 @@ The `useTransition` Hook returns a tuple of values in the following order:
 
 ### `useTransitionMap` Hook
 
-It's similar to the `useTransition` Hook except that it manages multiple states in a [Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) structure instead of a single state.
+It's similar to the `useTransitionState` Hook except that it manages multiple states in a [Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) structure instead of a single state.
 
 #### Options
 
-It accepts all options as `useTransition` and the following ones:
+It accepts all options as `useTransitionState` and the following ones:
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |

package/dist/cjs/hooks/useTransitionMap.cjs

@@ -0,0 +1,113 @@
+'use strict';
+
+var react = require('react');
+var utils = require('./utils.cjs');
+
+const updateState = (key, status, setStateMap, latestStateMap, timeoutId, onChange) => {
+  clearTimeout(timeoutId);
+  const state = utils.getState(status);
+  const stateMap = new Map(latestStateMap.current);
+  stateMap.set(key, state);
+  setStateMap(stateMap);
+  latestStateMap.current = stateMap;
+  onChange && onChange({
+    key,
+    current: state
+  });
+};
+const useTransitionMap = ({
+  allowMultiple,
+  enter = true,
+  exit = true,
+  preEnter,
+  preExit,
+  timeout,
+  initialEntered,
+  mountOnEnter,
+  unmountOnExit,
+  onStateChange: onChange
+} = {}) => {
+  const [stateMap, setStateMap] = react.useState(new Map());
+  const latestStateMap = react.useRef(stateMap);
+  const configMap = react.useRef(new Map());
+  const [enterTimeout, exitTimeout] = utils.getTimeout(timeout);
+  const setItem = react.useCallback((key, config) => {
+    const {
+      initialEntered: _initialEntered = initialEntered
+    } = config || {};
+    const status = _initialEntered ? utils.ENTERED : utils.startOrEnd(mountOnEnter);
+    updateState(key, status, setStateMap, latestStateMap);
+    configMap.current.set(key, {});
+  }, [initialEntered, mountOnEnter]);
+  const deleteItem = react.useCallback(key => {
+    const newStateMap = new Map(latestStateMap.current);
+    if (newStateMap.delete(key)) {
+      setStateMap(newStateMap);
+      latestStateMap.current = newStateMap;
+      configMap.current.delete(key);
+      return true;
+    }
+    return false;
+  }, []);
+  const endTransition = react.useCallback(key => {
+    const stateObj = latestStateMap.current.get(key);
+    if (!stateObj) {
+      process.env.NODE_ENV !== 'production' && console.error(`[React-Transition-State] invalid key: ${key}`);
+      return;
+    }
+    const {
+      timeoutId
+    } = configMap.current.get(key);
+    const status = utils.getEndStatus(stateObj._s, unmountOnExit);
+    status && updateState(key, status, setStateMap, latestStateMap, timeoutId, onChange);
+  }, [onChange, unmountOnExit]);
+  const toggle = react.useCallback((key, toEnter) => {
+    const stateObj = latestStateMap.current.get(key);
+    if (!stateObj) {
+      process.env.NODE_ENV !== 'production' && console.error(`[React-Transition-State] invalid key: ${key}`);
+      return;
+    }
+    const config = configMap.current.get(key);
+    const transitState = status => {
+      updateState(key, status, setStateMap, latestStateMap, config.timeoutId, onChange);
+      switch (status) {
+        case utils.ENTERING:
+          if (enterTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), enterTimeout);
+          break;
+        case utils.EXITING:
+          if (exitTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), exitTimeout);
+          break;
+        case utils.PRE_ENTER:
+        case utils.PRE_EXIT:
+          config.timeoutId = utils.nextTick(transitState, status);
+          break;
+      }
+    };
+    const enterStage = stateObj.isEnter;
+    if (typeof toEnter !== 'boolean') toEnter = !enterStage;
+    if (toEnter) {
+      if (!enterStage) {
+        transitState(enter ? preEnter ? utils.PRE_ENTER : utils.ENTERING : utils.ENTERED);
+        !allowMultiple && latestStateMap.current.forEach((_, _key) => _key !== key && toggle(_key, false));
+      }
+    } else {
+      if (enterStage) {
+        transitState(exit ? preExit ? utils.PRE_EXIT : utils.EXITING : utils.startOrEnd(unmountOnExit));
+      }
+    }
+  }, [onChange, endTransition, allowMultiple, enter, exit, preEnter, preExit, enterTimeout, exitTimeout, unmountOnExit]);
+  const toggleAll = react.useCallback(toEnter => {
+    if (!allowMultiple && toEnter !== false) return;
+    for (const key of latestStateMap.current.keys()) toggle(key, toEnter);
+  }, [allowMultiple, toggle]);
+  return {
+    stateMap,
+    toggle,
+    toggleAll,
+    endTransition,
+    setItem,
+    deleteItem
+  };
+};
+
+exports.useTransitionMap = useTransitionMap;

package/dist/cjs/hooks/useTransitionState.cjs

@@ -0,0 +1,62 @@
+'use strict';
+
+var react = require('react');
+var utils = require('./utils.cjs');
+
+const updateState = (status, setState, latestState, timeoutId, onChange) => {
+  clearTimeout(timeoutId.current);
+  const state = utils.getState(status);
+  setState(state);
+  latestState.current = state;
+  onChange && onChange({
+    current: state
+  });
+};
+const useTransitionState = ({
+  enter = true,
+  exit = true,
+  preEnter,
+  preExit,
+  timeout,
+  initialEntered,
+  mountOnEnter,
+  unmountOnExit,
+  onStateChange: onChange
+} = {}) => {
+  const [state, setState] = react.useState(() => utils.getState(initialEntered ? utils.ENTERED : utils.startOrEnd(mountOnEnter)));
+  const latestState = react.useRef(state);
+  const timeoutId = react.useRef();
+  const [enterTimeout, exitTimeout] = utils.getTimeout(timeout);
+  const endTransition = react.useCallback(() => {
+    const status = utils.getEndStatus(latestState.current._s, unmountOnExit);
+    status && updateState(status, setState, latestState, timeoutId, onChange);
+  }, [onChange, unmountOnExit]);
+  const toggle = react.useCallback(toEnter => {
+    const transitState = status => {
+      updateState(status, setState, latestState, timeoutId, onChange);
+      switch (status) {
+        case utils.ENTERING:
+          if (enterTimeout >= 0) timeoutId.current = setTimeout(endTransition, enterTimeout);
+          break;
+        case utils.EXITING:
+          if (exitTimeout >= 0) timeoutId.current = setTimeout(endTransition, exitTimeout);
+          break;
+        case utils.PRE_ENTER:
+        case utils.PRE_EXIT:
+          timeoutId.current = utils.nextTick(transitState, status);
+          break;
+      }
+    };
+    const enterStage = latestState.current.isEnter;
+    if (typeof toEnter !== 'boolean') toEnter = !enterStage;
+    if (toEnter) {
+      !enterStage && transitState(enter ? preEnter ? utils.PRE_ENTER : utils.ENTERING : utils.ENTERED);
+    } else {
+      enterStage && transitState(exit ? preExit ? utils.PRE_EXIT : utils.EXITING : utils.startOrEnd(unmountOnExit));
+    }
+  }, [endTransition, onChange, enter, exit, preEnter, preExit, enterTimeout, exitTimeout, unmountOnExit]);
+  react.useEffect(() => () => clearTimeout(timeoutId.current), []);
+  return [state, toggle, endTransition];
+};
+
+exports.useTransitionState = useTransitionState;

package/dist/cjs/hooks/utils.cjs

@@ -0,0 +1,47 @@
+'use strict';
+
+const PRE_ENTER = 0;
+const ENTERING = 1;
+const ENTERED = 2;
+const PRE_EXIT = 3;
+const EXITING = 4;
+const EXITED = 5;
+const UNMOUNTED = 6;
+const STATUS = ['preEnter', 'entering', 'entered', 'preExit', 'exiting', 'exited', 'unmounted'];
+const getState = status => ({
+  _s: status,
+  status: STATUS[status],
+  isEnter: status < PRE_EXIT,
+  isMounted: status !== UNMOUNTED,
+  isResolved: status === ENTERED || status > EXITING
+});
+const startOrEnd = unmounted => unmounted ? UNMOUNTED : EXITED;
+const getEndStatus = (status, unmountOnExit) => {
+  switch (status) {
+    case ENTERING:
+    case PRE_ENTER:
+      return ENTERED;
+    case EXITING:
+    case PRE_EXIT:
+      return startOrEnd(unmountOnExit);
+  }
+};
+const getTimeout = timeout => typeof timeout === 'object' ? [timeout.enter, timeout.exit] : [timeout, timeout];
+const nextTick = (transitState, status) => setTimeout(() => {
+  // Reading document.body.offsetTop can force browser to repaint before transition to the next state
+  isNaN(document.body.offsetTop) || transitState(status + 1);
+}, 0);
+
+exports.ENTERED = ENTERED;
+exports.ENTERING = ENTERING;
+exports.EXITED = EXITED;
+exports.EXITING = EXITING;
+exports.PRE_ENTER = PRE_ENTER;
+exports.PRE_EXIT = PRE_EXIT;
+exports.STATUS = STATUS;
+exports.UNMOUNTED = UNMOUNTED;
+exports.getEndStatus = getEndStatus;
+exports.getState = getState;
+exports.getTimeout = getTimeout;
+exports.nextTick = nextTick;
+exports.startOrEnd = startOrEnd;

package/dist/cjs/index.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var useTransitionState = require('./hooks/useTransitionState.cjs');
+var useTransitionMap = require('./hooks/useTransitionMap.cjs');
+
+
+
+exports.default = useTransitionState.useTransitionState;
+exports.useTransition = useTransitionState.useTransitionState;
+exports.useTransitionState = useTransitionState.useTransitionState;
+exports.useTransitionMap = useTransitionMap.useTransitionMap;

package/dist/{es/hooks/useTransitionMap.js → esm/hooks/useTransitionMap.mjs}

@@ -1,5 +1,5 @@
 import { useState, useRef, useCallback } from 'react';
-import { getTimeout, getEndStatus, PRE_EXIT, nextTick, PRE_ENTER, EXITING, ENTERING, ENTERED, startOrEnd, getState } from './utils.js';
+import { getTimeout, getEndStatus, PRE_EXIT, nextTick, PRE_ENTER, EXITING, ENTERING, ENTERED, startOrEnd, getState } from './utils.mjs';
 
 const updateState = (key, status, setStateMap, latestStateMap, timeoutId, onChange) => {
   clearTimeout(timeoutId);

package/dist/{es/hooks/useTransition.js → esm/hooks/useTransitionState.mjs}

@@ -1,5 +1,5 @@
 import { useState, useRef, useCallback, useEffect } from 'react';
-import { getState, ENTERED, startOrEnd, getTimeout, getEndStatus, PRE_EXIT, nextTick, PRE_ENTER, EXITING, ENTERING } from './utils.js';
+import { getState, ENTERED, startOrEnd, getTimeout, getEndStatus, PRE_EXIT, nextTick, PRE_ENTER, EXITING, ENTERING } from './utils.mjs';
 
 const updateState = (status, setState, latestState, timeoutId, onChange) => {
   clearTimeout(timeoutId.current);
@@ -10,7 +10,7 @@ const updateState = (status, setState, latestState, timeoutId, onChange) => {
     current: state
   });
 };
-const useTransition = ({
+const useTransitionState = ({
   enter = true,
   exit = true,
   preEnter,
@@ -57,4 +57,4 @@ const useTransition = ({
   return [state, toggle, endTransition];
 };
 
-export { useTransition };
+export { useTransitionState };

package/dist/esm/index.mjs

@@ -0,0 +1,2 @@
+export { useTransitionState as default, useTransitionState as useTransition, useTransitionState } from './hooks/useTransitionState.mjs';
+export { useTransitionMap } from './hooks/useTransitionMap.mjs';

package/package.json

@@ -1,14 +1,17 @@
 {
   "name": "react-transition-state",
-  "version": "2.1.3",
+  "version": "2.3.0",
   "description": "Zero dependency React transition state machine.",
   "author": "Zheng Song",
   "license": "MIT",
-  "repository": "szhsin/react-transition-state",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/szhsin/react-transition-state.git"
+  },
   "homepage": "https://szhsin.github.io/react-transition-state/",
-  "main": "dist/cjs/index.js",
-  "module": "dist/es/index.js",
-  "types": "types/index.d.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./types/index.d.ts",
   "sideEffects": false,
   "files": [
     "dist/",
@@ -35,37 +38,44 @@
     "pret:fix": "prettier -w .",
     "build": "run-s pret clean lint types bundle"
   },
+  "exports": {
+    ".": {
+      "types": "./types/index.d.ts",
+      "require": "./dist/cjs/index.cjs",
+      "default": "./dist/esm/index.mjs"
+    },
+    "./package.json": "./package.json"
+  },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.25.7",
-    "@babel/preset-env": "^7.25.4",
-    "@eslint/compat": "^1.1.1",
+    "@babel/core": "^7.26.7",
+    "@babel/preset-env": "^7.26.7",
     "@rollup/plugin-babel": "^6.0.4",
-    "@testing-library/react": "^16.0.1",
-    "@types/jest": "^29.5.13",
+    "@testing-library/react": "^16.2.0",
+    "@types/jest": "^29.5.14",
     "babel-plugin-pure-annotations": "^0.1.2",
-    "eslint": "^9.9.1",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-jest": "^28.8.3",
-    "eslint-plugin-react": "^7.37.1",
-    "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-hooks-addons": "^0.3.1",
-    "globals": "^15.10.0",
+    "eslint": "^9.19.0",
+    "eslint-config-prettier": "^10.0.1",
+    "eslint-plugin-jest": "^28.11.0",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-react-hooks-addons": "^0.4.1",
+    "globals": "^15.14.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.3.3",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "rollup": "^4.24.0",
-    "typescript": "^5.6.2"
+    "prettier": "^3.4.2",
+    "react": "^19",
+    "react-dom": "^19",
+    "rollup": "^4.32.1",
+    "typescript": "^5.7.3"
   },
   "overrides": {
-    "eslint-plugin-react-hooks": {
-      "eslint": "$eslint"
+    "whatwg-url@11.0.0": {
+      "tr46": "^4"
     }
   }
 }

package/types/index.d.ts

@@ -46,8 +46,18 @@ export interface TransitionMapResult<K> {
   deleteItem: (key: K) => boolean;
 }
 
-export const useTransition: (options?: TransitionOptions) => TransitionResult;
+export const useTransitionState: (options?: TransitionOptions) => TransitionResult;
 
 export const useTransitionMap: <K>(options?: TransitionMapOptions<K>) => TransitionMapResult<K>;
 
-export default useTransition;
+export {
+  /**
+   * @deprecated The `useTransition` alias will be removed in v3.0.0. Use `useTransitionState` instead.
+   */
+  useTransitionState as useTransition
+};
+
+/**
+ * @deprecated The default export will be removed in v3.0.0. Use the named export `useTransitionState` instead.
+ */
+export default useTransitionState;

package/dist/cjs/index.js

@@ -1,204 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('react');
-
-const PRE_ENTER = 0;
-const ENTERING = 1;
-const ENTERED = 2;
-const PRE_EXIT = 3;
-const EXITING = 4;
-const EXITED = 5;
-const UNMOUNTED = 6;
-const STATUS = ['preEnter', 'entering', 'entered', 'preExit', 'exiting', 'exited', 'unmounted'];
-const getState = status => ({
-  _s: status,
-  status: STATUS[status],
-  isEnter: status < PRE_EXIT,
-  isMounted: status !== UNMOUNTED,
-  isResolved: status === ENTERED || status > EXITING
-});
-const startOrEnd = unmounted => unmounted ? UNMOUNTED : EXITED;
-const getEndStatus = (status, unmountOnExit) => {
-  switch (status) {
-    case ENTERING:
-    case PRE_ENTER:
-      return ENTERED;
-    case EXITING:
-    case PRE_EXIT:
-      return startOrEnd(unmountOnExit);
-  }
-};
-const getTimeout = timeout => typeof timeout === 'object' ? [timeout.enter, timeout.exit] : [timeout, timeout];
-const nextTick = (transitState, status) => setTimeout(() => {
-  // Reading document.body.offsetTop can force browser to repaint before transition to the next state
-  isNaN(document.body.offsetTop) || transitState(status + 1);
-}, 0);
-
-const updateState$1 = (status, setState, latestState, timeoutId, onChange) => {
-  clearTimeout(timeoutId.current);
-  const state = getState(status);
-  setState(state);
-  latestState.current = state;
-  onChange && onChange({
-    current: state
-  });
-};
-const useTransition = ({
-  enter = true,
-  exit = true,
-  preEnter,
-  preExit,
-  timeout,
-  initialEntered,
-  mountOnEnter,
-  unmountOnExit,
-  onStateChange: onChange
-} = {}) => {
-  const [state, setState] = react.useState(() => getState(initialEntered ? ENTERED : startOrEnd(mountOnEnter)));
-  const latestState = react.useRef(state);
-  const timeoutId = react.useRef();
-  const [enterTimeout, exitTimeout] = getTimeout(timeout);
-  const endTransition = react.useCallback(() => {
-    const status = getEndStatus(latestState.current._s, unmountOnExit);
-    status && updateState$1(status, setState, latestState, timeoutId, onChange);
-  }, [onChange, unmountOnExit]);
-  const toggle = react.useCallback(toEnter => {
-    const transitState = status => {
-      updateState$1(status, setState, latestState, timeoutId, onChange);
-      switch (status) {
-        case ENTERING:
-          if (enterTimeout >= 0) timeoutId.current = setTimeout(endTransition, enterTimeout);
-          break;
-        case EXITING:
-          if (exitTimeout >= 0) timeoutId.current = setTimeout(endTransition, exitTimeout);
-          break;
-        case PRE_ENTER:
-        case PRE_EXIT:
-          timeoutId.current = nextTick(transitState, status);
-          break;
-      }
-    };
-    const enterStage = latestState.current.isEnter;
-    if (typeof toEnter !== 'boolean') toEnter = !enterStage;
-    if (toEnter) {
-      !enterStage && transitState(enter ? preEnter ? PRE_ENTER : ENTERING : ENTERED);
-    } else {
-      enterStage && transitState(exit ? preExit ? PRE_EXIT : EXITING : startOrEnd(unmountOnExit));
-    }
-  }, [endTransition, onChange, enter, exit, preEnter, preExit, enterTimeout, exitTimeout, unmountOnExit]);
-  react.useEffect(() => () => clearTimeout(timeoutId.current), []);
-  return [state, toggle, endTransition];
-};
-
-const updateState = (key, status, setStateMap, latestStateMap, timeoutId, onChange) => {
-  clearTimeout(timeoutId);
-  const state = getState(status);
-  const stateMap = new Map(latestStateMap.current);
-  stateMap.set(key, state);
-  setStateMap(stateMap);
-  latestStateMap.current = stateMap;
-  onChange && onChange({
-    key,
-    current: state
-  });
-};
-const useTransitionMap = ({
-  allowMultiple,
-  enter = true,
-  exit = true,
-  preEnter,
-  preExit,
-  timeout,
-  initialEntered,
-  mountOnEnter,
-  unmountOnExit,
-  onStateChange: onChange
-} = {}) => {
-  const [stateMap, setStateMap] = react.useState(new Map());
-  const latestStateMap = react.useRef(stateMap);
-  const configMap = react.useRef(new Map());
-  const [enterTimeout, exitTimeout] = getTimeout(timeout);
-  const setItem = react.useCallback((key, config) => {
-    const {
-      initialEntered: _initialEntered = initialEntered
-    } = config || {};
-    const status = _initialEntered ? ENTERED : startOrEnd(mountOnEnter);
-    updateState(key, status, setStateMap, latestStateMap);
-    configMap.current.set(key, {});
-  }, [initialEntered, mountOnEnter]);
-  const deleteItem = react.useCallback(key => {
-    const newStateMap = new Map(latestStateMap.current);
-    if (newStateMap.delete(key)) {
-      setStateMap(newStateMap);
-      latestStateMap.current = newStateMap;
-      configMap.current.delete(key);
-      return true;
-    }
-    return false;
-  }, []);
-  const endTransition = react.useCallback(key => {
-    const stateObj = latestStateMap.current.get(key);
-    if (!stateObj) {
-      process.env.NODE_ENV !== 'production' && console.error(`[React-Transition-State] invalid key: ${key}`);
-      return;
-    }
-    const {
-      timeoutId
-    } = configMap.current.get(key);
-    const status = getEndStatus(stateObj._s, unmountOnExit);
-    status && updateState(key, status, setStateMap, latestStateMap, timeoutId, onChange);
-  }, [onChange, unmountOnExit]);
-  const toggle = react.useCallback((key, toEnter) => {
-    const stateObj = latestStateMap.current.get(key);
-    if (!stateObj) {
-      process.env.NODE_ENV !== 'production' && console.error(`[React-Transition-State] invalid key: ${key}`);
-      return;
-    }
-    const config = configMap.current.get(key);
-    const transitState = status => {
-      updateState(key, status, setStateMap, latestStateMap, config.timeoutId, onChange);
-      switch (status) {
-        case ENTERING:
-          if (enterTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), enterTimeout);
-          break;
-        case EXITING:
-          if (exitTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), exitTimeout);
-          break;
-        case PRE_ENTER:
-        case PRE_EXIT:
-          config.timeoutId = nextTick(transitState, status);
-          break;
-      }
-    };
-    const enterStage = stateObj.isEnter;
-    if (typeof toEnter !== 'boolean') toEnter = !enterStage;
-    if (toEnter) {
-      if (!enterStage) {
-        transitState(enter ? preEnter ? PRE_ENTER : ENTERING : ENTERED);
-        !allowMultiple && latestStateMap.current.forEach((_, _key) => _key !== key && toggle(_key, false));
-      }
-    } else {
-      if (enterStage) {
-        transitState(exit ? preExit ? PRE_EXIT : EXITING : startOrEnd(unmountOnExit));
-      }
-    }
-  }, [onChange, endTransition, allowMultiple, enter, exit, preEnter, preExit, enterTimeout, exitTimeout, unmountOnExit]);
-  const toggleAll = react.useCallback(toEnter => {
-    if (!allowMultiple && toEnter !== false) return;
-    for (const key of latestStateMap.current.keys()) toggle(key, toEnter);
-  }, [allowMultiple, toggle]);
-  return {
-    stateMap,
-    toggle,
-    toggleAll,
-    endTransition,
-    setItem,
-    deleteItem
-  };
-};
-
-exports.default = useTransition;
-exports.useTransition = useTransition;
-exports.useTransitionMap = useTransitionMap;

package/dist/es/index.js

@@ -1,2 +0,0 @@
-export { useTransition as default, useTransition } from './hooks/useTransition.js';
-export { useTransitionMap } from './hooks/useTransitionMap.js';