Skip to content

Commit f737829

Browse files
authored
Merge pull request #862 from szhsin/feat/typescript
build: migrate codebase to TypeScript
2 parents 1cd00c9 + 95e1bc6 commit f737829

32 files changed

+571
-260
lines changed

.gitignore

Lines changed: 19 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,27 @@
1-
# Logs
2-
logs
3-
*.log
4-
npm-debug.log*
5-
yarn-debug.log*
6-
yarn-error.log*
7-
lerna-debug.log*
8-
.pnpm-debug.log*
9-
10-
# Directory for instrumented libs generated by jscoverage/JSCover
11-
lib-cov
1+
# dependencies
2+
node_modules/
123

13-
# Coverage directory used by tools like istanbul
14-
coverage
15-
*.lcov
4+
# builds
5+
build/
6+
.next/
7+
_next/
8+
.docusaurus/
169

17-
# node-waf configuration
18-
.lock-wscript
10+
# tests
11+
coverage/
12+
**/__tests__/**/*.d.ts
1913

20-
# production
21-
build
22-
23-
# Dependency directories
24-
node_modules
14+
# logs
15+
logs
16+
*.log
2517

26-
# TypeScript cache
18+
# typescript
2719
*.tsbuildinfo
28-
29-
# Optional npm cache directory
30-
.npm
31-
32-
# Optional eslint cache
33-
.eslintcache
34-
35-
# Output of 'npm pack'
36-
*.tgz
37-
38-
# dotenv environment variables file
39-
.env
40-
.env.test
41-
.env.production
42-
43-
# Stores VSCode versions used for testing VSCode extensions
44-
.vscode-test
20+
next-env.d.ts
4521

4622
# misc
4723
.DS_Store
24+
.npm
25+
.env
26+
.eslintcache
27+
.vercel

.prettierignore

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1-
build
2-
coverage
3-
dist
1+
build/
2+
coverage/
3+
dist/
4+
types/

dist/cjs/index.cjs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
'use client';
44

55
Object.defineProperty(exports, '__esModule', { value: true });
6-
const require_useTransitionState = require('./hooks/useTransitionState.cjs');
7-
const require_useTransitionMap = require('./hooks/useTransitionMap.cjs');
6+
const require_useTransitionState = require('./useTransitionState.cjs');
7+
const require_useTransitionMap = require('./useTransitionMap.cjs');
88

99
exports.default = require_useTransitionState.useTransitionState;
1010
exports.useTransition = require_useTransitionState.useTransitionState;
Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
const require_utils = require('./utils.cjs');
44
let react = require("react");
55

6-
//#region src/hooks/useTransitionMap.js
6+
//#region src/useTransitionMap.ts
77
const updateState = (key, status, setStateMap, latestStateMap, timeoutId, onChange) => {
88
clearTimeout(timeoutId);
99
const state = require_utils.getState(status);
@@ -21,8 +21,8 @@ const useTransitionMap = ({ allowMultiple, enter = true, exit = true, preEnter,
2121
const latestStateMap = (0, react.useRef)(stateMap);
2222
const configMap = (0, react.useRef)(/* @__PURE__ */ new Map());
2323
const [enterTimeout, exitTimeout] = require_utils.getTimeout(timeout);
24-
const setItem = (0, react.useCallback)((key, config) => {
25-
const { initialEntered: _initialEntered = initialEntered } = config || {};
24+
const setItem = (0, react.useCallback)((key, options) => {
25+
const { initialEntered: _initialEntered = initialEntered } = options || {};
2626
updateState(key, _initialEntered ? require_utils.ENTERED : require_utils.startOrEnd(mountOnEnter), setStateMap, latestStateMap);
2727
configMap.current.set(key, {});
2828
}, [initialEntered, mountOnEnter]);
@@ -39,7 +39,7 @@ const useTransitionMap = ({ allowMultiple, enter = true, exit = true, preEnter,
3939
const endTransition = (0, react.useCallback)((key) => {
4040
const stateObj = latestStateMap.current.get(key);
4141
if (!stateObj) {
42-
process.env.NODE_ENV !== "production" && console.error(`[React-Transition-State] invalid key: ${key}`);
42+
if (process.env.NODE_ENV !== "production") console.error(`[React-Transition-State] cannot call endTransition: invalid key ${key}`);
4343
return;
4444
}
4545
const { timeoutId } = configMap.current.get(key);
@@ -49,18 +49,18 @@ const useTransitionMap = ({ allowMultiple, enter = true, exit = true, preEnter,
4949
const toggle = (0, react.useCallback)((key, toEnter) => {
5050
const stateObj = latestStateMap.current.get(key);
5151
if (!stateObj) {
52-
process.env.NODE_ENV !== "production" && console.error(`[React-Transition-State] invalid key: ${key}`);
52+
if (process.env.NODE_ENV !== "production") console.error(`[React-Transition-State] cannot call toggle: invalid key ${key}`);
5353
return;
5454
}
5555
const config = configMap.current.get(key);
5656
const transitState = (status) => {
5757
updateState(key, status, setStateMap, latestStateMap, config.timeoutId, onChange);
5858
switch (status) {
5959
case require_utils.ENTERING:
60-
if (enterTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), enterTimeout);
60+
if (enterTimeout >= 0) config.timeoutId = require_utils._setTimeout(() => endTransition(key), enterTimeout);
6161
break;
6262
case require_utils.EXITING:
63-
if (exitTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), exitTimeout);
63+
if (exitTimeout >= 0) config.timeoutId = require_utils._setTimeout(() => endTransition(key), exitTimeout);
6464
break;
6565
case require_utils.PRE_ENTER:
6666
case require_utils.PRE_EXIT:
Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
const require_utils = require('./utils.cjs');
44
let react = require("react");
55

6-
//#region src/hooks/useTransitionState.js
6+
//#region src/useTransitionState.ts
77
const updateState = (status, setState, latestState, timeoutId, onChange) => {
88
clearTimeout(timeoutId.current);
99
const state = require_utils.getState(status);
@@ -14,7 +14,7 @@ const updateState = (status, setState, latestState, timeoutId, onChange) => {
1414
const useTransitionState = ({ enter = true, exit = true, preEnter, preExit, timeout, initialEntered, mountOnEnter, unmountOnExit, onStateChange: onChange } = {}) => {
1515
const [state, setState] = (0, react.useState)(() => require_utils.getState(initialEntered ? require_utils.ENTERED : require_utils.startOrEnd(mountOnEnter)));
1616
const latestState = (0, react.useRef)(state);
17-
const timeoutId = (0, react.useRef)();
17+
const timeoutId = (0, react.useRef)(0);
1818
const [enterTimeout, exitTimeout] = require_utils.getTimeout(timeout);
1919
const endTransition = (0, react.useCallback)(() => {
2020
const status = require_utils.getEndStatus(latestState.current._s, unmountOnExit);
@@ -27,10 +27,10 @@ const useTransitionState = ({ enter = true, exit = true, preEnter, preExit, time
2727
updateState(status, setState, latestState, timeoutId, onChange);
2828
switch (status) {
2929
case require_utils.ENTERING:
30-
if (enterTimeout >= 0) timeoutId.current = setTimeout(endTransition, enterTimeout);
30+
if (enterTimeout >= 0) timeoutId.current = require_utils._setTimeout(endTransition, enterTimeout);
3131
break;
3232
case require_utils.EXITING:
33-
if (exitTimeout >= 0) timeoutId.current = setTimeout(endTransition, exitTimeout);
33+
if (exitTimeout >= 0) timeoutId.current = require_utils._setTimeout(endTransition, exitTimeout);
3434
break;
3535
case require_utils.PRE_ENTER:
3636
case require_utils.PRE_EXIT:
Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11

22
'use strict';
33

4-
//#region src/hooks/utils.js
4+
//#region src/utils.ts
55
const PRE_ENTER = 0;
66
const ENTERING = 1;
77
const ENTERED = 2;
@@ -35,7 +35,8 @@ const getEndStatus = (status, unmountOnExit) => {
3535
}
3636
};
3737
const getTimeout = (timeout) => typeof timeout === "object" ? [timeout.enter, timeout.exit] : [timeout, timeout];
38-
const nextTick = (transitState, status) => setTimeout(() => {
38+
const _setTimeout = setTimeout;
39+
const nextTick = (transitState, status) => _setTimeout(() => {
3940
isNaN(document.body.offsetTop) || transitState(status + 1);
4041
}, 0);
4142

@@ -45,6 +46,7 @@ exports.ENTERING = ENTERING;
4546
exports.EXITING = EXITING;
4647
exports.PRE_ENTER = PRE_ENTER;
4748
exports.PRE_EXIT = PRE_EXIT;
49+
exports._setTimeout = _setTimeout;
4850
exports.getEndStatus = getEndStatus;
4951
exports.getState = getState;
5052
exports.getTimeout = getTimeout;

dist/esm/index.mjs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
'use client';
22

3-
import { useTransitionState } from "./hooks/useTransitionState.mjs";
4-
import { useTransitionMap } from "./hooks/useTransitionMap.mjs";
3+
import { useTransitionState } from "./useTransitionState.mjs";
4+
import { useTransitionMap } from "./useTransitionMap.mjs";
55

66
export { useTransitionState as default, useTransitionState as useTransition, useTransitionMap, useTransitionState };
Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, getEndStatus, getState, getTimeout, nextTick, startOrEnd } from "./utils.mjs";
1+
import { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, _setTimeout, getEndStatus, getState, getTimeout, nextTick, startOrEnd } from "./utils.mjs";
22
import { useCallback, useRef, useState } from "react";
33

4-
//#region src/hooks/useTransitionMap.js
4+
//#region src/useTransitionMap.ts
55
const updateState = (key, status, setStateMap, latestStateMap, timeoutId, onChange) => {
66
clearTimeout(timeoutId);
77
const state = getState(status);
@@ -19,8 +19,8 @@ const useTransitionMap = ({ allowMultiple, enter = true, exit = true, preEnter,
1919
const latestStateMap = useRef(stateMap);
2020
const configMap = useRef(/* @__PURE__ */ new Map());
2121
const [enterTimeout, exitTimeout] = getTimeout(timeout);
22-
const setItem = useCallback((key, config) => {
23-
const { initialEntered: _initialEntered = initialEntered } = config || {};
22+
const setItem = useCallback((key, options) => {
23+
const { initialEntered: _initialEntered = initialEntered } = options || {};
2424
updateState(key, _initialEntered ? ENTERED : startOrEnd(mountOnEnter), setStateMap, latestStateMap);
2525
configMap.current.set(key, {});
2626
}, [initialEntered, mountOnEnter]);
@@ -37,7 +37,7 @@ const useTransitionMap = ({ allowMultiple, enter = true, exit = true, preEnter,
3737
const endTransition = useCallback((key) => {
3838
const stateObj = latestStateMap.current.get(key);
3939
if (!stateObj) {
40-
process.env.NODE_ENV !== "production" && console.error(`[React-Transition-State] invalid key: ${key}`);
40+
if (process.env.NODE_ENV !== "production") console.error(`[React-Transition-State] cannot call endTransition: invalid key ${key}`);
4141
return;
4242
}
4343
const { timeoutId } = configMap.current.get(key);
@@ -47,18 +47,18 @@ const useTransitionMap = ({ allowMultiple, enter = true, exit = true, preEnter,
4747
const toggle = useCallback((key, toEnter) => {
4848
const stateObj = latestStateMap.current.get(key);
4949
if (!stateObj) {
50-
process.env.NODE_ENV !== "production" && console.error(`[React-Transition-State] invalid key: ${key}`);
50+
if (process.env.NODE_ENV !== "production") console.error(`[React-Transition-State] cannot call toggle: invalid key ${key}`);
5151
return;
5252
}
5353
const config = configMap.current.get(key);
5454
const transitState = (status) => {
5555
updateState(key, status, setStateMap, latestStateMap, config.timeoutId, onChange);
5656
switch (status) {
5757
case ENTERING:
58-
if (enterTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), enterTimeout);
58+
if (enterTimeout >= 0) config.timeoutId = _setTimeout(() => endTransition(key), enterTimeout);
5959
break;
6060
case EXITING:
61-
if (exitTimeout >= 0) config.timeoutId = setTimeout(() => endTransition(key), exitTimeout);
61+
if (exitTimeout >= 0) config.timeoutId = _setTimeout(() => endTransition(key), exitTimeout);
6262
break;
6363
case PRE_ENTER:
6464
case PRE_EXIT:
Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, getEndStatus, getState, getTimeout, nextTick, startOrEnd } from "./utils.mjs";
1+
import { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, _setTimeout, getEndStatus, getState, getTimeout, nextTick, startOrEnd } from "./utils.mjs";
22
import { useCallback, useRef, useState } from "react";
33

4-
//#region src/hooks/useTransitionState.js
4+
//#region src/useTransitionState.ts
55
const updateState = (status, setState, latestState, timeoutId, onChange) => {
66
clearTimeout(timeoutId.current);
77
const state = getState(status);
@@ -12,7 +12,7 @@ const updateState = (status, setState, latestState, timeoutId, onChange) => {
1212
const useTransitionState = ({ enter = true, exit = true, preEnter, preExit, timeout, initialEntered, mountOnEnter, unmountOnExit, onStateChange: onChange } = {}) => {
1313
const [state, setState] = useState(() => getState(initialEntered ? ENTERED : startOrEnd(mountOnEnter)));
1414
const latestState = useRef(state);
15-
const timeoutId = useRef();
15+
const timeoutId = useRef(0);
1616
const [enterTimeout, exitTimeout] = getTimeout(timeout);
1717
const endTransition = useCallback(() => {
1818
const status = getEndStatus(latestState.current._s, unmountOnExit);
@@ -25,10 +25,10 @@ const useTransitionState = ({ enter = true, exit = true, preEnter, preExit, time
2525
updateState(status, setState, latestState, timeoutId, onChange);
2626
switch (status) {
2727
case ENTERING:
28-
if (enterTimeout >= 0) timeoutId.current = setTimeout(endTransition, enterTimeout);
28+
if (enterTimeout >= 0) timeoutId.current = _setTimeout(endTransition, enterTimeout);
2929
break;
3030
case EXITING:
31-
if (exitTimeout >= 0) timeoutId.current = setTimeout(endTransition, exitTimeout);
31+
if (exitTimeout >= 0) timeoutId.current = _setTimeout(endTransition, exitTimeout);
3232
break;
3333
case PRE_ENTER:
3434
case PRE_EXIT:
Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
//#region src/hooks/utils.js
1+
//#region src/utils.ts
22
const PRE_ENTER = 0;
33
const ENTERING = 1;
44
const ENTERED = 2;
@@ -32,9 +32,10 @@ const getEndStatus = (status, unmountOnExit) => {
3232
}
3333
};
3434
const getTimeout = (timeout) => typeof timeout === "object" ? [timeout.enter, timeout.exit] : [timeout, timeout];
35-
const nextTick = (transitState, status) => setTimeout(() => {
35+
const _setTimeout = setTimeout;
36+
const nextTick = (transitState, status) => _setTimeout(() => {
3637
isNaN(document.body.offsetTop) || transitState(status + 1);
3738
}, 0);
3839

3940
//#endregion
40-
export { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, getEndStatus, getState, getTimeout, nextTick, startOrEnd };
41+
export { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, _setTimeout, getEndStatus, getState, getTimeout, nextTick, startOrEnd };

0 commit comments

Comments
 (0)