motion-start 0.0.3 → 0.1.1

package/dist/animation/utils/transitions.js

@@ -1,10 +1,8 @@
-import { MotionValue } from "../../value";
 /**
 based on framer-motion@4.1.15,
 Copyright (c) 2018 Framer B.V.
 */
 import { animate, inertia } from 'popmotion';
-import { __assign, __read, __rest, __spreadArray } from 'tslib';
 import { getAnimatableNone } from '../../render/dom/value-types/animatable-none.js';
 import { warning } from '../../utils/errors.js';
 import { secondsToMilliseconds } from '../../utils/time-conversion.js';
@@ -17,16 +15,7 @@ import { isAnimatable } from './is-animatable.js';
  * if any options are left.
  */
 function isTransitionDefined(_a) {
-    _a.when;
-    _a.delay;
-    _a.delayChildren;
-    _a.staggerChildren;
-    _a.staggerDirection;
-    _a.repeat;
-    _a.repeatType;
-    _a.repeatDelay;
-    _a.from;
-    var transition = __rest(_a, ["when", "delay", "delayChildren", "staggerChildren", "staggerDirection", "repeat", "repeatType", "repeatDelay", "from"]);
+    var { delay, when, delayChildren, staggerChildren, staggerDirection, repeat, repeatType, repeatDelay, from, ...transition } = _a;
     return !!Object.keys(transition).length;
 }
 var legacyRepeatWarning = false;
@@ -34,44 +23,42 @@ var legacyRepeatWarning = false;
  * Convert Framer Motion's Transition type into Popmotion-compatible options.
  */
 function convertTransitionToAnimationOptions(_a) {
-    var ease = _a.ease, times = _a.times, yoyo = _a.yoyo, flip = _a.flip, loop = _a.loop, transition = __rest(_a, ["ease", "times", "yoyo", "flip", "loop"]);
-    var options = __assign({}, transition);
+    var { ease, times, yoyo, flip, loop, ...transition } = _a;
+    var options = Object.assign({}, transition);
     if (times)
-        options["offset"] = times;
+        options.offset = times;
     /**
      * Convert any existing durations from seconds to milliseconds
      */
     if (transition.duration)
-        options["duration"] = secondsToMilliseconds(transition.duration);
+        options.duration = secondsToMilliseconds(transition.duration);
     if (transition.repeatDelay)
         options.repeatDelay = secondsToMilliseconds(transition.repeatDelay);
     /**
      * Map easing names to Popmotion's easing functions
      */
     if (ease) {
-        options["ease"] = isEasingArray(ease)
-            ? ease.map(easingDefinitionToFunction)
-            : easingDefinitionToFunction(ease);
+        options.ease = isEasingArray(ease) ? ease.map(easingDefinitionToFunction) : easingDefinitionToFunction(ease);
     }
     /**
      * Support legacy transition API
      */
-    if (transition.type === "tween")
-        options.type = "keyframes";
+    if (transition.type === 'tween')
+        options.type = 'keyframes';
     /**
      * TODO: These options are officially removed from the API.
      */
     if (yoyo || loop || flip) {
-        warning(!legacyRepeatWarning, "yoyo, loop and flip have been removed from the API. Replace with repeat and repeatType options.");
+        warning(!legacyRepeatWarning, 'yoyo, loop and flip have been removed from the API. Replace with repeat and repeatType options.');
         legacyRepeatWarning = true;
         if (yoyo) {
-            options.repeatType = "reverse";
+            options.repeatType = 'reverse';
         }
         else if (loop) {
-            options.repeatType = "loop";
+            options.repeatType = 'loop';
         }
         else if (flip) {
-            options.repeatType = "mirror";
+            options.repeatType = 'mirror';
         }
         options.repeat = loop || yoyo || flip || transition.repeat;
     }
@@ -80,8 +67,8 @@ function convertTransitionToAnimationOptions(_a) {
      * a keyframes or spring animation, but does so by detecting velocity and other spring options.
      * It'd be good to introduce a similar thing here.
      */
-    if (transition.type !== "spring")
-        options.type = "keyframes";
+    if (transition.type !== 'spring')
+        options.type = 'keyframes';
     return options;
 }
 /**
@@ -94,7 +81,7 @@ function getDelayFromTransition(transition, key) {
 }
 function hydrateKeyframes(options) {
     if (Array.isArray(options.to) && options.to[0] === null) {
-        options.to = __spreadArray([], __read(options.to));
+        options.to = [...options.to];
         options.to[0] = options.from;
     }
     return options;
@@ -109,9 +96,9 @@ function getPopmotionAnimationOptions(transition, options, key) {
      * Get a default transition if none is determined to be defined.
      */
     if (!isTransitionDefined(transition)) {
-        transition = __assign(__assign({}, transition), getDefaultTransition(key, options.to));
+        transition = Object.assign(Object.assign({}, transition), getDefaultTransition(key, options.to));
     }
-    return __assign(__assign({}, options), convertTransitionToAnimationOptions(transition));
+    return Object.assign(Object.assign({}, options), convertTransitionToAnimationOptions(transition));
 }
 /**
  *
@@ -121,73 +108,77 @@ function getAnimation(key, value, target, transition, onComplete) {
     var valueTransition = getValueTransition(transition, key);
     var origin = (_a = valueTransition.from) !== null && _a !== void 0 ? _a : value.get();
     var isTargetAnimatable = isAnimatable(key, target);
-    if (origin === "none" && isTargetAnimatable && typeof target === "string") {
+    if (origin === 'none' && isTargetAnimatable && typeof target === 'string') {
         /**
          * If we're trying to animate from "none", try and get an animatable version
          * of the target. This could be improved to work both ways.
          */
         origin = getAnimatableNone(key, target);
     }
-    else if (isZero(origin) && typeof target === "string") {
+    else if (isZero(origin) && typeof target === 'string') {
         origin = getZeroUnit(target);
     }
-    else if (!Array.isArray(target) &&
-        isZero(target) &&
-        typeof origin === "string") {
+    else if (!Array.isArray(target) && isZero(target) && typeof origin === 'string') {
         target = getZeroUnit(origin);
     }
     var isOriginAnimatable = isAnimatable(key, origin);
-    warning(isOriginAnimatable === isTargetAnimatable, "You are trying to animate " + key + " from \"" + origin + "\" to \"" + target + "\". " + origin + " is not an animatable value - to enable this animation set " + origin + " to a value animatable to " + target + " via the `style` property.");
+    warning(isOriginAnimatable === isTargetAnimatable, 'You are trying to animate ' +
+        key +
+        ' from "' +
+        origin +
+        '" to "' +
+        target +
+        '". ' +
+        origin +
+        ' is not an animatable value - to enable this animation set ' +
+        origin +
+        ' to a value animatable to ' +
+        target +
+        ' via the `style` property.');
     function start() {
         var options = {
             from: origin,
             to: target,
             velocity: value.getVelocity(),
             onComplete: onComplete,
-            onUpdate: function (v) { return value.set(v); },
+            onUpdate: (v) => value.set(v),
         };
-        return valueTransition.type === "inertia" ||
-            valueTransition.type === "decay"
-            ? inertia(__assign(__assign({}, options), valueTransition))
-            : animate(__assign(__assign({}, getPopmotionAnimationOptions(valueTransition, options, key)), {
-                onUpdate: function (v) {
+        return valueTransition.type === 'inertia' || valueTransition.type === 'decay'
+            ? inertia(Object.assign(Object.assign({}, options), valueTransition))
+            : animate(Object.assign(Object.assign({}, getPopmotionAnimationOptions(valueTransition, options, key)), {
+                onUpdate: (v) => {
                     var _a;
                     options.onUpdate(v);
                     (_a = valueTransition.onUpdate) === null || _a === void 0 ? void 0 : _a.call(valueTransition, v);
-                }, onComplete: function () {
+                },
+                onComplete: () => {
                     var _a;
                     options.onComplete();
                     (_a = valueTransition.onComplete) === null || _a === void 0 ? void 0 : _a.call(valueTransition);
-                }
+                },
             }));
     }
     function set() {
         var _a;
         value.set(target);
         onComplete();
-        (_a = valueTransition === null || valueTransition === void 0 ? void 0 : valueTransition.onComplete) === null || _a === void 0 ? void 0 : _a.call(valueTransition);
-        return { stop: function () { } };
+        (_a = valueTransition === null || valueTransition === void 0 ? void 0 : valueTransition.onComplete) === null ||
+            _a === void 0
+            ? void 0
+            : _a.call(valueTransition);
+        return { stop: () => { } };
     }
-    return !isOriginAnimatable ||
-        !isTargetAnimatable ||
-        valueTransition.type === false
-        ? set
-        : start;
+    return !isOriginAnimatable || !isTargetAnimatable || valueTransition.type === false ? set : start;
 }
 function isZero(value) {
-    return (value === 0 ||
-        (typeof value === "string" &&
-            parseFloat(value) === 0 &&
-            value.indexOf(" ") === -1));
+    return value === 0 || (typeof value === 'string' && Number.parseFloat(value) === 0 && value.indexOf(' ') === -1);
 }
 function getZeroUnit(potentialUnitType) {
-    return typeof potentialUnitType === "number"
-        ? 0
-        : getAnimatableNone("", potentialUnitType);
+    return typeof potentialUnitType === 'number' ? 0 : getAnimatableNone('', potentialUnitType);
 }
 function getValueTransition(transition, key) {
-    let tran = transition;
-    return tran[key] || tran["default"] || tran;
+    const tran = transition;
+    return tran[key] || tran.default || tran;
 }
 /**
  * Start animation on a MotionValue. This function is an interface between
@@ -199,22 +190,22 @@ function startAnimation(key, value, target, transition) {
     if (transition === void 0) {
         transition = {};
     }
-    return value.start(function (onComplete) {
+    return value.start((onComplete) => {
         var delayTimer;
         var controls;
         var animation = getAnimation(key, value, target, transition, onComplete);
         var delay = getDelayFromTransition(transition, key);
-        var start = function () { return (controls = animation()); };
+        var start = () => (controls = animation());
         if (delay) {
             delayTimer = setTimeout(start, secondsToMilliseconds(delay));
         }
         else {
             start();
         }
-        return function () {
+        return () => {
             clearTimeout(delayTimer);
             controls === null || controls === void 0 ? void 0 : controls.stop();
         };
     });
 }
-export { convertTransitionToAnimationOptions, getDelayFromTransition, getPopmotionAnimationOptions, getValueTransition, getZeroUnit, hydrateKeyframes, isTransitionDefined, isZero, startAnimation };
+export { convertTransitionToAnimationOptions, getDelayFromTransition, getPopmotionAnimationOptions, getValueTransition, getZeroUnit, hydrateKeyframes, isTransitionDefined, isZero, startAnimation, };

package/dist/animation/utils/variant-resolvers.d.ts

@@ -2,7 +2,7 @@
 based on framer-motion@4.1.17,
 Copyright (c) 2018 Framer B.V.
 */
-import { MotionValue } from "../../value";
+import type { MotionValue } from '../../value';
 type VariantNameList = string[];
 type VariantName = string | VariantNameList;
 type UnresolvedVariant = VariantName | MotionValue;

package/dist/animation/utils/variant-resolvers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variant-resolvers.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/animation/utils/variant-resolvers.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,KAAK,eAAe,GAAG,MAAM,EAAE,CAAC;AAChC,KAAK,WAAW,GAAG,MAAM,GAAG,eAAe,CAAC;AAC5C,KAAK,iBAAiB,GAAG,WAAW,GAAG,WAAW,CAAC;AACnD,MAAM,MAAM,oBAAoB,GAAG,CAAC,OAAO,CAAC,EAAE,iBAAiB,GAAG,SAAS,KAAK,eAAe,CAAC;AAChG;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,eAAe,KAAK,MAAM,EAAE,CAAC"}
+{"version":3,"file":"variant-resolvers.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/animation/utils/variant-resolvers.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,KAAK,eAAe,GAAG,MAAM,EAAE,CAAC;AAChC,KAAK,WAAW,GAAG,MAAM,GAAG,eAAe,CAAC;AAC5C,KAAK,iBAAiB,GAAG,WAAW,GAAG,WAAW,CAAC;AACnD,MAAM,MAAM,oBAAoB,GAAG,CAAC,OAAO,CAAC,EAAE,iBAAiB,GAAG,SAAS,KAAK,eAAe,CAAC;AAChG;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,eAAe,KAAK,MAAM,EAAE,CAAC"}

package/dist/animation/utils/variant-resolvers.js

@@ -1,5 +1 @@
-/**
-based on framer-motion@4.1.17,
-Copyright (c) 2018 Framer B.V.
-*/
-import { MotionValue } from "../../value";
+export {};

package/dist/components/AnimatePresence/AnimatePresence.svelte

@@ -9,6 +9,11 @@ Copyright (c) 2018 Framer B.V. -->
         isSharedLayout,
     } from "../../context/SharedLayoutContext.js";
     import PresenceChild from "./PresenceChild/PresenceChild.svelte";
+    import type { Writable } from "svelte/store";
+    import {
+        type SharedLayoutSyncMethods,
+        type SyncLayoutBatcher,
+    } from "../AnimateSharedLayout/types.js";
 
     type $$Props = AnimatePresenceProps<ConditionalGeneric<T>>;
 
@@ -25,18 +30,18 @@ Copyright (c) 2018 Framer B.V. -->
     $: _list = list !== undefined ? list : show ? [{ key: 1 }] : [];
 
     const layoutContext =
-        getContext(SharedLayoutContext) || SharedLayoutContext(isCustom);
-
-    $: isl = isSharedLayout($layoutContext);
+        getContext<Writable<SyncLayoutBatcher | SharedLayoutSyncMethods>>(
+            SharedLayoutContext,
+        ) || SharedLayoutContext(isCustom);
 
     $: forceRender = () => {
-        if (isl) {
+        if (isSharedLayout($layoutContext)) {
             $layoutContext.forceUpdate();
         }
         _list = [..._list];
     };
 
-    function getChildKey(child) {
+    function getChildKey(child: { key: number }) {
         return child.key || "";
     }
 
@@ -45,9 +50,12 @@ Copyright (c) 2018 Framer B.V. -->
     $: filteredChildren = _list;
 
     let presentChildren = filteredChildren;
-    let allChildren = new Map();
-    let exiting = new Set();
-    const updateChildLookup = (children, allChild) => {
+    let allChildren = new Map<string | number, { key: number }>();
+    let exiting = new Set<"" | number>();
+    const updateChildLookup = (
+        children: { key: number }[],
+        allChild: Map<string | number, { key: number }>,
+    ) => {
         children.forEach((child) => {
             const key = getChildKey(child);
             allChild.set(key, child);

package/dist/components/AnimatePresence/AnimatePresence.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnimatePresence.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/components/AnimatePresence/AnimatePresence.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAoL3E,cAAM,iBAAiB,CAAC,CAAC,SAAS;IAAC,GAAG,EAAC,GAAG,CAAA;CAAC;IACvC,KAAK;IAGL,MAAM;;;IAGN,KAAK;;;;;IAGL,QAAQ;IACR,OAAO;CACV;AAED,UAAU,qBAAqB;IAC3B,KAAK,CAAC,SAAS;QAAC,GAAG,EAAC,GAAG,CAAA;KAAC,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAE;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAC,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAA;KAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACha,CAAC,CAAC,SAAS;QAAC,GAAG,EAAC,GAAG,CAAA;KAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG;QAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;QAAC,OAAO,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAC,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACvQ,YAAY,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;CACjE;AACD,QAAA,MAAM,eAAe,EAAE,qBAAmC,CAAC;AACzC,KAAK,eAAe,CAAC,CAAC,SAAS;IAAC,GAAG,EAAC,GAAG,CAAA;CAAC,IAAI,YAAY,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;AACtF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"AnimatePresence.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/components/AnimatePresence/AnimatePresence.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AA8L3E,cAAM,iBAAiB,CAAC,CAAC,SAAS;IAAC,GAAG,EAAC,GAAG,CAAA;CAAC;IACvC,KAAK;IAGL,MAAM;;;IAGN,KAAK;;;;;IAGL,QAAQ;IACR,OAAO;CACV;AAED,UAAU,qBAAqB;IAC3B,KAAK,CAAC,SAAS;QAAC,GAAG,EAAC,GAAG,CAAA;KAAC,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAE;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAC,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAA;KAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACha,CAAC,CAAC,SAAS;QAAC,GAAG,EAAC,GAAG,CAAA;KAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG;QAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;QAAC,OAAO,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAC,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACvQ,YAAY,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;CACjE;AACD,QAAA,MAAM,eAAe,EAAE,qBAAmC,CAAC;AACzC,KAAK,eAAe,CAAC,CAAC,SAAS;IAAC,GAAG,EAAC,GAAG,CAAA;CAAC,IAAI,YAAY,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;AACtF,eAAe,eAAe,CAAC"}

package/dist/components/AnimatePresence/PresenceChild/PresenceChild.svelte

@@ -1,45 +1,49 @@
 <!-- based on framer-motion@4.0.3,
 Copyright (c) 2018 Framer B.V. -->
+<svelte:options runes />
 
-<script context="module">
+<script context="module" lang="ts" module>
     let presenceId = 0;
     function getPresenceId() {
         const id = presenceId;
         presenceId++;
         return id;
     }
-    function newChildrenMap() {
-        return new Map();
+    function newChildrenMap(): Map<number, boolean> {
+        return new Map<number, boolean>();
     }
 </script>
 
 <script lang="ts">
-    import { afterUpdate, setContext, tick } from "svelte";
+    import { setContext, tick } from "svelte";
     import { setDomContext } from "../../../context/DOMcontext.js";
     import { PresenceContext } from "../../../context/PresenceContext.js";
     import type { PresenceChildProps } from "./index.js";
 
-    type $$Props = PresenceChildProps;
+    interface Props extends PresenceChildProps {}
 
-    export let isPresent: $$Props['isPresent'],
-        onExitComplete: $$Props['onExitComplete'] = undefined,
-        initial: $$Props['initial'] = undefined,
-        custom: $$Props['custom'] = undefined,
-        presenceAffectsLayout: $$Props['presenceAffectsLayout'],
-        isCustom: $$Props['isCustom'];
+    let {
+        isPresent,
+        onExitComplete = undefined,
+        initial = undefined,
+        custom = undefined,
+        presenceAffectsLayout,
+        isCustom,
+        children,
+    }: Props = $props();
 
     const presenceChildren = newChildrenMap();
     const id = getPresenceId();
 
-    $: refresh = presenceAffectsLayout ? undefined : isPresent;
+    const refresh = $derived(presenceAffectsLayout ? undefined : isPresent);
 
-    const memoContext = () => {
+    const memoContext = (flag?: boolean) => {
         return {
             id,
             initial,
             isPresent,
             custom,
-            onExitComplete: (childId) => {
+            onExitComplete: (childId: number) => {
                 presenceChildren.set(childId, true);
                 let allComplete = true;
                 presenceChildren.forEach((isComplete) => {
@@ -48,7 +52,7 @@ Copyright (c) 2018 Framer B.V. -->
 
                 allComplete && onExitComplete?.();
             },
-            register: (childId) => {
+            register: (childId: number) => {
                 presenceChildren.set(childId, false);
                 return () => presenceChildren.delete(childId);
             },
@@ -56,23 +60,25 @@ Copyright (c) 2018 Framer B.V. -->
     };
     let context = PresenceContext();
 
-    afterUpdate(() => {
+    $effect(() => {
         if (presenceAffectsLayout) {
             context.set(memoContext());
         }
     });
 
-    $: context.set(memoContext(refresh));
+    $effect(() => context.set(memoContext(refresh)));
 
-    const keyset = () => {
+    const keyset = (flag?: boolean) => {
         presenceChildren.forEach((_, key) => presenceChildren.set(key, false));
     };
-    $: keyset(isPresent);
-    $: tick().then(() => {
-        !isPresent && !presenceChildren.size && onExitComplete?.();
+    $effect(() => {
+        keyset(isPresent);
+        tick().then(() => {
+            !isPresent && !presenceChildren.size && onExitComplete?.();
+        });
     });
     setContext(PresenceContext, context);
-    setDomContext("Presence",isCustom,context)
+    setDomContext("Presence", isCustom, context);
 </script>
 
-<slot />
+{@render children?.()}

package/dist/components/AnimatePresence/PresenceChild/PresenceChild.svelte.d.ts

@@ -1,29 +1,4 @@
 import type { PresenceChildProps } from "./index.js";
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const PresenceChild: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<PresenceChildProps, {
-    default: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}, {}, string>;
-type PresenceChild = InstanceType<typeof PresenceChild>;
+declare const PresenceChild: import("svelte").Component<PresenceChildProps, {}, "">;
 export default PresenceChild;
 //# sourceMappingURL=PresenceChild.svelte.d.ts.map

package/dist/components/AnimatePresence/PresenceChild/PresenceChild.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PresenceChild.svelte.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/motion-start/components/AnimatePresence/PresenceChild/PresenceChild.svelte.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAwErD,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AACD,KAAK,gCAAgC,CAAC,KAAK,EAAE,KAAK,IAAI,KAAK,GACvD,CAAC,KAAK,SAAS;IAAE,OAAO,EAAE,GAAG,CAAA;CAAE,GACzB,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GACnC,GAAG,GACH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,GAClB,EAAE,CAAC,CAAC;AAId,QAAA,MAAM,aAAa;;;;;;cAAmF,CAAC;AACrF,KAAK,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAC1D,eAAe,aAAa,CAAC"}
+{"version":3,"file":"PresenceChild.svelte.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/motion-start/components/AnimatePresence/PresenceChild/PresenceChild.svelte.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AA8ErD,QAAA,MAAM,aAAa,wDAAsC,CAAC;AAC1D,eAAe,aAAa,CAAC"}

package/dist/components/AnimatePresence/PresenceChild/types.d.ts

@@ -1,5 +1,7 @@
-import type { VariantLabels } from "../../../motion/types";
+import type { Snippet } from 'svelte';
+import type { VariantLabels } from '../../../motion/types';
 export interface PresenceChildProps {
+    children?: Snippet;
     isPresent: boolean;
     onExitComplete?: () => void;
     initial?: false | VariantLabels;

package/dist/components/AnimatePresence/PresenceChild/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/motion-start/components/AnimatePresence/PresenceChild/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC3D,MAAM,WAAW,kBAAkB;IAE/B,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,GAAG,aAAa,CAAC;IAChC,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,qBAAqB,EAAE,OAAO,CAAC;IAC/B,QAAQ,EAAE,OAAO,CAAA;CACpB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/motion-start/components/AnimatePresence/PresenceChild/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC3D,MAAM,WAAW,kBAAkB;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,GAAG,aAAa,CAAC;IAChC,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,qBAAqB,EAAE,OAAO,CAAC;IAC/B,QAAQ,EAAE,OAAO,CAAC;CAClB"}

package/dist/components/AnimateSharedLayout/AnimateSharedLayout.svelte

@@ -3,23 +3,30 @@ Copyright (c) 2018 Framer B.V. -->
 
 <script lang="ts">
   import { SharedLayoutContext } from "../../context/SharedLayoutContext.js";
-  import type { Presence, SharedLayoutProps } from "./index.js";
+  import { Presence, type SharedLayoutProps } from "./index.js";
   import { createBatcher } from "./utils/batcher.js";
 
   import { getContext, onMount, setContext, tick } from "svelte";
-  import { get, writable } from "svelte/store";
+  import { get, writable, type Writable } from "svelte/store";
   import { setDomContext } from "../../context/DOMcontext.js";
-  import { MotionContext } from "../../context/MotionContext/index.js";
+  import {
+    MotionContext,
+    type MotionContextProps,
+  } from "../../context/MotionContext/index.js";
   import { snapshotViewportBox } from "../../render/dom/projection/utils.js";
   import { resetRotate } from "./utils/rotate.js";
   import { layoutStack } from "./utils/stack.js";
+  import PresenceChild from "../AnimatePresence/PresenceChild/PresenceChild.svelte";
+  import type { VisualElement } from "../../render/types.js";
 
   type $$Props = SharedLayoutProps;
 
   export let type: $$Props["type"] = undefined,
     isCustom = false;
 
-  const context = getContext(MotionContext) || MotionContext(isCustom);
+  const context =
+    getContext<Writable<MotionContextProps>>(MotionContext) ||
+    MotionContext(isCustom);
 
   /**
    * Track whether the component has mounted. If it hasn't, the presence of added children
@@ -29,7 +36,7 @@ Copyright (c) 2018 Framer B.V. -->
   /**
    * A list of all the children in the shared layout
    */
-  let children = new Set();
+  let children = new Set<VisualElement>();
   /**
    * As animate components with a defined `layoutId` are added/removed to the tree,
    * we store them in order. When one is added, it will animate out from the
@@ -59,7 +66,7 @@ Copyright (c) 2018 Framer B.V. -->
    */
   let syncContext = {
     ...createBatcher(),
-    syncUpdate: (force) => scheduleUpdate(force),
+    syncUpdate: (force?: boolean) => scheduleUpdate(force),
     forceUpdate: () => {
       // By copying syncContext to itself, when this component re-renders it'll also re-render
       // all children subscribed to the SharedLayout context.
@@ -71,8 +78,8 @@ Copyright (c) 2018 Framer B.V. -->
 
       forced = true;
     },
-    register: (child) => addChild(child),
-    remove: (child) => {
+    register: (child: VisualElement) => addChild(child),
+    remove: (child: VisualElement) => {
       removeChild(child);
     },
   };
@@ -104,8 +111,8 @@ Copyright (c) 2018 Framer B.V. -->
      * Create a handler which we can use to flush the children animations
      */
     const handler = {
-      measureLayout: (child) => child.updateLayoutMeasurement(),
-      layoutReady: (child) => {
+      measureLayout: (child: any) => child.updateLayoutMeasurement(),
+      layoutReady: (child: VisualElement) => {
         if (child.getLayoutId() !== undefined) {
           const stack = getStack(child);
           stack.animate(child, type === "crossfade");
@@ -172,25 +179,25 @@ Copyright (c) 2018 Framer B.V. -->
     }
   };
 
-  const addChild = (child) => {
+  const addChild = (child: VisualElement) => {
     children.add(child);
     addToStack(child);
 
     child.presence = hasMounted ? Presence.Entering : Presence.Present;
   };
 
-  const removeChild = (child) => {
+  const removeChild = (child: VisualElement) => {
     scheduleUpdate();
     children.delete(child);
     removeFromStack(child);
   };
 
-  const addToStack = (child) => {
+  const addToStack = (child: VisualElement) => {
     const stack = getStack(child);
     stack?.add(child);
   };
 
-  const removeFromStack = (child) => {
+  const removeFromStack = (child: VisualElement) => {
     const stack = getStack(child);
     stack?.remove(child);
   };
@@ -199,7 +206,7 @@ Copyright (c) 2018 Framer B.V. -->
    * Return a stack of animate children based on the provided layoutId.
    * Will create a stack if none currently exists with that layoutId.
    */
-  const getStack = (child) => {
+  const getStack = (child: VisualElement) => {
     const id = child.getLayoutId();
     if (id === undefined) return;
 

package/dist/components/AnimateSharedLayout/AnimateSharedLayout.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { SharedLayoutProps } from "./index.js";
+import { type SharedLayoutProps } from "./index.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/components/AnimateSharedLayout/AnimateSharedLayout.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnimateSharedLayout.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/components/AnimateSharedLayout/AnimateSharedLayout.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAY,iBAAiB,EAAE,MAAM,YAAY,CAAC;AA4P9D,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AACD,KAAK,gCAAgC,CAAC,KAAK,EAAE,KAAK,IAAI,KAAK,GACvD,CAAC,KAAK,SAAS;IAAE,OAAO,EAAE,GAAG,CAAA;CAAE,GACzB,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GACnC,GAAG,GACH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,GAClB,EAAE,CAAC,CAAC;AAId,QAAA,MAAM,mBAAmB;;;;;;cAAmF,CAAC;AAC3F,KAAK,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC;AACtE,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"AnimateSharedLayout.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/components/AnimateSharedLayout/AnimateSharedLayout.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAqQ9D,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AACD,KAAK,gCAAgC,CAAC,KAAK,EAAE,KAAK,IAAI,KAAK,GACvD,CAAC,KAAK,SAAS;IAAE,OAAO,EAAE,GAAG,CAAA;CAAE,GACzB,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GACnC,GAAG,GACH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,GAClB,EAAE,CAAC,CAAC;AAId,QAAA,MAAM,mBAAmB;;;;;;cAAmF,CAAC;AAC3F,KAAK,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC;AACtE,eAAe,mBAAmB,CAAC"}

package/dist/components/AnimateSharedLayout/index.d.ts

@@ -2,7 +2,7 @@
 based on framer-motion@4.1.17,
 Copyright (c) 2018 Framer B.V.
 */
-export type { SharedLayoutProps, Presence } from "./types.js";
+export { type SharedLayoutProps, Presence } from './types.js';
 /**
  * Wrap several [#Motion] components with the \`layout\` or \`layoutId\` prop with this component, so that all react smoothly to the change of a single component.
  * @public

package/dist/components/AnimateSharedLayout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/components/AnimateSharedLayout/index.ts"],"names":[],"mappings":"AAAA;;;EAGE;AAEF,YAAY,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC9D;;;GAGG;AACH,OAAO,EAAC,OAAO,IAAI,mBAAmB,EAAC,MAAM,8BAA8B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/components/AnimateSharedLayout/index.ts"],"names":[],"mappings":"AAAA;;;EAGE;AAEF,OAAO,EAAE,KAAK,iBAAiB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC9D;;;GAGG;AACH,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,8BAA8B,CAAC"}