@yamada-ui/motion 2.2.4-next-20241005235555 → 2.2.4

package/dist/index.mjs

@@ -1,44 +1,29 @@
 "use client"
 import {
   motion
-} from "./chunk-HOM46QCE.mjs";
+} from "./chunk-4MMUMOXF.mjs";
 import {
   Motion
-} from "./chunk-M6WLOAFU.mjs";
+} from "./chunk-2V3EH5L5.mjs";
 import {
   motionForwardRef
-} from "./chunk-IBE7Q3Z3.mjs";
-import "./chunk-R3D52RAW.mjs";
+} from "./chunk-RXCU3ZFK.mjs";
 import {
   MOTION_TRANSITION_DEFAULTS,
   MOTION_TRANSITION_EASINGS,
   MOTION_TRANSITION_VARIANTS,
   transitionEnter,
   transitionExit
-} from "./chunk-Z6I57MQV.mjs";
+} from "./chunk-AWDPDZLD.mjs";
 
 // src/index.ts
 import {
   AcceleratedAnimation,
-  AnimatePresence,
-  AnimateSharedLayout,
-  DeprecatedLayoutGroupContext,
-  DragControls,
-  FlatTree,
-  LayoutGroup,
-  LayoutGroupContext,
-  LazyMotion,
-  MotionConfig,
-  MotionConfigContext,
-  MotionContext,
-  MotionGlobalConfig,
-  PresenceContext,
-  Reorder,
-  SwitchLayoutGroupContext,
-  VisualElement,
   addPointerInfo,
   addScaleCorrector,
   animate,
+  AnimatePresence,
+  AnimateSharedLayout,
   animateValue,
   animateVisualElement,
   animationControls,
@@ -63,34 +48,46 @@ import {
   createScopedAnimate,
   cubicBezier,
   delay,
+  DeprecatedLayoutGroupContext,
   disableInstantTransitions,
   distance,
   distance2D,
   domAnimation,
   domMax,
+  DragControls,
   easeIn,
   easeInOut,
   easeOut,
   filterProps,
+  FlatTree,
   frame,
   frameData,
-  inView,
   interpolate,
   invariant,
+  inView,
   isBrowser,
   isDragActive,
   isMotionComponent,
   isMotionValue,
   isValidMotionProp,
+  LayoutGroup,
+  LayoutGroupContext,
+  LazyMotion,
   m,
   makeUseVisualState,
   mirrorEasing,
   mix,
+  MotionConfig,
+  MotionConfigContext,
+  MotionContext,
+  MotionGlobalConfig,
   motionValue,
   optimizedAppearDataAttribute,
   pipe,
+  PresenceContext,
   progress,
   px,
+  Reorder,
   resolveMotionValue,
   reverseEasing,
   scroll,
@@ -99,6 +96,7 @@ import {
   stagger,
   startOptimizedAppearAnimation,
   steps,
+  SwitchLayoutGroupContext,
   sync,
   transform,
   unwrapMotionComponent,
@@ -113,11 +111,11 @@ import {
   useDragControls,
   useElementScroll,
   useForceUpdate,
-  useInView,
   useInstantLayoutTransition,
   useInstantTransition,
-  useIsPresent,
+  useInView,
   useIsomorphicLayoutEffect,
+  useIsPresent,
   useMotionTemplate,
   useMotionValue,
   useMotionValueEvent,
@@ -132,6 +130,7 @@ import {
   useVelocity,
   useViewportScroll,
   useWillChange,
+  VisualElement,
   visualElementStore,
   warning,
   wrap

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  AcceleratedAnimation,\n  AnimatePresence,\n  AnimateSharedLayout,\n  DeprecatedLayoutGroupContext,\n  DragControls,\n  FlatTree,\n  LayoutGroup,\n  LayoutGroupContext,\n  LazyMotion,\n  MotionConfig,\n  MotionConfigContext,\n  MotionContext,\n  MotionGlobalConfig,\n  PresenceContext,\n  Reorder as MotionReorder,\n  SwitchLayoutGroupContext,\n  VisualElement,\n  addPointerInfo,\n  addScaleCorrector,\n  animate,\n  animateValue,\n  animateVisualElement,\n  animationControls,\n  animations,\n  anticipate,\n  backIn,\n  backInOut,\n  backOut,\n  buildTransform,\n  calcLength,\n  cancelFrame,\n  cancelSync,\n  circIn,\n  circInOut,\n  circOut,\n  clamp,\n  color,\n  complex,\n  createBox,\n  createDomMotionComponent,\n  createMotionComponent,\n  createScopedAnimate,\n  cubicBezier,\n  delay,\n  disableInstantTransitions,\n  distance,\n  distance2D,\n  domAnimation,\n  domMax,\n  easeIn,\n  easeInOut,\n  easeOut,\n  filterProps,\n  frame,\n  frameData,\n  inView,\n  interpolate,\n  invariant,\n  isBrowser,\n  isDragActive,\n  isMotionComponent,\n  isMotionValue,\n  isValidMotionProp,\n  m,\n  makeUseVisualState,\n  mirrorEasing,\n  mix,\n  motionValue,\n  optimizedAppearDataAttribute,\n  pipe,\n  progress,\n  px,\n  resolveMotionValue,\n  reverseEasing,\n  scroll,\n  scrollInfo,\n  spring,\n  stagger,\n  startOptimizedAppearAnimation,\n  steps,\n  sync,\n  transform,\n  unwrapMotionComponent,\n  useAnimate,\n  useAnimation as useMotionAnimation,\n  useAnimationControls,\n  useAnimationFrame,\n  useCycle,\n  useDeprecatedAnimatedState,\n  useDeprecatedInvertedScale,\n  useDomEvent,\n  useDragControls,\n  useElementScroll,\n  useForceUpdate,\n  useInView,\n  useInstantLayoutTransition,\n  useInstantTransition,\n  useIsPresent,\n  useIsomorphicLayoutEffect,\n  useMotionTemplate,\n  useMotionValue,\n  useMotionValueEvent,\n  usePresence,\n  useReducedMotion,\n  useReducedMotionConfig,\n  useResetProjection,\n  useScroll,\n  useSpring,\n  useTime,\n  useTransform,\n  useVelocity,\n  useViewportScroll,\n  useWillChange,\n  visualElementStore,\n  warning,\n  wrap,\n} from \"framer-motion\"\nexport * from \"./forward-ref\"\nexport { Motion } from \"./motion\"\nexport * from \"./motion.types\"\nexport * from \"./utils\"\nexport * from \"./factory\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export * from \"./factory\"\nexport * from \"./forward-ref\"\nexport { Motion } from \"./motion\"\nexport type * from \"./motion.types\"\nexport * from \"./utils\"\nexport {\n  AcceleratedAnimation,\n  addPointerInfo,\n  addScaleCorrector,\n  animate,\n  AnimatePresence,\n  AnimateSharedLayout,\n  animateValue,\n  animateVisualElement,\n  animationControls,\n  animations,\n  anticipate,\n  backIn,\n  backInOut,\n  backOut,\n  buildTransform,\n  calcLength,\n  cancelFrame,\n  cancelSync,\n  circIn,\n  circInOut,\n  circOut,\n  clamp,\n  color,\n  complex,\n  createBox,\n  createDomMotionComponent,\n  createMotionComponent,\n  createScopedAnimate,\n  cubicBezier,\n  delay,\n  DeprecatedLayoutGroupContext,\n  disableInstantTransitions,\n  distance,\n  distance2D,\n  domAnimation,\n  domMax,\n  DragControls,\n  easeIn,\n  easeInOut,\n  easeOut,\n  filterProps,\n  FlatTree,\n  frame,\n  frameData,\n  interpolate,\n  invariant,\n  inView,\n  isBrowser,\n  isDragActive,\n  isMotionComponent,\n  isMotionValue,\n  isValidMotionProp,\n  LayoutGroup,\n  LayoutGroupContext,\n  LazyMotion,\n  m,\n  makeUseVisualState,\n  mirrorEasing,\n  mix,\n  MotionConfig,\n  MotionConfigContext,\n  MotionContext,\n  MotionGlobalConfig,\n  motionValue,\n  optimizedAppearDataAttribute,\n  pipe,\n  PresenceContext,\n  progress,\n  px,\n  Reorder as MotionReorder,\n  resolveMotionValue,\n  reverseEasing,\n  scroll,\n  scrollInfo,\n  spring,\n  stagger,\n  startOptimizedAppearAnimation,\n  steps,\n  SwitchLayoutGroupContext,\n  sync,\n  transform,\n  unwrapMotionComponent,\n  useAnimate,\n  useAnimation as useMotionAnimation,\n  useAnimationControls,\n  useAnimationFrame,\n  useCycle,\n  useDeprecatedAnimatedState,\n  useDeprecatedInvertedScale,\n  useDomEvent,\n  useDragControls,\n  useElementScroll,\n  useForceUpdate,\n  useInstantLayoutTransition,\n  useInstantTransition,\n  useInView,\n  useIsomorphicLayoutEffect,\n  useIsPresent,\n  useMotionTemplate,\n  useMotionValue,\n  useMotionValueEvent,\n  usePresence,\n  useReducedMotion,\n  useReducedMotionConfig,\n  useResetProjection,\n  useScroll,\n  useSpring,\n  useTime,\n  useTransform,\n  useVelocity,\n  useViewportScroll,\n  useWillChange,\n  VisualElement,\n  visualElementStore,\n  warning,\n  wrap,\n} from \"framer-motion\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAKA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":[]}

package/dist/motion.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/motion.tsx","../src/forward-ref.tsx"],"sourcesContent":["import { ui } from \"@yamada-ui/core\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { motion } from \"framer-motion\"\nimport { motionForwardRef } from \"./forward-ref\"\nimport type { MotionProps } from \"./motion.types\"\n\nconst disableStyleProps = [\"transition\"]\n\nconst disableStyleProp = (prop: string) => disableStyleProps.includes(prop)\n\nconst Component = ui<\"div\", Dict>(\"div\", { disableStyleProp })\n\n/**\n * `Motion` is a component that allows for the easy implementation of a wide variety of animations.\n *\n * @see Docs https://yamada-ui.com/components/other/motion\n */\nexport const Motion = motionForwardRef<MotionProps, \"div\">(\n  ({ as = \"div\", className, ...rest }, ref) => (\n    <Component\n      ref={ref}\n      as={motion[as]}\n      className={cx(\"ui-motion\", className)}\n      {...rest}\n    />\n  ),\n)\n","import type { WithoutAs } from \"@yamada-ui/core\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport * as React from \"react\"\nimport type { MotionComponent, MotionAs } from \"./motion.types\"\n\nexport function motionForwardRef<Y extends object, M extends MotionAs>(\n  render: React.ForwardRefRenderFunction<\n    any,\n    Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & { as?: MotionAs }\n  >,\n) {\n  return React.forwardRef(\n    render as React.ForwardRefRenderFunction<any>,\n  ) as unknown as MotionComponent<M, Y>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAmB;AAEnB,mBAAmB;AACnB,2BAAuB;;;ACDvB,YAAuB;AAGhB,SAAS,iBACd,QAIA;AACA,SAAa;AAAA,IACX;AAAA,EACF;AACF;;;ADMI;AAbJ,IAAM,oBAAoB,CAAC,YAAY;AAEvC,IAAM,mBAAmB,CAAC,SAAiB,kBAAkB,SAAS,IAAI;AAE1E,IAAM,gBAAY,gBAAgB,OAAO,EAAE,iBAAiB,CAAC;AAOtD,IAAM,SAAS;AAAA,EACpB,CAAC,EAAE,KAAK,OAAO,WAAW,GAAG,KAAK,GAAG,QACnC;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI,4BAAO,EAAE;AAAA,MACb,eAAW,iBAAG,aAAa,SAAS;AAAA,MACnC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
+{"version":3,"sources":["../src/motion.tsx","../src/forward-ref.tsx"],"sourcesContent":["import type { Dict } from \"@yamada-ui/utils\"\nimport type { MotionProps } from \"./motion.types\"\nimport { ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { motion } from \"framer-motion\"\nimport { motionForwardRef } from \"./forward-ref\"\n\nconst disableStyleProps = [\"transition\"]\n\nconst disableStyleProp = (prop: string) => disableStyleProps.includes(prop)\n\nconst Component = ui<\"div\", Dict>(\"div\", { disableStyleProp })\n\n/**\n * `Motion` is a component that allows for the easy implementation of a wide variety of animations.\n *\n * @see Docs https://yamada-ui.com/components/other/motion\n */\nexport const Motion = motionForwardRef<MotionProps, \"div\">(\n  ({ as = \"div\", className, ...rest }, ref) => (\n    <Component\n      ref={ref}\n      as={motion[as]}\n      className={cx(\"ui-motion\", className)}\n      {...rest}\n    />\n  ),\n)\n","import type { WithoutAs } from \"@yamada-ui/core\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { MotionAs, MotionComponent } from \"./motion.types\"\nimport * as React from \"react\"\n\nexport function motionForwardRef<Y extends object, M extends MotionAs>(\n  render: React.ForwardRefRenderFunction<\n    any,\n    { as?: MotionAs } & Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>>\n  >,\n) {\n  return React.forwardRef(\n    render as React.ForwardRefRenderFunction<any>,\n  ) as unknown as MotionComponent<M, Y>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,kBAAmB;AACnB,mBAAmB;AACnB,2BAAuB;;;ACDvB,YAAuB;AAEhB,SAAS,iBACd,QAIA;AACA,SAAa;AAAA,IACX;AAAA,EACF;AACF;;;ADMI;AAbJ,IAAM,oBAAoB,CAAC,YAAY;AAEvC,IAAM,mBAAmB,CAAC,SAAiB,kBAAkB,SAAS,IAAI;AAE1E,IAAM,gBAAY,gBAAgB,OAAO,EAAE,iBAAiB,CAAC;AAOtD,IAAM,SAAS;AAAA,EACpB,CAAC,EAAE,KAAK,OAAO,WAAW,GAAG,KAAK,GAAG,QACnC;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI,4BAAO,EAAE;AAAA,MACb,eAAW,iBAAG,aAAa,SAAS;AAAA,MACnC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/motion.mjs

@@ -1,8 +1,8 @@
 "use client"
 import {
   Motion
-} from "./chunk-M6WLOAFU.mjs";
-import "./chunk-IBE7Q3Z3.mjs";
+} from "./chunk-2V3EH5L5.mjs";
+import "./chunk-RXCU3ZFK.mjs";
 export {
   Motion
 };

package/dist/motion.types.d.mts

@@ -7,12 +7,12 @@ import * as React from 'react';
 interface MotionFactory {
     <T extends MotionAs = MotionAs, M extends object = {}>(el: T, options?: StyledOptions): UIMotionComponent<T, M>;
 }
-type ComponentConditionalProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = Y extends M ? OmitProps<React.ComponentProps<Y>, D> : OmitProps<React.ComponentProps<Y>, D> | OmitProps<React.ComponentProps<M>, D>;
-type ComponentProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = ComponentConditionalProps<Y, M, D> & {
+type ComponentConditionalProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = Y extends M ? OmitProps<React.ComponentProps<Y>, D> : OmitProps<React.ComponentProps<M>, D> | OmitProps<React.ComponentProps<Y>, D>;
+type ComponentProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = {
     as?: M;
-};
+} & ComponentConditionalProps<Y, M, D>;
 interface MotionComponent<Y extends MotionAs, D extends object = {}> extends ComponentArgs {
-    <M extends MotionAs = Y>(props: ComponentProps<Y, M, D>): JSX.Element;
+    <M extends MotionAs = Y>(props: ComponentProps<Y, M, D>): React.ReactElement;
 }
 type MotionAs = keyof DOMMotionComponents;
 type MotionComponents = {
@@ -29,7 +29,7 @@ type DOMAttributes<Y extends React.HTMLAttributes<M> | React.SVGAttributes<SVGEl
 type MotionProps<Y extends MotionAs = "div"> = Merge<DOMAttributes<FactoryAttributes<React.ReactDOM[Y]>, FactoryElement<React.ReactDOM[Y]>>, UIMotionProps>;
 type MotionPropsWithoutAs<Y extends MotionAs = "div"> = WithoutAs<MotionProps<Y>>;
 type MotionPropsWithoutChildren<Y extends MotionAs = "div"> = Omit<MotionProps<Y>, "children">;
-type TargetResolver<Y = Dict> = (props: Y & MotionTransitionProps) => TargetAndTransition;
+type TargetResolver<Y = Dict> = (props: MotionTransitionProps & Y) => TargetAndTransition;
 type Variant<Y = Dict> = TargetAndTransition | TargetResolver<Y>;
 interface MotionTransitionVariants<Y = Dict> {
     enter: Variant<Y>;
@@ -40,22 +40,14 @@ type MotionLifecycleProps<Y> = {
     [key in "enter" | "exit"]?: Y;
 };
 interface MotionTransitionProps {
-    /**
-     * Custom `transition` definition for `enter` and `exit`.
-     */
-    transition?: MotionLifecycleProps<Transition>;
-    /**
-     * Custom `transitionEnd` definition for `enter` and `exit`.
-     */
-    transitionEnd?: MotionLifecycleProps<Target>;
     /**
      * Custom `delay` definition for `enter` and `exit`.
      */
-    delay?: number | MotionLifecycleProps<number>;
+    delay?: MotionLifecycleProps<number> | number;
     /**
      * Custom `duration` definition for `enter` and `exit`.
      */
-    duration?: number | MotionLifecycleProps<number>;
+    duration?: MotionLifecycleProps<number> | number;
     /**
      * Custom `enter`.
      */
@@ -68,16 +60,24 @@ interface MotionTransitionProps {
      * Custom `initial`.
      */
     initial?: any;
-}
-type WithTransitionProps<Y extends object> = Omit<Y, "variants" | "transition"> & MotionTransitionProps & {
     /**
-     * If `true`, the element will unmount when `isOpen={false}` and animation is done.
+     * Custom `transition` definition for `enter` and `exit`.
      */
-    unmountOnExit?: boolean;
+    transition?: MotionLifecycleProps<Transition>;
+    /**
+     * Custom `transitionEnd` definition for `enter` and `exit`.
+     */
+    transitionEnd?: MotionLifecycleProps<Target>;
+}
+type WithTransitionProps<Y extends object> = {
     /**
      * Show the component. triggers when enter or exit states.
      */
     isOpen?: boolean;
-};
+    /**
+     * If `true`, the element will unmount when `isOpen={false}` and animation is done.
+     */
+    unmountOnExit?: boolean;
+} & MotionTransitionProps & Omit<Y, "transition" | "variants">;
 
 export type { MotionAs, MotionComponent, MotionComponents, MotionFactory, MotionProps, MotionPropsWithoutAs, MotionPropsWithoutChildren, MotionTransitionProps, MotionTransitionVariants, UIMotionComponent, WithTransitionProps };

package/dist/motion.types.d.ts

@@ -7,12 +7,12 @@ import * as React from 'react';
 interface MotionFactory {
     <T extends MotionAs = MotionAs, M extends object = {}>(el: T, options?: StyledOptions): UIMotionComponent<T, M>;
 }
-type ComponentConditionalProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = Y extends M ? OmitProps<React.ComponentProps<Y>, D> : OmitProps<React.ComponentProps<Y>, D> | OmitProps<React.ComponentProps<M>, D>;
-type ComponentProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = ComponentConditionalProps<Y, M, D> & {
+type ComponentConditionalProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = Y extends M ? OmitProps<React.ComponentProps<Y>, D> : OmitProps<React.ComponentProps<M>, D> | OmitProps<React.ComponentProps<Y>, D>;
+type ComponentProps<Y extends MotionAs, M extends MotionAs, D extends object = {}> = {
     as?: M;
-};
+} & ComponentConditionalProps<Y, M, D>;
 interface MotionComponent<Y extends MotionAs, D extends object = {}> extends ComponentArgs {
-    <M extends MotionAs = Y>(props: ComponentProps<Y, M, D>): JSX.Element;
+    <M extends MotionAs = Y>(props: ComponentProps<Y, M, D>): React.ReactElement;
 }
 type MotionAs = keyof DOMMotionComponents;
 type MotionComponents = {
@@ -29,7 +29,7 @@ type DOMAttributes<Y extends React.HTMLAttributes<M> | React.SVGAttributes<SVGEl
 type MotionProps<Y extends MotionAs = "div"> = Merge<DOMAttributes<FactoryAttributes<React.ReactDOM[Y]>, FactoryElement<React.ReactDOM[Y]>>, UIMotionProps>;
 type MotionPropsWithoutAs<Y extends MotionAs = "div"> = WithoutAs<MotionProps<Y>>;
 type MotionPropsWithoutChildren<Y extends MotionAs = "div"> = Omit<MotionProps<Y>, "children">;
-type TargetResolver<Y = Dict> = (props: Y & MotionTransitionProps) => TargetAndTransition;
+type TargetResolver<Y = Dict> = (props: MotionTransitionProps & Y) => TargetAndTransition;
 type Variant<Y = Dict> = TargetAndTransition | TargetResolver<Y>;
 interface MotionTransitionVariants<Y = Dict> {
     enter: Variant<Y>;
@@ -40,22 +40,14 @@ type MotionLifecycleProps<Y> = {
     [key in "enter" | "exit"]?: Y;
 };
 interface MotionTransitionProps {
-    /**
-     * Custom `transition` definition for `enter` and `exit`.
-     */
-    transition?: MotionLifecycleProps<Transition>;
-    /**
-     * Custom `transitionEnd` definition for `enter` and `exit`.
-     */
-    transitionEnd?: MotionLifecycleProps<Target>;
     /**
      * Custom `delay` definition for `enter` and `exit`.
      */
-    delay?: number | MotionLifecycleProps<number>;
+    delay?: MotionLifecycleProps<number> | number;
     /**
      * Custom `duration` definition for `enter` and `exit`.
      */
-    duration?: number | MotionLifecycleProps<number>;
+    duration?: MotionLifecycleProps<number> | number;
     /**
      * Custom `enter`.
      */
@@ -68,16 +60,24 @@ interface MotionTransitionProps {
      * Custom `initial`.
      */
     initial?: any;
-}
-type WithTransitionProps<Y extends object> = Omit<Y, "variants" | "transition"> & MotionTransitionProps & {
     /**
-     * If `true`, the element will unmount when `isOpen={false}` and animation is done.
+     * Custom `transition` definition for `enter` and `exit`.
      */
-    unmountOnExit?: boolean;
+    transition?: MotionLifecycleProps<Transition>;
+    /**
+     * Custom `transitionEnd` definition for `enter` and `exit`.
+     */
+    transitionEnd?: MotionLifecycleProps<Target>;
+}
+type WithTransitionProps<Y extends object> = {
     /**
      * Show the component. triggers when enter or exit states.
      */
     isOpen?: boolean;
-};
+    /**
+     * If `true`, the element will unmount when `isOpen={false}` and animation is done.
+     */
+    unmountOnExit?: boolean;
+} & MotionTransitionProps & Omit<Y, "transition" | "variants">;
 
 export type { MotionAs, MotionComponent, MotionComponents, MotionFactory, MotionProps, MotionPropsWithoutAs, MotionPropsWithoutChildren, MotionTransitionProps, MotionTransitionVariants, UIMotionComponent, WithTransitionProps };

package/dist/motion.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/motion.types.ts"],"sourcesContent":["import type {\n  ComponentArgs,\n  OmitProps,\n  StyledOptions,\n  UIProps,\n  WithoutAs,\n} from \"@yamada-ui/core\"\nimport type { Dict, Merge } from \"@yamada-ui/utils\"\nimport type {\n  DOMMotionComponents,\n  Target,\n  TargetAndTransition,\n  Transition,\n  MotionProps as OriginMotionProps,\n} from \"framer-motion\"\nimport type * as React from \"react\"\n\nexport type {\n  MotionValue,\n  AbsoluteKeyframe as MotionAbsoluteKeyframe,\n  AnimatePresenceProps as MotionAnimatePresenceProps,\n  AnimationControls as MotionAnimationControls,\n  AnimationDefinition as MotionAnimationDefinition,\n  AnimationLifecycles as MotionAnimationLifecycles,\n  AnimationOptionsWithValueOverrides as MotionAnimationOptionsWithValueOverrides,\n  AnimationPlaybackControls as MotionAnimationPlaybackControls,\n  AnimationPlaybackLifecycles as MotionAnimationPlaybackLifecycles,\n  AnimationPlaybackOptions as MotionAnimationPlaybackOptions,\n  AnimationProps as MotionAnimationProps,\n  AnimationScope as MotionAnimationScope,\n  AnimationSequence as MotionAnimationSequence,\n  AnimationType as MotionAnimationType,\n  At as MotionAt,\n  Axis as MotionAxis,\n  AxisDelta as MotionAxisDelta,\n  BezierDefinition as MotionBezierDefinition,\n  BoundingBox as MotionBoundingBox,\n  Box as MotionBox,\n  CSSStyleDeclarationWithTransform,\n  CreateVisualElement as MotionCreateVisualElement,\n  CustomDomComponent as MotionCustomDomComponent,\n  CustomValueType as MotionCustomValueType,\n  Cycle as MotionCycle,\n  CycleState as MotionCycleState,\n  DOMKeyframesDefinition as MotionDOMKeyframesDefinition,\n  DOMMotionComponents,\n  DOMSegment as MotionDOMSegment,\n  DOMSegmentWithTransition as MotionDOMSegmentWithTransition,\n  DecayOptions as MotionDecayOptions,\n  DelayedFunction as MotionDelayedFunction,\n  Delta as MotionDelta,\n  DevMessage as MotionDevMessage,\n  DragElastic as MotionDragElastic,\n  DragHandlers as MotionDragHandlers,\n  DraggableProps as MotionDraggableProps,\n  DurationSpringOptions as MotionDurationSpringOptions,\n  DynamicAnimationOptions as MotionDynamicAnimationOptions,\n  DynamicOption as MotionDynamicOption,\n  Easing as MotionEasing,\n  EasingDefinition as MotionEasingDefinition,\n  EasingFunction as MotionEasingFunction,\n  EasingModifier as MotionEasingModifier,\n  ElementOrSelector as MotionElementOrSelector,\n  EventInfo as MotionEventInfo,\n  FeatureBundle as MotionFeatureBundle,\n  FeatureDefinition as MotionFeatureDefinition,\n  FeatureDefinitions as MotionFeatureDefinitions,\n  FeaturePackage as MotionFeaturePackage,\n  FeaturePackages as MotionFeaturePackages,\n  FocusHandlers as MotionFocusHandlers,\n  HoverHandlers as MotionHoverHandlers,\n  HydratedFeatureDefinition as MotionHydratedFeatureDefinition,\n  HydratedFeatureDefinitions as MotionHydratedFeatureDefinitions,\n  HTMLMotionProps,\n  IProjectionNode as MotionIProjectionNode,\n  Inertia as MotionInertia,\n  InertiaOptions as MotionInertiaOptions,\n  InterpolateOptions as MotionInterpolateOptions,\n  KeyframeOptions as MotionKeyframeOptions,\n  Keyframes as MotionKeyframes,\n  KeyframesTarget as MotionKeyframesTarget,\n  LayoutProps as MotionLayoutProps,\n  LazyFeatureBundle as MotionLazyFeatureBundle,\n  LazyProps as MotionLazyProps,\n  MixerFactory as MotionMixerFactory,\n  MotionAdvancedProps,\n  MotionConfigProps,\n  MotionStyle,\n  MotionTransform,\n  MotionValueSegment,\n  MotionValueSegmentWithTransition,\n  None as MotionNone,\n  Orchestration as MotionOrchestration,\n  PanHandlers as MotionPanHandlers,\n  PanInfo as MotionPanInfo,\n  PassiveEffect as MotionPassiveEffect,\n  Point as MotionPoint,\n  RelayoutInfo as MotionRelayoutInfo,\n  RenderComponent as MotionRenderComponent,\n  Repeat as MotionRepeat,\n  RepeatType as MotionRepeatType,\n  ResolveKeyframes as MotionResolveKeyframes,\n  ResolveLayoutTransition as MotionResolveLayoutTransition,\n  ResolvedAnimationDefinition as MotionResolvedAnimationDefinition,\n  ResolvedAnimationDefinitions as MotionResolvedAnimationDefinitions,\n  ResolvedKeyframesTarget as MotionResolvedKeyframesTarget,\n  ResolvedSingleTarget as MotionResolvedSingleTarget,\n  ResolvedValueTarget as MotionResolvedValueTarget,\n  ResolvedValues as MotionResolvedValues,\n  SVGAttributesAsMotionValues,\n  SVGKeyframesDefinition,\n  SVGMotionProps,\n  SVGPathKeyframesDefinition,\n  SVGPathTransitions,\n  SVGTransitions,\n  ScrapeMotionValuesFromProps,\n  ScrollMotionValues,\n  Segment as MotionSegment,\n  SequenceLabel as MotionSequenceLabel,\n  SequenceLabelWithTime as MotionSequenceLabelWithTime,\n  SequenceMap as MotionSequenceMap,\n  SequenceOptions as MotionSequenceOptions,\n  SequenceTime as MotionSequenceTime,\n  SingleTarget as MotionSingleTarget,\n  Spring as MotionSpring,\n  SpringOptions as MotionSpringOptions,\n  StyleKeyframesDefinition as MotionStyleKeyframesDefinition,\n  StyleTransitions as MotionStyleTransitions,\n  Subscriber as MotionSubscriber,\n  TapHandlers as MotionTapHandlers,\n  TapInfo as MotionTapInfo,\n  Target as MotionTarget,\n  TargetAndTransition as MotionTargetAndTransition,\n  TransformPoint as MotionTransformPoint,\n  Transition as MotionTransition,\n  Tween as MotionTween,\n  UnresolvedValueKeyframe as MotionUnresolvedValueKeyframe,\n  UseInViewOptions as MotionUseInViewOptions,\n  ValueAnimationOptions as MotionValueAnimationOptions,\n  ValueAnimationTransition as MotionValueAnimationTransition,\n  ValueKeyframe as MotionValueKeyframe,\n  ValueKeyframesDefinition as MotionValueKeyframesDefinition,\n  ValueSequence as MotionValueSequence,\n  ValueTarget as MotionValueTarget,\n  ValueType as MotionValueType,\n  VariableKeyframesDefinition as MotionVariableKeyframesDefinition,\n  VariableTransitions as MotionVariableTransitions,\n  Variant as MotionVariant,\n  VariantLabels as MotionVariantLabels,\n  Variants as MotionVariants,\n  VelocityOptions as MotionVelocityOptions,\n  VisualState as MotionVisualState,\n} from \"framer-motion\"\n\nexport interface MotionFactory {\n  <T extends MotionAs = MotionAs, M extends object = {}>(\n    el: T,\n    options?: StyledOptions,\n  ): UIMotionComponent<T, M>\n}\n\ntype ComponentConditionalProps<\n  Y extends MotionAs,\n  M extends MotionAs,\n  D extends object = {},\n> = Y extends M\n  ? OmitProps<React.ComponentProps<Y>, D>\n  :\n      | OmitProps<React.ComponentProps<Y>, D>\n      | OmitProps<React.ComponentProps<M>, D>\n\ntype ComponentProps<\n  Y extends MotionAs,\n  M extends MotionAs,\n  D extends object = {},\n> = ComponentConditionalProps<Y, M, D> & {\n  as?: M\n}\n\nexport interface MotionComponent<Y extends MotionAs, D extends object = {}>\n  extends ComponentArgs {\n  <M extends MotionAs = Y>(props: ComponentProps<Y, M, D>): JSX.Element\n}\n\nexport type MotionAs = keyof DOMMotionComponents\n\nexport type MotionComponents = {\n  [Y in MotionAs]: UIMotionComponent<Y>\n}\n\nexport interface UIMotionComponent<Y extends MotionAs, M extends object = {}>\n  extends MotionComponent<Y, Merge<UIMotionProps, M>> {}\n\ninterface UIMotionProps extends Merge<UIProps, OriginMotionProps> {\n  as?: MotionAs\n}\n\ntype FactoryAttributes<Y> =\n  Y extends React.DetailedHTMLFactory<infer M, any>\n    ? M\n    : Y extends React.SVGFactory\n      ? React.SVGAttributes<SVGElement>\n      : never\ntype FactoryElement<Y> =\n  Y extends React.DetailedHTMLFactory<any, infer M>\n    ? M\n    : Y extends React.SVGFactory\n      ? SVGElement\n      : never\ntype DOMAttributes<\n  Y extends React.HTMLAttributes<M> | React.SVGAttributes<SVGElement>,\n  M extends HTMLElement | SVGElement,\n> = Y\n\nexport type MotionProps<Y extends MotionAs = \"div\"> = Merge<\n  DOMAttributes<\n    FactoryAttributes<React.ReactDOM[Y]>,\n    FactoryElement<React.ReactDOM[Y]>\n  >,\n  UIMotionProps\n>\n\nexport type MotionPropsWithoutAs<Y extends MotionAs = \"div\"> = WithoutAs<\n  MotionProps<Y>\n>\n\nexport type MotionPropsWithoutChildren<Y extends MotionAs = \"div\"> = Omit<\n  MotionProps<Y>,\n  \"children\"\n>\n\ntype TargetResolver<Y = Dict> = (\n  props: Y & MotionTransitionProps,\n) => TargetAndTransition\n\ntype Variant<Y = Dict> = TargetAndTransition | TargetResolver<Y>\n\nexport interface MotionTransitionVariants<Y = Dict> {\n  enter: Variant<Y>\n  exit: Variant<Y>\n  initial?: Variant<Y>\n}\n\ntype MotionLifecycleProps<Y> = { [key in \"enter\" | \"exit\"]?: Y }\n\nexport interface MotionTransitionProps {\n  /**\n   * Custom `transition` definition for `enter` and `exit`.\n   */\n  transition?: MotionLifecycleProps<Transition>\n  /**\n   * Custom `transitionEnd` definition for `enter` and `exit`.\n   */\n  transitionEnd?: MotionLifecycleProps<Target>\n  /**\n   * Custom `delay` definition for `enter` and `exit`.\n   */\n  delay?: number | MotionLifecycleProps<number>\n  /**\n   * Custom `duration` definition for `enter` and `exit`.\n   */\n  duration?: number | MotionLifecycleProps<number>\n  /**\n   * Custom `enter`.\n   */\n  enter?: any\n  /**\n   * Custom `exit`.\n   */\n  exit?: any\n  /**\n   * Custom `initial`.\n   */\n  initial?: any\n}\n\nexport type WithTransitionProps<Y extends object> = Omit<\n  Y,\n  \"variants\" | \"transition\"\n> &\n  MotionTransitionProps & {\n    /**\n     * If `true`, the element will unmount when `isOpen={false}` and animation is done.\n     */\n    unmountOnExit?: boolean\n    /**\n     * Show the component. triggers when enter or exit states.\n     */\n    isOpen?: boolean\n  }\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
+{"version":3,"sources":["../src/motion.types.ts"],"sourcesContent":["import type {\n  ComponentArgs,\n  OmitProps,\n  StyledOptions,\n  UIProps,\n  WithoutAs,\n} from \"@yamada-ui/core\"\nimport type { Dict, Merge } from \"@yamada-ui/utils\"\nimport type {\n  DOMMotionComponents,\n  MotionProps as OriginMotionProps,\n  Target,\n  TargetAndTransition,\n  Transition,\n} from \"framer-motion\"\nimport type * as React from \"react\"\n\nexport type {\n  AbsoluteKeyframe as MotionAbsoluteKeyframe,\n  AnimatePresenceProps as MotionAnimatePresenceProps,\n  AnimationControls as MotionAnimationControls,\n  AnimationDefinition as MotionAnimationDefinition,\n  AnimationLifecycles as MotionAnimationLifecycles,\n  AnimationOptionsWithValueOverrides as MotionAnimationOptionsWithValueOverrides,\n  AnimationPlaybackControls as MotionAnimationPlaybackControls,\n  AnimationPlaybackLifecycles as MotionAnimationPlaybackLifecycles,\n  AnimationPlaybackOptions as MotionAnimationPlaybackOptions,\n  AnimationProps as MotionAnimationProps,\n  AnimationScope as MotionAnimationScope,\n  AnimationSequence as MotionAnimationSequence,\n  AnimationType as MotionAnimationType,\n  At as MotionAt,\n  Axis as MotionAxis,\n  AxisDelta as MotionAxisDelta,\n  BezierDefinition as MotionBezierDefinition,\n  BoundingBox as MotionBoundingBox,\n  Box as MotionBox,\n  CreateVisualElement as MotionCreateVisualElement,\n  CSSStyleDeclarationWithTransform,\n  CustomDomComponent as MotionCustomDomComponent,\n  CustomValueType as MotionCustomValueType,\n  Cycle as MotionCycle,\n  CycleState as MotionCycleState,\n  DecayOptions as MotionDecayOptions,\n  DelayedFunction as MotionDelayedFunction,\n  Delta as MotionDelta,\n  DevMessage as MotionDevMessage,\n  DOMKeyframesDefinition as MotionDOMKeyframesDefinition,\n  DOMMotionComponents,\n  DOMSegment as MotionDOMSegment,\n  DOMSegmentWithTransition as MotionDOMSegmentWithTransition,\n  DragElastic as MotionDragElastic,\n  DraggableProps as MotionDraggableProps,\n  DragHandlers as MotionDragHandlers,\n  DurationSpringOptions as MotionDurationSpringOptions,\n  DynamicAnimationOptions as MotionDynamicAnimationOptions,\n  DynamicOption as MotionDynamicOption,\n  Easing as MotionEasing,\n  EasingDefinition as MotionEasingDefinition,\n  EasingFunction as MotionEasingFunction,\n  EasingModifier as MotionEasingModifier,\n  ElementOrSelector as MotionElementOrSelector,\n  EventInfo as MotionEventInfo,\n  FeatureBundle as MotionFeatureBundle,\n  FeatureDefinition as MotionFeatureDefinition,\n  FeatureDefinitions as MotionFeatureDefinitions,\n  FeaturePackage as MotionFeaturePackage,\n  FeaturePackages as MotionFeaturePackages,\n  FocusHandlers as MotionFocusHandlers,\n  HoverHandlers as MotionHoverHandlers,\n  HTMLMotionProps,\n  HydratedFeatureDefinition as MotionHydratedFeatureDefinition,\n  HydratedFeatureDefinitions as MotionHydratedFeatureDefinitions,\n  Inertia as MotionInertia,\n  InertiaOptions as MotionInertiaOptions,\n  InterpolateOptions as MotionInterpolateOptions,\n  IProjectionNode as MotionIProjectionNode,\n  KeyframeOptions as MotionKeyframeOptions,\n  Keyframes as MotionKeyframes,\n  KeyframesTarget as MotionKeyframesTarget,\n  LayoutProps as MotionLayoutProps,\n  LazyFeatureBundle as MotionLazyFeatureBundle,\n  LazyProps as MotionLazyProps,\n  MixerFactory as MotionMixerFactory,\n  MotionAdvancedProps,\n  MotionConfigProps,\n  MotionStyle,\n  MotionTransform,\n  MotionValue,\n  MotionValueSegment,\n  MotionValueSegmentWithTransition,\n  None as MotionNone,\n  Orchestration as MotionOrchestration,\n  PanHandlers as MotionPanHandlers,\n  PanInfo as MotionPanInfo,\n  PassiveEffect as MotionPassiveEffect,\n  Point as MotionPoint,\n  RelayoutInfo as MotionRelayoutInfo,\n  RenderComponent as MotionRenderComponent,\n  Repeat as MotionRepeat,\n  RepeatType as MotionRepeatType,\n  ResolvedAnimationDefinition as MotionResolvedAnimationDefinition,\n  ResolvedAnimationDefinitions as MotionResolvedAnimationDefinitions,\n  ResolvedKeyframesTarget as MotionResolvedKeyframesTarget,\n  ResolvedSingleTarget as MotionResolvedSingleTarget,\n  ResolvedValues as MotionResolvedValues,\n  ResolvedValueTarget as MotionResolvedValueTarget,\n  ResolveKeyframes as MotionResolveKeyframes,\n  ResolveLayoutTransition as MotionResolveLayoutTransition,\n  ScrapeMotionValuesFromProps,\n  ScrollMotionValues,\n  Segment as MotionSegment,\n  SequenceLabel as MotionSequenceLabel,\n  SequenceLabelWithTime as MotionSequenceLabelWithTime,\n  SequenceMap as MotionSequenceMap,\n  SequenceOptions as MotionSequenceOptions,\n  SequenceTime as MotionSequenceTime,\n  SingleTarget as MotionSingleTarget,\n  Spring as MotionSpring,\n  SpringOptions as MotionSpringOptions,\n  StyleKeyframesDefinition as MotionStyleKeyframesDefinition,\n  StyleTransitions as MotionStyleTransitions,\n  Subscriber as MotionSubscriber,\n  SVGAttributesAsMotionValues,\n  SVGKeyframesDefinition,\n  SVGMotionProps,\n  SVGPathKeyframesDefinition,\n  SVGPathTransitions,\n  SVGTransitions,\n  TapHandlers as MotionTapHandlers,\n  TapInfo as MotionTapInfo,\n  Target as MotionTarget,\n  TargetAndTransition as MotionTargetAndTransition,\n  TransformPoint as MotionTransformPoint,\n  Transition as MotionTransition,\n  Tween as MotionTween,\n  UnresolvedValueKeyframe as MotionUnresolvedValueKeyframe,\n  UseInViewOptions as MotionUseInViewOptions,\n  ValueAnimationOptions as MotionValueAnimationOptions,\n  ValueAnimationTransition as MotionValueAnimationTransition,\n  ValueKeyframe as MotionValueKeyframe,\n  ValueKeyframesDefinition as MotionValueKeyframesDefinition,\n  ValueSequence as MotionValueSequence,\n  ValueTarget as MotionValueTarget,\n  ValueType as MotionValueType,\n  VariableKeyframesDefinition as MotionVariableKeyframesDefinition,\n  VariableTransitions as MotionVariableTransitions,\n  Variant as MotionVariant,\n  VariantLabels as MotionVariantLabels,\n  Variants as MotionVariants,\n  VelocityOptions as MotionVelocityOptions,\n  VisualState as MotionVisualState,\n} from \"framer-motion\"\n\nexport interface MotionFactory {\n  <T extends MotionAs = MotionAs, M extends object = {}>(\n    el: T,\n    options?: StyledOptions,\n  ): UIMotionComponent<T, M>\n}\n\ntype ComponentConditionalProps<\n  Y extends MotionAs,\n  M extends MotionAs,\n  D extends object = {},\n> = Y extends M\n  ? OmitProps<React.ComponentProps<Y>, D>\n  :\n      | OmitProps<React.ComponentProps<M>, D>\n      | OmitProps<React.ComponentProps<Y>, D>\n\ntype ComponentProps<\n  Y extends MotionAs,\n  M extends MotionAs,\n  D extends object = {},\n> = {\n  as?: M\n} & ComponentConditionalProps<Y, M, D>\n\nexport interface MotionComponent<Y extends MotionAs, D extends object = {}>\n  extends ComponentArgs {\n  <M extends MotionAs = Y>(props: ComponentProps<Y, M, D>): React.ReactElement\n}\n\nexport type MotionAs = keyof DOMMotionComponents\n\nexport type MotionComponents = {\n  [Y in MotionAs]: UIMotionComponent<Y>\n}\n\nexport interface UIMotionComponent<Y extends MotionAs, M extends object = {}>\n  extends MotionComponent<Y, Merge<UIMotionProps, M>> {}\n\ninterface UIMotionProps extends Merge<UIProps, OriginMotionProps> {\n  as?: MotionAs\n}\n\ntype FactoryAttributes<Y> =\n  Y extends React.DetailedHTMLFactory<infer M, any>\n    ? M\n    : Y extends React.SVGFactory\n      ? React.SVGAttributes<SVGElement>\n      : never\ntype FactoryElement<Y> =\n  Y extends React.DetailedHTMLFactory<any, infer M>\n    ? M\n    : Y extends React.SVGFactory\n      ? SVGElement\n      : never\ntype DOMAttributes<\n  Y extends React.HTMLAttributes<M> | React.SVGAttributes<SVGElement>,\n  M extends HTMLElement | SVGElement,\n> = Y\n\nexport type MotionProps<Y extends MotionAs = \"div\"> = Merge<\n  DOMAttributes<\n    FactoryAttributes<React.ReactDOM[Y]>,\n    FactoryElement<React.ReactDOM[Y]>\n  >,\n  UIMotionProps\n>\n\nexport type MotionPropsWithoutAs<Y extends MotionAs = \"div\"> = WithoutAs<\n  MotionProps<Y>\n>\n\nexport type MotionPropsWithoutChildren<Y extends MotionAs = \"div\"> = Omit<\n  MotionProps<Y>,\n  \"children\"\n>\n\ntype TargetResolver<Y = Dict> = (\n  props: MotionTransitionProps & Y,\n) => TargetAndTransition\n\ntype Variant<Y = Dict> = TargetAndTransition | TargetResolver<Y>\n\nexport interface MotionTransitionVariants<Y = Dict> {\n  enter: Variant<Y>\n  exit: Variant<Y>\n  initial?: Variant<Y>\n}\n\ntype MotionLifecycleProps<Y> = { [key in \"enter\" | \"exit\"]?: Y }\n\nexport interface MotionTransitionProps {\n  /**\n   * Custom `delay` definition for `enter` and `exit`.\n   */\n  delay?: MotionLifecycleProps<number> | number\n  /**\n   * Custom `duration` definition for `enter` and `exit`.\n   */\n  duration?: MotionLifecycleProps<number> | number\n  /**\n   * Custom `enter`.\n   */\n  enter?: any\n  /**\n   * Custom `exit`.\n   */\n  exit?: any\n  /**\n   * Custom `initial`.\n   */\n  initial?: any\n  /**\n   * Custom `transition` definition for `enter` and `exit`.\n   */\n  transition?: MotionLifecycleProps<Transition>\n  /**\n   * Custom `transitionEnd` definition for `enter` and `exit`.\n   */\n  transitionEnd?: MotionLifecycleProps<Target>\n}\n\nexport type WithTransitionProps<Y extends object> = {\n  /**\n   * Show the component. triggers when enter or exit states.\n   */\n  isOpen?: boolean\n  /**\n   * If `true`, the element will unmount when `isOpen={false}` and animation is done.\n   */\n  unmountOnExit?: boolean\n} & MotionTransitionProps &\n  Omit<Y, \"transition\" | \"variants\">\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}

package/dist/motion.types.mjs

@@ -1,3 +1,2 @@
 "use client"
-import "./chunk-R3D52RAW.mjs";
 //# sourceMappingURL=motion.types.mjs.map

package/dist/utils.d.mts

@@ -7,24 +7,24 @@ import 'react';
 declare const MOTION_TRANSITION_EASINGS: {
     readonly ease: readonly [0.25, 0.1, 0.25, 1];
     readonly easeIn: readonly [0.4, 0, 1, 1];
-    readonly easeOut: readonly [0, 0, 0.2, 1];
     readonly easeInOut: readonly [0.4, 0, 0.2, 1];
+    readonly easeOut: readonly [0, 0, 0.2, 1];
 };
 declare const MOTION_TRANSITION_VARIANTS: {
-    readonly scale: {
+    readonly fade: {
         readonly enter: {
-            readonly scale: 1;
+            readonly opacity: 1;
         };
         readonly exit: {
-            readonly scale: 0.95;
+            readonly opacity: 0;
         };
     };
-    readonly fade: {
+    readonly pushDown: {
         readonly enter: {
-            readonly opacity: 1;
+            readonly y: "-100%";
         };
         readonly exit: {
-            readonly opacity: 0;
+            readonly y: "30%";
         };
     };
     readonly pushLeft: {
@@ -51,21 +51,31 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly y: "-30%";
         };
     };
-    readonly pushDown: {
+    readonly scale: {
         readonly enter: {
-            readonly y: "-100%";
+            readonly scale: 1;
         };
         readonly exit: {
-            readonly y: "30%";
+            readonly scale: 0.95;
         };
     };
-    readonly slideLeft: {
+    readonly slideDown: {
+        readonly enter: {
+            readonly x: 0;
+            readonly y: 0;
+        };
+        readonly exit: {
+            readonly x: 0;
+            readonly y: "100%";
+        };
         readonly position: {
-            readonly left: 0;
-            readonly top: 0;
             readonly bottom: 0;
-            readonly width: "100%";
+            readonly left: 0;
+            readonly maxWidth: "100vw";
+            readonly right: 0;
         };
+    };
+    readonly slideLeft: {
         readonly enter: {
             readonly x: 0;
             readonly y: 0;
@@ -74,14 +84,14 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly x: "-100%";
             readonly y: 0;
         };
-    };
-    readonly slideRight: {
         readonly position: {
-            readonly right: 0;
-            readonly top: 0;
             readonly bottom: 0;
+            readonly left: 0;
+            readonly top: 0;
             readonly width: "100%";
         };
+    };
+    readonly slideRight: {
         readonly enter: {
             readonly x: 0;
             readonly y: 0;
@@ -90,14 +100,14 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly x: "100%";
             readonly y: 0;
         };
-    };
-    readonly slideUp: {
         readonly position: {
-            readonly top: 0;
-            readonly left: 0;
+            readonly bottom: 0;
             readonly right: 0;
-            readonly maxWidth: "100vw";
+            readonly top: 0;
+            readonly width: "100%";
         };
+    };
+    readonly slideUp: {
         readonly enter: {
             readonly x: 0;
             readonly y: 0;
@@ -106,21 +116,11 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly x: 0;
             readonly y: "-100%";
         };
-    };
-    readonly slideDown: {
         readonly position: {
-            readonly bottom: 0;
             readonly left: 0;
-            readonly right: 0;
             readonly maxWidth: "100vw";
-        };
-        readonly enter: {
-            readonly x: 0;
-            readonly y: 0;
-        };
-        readonly exit: {
-            readonly x: 0;
-            readonly y: "100%";
+            readonly right: 0;
+            readonly top: 0;
         };
     };
 };

package/dist/utils.d.ts

@@ -7,24 +7,24 @@ import 'react';
 declare const MOTION_TRANSITION_EASINGS: {
     readonly ease: readonly [0.25, 0.1, 0.25, 1];
     readonly easeIn: readonly [0.4, 0, 1, 1];
-    readonly easeOut: readonly [0, 0, 0.2, 1];
     readonly easeInOut: readonly [0.4, 0, 0.2, 1];
+    readonly easeOut: readonly [0, 0, 0.2, 1];
 };
 declare const MOTION_TRANSITION_VARIANTS: {
-    readonly scale: {
+    readonly fade: {
         readonly enter: {
-            readonly scale: 1;
+            readonly opacity: 1;
         };
         readonly exit: {
-            readonly scale: 0.95;
+            readonly opacity: 0;
         };
     };
-    readonly fade: {
+    readonly pushDown: {
         readonly enter: {
-            readonly opacity: 1;
+            readonly y: "-100%";
         };
         readonly exit: {
-            readonly opacity: 0;
+            readonly y: "30%";
         };
     };
     readonly pushLeft: {
@@ -51,21 +51,31 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly y: "-30%";
         };
     };
-    readonly pushDown: {
+    readonly scale: {
         readonly enter: {
-            readonly y: "-100%";
+            readonly scale: 1;
         };
         readonly exit: {
-            readonly y: "30%";
+            readonly scale: 0.95;
         };
     };
-    readonly slideLeft: {
+    readonly slideDown: {
+        readonly enter: {
+            readonly x: 0;
+            readonly y: 0;
+        };
+        readonly exit: {
+            readonly x: 0;
+            readonly y: "100%";
+        };
         readonly position: {
-            readonly left: 0;
-            readonly top: 0;
             readonly bottom: 0;
-            readonly width: "100%";
+            readonly left: 0;
+            readonly maxWidth: "100vw";
+            readonly right: 0;
         };
+    };
+    readonly slideLeft: {
         readonly enter: {
             readonly x: 0;
             readonly y: 0;
@@ -74,14 +84,14 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly x: "-100%";
             readonly y: 0;
         };
-    };
-    readonly slideRight: {
         readonly position: {
-            readonly right: 0;
-            readonly top: 0;
             readonly bottom: 0;
+            readonly left: 0;
+            readonly top: 0;
             readonly width: "100%";
         };
+    };
+    readonly slideRight: {
         readonly enter: {
             readonly x: 0;
             readonly y: 0;
@@ -90,14 +100,14 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly x: "100%";
             readonly y: 0;
         };
-    };
-    readonly slideUp: {
         readonly position: {
-            readonly top: 0;
-            readonly left: 0;
+            readonly bottom: 0;
             readonly right: 0;
-            readonly maxWidth: "100vw";
+            readonly top: 0;
+            readonly width: "100%";
         };
+    };
+    readonly slideUp: {
         readonly enter: {
             readonly x: 0;
             readonly y: 0;
@@ -106,21 +116,11 @@ declare const MOTION_TRANSITION_VARIANTS: {
             readonly x: 0;
             readonly y: "-100%";
         };
-    };
-    readonly slideDown: {
         readonly position: {
-            readonly bottom: 0;
             readonly left: 0;
-            readonly right: 0;
             readonly maxWidth: "100vw";
-        };
-        readonly enter: {
-            readonly x: 0;
-            readonly y: 0;
-        };
-        readonly exit: {
-            readonly x: 0;
-            readonly y: "100%";
+            readonly right: 0;
+            readonly top: 0;
         };
     };
 };