framer-motion 6.3.10 → 6.3.13

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.
Files changed (234) hide show
  1. package/dist/cjs/index.js +18 -25
  2. package/dist/es/animation/use-animated-state.mjs +0 -1
  3. package/dist/es/animation/utils/transitions.mjs +0 -2
  4. package/dist/es/context/DeprecatedLayoutGroupContext.mjs +0 -1
  5. package/dist/es/context/LayoutGroupContext.mjs +0 -3
  6. package/dist/es/gestures/use-pan-gesture.mjs +1 -1
  7. package/dist/es/motion/index.mjs +0 -2
  8. package/dist/es/motion/utils/valid-prop.mjs +1 -1
  9. package/dist/es/projection/styles/transform.mjs +13 -2
  10. package/dist/es/render/utils/animation.mjs +0 -3
  11. package/dist/es/render/utils/motion-values.mjs +1 -1
  12. package/dist/es/value/index.mjs +2 -5
  13. package/dist/es/value/use-inverted-scale.mjs +0 -1
  14. package/dist/es/value/utils/resolve-motion-value.mjs +0 -2
  15. package/dist/framer-motion.dev.js +18 -25
  16. package/dist/framer-motion.js +1 -1
  17. package/dist/index.d.ts +4188 -0
  18. package/dist/projection.dev.js +16 -12
  19. package/dist/size-rollup-dom-animation.js +1 -1
  20. package/dist/size-rollup-dom-max.js +1 -1
  21. package/dist/size-webpack-dom-max.js +1 -1
  22. package/dist/three-entry.d.ts +2502 -0
  23. package/package.json +5 -5
  24. package/types/animation/animate.d.ts +0 -54
  25. package/types/animation/animation-controls.d.ts +0 -5
  26. package/types/animation/types.d.ts +0 -79
  27. package/types/animation/use-animated-state.d.ts +0 -6
  28. package/types/animation/use-animation.d.ts +0 -31
  29. package/types/animation/utils/default-transitions.d.ts +0 -19
  30. package/types/animation/utils/easing.d.ts +0 -3
  31. package/types/animation/utils/is-animatable.d.ts +0 -11
  32. package/types/animation/utils/is-animation-controls.d.ts +0 -2
  33. package/types/animation/utils/is-keyframes-target.d.ts +0 -2
  34. package/types/animation/utils/transitions.d.ts +0 -29
  35. package/types/animation/utils/variant-resolvers.d.ts +0 -12
  36. package/types/components/AnimatePresence/PresenceChild.d.ts +0 -12
  37. package/types/components/AnimatePresence/index.d.ts +0 -36
  38. package/types/components/AnimatePresence/types.d.ts +0 -61
  39. package/types/components/AnimatePresence/use-presence.d.ts +0 -52
  40. package/types/components/AnimateSharedLayout.d.ts +0 -2
  41. package/types/components/LayoutGroup/index.d.ts +0 -12
  42. package/types/components/LazyMotion/index.d.ts +0 -38
  43. package/types/components/LazyMotion/types.d.ts +0 -54
  44. package/types/components/MotionConfig/index.d.ts +0 -25
  45. package/types/components/Reorder/Group.d.ts +0 -297
  46. package/types/components/Reorder/Item.d.ts +0 -278
  47. package/types/components/Reorder/index.d.ts +0 -509
  48. package/types/components/Reorder/types.d.ts +0 -10
  49. package/types/components/Reorder/utils/check-reorder.d.ts +0 -2
  50. package/types/context/DeprecatedLayoutGroupContext.d.ts +0 -6
  51. package/types/context/LayoutGroupContext.d.ts +0 -11
  52. package/types/context/LazyContext.d.ts +0 -7
  53. package/types/context/MotionConfigContext.d.ts +0 -36
  54. package/types/context/MotionContext/create.d.ts +0 -3
  55. package/types/context/MotionContext/index.d.ts +0 -9
  56. package/types/context/MotionContext/utils.d.ts +0 -3
  57. package/types/context/PresenceContext.d.ts +0 -17
  58. package/types/context/ReorderContext.d.ts +0 -3
  59. package/types/context/SwitchLayoutGroupContext.d.ts +0 -23
  60. package/types/events/event-info.d.ts +0 -5
  61. package/types/events/types.d.ts +0 -10
  62. package/types/events/use-dom-event.d.ts +0 -24
  63. package/types/events/use-pointer-event.d.ts +0 -4
  64. package/types/events/utils.d.ts +0 -3
  65. package/types/gestures/PanSession.d.ts +0 -127
  66. package/types/gestures/drag/VisualElementDragControls.d.ts +0 -56
  67. package/types/gestures/drag/types.d.ts +0 -294
  68. package/types/gestures/drag/use-drag-controls.d.ts +0 -74
  69. package/types/gestures/drag/use-drag.d.ts +0 -7
  70. package/types/gestures/drag/utils/constraints.d.ts +0 -77
  71. package/types/gestures/drag/utils/lock.d.ts +0 -4
  72. package/types/gestures/types.d.ts +0 -225
  73. package/types/gestures/use-focus-gesture.d.ts +0 -8
  74. package/types/gestures/use-hover-gesture.d.ts +0 -2
  75. package/types/gestures/use-pan-gesture.d.ts +0 -14
  76. package/types/gestures/use-tap-gesture.d.ts +0 -6
  77. package/types/gestures/utils/event-type.d.ts +0 -2
  78. package/types/gestures/utils/is-node-or-child.d.ts +0 -8
  79. package/types/index.d.ts +0 -96
  80. package/types/motion/features/animations.d.ts +0 -2
  81. package/types/motion/features/definitions.d.ts +0 -3
  82. package/types/motion/features/drag.d.ts +0 -2
  83. package/types/motion/features/gestures.d.ts +0 -2
  84. package/types/motion/features/layout/MeasureLayout.d.ts +0 -3
  85. package/types/motion/features/layout/index.d.ts +0 -2
  86. package/types/motion/features/layout/types.d.ts +0 -75
  87. package/types/motion/features/types.d.ts +0 -52
  88. package/types/motion/features/use-features.d.ts +0 -8
  89. package/types/motion/features/use-projection.d.ts +0 -3
  90. package/types/motion/features/viewport/observers.d.ts +0 -3
  91. package/types/motion/features/viewport/types.d.ts +0 -21
  92. package/types/motion/features/viewport/use-viewport.d.ts +0 -2
  93. package/types/motion/index.d.ts +0 -25
  94. package/types/motion/types.d.ts +0 -279
  95. package/types/motion/utils/VisualElementHandler.d.ts +0 -18
  96. package/types/motion/utils/is-forced-motion-value.d.ts +0 -2
  97. package/types/motion/utils/make-renderless-component.d.ts +0 -2
  98. package/types/motion/utils/should-inherit-variant.d.ts +0 -2
  99. package/types/motion/utils/use-motion-ref.d.ts +0 -8
  100. package/types/motion/utils/use-visual-element.d.ts +0 -6
  101. package/types/motion/utils/use-visual-state.d.ts +0 -14
  102. package/types/motion/utils/valid-prop.d.ts +0 -9
  103. package/types/projection/animation/mix-values.d.ts +0 -2
  104. package/types/projection/geometry/conversion.d.ts +0 -14
  105. package/types/projection/geometry/copy.d.ts +0 -13
  106. package/types/projection/geometry/delta-apply.d.ts +0 -37
  107. package/types/projection/geometry/delta-calc.d.ts +0 -10
  108. package/types/projection/geometry/delta-remove.d.ts +0 -20
  109. package/types/projection/geometry/models.d.ts +0 -5
  110. package/types/projection/geometry/types.d.ts +0 -29
  111. package/types/projection/geometry/utils.d.ts +0 -3
  112. package/types/projection/index.d.ts +0 -14
  113. package/types/projection/node/DocumentProjectionNode.d.ts +0 -108
  114. package/types/projection/node/HTMLProjectionNode.d.ts +0 -112
  115. package/types/projection/node/create-projection-node.d.ts +0 -301
  116. package/types/projection/node/group.d.ts +0 -7
  117. package/types/projection/node/id.d.ts +0 -1
  118. package/types/projection/node/types.d.ts +0 -136
  119. package/types/projection/shared/stack.d.ts +0 -17
  120. package/types/projection/styles/scale-border-radius.d.ts +0 -11
  121. package/types/projection/styles/scale-box-shadow.d.ts +0 -2
  122. package/types/projection/styles/scale-correction.d.ts +0 -3
  123. package/types/projection/styles/transform-origin.d.ts +0 -0
  124. package/types/projection/styles/transform.d.ts +0 -4
  125. package/types/projection/styles/types.d.ts +0 -9
  126. package/types/projection/use-instant-layout-transition.d.ts +0 -1
  127. package/types/projection/use-reset-projection.d.ts +0 -1
  128. package/types/projection/utils/each-axis.d.ts +0 -3
  129. package/types/projection/utils/has-transform.d.ts +0 -3
  130. package/types/projection/utils/measure.d.ts +0 -4
  131. package/types/render/dom/create-visual-element.d.ts +0 -2
  132. package/types/render/dom/features-animation.d.ts +0 -5
  133. package/types/render/dom/features-max.d.ts +0 -5
  134. package/types/render/dom/motion-minimal.d.ts +0 -5
  135. package/types/render/dom/motion-proxy.d.ts +0 -30
  136. package/types/render/dom/motion.d.ts +0 -25
  137. package/types/render/dom/types.d.ts +0 -28
  138. package/types/render/dom/use-render.d.ts +0 -4
  139. package/types/render/dom/utils/camel-to-dash.d.ts +0 -4
  140. package/types/render/dom/utils/create-config.d.ts +0 -8
  141. package/types/render/dom/utils/css-variables-conversion.d.ts +0 -22
  142. package/types/render/dom/utils/filter-props.d.ts +0 -4
  143. package/types/render/dom/utils/is-css-variable.d.ts +0 -4
  144. package/types/render/dom/utils/is-svg-component.d.ts +0 -2
  145. package/types/render/dom/utils/parse-dom-variant.d.ts +0 -6
  146. package/types/render/dom/utils/unit-conversion.d.ts +0 -27
  147. package/types/render/dom/value-types/animatable-none.d.ts +0 -1
  148. package/types/render/dom/value-types/defaults.d.ts +0 -9
  149. package/types/render/dom/value-types/dimensions.d.ts +0 -8
  150. package/types/render/dom/value-types/find.d.ts +0 -9
  151. package/types/render/dom/value-types/get-as-type.d.ts +0 -5
  152. package/types/render/dom/value-types/number.d.ts +0 -2
  153. package/types/render/dom/value-types/test.d.ts +0 -5
  154. package/types/render/dom/value-types/type-auto.d.ts +0 -5
  155. package/types/render/dom/value-types/type-int.d.ts +0 -8
  156. package/types/render/dom/value-types/types.d.ts +0 -4
  157. package/types/render/html/config-motion.d.ts +0 -3
  158. package/types/render/html/supported-elements.d.ts +0 -7
  159. package/types/render/html/types.d.ts +0 -61
  160. package/types/render/html/use-props.d.ts +0 -8
  161. package/types/render/html/utils/build-styles.d.ts +0 -5
  162. package/types/render/html/utils/build-transform.d.ts +0 -15
  163. package/types/render/html/utils/create-render-state.d.ts +0 -7
  164. package/types/render/html/utils/render.d.ts +0 -4
  165. package/types/render/html/utils/scrape-motion-values.d.ts +0 -2
  166. package/types/render/html/utils/transform.d.ts +0 -15
  167. package/types/render/html/visual-element.d.ts +0 -6
  168. package/types/render/index.d.ts +0 -2
  169. package/types/render/svg/config-motion.d.ts +0 -3
  170. package/types/render/svg/lowercase-elements.d.ts +0 -5
  171. package/types/render/svg/supported-elements.d.ts +0 -7
  172. package/types/render/svg/types.d.ts +0 -44
  173. package/types/render/svg/use-props.d.ts +0 -7
  174. package/types/render/svg/utils/build-attrs.d.ts +0 -8
  175. package/types/render/svg/utils/camel-case-attrs.d.ts +0 -4
  176. package/types/render/svg/utils/create-render-state.d.ts +0 -2
  177. package/types/render/svg/utils/path.d.ts +0 -9
  178. package/types/render/svg/utils/render.d.ts +0 -4
  179. package/types/render/svg/utils/scrape-motion-values.d.ts +0 -2
  180. package/types/render/svg/utils/transform-origin.d.ts +0 -6
  181. package/types/render/svg/visual-element.d.ts +0 -2
  182. package/types/render/types.d.ts +0 -113
  183. package/types/render/utils/animation-state.d.ts +0 -31
  184. package/types/render/utils/animation.d.ts +0 -21
  185. package/types/render/utils/compare-by-depth.d.ts +0 -5
  186. package/types/render/utils/flat-tree.d.ts +0 -8
  187. package/types/render/utils/is-draggable.d.ts +0 -2
  188. package/types/render/utils/lifecycles.d.ts +0 -114
  189. package/types/render/utils/motion-values.d.ts +0 -3
  190. package/types/render/utils/setters.d.ts +0 -792
  191. package/types/render/utils/types.d.ts +0 -9
  192. package/types/render/utils/variants.d.ts +0 -20
  193. package/types/three-entry.d.ts +0 -19
  194. package/types/types.d.ts +0 -981
  195. package/types/utils/array.d.ts +0 -3
  196. package/types/utils/each-axis.d.ts +0 -1
  197. package/types/utils/is-browser.d.ts +0 -1
  198. package/types/utils/is-numerical-string.d.ts +0 -4
  199. package/types/utils/is-ref-object.d.ts +0 -2
  200. package/types/utils/is-zero-value-string.d.ts +0 -4
  201. package/types/utils/noop.d.ts +0 -1
  202. package/types/utils/process.d.ts +0 -1
  203. package/types/utils/resolve-value.d.ts +0 -3
  204. package/types/utils/shallow-compare.d.ts +0 -1
  205. package/types/utils/subscription-manager.d.ts +0 -9
  206. package/types/utils/time-conversion.d.ts +0 -7
  207. package/types/utils/transform.d.ts +0 -91
  208. package/types/utils/use-animation-frame.d.ts +0 -2
  209. package/types/utils/use-constant.d.ts +0 -10
  210. package/types/utils/use-cycle.d.ts +0 -30
  211. package/types/utils/use-force-update.d.ts +0 -1
  212. package/types/utils/use-id.d.ts +0 -6
  213. package/types/utils/use-instant-transition-state.d.ts +0 -3
  214. package/types/utils/use-instant-transition.d.ts +0 -1
  215. package/types/utils/use-is-mounted.d.ts +0 -2
  216. package/types/utils/use-isomorphic-effect.d.ts +0 -2
  217. package/types/utils/use-reduced-motion.d.ts +0 -28
  218. package/types/utils/use-unmount-effect.d.ts +0 -1
  219. package/types/utils/warn-once.d.ts +0 -2
  220. package/types/value/index.d.ts +0 -260
  221. package/types/value/scroll/use-element-scroll.d.ts +0 -28
  222. package/types/value/scroll/use-viewport-scroll.d.ts +0 -22
  223. package/types/value/scroll/utils.d.ts +0 -19
  224. package/types/value/use-combine-values.d.ts +0 -2
  225. package/types/value/use-inverted-scale.d.ts +0 -28
  226. package/types/value/use-motion-template.d.ts +0 -24
  227. package/types/value/use-motion-value.d.ts +0 -19
  228. package/types/value/use-on-change.d.ts +0 -3
  229. package/types/value/use-spring.d.ts +0 -22
  230. package/types/value/use-time.d.ts +0 -1
  231. package/types/value/use-transform.d.ts +0 -93
  232. package/types/value/use-velocity.d.ts +0 -13
  233. package/types/value/utils/is-motion-value.d.ts +0 -2
  234. package/types/value/utils/resolve-motion-value.d.ts +0 -10
@@ -1,25 +0,0 @@
1
- import * as React from "react";
2
- import { MotionProps } from "./types";
3
- import { RenderComponent, FeatureBundle } from "./features/types";
4
- import { CreateVisualElement } from "../render/types";
5
- import { UseVisualState } from "./utils/use-visual-state";
6
- export interface MotionComponentConfig<Instance, RenderState> {
7
- preloadedFeatures?: FeatureBundle;
8
- createVisualElement?: CreateVisualElement<Instance>;
9
- projectionNodeConstructor?: any;
10
- useRender: RenderComponent<Instance, RenderState>;
11
- useVisualState: UseVisualState<Instance, RenderState>;
12
- Component: string | React.ComponentType;
13
- }
14
- /**
15
- * Create a `motion` component.
16
- *
17
- * This function accepts a Component argument, which can be either a string (ie "div"
18
- * for `motion.div`), or an actual React component.
19
- *
20
- * Alongside this is a config option which provides a way of rendering the provided
21
- * component "offline", or outside the React render cycle.
22
- *
23
- * @internal
24
- */
25
- export declare function createMotionComponent<Props extends {}, Instance, RenderState>({ preloadedFeatures, createVisualElement, projectionNodeConstructor, useRender, useVisualState, Component, }: MotionComponentConfig<Instance, RenderState>): React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & MotionProps> & React.RefAttributes<Instance>>;
@@ -1,279 +0,0 @@
1
- import { CSSProperties } from "react";
2
- import { MotionValue } from "../value";
3
- import { AnimationControls } from "../animation/types";
4
- import { Variants, Target, Transition, TargetAndTransition, Omit, MakeCustomValueType } from "../types";
5
- import { DraggableProps } from "../gestures/drag/types";
6
- import { LayoutProps } from "./features/layout/types";
7
- import { ResolvedValues } from "../render/types";
8
- import { VisualElementLifecycles } from "../render/utils/lifecycles";
9
- import { PanHandlers, TapHandlers, HoverHandlers, FocusHandlers } from "../gestures/types";
10
- import { ViewportProps } from "./features/viewport/types";
11
- export declare type MotionStyleProp = string | number | MotionValue;
12
- /**
13
- * Either a string, or array of strings, that reference variants defined via the `variants` prop.
14
- * @public
15
- */
16
- export declare type VariantLabels = string | string[];
17
- export interface TransformProperties {
18
- x?: string | number;
19
- y?: string | number;
20
- z?: string | number;
21
- translateX?: string | number;
22
- translateY?: string | number;
23
- translateZ?: string | number;
24
- rotate?: string | number;
25
- rotateX?: string | number;
26
- rotateY?: string | number;
27
- rotateZ?: string | number;
28
- scale?: string | number;
29
- scaleX?: string | number;
30
- scaleY?: string | number;
31
- scaleZ?: string | number;
32
- skew?: string | number;
33
- skewX?: string | number;
34
- skewY?: string | number;
35
- originX?: string | number;
36
- originY?: string | number;
37
- originZ?: string | number;
38
- perspective?: string | number;
39
- transformPerspective?: string | number;
40
- }
41
- /**
42
- * @public
43
- */
44
- export interface SVGPathProperties {
45
- pathLength?: number;
46
- pathOffset?: number;
47
- pathSpacing?: number;
48
- }
49
- export interface CustomStyles {
50
- /**
51
- * Framer Library custom prop types. These are not actually supported in Motion - preferably
52
- * we'd have a way of external consumers injecting supported styles into this library.
53
- */
54
- size?: string | number;
55
- radius?: string | number;
56
- shadow?: string;
57
- image?: string;
58
- }
59
- export declare type MakeMotion<T> = MakeCustomValueType<{
60
- [K in keyof T]: T[K] | MotionValue<number> | MotionValue<string> | MotionValue<any>;
61
- }>;
62
- export declare type MotionCSS = MakeMotion<Omit<CSSProperties, "rotate" | "scale" | "perspective">>;
63
- /**
64
- * @public
65
- */
66
- export declare type MotionTransform = MakeMotion<TransformProperties>;
67
- /**
68
- * @public
69
- */
70
- export declare type MotionStyle = MotionCSS & MotionTransform & MakeMotion<SVGPathProperties> & MakeCustomValueType<CustomStyles>;
71
- export declare type OnUpdate = (v: Target) => void;
72
- /**
73
- * @public
74
- */
75
- export interface RelayoutInfo {
76
- delta: {
77
- x: number;
78
- y: number;
79
- width: number;
80
- height: number;
81
- };
82
- }
83
- /**
84
- * @public
85
- */
86
- export declare type ResolveLayoutTransition = (info: RelayoutInfo) => Transition | boolean;
87
- /**
88
- * @public
89
- */
90
- export interface AnimationProps {
91
- /**
92
- * Properties, variant label or array of variant labels to start in.
93
- *
94
- * Set to `false` to initialise with the values in `animate` (disabling the mount animation)
95
- *
96
- * ```jsx
97
- * // As values
98
- * <motion.div initial={{ opacity: 1 }} />
99
- *
100
- * // As variant
101
- * <motion.div initial="visible" variants={variants} />
102
- *
103
- * // Multiple variants
104
- * <motion.div initial={["visible", "active"]} variants={variants} />
105
- *
106
- * // As false (disable mount animation)
107
- * <motion.div initial={false} animate={{ opacity: 0 }} />
108
- * ```
109
- */
110
- initial?: boolean | Target | VariantLabels;
111
- /**
112
- * Values to animate to, variant label(s), or `AnimationControls`.
113
- *
114
- * ```jsx
115
- * // As values
116
- * <motion.div animate={{ opacity: 1 }} />
117
- *
118
- * // As variant
119
- * <motion.div animate="visible" variants={variants} />
120
- *
121
- * // Multiple variants
122
- * <motion.div animate={["visible", "active"]} variants={variants} />
123
- *
124
- * // AnimationControls
125
- * <motion.div animate={animation} />
126
- * ```
127
- */
128
- animate?: AnimationControls | TargetAndTransition | VariantLabels | boolean;
129
- /**
130
- * A target to animate to when this component is removed from the tree.
131
- *
132
- * This component **must** be the first animatable child of an `AnimatePresence` to enable this exit animation.
133
- *
134
- * This limitation exists because React doesn't allow components to defer unmounting until after
135
- * an animation is complete. Once this limitation is fixed, the `AnimatePresence` component will be unnecessary.
136
- *
137
- * ```jsx
138
- * import { AnimatePresence, motion } from 'framer-motion'
139
- *
140
- * export const MyComponent = ({ isVisible }) => {
141
- * return (
142
- * <AnimatePresence>
143
- * {isVisible && (
144
- * <motion.div
145
- * initial={{ opacity: 0 }}
146
- * animate={{ opacity: 1 }}
147
- * exit={{ opacity: 0 }}
148
- * />
149
- * )}
150
- * </AnimatePresence>
151
- * )
152
- * }
153
- * ```
154
- */
155
- exit?: TargetAndTransition | VariantLabels;
156
- /**
157
- * Variants allow you to define animation states and organise them by name. They allow
158
- * you to control animations throughout a component tree by switching a single `animate` prop.
159
- *
160
- * Using `transition` options like `delayChildren` and `staggerChildren`, you can orchestrate
161
- * when children animations play relative to their parent.
162
-
163
- *
164
- * After passing variants to one or more `motion` component's `variants` prop, these variants
165
- * can be used in place of values on the `animate`, `initial`, `whileFocus`, `whileTap` and `whileHover` props.
166
- *
167
- * ```jsx
168
- * const variants = {
169
- * active: {
170
- * backgroundColor: "#f00"
171
- * },
172
- * inactive: {
173
- * backgroundColor: "#fff",
174
- * transition: { duration: 2 }
175
- * }
176
- * }
177
- *
178
- * <motion.div variants={variants} animate="active" />
179
- * ```
180
- */
181
- variants?: Variants;
182
- /**
183
- * Default transition. If no `transition` is defined in `animate`, it will use the transition defined here.
184
- * ```jsx
185
- * const spring = {
186
- * type: "spring",
187
- * damping: 10,
188
- * stiffness: 100
189
- * }
190
- *
191
- * <motion.div transition={spring} animate={{ scale: 1.2 }} />
192
- * ```
193
- */
194
- transition?: Transition;
195
- }
196
- /**
197
- * @public
198
- */
199
- export interface MotionAdvancedProps {
200
- /**
201
- * Custom data to use to resolve dynamic variants differently for each animating component.
202
- *
203
- * ```jsx
204
- * const variants = {
205
- * visible: (custom) => ({
206
- * opacity: 1,
207
- * transition: { delay: custom * 0.2 }
208
- * })
209
- * }
210
- *
211
- * <motion.div custom={0} animate="visible" variants={variants} />
212
- * <motion.div custom={1} animate="visible" variants={variants} />
213
- * <motion.div custom={2} animate="visible" variants={variants} />
214
- * ```
215
- *
216
- * @public
217
- */
218
- custom?: any;
219
- /**
220
- * @public
221
- * Set to `false` to prevent inheriting variant changes from its parent.
222
- */
223
- inherit?: boolean;
224
- }
225
- /**
226
- * Props for `motion` components.
227
- *
228
- * @public
229
- */
230
- export interface MotionProps extends AnimationProps, VisualElementLifecycles, PanHandlers, TapHandlers, HoverHandlers, FocusHandlers, ViewportProps, DraggableProps, LayoutProps, MotionAdvancedProps {
231
- /**
232
- *
233
- * The React DOM `style` prop, enhanced with support for `MotionValue`s and separate `transform` values.
234
- *
235
- * ```jsx
236
- * export const MyComponent = () => {
237
- * const x = useMotionValue(0)
238
- *
239
- * return <motion.div style={{ x, opacity: 1, scale: 0.5 }} />
240
- * }
241
- * ```
242
- */
243
- style?: MotionStyle;
244
- /**
245
- * By default, Framer Motion generates a `transform` property with a sensible transform order. `transformTemplate`
246
- * can be used to create a different order, or to append/preprend the automatically generated `transform` property.
247
- *
248
- * ```jsx
249
- * <motion.div
250
- * style={{ x: 0, rotate: 180 }}
251
- * transformTemplate={
252
- * ({ x, rotate }) => `rotate(${rotate}deg) translateX(${x}px)`
253
- * }
254
- * />
255
- * ```
256
- *
257
- * @param transform - The latest animated transform props.
258
- * @param generatedTransform - The transform string as automatically generated by Framer Motion
259
- *
260
- * @public
261
- */
262
- transformTemplate?(transform: TransformProperties, generatedTransform: string): string;
263
- /**
264
- * This allows values to be transformed before being animated or set as styles.
265
- *
266
- * For instance, this allows custom values in Framer Library like `size` to be converted into `width` and `height`.
267
- * It also allows us a chance to take a value like `Color` and convert it to an animatable color string.
268
- *
269
- * A few structural typing changes need making before this can be a public property:
270
- * - Allow `Target` values to be appended by user-defined types (delete `CustomStyles` - does `size` throw a type error?)
271
- * - Extract `CustomValueType` as a separate user-defined type (delete `CustomValueType` and animate a `Color` - does this throw a type error?).
272
- *
273
- * @param values -
274
- *
275
- * @internal
276
- */
277
- transformValues?<V extends ResolvedValues>(values: V): V;
278
- }
279
- export declare type TransformTemplate = (transform: TransformProperties, generatedTransform: string) => string;
@@ -1,18 +0,0 @@
1
- import React from "react";
2
- import { MotionConfigProps } from "../..";
3
- import { VisualElement } from "../../render/types";
4
- import { MotionProps } from "../types";
5
- interface Props {
6
- visualElement?: VisualElement;
7
- props: MotionProps & MotionConfigProps;
8
- }
9
- export declare class VisualElementHandler extends React.Component<React.PropsWithChildren<Props>> {
10
- /**
11
- * Update visual element props as soon as we know this update is going to be commited.
12
- */
13
- getSnapshotBeforeUpdate(): null;
14
- componentDidUpdate(): void;
15
- updateProps(): void;
16
- render(): React.ReactNode;
17
- }
18
- export {};
@@ -1,2 +0,0 @@
1
- import { MotionProps } from "../..";
2
- export declare function isForcedMotionValue(key: string, { layout, layoutId }: MotionProps): boolean;
@@ -1,2 +0,0 @@
1
- import { FeatureProps } from "../features/types";
2
- export declare const makeRenderlessComponent: <P = FeatureProps>(hook: Function) => (props: P) => null;
@@ -1,2 +0,0 @@
1
- import { MotionProps } from "../types";
2
- export declare function checkShouldInheritVariant({ animate, variants, inherit, }: MotionProps): boolean;
@@ -1,8 +0,0 @@
1
- import * as React from "react";
2
- import { VisualElement } from "../../render/types";
3
- import { VisualState } from "./use-visual-state";
4
- /**
5
- * Creates a ref function that, when called, hydrates the provided
6
- * external ref and VisualElement.
7
- */
8
- export declare function useMotionRef<Instance, RenderState>(visualState: VisualState<Instance, RenderState>, visualElement?: VisualElement<Instance> | null, externalRef?: React.Ref<Instance>): React.Ref<Instance>;
@@ -1,6 +0,0 @@
1
- import * as React from "react";
2
- import { MotionProps } from "../../motion/types";
3
- import { CreateVisualElement, VisualElement } from "../../render/types";
4
- import { VisualState } from "./use-visual-state";
5
- import { MotionConfigProps } from "../../components/MotionConfig";
6
- export declare function useVisualElement<Instance, RenderState>(Component: string | React.ComponentType, visualState: VisualState<Instance, RenderState>, props: MotionProps & MotionConfigProps, createVisualElement?: CreateVisualElement<Instance>): VisualElement<Instance> | undefined;
@@ -1,14 +0,0 @@
1
- import { ResolvedValues, ScrapeMotionValuesFromProps } from "../../render/types";
2
- import { MotionProps } from "../types";
3
- export interface VisualState<Instance, RenderState> {
4
- renderState: RenderState;
5
- latestValues: ResolvedValues;
6
- mount?: (instance: Instance) => void;
7
- }
8
- export declare type UseVisualState<Instance, RenderState> = (props: MotionProps, isStatic: boolean) => VisualState<Instance, RenderState>;
9
- export interface UseVisualStateConfig<Instance, RenderState> {
10
- scrapeMotionValuesFromProps: ScrapeMotionValuesFromProps;
11
- createRenderState: () => RenderState;
12
- onMount?: (props: MotionProps, instance: Instance, visualState: VisualState<Instance, RenderState>) => void;
13
- }
14
- export declare const makeUseVisualState: <I, RS>(config: UseVisualStateConfig<I, RS>) => UseVisualState<I, RS>;
@@ -1,9 +0,0 @@
1
- /**
2
- * Check whether a prop name is a valid `MotionProp` key.
3
- *
4
- * @param key - Name of the property to check
5
- * @returns `true` is key is a valid `MotionProp`.
6
- *
7
- * @public
8
- */
9
- export declare function isValidMotionProp(key: string): boolean;
@@ -1,2 +0,0 @@
1
- import { ResolvedValues } from "../../render/types";
2
- export declare function mixValues(target: ResolvedValues, follow: ResolvedValues, lead: ResolvedValues, progress: number, shouldCrossfadeOpacity: boolean, isOnlyMember: boolean): void;
@@ -1,14 +0,0 @@
1
- import { BoundingBox, Box, TransformPoint } from "./types";
2
- /**
3
- * Bounding boxes tend to be defined as top, left, right, bottom. For various operations
4
- * it's easier to consider each axis individually. This function returns a bounding box
5
- * as a map of single-axis min/max values.
6
- */
7
- export declare function convertBoundingBoxToBox({ top, left, right, bottom, }: BoundingBox): Box;
8
- export declare function convertBoxToBoundingBox({ x, y }: Box): BoundingBox;
9
- /**
10
- * Applies a TransformPoint function to a bounding box. TransformPoint is usually a function
11
- * provided by Framer to allow measured points to be corrected for device scaling. This is used
12
- * when measuring DOM elements and DOM event points.
13
- */
14
- export declare function transformBoxPoints(point: BoundingBox, transformPoint?: TransformPoint): BoundingBox;
@@ -1,13 +0,0 @@
1
- import { Axis, Box } from "./types";
2
- /**
3
- * Reset an axis to the provided origin box.
4
- *
5
- * This is a mutative operation.
6
- */
7
- export declare function copyAxisInto(axis: Axis, originAxis: Axis): void;
8
- /**
9
- * Reset a box to the provided origin box.
10
- *
11
- * This is a mutative operation.
12
- */
13
- export declare function copyBoxInto(box: Box, originBox: Box): void;
@@ -1,37 +0,0 @@
1
- import { ResolvedValues } from "../../render/types";
2
- import { IProjectionNode } from "../node/types";
3
- import { Axis, Box, Delta, Point } from "./types";
4
- /**
5
- * Scales a point based on a factor and an originPoint
6
- */
7
- export declare function scalePoint(point: number, scale: number, originPoint: number): number;
8
- /**
9
- * Applies a translate/scale delta to a point
10
- */
11
- export declare function applyPointDelta(point: number, translate: number, scale: number, originPoint: number, boxScale?: number): number;
12
- /**
13
- * Applies a translate/scale delta to an axis
14
- */
15
- export declare function applyAxisDelta(axis: Axis, translate: number | undefined, scale: number | undefined, originPoint: number, boxScale?: number): void;
16
- /**
17
- * Applies a translate/scale delta to a box
18
- */
19
- export declare function applyBoxDelta(box: Box, { x, y }: Delta): void;
20
- /**
21
- * Apply a tree of deltas to a box. We do this to calculate the effect of all the transforms
22
- * in a tree upon our box before then calculating how to project it into our desired viewport-relative box
23
- *
24
- * This is the final nested loop within updateLayoutDelta for future refactoring
25
- */
26
- export declare function applyTreeDeltas(box: Box, treeScale: Point, treePath: IProjectionNode[], isSharedTransition?: boolean): void;
27
- export declare function translateAxis(axis: Axis, distance: number): void;
28
- /**
29
- * Apply a transform to an axis from the latest resolved motion values.
30
- * This function basically acts as a bridge between a flat motion value map
31
- * and applyAxisDelta
32
- */
33
- export declare function transformAxis(axis: Axis, transforms: ResolvedValues, [key, scaleKey, originKey]: string[]): void;
34
- /**
35
- * Apply a transform to a box from the latest resolved motion values.
36
- */
37
- export declare function transformBox(box: Box, transform: ResolvedValues): void;
@@ -1,10 +0,0 @@
1
- import { ResolvedValues } from "../../render/types";
2
- import { Axis, AxisDelta, Box, Delta } from "./types";
3
- export declare function calcLength(axis: Axis): number;
4
- export declare function isNear(value: number, target?: number, maxDistance?: number): boolean;
5
- export declare function calcAxisDelta(delta: AxisDelta, source: Axis, target: Axis, origin?: number): void;
6
- export declare function calcBoxDelta(delta: Delta, source: Box, target: Box, origin?: ResolvedValues): void;
7
- export declare function calcRelativeAxis(target: Axis, relative: Axis, parent: Axis): void;
8
- export declare function calcRelativeBox(target: Box, relative: Box, parent: Box): void;
9
- export declare function calcRelativeAxisPosition(target: Axis, layout: Axis, parent: Axis): void;
10
- export declare function calcRelativePosition(target: Box, layout: Box, parent: Box): void;
@@ -1,20 +0,0 @@
1
- import { ResolvedValues } from "../../render/types";
2
- import { Axis, Box } from "./types";
3
- /**
4
- * Remove a delta from a point. This is essentially the steps of applyPointDelta in reverse
5
- */
6
- export declare function removePointDelta(point: number, translate: number, scale: number, originPoint: number, boxScale?: number): number;
7
- /**
8
- * Remove a delta from an axis. This is essentially the steps of applyAxisDelta in reverse
9
- */
10
- export declare function removeAxisDelta(axis: Axis, translate?: number | string, scale?: number, origin?: number, boxScale?: number, originAxis?: Axis, sourceAxis?: Axis): void;
11
- /**
12
- * Remove a transforms from an axis. This is essentially the steps of applyAxisTransforms in reverse
13
- * and acts as a bridge between motion values and removeAxisDelta
14
- */
15
- export declare function removeAxisTransforms(axis: Axis, transforms: ResolvedValues, [key, scaleKey, originKey]: string[], origin?: Axis, sourceAxis?: Axis): void;
16
- /**
17
- * Remove a transforms from an box. This is essentially the steps of applyAxisBox in reverse
18
- * and acts as a bridge between motion values and removeAxisDelta
19
- */
20
- export declare function removeBoxTransforms(box: Box, transforms: ResolvedValues, originBox?: Box, sourceBox?: Box): void;
@@ -1,5 +0,0 @@
1
- import { Axis, AxisDelta, Box, Delta } from "./types";
2
- export declare const createAxisDelta: () => AxisDelta;
3
- export declare const createDelta: () => Delta;
4
- export declare const createAxis: () => Axis;
5
- export declare const createBox: () => Box;
@@ -1,29 +0,0 @@
1
- export interface Point {
2
- x: number;
3
- y: number;
4
- }
5
- export interface Axis {
6
- min: number;
7
- max: number;
8
- }
9
- export interface Box {
10
- x: Axis;
11
- y: Axis;
12
- }
13
- export interface BoundingBox {
14
- top: number;
15
- right: number;
16
- bottom: number;
17
- left: number;
18
- }
19
- export interface AxisDelta {
20
- translate: number;
21
- scale: number;
22
- origin: number;
23
- originPoint: number;
24
- }
25
- export interface Delta {
26
- x: AxisDelta;
27
- y: AxisDelta;
28
- }
29
- export declare type TransformPoint = (point: Point) => Point;
@@ -1,3 +0,0 @@
1
- import { Box, Delta } from "./types";
2
- export declare function isDeltaZero(delta: Delta): boolean;
3
- export declare function boxEquals(a: Box, b: Box): boolean;
@@ -1,14 +0,0 @@
1
- export { HTMLProjectionNode } from "./node/HTMLProjectionNode";
2
- export { nodeGroup } from "./node/group";
3
- export { calcBoxDelta } from "./geometry/delta-calc";
4
- /**
5
- * For debugging purposes
6
- */
7
- import sync from "framesync";
8
- import { animate, mix } from "popmotion";
9
- export { sync, animate, mix };
10
- export { buildTransform } from "../render/html/utils/build-transform";
11
- export { addScaleCorrector } from "./styles/scale-correction";
12
- export { correctBorderRadius } from "./styles/scale-border-radius";
13
- export { correctBoxShadow } from "./styles/scale-box-shadow";
14
- export { htmlVisualElement } from "../render/html/visual-element";
@@ -1,108 +0,0 @@
1
- export declare const DocumentProjectionNode: {
2
- new (id: number | undefined, latestValues?: import("../..").ResolvedValues, parent?: import("./types").IProjectionNode<unknown> | undefined): {
3
- id: number | undefined;
4
- instance: Window;
5
- root: import("./types").IProjectionNode<unknown>;
6
- parent?: import("./types").IProjectionNode<unknown> | undefined;
7
- path: import("./types").IProjectionNode<unknown>[];
8
- children: Set<import("./types").IProjectionNode<unknown>>;
9
- options: import("./types").ProjectionNodeOptions;
10
- snapshot: import("./types").Snapshot | undefined;
11
- layout: import("./types").Layout | undefined;
12
- targetLayout?: import("../..").Box | undefined;
13
- layoutCorrected: import("../..").Box;
14
- targetDelta?: import("../..").Delta | undefined;
15
- target?: import("../..").Box | undefined;
16
- relativeTarget?: import("../..").Box | undefined;
17
- relativeTargetOrigin?: import("../..").Box | undefined;
18
- relativeParent?: import("./types").IProjectionNode<unknown> | undefined;
19
- isTreeAnimating: boolean;
20
- isAnimationBlocked: boolean;
21
- attemptToResolveRelativeTarget?: boolean | undefined;
22
- targetWithTransforms?: import("../..").Box | undefined;
23
- projectionDelta?: import("../..").Delta | undefined;
24
- projectionDeltaWithTransform?: import("../..").Delta | undefined;
25
- scroll?: import("../..").Point | undefined;
26
- isLayoutDirty: boolean;
27
- updateManuallyBlocked: boolean;
28
- updateBlockedByResize: boolean;
29
- isUpdating: boolean;
30
- isSVG: boolean;
31
- needsReset: boolean;
32
- shouldResetTransform: boolean;
33
- treeScale: import("../..").Point;
34
- resumeFrom?: import("./types").IProjectionNode<unknown> | undefined;
35
- resumingFrom?: import("./types").IProjectionNode<unknown> | undefined;
36
- latestValues: import("../..").ResolvedValues;
37
- eventHandlers: Map<import("./types").LayoutEvents, import("../../utils/subscription-manager").SubscriptionManager<any>>;
38
- nodes?: import("../..").FlatTree | undefined;
39
- depth: number;
40
- projectionTransform: string;
41
- prevTransformTemplateValue: string | undefined;
42
- preserveOpacity?: boolean | undefined;
43
- addEventListener(name: import("./types").LayoutEvents, handler: any): () => void;
44
- notifyListeners(name: import("./types").LayoutEvents, ...args: any): void;
45
- hasListeners(name: import("./types").LayoutEvents): boolean;
46
- potentialNodes: Map<number, import("./types").IProjectionNode<unknown>>;
47
- registerPotentialNode(id: number, node: import("./types").IProjectionNode<unknown>): void;
48
- mount(instance: Window, isLayoutDirty?: boolean): void;
49
- unmount(): void;
50
- blockUpdate(): void;
51
- unblockUpdate(): void;
52
- isUpdateBlocked(): boolean;
53
- isTreeAnimationBlocked(): boolean;
54
- startUpdate(): void;
55
- willUpdate(shouldNotifyListeners?: boolean): void;
56
- didUpdate(): void;
57
- clearAllSnapshots(): void;
58
- scheduleUpdateProjection(): void;
59
- scheduleCheckAfterUnmount(): void;
60
- checkUpdateFailed: () => void;
61
- updateProjection: () => void;
62
- updateSnapshot(): void;
63
- updateLayout(): void;
64
- updateScroll(): void;
65
- resetTransform(): void;
66
- measure(): import("../..").Box;
67
- removeElementScroll(box: import("../..").Box): import("../..").Box;
68
- applyTransform(box: import("../..").Box, transformOnly?: boolean): import("../..").Box;
69
- removeTransform(box: import("../..").Box): import("../..").Box;
70
- setTargetDelta(delta: import("../..").Delta): void;
71
- setOptions(options: import("./types").ProjectionNodeOptions): void;
72
- clearMeasurements(): void;
73
- resolveTargetDelta(): void;
74
- getClosestProjectingParent(): import("./types").IProjectionNode<unknown> | undefined;
75
- hasProjected: boolean;
76
- calcProjection(): void;
77
- isVisible: boolean;
78
- hide(): void;
79
- show(): void;
80
- scheduleRender(notifyAll?: boolean): void;
81
- animationValues?: import("../..").ResolvedValues | undefined;
82
- pendingAnimation?: import("framesync").Process | undefined;
83
- currentAnimation?: import("../..").AnimationPlaybackControls | undefined;
84
- mixTargetDelta: (progress: number) => void;
85
- animationProgress: number;
86
- setAnimationOrigin(delta: import("../..").Delta, hasOnlyRelativeTargetChanged?: boolean): void;
87
- startAnimation(options: import("../..").AnimationOptions<number>): void;
88
- completeAnimation(): void;
89
- finishAnimation(): void;
90
- applyTransformsToTarget(): void;
91
- sharedNodes: Map<string, import("../shared/stack").NodeStack>;
92
- registerSharedNode(layoutId: string, node: import("./types").IProjectionNode<unknown>): void;
93
- isLead(): boolean;
94
- getLead(): import("./types").IProjectionNode<unknown> | any;
95
- getPrevLead(): import("./types").IProjectionNode<unknown> | undefined;
96
- getStack(): import("../shared/stack").NodeStack | undefined;
97
- promote({ needsReset, transition, preserveFollowOpacity, }?: {
98
- needsReset?: boolean | undefined;
99
- transition?: import("../..").Transition | undefined;
100
- preserveFollowOpacity?: boolean | undefined;
101
- }): void;
102
- relegate(): boolean;
103
- resetRotation(): void;
104
- getProjectionStyles(styleProp?: import("../..").MotionStyle): import("../..").ResolvedValues;
105
- clearSnapshot(): void;
106
- resetTree(): void;
107
- };
108
- };