: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/setters.mjs
* Set VisualElement's MotionValue, creating a new MotionValue for it if
function setMotionValue(visualElement, key, value) {
if (visualElement.hasValue(key)) {
visualElement.getValue(key).set(value);
visualElement.addValue(key, motionValue(value));
function setTarget(visualElement, definition) {
const resolved = resolveVariant(visualElement, definition);
let { transitionEnd = {}, transition = {}, ...target } = resolved || {};
target = { ...target, ...transitionEnd };
for (const key in target) {
const value = resolveFinalValueInKeyframes(target[key]);
setMotionValue(visualElement, key, value);
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs
* Decide whether we should block this animation. Previously, we achieved this
* just by checking whether the key was listed in protectedKeys, but this
* posed problems if an animation was triggered by afterChildren and protectedKeys
* had been set to true in the meantime.
function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) {
const shouldBlock = protectedKeys.hasOwnProperty(key) && needsAnimating[key] !== true;
needsAnimating[key] = false;
function animateTarget(visualElement, targetAndTransition, { delay = 0, transitionOverride, type } = {}) {
let { transition = visualElement.getDefaultTransition(), transitionEnd, ...target } = targetAndTransition;
const willChange = visualElement.getValue("willChange");
transition = transitionOverride;
const animationTypeState = type &&
visualElement.animationState &&
visualElement.animationState.getState()[type];
for (const key in target) {
const value = visualElement.getValue(key, (_a = visualElement.latestValues[key]) !== null && _a !== void 0 ? _a : null);
const valueTarget = target[key];
if (valueTarget === undefined ||
shouldBlockAnimation(animationTypeState, key))) {
const valueTransition = {
...getValueTransition(transition || {}, key),
* If this is the first time a value is being animated, check
* to see if we're handling off from an existing animation.
if (window.HandoffAppearAnimations) {
const props = visualElement.getProps();
const appearId = props[optimizedAppearDataAttribute];
const elapsed = window.HandoffAppearAnimations(appearId, key, value, frame_frame);
valueTransition.elapsed = elapsed;
value.start(animateMotionValue(key, value, valueTarget, visualElement.shouldReduceMotion && transformProps.has(key)
: valueTransition, visualElement, isHandoff));
const animation = value.animation;
if (isWillChangeMotionValue(willChange)) {
animation.then(() => willChange.remove(key));
animations.push(animation);
Promise.all(animations).then(() => {
frame_frame.update(() => {
transitionEnd && setTarget(visualElement, transitionEnd);
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs
function animateVariant(visualElement, variant, options = {}) {
const resolved = resolveVariant(visualElement, variant, options.type === "exit"
? (_a = visualElement.presenceContext) === null || _a === void 0 ? void 0 : _a.custom
let { transition = visualElement.getDefaultTransition() || {} } = resolved || {};
if (options.transitionOverride) {
transition = options.transitionOverride;
* If we have a variant, create a callback that runs it as an animation.
* Otherwise, we resolve a Promise immediately for a composable no-op.
const getAnimation = resolved
? () => Promise.all(animateTarget(visualElement, resolved, options))
: () => Promise.resolve();
* If we have children, create a callback that runs all their animations.
* Otherwise, we resolve a Promise immediately for a composable no-op.
const getChildAnimations = visualElement.variantChildren && visualElement.variantChildren.size
? (forwardDelay = 0) => {
const { delayChildren = 0, staggerChildren, staggerDirection, } = transition;
return animateChildren(visualElement, variant, delayChildren + forwardDelay, staggerChildren, staggerDirection, options);
: () => Promise.resolve();
* If the transition explicitly defines a "when" option, we need to resolve either
* this animation or all children animations before playing the other.
const { when } = transition;
const [first, last] = when === "beforeChildren"
? [getAnimation, getChildAnimations]
: [getChildAnimations, getAnimation];
return first().then(() => last());
return Promise.all([getAnimation(), getChildAnimations(options.delay)]);
function animateChildren(visualElement, variant, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) {
const maxStaggerDuration = (visualElement.variantChildren.size - 1) * staggerChildren;
const generateStaggerDuration = staggerDirection === 1
? (i = 0) => i * staggerChildren
: (i = 0) => maxStaggerDuration - i * staggerChildren;
Array.from(visualElement.variantChildren)
child.notify("AnimationStart", variant);
animations.push(animateVariant(child, variant, {
delay: delayChildren + generateStaggerDuration(i),
}).then(() => child.notify("AnimationComplete", variant)));
return Promise.all(animations);
function sortByTreeOrder(a, b) {
return a.sortNodePosition(b);
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element.mjs
function animateVisualElement(visualElement, definition, options = {}) {
visualElement.notify("AnimationStart", definition);
if (Array.isArray(definition)) {
const animations = definition.map((variant) => animateVariant(visualElement, variant, options));
animation = Promise.all(animations);
else if (typeof definition === "string") {
animation = animateVariant(visualElement, definition, options);
const resolvedDefinition = typeof definition === "function"
? resolveVariant(visualElement, definition, options.custom)
animation = Promise.all(animateTarget(visualElement, resolvedDefinition, options));
return animation.then(() => {
frame_frame.postRender(() => {
visualElement.notify("AnimationComplete", definition);
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/animation-state.mjs
const reversePriorityOrder = [...variantPriorityOrder].reverse();
const numAnimationTypes = variantPriorityOrder.length;
function animateList(visualElement) {
return (animations) => Promise.all(animations.map(({ animation, options }) => animateVisualElement(visualElement, animation, options)));
function createAnimationState(visualElement) {
let animate = animateList(visualElement);
const state = createState();
let isInitialRender = true;
* This function will be used to reduce the animation definitions for
* each active animation type into an object of resolved values for it.
const buildResolvedTypeValues = (type) => (acc, definition) => {
const resolved = resolveVariant(visualElement, definition, type === "exit"
? (_a = visualElement.presenceContext) === null || _a === void 0 ? void 0 : _a.custom
const { transition, transitionEnd, ...target } = resolved;
acc = { ...acc, ...target, ...transitionEnd };
* This just allows us to inject mocked animation functions
function setAnimateFunction(makeAnimator) {
animate = makeAnimator(visualElement);
* When we receive new props, we need to:
* 1. Create a list of protected keys for each type. This is a directory of
* value keys that are currently being "handled" by types of a higher priority
* so that whenever an animation is played of a given type, these values are
* protected from being animated.
* 2. Determine if an animation type needs animating.
* 3. Determine if any values have been removed from a type and figure out
* what to animate those to.
function animateChanges(changedActiveType) {
const props = visualElement.getProps();
const context = visualElement.getVariantContext(true) || {};
* A list of animations that we'll build into as we iterate through the animation
* types. This will get executed at the end of the function.
* Keep track of which values have been removed. Then, as we hit lower priority
* animation types, we can check if they contain removed values and animate to that.
const removedKeys = new Set();
* A dictionary of all encountered keys. This is an object to let us build into and
* copy it without iteration. Each time we hit an animation type we set its protected
* keys - the keys its not allowed to animate - to the latest version of this object.
let encounteredKeys = {};
* If a variant has been removed at a given index, and this component is controlling
* variant animations, we want to ensure lower-priority variants are forced to animate.
let removedVariantIndex = Infinity;
* Iterate through all animation types in reverse priority order. For each, we want to
* detect which values it's handling and whether or not they've changed (and therefore
* need to be animated). If any values have been removed, we want to detect those in
* lower priority props and flag for animation.
for (let i = 0; i < numAnimationTypes; i++) {
const type = reversePriorityOrder[i];
const typeState = state[type];
const prop = props[type] !== undefined
const propIsVariant = isVariantLabel(prop);
* If this type has *just* changed isActive status, set activeDelta
* to that status. Otherwise set to null.
const activeDelta = type === changedActiveType ? typeState.isActive : null;
if (activeDelta === false)
* If this prop is an inherited variant, rather than been set directly on the
* component itself, we want to make sure we allow the parent to trigger animations.
* TODO: Can probably change this to a !isControllingVariants check
let isInherited = prop === context[type] &&
visualElement.manuallyAnimateOnMount) {
* Set all encountered keys so far as the protected keys for this type. This will
* be any key that has been animated or otherwise handled by active, higher-priortiy types.
typeState.protectedKeys = { ...encounteredKeys };
// Check if we can skip analysing this prop early
// If it isn't active and hasn't *just* been set as inactive
(!typeState.isActive && activeDelta === null) ||
// If we didn't and don't have any defined prop for this animation type
(!prop && !typeState.prevProp) ||
// Or if the prop doesn't define an animation
isAnimationControls(prop) ||
typeof prop === "boolean") {
* As we go look through the values defined on this type, if we detect
* a changed value or a value that was removed in a higher priority, we set
* this to true and add this prop to the animation list.
const variantDidChange = checkVariantsDidChange(typeState.prevProp, prop);
let shouldAnimateType = variantDidChange ||
// If we're making this variant active, we want to always make it active
(type === changedActiveType &&
// If we removed a higher-priority variant (i is in reverse order)
(i > removedVariantIndex && propIsVariant);
let handledRemovedValues = false;
* As animations can be set as variant lists, variants or target objects, we
* coerce everything to an array if it isn't one already
const definitionList = Array.isArray(prop) ? prop : [prop];
* Build an object of all the resolved values. We'll use this in the subsequent
* animateChanges calls to determine whether a value has changed.
let resolvedValues = definitionList.reduce(buildResolvedTypeValues(type), {});
if (activeDelta === false)
* Now we need to loop through all the keys in the prev prop and this prop,
* 1. If the value has changed, and needs animating
* 2. If it has been removed, and needs adding to the removedKeys set
* 3. If it has been removed in a higher priority type and needs animating
* 4. If it hasn't been removed in a higher priority but hasn't changed, and
* needs adding to the type's protectedKeys list.
const { prevResolvedValues = {} } = typeState;
const markToAnimate = (key) => {
shouldAnimateType = true;
if (removedKeys.has(key)) {
handledRemovedValues = true;
typeState.needsAnimating[key] = true;
const motionValue = visualElement.getValue(key);
motionValue.liveStyle = false;
for (const key in allKeys) {
const next = resolvedValues[key];
const prev = prevResolvedValues[key];
// If we've already handled this we can just skip ahead
if (encounteredKeys.hasOwnProperty(key))
* If the value has changed, we probably want to animate it.
let valueHasChanged = false;
if (isKeyframesTarget(next) && isKeyframesTarget(prev)) {
valueHasChanged = !shallowCompare(next, prev);
valueHasChanged = next !== prev;
if (next !== undefined && next !== null) {
// If next is defined and doesn't equal prev, it needs animating
// If it's undefined, it's been removed.
else if (next !== undefined && removedKeys.has(key)) {
* If next hasn't changed and it isn't undefined, we want to check if it's
* been removed by a higher priority
* If it hasn't changed, we add it to the list of protected values
* to ensure it doesn't get animated.
typeState.protectedKeys[key] = true;
* Update the typeState so next time animateChanges is called we can compare the
* latest prop and resolvedValues to these.
typeState.prevProp = prop;
typeState.prevResolvedValues = resolvedValues;
if (typeState.isActive) {
encounteredKeys = { ...encounteredKeys, ...resolvedValues };
if (isInitialRender && visualElement.blockInitialAnimation) {
shouldAnimateType = false;
* If this is an inherited prop we want to hard-block animations
if (shouldAnimateType && (!isInherited || handledRemovedValues)) {
animations.push(...definitionList.map((animation) => ({
* If there are some removed value that haven't been dealt with,
* we need to create a new animation that falls back either to the value
* defined in the style prop, or the last read value.
const fallbackAnimation = {};
removedKeys.forEach((key) => {
const fallbackTarget = visualElement.getBaseTarget(key);
const motionValue = visualElement.getValue(key);
motionValue.liveStyle = true;
// @ts-expect-error - @mattgperry to figure if we should do something here
fallbackAnimation[key] = fallbackTarget !== null && fallbackTarget !== void 0 ? fallbackTarget : null;
animations.push({ animation: fallbackAnimation });
let shouldAnimate = Boolean(animations.length);
(props.initial === false || props.initial === props.animate) &&
!visualElement.manuallyAnimateOnMount) {
return shouldAnimate ? animate(animations) : Promise.resolve();
* Change whether a certain animation type is active.
function setActive(type, isActive) {
// If the active state hasn't changed, we can safely do nothing here
if (state[type].isActive === isActive)
return Promise.resolve();
// Propagate active change to children
(_a = visualElement.variantChildren) === null || _a === void 0 ? void 0 : _a.forEach((child) => { var _a; return (_a = child.animationState) === null || _a === void 0 ? void 0 : _a.setActive(type, isActive); });
state[type].isActive = isActive;
const animations = animateChanges(type);
for (const key in state) {
state[key].protectedKeys = {};
It is recommended that you Edit text format, this type of Fix handles quite a lot in one request
