@bifrostui/react 1.5.3 → 2.0.0-alpha.1

package/es/Tooltip/useTooltip.js

@@ -0,0 +1,290 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import React, { useState, useRef, useEffect, useCallback } from "react";
+import {
+  getStylesAndLocation,
+  triggerEventTransform,
+  parsePlacement,
+  throttle,
+  useForkRef,
+  useUniqueId,
+  isMini
+} from "@bifrostui/utils";
+function useTooltip(parameters) {
+  const {
+    defaultOpen = false,
+    open,
+    offset,
+    placement = "top",
+    trigger = "click",
+    onOpenChange,
+    autoFocus = false,
+    closeOnEscape = false,
+    children,
+    rootRef
+  } = parameters;
+  const controlByUser = typeof open !== "undefined";
+  const { direction, location = "center" } = parsePlacement(placement);
+  const childrenRef = useRef();
+  const [openStatus, setOpenStatus] = useState(defaultOpen);
+  const [arrowDirection, setArrowDirection] = useState(direction);
+  const [arrowLocation, setArrowLocation] = useState(location);
+  const [toolStyles, setToolStyles] = useState({});
+  const tipRef = useRef(null);
+  const tooltipId = useUniqueId();
+  useEffect(() => {
+    setArrowDirection(direction);
+    setArrowLocation(location);
+  }, [direction, location]);
+  const isOpen = open || openStatus;
+  const clearRef = (status) => {
+    if (status === false) {
+      tipRef.current = null;
+    }
+  };
+  const changeOpenStatus = (event, status) => {
+    if (controlByUser)
+      return;
+    clearRef(status);
+    setOpenStatus(status);
+    onOpenChange == null ? void 0 : onOpenChange(event, { open: status });
+  };
+  const triggerClick = (event) => {
+    event.stopPropagation();
+    const targetStatus = !openStatus;
+    changeOpenStatus(event, targetStatus);
+  };
+  const hideTooltip = (event) => {
+    changeOpenStatus(event, false);
+  };
+  const showTooltip = (event) => {
+    changeOpenStatus(event, true);
+  };
+  const handleKeyDown = useCallback(
+    (event) => {
+      if (closeOnEscape && event.key === "Escape" && isOpen) {
+        event.preventDefault();
+        event.stopPropagation();
+        hideTooltip(event);
+        if (childrenRef.current && "focus" in childrenRef.current) {
+          childrenRef.current.focus();
+        }
+      }
+    },
+    [closeOnEscape, isOpen, hideTooltip]
+  );
+  useEffect(() => {
+    if (isOpen && autoFocus && tipRef.current) {
+      const timer = setTimeout(() => {
+        if (tipRef.current && "focus" in tipRef.current) {
+          tipRef.current.focus();
+        }
+      }, 0);
+      return () => clearTimeout(timer);
+    }
+    return void 0;
+  }, [isOpen, autoFocus]);
+  useEffect(() => {
+    if (!controlByUser)
+      return;
+    setOpenStatus(open != null ? open : false);
+    clearRef(open != null ? open : false);
+  }, [open, controlByUser]);
+  useEffect(() => {
+    if (!openStatus) {
+      setToolStyles({
+        visibility: "hidden"
+      });
+    }
+  }, [openStatus]);
+  const shouldListenGlobalClick = useCallback(() => {
+    if (typeof trigger === "string") {
+      return trigger === "click";
+    }
+    if (Array.isArray(trigger)) {
+      return trigger.includes("click");
+    }
+    return true;
+  }, [trigger]);
+  const clickEventHandler = useCallback(
+    (event) => {
+      if (!shouldListenGlobalClick()) {
+        return;
+      }
+      hideTooltip(event);
+    },
+    [shouldListenGlobalClick, hideTooltip]
+  );
+  const onMounted = throttle(() => __async(this, null, function* () {
+    if (!tipRef.current)
+      return;
+    const {
+      direction: newParsedDirection,
+      location: newParsedLocation = "center"
+    } = parsePlacement(placement);
+    const result = yield getStylesAndLocation({
+      childrenRef,
+      arrowDirection: newParsedDirection,
+      arrowLocation: newParsedLocation,
+      offsetSpacing: offset || 0,
+      tipRef
+    });
+    if (!result)
+      return;
+    const { styles, newArrowDirection, newArrowLocation } = result;
+    if (newArrowDirection !== arrowDirection) {
+      setArrowDirection(newArrowDirection);
+    }
+    if (newArrowLocation !== arrowLocation) {
+      setArrowLocation(newArrowLocation);
+    }
+    setToolStyles(styles);
+  }), 100);
+  useEffect(() => {
+    const bindEvent = () => {
+      if (!openStatus)
+        return;
+      if (!controlByUser && shouldListenGlobalClick() && !isMini) {
+        document.addEventListener("click", clickEventHandler);
+      }
+      if (!isMini) {
+        window.addEventListener("resize", onMounted);
+      }
+      if (isOpen && !isMini) {
+        document.addEventListener("keydown", handleKeyDown);
+      }
+    };
+    const unbindEvent = () => {
+      if (!controlByUser && shouldListenGlobalClick() && !isMini) {
+        document.removeEventListener("click", clickEventHandler);
+      }
+      if (!isMini) {
+        window.removeEventListener("resize", onMounted);
+      }
+      if (!isMini) {
+        document.removeEventListener("keydown", handleKeyDown);
+      }
+    };
+    bindEvent();
+    return () => {
+      unbindEvent();
+    };
+  }, [
+    openStatus,
+    controlByUser,
+    shouldListenGlobalClick,
+    clickEventHandler,
+    onMounted,
+    isOpen,
+    handleKeyDown
+  ]);
+  const tooltipRef = useForkRef(tipRef, rootRef);
+  const getTooltipProps = useCallback(
+    (otherProps = {}) => {
+      return __spreadValues({
+        id: tooltipId,
+        ref: tooltipRef,
+        tabIndex: autoFocus ? -1 : void 0
+      }, otherProps);
+    },
+    [tooltipId, tooltipRef, autoFocus]
+  );
+  const getChildProps = useCallback(() => {
+    var _a;
+    let triggerEventOption = {};
+    if (!controlByUser) {
+      triggerEventOption = triggerEventTransform({
+        trigger,
+        click: triggerClick,
+        show: showTooltip,
+        hide: hideTooltip
+      });
+    }
+    const childProps = __spreadProps(__spreadValues({
+      ref: childrenRef
+    }, triggerEventOption), {
+      "aria-describedby": isOpen ? tooltipId : void 0
+    });
+    if (React.isValidElement(children)) {
+      const elementType = typeof children.type === "string" ? children.type : ((_a = children.type) == null ? void 0 : _a.displayName) || "";
+      const interactiveElements = [
+        "button",
+        "a",
+        "input",
+        "select",
+        "textarea"
+      ];
+      const childElementProps = children.props;
+      const isInteractive = interactiveElements.includes(elementType.toLowerCase()) || (childElementProps == null ? void 0 : childElementProps.role) === "button" || (childElementProps == null ? void 0 : childElementProps.role) === "menuitem" || (childElementProps == null ? void 0 : childElementProps.role) === "tab" || (childElementProps == null ? void 0 : childElementProps.tabIndex) !== void 0;
+      if (isInteractive) {
+        childProps["aria-expanded"] = isOpen;
+      }
+    }
+    return childProps;
+  }, [
+    controlByUser,
+    trigger,
+    triggerClick,
+    showTooltip,
+    hideTooltip,
+    isOpen,
+    tooltipId,
+    children
+  ]);
+  const getPortalProps = useCallback(() => {
+    return {
+      onMounted
+    };
+  }, [onMounted]);
+  return {
+    getTooltipProps,
+    getChildProps,
+    getPortalProps,
+    tooltipRef,
+    isOpen,
+    toolStyles,
+    arrowDirection,
+    arrowLocation,
+    tooltipId
+  };
+}
+export {
+  useTooltip
+};

package/es/Transition/TransitionCore.js

@@ -49,7 +49,7 @@ var __async = (__this, __arguments, generator) => {
     step((generator = generator.apply(__this, __arguments)).next());
   });
 };
-import { useForkRef } from "@bifrostui/utils";
+import { useForkRef, useDidMountEffect } from "@bifrostui/utils";
 import React, { forwardRef, useEffect, useRef, useState } from "react";
 const TransitionCore = forwardRef(
   (props, ref) => {
@@ -59,17 +59,17 @@ const TransitionCore = forwardRef(
       children,
       mountOnEnter,
       unmountOnExit,
-      enter,
-      exit,
+      enter = true,
+      exit = true,
       timeout: _timeout,
-      delay: _delay,
+      delay: _delay = 0,
       onEnter,
       onEntering,
       onEntered,
       onExit,
       onExiting,
       onExited,
-      nextTick
+      nextTick = setTimeout
     } = _a, childProps = __objRest(_a, [
       "appear",
       "in",
@@ -100,13 +100,16 @@ const TransitionCore = forwardRef(
     });
     const innerNodeRef = useRef();
     const nodeRef = useForkRef(innerNodeRef, ref);
-    const timeout = typeof _timeout === "object" ? __spreadValues({}, _timeout) : { enter: _timeout, exit: _timeout };
-    const delay = typeof _delay === "object" ? _delay : { enter: _delay, exit: _delay };
-    timeout.enter += delay.enter;
-    timeout.exit += delay.exit;
+    const timeout = typeof _timeout === "object" ? __spreadValues({}, _timeout) : { enter: _timeout, exit: _timeout, appear: _timeout };
+    const delay = typeof _delay === "object" ? _delay : { enter: _delay, exit: _delay, appear: _delay };
+    if (timeout.enter !== void 0)
+      timeout.enter += delay.enter || 0;
+    if (timeout.exit !== void 0)
+      timeout.exit += delay.exit || 0;
+    if (timeout.appear !== void 0)
+      timeout.appear += delay.appear || 0;
     const nextCallback = useRef(null);
     const appearStatus = useRef(inProp && appear ? ENTERING : null);
-    const isFirstRender = useRef(false);
     const cancelNextCallback = () => {
       var _a2;
       if (nextCallback.current !== null) {
@@ -163,7 +166,9 @@ const TransitionCore = forwardRef(
     });
     const performExit = () => __async(void 0, null, function* () {
       if (!exit) {
-        safeSetState(unmountOnExit ? UNMOUNTED : EXITED, () => __async(void 0, null, function* () {
+        safeSetState(EXITED, () => __async(void 0, null, function* () {
+          if (unmountOnExit)
+            setStatus(UNMOUNTED);
           yield onExited == null ? void 0 : onExited(innerNodeRef == null ? void 0 : innerNodeRef.current);
         }));
         return;
@@ -172,7 +177,9 @@ const TransitionCore = forwardRef(
       safeSetState(EXITING, () => __async(void 0, null, function* () {
         yield onExiting == null ? void 0 : onExiting(innerNodeRef == null ? void 0 : innerNodeRef.current);
         onTransitionEnd(timeout.exit, () => {
-          safeSetState(unmountOnExit ? UNMOUNTED : EXITED, () => __async(void 0, null, function* () {
+          safeSetState(EXITED, () => __async(void 0, null, function* () {
+            if (unmountOnExit)
+              setStatus(UNMOUNTED);
             yield onExited == null ? void 0 : onExited(innerNodeRef == null ? void 0 : innerNodeRef.current);
           }));
         });
@@ -182,6 +189,9 @@ const TransitionCore = forwardRef(
       if (nextStatus !== null) {
         cancelNextCallback();
         if (nextStatus === ENTERING) {
+          if (unmountOnExit || mountOnEnter) {
+            forceReflow(innerNodeRef == null ? void 0 : innerNodeRef.current);
+          }
           performEnter(mounting);
         } else if (nextStatus === EXITING) {
           performExit();
@@ -194,12 +204,7 @@ const TransitionCore = forwardRef(
         cancelNextCallback();
       };
     }, []);
-    useEffect(() => {
-      const isMounted = status !== UNMOUNTED;
-      if (!isFirstRender.current) {
-        isFirstRender.current = true;
-        return;
-      }
+    useDidMountEffect(() => {
       let nextStatus = null;
       if (inProp) {
         if (status !== ENTERING && status !== ENTERED) {
@@ -208,13 +213,13 @@ const TransitionCore = forwardRef(
       } else if (status === ENTERING || status === ENTERED) {
         nextStatus = EXITING;
       }
-      if (isMounted)
-        updateStatus(nextStatus, false);
-      else
-        safeSetState(inProp ? "EXITED" : "ENTERED", () => {
-          forceReflow(innerNodeRef == null ? void 0 : innerNodeRef.current);
+      if (inProp && status === UNMOUNTED) {
+        safeSetState(EXITED, () => {
           updateStatus(nextStatus, false);
         });
+      } else {
+        updateStatus(nextStatus, false);
+      }
     }, [inProp]);
     if (status === UNMOUNTED)
       return null;
@@ -224,11 +229,6 @@ const TransitionCore = forwardRef(
   }
 );
 TransitionCore.displayName = "BuiTransitionCore";
-TransitionCore.defaultProps = {
-  enter: true,
-  exit: true,
-  nextTick: setTimeout
-};
 var TransitionCore_default = TransitionCore;
 export {
   TransitionCore_default as default

package/es/TransitionGroup/TransitionGroup.js

@@ -0,0 +1,109 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import React, { useState, useEffect, useRef } from "react";
+import {
+  getChildMapping,
+  getInitialChildMapping,
+  getNextChildMapping
+} from "./utils/childMapping";
+const TransitionGroupContext = React.createContext(null);
+const values = Object.values || ((obj) => Object.keys(obj).map((k) => obj[k]));
+const TransitionGroup = (props) => {
+  const _a = props, {
+    component: Component = "div",
+    children,
+    appear,
+    enter,
+    exit,
+    childFactory = (child) => child
+  } = _a, restProps = __objRest(_a, [
+    "component",
+    "children",
+    "appear",
+    "enter",
+    "exit",
+    "childFactory"
+  ]);
+  const [state, setState] = useState({
+    contextValue: { isMounting: true },
+    firstRender: true,
+    children: {}
+  });
+  const mountedRef = useRef(false);
+  const handleExitedRef = useRef((child, node) => {
+    const currentChildMapping = getChildMapping(children);
+    if (child.key in currentChildMapping)
+      return;
+    if (child.props.onExited) {
+      child.props.onExited(node);
+    }
+    if (mountedRef.current) {
+      setState((prevState) => {
+        const tempChildren = __spreadValues({}, prevState.children);
+        delete tempChildren[child.key];
+        return __spreadProps(__spreadValues({}, prevState), { children: tempChildren });
+      });
+    }
+  });
+  useEffect(() => {
+    mountedRef.current = true;
+    setState((prevState) => __spreadProps(__spreadValues({}, prevState), {
+      contextValue: { isMounting: false }
+    }));
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  useEffect(() => {
+    setState((prevState) => {
+      const { firstRender, children: prevChildMapping } = prevState;
+      const handleExited = handleExitedRef.current;
+      return __spreadProps(__spreadValues({}, prevState), {
+        children: firstRender ? getInitialChildMapping(props, handleExited) : getNextChildMapping(props, prevChildMapping, handleExited),
+        firstRender: false
+      });
+    });
+  }, [children, appear, enter, exit]);
+  const { contextValue, children: mappedChildren } = state;
+  const valuedChildren = values(mappedChildren).map(
+    childFactory
+  );
+  if (Component === null) {
+    return /* @__PURE__ */ React.createElement(TransitionGroupContext.Provider, { value: contextValue }, valuedChildren);
+  }
+  return /* @__PURE__ */ React.createElement(TransitionGroupContext.Provider, { value: contextValue }, /* @__PURE__ */ React.createElement(Component, __spreadValues({}, restProps), valuedChildren));
+};
+TransitionGroup.displayName = "BuiTransitionGroup";
+var TransitionGroup_default = TransitionGroup;
+export {
+  TransitionGroup_default as default
+};

package/es/TransitionGroup/TransitionGroup.types.js

@@ -0,0 +1 @@
+export {};

package/es/TransitionGroup/demo/TransitionGroupDemo.js

@@ -0,0 +1,39 @@
+import { Button, TransitionGroup, CSSTransition } from "@bifrostui/react";
+import React, { useState } from "react";
+import "./index.css";
+const TransitionGroupDemo = () => {
+  const [items, setItems] = useState([
+    { id: 1, text: "Item 1" },
+    { id: 2, text: "Item 2" },
+    { id: 3, text: "Item 3" }
+  ]);
+  const handleAddItem = () => {
+    const id = items.length > 0 ? Math.max(...items.map((item) => item.id)) + 1 : 1;
+    setItems((prev) => [...prev, { id, text: `Item ${id}` }]);
+  };
+  const handleRemoveItem = (id) => {
+    setItems((prev) => prev.filter((item) => item.id !== id));
+  };
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Button, { onClick: handleAddItem }, "\u6DFB\u52A0\u9879\u76EE"), /* @__PURE__ */ React.createElement(TransitionGroup, { className: "transition-group-container" }, items.map((item) => /* @__PURE__ */ React.createElement(
+    CSSTransition,
+    {
+      key: item.id,
+      unmountOnExit: true,
+      timeout: 300,
+      classNames: "item"
+    },
+    /* @__PURE__ */ React.createElement("div", { className: "item-container" }, /* @__PURE__ */ React.createElement("span", null, item.text), /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        size: "small",
+        color: "danger",
+        onClick: () => handleRemoveItem(item.id)
+      },
+      "\u5220\u9664"
+    ))
+  ))));
+};
+var TransitionGroupDemo_default = TransitionGroupDemo;
+export {
+  TransitionGroupDemo_default as default
+};

package/es/TransitionGroup/demo/index.css

@@ -0,0 +1,33 @@
+.transition-group-container {
+  margin-top: 10px;
+}
+.transition-group-container .item-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px;
+  margin-bottom: 10px;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+}
+.transition-group-container .item-enter {
+  opacity: 0;
+  transform: translateX(-100%);
+}
+.transition-group-container .item-enter-active {
+  opacity: 1;
+  transform: translateX(0);
+  transition: all 300ms ease-in;
+}
+.transition-group-container .item-exit {
+  opacity: 1;
+  transform: translateX(0);
+}
+.transition-group-container .item-exit-active {
+  opacity: 0;
+  transform: translateX(-100%);
+  transition: all 300ms ease-in;
+}
+.transition-group-container .bui-btn {
+  margin-bottom: 0;
+}

package/es/TransitionGroup/index.js

@@ -0,0 +1,6 @@
+import { default as default2, default as default3 } from "./TransitionGroup";
+export * from "./TransitionGroup.types";
+export {
+  default3 as TransitionGroup,
+  default2 as default
+};

package/es/TransitionGroup/utils/childMapping.js

@@ -0,0 +1,93 @@
+import { Children, cloneElement, isValidElement } from "react";
+const getChildMapping = (children, mapFn) => {
+  const mapper = (child) => mapFn && isValidElement(child) ? mapFn(child) : child;
+  const result = /* @__PURE__ */ Object.create(null);
+  if (children)
+    Children.map(children, (c) => c).forEach((child) => {
+      result[child.key] = mapper(child);
+    });
+  return result;
+};
+const mergeChildMappings = (prev, next) => {
+  prev = prev || {};
+  next = next || {};
+  function getValueForKey(key) {
+    return key in next ? next[key] : prev[key];
+  }
+  const nextKeysPending = /* @__PURE__ */ Object.create(null);
+  let pendingKeys = [];
+  Object.keys(prev).forEach((prevKey) => {
+    if (prevKey in next) {
+      if (pendingKeys.length) {
+        nextKeysPending[prevKey] = pendingKeys;
+        pendingKeys = [];
+      }
+    } else {
+      pendingKeys.push(prevKey);
+    }
+  });
+  const childMapping = {};
+  Object.keys(next).forEach((nextKey) => {
+    if (nextKeysPending[nextKey]) {
+      nextKeysPending[nextKey].forEach((pendingNextKey) => {
+        childMapping[pendingNextKey] = getValueForKey(pendingNextKey);
+      });
+    }
+    childMapping[nextKey] = getValueForKey(nextKey);
+  });
+  pendingKeys.forEach((pendingKey) => {
+    childMapping[pendingKey] = getValueForKey(pendingKey);
+  });
+  return childMapping;
+};
+const getProp = (child, prop, props) => {
+  return props[prop] != null ? props[prop] : child.props[prop];
+};
+const getInitialChildMapping = (props, onExited) => {
+  return getChildMapping(props.children, (child) => {
+    return cloneElement(child, {
+      onExited: onExited.bind(null, child),
+      in: true,
+      appear: getProp(child, "appear", props),
+      enter: getProp(child, "enter", props),
+      exit: getProp(child, "exit", props)
+    });
+  });
+};
+const getNextChildMapping = (nextProps, prevChildMapping, onExited) => {
+  const nextChildMapping = getChildMapping(nextProps.children);
+  const children = mergeChildMappings(prevChildMapping, nextChildMapping);
+  Object.keys(children).forEach((key) => {
+    const child = children[key];
+    if (!isValidElement(child))
+      return;
+    const hasPrev = key in prevChildMapping;
+    const hasNext = key in nextChildMapping;
+    const prevChild = prevChildMapping[key];
+    const isLeaving = isValidElement(prevChild) && !prevChild.props.in;
+    if (hasNext && (!hasPrev || isLeaving)) {
+      children[key] = cloneElement(child, {
+        onExited: onExited.bind(null, child),
+        in: true,
+        exit: getProp(child, "exit", nextProps),
+        enter: getProp(child, "enter", nextProps)
+      });
+    } else if (!hasNext && hasPrev && !isLeaving) {
+      children[key] = cloneElement(child, { in: false });
+    } else if (hasNext && hasPrev && isValidElement(prevChild)) {
+      children[key] = cloneElement(child, {
+        onExited: onExited.bind(null, child),
+        in: prevChild.props.in,
+        exit: getProp(child, "exit", nextProps),
+        enter: getProp(child, "enter", nextProps)
+      });
+    }
+  });
+  return children;
+};
+export {
+  getChildMapping,
+  getInitialChildMapping,
+  getNextChildMapping,
+  mergeChildMappings
+};