: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
elementsToMeasure.forEach((element) => {
const restore = transformsToRestore.get(element);
restore.forEach(([key, value]) => {
(_a = element.getValue(key)) === null || _a === void 0 ? void 0 : _a.set(value);
resolversToMeasure.forEach((resolver) => resolver.measureEndState());
resolversToMeasure.forEach((resolver) => {
if (resolver.suspendedScrollY !== undefined) {
window.scrollTo(0, resolver.suspendedScrollY);
anyNeedsMeasurement = false;
toResolve.forEach((resolver) => resolver.complete());
function readAllKeyframes() {
toResolve.forEach((resolver) => {
resolver.readKeyframes();
if (resolver.needsMeasurement) {
anyNeedsMeasurement = true;
function flushKeyframeResolvers() {
constructor(unresolvedKeyframes, onComplete, name, motionValue, element, isAsync = false) {
* Track whether this resolver has completed. Once complete, it never
* needs to attempt keyframe resolution again.
* Track whether this resolver is async. If it is, it'll be added to the
* resolver queue and flushed in the next frame. Resolvers that aren't going
* to trigger read/write thrashing don't need to be async.
* Track whether this resolver needs to perform a measurement
* to resolve its keyframes.
this.needsMeasurement = false;
* Track whether this resolver is currently scheduled to resolve
* to allow it to be cancelled and resumed externally.
this.isScheduled = false;
this.unresolvedKeyframes = [...unresolvedKeyframes];
this.onComplete = onComplete;
this.motionValue = motionValue;
frame_frame.read(readAllKeyframes);
frame_frame.resolveKeyframes(measureAllKeyframes);
const { unresolvedKeyframes, name, element, motionValue } = this;
* If a keyframe is null, we hydrate it either by reading it from
* the instance, or propagating from previous keyframes.
for (let i = 0; i < unresolvedKeyframes.length; i++) {
if (unresolvedKeyframes[i] === null) {
* If the first keyframe is null, we need to find its value by sampling the element
const currentValue = motionValue === null || motionValue === void 0 ? void 0 : motionValue.get();
const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
if (currentValue !== undefined) {
unresolvedKeyframes[0] = currentValue;
else if (element && name) {
const valueAsRead = element.readValue(name, finalKeyframe);
if (valueAsRead !== undefined && valueAsRead !== null) {
unresolvedKeyframes[0] = valueAsRead;
if (unresolvedKeyframes[0] === undefined) {
unresolvedKeyframes[0] = finalKeyframe;
if (motionValue && currentValue === undefined) {
motionValue.set(unresolvedKeyframes[0]);
unresolvedKeyframes[i] = unresolvedKeyframes[i - 1];
measureInitialState() { }
this.onComplete(this.unresolvedKeyframes, this.finalKeyframe);
this.isScheduled = false;
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/utils.mjs
* Returns true if the provided string is a color, ie rgba(0,0,0,0) or #000,
* but false if a number or multiple colors
const isColorString = (type, testProp) => (v) => {
return Boolean((isString(v) && singleColorRegex.test(v) && v.startsWith(type)) ||
(testProp && Object.prototype.hasOwnProperty.call(v, testProp)));
const splitColor = (aName, bName, cName) => (v) => {
const [a, b, c, alpha] = v.match(floatRegex);
alpha: alpha !== undefined ? parseFloat(alpha) : 1,
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/rgba.mjs
const clampRgbUnit = (v) => clamp_clamp(0, 255, v);
transform: (v) => Math.round(clampRgbUnit(v)),
test: isColorString("rgb", "red"),
parse: splitColor("red", "green", "blue"),
transform: ({ red, green, blue, alpha: alpha$1 = 1 }) => "rgba(" +
rgbUnit.transform(green) +
rgbUnit.transform(blue) +
sanitize(alpha.transform(alpha$1)) +
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/hex.mjs
// If we have 6 characters, ie #FF0000
// Or we have 3 characters, ie #F00
alpha: a ? parseInt(a, 16) / 255 : 1,
test: isColorString("#"),
transform: rgba.transform,
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/hsla.mjs
test: isColorString("hsl", "hue"),
parse: splitColor("hue", "saturation", "lightness"),
transform: ({ hue, saturation, lightness, alpha: alpha$1 = 1 }) => {
percent.transform(sanitize(saturation)) +
percent.transform(sanitize(lightness)) +
sanitize(alpha.transform(alpha$1)) +
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/index.mjs
test: (v) => rgba.test(v) || hex.test(v) || hsla.test(v),
: v.hasOwnProperty("red")
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/complex/index.mjs
(((_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) || 0) +
(((_b = v.match(colorRegex)) === null || _b === void 0 ? void 0 : _b.length) || 0) >
const NUMBER_TOKEN = "number";
const COLOR_TOKEN = "color";
const VAR_FUNCTION_TOKEN = "var(";
const SPLIT_TOKEN = "${}";
// this regex consists of the `singleCssVariableRegex|rgbHSLValueRegex|digitRegex`
const complexRegex = /var\s*\(\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\)|-?(?:\d+(?:\.\d+)?|\.\d+)/giu;
function analyseComplexValue(value) {
const originalValue = value.toString();
const tokenised = originalValue.replace(complexRegex, (parsedValue) => {
if (color.test(parsedValue)) {
values.push(color.parse(parsedValue));
else if (parsedValue.startsWith(VAR_FUNCTION_TOKEN)) {
values.push(parsedValue);
types.push(NUMBER_TOKEN);
values.push(parseFloat(parsedValue));
const split = tokenised.split(SPLIT_TOKEN);
return { values, split, indexes, types };
function parseComplexValue(v) {
return analyseComplexValue(v).values;
function createTransformer(source) {
const { split, types } = analyseComplexValue(source);
const numSections = split.length;
for (let i = 0; i < numSections; i++) {
if (v[i] !== undefined) {
if (type === NUMBER_TOKEN) {
output += sanitize(v[i]);
else if (type === COLOR_TOKEN) {
output += color.transform(v[i]);
const convertNumbersToZero = (v) => typeof v === "number" ? 0 : v;
function getAnimatableNone(v) {
const parsed = parseComplexValue(v);
const transformer = createTransformer(v);
return transformer(parsed.map(convertNumbersToZero));
parse: parseComplexValue,
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/complex/filter.mjs
* Properties that should default to 1 or 100%
const maxDefaults = new Set(["brightness", "contrast", "saturate", "opacity"]);
function applyDefaultFilter(v) {
const [name, value] = v.slice(0, -1).split("(");
if (name === "drop-shadow")
const [number] = value.match(floatRegex) || [];
const unit = value.replace(number, "");
let defaultValue = maxDefaults.has(name) ? 1 : 0;
return name + "(" + defaultValue + unit + ")";
const functionRegex = /\b([a-z-]*)\(.*?\)/gu;
getAnimatableNone: (v) => {
const functions = v.match(functionRegex);
return functions ? functions.map(applyDefaultFilter).join(" ") : v;
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/defaults.mjs
* A map of default value types for common values
const defaultValueTypes = {
borderBottomColor: color,
* Gets the default ValueType for the provided value key
const getDefaultValueType = (key) => defaultValueTypes[key];
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs
function animatable_none_getAnimatableNone(key, value) {
let defaultValueType = getDefaultValueType(key);
if (defaultValueType !== filter)
defaultValueType = complex;
// If value is not recognised as animatable, ie "none", create an animatable version origin based on the target
return defaultValueType.getAnimatableNone
? defaultValueType.getAnimatableNone(value)
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs
* If we encounter keyframes like "none" or "0" and we also have keyframes like
* "#fff" or "200px 200px" we want to find a keyframe to serve as a template for
* the "none" keyframes. In this case "#fff" or "200px 200px" - then these get turned into
* zero equivalents, i.e. "#fff0" or "0px 0px".
const invalidTemplates = new Set(["auto", "none", "0"]);
function makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name) {
let animatableTemplate = undefined;
while (i < unresolvedKeyframes.length && !animatableTemplate) {
const keyframe = unresolvedKeyframes[i];
if (typeof keyframe === "string" &&
!invalidTemplates.has(keyframe) &&
analyseComplexValue(keyframe).values.length) {
animatableTemplate = unresolvedKeyframes[i];
if (animatableTemplate && name) {
for (const noneIndex of noneKeyframeIndexes) {
unresolvedKeyframes[noneIndex] = animatable_none_getAnimatableNone(name, animatableTemplate);
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs