@yamada-ui/motion 2.1.3-dev-20240814151930 → 2.2.0-dev-20240815131426
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-DZ4HH6NK.mjs → chunk-QUROR2OJ.mjs} +9 -5
- package/dist/chunk-QUROR2OJ.mjs.map +1 -0
- package/dist/{chunk-2RLQTJG7.mjs → chunk-WZQCVPKI.mjs} +1 -1
- package/dist/chunk-WZQCVPKI.mjs.map +1 -0
- package/dist/chunk-ZSIGLH6W.mjs +12 -0
- package/dist/chunk-ZSIGLH6W.mjs.map +1 -0
- package/dist/index.d.mts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +22 -3
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +6 -2
- package/dist/index.mjs.map +1 -1
- package/dist/motion-forward-ref.d.mts +11 -0
- package/dist/motion-forward-ref.d.ts +11 -0
- package/dist/motion-forward-ref.js +45 -0
- package/dist/motion-forward-ref.js.map +1 -0
- package/dist/motion-forward-ref.mjs +8 -0
- package/dist/motion-forward-ref.mjs.map +1 -0
- package/dist/motion.d.mts +11 -2
- package/dist/motion.d.ts +11 -2
- package/dist/motion.js +22 -3
- package/dist/motion.js.map +1 -1
- package/dist/motion.mjs +2 -1
- package/dist/motion.types.d.mts +72 -4
- package/dist/motion.types.d.ts +72 -4
- package/dist/motion.types.js.map +1 -1
- package/dist/utils.d.mts +4 -4
- package/dist/utils.d.ts +4 -4
- package/dist/utils.js.map +1 -1
- package/dist/utils.mjs +1 -1
- package/package.json +3 -3
- package/dist/chunk-2RLQTJG7.mjs.map +0 -1
- package/dist/chunk-DZ4HH6NK.mjs.map +0 -1
- package/dist/motion-DDQOW8PN.d.mts +0 -75
- package/dist/motion-DDQOW8PN.d.ts +0 -75
|
@@ -1,16 +1,19 @@
|
|
|
1
1
|
"use client"
|
|
2
|
+
import {
|
|
3
|
+
motionForwardRef
|
|
4
|
+
} from "./chunk-ZSIGLH6W.mjs";
|
|
2
5
|
|
|
3
6
|
// src/motion.tsx
|
|
4
|
-
import { ui
|
|
7
|
+
import { ui } from "@yamada-ui/core";
|
|
5
8
|
import { cx } from "@yamada-ui/utils";
|
|
6
9
|
import { motion } from "framer-motion";
|
|
7
10
|
import { jsx } from "react/jsx-runtime";
|
|
8
|
-
var Motion =
|
|
9
|
-
({ as
|
|
11
|
+
var Motion = motionForwardRef(
|
|
12
|
+
({ as, className, ...rest }, ref) => {
|
|
10
13
|
return /* @__PURE__ */ jsx(
|
|
11
14
|
ui.div,
|
|
12
15
|
{
|
|
13
|
-
as: motion[as],
|
|
16
|
+
as: motion[as != null ? as : "div"],
|
|
14
17
|
ref,
|
|
15
18
|
className: cx("ui-motion", className),
|
|
16
19
|
...rest
|
|
@@ -18,8 +21,9 @@ var Motion = forwardRef(
|
|
|
18
21
|
);
|
|
19
22
|
}
|
|
20
23
|
);
|
|
24
|
+
Motion.displayName = "Motion";
|
|
21
25
|
|
|
22
26
|
export {
|
|
23
27
|
Motion
|
|
24
28
|
};
|
|
25
|
-
//# sourceMappingURL=chunk-
|
|
29
|
+
//# sourceMappingURL=chunk-QUROR2OJ.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/motion.tsx"],"sourcesContent":["import { ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { motion } from \"framer-motion\"\nimport { motionForwardRef } from \"./motion-forward-ref\"\nimport type { MotionProps } from \"./motion.types\"\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, className, ...rest }, ref) => {\n return (\n <ui.div\n as={motion[as ?? \"div\"]}\n ref={ref}\n className={cx(\"ui-motion\", className)}\n {...rest}\n />\n )\n },\n)\n\nMotion.displayName = \"Motion\"\n"],"mappings":";;;;;;AAAA,SAAS,UAAU;AACnB,SAAS,UAAU;AACnB,SAAS,cAAc;AAYjB;AAHC,IAAM,SAAS;AAAA,EACpB,CAAC,EAAE,IAAI,WAAW,GAAG,KAAK,GAAG,QAAQ;AACnC,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,IAAI,OAAO,kBAAM,KAAK;AAAA,QACtB;AAAA,QACA,WAAW,GAAG,aAAa,SAAS;AAAA,QACnC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import { isNumber } from \"@yamada-ui/utils\"\nimport type { Transition } from \"framer-motion\"\nimport type { MotionTransitionProps } from \"./motion.types\"\n\nexport const MOTION_TRANSITION_EASINGS = {\n ease: [0.25, 0.1, 0.25, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n} as const\n\nexport const MOTION_TRANSITION_VARIANTS = {\n scale: {\n enter: { scale: 1 },\n exit: { scale: 0.95 },\n },\n fade: {\n enter: { opacity: 1 },\n exit: { opacity: 0 },\n },\n pushLeft: {\n enter: { x: \"100%\" },\n exit: { x: \"-30%\" },\n },\n pushRight: {\n enter: { x: \"-100%\" },\n exit: { x: \"30%\" },\n },\n pushUp: {\n enter: { y: \"100%\" },\n exit: { y: \"-30%\" },\n },\n pushDown: {\n enter: { y: \"-100%\" },\n exit: { y: \"30%\" },\n },\n slideLeft: {\n position: { left: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"-100%\", y: 0 },\n },\n slideRight: {\n position: { right: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"100%\", y: 0 },\n },\n slideUp: {\n position: { top: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"-100%\" },\n },\n slideDown: {\n position: { bottom: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"100%\" },\n },\n} as const\n\nexport const MOTION_TRANSITION_DEFAULTS = {\n enter: {\n duration: 0.25,\n ease: MOTION_TRANSITION_EASINGS.easeOut,\n },\n exit: {\n duration: 0.2,\n ease: MOTION_TRANSITION_EASINGS.easeIn,\n },\n} as const\n\nexport const transitionEnter =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProps[\"delay\"],\n duration?: MotionTransitionProps[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.enter),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.enter }\n : {}),\n delay: isNumber(delay) ? delay : delay?.enter,\n })\n\nexport const transitionExit =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProps[\"delay\"],\n duration?: MotionTransitionProps[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.exit),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.exit }\n : {}),\n delay: isNumber(delay) ? delay : delay?.exit,\n })\n"],"mappings":";;;AAAA,SAAS,gBAAgB;AAIlB,IAAM,4BAA4B;AAAA,EACvC,MAAM,CAAC,MAAM,KAAK,MAAM,CAAC;AAAA,EACzB,QAAQ,CAAC,KAAK,GAAG,GAAG,CAAC;AAAA,EACrB,SAAS,CAAC,GAAG,GAAG,KAAK,CAAC;AAAA,EACtB,WAAW,CAAC,KAAK,GAAG,KAAK,CAAC;AAC5B;AAEO,IAAM,6BAA6B;AAAA,EACxC,OAAO;AAAA,IACL,OAAO,EAAE,OAAO,EAAE;AAAA,IAClB,MAAM,EAAE,OAAO,KAAK;AAAA,EACtB;AAAA,EACA,MAAM;AAAA,IACJ,OAAO,EAAE,SAAS,EAAE;AAAA,IACpB,MAAM,EAAE,SAAS,EAAE;AAAA,EACrB;AAAA,EACA,UAAU;AAAA,IACR,OAAO,EAAE,GAAG,OAAO;AAAA,IACnB,MAAM,EAAE,GAAG,OAAO;AAAA,EACpB;AAAA,EACA,WAAW;AAAA,IACT,OAAO,EAAE,GAAG,QAAQ;AAAA,IACpB,MAAM,EAAE,GAAG,MAAM;AAAA,EACnB;AAAA,EACA,QAAQ;AAAA,IACN,OAAO,EAAE,GAAG,OAAO;AAAA,IACnB,MAAM,EAAE,GAAG,OAAO;AAAA,EACpB;AAAA,EACA,UAAU;AAAA,IACR,OAAO,EAAE,GAAG,QAAQ;AAAA,IACpB,MAAM,EAAE,GAAG,MAAM;AAAA,EACnB;AAAA,EACA,WAAW;AAAA,IACT,UAAU,EAAE,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,OAAO;AAAA,IACtD,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,SAAS,GAAG,EAAE;AAAA,EAC3B;AAAA,EACA,YAAY;AAAA,IACV,UAAU,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,OAAO;AAAA,IACvD,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,QAAQ,GAAG,EAAE;AAAA,EAC1B;AAAA,EACA,SAAS;AAAA,IACP,UAAU,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,QAAQ;AAAA,IACzD,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,GAAG,GAAG,QAAQ;AAAA,EAC3B;AAAA,EACA,WAAW;AAAA,IACT,UAAU,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,QAAQ;AAAA,IAC5D,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,GAAG,GAAG,OAAO;AAAA,EAC1B;AACF;AAEO,IAAM,6BAA6B;AAAA,EACxC,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM,0BAA0B;AAAA,EAClC;AAAA,EACA,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,MAAM,0BAA0B;AAAA,EAClC;AACF;AAEO,IAAM,kBACX,CAAC,eACD,CACE,OACA,cACgB;AAAA,EAChB,GAAI,kCAAc,2BAA2B;AAAA,EAC7C,GAAI,WACA,EAAE,UAAU,SAAS,QAAQ,IAAI,WAAW,qCAAU,MAAM,IAC5D,CAAC;AAAA,EACL,OAAO,SAAS,KAAK,IAAI,QAAQ,+BAAO;AAC1C;AAEK,IAAM,iBACX,CAAC,eACD,CACE,OACA,cACgB;AAAA,EAChB,GAAI,kCAAc,2BAA2B;AAAA,EAC7C,GAAI,WACA,EAAE,UAAU,SAAS,QAAQ,IAAI,WAAW,qCAAU,KAAK,IAC3D,CAAC;AAAA,EACL,OAAO,SAAS,KAAK,IAAI,QAAQ,+BAAO;AAC1C;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/motion-forward-ref.tsx"],"sourcesContent":["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 const motionForwardRef = <Y extends object, M extends MotionAs>(\n component: React.ForwardRefRenderFunction<\n any,\n Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & {\n as?: MotionAs\n }\n >,\n) => {\n return React.forwardRef(component) as unknown as MotionComponent<M, Y>\n}\n"],"mappings":";;;AAEA,YAAY,WAAW;AAGhB,IAAM,mBAAmB,CAC9B,cAMG;AACH,SAAa,iBAAW,SAAS;AACnC;","names":[]}
|
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export { AcceleratedAnimation, AnimatePresence, AnimateSharedLayout, CSSStyleDeclarationWithTransform, DOMMotionComponents, DeprecatedLayoutGroupContext, DragControls, FlatTree, HTMLMotionProps, LayoutGroup, LayoutGroupContext, LazyMotion, AbsoluteKeyframe as MotionAbsoluteKeyframe, MotionAdvancedProps, AnimatePresenceProps as MotionAnimatePresenceProps, AnimationControls as MotionAnimationControls, AnimationDefinition as MotionAnimationDefinition, AnimationLifecycles as MotionAnimationLifecycles, AnimationOptionsWithValueOverrides as MotionAnimationOptionsWithValueOverrides, AnimationPlaybackControls as MotionAnimationPlaybackControls, AnimationPlaybackLifecycles as MotionAnimationPlaybackLifecycles, AnimationPlaybackOptions as MotionAnimationPlaybackOptions, AnimationProps as MotionAnimationProps, AnimationScope as MotionAnimationScope, AnimationSequence as MotionAnimationSequence, AnimationType as MotionAnimationType, At as MotionAt, Axis as MotionAxis, AxisDelta as MotionAxisDelta, BezierDefinition as MotionBezierDefinition, BoundingBox as MotionBoundingBox, Box as MotionBox, MotionConfig, MotionConfigContext, MotionConfigProps, MotionContext, CreateVisualElement as MotionCreateVisualElement, CustomDomComponent as MotionCustomDomComponent, CustomValueType as MotionCustomValueType, Cycle as MotionCycle, CycleState as MotionCycleState, DOMKeyframesDefinition as MotionDOMKeyframesDefinition, DOMSegment as MotionDOMSegment, DOMSegmentWithTransition as MotionDOMSegmentWithTransition, DecayOptions as MotionDecayOptions, DelayedFunction as MotionDelayedFunction, Delta as MotionDelta, DevMessage as MotionDevMessage, DragElastic as MotionDragElastic, DragHandlers as MotionDragHandlers, DraggableProps as MotionDraggableProps, DurationSpringOptions as MotionDurationSpringOptions, DynamicAnimationOptions as MotionDynamicAnimationOptions, DynamicOption as MotionDynamicOption, Easing as MotionEasing, EasingDefinition as MotionEasingDefinition, EasingFunction as MotionEasingFunction, EasingModifier as MotionEasingModifier, ElementOrSelector as MotionElementOrSelector, EventInfo as MotionEventInfo, FeatureBundle as MotionFeatureBundle, FeatureDefinition as MotionFeatureDefinition, FeatureDefinitions as MotionFeatureDefinitions, FeaturePackage as MotionFeaturePackage, FeaturePackages as MotionFeaturePackages, FocusHandlers as MotionFocusHandlers, MotionGlobalConfig, HoverHandlers as MotionHoverHandlers, HydratedFeatureDefinition as MotionHydratedFeatureDefinition, HydratedFeatureDefinitions as MotionHydratedFeatureDefinitions, IProjectionNode as MotionIProjectionNode, Inertia as MotionInertia, InertiaOptions as MotionInertiaOptions, InterpolateOptions as MotionInterpolateOptions, KeyframeOptions as MotionKeyframeOptions, Keyframes as MotionKeyframes, KeyframesTarget as MotionKeyframesTarget, LayoutProps as MotionLayoutProps, LazyFeatureBundle as MotionLazyFeatureBundle, LazyProps as MotionLazyProps, MixerFactory as MotionMixerFactory, None as MotionNone, Orchestration as MotionOrchestration, PanHandlers as MotionPanHandlers, PanInfo as MotionPanInfo, PassiveEffect as MotionPassiveEffect, Point as MotionPoint, RelayoutInfo as MotionRelayoutInfo, RenderComponent as MotionRenderComponent, Reorder as MotionReorder, Repeat as MotionRepeat, RepeatType as MotionRepeatType, ResolveKeyframes as MotionResolveKeyframes, ResolveLayoutTransition as MotionResolveLayoutTransition, ResolvedAnimationDefinition as MotionResolvedAnimationDefinition, ResolvedAnimationDefinitions as MotionResolvedAnimationDefinitions, ResolvedKeyframesTarget as MotionResolvedKeyframesTarget, ResolvedSingleTarget as MotionResolvedSingleTarget, ResolvedValueTarget as MotionResolvedValueTarget, ResolvedValues as MotionResolvedValues, Segment as MotionSegment, SequenceLabel as MotionSequenceLabel, SequenceLabelWithTime as MotionSequenceLabelWithTime, SequenceMap as MotionSequenceMap, SequenceOptions as MotionSequenceOptions, SequenceTime as MotionSequenceTime, SingleTarget as MotionSingleTarget, Spring as MotionSpring, SpringOptions as MotionSpringOptions, MotionStyle, StyleKeyframesDefinition as MotionStyleKeyframesDefinition, StyleTransitions as MotionStyleTransitions, Subscriber as MotionSubscriber, TapHandlers as MotionTapHandlers, TapInfo as MotionTapInfo, Target as MotionTarget, TargetAndTransition as MotionTargetAndTransition, MotionTransform, TransformPoint as MotionTransformPoint, Transition as MotionTransition, Tween as MotionTween, UnresolvedValueKeyframe as MotionUnresolvedValueKeyframe, UseInViewOptions as MotionUseInViewOptions, MotionValue, ValueAnimationOptions as MotionValueAnimationOptions, ValueAnimationTransition as MotionValueAnimationTransition, ValueKeyframe as MotionValueKeyframe, ValueKeyframesDefinition as MotionValueKeyframesDefinition, MotionValueSegment, MotionValueSegmentWithTransition, ValueSequence as MotionValueSequence, ValueTarget as MotionValueTarget, ValueType as MotionValueType, VariableKeyframesDefinition as MotionVariableKeyframesDefinition, VariableTransitions as MotionVariableTransitions, Variant as MotionVariant, VariantLabels as MotionVariantLabels, Variants as MotionVariants, VelocityOptions as MotionVelocityOptions, VisualState as MotionVisualState, PresenceContext, SVGAttributesAsMotionValues, SVGKeyframesDefinition, SVGMotionProps, SVGPathKeyframesDefinition, SVGPathTransitions, SVGTransitions, ScrapeMotionValuesFromProps, ScrollMotionValues, SwitchLayoutGroupContext, VisualElement, addPointerInfo, addScaleCorrector, animate, animateValue, animateVisualElement, animationControls, animations, anticipate, backIn, backInOut, backOut, buildTransform, calcLength, cancelFrame, cancelSync, circIn, circInOut, circOut, clamp, color, complex, createBox, createDomMotionComponent, createMotionComponent, createScopedAnimate, cubicBezier, delay, disableInstantTransitions, distance, distance2D, domAnimation, domMax, easeIn, easeInOut, easeOut, filterProps, frame, frameData, inView, interpolate, invariant, isBrowser, isDragActive, isMotionComponent, isMotionValue, isValidMotionProp, m, makeUseVisualState, mirrorEasing, mix, motion, motionValue, optimizedAppearDataAttribute, pipe, progress, px, resolveMotionValue, reverseEasing, scroll, scrollInfo, spring, stagger, startOptimizedAppearAnimation, steps, sync, transform, unwrapMotionComponent, useAnimate, useAnimationControls, useAnimationFrame, useCycle, useDeprecatedAnimatedState, useDeprecatedInvertedScale, useDomEvent, useDragControls, useElementScroll, useForceUpdate, useInView, useInstantLayoutTransition, useInstantTransition, useIsPresent, useIsomorphicLayoutEffect, useAnimation as useMotionAnimation, useMotionTemplate, useMotionValue, useMotionValueEvent, usePresence, useReducedMotion, useReducedMotionConfig, useResetProjection, useScroll, useSpring, useTime, useTransform, useVelocity, useViewportScroll, useWillChange, visualElementStore, warning, wrap } from 'framer-motion';
|
|
2
|
-
export {
|
|
2
|
+
export { motionForwardRef } from './motion-forward-ref.mjs';
|
|
3
|
+
export { Motion } from './motion.mjs';
|
|
4
|
+
export { MotionAs, MotionComponent, MotionProps, MotionPropsWithoutChildren, MotionTransitionProps, MotionTransitionVariants, MotionUIPropGetter, RequiredMotionUIPropGetter, WithTransitionProps } from './motion.types.mjs';
|
|
3
5
|
export { MOTION_TRANSITION_DEFAULTS, MOTION_TRANSITION_EASINGS, MOTION_TRANSITION_VARIANTS, transitionEnter, transitionExit } from './utils.mjs';
|
|
4
6
|
import '@yamada-ui/core';
|
|
5
|
-
import 'react';
|
|
6
7
|
import '@yamada-ui/utils';
|
|
8
|
+
import 'react';
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export { AcceleratedAnimation, AnimatePresence, AnimateSharedLayout, CSSStyleDeclarationWithTransform, DOMMotionComponents, DeprecatedLayoutGroupContext, DragControls, FlatTree, HTMLMotionProps, LayoutGroup, LayoutGroupContext, LazyMotion, AbsoluteKeyframe as MotionAbsoluteKeyframe, MotionAdvancedProps, AnimatePresenceProps as MotionAnimatePresenceProps, AnimationControls as MotionAnimationControls, AnimationDefinition as MotionAnimationDefinition, AnimationLifecycles as MotionAnimationLifecycles, AnimationOptionsWithValueOverrides as MotionAnimationOptionsWithValueOverrides, AnimationPlaybackControls as MotionAnimationPlaybackControls, AnimationPlaybackLifecycles as MotionAnimationPlaybackLifecycles, AnimationPlaybackOptions as MotionAnimationPlaybackOptions, AnimationProps as MotionAnimationProps, AnimationScope as MotionAnimationScope, AnimationSequence as MotionAnimationSequence, AnimationType as MotionAnimationType, At as MotionAt, Axis as MotionAxis, AxisDelta as MotionAxisDelta, BezierDefinition as MotionBezierDefinition, BoundingBox as MotionBoundingBox, Box as MotionBox, MotionConfig, MotionConfigContext, MotionConfigProps, MotionContext, CreateVisualElement as MotionCreateVisualElement, CustomDomComponent as MotionCustomDomComponent, CustomValueType as MotionCustomValueType, Cycle as MotionCycle, CycleState as MotionCycleState, DOMKeyframesDefinition as MotionDOMKeyframesDefinition, DOMSegment as MotionDOMSegment, DOMSegmentWithTransition as MotionDOMSegmentWithTransition, DecayOptions as MotionDecayOptions, DelayedFunction as MotionDelayedFunction, Delta as MotionDelta, DevMessage as MotionDevMessage, DragElastic as MotionDragElastic, DragHandlers as MotionDragHandlers, DraggableProps as MotionDraggableProps, DurationSpringOptions as MotionDurationSpringOptions, DynamicAnimationOptions as MotionDynamicAnimationOptions, DynamicOption as MotionDynamicOption, Easing as MotionEasing, EasingDefinition as MotionEasingDefinition, EasingFunction as MotionEasingFunction, EasingModifier as MotionEasingModifier, ElementOrSelector as MotionElementOrSelector, EventInfo as MotionEventInfo, FeatureBundle as MotionFeatureBundle, FeatureDefinition as MotionFeatureDefinition, FeatureDefinitions as MotionFeatureDefinitions, FeaturePackage as MotionFeaturePackage, FeaturePackages as MotionFeaturePackages, FocusHandlers as MotionFocusHandlers, MotionGlobalConfig, HoverHandlers as MotionHoverHandlers, HydratedFeatureDefinition as MotionHydratedFeatureDefinition, HydratedFeatureDefinitions as MotionHydratedFeatureDefinitions, IProjectionNode as MotionIProjectionNode, Inertia as MotionInertia, InertiaOptions as MotionInertiaOptions, InterpolateOptions as MotionInterpolateOptions, KeyframeOptions as MotionKeyframeOptions, Keyframes as MotionKeyframes, KeyframesTarget as MotionKeyframesTarget, LayoutProps as MotionLayoutProps, LazyFeatureBundle as MotionLazyFeatureBundle, LazyProps as MotionLazyProps, MixerFactory as MotionMixerFactory, None as MotionNone, Orchestration as MotionOrchestration, PanHandlers as MotionPanHandlers, PanInfo as MotionPanInfo, PassiveEffect as MotionPassiveEffect, Point as MotionPoint, RelayoutInfo as MotionRelayoutInfo, RenderComponent as MotionRenderComponent, Reorder as MotionReorder, Repeat as MotionRepeat, RepeatType as MotionRepeatType, ResolveKeyframes as MotionResolveKeyframes, ResolveLayoutTransition as MotionResolveLayoutTransition, ResolvedAnimationDefinition as MotionResolvedAnimationDefinition, ResolvedAnimationDefinitions as MotionResolvedAnimationDefinitions, ResolvedKeyframesTarget as MotionResolvedKeyframesTarget, ResolvedSingleTarget as MotionResolvedSingleTarget, ResolvedValueTarget as MotionResolvedValueTarget, ResolvedValues as MotionResolvedValues, Segment as MotionSegment, SequenceLabel as MotionSequenceLabel, SequenceLabelWithTime as MotionSequenceLabelWithTime, SequenceMap as MotionSequenceMap, SequenceOptions as MotionSequenceOptions, SequenceTime as MotionSequenceTime, SingleTarget as MotionSingleTarget, Spring as MotionSpring, SpringOptions as MotionSpringOptions, MotionStyle, StyleKeyframesDefinition as MotionStyleKeyframesDefinition, StyleTransitions as MotionStyleTransitions, Subscriber as MotionSubscriber, TapHandlers as MotionTapHandlers, TapInfo as MotionTapInfo, Target as MotionTarget, TargetAndTransition as MotionTargetAndTransition, MotionTransform, TransformPoint as MotionTransformPoint, Transition as MotionTransition, Tween as MotionTween, UnresolvedValueKeyframe as MotionUnresolvedValueKeyframe, UseInViewOptions as MotionUseInViewOptions, MotionValue, ValueAnimationOptions as MotionValueAnimationOptions, ValueAnimationTransition as MotionValueAnimationTransition, ValueKeyframe as MotionValueKeyframe, ValueKeyframesDefinition as MotionValueKeyframesDefinition, MotionValueSegment, MotionValueSegmentWithTransition, ValueSequence as MotionValueSequence, ValueTarget as MotionValueTarget, ValueType as MotionValueType, VariableKeyframesDefinition as MotionVariableKeyframesDefinition, VariableTransitions as MotionVariableTransitions, Variant as MotionVariant, VariantLabels as MotionVariantLabels, Variants as MotionVariants, VelocityOptions as MotionVelocityOptions, VisualState as MotionVisualState, PresenceContext, SVGAttributesAsMotionValues, SVGKeyframesDefinition, SVGMotionProps, SVGPathKeyframesDefinition, SVGPathTransitions, SVGTransitions, ScrapeMotionValuesFromProps, ScrollMotionValues, SwitchLayoutGroupContext, VisualElement, addPointerInfo, addScaleCorrector, animate, animateValue, animateVisualElement, animationControls, animations, anticipate, backIn, backInOut, backOut, buildTransform, calcLength, cancelFrame, cancelSync, circIn, circInOut, circOut, clamp, color, complex, createBox, createDomMotionComponent, createMotionComponent, createScopedAnimate, cubicBezier, delay, disableInstantTransitions, distance, distance2D, domAnimation, domMax, easeIn, easeInOut, easeOut, filterProps, frame, frameData, inView, interpolate, invariant, isBrowser, isDragActive, isMotionComponent, isMotionValue, isValidMotionProp, m, makeUseVisualState, mirrorEasing, mix, motion, motionValue, optimizedAppearDataAttribute, pipe, progress, px, resolveMotionValue, reverseEasing, scroll, scrollInfo, spring, stagger, startOptimizedAppearAnimation, steps, sync, transform, unwrapMotionComponent, useAnimate, useAnimationControls, useAnimationFrame, useCycle, useDeprecatedAnimatedState, useDeprecatedInvertedScale, useDomEvent, useDragControls, useElementScroll, useForceUpdate, useInView, useInstantLayoutTransition, useInstantTransition, useIsPresent, useIsomorphicLayoutEffect, useAnimation as useMotionAnimation, useMotionTemplate, useMotionValue, useMotionValueEvent, usePresence, useReducedMotion, useReducedMotionConfig, useResetProjection, useScroll, useSpring, useTime, useTransform, useVelocity, useViewportScroll, useWillChange, visualElementStore, warning, wrap } from 'framer-motion';
|
|
2
|
-
export {
|
|
2
|
+
export { motionForwardRef } from './motion-forward-ref.js';
|
|
3
|
+
export { Motion } from './motion.js';
|
|
4
|
+
export { MotionAs, MotionComponent, MotionProps, MotionPropsWithoutChildren, MotionTransitionProps, MotionTransitionVariants, MotionUIPropGetter, RequiredMotionUIPropGetter, WithTransitionProps } from './motion.types.js';
|
|
3
5
|
export { MOTION_TRANSITION_DEFAULTS, MOTION_TRANSITION_EASINGS, MOTION_TRANSITION_VARIANTS, transitionEnter, transitionExit } from './utils.js';
|
|
4
6
|
import '@yamada-ui/core';
|
|
5
|
-
import 'react';
|
|
6
7
|
import '@yamada-ui/utils';
|
|
8
|
+
import 'react';
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
"use strict";
|
|
3
|
+
var __create = Object.create;
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
8
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
9
|
var __export = (target, all) => {
|
|
8
10
|
for (var name in all)
|
|
@@ -16,6 +18,14 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
18
|
}
|
|
17
19
|
return to;
|
|
18
20
|
};
|
|
21
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
26
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
27
|
+
mod
|
|
28
|
+
));
|
|
19
29
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
30
|
|
|
21
31
|
// src/index.ts
|
|
@@ -93,6 +103,7 @@ __export(src_exports, {
|
|
|
93
103
|
mirrorEasing: () => import_framer_motion2.mirrorEasing,
|
|
94
104
|
mix: () => import_framer_motion2.mix,
|
|
95
105
|
motion: () => import_framer_motion2.motion,
|
|
106
|
+
motionForwardRef: () => motionForwardRef,
|
|
96
107
|
motionValue: () => import_framer_motion2.motionValue,
|
|
97
108
|
optimizedAppearDataAttribute: () => import_framer_motion2.optimizedAppearDataAttribute,
|
|
98
109
|
pipe: () => import_framer_motion2.pipe,
|
|
@@ -148,17 +159,23 @@ __export(src_exports, {
|
|
|
148
159
|
module.exports = __toCommonJS(src_exports);
|
|
149
160
|
var import_framer_motion2 = require("framer-motion");
|
|
150
161
|
|
|
162
|
+
// src/motion-forward-ref.tsx
|
|
163
|
+
var React = __toESM(require("react"));
|
|
164
|
+
var motionForwardRef = (component) => {
|
|
165
|
+
return React.forwardRef(component);
|
|
166
|
+
};
|
|
167
|
+
|
|
151
168
|
// src/motion.tsx
|
|
152
169
|
var import_core = require("@yamada-ui/core");
|
|
153
170
|
var import_utils = require("@yamada-ui/utils");
|
|
154
171
|
var import_framer_motion = require("framer-motion");
|
|
155
172
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
156
|
-
var Motion = (
|
|
157
|
-
({ as
|
|
173
|
+
var Motion = motionForwardRef(
|
|
174
|
+
({ as, className, ...rest }, ref) => {
|
|
158
175
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
159
176
|
import_core.ui.div,
|
|
160
177
|
{
|
|
161
|
-
as: import_framer_motion.motion[as],
|
|
178
|
+
as: import_framer_motion.motion[as != null ? as : "div"],
|
|
162
179
|
ref,
|
|
163
180
|
className: (0, import_utils.cx)("ui-motion", className),
|
|
164
181
|
...rest
|
|
@@ -166,6 +183,7 @@ var Motion = (0, import_core.forwardRef)(
|
|
|
166
183
|
);
|
|
167
184
|
}
|
|
168
185
|
);
|
|
186
|
+
Motion.displayName = "Motion";
|
|
169
187
|
|
|
170
188
|
// src/utils.ts
|
|
171
189
|
var import_utils2 = require("@yamada-ui/utils");
|
|
@@ -315,6 +333,7 @@ var transitionExit = (transition) => (delay2, duration) => ({
|
|
|
315
333
|
mirrorEasing,
|
|
316
334
|
mix,
|
|
317
335
|
motion,
|
|
336
|
+
motionForwardRef,
|
|
318
337
|
motionValue,
|
|
319
338
|
optimizedAppearDataAttribute,
|
|
320
339
|
pipe,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/motion.tsx","../src/utils.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 motion,\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
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/motion-forward-ref.tsx","../src/motion.tsx","../src/utils.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 motion,\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 \"./motion-forward-ref\"\nexport { Motion } from \"./motion\"\nexport * from \"./motion.types\"\nexport * from \"./utils\"\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 const motionForwardRef = <Y extends object, M extends MotionAs>(\n component: React.ForwardRefRenderFunction<\n any,\n Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & {\n as?: MotionAs\n }\n >,\n) => {\n return React.forwardRef(component) as unknown as MotionComponent<M, Y>\n}\n","import { ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { motion } from \"framer-motion\"\nimport { motionForwardRef } from \"./motion-forward-ref\"\nimport type { MotionProps } from \"./motion.types\"\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, className, ...rest }, ref) => {\n return (\n <ui.div\n as={motion[as ?? \"div\"]}\n ref={ref}\n className={cx(\"ui-motion\", className)}\n {...rest}\n />\n )\n },\n)\n\nMotion.displayName = \"Motion\"\n","import { isNumber } from \"@yamada-ui/utils\"\nimport type { Transition } from \"framer-motion\"\nimport type { MotionTransitionProps } from \"./motion.types\"\n\nexport const MOTION_TRANSITION_EASINGS = {\n ease: [0.25, 0.1, 0.25, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n} as const\n\nexport const MOTION_TRANSITION_VARIANTS = {\n scale: {\n enter: { scale: 1 },\n exit: { scale: 0.95 },\n },\n fade: {\n enter: { opacity: 1 },\n exit: { opacity: 0 },\n },\n pushLeft: {\n enter: { x: \"100%\" },\n exit: { x: \"-30%\" },\n },\n pushRight: {\n enter: { x: \"-100%\" },\n exit: { x: \"30%\" },\n },\n pushUp: {\n enter: { y: \"100%\" },\n exit: { y: \"-30%\" },\n },\n pushDown: {\n enter: { y: \"-100%\" },\n exit: { y: \"30%\" },\n },\n slideLeft: {\n position: { left: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"-100%\", y: 0 },\n },\n slideRight: {\n position: { right: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"100%\", y: 0 },\n },\n slideUp: {\n position: { top: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"-100%\" },\n },\n slideDown: {\n position: { bottom: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"100%\" },\n },\n} as const\n\nexport const MOTION_TRANSITION_DEFAULTS = {\n enter: {\n duration: 0.25,\n ease: MOTION_TRANSITION_EASINGS.easeOut,\n },\n exit: {\n duration: 0.2,\n ease: MOTION_TRANSITION_EASINGS.easeIn,\n },\n} as const\n\nexport const transitionEnter =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProps[\"delay\"],\n duration?: MotionTransitionProps[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.enter),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.enter }\n : {}),\n delay: isNumber(delay) ? delay : delay?.enter,\n })\n\nexport const transitionExit =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProps[\"delay\"],\n duration?: MotionTransitionProps[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.exit),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.exit }\n : {}),\n delay: isNumber(delay) ? delay : delay?.exit,\n })\n"],"mappings":"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","names":["import_framer_motion","import_utils","delay"]}
|
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Motion
|
|
4
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-QUROR2OJ.mjs";
|
|
5
|
+
import {
|
|
6
|
+
motionForwardRef
|
|
7
|
+
} from "./chunk-ZSIGLH6W.mjs";
|
|
5
8
|
import "./chunk-R3D52RAW.mjs";
|
|
6
9
|
import {
|
|
7
10
|
MOTION_TRANSITION_DEFAULTS,
|
|
@@ -9,7 +12,7 @@ import {
|
|
|
9
12
|
MOTION_TRANSITION_VARIANTS,
|
|
10
13
|
transitionEnter,
|
|
11
14
|
transitionExit
|
|
12
|
-
} from "./chunk-
|
|
15
|
+
} from "./chunk-WZQCVPKI.mjs";
|
|
13
16
|
|
|
14
17
|
// src/index.ts
|
|
15
18
|
import {
|
|
@@ -204,6 +207,7 @@ export {
|
|
|
204
207
|
mirrorEasing,
|
|
205
208
|
mix,
|
|
206
209
|
motion,
|
|
210
|
+
motionForwardRef,
|
|
207
211
|
motionValue,
|
|
208
212
|
optimizedAppearDataAttribute,
|
|
209
213
|
pipe,
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +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 motion,\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
|
|
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 motion,\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 \"./motion-forward-ref\"\nexport { Motion } from \"./motion\"\nexport * from \"./motion.types\"\nexport * from \"./utils\"\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,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":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { WithoutAs } from '@yamada-ui/core';
|
|
2
|
+
import { Merge } from '@yamada-ui/utils';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { MotionAs, MotionComponent } from './motion.types.mjs';
|
|
5
|
+
import 'framer-motion';
|
|
6
|
+
|
|
7
|
+
declare const motionForwardRef: <Y extends object, M extends MotionAs>(component: React.ForwardRefRenderFunction<any, Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & {
|
|
8
|
+
as?: MotionAs;
|
|
9
|
+
}>) => MotionComponent<M, Y>;
|
|
10
|
+
|
|
11
|
+
export { motionForwardRef };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { WithoutAs } from '@yamada-ui/core';
|
|
2
|
+
import { Merge } from '@yamada-ui/utils';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { MotionAs, MotionComponent } from './motion.types.js';
|
|
5
|
+
import 'framer-motion';
|
|
6
|
+
|
|
7
|
+
declare const motionForwardRef: <Y extends object, M extends MotionAs>(component: React.ForwardRefRenderFunction<any, Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & {
|
|
8
|
+
as?: MotionAs;
|
|
9
|
+
}>) => MotionComponent<M, Y>;
|
|
10
|
+
|
|
11
|
+
export { motionForwardRef };
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
"use strict";
|
|
3
|
+
var __create = Object.create;
|
|
4
|
+
var __defProp = Object.defineProperty;
|
|
5
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
8
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
+
var __export = (target, all) => {
|
|
10
|
+
for (var name in all)
|
|
11
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
|
+
};
|
|
13
|
+
var __copyProps = (to, from, except, desc) => {
|
|
14
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
15
|
+
for (let key of __getOwnPropNames(from))
|
|
16
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
17
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
|
+
}
|
|
19
|
+
return to;
|
|
20
|
+
};
|
|
21
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
26
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
27
|
+
mod
|
|
28
|
+
));
|
|
29
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
30
|
+
|
|
31
|
+
// src/motion-forward-ref.tsx
|
|
32
|
+
var motion_forward_ref_exports = {};
|
|
33
|
+
__export(motion_forward_ref_exports, {
|
|
34
|
+
motionForwardRef: () => motionForwardRef
|
|
35
|
+
});
|
|
36
|
+
module.exports = __toCommonJS(motion_forward_ref_exports);
|
|
37
|
+
var React = __toESM(require("react"));
|
|
38
|
+
var motionForwardRef = (component) => {
|
|
39
|
+
return React.forwardRef(component);
|
|
40
|
+
};
|
|
41
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
42
|
+
0 && (module.exports = {
|
|
43
|
+
motionForwardRef
|
|
44
|
+
});
|
|
45
|
+
//# sourceMappingURL=motion-forward-ref.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/motion-forward-ref.tsx"],"sourcesContent":["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 const motionForwardRef = <Y extends object, M extends MotionAs>(\n component: React.ForwardRefRenderFunction<\n any,\n Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & {\n as?: MotionAs\n }\n >,\n) => {\n return React.forwardRef(component) as unknown as MotionComponent<M, Y>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,YAAuB;AAGhB,IAAM,mBAAmB,CAC9B,cAMG;AACH,SAAa,iBAAW,SAAS;AACnC;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/dist/motion.d.mts
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
|
+
import { MotionComponent, MotionProps } from './motion.types.mjs';
|
|
1
2
|
import '@yamada-ui/core';
|
|
3
|
+
import '@yamada-ui/utils';
|
|
2
4
|
import 'framer-motion';
|
|
3
5
|
import 'react';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* `Motion` is a component that allows for the easy implementation of a wide variety of animations.
|
|
9
|
+
*
|
|
10
|
+
* @see Docs https://yamada-ui.com/components/other/motion
|
|
11
|
+
*/
|
|
12
|
+
declare const Motion: MotionComponent<"div", MotionProps>;
|
|
13
|
+
|
|
14
|
+
export { Motion };
|
package/dist/motion.d.ts
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
|
+
import { MotionComponent, MotionProps } from './motion.types.js';
|
|
1
2
|
import '@yamada-ui/core';
|
|
3
|
+
import '@yamada-ui/utils';
|
|
2
4
|
import 'framer-motion';
|
|
3
5
|
import 'react';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* `Motion` is a component that allows for the easy implementation of a wide variety of animations.
|
|
9
|
+
*
|
|
10
|
+
* @see Docs https://yamada-ui.com/components/other/motion
|
|
11
|
+
*/
|
|
12
|
+
declare const Motion: MotionComponent<"div", MotionProps>;
|
|
13
|
+
|
|
14
|
+
export { Motion };
|
package/dist/motion.js
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
"use strict";
|
|
3
|
+
var __create = Object.create;
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
8
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
9
|
var __export = (target, all) => {
|
|
8
10
|
for (var name in all)
|
|
@@ -16,6 +18,14 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
18
|
}
|
|
17
19
|
return to;
|
|
18
20
|
};
|
|
21
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
26
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
27
|
+
mod
|
|
28
|
+
));
|
|
19
29
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
30
|
|
|
21
31
|
// src/motion.tsx
|
|
@@ -27,13 +37,21 @@ module.exports = __toCommonJS(motion_exports);
|
|
|
27
37
|
var import_core = require("@yamada-ui/core");
|
|
28
38
|
var import_utils = require("@yamada-ui/utils");
|
|
29
39
|
var import_framer_motion = require("framer-motion");
|
|
40
|
+
|
|
41
|
+
// src/motion-forward-ref.tsx
|
|
42
|
+
var React = __toESM(require("react"));
|
|
43
|
+
var motionForwardRef = (component) => {
|
|
44
|
+
return React.forwardRef(component);
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
// src/motion.tsx
|
|
30
48
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
31
|
-
var Motion = (
|
|
32
|
-
({ as
|
|
49
|
+
var Motion = motionForwardRef(
|
|
50
|
+
({ as, className, ...rest }, ref) => {
|
|
33
51
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
34
52
|
import_core.ui.div,
|
|
35
53
|
{
|
|
36
|
-
as: import_framer_motion.motion[as],
|
|
54
|
+
as: import_framer_motion.motion[as != null ? as : "div"],
|
|
37
55
|
ref,
|
|
38
56
|
className: (0, import_utils.cx)("ui-motion", className),
|
|
39
57
|
...rest
|
|
@@ -41,6 +59,7 @@ var Motion = (0, import_core.forwardRef)(
|
|
|
41
59
|
);
|
|
42
60
|
}
|
|
43
61
|
);
|
|
62
|
+
Motion.displayName = "Motion";
|
|
44
63
|
// Annotate the CommonJS export names for ESM import in node:
|
|
45
64
|
0 && (module.exports = {
|
|
46
65
|
Motion
|
package/dist/motion.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/motion.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../src/motion.tsx","../src/motion-forward-ref.tsx"],"sourcesContent":["import { ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { motion } from \"framer-motion\"\nimport { motionForwardRef } from \"./motion-forward-ref\"\nimport type { MotionProps } from \"./motion.types\"\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, className, ...rest }, ref) => {\n return (\n <ui.div\n as={motion[as ?? \"div\"]}\n ref={ref}\n className={cx(\"ui-motion\", className)}\n {...rest}\n />\n )\n },\n)\n\nMotion.displayName = \"Motion\"\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 const motionForwardRef = <Y extends object, M extends MotionAs>(\n component: React.ForwardRefRenderFunction<\n any,\n Merge<React.ComponentPropsWithoutRef<M>, WithoutAs<Y>> & {\n as?: MotionAs\n }\n >,\n) => {\n return React.forwardRef(component) as unknown as MotionComponent<M, Y>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAmB;AACnB,mBAAmB;AACnB,2BAAuB;;;ACAvB,YAAuB;AAGhB,IAAM,mBAAmB,CAC9B,cAMG;AACH,SAAa,iBAAW,SAAS;AACnC;;;ADAM;AAHC,IAAM,SAAS;AAAA,EACpB,CAAC,EAAE,IAAI,WAAW,GAAG,KAAK,GAAG,QAAQ;AACnC,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,IAAI,4BAAO,kBAAM,KAAK;AAAA,QACtB;AAAA,QACA,eAAW,iBAAG,aAAa,SAAS;AAAA,QACnC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;","names":[]}
|
package/dist/motion.mjs
CHANGED
package/dist/motion.types.d.mts
CHANGED
|
@@ -1,5 +1,73 @@
|
|
|
1
|
-
import '@yamada-ui/
|
|
1
|
+
import { ComponentArgs, UIProps, WithoutAs } from '@yamada-ui/core';
|
|
2
|
+
import { Merge, Dict, MergeIfDefined } from '@yamada-ui/utils';
|
|
3
|
+
import * as Motion from 'framer-motion';
|
|
2
4
|
export { CSSStyleDeclarationWithTransform, DOMMotionComponents, HTMLMotionProps, AbsoluteKeyframe as MotionAbsoluteKeyframe, MotionAdvancedProps, AnimatePresenceProps as MotionAnimatePresenceProps, AnimationControls as MotionAnimationControls, AnimationDefinition as MotionAnimationDefinition, AnimationLifecycles as MotionAnimationLifecycles, AnimationOptionsWithValueOverrides as MotionAnimationOptionsWithValueOverrides, AnimationPlaybackControls as MotionAnimationPlaybackControls, AnimationPlaybackLifecycles as MotionAnimationPlaybackLifecycles, AnimationPlaybackOptions as MotionAnimationPlaybackOptions, AnimationProps as MotionAnimationProps, AnimationScope as MotionAnimationScope, AnimationSequence as MotionAnimationSequence, AnimationType as MotionAnimationType, At as MotionAt, Axis as MotionAxis, AxisDelta as MotionAxisDelta, BezierDefinition as MotionBezierDefinition, BoundingBox as MotionBoundingBox, Box as MotionBox, MotionConfigProps, CreateVisualElement as MotionCreateVisualElement, CustomDomComponent as MotionCustomDomComponent, CustomValueType as MotionCustomValueType, Cycle as MotionCycle, CycleState as MotionCycleState, DOMKeyframesDefinition as MotionDOMKeyframesDefinition, DOMSegment as MotionDOMSegment, DOMSegmentWithTransition as MotionDOMSegmentWithTransition, DecayOptions as MotionDecayOptions, DelayedFunction as MotionDelayedFunction, Delta as MotionDelta, DevMessage as MotionDevMessage, DragElastic as MotionDragElastic, DragHandlers as MotionDragHandlers, DraggableProps as MotionDraggableProps, DurationSpringOptions as MotionDurationSpringOptions, DynamicAnimationOptions as MotionDynamicAnimationOptions, DynamicOption as MotionDynamicOption, Easing as MotionEasing, EasingDefinition as MotionEasingDefinition, EasingFunction as MotionEasingFunction, EasingModifier as MotionEasingModifier, ElementOrSelector as MotionElementOrSelector, EventInfo as MotionEventInfo, FeatureBundle as MotionFeatureBundle, FeatureDefinition as MotionFeatureDefinition, FeatureDefinitions as MotionFeatureDefinitions, FeaturePackage as MotionFeaturePackage, FeaturePackages as MotionFeaturePackages, FocusHandlers as MotionFocusHandlers, HoverHandlers as MotionHoverHandlers, HydratedFeatureDefinition as MotionHydratedFeatureDefinition, HydratedFeatureDefinitions as MotionHydratedFeatureDefinitions, IProjectionNode as MotionIProjectionNode, Inertia as MotionInertia, InertiaOptions as MotionInertiaOptions, InterpolateOptions as MotionInterpolateOptions, KeyframeOptions as MotionKeyframeOptions, Keyframes as MotionKeyframes, KeyframesTarget as MotionKeyframesTarget, LayoutProps as MotionLayoutProps, LazyFeatureBundle as MotionLazyFeatureBundle, LazyProps as MotionLazyProps, MixerFactory as MotionMixerFactory, None as MotionNone, Orchestration as MotionOrchestration, PanHandlers as MotionPanHandlers, PanInfo as MotionPanInfo, PassiveEffect as MotionPassiveEffect, Point as MotionPoint, RelayoutInfo as MotionRelayoutInfo, RenderComponent as MotionRenderComponent, Repeat as MotionRepeat, RepeatType as MotionRepeatType, ResolveKeyframes as MotionResolveKeyframes, ResolveLayoutTransition as MotionResolveLayoutTransition, ResolvedAnimationDefinition as MotionResolvedAnimationDefinition, ResolvedAnimationDefinitions as MotionResolvedAnimationDefinitions, ResolvedKeyframesTarget as MotionResolvedKeyframesTarget, ResolvedSingleTarget as MotionResolvedSingleTarget, ResolvedValueTarget as MotionResolvedValueTarget, ResolvedValues as MotionResolvedValues, Segment as MotionSegment, SequenceLabel as MotionSequenceLabel, SequenceLabelWithTime as MotionSequenceLabelWithTime, SequenceMap as MotionSequenceMap, SequenceOptions as MotionSequenceOptions, SequenceTime as MotionSequenceTime, SingleTarget as MotionSingleTarget, Spring as MotionSpring, SpringOptions as MotionSpringOptions, MotionStyle, StyleKeyframesDefinition as MotionStyleKeyframesDefinition, StyleTransitions as MotionStyleTransitions, Subscriber as MotionSubscriber, TapHandlers as MotionTapHandlers, TapInfo as MotionTapInfo, Target as MotionTarget, TargetAndTransition as MotionTargetAndTransition, MotionTransform, TransformPoint as MotionTransformPoint, Transition as MotionTransition, Tween as MotionTween, UnresolvedValueKeyframe as MotionUnresolvedValueKeyframe, UseInViewOptions as MotionUseInViewOptions, MotionValue, ValueAnimationOptions as MotionValueAnimationOptions, ValueAnimationTransition as MotionValueAnimationTransition, ValueKeyframe as MotionValueKeyframe, ValueKeyframesDefinition as MotionValueKeyframesDefinition, MotionValueSegment, MotionValueSegmentWithTransition, ValueSequence as MotionValueSequence, ValueTarget as MotionValueTarget, ValueType as MotionValueType, VariableKeyframesDefinition as MotionVariableKeyframesDefinition, VariableTransitions as MotionVariableTransitions, Variant as MotionVariant, VariantLabels as MotionVariantLabels, Variants as MotionVariants, VelocityOptions as MotionVelocityOptions, VisualState as MotionVisualState, SVGAttributesAsMotionValues, SVGKeyframesDefinition, SVGMotionProps, SVGPathKeyframesDefinition, SVGPathTransitions, SVGTransitions, ScrapeMotionValuesFromProps, ScrollMotionValues } from 'framer-motion';
|
|
3
|
-
import 'react';
|
|
4
|
-
|
|
5
|
-
|
|
5
|
+
import * as React from 'react';
|
|
6
|
+
|
|
7
|
+
type MotionAs = keyof Motion.DOMMotionComponents;
|
|
8
|
+
type UIMotionProps = Merge<UIProps, Motion.MotionProps>;
|
|
9
|
+
type FactoryAttributes<Y> = Y extends React.DetailedHTMLFactory<infer M, any> ? M : Y extends React.SVGFactory ? React.SVGAttributes<SVGElement> : never;
|
|
10
|
+
type FactoryElement<Y> = Y extends React.DetailedHTMLFactory<any, infer M> ? M : Y extends React.SVGFactory ? SVGElement : never;
|
|
11
|
+
type DOMAttributes<Y extends React.HTMLAttributes<M> | React.SVGAttributes<SVGElement>, M extends HTMLElement | SVGElement> = Y;
|
|
12
|
+
type MotionProps<Y extends MotionAs = "div"> = Merge<DOMAttributes<FactoryAttributes<React.ReactDOM[Y]>, FactoryElement<React.ReactDOM[Y]>>, UIMotionProps> & {
|
|
13
|
+
as?: MotionAs;
|
|
14
|
+
};
|
|
15
|
+
type MotionPropsWithoutChildren<Y extends MotionAs = "div"> = Omit<MotionProps<Y>, "children">;
|
|
16
|
+
type ComponentProps<Y extends object, M extends object, D extends object = {}, H extends MotionAs = "div"> = (Merge<Y, WithoutAs<D>> | Merge<M, WithoutAs<D>>) & {
|
|
17
|
+
as?: H;
|
|
18
|
+
};
|
|
19
|
+
type MotionComponent<Y extends MotionAs, M extends object = {}> = {
|
|
20
|
+
<D extends MotionAs = Y>(props: ComponentProps<React.ComponentProps<Y>, React.ComponentProps<D>, M, D>): JSX.Element;
|
|
21
|
+
} & ComponentArgs;
|
|
22
|
+
type TargetResolver<Y = Dict> = (props: Y & MotionTransitionProps) => Motion.TargetAndTransition;
|
|
23
|
+
type Variant<Y = Dict> = Motion.TargetAndTransition | TargetResolver<Y>;
|
|
24
|
+
type MotionTransitionVariants<Y = Dict> = {
|
|
25
|
+
enter: Variant<Y>;
|
|
26
|
+
exit: Variant<Y>;
|
|
27
|
+
initial?: Variant<Y>;
|
|
28
|
+
};
|
|
29
|
+
type MotionLifecycleProps<Y> = Partial<Record<"enter" | "exit", Y>>;
|
|
30
|
+
type MotionTransitionProps = {
|
|
31
|
+
/**
|
|
32
|
+
* Custom `transition` definition for `enter` and `exit`.
|
|
33
|
+
*/
|
|
34
|
+
transition?: MotionLifecycleProps<Motion.Transition>;
|
|
35
|
+
/**
|
|
36
|
+
* Custom `transitionEnd` definition for `enter` and `exit`.
|
|
37
|
+
*/
|
|
38
|
+
transitionEnd?: MotionLifecycleProps<Motion.Target>;
|
|
39
|
+
/**
|
|
40
|
+
* Custom `delay` definition for `enter` and `exit`.
|
|
41
|
+
*/
|
|
42
|
+
delay?: number | MotionLifecycleProps<number>;
|
|
43
|
+
/**
|
|
44
|
+
* Custom `duration` definition for `enter` and `exit`.
|
|
45
|
+
*/
|
|
46
|
+
duration?: number | MotionLifecycleProps<number>;
|
|
47
|
+
/**
|
|
48
|
+
* Custom `enter`.
|
|
49
|
+
*/
|
|
50
|
+
enter?: any;
|
|
51
|
+
/**
|
|
52
|
+
* Custom `exit`.
|
|
53
|
+
*/
|
|
54
|
+
exit?: any;
|
|
55
|
+
/**
|
|
56
|
+
* Custom `initial`.
|
|
57
|
+
*/
|
|
58
|
+
initial?: any;
|
|
59
|
+
};
|
|
60
|
+
type WithTransitionProps<Y extends object> = Omit<Y, "transition"> & MotionTransitionProps & {
|
|
61
|
+
/**
|
|
62
|
+
* If `true`, the element will unmount when `isOpen={false}` and animation is done.
|
|
63
|
+
*/
|
|
64
|
+
unmountOnExit?: boolean;
|
|
65
|
+
/**
|
|
66
|
+
* Show the component. triggers when enter or exit states.
|
|
67
|
+
*/
|
|
68
|
+
isOpen?: boolean;
|
|
69
|
+
};
|
|
70
|
+
type MotionUIPropGetter<Y extends MotionAs = "div", M = undefined> = (props?: MergeIfDefined<MotionProps<Y>, M>, ref?: React.Ref<any>) => MotionProps<Y> & React.RefAttributes<any>;
|
|
71
|
+
type RequiredMotionUIPropGetter<Y extends MotionAs = "div", M = undefined> = (props: MergeIfDefined<MotionProps<Y>, M>, ref?: React.Ref<any>) => MotionProps<Y> & React.RefAttributes<any>;
|
|
72
|
+
|
|
73
|
+
export type { MotionAs, MotionComponent, MotionProps, MotionPropsWithoutChildren, MotionTransitionProps, MotionTransitionVariants, MotionUIPropGetter, RequiredMotionUIPropGetter, WithTransitionProps };
|
package/dist/motion.types.d.ts
CHANGED
|
@@ -1,5 +1,73 @@
|
|
|
1
|
-
import '@yamada-ui/
|
|
1
|
+
import { ComponentArgs, UIProps, WithoutAs } from '@yamada-ui/core';
|
|
2
|
+
import { Merge, Dict, MergeIfDefined } from '@yamada-ui/utils';
|
|
3
|
+
import * as Motion from 'framer-motion';
|
|
2
4
|
export { CSSStyleDeclarationWithTransform, DOMMotionComponents, HTMLMotionProps, AbsoluteKeyframe as MotionAbsoluteKeyframe, MotionAdvancedProps, AnimatePresenceProps as MotionAnimatePresenceProps, AnimationControls as MotionAnimationControls, AnimationDefinition as MotionAnimationDefinition, AnimationLifecycles as MotionAnimationLifecycles, AnimationOptionsWithValueOverrides as MotionAnimationOptionsWithValueOverrides, AnimationPlaybackControls as MotionAnimationPlaybackControls, AnimationPlaybackLifecycles as MotionAnimationPlaybackLifecycles, AnimationPlaybackOptions as MotionAnimationPlaybackOptions, AnimationProps as MotionAnimationProps, AnimationScope as MotionAnimationScope, AnimationSequence as MotionAnimationSequence, AnimationType as MotionAnimationType, At as MotionAt, Axis as MotionAxis, AxisDelta as MotionAxisDelta, BezierDefinition as MotionBezierDefinition, BoundingBox as MotionBoundingBox, Box as MotionBox, MotionConfigProps, CreateVisualElement as MotionCreateVisualElement, CustomDomComponent as MotionCustomDomComponent, CustomValueType as MotionCustomValueType, Cycle as MotionCycle, CycleState as MotionCycleState, DOMKeyframesDefinition as MotionDOMKeyframesDefinition, DOMSegment as MotionDOMSegment, DOMSegmentWithTransition as MotionDOMSegmentWithTransition, DecayOptions as MotionDecayOptions, DelayedFunction as MotionDelayedFunction, Delta as MotionDelta, DevMessage as MotionDevMessage, DragElastic as MotionDragElastic, DragHandlers as MotionDragHandlers, DraggableProps as MotionDraggableProps, DurationSpringOptions as MotionDurationSpringOptions, DynamicAnimationOptions as MotionDynamicAnimationOptions, DynamicOption as MotionDynamicOption, Easing as MotionEasing, EasingDefinition as MotionEasingDefinition, EasingFunction as MotionEasingFunction, EasingModifier as MotionEasingModifier, ElementOrSelector as MotionElementOrSelector, EventInfo as MotionEventInfo, FeatureBundle as MotionFeatureBundle, FeatureDefinition as MotionFeatureDefinition, FeatureDefinitions as MotionFeatureDefinitions, FeaturePackage as MotionFeaturePackage, FeaturePackages as MotionFeaturePackages, FocusHandlers as MotionFocusHandlers, HoverHandlers as MotionHoverHandlers, HydratedFeatureDefinition as MotionHydratedFeatureDefinition, HydratedFeatureDefinitions as MotionHydratedFeatureDefinitions, IProjectionNode as MotionIProjectionNode, Inertia as MotionInertia, InertiaOptions as MotionInertiaOptions, InterpolateOptions as MotionInterpolateOptions, KeyframeOptions as MotionKeyframeOptions, Keyframes as MotionKeyframes, KeyframesTarget as MotionKeyframesTarget, LayoutProps as MotionLayoutProps, LazyFeatureBundle as MotionLazyFeatureBundle, LazyProps as MotionLazyProps, MixerFactory as MotionMixerFactory, None as MotionNone, Orchestration as MotionOrchestration, PanHandlers as MotionPanHandlers, PanInfo as MotionPanInfo, PassiveEffect as MotionPassiveEffect, Point as MotionPoint, RelayoutInfo as MotionRelayoutInfo, RenderComponent as MotionRenderComponent, Repeat as MotionRepeat, RepeatType as MotionRepeatType, ResolveKeyframes as MotionResolveKeyframes, ResolveLayoutTransition as MotionResolveLayoutTransition, ResolvedAnimationDefinition as MotionResolvedAnimationDefinition, ResolvedAnimationDefinitions as MotionResolvedAnimationDefinitions, ResolvedKeyframesTarget as MotionResolvedKeyframesTarget, ResolvedSingleTarget as MotionResolvedSingleTarget, ResolvedValueTarget as MotionResolvedValueTarget, ResolvedValues as MotionResolvedValues, Segment as MotionSegment, SequenceLabel as MotionSequenceLabel, SequenceLabelWithTime as MotionSequenceLabelWithTime, SequenceMap as MotionSequenceMap, SequenceOptions as MotionSequenceOptions, SequenceTime as MotionSequenceTime, SingleTarget as MotionSingleTarget, Spring as MotionSpring, SpringOptions as MotionSpringOptions, MotionStyle, StyleKeyframesDefinition as MotionStyleKeyframesDefinition, StyleTransitions as MotionStyleTransitions, Subscriber as MotionSubscriber, TapHandlers as MotionTapHandlers, TapInfo as MotionTapInfo, Target as MotionTarget, TargetAndTransition as MotionTargetAndTransition, MotionTransform, TransformPoint as MotionTransformPoint, Transition as MotionTransition, Tween as MotionTween, UnresolvedValueKeyframe as MotionUnresolvedValueKeyframe, UseInViewOptions as MotionUseInViewOptions, MotionValue, ValueAnimationOptions as MotionValueAnimationOptions, ValueAnimationTransition as MotionValueAnimationTransition, ValueKeyframe as MotionValueKeyframe, ValueKeyframesDefinition as MotionValueKeyframesDefinition, MotionValueSegment, MotionValueSegmentWithTransition, ValueSequence as MotionValueSequence, ValueTarget as MotionValueTarget, ValueType as MotionValueType, VariableKeyframesDefinition as MotionVariableKeyframesDefinition, VariableTransitions as MotionVariableTransitions, Variant as MotionVariant, VariantLabels as MotionVariantLabels, Variants as MotionVariants, VelocityOptions as MotionVelocityOptions, VisualState as MotionVisualState, SVGAttributesAsMotionValues, SVGKeyframesDefinition, SVGMotionProps, SVGPathKeyframesDefinition, SVGPathTransitions, SVGTransitions, ScrapeMotionValuesFromProps, ScrollMotionValues } from 'framer-motion';
|
|
3
|
-
import 'react';
|
|
4
|
-
|
|
5
|
-
|
|
5
|
+
import * as React from 'react';
|
|
6
|
+
|
|
7
|
+
type MotionAs = keyof Motion.DOMMotionComponents;
|
|
8
|
+
type UIMotionProps = Merge<UIProps, Motion.MotionProps>;
|
|
9
|
+
type FactoryAttributes<Y> = Y extends React.DetailedHTMLFactory<infer M, any> ? M : Y extends React.SVGFactory ? React.SVGAttributes<SVGElement> : never;
|
|
10
|
+
type FactoryElement<Y> = Y extends React.DetailedHTMLFactory<any, infer M> ? M : Y extends React.SVGFactory ? SVGElement : never;
|
|
11
|
+
type DOMAttributes<Y extends React.HTMLAttributes<M> | React.SVGAttributes<SVGElement>, M extends HTMLElement | SVGElement> = Y;
|
|
12
|
+
type MotionProps<Y extends MotionAs = "div"> = Merge<DOMAttributes<FactoryAttributes<React.ReactDOM[Y]>, FactoryElement<React.ReactDOM[Y]>>, UIMotionProps> & {
|
|
13
|
+
as?: MotionAs;
|
|
14
|
+
};
|
|
15
|
+
type MotionPropsWithoutChildren<Y extends MotionAs = "div"> = Omit<MotionProps<Y>, "children">;
|
|
16
|
+
type ComponentProps<Y extends object, M extends object, D extends object = {}, H extends MotionAs = "div"> = (Merge<Y, WithoutAs<D>> | Merge<M, WithoutAs<D>>) & {
|
|
17
|
+
as?: H;
|
|
18
|
+
};
|
|
19
|
+
type MotionComponent<Y extends MotionAs, M extends object = {}> = {
|
|
20
|
+
<D extends MotionAs = Y>(props: ComponentProps<React.ComponentProps<Y>, React.ComponentProps<D>, M, D>): JSX.Element;
|
|
21
|
+
} & ComponentArgs;
|
|
22
|
+
type TargetResolver<Y = Dict> = (props: Y & MotionTransitionProps) => Motion.TargetAndTransition;
|
|
23
|
+
type Variant<Y = Dict> = Motion.TargetAndTransition | TargetResolver<Y>;
|
|
24
|
+
type MotionTransitionVariants<Y = Dict> = {
|
|
25
|
+
enter: Variant<Y>;
|
|
26
|
+
exit: Variant<Y>;
|
|
27
|
+
initial?: Variant<Y>;
|
|
28
|
+
};
|
|
29
|
+
type MotionLifecycleProps<Y> = Partial<Record<"enter" | "exit", Y>>;
|
|
30
|
+
type MotionTransitionProps = {
|
|
31
|
+
/**
|
|
32
|
+
* Custom `transition` definition for `enter` and `exit`.
|
|
33
|
+
*/
|
|
34
|
+
transition?: MotionLifecycleProps<Motion.Transition>;
|
|
35
|
+
/**
|
|
36
|
+
* Custom `transitionEnd` definition for `enter` and `exit`.
|
|
37
|
+
*/
|
|
38
|
+
transitionEnd?: MotionLifecycleProps<Motion.Target>;
|
|
39
|
+
/**
|
|
40
|
+
* Custom `delay` definition for `enter` and `exit`.
|
|
41
|
+
*/
|
|
42
|
+
delay?: number | MotionLifecycleProps<number>;
|
|
43
|
+
/**
|
|
44
|
+
* Custom `duration` definition for `enter` and `exit`.
|
|
45
|
+
*/
|
|
46
|
+
duration?: number | MotionLifecycleProps<number>;
|
|
47
|
+
/**
|
|
48
|
+
* Custom `enter`.
|
|
49
|
+
*/
|
|
50
|
+
enter?: any;
|
|
51
|
+
/**
|
|
52
|
+
* Custom `exit`.
|
|
53
|
+
*/
|
|
54
|
+
exit?: any;
|
|
55
|
+
/**
|
|
56
|
+
* Custom `initial`.
|
|
57
|
+
*/
|
|
58
|
+
initial?: any;
|
|
59
|
+
};
|
|
60
|
+
type WithTransitionProps<Y extends object> = Omit<Y, "transition"> & MotionTransitionProps & {
|
|
61
|
+
/**
|
|
62
|
+
* If `true`, the element will unmount when `isOpen={false}` and animation is done.
|
|
63
|
+
*/
|
|
64
|
+
unmountOnExit?: boolean;
|
|
65
|
+
/**
|
|
66
|
+
* Show the component. triggers when enter or exit states.
|
|
67
|
+
*/
|
|
68
|
+
isOpen?: boolean;
|
|
69
|
+
};
|
|
70
|
+
type MotionUIPropGetter<Y extends MotionAs = "div", M = undefined> = (props?: MergeIfDefined<MotionProps<Y>, M>, ref?: React.Ref<any>) => MotionProps<Y> & React.RefAttributes<any>;
|
|
71
|
+
type RequiredMotionUIPropGetter<Y extends MotionAs = "div", M = undefined> = (props: MergeIfDefined<MotionProps<Y>, M>, ref?: React.Ref<any>) => MotionProps<Y> & React.RefAttributes<any>;
|
|
72
|
+
|
|
73
|
+
export type { MotionAs, MotionComponent, MotionProps, MotionPropsWithoutChildren, MotionTransitionProps, MotionTransitionVariants, MotionUIPropGetter, RequiredMotionUIPropGetter, WithTransitionProps };
|
package/dist/motion.types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/motion.types.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"sources":["../src/motion.types.ts"],"sourcesContent":["import type { ComponentArgs, UIProps, WithoutAs } from \"@yamada-ui/core\"\nimport type { Dict, Merge, MergeIfDefined } from \"@yamada-ui/utils\"\nimport type * as Motion 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 type MotionAs = keyof Motion.DOMMotionComponents\n\ntype UIMotionProps = Merge<UIProps, Motion.MotionProps>\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 as?: MotionAs\n}\n\nexport type MotionPropsWithoutChildren<Y extends MotionAs = \"div\"> = Omit<\n MotionProps<Y>,\n \"children\"\n>\n\ntype ComponentProps<\n Y extends object,\n M extends object,\n D extends object = {},\n H extends MotionAs = \"div\",\n> = (Merge<Y, WithoutAs<D>> | Merge<M, WithoutAs<D>>) & {\n as?: H\n}\n\nexport type MotionComponent<Y extends MotionAs, M extends object = {}> = {\n <D extends MotionAs = Y>(\n props: ComponentProps<\n React.ComponentProps<Y>,\n React.ComponentProps<D>,\n M,\n D\n >,\n ): JSX.Element\n} & ComponentArgs\n\ntype TargetResolver<Y = Dict> = (\n props: Y & MotionTransitionProps,\n) => Motion.TargetAndTransition\n\ntype Variant<Y = Dict> = Motion.TargetAndTransition | TargetResolver<Y>\n\nexport type MotionTransitionVariants<Y = Dict> = {\n enter: Variant<Y>\n exit: Variant<Y>\n initial?: Variant<Y>\n}\n\ntype MotionLifecycleProps<Y> = Partial<Record<\"enter\" | \"exit\", Y>>\n\nexport type MotionTransitionProps = {\n /**\n * Custom `transition` definition for `enter` and `exit`.\n */\n transition?: MotionLifecycleProps<Motion.Transition>\n /**\n * Custom `transitionEnd` definition for `enter` and `exit`.\n */\n transitionEnd?: MotionLifecycleProps<Motion.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<Y, \"transition\"> &\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\nexport type MotionUIPropGetter<Y extends MotionAs = \"div\", M = undefined> = (\n props?: MergeIfDefined<MotionProps<Y>, M>,\n ref?: React.Ref<any>,\n) => MotionProps<Y> & React.RefAttributes<any>\n\nexport type RequiredMotionUIPropGetter<\n Y extends MotionAs = \"div\",\n M = undefined,\n> = (\n props: MergeIfDefined<MotionProps<Y>, M>,\n ref?: React.Ref<any>,\n) => MotionProps<Y> & React.RefAttributes<any>\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
|
package/dist/utils.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Transition } from 'framer-motion';
|
|
2
|
-
import {
|
|
2
|
+
import { MotionTransitionProps } from './motion.types.mjs';
|
|
3
3
|
import '@yamada-ui/core';
|
|
4
|
-
import 'react';
|
|
5
4
|
import '@yamada-ui/utils';
|
|
5
|
+
import 'react';
|
|
6
6
|
|
|
7
7
|
declare const MOTION_TRANSITION_EASINGS: {
|
|
8
8
|
readonly ease: readonly [0.25, 0.1, 0.25, 1];
|
|
@@ -134,7 +134,7 @@ declare const MOTION_TRANSITION_DEFAULTS: {
|
|
|
134
134
|
readonly ease: readonly [0.4, 0, 1, 1];
|
|
135
135
|
};
|
|
136
136
|
};
|
|
137
|
-
declare const transitionEnter: (transition?: Transition) => (delay?:
|
|
138
|
-
declare const transitionExit: (transition?: Transition) => (delay?:
|
|
137
|
+
declare const transitionEnter: (transition?: Transition) => (delay?: MotionTransitionProps["delay"], duration?: MotionTransitionProps["duration"]) => Transition;
|
|
138
|
+
declare const transitionExit: (transition?: Transition) => (delay?: MotionTransitionProps["delay"], duration?: MotionTransitionProps["duration"]) => Transition;
|
|
139
139
|
|
|
140
140
|
export { MOTION_TRANSITION_DEFAULTS, MOTION_TRANSITION_EASINGS, MOTION_TRANSITION_VARIANTS, transitionEnter, transitionExit };
|
package/dist/utils.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Transition } from 'framer-motion';
|
|
2
|
-
import {
|
|
2
|
+
import { MotionTransitionProps } from './motion.types.js';
|
|
3
3
|
import '@yamada-ui/core';
|
|
4
|
-
import 'react';
|
|
5
4
|
import '@yamada-ui/utils';
|
|
5
|
+
import 'react';
|
|
6
6
|
|
|
7
7
|
declare const MOTION_TRANSITION_EASINGS: {
|
|
8
8
|
readonly ease: readonly [0.25, 0.1, 0.25, 1];
|
|
@@ -134,7 +134,7 @@ declare const MOTION_TRANSITION_DEFAULTS: {
|
|
|
134
134
|
readonly ease: readonly [0.4, 0, 1, 1];
|
|
135
135
|
};
|
|
136
136
|
};
|
|
137
|
-
declare const transitionEnter: (transition?: Transition) => (delay?:
|
|
138
|
-
declare const transitionExit: (transition?: Transition) => (delay?:
|
|
137
|
+
declare const transitionEnter: (transition?: Transition) => (delay?: MotionTransitionProps["delay"], duration?: MotionTransitionProps["duration"]) => Transition;
|
|
138
|
+
declare const transitionExit: (transition?: Transition) => (delay?: MotionTransitionProps["delay"], duration?: MotionTransitionProps["duration"]) => Transition;
|
|
139
139
|
|
|
140
140
|
export { MOTION_TRANSITION_DEFAULTS, MOTION_TRANSITION_EASINGS, MOTION_TRANSITION_VARIANTS, transitionEnter, transitionExit };
|
package/dist/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import { isNumber } from \"@yamada-ui/utils\"\nimport type { Transition } from \"framer-motion\"\nimport type {
|
|
1
|
+
{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import { isNumber } from \"@yamada-ui/utils\"\nimport type { Transition } from \"framer-motion\"\nimport type { MotionTransitionProps } from \"./motion.types\"\n\nexport const MOTION_TRANSITION_EASINGS = {\n ease: [0.25, 0.1, 0.25, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n} as const\n\nexport const MOTION_TRANSITION_VARIANTS = {\n scale: {\n enter: { scale: 1 },\n exit: { scale: 0.95 },\n },\n fade: {\n enter: { opacity: 1 },\n exit: { opacity: 0 },\n },\n pushLeft: {\n enter: { x: \"100%\" },\n exit: { x: \"-30%\" },\n },\n pushRight: {\n enter: { x: \"-100%\" },\n exit: { x: \"30%\" },\n },\n pushUp: {\n enter: { y: \"100%\" },\n exit: { y: \"-30%\" },\n },\n pushDown: {\n enter: { y: \"-100%\" },\n exit: { y: \"30%\" },\n },\n slideLeft: {\n position: { left: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"-100%\", y: 0 },\n },\n slideRight: {\n position: { right: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"100%\", y: 0 },\n },\n slideUp: {\n position: { top: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"-100%\" },\n },\n slideDown: {\n position: { bottom: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"100%\" },\n },\n} as const\n\nexport const MOTION_TRANSITION_DEFAULTS = {\n enter: {\n duration: 0.25,\n ease: MOTION_TRANSITION_EASINGS.easeOut,\n },\n exit: {\n duration: 0.2,\n ease: MOTION_TRANSITION_EASINGS.easeIn,\n },\n} as const\n\nexport const transitionEnter =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProps[\"delay\"],\n duration?: MotionTransitionProps[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.enter),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.enter }\n : {}),\n delay: isNumber(delay) ? delay : delay?.enter,\n })\n\nexport const transitionExit =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProps[\"delay\"],\n duration?: MotionTransitionProps[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.exit),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.exit }\n : {}),\n delay: isNumber(delay) ? delay : delay?.exit,\n })\n"],"mappings":"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","names":[]}
|
package/dist/utils.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/motion",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.2.0-dev-20240815131426",
|
|
4
4
|
"description": "Yamada UI motion components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"framer-motion": "^11.3.24",
|
|
40
|
-
"@yamada-ui/core": "1.13.0-dev-
|
|
41
|
-
"@yamada-ui/utils": "1.4.0-dev-
|
|
40
|
+
"@yamada-ui/core": "1.13.0-dev-20240815131426",
|
|
41
|
+
"@yamada-ui/utils": "1.4.0-dev-20240815131426"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"clean-package": "2.2.0",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import { isNumber } from \"@yamada-ui/utils\"\nimport type { Transition } from \"framer-motion\"\nimport type { MotionTransitionProperties } from \"./motion.types\"\n\nexport const MOTION_TRANSITION_EASINGS = {\n ease: [0.25, 0.1, 0.25, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n} as const\n\nexport const MOTION_TRANSITION_VARIANTS = {\n scale: {\n enter: { scale: 1 },\n exit: { scale: 0.95 },\n },\n fade: {\n enter: { opacity: 1 },\n exit: { opacity: 0 },\n },\n pushLeft: {\n enter: { x: \"100%\" },\n exit: { x: \"-30%\" },\n },\n pushRight: {\n enter: { x: \"-100%\" },\n exit: { x: \"30%\" },\n },\n pushUp: {\n enter: { y: \"100%\" },\n exit: { y: \"-30%\" },\n },\n pushDown: {\n enter: { y: \"-100%\" },\n exit: { y: \"30%\" },\n },\n slideLeft: {\n position: { left: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"-100%\", y: 0 },\n },\n slideRight: {\n position: { right: 0, top: 0, bottom: 0, width: \"100%\" },\n enter: { x: 0, y: 0 },\n exit: { x: \"100%\", y: 0 },\n },\n slideUp: {\n position: { top: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"-100%\" },\n },\n slideDown: {\n position: { bottom: 0, left: 0, right: 0, maxWidth: \"100vw\" },\n enter: { x: 0, y: 0 },\n exit: { x: 0, y: \"100%\" },\n },\n} as const\n\nexport const MOTION_TRANSITION_DEFAULTS = {\n enter: {\n duration: 0.25,\n ease: MOTION_TRANSITION_EASINGS.easeOut,\n },\n exit: {\n duration: 0.2,\n ease: MOTION_TRANSITION_EASINGS.easeIn,\n },\n} as const\n\nexport const transitionEnter =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProperties[\"delay\"],\n duration?: MotionTransitionProperties[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.enter),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.enter }\n : {}),\n delay: isNumber(delay) ? delay : delay?.enter,\n })\n\nexport const transitionExit =\n (transition?: Transition) =>\n (\n delay?: MotionTransitionProperties[\"delay\"],\n duration?: MotionTransitionProperties[\"duration\"],\n ): Transition => ({\n ...(transition ?? MOTION_TRANSITION_DEFAULTS.exit),\n ...(duration\n ? { duration: isNumber(duration) ? duration : duration?.exit }\n : {}),\n delay: isNumber(delay) ? delay : delay?.exit,\n })\n"],"mappings":";;;AAAA,SAAS,gBAAgB;AAIlB,IAAM,4BAA4B;AAAA,EACvC,MAAM,CAAC,MAAM,KAAK,MAAM,CAAC;AAAA,EACzB,QAAQ,CAAC,KAAK,GAAG,GAAG,CAAC;AAAA,EACrB,SAAS,CAAC,GAAG,GAAG,KAAK,CAAC;AAAA,EACtB,WAAW,CAAC,KAAK,GAAG,KAAK,CAAC;AAC5B;AAEO,IAAM,6BAA6B;AAAA,EACxC,OAAO;AAAA,IACL,OAAO,EAAE,OAAO,EAAE;AAAA,IAClB,MAAM,EAAE,OAAO,KAAK;AAAA,EACtB;AAAA,EACA,MAAM;AAAA,IACJ,OAAO,EAAE,SAAS,EAAE;AAAA,IACpB,MAAM,EAAE,SAAS,EAAE;AAAA,EACrB;AAAA,EACA,UAAU;AAAA,IACR,OAAO,EAAE,GAAG,OAAO;AAAA,IACnB,MAAM,EAAE,GAAG,OAAO;AAAA,EACpB;AAAA,EACA,WAAW;AAAA,IACT,OAAO,EAAE,GAAG,QAAQ;AAAA,IACpB,MAAM,EAAE,GAAG,MAAM;AAAA,EACnB;AAAA,EACA,QAAQ;AAAA,IACN,OAAO,EAAE,GAAG,OAAO;AAAA,IACnB,MAAM,EAAE,GAAG,OAAO;AAAA,EACpB;AAAA,EACA,UAAU;AAAA,IACR,OAAO,EAAE,GAAG,QAAQ;AAAA,IACpB,MAAM,EAAE,GAAG,MAAM;AAAA,EACnB;AAAA,EACA,WAAW;AAAA,IACT,UAAU,EAAE,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,OAAO;AAAA,IACtD,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,SAAS,GAAG,EAAE;AAAA,EAC3B;AAAA,EACA,YAAY;AAAA,IACV,UAAU,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,OAAO;AAAA,IACvD,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,QAAQ,GAAG,EAAE;AAAA,EAC1B;AAAA,EACA,SAAS;AAAA,IACP,UAAU,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,QAAQ;AAAA,IACzD,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,GAAG,GAAG,QAAQ;AAAA,EAC3B;AAAA,EACA,WAAW;AAAA,IACT,UAAU,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,QAAQ;AAAA,IAC5D,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACpB,MAAM,EAAE,GAAG,GAAG,GAAG,OAAO;AAAA,EAC1B;AACF;AAEO,IAAM,6BAA6B;AAAA,EACxC,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM,0BAA0B;AAAA,EAClC;AAAA,EACA,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,MAAM,0BAA0B;AAAA,EAClC;AACF;AAEO,IAAM,kBACX,CAAC,eACD,CACE,OACA,cACgB;AAAA,EAChB,GAAI,kCAAc,2BAA2B;AAAA,EAC7C,GAAI,WACA,EAAE,UAAU,SAAS,QAAQ,IAAI,WAAW,qCAAU,MAAM,IAC5D,CAAC;AAAA,EACL,OAAO,SAAS,KAAK,IAAI,QAAQ,+BAAO;AAC1C;AAEK,IAAM,iBACX,CAAC,eACD,CACE,OACA,cACgB;AAAA,EAChB,GAAI,kCAAc,2BAA2B;AAAA,EAC7C,GAAI,WACA,EAAE,UAAU,SAAS,QAAQ,IAAI,WAAW,qCAAU,KAAK,IAC3D,CAAC;AAAA,EACL,OAAO,SAAS,KAAK,IAAI,QAAQ,+BAAO;AAC1C;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/motion.tsx"],"sourcesContent":["import type { HTMLUIProps } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport type { HTMLMotionProps } from \"framer-motion\"\nimport { motion } from \"framer-motion\"\nimport type { ReactHTML } from \"react\"\nimport type { MotionAs } from \"./motion.types\"\n\ntype MotionOptions = {\n as?: MotionAs\n}\n\ntype BaseMotionProps<Y extends keyof ReactHTML = \"div\"> = Omit<\n HTMLMotionProps<Y>,\n \"color\"\n> &\n MotionOptions\n\nexport type MotionProps<Y extends keyof ReactHTML = \"div\"> = Omit<\n HTMLUIProps<Y>,\n keyof BaseMotionProps<Y>\n> &\n BaseMotionProps<Y>\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 = forwardRef<MotionProps, \"div\", false>(\n ({ as = \"div\", className, ...rest }, ref) => {\n return (\n <ui.div\n as={motion[as]}\n ref={ref}\n className={cx(\"ui-motion\", className)}\n {...rest}\n />\n )\n },\n)\n"],"mappings":";;;AACA,SAAS,IAAI,kBAAkB;AAC/B,SAAS,UAAU;AAEnB,SAAS,cAAc;AA4BjB;AAHC,IAAM,SAAS;AAAA,EACpB,CAAC,EAAE,KAAK,OAAO,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC3C,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,IAAI,OAAO,EAAE;AAAA,QACb;AAAA,QACA,WAAW,GAAG,aAAa,SAAS;AAAA,QACnC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;","names":[]}
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
|
-
import { HTMLUIProps } from '@yamada-ui/core';
|
|
3
|
-
import { motion, Transition, Target, TargetAndTransition, HTMLMotionProps } from 'framer-motion';
|
|
4
|
-
import { ReactHTML, Ref, RefAttributes } from 'react';
|
|
5
|
-
import { Dict, Merge } from '@yamada-ui/utils';
|
|
6
|
-
|
|
7
|
-
type MotionAs = keyof typeof motion;
|
|
8
|
-
type TargetResolver<Y = Dict> = (props: Y & MotionTransitionProperties) => TargetAndTransition;
|
|
9
|
-
type Variant<Y = Dict> = TargetAndTransition | TargetResolver<Y>;
|
|
10
|
-
type MotionTransitionVariants<Y = Dict> = {
|
|
11
|
-
enter: Variant<Y>;
|
|
12
|
-
exit: Variant<Y>;
|
|
13
|
-
initial?: Variant<Y>;
|
|
14
|
-
};
|
|
15
|
-
type MotionTransitionProperties = {
|
|
16
|
-
/**
|
|
17
|
-
* Custom `transition` definition for `enter` and `exit`.
|
|
18
|
-
*/
|
|
19
|
-
transition?: MotionTransitionProps;
|
|
20
|
-
/**
|
|
21
|
-
* Custom `transitionEnd` definition for `enter` and `exit`.
|
|
22
|
-
*/
|
|
23
|
-
transitionEnd?: MotionTransitionEndProps;
|
|
24
|
-
/**
|
|
25
|
-
* Custom `delay` definition for `enter` and `exit`.
|
|
26
|
-
*/
|
|
27
|
-
delay?: number | MotionDelayProps;
|
|
28
|
-
/**
|
|
29
|
-
* Custom `duration` definition for `enter` and `exit`.
|
|
30
|
-
*/
|
|
31
|
-
duration?: number | MotionDurationProps;
|
|
32
|
-
/**
|
|
33
|
-
* Custom `enter`.
|
|
34
|
-
*/
|
|
35
|
-
enter?: any;
|
|
36
|
-
/**
|
|
37
|
-
* Custom `exit`.
|
|
38
|
-
*/
|
|
39
|
-
exit?: any;
|
|
40
|
-
/**
|
|
41
|
-
* Custom `initial`.
|
|
42
|
-
*/
|
|
43
|
-
initial?: any;
|
|
44
|
-
};
|
|
45
|
-
type WithMotionProps<Y> = Partial<Record<"enter" | "exit", Y>>;
|
|
46
|
-
type MotionTransitionProps = WithMotionProps<Transition>;
|
|
47
|
-
type MotionTransitionEndProps = WithMotionProps<Target>;
|
|
48
|
-
type MotionDelayProps = WithMotionProps<number>;
|
|
49
|
-
type MotionDurationProps = WithMotionProps<number>;
|
|
50
|
-
type WithTransitionProps<Y extends object> = Omit<Y, "transition"> & MotionTransitionProperties & {
|
|
51
|
-
/**
|
|
52
|
-
* If `true`, the element will unmount when `isOpen={false}` and animation is done.
|
|
53
|
-
*/
|
|
54
|
-
unmountOnExit?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* Show the component. triggers when enter or exit states.
|
|
57
|
-
*/
|
|
58
|
-
isOpen?: boolean;
|
|
59
|
-
};
|
|
60
|
-
type MotionUIPropGetter<Y extends keyof ReactHTML = "div", M = undefined> = (props?: Merge<MotionProps<Y>, M>, ref?: Ref<any>) => MotionProps<Y> & RefAttributes<any>;
|
|
61
|
-
type RequiredMotionUIPropGetter<Y extends keyof ReactHTML = "div", M = undefined> = (props: Merge<MotionProps<Y>, M>, ref?: Ref<any>) => MotionProps<Y> & RefAttributes<any>;
|
|
62
|
-
|
|
63
|
-
type MotionOptions = {
|
|
64
|
-
as?: MotionAs;
|
|
65
|
-
};
|
|
66
|
-
type BaseMotionProps<Y extends keyof ReactHTML = "div"> = Omit<HTMLMotionProps<Y>, "color"> & MotionOptions;
|
|
67
|
-
type MotionProps<Y extends keyof ReactHTML = "div"> = Omit<HTMLUIProps<Y>, keyof BaseMotionProps<Y>> & BaseMotionProps<Y>;
|
|
68
|
-
/**
|
|
69
|
-
* `Motion` is a component that allows for the easy implementation of a wide variety of animations.
|
|
70
|
-
*
|
|
71
|
-
* @see Docs https://yamada-ui.com/components/other/motion
|
|
72
|
-
*/
|
|
73
|
-
declare const Motion: _yamada_ui_core.Component<"div", MotionProps<"div">>;
|
|
74
|
-
|
|
75
|
-
export { type MotionTransitionProperties as M, type RequiredMotionUIPropGetter as R, type WithTransitionProps as W, Motion as a, type MotionProps as b, type MotionAs as c, type MotionTransitionVariants as d, type MotionTransitionProps as e, type MotionTransitionEndProps as f, type MotionDelayProps as g, type MotionDurationProps as h, type MotionUIPropGetter as i };
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
|
-
import { HTMLUIProps } from '@yamada-ui/core';
|
|
3
|
-
import { motion, Transition, Target, TargetAndTransition, HTMLMotionProps } from 'framer-motion';
|
|
4
|
-
import { ReactHTML, Ref, RefAttributes } from 'react';
|
|
5
|
-
import { Dict, Merge } from '@yamada-ui/utils';
|
|
6
|
-
|
|
7
|
-
type MotionAs = keyof typeof motion;
|
|
8
|
-
type TargetResolver<Y = Dict> = (props: Y & MotionTransitionProperties) => TargetAndTransition;
|
|
9
|
-
type Variant<Y = Dict> = TargetAndTransition | TargetResolver<Y>;
|
|
10
|
-
type MotionTransitionVariants<Y = Dict> = {
|
|
11
|
-
enter: Variant<Y>;
|
|
12
|
-
exit: Variant<Y>;
|
|
13
|
-
initial?: Variant<Y>;
|
|
14
|
-
};
|
|
15
|
-
type MotionTransitionProperties = {
|
|
16
|
-
/**
|
|
17
|
-
* Custom `transition` definition for `enter` and `exit`.
|
|
18
|
-
*/
|
|
19
|
-
transition?: MotionTransitionProps;
|
|
20
|
-
/**
|
|
21
|
-
* Custom `transitionEnd` definition for `enter` and `exit`.
|
|
22
|
-
*/
|
|
23
|
-
transitionEnd?: MotionTransitionEndProps;
|
|
24
|
-
/**
|
|
25
|
-
* Custom `delay` definition for `enter` and `exit`.
|
|
26
|
-
*/
|
|
27
|
-
delay?: number | MotionDelayProps;
|
|
28
|
-
/**
|
|
29
|
-
* Custom `duration` definition for `enter` and `exit`.
|
|
30
|
-
*/
|
|
31
|
-
duration?: number | MotionDurationProps;
|
|
32
|
-
/**
|
|
33
|
-
* Custom `enter`.
|
|
34
|
-
*/
|
|
35
|
-
enter?: any;
|
|
36
|
-
/**
|
|
37
|
-
* Custom `exit`.
|
|
38
|
-
*/
|
|
39
|
-
exit?: any;
|
|
40
|
-
/**
|
|
41
|
-
* Custom `initial`.
|
|
42
|
-
*/
|
|
43
|
-
initial?: any;
|
|
44
|
-
};
|
|
45
|
-
type WithMotionProps<Y> = Partial<Record<"enter" | "exit", Y>>;
|
|
46
|
-
type MotionTransitionProps = WithMotionProps<Transition>;
|
|
47
|
-
type MotionTransitionEndProps = WithMotionProps<Target>;
|
|
48
|
-
type MotionDelayProps = WithMotionProps<number>;
|
|
49
|
-
type MotionDurationProps = WithMotionProps<number>;
|
|
50
|
-
type WithTransitionProps<Y extends object> = Omit<Y, "transition"> & MotionTransitionProperties & {
|
|
51
|
-
/**
|
|
52
|
-
* If `true`, the element will unmount when `isOpen={false}` and animation is done.
|
|
53
|
-
*/
|
|
54
|
-
unmountOnExit?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* Show the component. triggers when enter or exit states.
|
|
57
|
-
*/
|
|
58
|
-
isOpen?: boolean;
|
|
59
|
-
};
|
|
60
|
-
type MotionUIPropGetter<Y extends keyof ReactHTML = "div", M = undefined> = (props?: Merge<MotionProps<Y>, M>, ref?: Ref<any>) => MotionProps<Y> & RefAttributes<any>;
|
|
61
|
-
type RequiredMotionUIPropGetter<Y extends keyof ReactHTML = "div", M = undefined> = (props: Merge<MotionProps<Y>, M>, ref?: Ref<any>) => MotionProps<Y> & RefAttributes<any>;
|
|
62
|
-
|
|
63
|
-
type MotionOptions = {
|
|
64
|
-
as?: MotionAs;
|
|
65
|
-
};
|
|
66
|
-
type BaseMotionProps<Y extends keyof ReactHTML = "div"> = Omit<HTMLMotionProps<Y>, "color"> & MotionOptions;
|
|
67
|
-
type MotionProps<Y extends keyof ReactHTML = "div"> = Omit<HTMLUIProps<Y>, keyof BaseMotionProps<Y>> & BaseMotionProps<Y>;
|
|
68
|
-
/**
|
|
69
|
-
* `Motion` is a component that allows for the easy implementation of a wide variety of animations.
|
|
70
|
-
*
|
|
71
|
-
* @see Docs https://yamada-ui.com/components/other/motion
|
|
72
|
-
*/
|
|
73
|
-
declare const Motion: _yamada_ui_core.Component<"div", MotionProps<"div">>;
|
|
74
|
-
|
|
75
|
-
export { type MotionTransitionProperties as M, type RequiredMotionUIPropGetter as R, type WithTransitionProps as W, Motion as a, type MotionProps as b, type MotionAs as c, type MotionTransitionVariants as d, type MotionTransitionProps as e, type MotionTransitionEndProps as f, type MotionDelayProps as g, type MotionDurationProps as h, type MotionUIPropGetter as i };
|