Skip to content

Commit

Permalink
feat: onMotionEnd provides the key
Browse files Browse the repository at this point in the history
  • Loading branch information
zombieJ committed Sep 27, 2020
1 parent b9d3333 commit d3076dd
Show file tree
Hide file tree
Showing 2 changed files with 12 additions and 4 deletions.
10 changes: 6 additions & 4 deletions src/CSSMotionList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
parseKeys,
KeyObject,
} from './util/diff';
import { ListMotionEndEventHandler } from './interface';

const MOTION_PROP_NAMES = [
'eventProps',
Expand All @@ -35,9 +36,10 @@ const MOTION_PROP_NAMES = [
'onLeaveEnd',
];

export interface CSSMotionListProps extends CSSMotionProps {
export interface CSSMotionListProps extends Omit<CSSMotionProps, 'onLeaveEnd'> {
keys: (React.Key | { key: React.Key; [name: string]: any })[];
component?: string | React.ComponentType | false;
onLeaveEnd?: ListMotionEndEventHandler;
}

export interface CSSMotionListState {
Expand Down Expand Up @@ -118,7 +120,7 @@ export function genCSSMotionList(

render() {
const { keyEntities } = this.state;
const { component, children, ...restProps } = this.props;
const { component, children, onLeaveEnd, ...restProps } = this.props;

const Component = component || React.Fragment;

Expand All @@ -140,8 +142,8 @@ export function genCSSMotionList(
visible={visible}
eventProps={eventProps}
onLeaveEnd={(...args) => {
if (motionProps.onLeaveEnd) {
motionProps.onLeaveEnd(...args);
if (onLeaveEnd) {
onLeaveEnd(...args, { key: eventProps.key });
}
this.removeKey(eventProps.key);
}}
Expand Down
6 changes: 6 additions & 0 deletions src/interface.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,3 +37,9 @@ export type MotionEndEventHandler = (
element: HTMLElement,
event: MotionEvent,
) => boolean | void;

export type ListMotionEndEventHandler = (
element: HTMLElement,
event: MotionEvent,
info: { key: React.Key },
) => void;

1 comment on commit d3076dd

@vercel
Copy link

@vercel vercel bot commented on d3076dd Sep 27, 2020

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.