Skip to content

Commit

Permalink
fix: reset when prepare not exist (#44)
Browse files Browse the repository at this point in the history
* chore: skip prepare if no need

* chore: fix logic

* chore: comment it
  • Loading branch information
zombieJ authored Apr 18, 2023
1 parent 21e6c6d commit 6734bf5
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 8 deletions.
23 changes: 15 additions & 8 deletions src/hooks/useStatus.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,12 +101,8 @@ export default function useStatus(
const [patchMotionEvents] = useDomMotionEvents(onInternalMotionEnd);

// ============================= Step =============================
const eventHandlers = React.useMemo<{
[STEP_PREPARE]?: MotionPrepareEventHandler;
[STEP_START]?: MotionEventHandler;
[STEP_ACTIVE]?: MotionEventHandler;
}>(() => {
switch (status) {
const getEventHandlers = (targetStatus: MotionStatus) => {
switch (targetStatus) {
case STATUS_APPEAR:
return {
[STEP_PREPARE]: onAppearPrepare,
Expand All @@ -131,7 +127,13 @@ export default function useStatus(
default:
return {};
}
}, [status]);
};

const eventHandlers = React.useMemo<{
[STEP_PREPARE]?: MotionPrepareEventHandler;
[STEP_START]?: MotionEventHandler;
[STEP_ACTIVE]?: MotionEventHandler;
}>(() => getEventHandlers(status), [status]);

const [startStep, step] = useStepQueue(status, !supportMotion, newStep => {
// Only prepare step can be skip
Expand Down Expand Up @@ -205,10 +207,15 @@ export default function useStatus(
nextStatus = STATUS_LEAVE;
}

const nextEventHandlers = getEventHandlers(nextStatus);

// Update to next status
if (nextStatus) {
if (nextStatus && (supportMotion || nextEventHandlers[STEP_PREPARE])) {
setStatus(nextStatus);
startStep();
} else {
// Set back in case no motion but prev status has prepare step
setStatus(STATUS_NONE);
}
}, [visible]);

Expand Down
1 change: 1 addition & 0 deletions tests/CSSMotion.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -547,6 +547,7 @@ describe('CSSMotion', () => {

// hide immediately since motion is disabled
rerender(<Demo motion={false} visible={false} />);

expect(container.querySelector('.hidden')).toBeTruthy();
});

Expand Down

1 comment on commit 6734bf5

@vercel
Copy link

@vercel vercel bot commented on 6734bf5 Apr 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.