> =>\n is.und(a) ? [] : is.arr(a) ? (a as any) : [a]\n\n/** Copy the `queue`, then iterate it after the `queue` is cleared */\nexport function flush(\n queue: Map
,\n iterator: (entry: [P, T]) => void\n): void\nexport function flush(queue: Set, iterator: (value: T) => void): void\nexport function flush(queue: any, iterator: any) {\n if (queue.size) {\n const items = Array.from(queue)\n queue.clear()\n each(items, iterator)\n }\n}\n\n/** Call every function in the queue with the same arguments. */\nexport const flushCalls = (\n queue: Set,\n ...args: Parameters\n) => flush(queue, fn => fn(...args))\n\n// For server-side rendering: https://github.com/react-spring/zustand/pull/34\n// Deno support: https://github.com/pmndrs/zustand/issues/347\n\nexport const isSSR = () =>\n typeof window === 'undefined' ||\n !window.navigator ||\n /ServerSideRendering|^Deno\\//.test(window.navigator.userAgent)\n","import { raf } from '@react-spring/rafz'\nimport * as G from './globals'\n\nexport interface OpaqueAnimation {\n idle: boolean\n priority: number\n advance(dt: number): void\n}\n\n// Animations starting on the next frame\nconst startQueue = new Set()\n\n// The animations being updated in the current frame, sorted by lowest\n// priority first. These two arrays are swapped at the end of each frame.\nlet currentFrame: OpaqueAnimation[] = []\nlet prevFrame: OpaqueAnimation[] = []\n\n// The priority of the currently advancing animation.\n// To protect against a race condition whenever a frame is being processed,\n// where the filtering of `animations` is corrupted with a shifting index,\n// causing animations to potentially advance 2x faster than intended.\nlet priority = 0\n\n/**\n * The frameloop executes its animations in order of lowest priority first.\n * Animations are retained until idle.\n */\nexport const frameLoop = {\n get idle() {\n return !startQueue.size && !currentFrame.length\n },\n\n /** Advance the given animation on every frame until idle. */\n start(animation: OpaqueAnimation) {\n // An animation can be added while a frame is being processed,\n // unless its priority is lower than the animation last updated.\n if (priority > animation.priority) {\n startQueue.add(animation)\n raf.onStart(flushStartQueue)\n } else {\n startSafely(animation)\n raf(advance)\n }\n },\n\n /** Advance all animations by the given time. */\n advance,\n\n /** Call this when an animation's priority changes. */\n sort(animation: OpaqueAnimation) {\n if (priority) {\n raf.onFrame(() => frameLoop.sort(animation))\n } else {\n const prevIndex = currentFrame.indexOf(animation)\n if (~prevIndex) {\n currentFrame.splice(prevIndex, 1)\n startUnsafely(animation)\n }\n }\n },\n\n /**\n * Clear all animations. For testing purposes.\n *\n * ☠️ Never call this from within the frameloop.\n */\n clear() {\n currentFrame = []\n startQueue.clear()\n },\n}\n\nfunction flushStartQueue() {\n startQueue.forEach(startSafely)\n startQueue.clear()\n raf(advance)\n}\n\nfunction startSafely(animation: OpaqueAnimation) {\n if (!currentFrame.includes(animation)) startUnsafely(animation)\n}\n\nfunction startUnsafely(animation: OpaqueAnimation) {\n currentFrame.splice(\n findIndex(currentFrame, other => other.priority > animation.priority),\n 0,\n animation\n )\n}\n\nfunction advance(dt: number) {\n const nextFrame = prevFrame\n\n for (let i = 0; i < currentFrame.length; i++) {\n const animation = currentFrame[i]\n priority = animation.priority\n\n // Animations may go idle before advancing.\n if (!animation.idle) {\n G.willAdvance(animation)\n animation.advance(dt)\n if (!animation.idle) {\n nextFrame.push(animation)\n }\n }\n }\n priority = 0\n\n // Reuse the `currentFrame` array to avoid garbage collection.\n prevFrame = currentFrame\n prevFrame.length = 0\n\n // Set `currentFrame` for next frame, so the `start` function\n // adds new animations to the proper array.\n currentFrame = nextFrame\n\n return currentFrame.length > 0\n}\n\n/** Like `Array.prototype.findIndex` but returns `arr.length` instead of `-1` */\nfunction findIndex(arr: T[], test: (value: T) => boolean) {\n const index = arr.findIndex(test)\n return index < 0 ? arr.length : index\n}\n","export const clamp = (min: number, max: number, v: number) =>\n Math.min(Math.max(v, min), max)\n","// const INTEGER = '[-+]?\\\\d+';\nconst NUMBER = '[-+]?\\\\d*\\\\.?\\\\d+'\nconst PERCENTAGE = NUMBER + '%'\n\nfunction call(...parts: string[]) {\n return '\\\\(\\\\s*(' + parts.join(')\\\\s*,\\\\s*(') + ')\\\\s*\\\\)'\n}\n\nexport const rgb = new RegExp('rgb' + call(NUMBER, NUMBER, NUMBER))\nexport const rgba = new RegExp('rgba' + call(NUMBER, NUMBER, NUMBER, NUMBER))\nexport const hsl = new RegExp('hsl' + call(NUMBER, PERCENTAGE, PERCENTAGE))\nexport const hsla = new RegExp(\n 'hsla' + call(NUMBER, PERCENTAGE, PERCENTAGE, NUMBER)\n)\nexport const hex3 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/\nexport const hex4 =\n /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/\nexport const hex6 = /^#([0-9a-fA-F]{6})$/\nexport const hex8 = /^#([0-9a-fA-F]{8})$/\n","/*\nhttps://github.com/react-community/normalize-css-color\n\nBSD 3-Clause License\n\nCopyright (c) 2016, React Community\nAll rights reserved.\n\nRedistribution and use in source and binary forms, with or without\nmodification, are permitted provided that the following conditions are met:\n\n* Redistributions of source code must retain the above copyright notice, this\n list of conditions and the following disclaimer.\n\n* Redistributions in binary form must reproduce the above copyright notice,\n this list of conditions and the following disclaimer in the documentation\n and/or other materials provided with the distribution.\n\n* Neither the name of the copyright holder nor the names of its\n contributors may be used to endorse or promote products derived from\n this software without specific prior written permission.\n\nTHIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS \"AS IS\"\nAND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE\nIMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE\nDISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE\nFOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL\nDAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR\nSERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER\nCAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,\nOR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE\nOF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.\n*/\n\nimport * as matchers from './colorMatchers'\nimport * as G from './globals'\n\nexport function normalizeColor(color: number | string) {\n let match\n\n if (typeof color === 'number') {\n return color >>> 0 === color && color >= 0 && color <= 0xffffffff\n ? color\n : null\n }\n\n // Ordered based on occurrences on Facebook codebase\n if ((match = matchers.hex6.exec(color)))\n return parseInt(match[1] + 'ff', 16) >>> 0\n\n if (G.colors && G.colors[color] !== undefined) {\n return G.colors[color]\n }\n\n if ((match = matchers.rgb.exec(color))) {\n return (\n ((parse255(match[1]) << 24) | // r\n (parse255(match[2]) << 16) | // g\n (parse255(match[3]) << 8) | // b\n 0x000000ff) >>> // a\n 0\n )\n }\n\n if ((match = matchers.rgba.exec(color))) {\n return (\n ((parse255(match[1]) << 24) | // r\n (parse255(match[2]) << 16) | // g\n (parse255(match[3]) << 8) | // b\n parse1(match[4])) >>> // a\n 0\n )\n }\n\n if ((match = matchers.hex3.exec(color))) {\n return (\n parseInt(\n match[1] +\n match[1] + // r\n match[2] +\n match[2] + // g\n match[3] +\n match[3] + // b\n 'ff', // a\n 16\n ) >>> 0\n )\n }\n\n // https://drafts.csswg.org/css-color-4/#hex-notation\n if ((match = matchers.hex8.exec(color))) return parseInt(match[1], 16) >>> 0\n\n if ((match = matchers.hex4.exec(color))) {\n return (\n parseInt(\n match[1] +\n match[1] + // r\n match[2] +\n match[2] + // g\n match[3] +\n match[3] + // b\n match[4] +\n match[4], // a\n 16\n ) >>> 0\n )\n }\n\n if ((match = matchers.hsl.exec(color))) {\n return (\n (hslToRgb(\n parse360(match[1]), // h\n parsePercentage(match[2]), // s\n parsePercentage(match[3]) // l\n ) |\n 0x000000ff) >>> // a\n 0\n )\n }\n\n if ((match = matchers.hsla.exec(color))) {\n return (\n (hslToRgb(\n parse360(match[1]), // h\n parsePercentage(match[2]), // s\n parsePercentage(match[3]) // l\n ) |\n parse1(match[4])) >>> // a\n 0\n )\n }\n return null\n}\n\nfunction hue2rgb(p: number, q: number, t: number) {\n if (t < 0) t += 1\n if (t > 1) t -= 1\n if (t < 1 / 6) return p + (q - p) * 6 * t\n if (t < 1 / 2) return q\n if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6\n return p\n}\n\nfunction hslToRgb(h: number, s: number, l: number) {\n const q = l < 0.5 ? l * (1 + s) : l + s - l * s\n const p = 2 * l - q\n const r = hue2rgb(p, q, h + 1 / 3)\n const g = hue2rgb(p, q, h)\n const b = hue2rgb(p, q, h - 1 / 3)\n return (\n (Math.round(r * 255) << 24) |\n (Math.round(g * 255) << 16) |\n (Math.round(b * 255) << 8)\n )\n}\n\nfunction parse255(str: string) {\n const int = parseInt(str, 10)\n if (int < 0) return 0\n if (int > 255) return 255\n return int\n}\n\nfunction parse360(str: string) {\n const int = parseFloat(str)\n return (((int % 360) + 360) % 360) / 360\n}\n\nfunction parse1(str: string) {\n const num = parseFloat(str)\n if (num < 0) return 0\n if (num > 1) return 255\n return Math.round(num * 255)\n}\n\nfunction parsePercentage(str: string) {\n // parseFloat conveniently ignores the final %\n const int = parseFloat(str)\n if (int < 0) return 0\n if (int > 100) return 1\n return int / 100\n}\n","import { normalizeColor } from './normalizeColor'\n\nexport function colorToRgba(input: string) {\n let int32Color = normalizeColor(input)\n if (int32Color === null) return input\n int32Color = int32Color || 0\n const r = (int32Color & 0xff000000) >>> 24\n const g = (int32Color & 0x00ff0000) >>> 16\n const b = (int32Color & 0x0000ff00) >>> 8\n const a = (int32Color & 0x000000ff) / 255\n return `rgba(${r}, ${g}, ${b}, ${a})`\n}\n","import * as G from './globals'\nimport { is } from './helpers'\nimport {\n Animatable,\n InterpolatorFn,\n EasingFunction,\n ExtrapolateType,\n InterpolatorConfig,\n InterpolatorFactory,\n} from '@react-spring/types'\n\nexport const createInterpolator: InterpolatorFactory = (\n range: readonly number[] | InterpolatorFn | InterpolatorConfig,\n output?: readonly Animatable[],\n extrapolate?: ExtrapolateType\n) => {\n if (is.fun(range)) {\n return range\n }\n\n if (is.arr(range)) {\n return createInterpolator({\n range,\n output: output!,\n extrapolate,\n })\n }\n\n if (is.str(range.output[0])) {\n return G.createStringInterpolator(range as any) as any\n }\n\n const config = range as InterpolatorConfig\n const outputRange = config.output\n const inputRange = config.range || [0, 1]\n\n const extrapolateLeft =\n config.extrapolateLeft || config.extrapolate || 'extend'\n const extrapolateRight =\n config.extrapolateRight || config.extrapolate || 'extend'\n const easing = config.easing || (t => t)\n\n return (input: number) => {\n const range = findRange(input, inputRange)\n return interpolate(\n input,\n inputRange[range],\n inputRange[range + 1],\n outputRange[range],\n outputRange[range + 1],\n easing,\n extrapolateLeft,\n extrapolateRight,\n config.map\n )\n }\n}\n\nfunction interpolate(\n input: number,\n inputMin: number,\n inputMax: number,\n outputMin: number,\n outputMax: number,\n easing: EasingFunction,\n extrapolateLeft: ExtrapolateType,\n extrapolateRight: ExtrapolateType,\n map?: (x: number) => number\n) {\n let result = map ? map(input) : input\n // Extrapolate\n if (result < inputMin) {\n if (extrapolateLeft === 'identity') return result\n else if (extrapolateLeft === 'clamp') result = inputMin\n }\n if (result > inputMax) {\n if (extrapolateRight === 'identity') return result\n else if (extrapolateRight === 'clamp') result = inputMax\n }\n if (outputMin === outputMax) return outputMin\n if (inputMin === inputMax) return input <= inputMin ? outputMin : outputMax\n // Input Range\n if (inputMin === -Infinity) result = -result\n else if (inputMax === Infinity) result = result - inputMin\n else result = (result - inputMin) / (inputMax - inputMin)\n // Easing\n result = easing(result)\n // Output Range\n if (outputMin === -Infinity) result = -result\n else if (outputMax === Infinity) result = result + outputMin\n else result = result * (outputMax - outputMin) + outputMin\n return result\n}\n\nfunction findRange(input: number, inputRange: readonly number[]) {\n // eslint-disable-next-line no-var\n for (var i = 1; i < inputRange.length - 1; ++i)\n if (inputRange[i] >= input) break\n return i - 1\n}\n","import { EasingFunction } from '@react-spring/types'\n\nimport { clamp } from './clamp'\n\nexport type Direction = 'start' | 'end'\n\ntype StepsEasing = (steps: number, direction?: Direction) => EasingFunction\n\nconst steps: StepsEasing =\n (steps: number, direction: Direction = 'end') =>\n (progress: number) => {\n progress =\n direction === 'end'\n ? Math.min(progress, 0.999)\n : Math.max(progress, 0.001)\n const expanded = progress * steps\n const rounded =\n direction === 'end' ? Math.floor(expanded) : Math.ceil(expanded)\n\n return clamp(0, 1, rounded / steps)\n }\n\n/**\n * With thanks to ai easings.net\n * https://github.com/ai/easings.net/blob/master/src/easings/easingsFunctions.ts\n */\ninterface EasingDictionary {\n linear: (t: number) => number\n easeInQuad: (t: number) => number\n easeOutQuad: (t: number) => number\n easeInOutQuad: (t: number) => number\n easeInCubic: (t: number) => number\n easeOutCubic: (t: number) => number\n easeInOutCubic: (t: number) => number\n easeInQuart: (t: number) => number\n easeOutQuart: (t: number) => number\n easeInOutQuart: (t: number) => number\n easeInQuint: (t: number) => number\n easeOutQuint: (t: number) => number\n easeInOutQuint: (t: number) => number\n easeInSine: (t: number) => number\n easeOutSine: (t: number) => number\n easeInOutSine: (t: number) => number\n easeInExpo: (t: number) => number\n easeOutExpo: (t: number) => number\n easeInOutExpo: (t: number) => number\n easeInCirc: (t: number) => number\n easeOutCirc: (t: number) => number\n easeInOutCirc: (t: number) => number\n easeInBack: (t: number) => number\n easeOutBack: (t: number) => number\n easeInOutBack: (t: number) => number\n easeInElastic: (t: number) => number\n easeOutElastic: (t: number) => number\n easeInOutElastic: (t: number) => number\n easeInBounce: (t: number) => number\n easeOutBounce: (t: number) => number\n easeInOutBounce: (t: number) => number\n steps: StepsEasing\n}\n\nconst c1 = 1.70158\nconst c2 = c1 * 1.525\nconst c3 = c1 + 1\nconst c4 = (2 * Math.PI) / 3\nconst c5 = (2 * Math.PI) / 4.5\n\nconst bounceOut: EasingFunction = x => {\n const n1 = 7.5625\n const d1 = 2.75\n\n if (x < 1 / d1) {\n return n1 * x * x\n } else if (x < 2 / d1) {\n return n1 * (x -= 1.5 / d1) * x + 0.75\n } else if (x < 2.5 / d1) {\n return n1 * (x -= 2.25 / d1) * x + 0.9375\n } else {\n return n1 * (x -= 2.625 / d1) * x + 0.984375\n }\n}\n\nexport const easings: EasingDictionary = {\n linear: x => x,\n easeInQuad: x => x * x,\n easeOutQuad: x => 1 - (1 - x) * (1 - x),\n easeInOutQuad: x => (x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2),\n easeInCubic: x => x * x * x,\n easeOutCubic: x => 1 - Math.pow(1 - x, 3),\n easeInOutCubic: x =>\n x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2,\n easeInQuart: x => x * x * x * x,\n easeOutQuart: x => 1 - Math.pow(1 - x, 4),\n easeInOutQuart: x =>\n x < 0.5 ? 8 * x * x * x * x : 1 - Math.pow(-2 * x + 2, 4) / 2,\n easeInQuint: x => x * x * x * x * x,\n easeOutQuint: x => 1 - Math.pow(1 - x, 5),\n easeInOutQuint: x =>\n x < 0.5 ? 16 * x * x * x * x * x : 1 - Math.pow(-2 * x + 2, 5) / 2,\n easeInSine: x => 1 - Math.cos((x * Math.PI) / 2),\n easeOutSine: x => Math.sin((x * Math.PI) / 2),\n easeInOutSine: x => -(Math.cos(Math.PI * x) - 1) / 2,\n easeInExpo: x => (x === 0 ? 0 : Math.pow(2, 10 * x - 10)),\n easeOutExpo: x => (x === 1 ? 1 : 1 - Math.pow(2, -10 * x)),\n easeInOutExpo: x =>\n x === 0\n ? 0\n : x === 1\n ? 1\n : x < 0.5\n ? Math.pow(2, 20 * x - 10) / 2\n : (2 - Math.pow(2, -20 * x + 10)) / 2,\n easeInCirc: x => 1 - Math.sqrt(1 - Math.pow(x, 2)),\n easeOutCirc: x => Math.sqrt(1 - Math.pow(x - 1, 2)),\n easeInOutCirc: x =>\n x < 0.5\n ? (1 - Math.sqrt(1 - Math.pow(2 * x, 2))) / 2\n : (Math.sqrt(1 - Math.pow(-2 * x + 2, 2)) + 1) / 2,\n easeInBack: x => c3 * x * x * x - c1 * x * x,\n easeOutBack: x => 1 + c3 * Math.pow(x - 1, 3) + c1 * Math.pow(x - 1, 2),\n easeInOutBack: x =>\n x < 0.5\n ? (Math.pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2)) / 2\n : (Math.pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2,\n easeInElastic: x =>\n x === 0\n ? 0\n : x === 1\n ? 1\n : -Math.pow(2, 10 * x - 10) * Math.sin((x * 10 - 10.75) * c4),\n easeOutElastic: x =>\n x === 0\n ? 0\n : x === 1\n ? 1\n : Math.pow(2, -10 * x) * Math.sin((x * 10 - 0.75) * c4) + 1,\n easeInOutElastic: x =>\n x === 0\n ? 0\n : x === 1\n ? 1\n : x < 0.5\n ? -(Math.pow(2, 20 * x - 10) * Math.sin((20 * x - 11.125) * c5)) / 2\n : (Math.pow(2, -20 * x + 10) * Math.sin((20 * x - 11.125) * c5)) / 2 + 1,\n easeInBounce: x => 1 - bounceOut(1 - x),\n easeOutBounce: bounceOut,\n easeInOutBounce: x =>\n x < 0.5 ? (1 - bounceOut(1 - 2 * x)) / 2 : (1 + bounceOut(2 * x - 1)) / 2,\n steps,\n} as const\n","/**\n * MIT License\n * Copyright (c) Alec Larson\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nconst $get = Symbol.for('FluidValue.get')\nconst $observers = Symbol.for('FluidValue.observers')\n\nexport {\n FluidValue,\n hasFluidValue,\n getFluidValue,\n getFluidObservers,\n callFluidObserver,\n callFluidObservers,\n // Mutations\n setFluidGetter,\n addFluidObserver,\n removeFluidObserver,\n}\n\n/** Returns true if `arg` can be observed. */\nconst hasFluidValue = (arg: any): arg is FluidValue => Boolean(arg && arg[$get])\n\n/**\n * Get the current value.\n * If `arg` is not observable, `arg` is returned.\n */\nconst getFluidValue: GetFluidValue = (arg: any) =>\n arg && arg[$get] ? arg[$get]() : arg\n\n/** Get the current observer set. Never mutate it directly! */\nconst getFluidObservers: GetFluidObservers = (target: any) =>\n target[$observers] || null\n\n/** Send an event to an observer. */\nfunction callFluidObserver(\n observer: FluidObserver,\n event: E\n): void\n\nfunction callFluidObserver(observer: any, event: FluidEvent) {\n if (observer.eventObserved) {\n observer.eventObserved(event)\n } else {\n observer(event)\n }\n}\n\n/** Send an event to all observers. */\nfunction callFluidObservers(\n target: FluidValue,\n event: E\n): void\n\nfunction callFluidObservers(target: object, event: FluidEvent): void\n\nfunction callFluidObservers(target: any, event: FluidEvent) {\n const observers: Set = target[$observers]\n if (observers) {\n observers.forEach(observer => {\n callFluidObserver(observer, event)\n })\n }\n}\n\ntype GetFluidValue = {\n (target: T | FluidValue): Exclude | U\n}\n\ntype GetFluidObservers = {\n (target: FluidValue): ReadonlySet<\n FluidObserver\n > | null\n (target: object): ReadonlySet | null\n}\n\n/** An event sent to `FluidObserver` objects. */\nexport interface FluidEvent {\n type: string\n parent: FluidValue\n}\n\n/**\n * Extend this class for automatic TypeScript support when passing this\n * value to `fluids`-compatible libraries.\n */\nabstract class FluidValue = any> {\n // @ts-expect-error (TS 4.4)\n private [$get]: () => T\n // @ts-expect-error (TS 4.4)\n private [$observers]?: Set>\n\n constructor(get?: () => T) {\n if (!get && !(get = this.get)) {\n throw Error('Unknown getter')\n }\n setFluidGetter(this, get)\n }\n\n /** Get the current value. */\n protected get?(): T\n /** Called after an observer is added. */\n protected observerAdded?(count: number, observer: FluidObserver): void\n /** Called after an observer is removed. */\n protected observerRemoved?(count: number, observer: FluidObserver): void\n}\n\n/** An observer of `FluidValue` objects. */\nexport type FluidObserver =\n | { eventObserved(event: E): void }\n | { (event: E): void }\n\n/** Add the `FluidValue` type to every property. */\nexport type FluidProps = T extends object\n ? { [P in keyof T]: T[P] | FluidValue> }\n : unknown\n\n/** Remove the `FluidValue` type from every property. */\nexport type StaticProps = {\n [P in keyof T]: T[P] extends FluidValue ? U : T[P]\n}\n\n/** Define the getter called by `getFluidValue`. */\nconst setFluidGetter = (target: object, get: () => any) =>\n setHidden(target, $get, get)\n\n/** Observe a `fluids`-compatible object. */\nfunction addFluidObserver(\n target: FluidValue,\n observer: FluidObserver\n): typeof observer\n\nfunction addFluidObserver(\n target: object,\n observer: FluidObserver\n): typeof observer\n\nfunction addFluidObserver(target: any, observer: FluidObserver) {\n if (target[$get]) {\n let observers: Set = target[$observers]\n if (!observers) {\n setHidden(target, $observers, (observers = new Set()))\n }\n if (!observers.has(observer)) {\n observers.add(observer)\n if (target.observerAdded) {\n target.observerAdded(observers.size, observer)\n }\n }\n }\n return observer\n}\n\n/** Stop observing a `fluids`-compatible object. */\nfunction removeFluidObserver(\n target: FluidValue,\n observer: FluidObserver\n): void\n\nfunction removeFluidObserver(\n target: object,\n observer: FluidObserver\n): void\n\nfunction removeFluidObserver(target: any, observer: FluidObserver) {\n const observers: Set = target[$observers]\n if (observers && observers.has(observer)) {\n const count = observers.size - 1\n if (count) {\n observers.delete(observer)\n } else {\n target[$observers] = null\n }\n if (target.observerRemoved) {\n target.observerRemoved(count, observer)\n }\n }\n}\n\nconst setHidden = (target: any, key: any, value: any) =>\n Object.defineProperty(target, key, {\n value,\n writable: true,\n configurable: true,\n })\n","import { InterpolatorConfig } from '@react-spring/types'\n\nimport { getFluidValue } from './fluids'\nimport { createInterpolator } from './createInterpolator'\nimport { colorToRgba } from './colorToRgba'\nimport * as G from './globals'\nimport {\n cssVariableRegex,\n colorRegex,\n unitRegex,\n numberRegex,\n rgbaRegex,\n} from './regexs'\nimport { variableToRgba } from './variableToRgba'\n\n// Covers color names (transparent, blue, etc.)\nlet namedColorRegex: RegExp\n\n// rgba requires that the r,g,b are integers.... so we want to round them,\n// but we *dont* want to round the opacity (4th column).\nconst rgbaRound = (_: any, p1: number, p2: number, p3: number, p4: number) =>\n `rgba(${Math.round(p1)}, ${Math.round(p2)}, ${Math.round(p3)}, ${p4})`\n\n/**\n * Supports string shapes by extracting numbers so new values can be computed,\n * and recombines those values into new strings of the same shape. Supports\n * things like:\n *\n * \"rgba(123, 42, 99, 0.36)\" // colors\n * \"-45deg\" // values with units\n * \"0 2px 2px 0px rgba(0, 0, 0, 0.12)\" // CSS box-shadows\n * \"rotate(0deg) translate(2px, 3px)\" // CSS transforms\n */\nexport const createStringInterpolator = (\n config: InterpolatorConfig\n) => {\n if (!namedColorRegex)\n namedColorRegex = G.colors\n ? // match color names, ignore partial matches\n new RegExp(`(${Object.keys(G.colors).join('|')})(?!\\\\w)`, 'g')\n : // never match\n /^\\b$/\n\n // Convert colors to rgba(...)\n const output = config.output.map(value => {\n return getFluidValue(value)\n .replace(cssVariableRegex, variableToRgba)\n .replace(colorRegex, colorToRgba)\n .replace(namedColorRegex, colorToRgba)\n })\n\n // Convert [\"1px 2px\", \"0px 0px\"] into [[1, 2], [0, 0]]\n const keyframes = output.map(value => value.match(numberRegex)!.map(Number))\n\n // Convert [\"1px 2px\", \"0px 0px\"] into [[1, 0], [2, 0]]\n const outputRanges = keyframes[0].map((_, i) =>\n keyframes.map(values => {\n if (!(i in values)) {\n throw Error('The arity of each \"output\" value must be equal')\n }\n return values[i]\n })\n )\n\n // Create an interpolator for each animated number\n const interpolators = outputRanges.map(output =>\n createInterpolator({ ...config, output })\n )\n\n // Use the first `output` as a template for each call\n return (input: number) => {\n // Convert numbers to units if available (allows for [\"0\", \"100%\"])\n const missingUnit =\n !unitRegex.test(output[0]) &&\n output.find(value => unitRegex.test(value))?.replace(numberRegex, '')\n\n let i = 0\n return output[0]\n .replace(\n numberRegex,\n () => `${interpolators[i++](input)}${missingUnit || ''}`\n )\n .replace(rgbaRegex, rgbaRound)\n }\n}\n","// Problem: https://github.com/animatedjs/animated/pull/102\n// Solution: https://stackoverflow.com/questions/638565/parsing-scientific-notation-sensibly/658662\nexport const numberRegex = /[+\\-]?(?:0|[1-9]\\d*)(?:\\.\\d*)?(?:[eE][+\\-]?\\d+)?/g\n\n// Covers rgb, rgba, hsl, hsla\n// Taken from https://gist.github.com/olmokramer/82ccce673f86db7cda5e\nexport const colorRegex =\n /(#(?:[0-9a-f]{2}){2,4}|(#[0-9a-f]{3})|(rgb|hsl)a?\\((-?\\d+%?[,\\s]+){2,3}\\s*[\\d\\.]+%?\\))/gi\n\n// Gets numbers with units when specified\nexport const unitRegex = new RegExp(`(${numberRegex.source})(%|[a-z]+)`, 'i')\n\n// get values of rgba string\nexport const rgbaRegex =\n /rgba\\(([0-9\\.-]+), ([0-9\\.-]+), ([0-9\\.-]+), ([0-9\\.-]+)\\)/gi\n\n/**\n * Parse special CSS variable format into a CSS token and a fallback.\n *\n * ```\n * `var(--foo, #fff)` => [`--foo`, '#fff']\n * ```\n *\n */\nexport const cssVariableRegex =\n /var\\((--[a-zA-Z0-9-_]+),? ?([a-zA-Z0-9 ()%#.,-]+)?\\)/\n","import { isSSR } from './helpers'\nimport { cssVariableRegex } from './regexs'\n\n/**\n * takes a CSS variable and attempts\n * to turn it into a RGBA value\n *\n * ```\n * 'var(--white)' => 'rgba(255,255,255,1)'\n * ```\n *\n * @param input string\n * @returns string\n */\nexport const variableToRgba = (input: string): string => {\n const [token, fallback] = parseCSSVariable(input)\n\n if (!token || isSSR()) {\n return input\n }\n\n const value = window\n .getComputedStyle(document.documentElement)\n .getPropertyValue(token)\n\n if (value) {\n /**\n * We have a valid variable returned\n * trim and return\n */\n return value.trim()\n } else if (fallback && fallback.startsWith('--')) {\n /**\n * fallback is something like --my-variable\n * so we try get property value\n */\n const value = window\n .getComputedStyle(document.documentElement)\n .getPropertyValue(fallback)\n\n /**\n * if it exists, return else nothing was found so just return the input\n */\n if (value) {\n return value\n } else {\n return input\n }\n } else if (fallback && cssVariableRegex.test(fallback)) {\n /**\n * We have a fallback and it's another CSS variable\n */\n return variableToRgba(fallback)\n } else if (fallback) {\n /**\n * We have a fallback and it's not a CSS variable\n */\n return fallback\n }\n\n /**\n * Nothing worked so just return the input\n * like our other FluidValue replace functions do\n */\n return input\n}\n\nconst parseCSSVariable = (current: string) => {\n const match = cssVariableRegex.exec(current)\n if (!match) return [,]\n\n const [, token, fallback] = match\n return [token, fallback]\n}\n","declare const console: any\n\nexport const prefix = 'react-spring: '\n\nexport const once = any>(fn: TFunc) => {\n const func = fn\n let called = false\n\n if (typeof func != 'function') {\n throw new TypeError(`${prefix}once requires a function parameter`)\n }\n\n return (...args: any) => {\n if (!called) {\n func(...args)\n called = true\n }\n }\n}\n\nconst warnInterpolate = once(console.warn)\nexport function deprecateInterpolate() {\n warnInterpolate(\n `${prefix}The \"interpolate\" function is deprecated in v9 (use \"to\" instead)`\n )\n}\n\nconst warnDirectCall = once(console.warn)\nexport function deprecateDirectCall() {\n warnDirectCall(\n `${prefix}Directly calling start instead of using the api object is deprecated in v9 (use \".start\" instead), this will be removed in later 0.X.0 versions`\n )\n}\n","import * as G from './globals'\nimport { is, isSSR } from './helpers'\nimport { cssVariableRegex } from './regexs'\n\n// Not all strings can be animated (eg: {display: \"none\"})\nexport function isAnimatedString(value: unknown): value is string {\n return (\n is.str(value) &&\n (value[0] == '#' ||\n /\\d/.test(value) ||\n // Do not identify a CSS variable as an AnimatedString if its SSR\n (!isSSR() && cssVariableRegex.test(value)) ||\n value in (G.colors || {}))\n )\n}\n","import { useEffect, useLayoutEffect } from 'react'\n\nimport { isSSR } from '../helpers'\n\n/**\n * Use this to read layout from the DOM and synchronously\n * re-render if the isSSR returns true. Updates scheduled\n * inside `useIsomorphicLayoutEffect` will be flushed\n * synchronously in the browser, before the browser has\n * a chance to paint.\n */\nexport const useIsomorphicLayoutEffect = isSSR() ? useEffect : useLayoutEffect\n","import { useRef } from 'react'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\n\nexport const useIsMounted = () => {\n const isMounted = useRef(false)\n useIsomorphicLayoutEffect(() => {\n isMounted.current = true\n\n return () => {\n isMounted.current = false\n }\n }, [])\n\n return isMounted\n}\n","import { useState } from 'react'\nimport { useIsMounted } from './useIsMounted'\n\n/** Return a function that re-renders this component, if still mounted */\nexport function useForceUpdate() {\n const update = useState()[1]\n const isMounted = useIsMounted()\n return () => {\n if (isMounted.current) {\n update(Math.random())\n }\n }\n}\n","/* eslint-disable react-hooks/exhaustive-deps */\nimport { useEffect, EffectCallback } from 'react'\n\nexport const useOnce = (effect: EffectCallback) => useEffect(effect, emptyDeps)\n\nconst emptyDeps: any[] = []\n","import { useEffect, useRef } from 'react'\n\n/** Use a value from the previous render */\nexport function usePrev(value: T): T | undefined {\n const prevRef = useRef()\n useEffect(() => {\n prevRef.current = value\n })\n return prevRef.current\n}\n","import { useState } from 'react'\n\nimport { assign } from '../globals'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\n\n/**\n * Returns `boolean` or `null`, used to automatically\n * set skipAnimations to the value of the user's\n * `prefers-reduced-motion` query.\n *\n * The return value, post-effect, is the value of their prefered setting\n */\nexport const useReducedMotion = () => {\n const [reducedMotion, setReducedMotion] = useState(null)\n\n useIsomorphicLayoutEffect(() => {\n const mql = window.matchMedia('(prefers-reduced-motion)')\n\n const handleMediaChange = (e: MediaQueryListEvent | MediaQueryList) => {\n setReducedMotion(e.matches)\n\n assign({\n skipAnimation: e.matches,\n })\n }\n\n handleMediaChange(mql)\n\n mql.addEventListener('change', handleMediaChange)\n\n return () => {\n mql.removeEventListener('change', handleMediaChange)\n }\n }, [])\n\n return reducedMotion\n}\n","import { defineHidden } from '@react-spring/shared'\nimport { AnimatedValue } from './AnimatedValue'\n\nconst $node: any = Symbol.for('Animated:node')\n\nexport const isAnimated = (value: any): value is Animated =>\n !!value && value[$node] === value\n\n/** Get the owner's `Animated` node. */\nexport const getAnimated = (owner: any): Animated | undefined =>\n owner && owner[$node]\n\n/** Set the owner's `Animated` node. */\nexport const setAnimated = (owner: any, node: Animated) =>\n defineHidden(owner, $node, node)\n\n/** Get every `AnimatedValue` in the owner's `Animated` node. */\nexport const getPayload = (owner: any): AnimatedValue[] | undefined =>\n owner && owner[$node] && owner[$node].getPayload()\n\nexport abstract class Animated