@kitlangton/solid-motion 0.2.0 → 0.2.1

package/dist/index.js

@@ -1,6 +1,6 @@
 import { createComponent, Dynamic, mergeProps, getNextElement, use, insert, effect, style, template } from "solid-js/web";
 import { createContext, useContext, splitProps, createSignal, createEffect, createMemo, onMount, onCleanup, mergeProps as mergeProps$1, on, untrack, For, batch, Index, children } from "solid-js";
-import { isControllingVariants, isVariantLabel, SVGVisualElement, HTMLVisualElement, isMotionValue, isForcedMotionValue, buildHTMLStyles, buildSVGAttrs, isSVGTag, resolveMotionValue, isVariantNode, isAnimationControls, resolveVariantFromProps, getFeatureDefinitions, setFeatureDefinitions, Feature, createAnimationState, isPrimaryPointer, addDomEvent, time, frame, frameData, cancelFrame, mixNumber, calcLength, createBox, eachAxis, measurePageBox, convertBoxToBoundingBox, convertBoundingBoxToBox, addValueToWillChange, animateMotionValue, setDragLock, percent, resize, isElementTextInput, hover, press, HTMLProjectionNode, scrapeSVGMotionValuesFromProps, scrapeHTMLMotionValuesFromProps, motionValue, transformValue, transform, mapValue, JSAnimation, resolveElements, defaultOffset, isGenerator, createGeneratorEasing, fillOffset, isSVGElement, isSVGSVGElement, visualElementStore, ObjectVisualElement, animateSingleValue, animateTarget, spring, GroupAnimationWithThen } from "motion-dom";
+import { isControllingVariants, isVariantLabel, SVGVisualElement, HTMLVisualElement, isMotionValue, isForcedMotionValue, buildHTMLStyles, buildSVGAttrs, isSVGTag, resolveMotionValue, isVariantNode, isAnimationControls, resolveVariantFromProps, getFeatureDefinitions, setFeatureDefinitions, Feature, createAnimationState, isPrimaryPointer, addDomEvent, time, frame, frameData, cancelFrame, mixNumber, calcLength, createBox, eachAxis, measurePageBox, convertBoxToBoundingBox, convertBoundingBoxToBox, addValueToWillChange, animateMotionValue, setDragLock, percent, resize, isElementTextInput, hover, press, HTMLProjectionNode, setTarget, scrapeSVGMotionValuesFromProps, scrapeHTMLMotionValuesFromProps, motionValue, transformValue, transform, mapValue, JSAnimation, resolveElements, defaultOffset, isGenerator, createGeneratorEasing, fillOffset, isSVGElement, isSVGSVGElement, visualElementStore, ObjectVisualElement, animateSingleValue, animateTarget, spring, GroupAnimationWithThen } from "motion-dom";
 export * from "motion-dom";
 import { pipe, secondsToMilliseconds, millisecondsToSeconds, progress, clamp, invariant, noop, getEasingForSegment, removeItem } from "motion-utils";
 const defaultContext = {
@@ -1478,6 +1478,7 @@ function createMotionComponent(Component, {
       if (!visualElement) return;
       visualElement.scheduleRenderMicrotask();
     });
+    let mounted = false;
     createEffect(() => {
       if (!visualElement) return;
       const nextProps = getLatestProps();
@@ -1485,9 +1486,18 @@ function createMotionComponent(Component, {
       visualElement.update(nextProps, nextPresenceContext);
       prepareDragProjection(visualElement, nextProps);
       visualElement.updateFeatures();
-      if (visualElement.current && visualElement.animationState) {
-        visualElement.animationState.animateChanges();
+      if (!visualElement.current || !visualElement.animationState) return;
+      if (!mounted) {
+        mounted = true;
+        const {
+          animate: animate2
+        } = nextProps;
+        const blocked = nextProps.initial === false || nextPresenceContext?.initial === false;
+        if (blocked && animate2 && typeof animate2 !== "boolean" && !isAnimationControls(animate2)) {
+          setTarget(visualElement, animate2);
+        }
       }
+      visualElement.animationState.animateChanges();
     });
     onCleanup(() => {
       visualElement?.unmount();