@kitlangton/solid-motion 0.2.0 → 0.2.1

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.
@@ -1,6 +1,6 @@
1
1
  import { createEffect, createMemo, onCleanup, onMount, splitProps, useContext } from "solid-js";
2
2
  import { Dynamic } from "solid-js/web";
3
- import { scrapeHTMLMotionValuesFromProps, scrapeSVGMotionValuesFromProps } from "motion-dom";
3
+ import { isAnimationControls, scrapeHTMLMotionValuesFromProps, scrapeSVGMotionValuesFromProps, setTarget } from "motion-dom";
4
4
  import { MotionConfigContext } from "../components/MotionConfig";
5
5
  import { MotionContext } from "../context/MotionContext";
6
6
  import { PresenceContext } from "../context/PresenceContext";
@@ -102,6 +102,7 @@ export function createMotionComponent(Component, { forwardMotionProps = false, t
102
102
  return;
103
103
  visualElement.scheduleRenderMicrotask();
104
104
  });
105
+ let mounted = false;
105
106
  createEffect(() => {
106
107
  if (!visualElement)
107
108
  return;
@@ -110,9 +111,20 @@ export function createMotionComponent(Component, { forwardMotionProps = false, t
110
111
  visualElement.update(nextProps, nextPresenceContext);
111
112
  prepareDragProjection(visualElement, nextProps);
112
113
  visualElement.updateFeatures();
113
- if (visualElement.current && visualElement.animationState) {
114
- visualElement.animationState.animateChanges();
114
+ if (!visualElement.current || !visualElement.animationState)
115
+ return;
116
+ if (!mounted) {
117
+ mounted = true;
118
+ // The visual state was built when the element was created, but in Solid an earlier
119
+ // effect in the same flush can change `animate` before it mounts. React can't render a
120
+ // stale target, so a blocked initial animation would otherwise skip the newer one.
121
+ const { animate } = nextProps;
122
+ const blocked = nextProps.initial === false || nextPresenceContext?.initial === false;
123
+ if (blocked && animate && typeof animate !== "boolean" && !isAnimationControls(animate)) {
124
+ setTarget(visualElement, animate);
125
+ }
115
126
  }
127
+ visualElement.animationState.animateChanges();
116
128
  });
117
129
  onCleanup(() => {
118
130
  visualElement?.unmount();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kitlangton/solid-motion",
3
- "version": "0.2.0",
3
+ "version": "0.2.1",
4
4
  "description": "Motion for SolidJS: springs, presence, drag and gestures on Motion's engine.",
5
5
  "license": "MIT",
6
6
  "author": "Kit Langton",