Mission Control Dashboard - Initial implementation
This commit is contained in:
10
node_modules/framer-motion/dist/es/utils/distance.mjs
generated
vendored
Normal file
10
node_modules/framer-motion/dist/es/utils/distance.mjs
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
const distance = (a, b) => Math.abs(a - b);
|
||||
function distance2D(a, b) {
|
||||
// Multi-dimensional
|
||||
const xDelta = distance(a.x, b.x);
|
||||
const yDelta = distance(a.y, b.y);
|
||||
return Math.sqrt(xDelta ** 2 + yDelta ** 2);
|
||||
}
|
||||
|
||||
export { distance, distance2D };
|
||||
//# sourceMappingURL=distance.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/distance.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/distance.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"distance.mjs","sources":["../../../src/utils/distance.ts"],"sourcesContent":["import { Point } from \"motion-utils\"\n\nexport const distance = (a: number, b: number) => Math.abs(a - b)\n\nexport function distance2D(a: Point, b: Point): number {\n // Multi-dimensional\n const xDelta = distance(a.x, b.x)\n const yDelta = distance(a.y, b.y)\n return Math.sqrt(xDelta ** 2 + yDelta ** 2)\n}\n"],"names":[],"mappings":"AAEO,MAAM,QAAQ,GAAG,CAAC,CAAS,EAAE,CAAS,KAAK,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC;AAE1D,SAAU,UAAU,CAAC,CAAQ,EAAE,CAAQ,EAAA;;AAEzC,IAAA,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;AACjC,IAAA,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;AACjC,IAAA,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,MAAM,IAAI,CAAC,CAAC;AAC/C;;;;"}
|
||||
7
node_modules/framer-motion/dist/es/utils/get-context-window.mjs
generated
vendored
Normal file
7
node_modules/framer-motion/dist/es/utils/get-context-window.mjs
generated
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
// Fixes https://github.com/motiondivision/motion/issues/2270
|
||||
const getContextWindow = ({ current }) => {
|
||||
return current ? current.ownerDocument.defaultView : null;
|
||||
};
|
||||
|
||||
export { getContextWindow };
|
||||
//# sourceMappingURL=get-context-window.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/get-context-window.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/get-context-window.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"get-context-window.mjs","sources":["../../../src/utils/get-context-window.ts"],"sourcesContent":["import type { VisualElement } from \"motion-dom\"\n\n// Fixes https://github.com/motiondivision/motion/issues/2270\nexport const getContextWindow = ({ current }: VisualElement<Element>) => {\n return current ? current.ownerDocument.defaultView : null\n}\n"],"names":[],"mappings":"AAEA;MACa,gBAAgB,GAAG,CAAC,EAAE,OAAO,EAA0B,KAAI;AACpE,IAAA,OAAO,OAAO,GAAG,OAAO,CAAC,aAAa,CAAC,WAAW,GAAG,IAAI;AAC7D;;;;"}
|
||||
4
node_modules/framer-motion/dist/es/utils/is-browser.mjs
generated
vendored
Normal file
4
node_modules/framer-motion/dist/es/utils/is-browser.mjs
generated
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
const isBrowser = typeof window !== "undefined";
|
||||
|
||||
export { isBrowser };
|
||||
//# sourceMappingURL=is-browser.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/is-browser.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/is-browser.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-browser.mjs","sources":["../../../src/utils/is-browser.ts"],"sourcesContent":["export const isBrowser = typeof window !== \"undefined\"\n"],"names":[],"mappings":"MAAa,SAAS,GAAG,OAAO,MAAM,KAAK;;;;"}
|
||||
8
node_modules/framer-motion/dist/es/utils/is-ref-object.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/utils/is-ref-object.mjs
generated
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
function isRefObject(ref) {
|
||||
return (ref &&
|
||||
typeof ref === "object" &&
|
||||
Object.prototype.hasOwnProperty.call(ref, "current"));
|
||||
}
|
||||
|
||||
export { isRefObject };
|
||||
//# sourceMappingURL=is-ref-object.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/is-ref-object.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/is-ref-object.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"is-ref-object.mjs","sources":["../../../src/utils/is-ref-object.ts"],"sourcesContent":["import { MutableRefObject } from \"./safe-react-types\"\n\nexport function isRefObject<E = any>(ref: any): ref is MutableRefObject<E> {\n return (\n ref &&\n typeof ref === \"object\" &&\n Object.prototype.hasOwnProperty.call(ref, \"current\")\n )\n}\n"],"names":[],"mappings":"AAEM,SAAU,WAAW,CAAU,GAAQ,EAAA;AACzC,IAAA,QACI,GAAG;QACH,OAAO,GAAG,KAAK,QAAQ;AACvB,QAAA,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,SAAS,CAAC;AAE5D;;;;"}
|
||||
21
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs
generated
vendored
Normal file
21
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs
generated
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
"use client";
|
||||
import { useContext } from 'react';
|
||||
import { MotionConfigContext } from '../../context/MotionConfigContext.mjs';
|
||||
import { useReducedMotion } from './use-reduced-motion.mjs';
|
||||
|
||||
function useReducedMotionConfig() {
|
||||
const reducedMotionPreference = useReducedMotion();
|
||||
const { reducedMotion } = useContext(MotionConfigContext);
|
||||
if (reducedMotion === "never") {
|
||||
return false;
|
||||
}
|
||||
else if (reducedMotion === "always") {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
return reducedMotionPreference;
|
||||
}
|
||||
}
|
||||
|
||||
export { useReducedMotionConfig };
|
||||
//# sourceMappingURL=use-reduced-motion-config.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion-config.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-reduced-motion-config.mjs","sources":["../../../../src/utils/reduced-motion/use-reduced-motion-config.ts"],"sourcesContent":["\"use client\"\n\nimport { useContext } from \"react\"\nimport { MotionConfigContext } from \"../../context/MotionConfigContext\"\nimport { useReducedMotion } from \"./use-reduced-motion\"\n\nexport function useReducedMotionConfig() {\n const reducedMotionPreference = useReducedMotion()\n const { reducedMotion } = useContext(MotionConfigContext)\n\n if (reducedMotion === \"never\") {\n return false\n } else if (reducedMotion === \"always\") {\n return true\n } else {\n return reducedMotionPreference\n }\n}\n"],"names":[],"mappings":";;;;;;AAOI;;AAGA;AACI;;AACG;AACH;;;AAEA;;AAER;;"}
|
||||
48
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.mjs
generated
vendored
Normal file
48
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.mjs
generated
vendored
Normal file
@@ -0,0 +1,48 @@
|
||||
"use client";
|
||||
import { hasReducedMotionListener, initPrefersReducedMotion, prefersReducedMotion } from 'motion-dom';
|
||||
import { warnOnce } from 'motion-utils';
|
||||
import { useState } from 'react';
|
||||
|
||||
/**
|
||||
* A hook that returns `true` if we should be using reduced motion based on the current device's Reduced Motion setting.
|
||||
*
|
||||
* This can be used to implement changes to your UI based on Reduced Motion. For instance, replacing motion-sickness inducing
|
||||
* `x`/`y` animations with `opacity`, disabling the autoplay of background videos, or turning off parallax motion.
|
||||
*
|
||||
* It will actively respond to changes and re-render your components with the latest setting.
|
||||
*
|
||||
* ```jsx
|
||||
* export function Sidebar({ isOpen }) {
|
||||
* const shouldReduceMotion = useReducedMotion()
|
||||
* const closedX = shouldReduceMotion ? 0 : "-100%"
|
||||
*
|
||||
* return (
|
||||
* <motion.div animate={{
|
||||
* opacity: isOpen ? 1 : 0,
|
||||
* x: isOpen ? 0 : closedX
|
||||
* }} />
|
||||
* )
|
||||
* }
|
||||
* ```
|
||||
*
|
||||
* @return boolean
|
||||
*
|
||||
* @public
|
||||
*/
|
||||
function useReducedMotion() {
|
||||
/**
|
||||
* Lazy initialisation of prefersReducedMotion
|
||||
*/
|
||||
!hasReducedMotionListener.current && initPrefersReducedMotion();
|
||||
const [shouldReduceMotion] = useState(prefersReducedMotion.current);
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
warnOnce(shouldReduceMotion !== true, "You have Reduced Motion enabled on your device. Animations may not appear as expected.", "reduced-motion-disabled");
|
||||
}
|
||||
/**
|
||||
* TODO See if people miss automatically updating shouldReduceMotion setting
|
||||
*/
|
||||
return shouldReduceMotion;
|
||||
}
|
||||
|
||||
export { useReducedMotion };
|
||||
//# sourceMappingURL=use-reduced-motion.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-reduced-motion.mjs","sources":["../../../../src/utils/reduced-motion/use-reduced-motion.ts"],"sourcesContent":["\"use client\"\n\nimport {\n hasReducedMotionListener,\n initPrefersReducedMotion,\n prefersReducedMotion,\n} from \"motion-dom\"\nimport { warnOnce } from \"motion-utils\"\nimport { useState } from \"react\"\n\n/**\n * A hook that returns `true` if we should be using reduced motion based on the current device's Reduced Motion setting.\n *\n * This can be used to implement changes to your UI based on Reduced Motion. For instance, replacing motion-sickness inducing\n * `x`/`y` animations with `opacity`, disabling the autoplay of background videos, or turning off parallax motion.\n *\n * It will actively respond to changes and re-render your components with the latest setting.\n *\n * ```jsx\n * export function Sidebar({ isOpen }) {\n * const shouldReduceMotion = useReducedMotion()\n * const closedX = shouldReduceMotion ? 0 : \"-100%\"\n *\n * return (\n * <motion.div animate={{\n * opacity: isOpen ? 1 : 0,\n * x: isOpen ? 0 : closedX\n * }} />\n * )\n * }\n * ```\n *\n * @return boolean\n *\n * @public\n */\nexport function useReducedMotion() {\n /**\n * Lazy initialisation of prefersReducedMotion\n */\n !hasReducedMotionListener.current && initPrefersReducedMotion()\n\n const [shouldReduceMotion] = useState(prefersReducedMotion.current)\n\n if (process.env.NODE_ENV !== \"production\") {\n warnOnce(\n shouldReduceMotion !== true,\n \"You have Reduced Motion enabled on your device. Animations may not appear as expected.\",\n \"reduced-motion-disabled\"\n )\n }\n\n /**\n * TODO See if people miss automatically updating shouldReduceMotion setting\n */\n\n return shouldReduceMotion\n}\n"],"names":[],"mappings":";;;;;AAUA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;;AAEC;;AAEG;AACH;;;;;AAYA;;AAEG;AAEH;AACJ;;"}
|
||||
72
node_modules/framer-motion/dist/es/utils/transform-rotated-parent.mjs
generated
vendored
Normal file
72
node_modules/framer-motion/dist/es/utils/transform-rotated-parent.mjs
generated
vendored
Normal file
@@ -0,0 +1,72 @@
|
||||
/**
|
||||
* Creates a `transformPagePoint` function that corrects pointer coordinates
|
||||
* for a parent container with CSS transforms (rotation, scale, skew).
|
||||
*
|
||||
* When dragging elements inside a transformed parent, pointer coordinates
|
||||
* need to be transformed through the inverse of the parent's transform
|
||||
* so the drag offset is in local space.
|
||||
*
|
||||
* Works with both static and continuously animating transforms.
|
||||
*
|
||||
* @example
|
||||
* ```jsx
|
||||
* function App() {
|
||||
* const ref = useRef(null)
|
||||
*
|
||||
* return (
|
||||
* <motion.div ref={ref} style={{ rotate: 90 }}>
|
||||
* <MotionConfig transformPagePoint={correctParentTransform(ref)}>
|
||||
* <motion.div drag />
|
||||
* </MotionConfig>
|
||||
* </motion.div>
|
||||
* )
|
||||
* }
|
||||
* ```
|
||||
*
|
||||
* @param parentRef - A React ref to the transformed parent element
|
||||
* @returns A transformPagePoint function for use with MotionConfig
|
||||
*
|
||||
* @public
|
||||
*/
|
||||
function correctParentTransform(parentRef) {
|
||||
return (point) => {
|
||||
const parent = parentRef.current;
|
||||
if (!parent)
|
||||
return point;
|
||||
const inv = getInverseMatrix(parent);
|
||||
if (!inv)
|
||||
return point;
|
||||
// Get center of rotation in page space
|
||||
const rect = parent.getBoundingClientRect();
|
||||
const cx = rect.left + window.scrollX + rect.width / 2;
|
||||
const cy = rect.top + window.scrollY + rect.height / 2;
|
||||
// Transform (point - center) through inverse, then add center back
|
||||
const dx = point.x - cx;
|
||||
const dy = point.y - cy;
|
||||
return {
|
||||
x: cx + inv.a * dx + inv.c * dy,
|
||||
y: cy + inv.b * dx + inv.d * dy,
|
||||
};
|
||||
};
|
||||
}
|
||||
function getInverseMatrix(element) {
|
||||
const { transform } = getComputedStyle(element);
|
||||
if (!transform || transform === "none")
|
||||
return null;
|
||||
const match = transform.match(/^matrix3d\((.*)\)$/u) ||
|
||||
transform.match(/^matrix\((.*)\)$/u);
|
||||
if (!match)
|
||||
return null;
|
||||
const v = match[1].split(",").map(Number);
|
||||
const is3d = transform.startsWith("matrix3d");
|
||||
const a = v[0], b = v[1];
|
||||
const c = is3d ? v[4] : v[2];
|
||||
const d = is3d ? v[5] : v[3];
|
||||
const det = a * d - b * c;
|
||||
if (Math.abs(det) < 1e-10)
|
||||
return null;
|
||||
return { a: d / det, b: -b / det, c: -c / det, d: a / det };
|
||||
}
|
||||
|
||||
export { correctParentTransform };
|
||||
//# sourceMappingURL=transform-rotated-parent.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/transform-rotated-parent.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/transform-rotated-parent.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"transform-rotated-parent.mjs","sources":["../../../src/utils/transform-rotated-parent.ts"],"sourcesContent":["import type { Point, TransformPoint } from \"motion-utils\"\nimport type { RefObject } from \"react\"\n\n/**\n * Creates a `transformPagePoint` function that corrects pointer coordinates\n * for a parent container with CSS transforms (rotation, scale, skew).\n *\n * When dragging elements inside a transformed parent, pointer coordinates\n * need to be transformed through the inverse of the parent's transform\n * so the drag offset is in local space.\n *\n * Works with both static and continuously animating transforms.\n *\n * @example\n * ```jsx\n * function App() {\n * const ref = useRef(null)\n *\n * return (\n * <motion.div ref={ref} style={{ rotate: 90 }}>\n * <MotionConfig transformPagePoint={correctParentTransform(ref)}>\n * <motion.div drag />\n * </MotionConfig>\n * </motion.div>\n * )\n * }\n * ```\n *\n * @param parentRef - A React ref to the transformed parent element\n * @returns A transformPagePoint function for use with MotionConfig\n *\n * @public\n */\nexport function correctParentTransform(\n parentRef: RefObject<HTMLElement | null>\n): TransformPoint {\n return (point: Point): Point => {\n const parent = parentRef.current\n if (!parent) return point\n\n const inv = getInverseMatrix(parent)\n if (!inv) return point\n\n // Get center of rotation in page space\n const rect = parent.getBoundingClientRect()\n const cx = rect.left + window.scrollX + rect.width / 2\n const cy = rect.top + window.scrollY + rect.height / 2\n\n // Transform (point - center) through inverse, then add center back\n const dx = point.x - cx\n const dy = point.y - cy\n return {\n x: cx + inv.a * dx + inv.c * dy,\n y: cy + inv.b * dx + inv.d * dy,\n }\n }\n}\n\ninterface InverseMatrix {\n a: number\n b: number\n c: number\n d: number\n}\n\nfunction getInverseMatrix(element: HTMLElement): InverseMatrix | null {\n const { transform } = getComputedStyle(element)\n if (!transform || transform === \"none\") return null\n\n const match =\n transform.match(/^matrix3d\\((.*)\\)$/u) ||\n transform.match(/^matrix\\((.*)\\)$/u)\n if (!match) return null\n\n const v = match[1].split(\",\").map(Number)\n const is3d = transform.startsWith(\"matrix3d\")\n const a = v[0],\n b = v[1]\n const c = is3d ? v[4] : v[2]\n const d = is3d ? v[5] : v[3]\n\n const det = a * d - b * c\n if (Math.abs(det) < 1e-10) return null\n\n return { a: d / det, b: -b / det, c: -c / det, d: a / det }\n}\n"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BG;AACG,SAAU,sBAAsB,CAClC,SAAwC,EAAA;IAExC,OAAO,CAAC,KAAY,KAAW;AAC3B,QAAA,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO;AAChC,QAAA,IAAI,CAAC,MAAM;AAAE,YAAA,OAAO,KAAK;AAEzB,QAAA,MAAM,GAAG,GAAG,gBAAgB,CAAC,MAAM,CAAC;AACpC,QAAA,IAAI,CAAC,GAAG;AAAE,YAAA,OAAO,KAAK;;AAGtB,QAAA,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE;AAC3C,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;AACtD,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,GAAG,MAAM,CAAC,OAAO,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;;AAGtD,QAAA,MAAM,EAAE,GAAG,KAAK,CAAC,CAAC,GAAG,EAAE;AACvB,QAAA,MAAM,EAAE,GAAG,KAAK,CAAC,CAAC,GAAG,EAAE;QACvB,OAAO;AACH,YAAA,CAAC,EAAE,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE;AAC/B,YAAA,CAAC,EAAE,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE;SAClC;AACL,IAAA,CAAC;AACL;AASA,SAAS,gBAAgB,CAAC,OAAoB,EAAA;IAC1C,MAAM,EAAE,SAAS,EAAE,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAC/C,IAAA,IAAI,CAAC,SAAS,IAAI,SAAS,KAAK,MAAM;AAAE,QAAA,OAAO,IAAI;AAEnD,IAAA,MAAM,KAAK,GACP,SAAS,CAAC,KAAK,CAAC,qBAAqB,CAAC;AACtC,QAAA,SAAS,CAAC,KAAK,CAAC,mBAAmB,CAAC;AACxC,IAAA,IAAI,CAAC,KAAK;AAAE,QAAA,OAAO,IAAI;AAEvB,IAAA,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC;IACzC,MAAM,IAAI,GAAG,SAAS,CAAC,UAAU,CAAC,UAAU,CAAC;AAC7C,IAAA,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EACV,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;AACZ,IAAA,MAAM,CAAC,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;AAC5B,IAAA,MAAM,CAAC,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;IAE5B,MAAM,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC;AACzB,IAAA,IAAI,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK;AAAE,QAAA,OAAO,IAAI;IAEtC,OAAO,EAAE,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE;AAC/D;;;;"}
|
||||
63
node_modules/framer-motion/dist/es/utils/transform-viewbox-point.mjs
generated
vendored
Normal file
63
node_modules/framer-motion/dist/es/utils/transform-viewbox-point.mjs
generated
vendored
Normal file
@@ -0,0 +1,63 @@
|
||||
/**
|
||||
* Creates a `transformPagePoint` function that accounts for SVG viewBox scaling.
|
||||
*
|
||||
* When dragging SVG elements inside an SVG with a viewBox that differs from
|
||||
* the rendered dimensions (e.g., `viewBox="0 0 100 100"` but rendered at 500x500 pixels),
|
||||
* pointer coordinates need to be transformed to match the SVG's coordinate system.
|
||||
*
|
||||
* @example
|
||||
* ```jsx
|
||||
* function App() {
|
||||
* const svgRef = useRef<SVGSVGElement>(null)
|
||||
*
|
||||
* return (
|
||||
* <MotionConfig transformPagePoint={transformViewBoxPoint(svgRef)}>
|
||||
* <svg ref={svgRef} viewBox="0 0 100 100" width={500} height={500}>
|
||||
* <motion.rect drag width={10} height={10} />
|
||||
* </svg>
|
||||
* </MotionConfig>
|
||||
* )
|
||||
* }
|
||||
* ```
|
||||
*
|
||||
* @param svgRef - A React ref to the SVG element
|
||||
* @returns A transformPagePoint function for use with MotionConfig
|
||||
*
|
||||
* @public
|
||||
*/
|
||||
function transformViewBoxPoint(svgRef) {
|
||||
return (point) => {
|
||||
const svg = svgRef.current;
|
||||
if (!svg) {
|
||||
return point;
|
||||
}
|
||||
// Get the viewBox attribute
|
||||
const viewBox = svg.viewBox?.baseVal;
|
||||
if (!viewBox || (viewBox.width === 0 && viewBox.height === 0)) {
|
||||
// No viewBox or empty viewBox - no transformation needed
|
||||
return point;
|
||||
}
|
||||
// Get the rendered dimensions of the SVG
|
||||
const bbox = svg.getBoundingClientRect();
|
||||
if (bbox.width === 0 || bbox.height === 0) {
|
||||
return point;
|
||||
}
|
||||
// Calculate scale factors
|
||||
const scaleX = viewBox.width / bbox.width;
|
||||
const scaleY = viewBox.height / bbox.height;
|
||||
// Get the SVG's position on the page
|
||||
const svgX = bbox.left + window.scrollX;
|
||||
const svgY = bbox.top + window.scrollY;
|
||||
// Transform the point:
|
||||
// 1. Calculate position relative to SVG
|
||||
// 2. Scale by viewBox/viewport ratio
|
||||
// 3. Add back the SVG position (but in SVG coordinates)
|
||||
return {
|
||||
x: (point.x - svgX) * scaleX + svgX,
|
||||
y: (point.y - svgY) * scaleY + svgY,
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
export { transformViewBoxPoint };
|
||||
//# sourceMappingURL=transform-viewbox-point.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/transform-viewbox-point.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/transform-viewbox-point.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"transform-viewbox-point.mjs","sources":["../../../src/utils/transform-viewbox-point.ts"],"sourcesContent":["import type { Point, TransformPoint } from \"motion-utils\"\nimport type { RefObject } from \"react\"\n\n/**\n * Creates a `transformPagePoint` function that accounts for SVG viewBox scaling.\n *\n * When dragging SVG elements inside an SVG with a viewBox that differs from\n * the rendered dimensions (e.g., `viewBox=\"0 0 100 100\"` but rendered at 500x500 pixels),\n * pointer coordinates need to be transformed to match the SVG's coordinate system.\n *\n * @example\n * ```jsx\n * function App() {\n * const svgRef = useRef<SVGSVGElement>(null)\n *\n * return (\n * <MotionConfig transformPagePoint={transformViewBoxPoint(svgRef)}>\n * <svg ref={svgRef} viewBox=\"0 0 100 100\" width={500} height={500}>\n * <motion.rect drag width={10} height={10} />\n * </svg>\n * </MotionConfig>\n * )\n * }\n * ```\n *\n * @param svgRef - A React ref to the SVG element\n * @returns A transformPagePoint function for use with MotionConfig\n *\n * @public\n */\nexport function transformViewBoxPoint(\n svgRef: RefObject<SVGSVGElement | null>\n): TransformPoint {\n return (point: Point): Point => {\n const svg = svgRef.current\n if (!svg) {\n return point\n }\n\n // Get the viewBox attribute\n const viewBox = svg.viewBox?.baseVal\n if (!viewBox || (viewBox.width === 0 && viewBox.height === 0)) {\n // No viewBox or empty viewBox - no transformation needed\n return point\n }\n\n // Get the rendered dimensions of the SVG\n const bbox = svg.getBoundingClientRect()\n if (bbox.width === 0 || bbox.height === 0) {\n return point\n }\n\n // Calculate scale factors\n const scaleX = viewBox.width / bbox.width\n const scaleY = viewBox.height / bbox.height\n\n // Get the SVG's position on the page\n const svgX = bbox.left + window.scrollX\n const svgY = bbox.top + window.scrollY\n\n // Transform the point:\n // 1. Calculate position relative to SVG\n // 2. Scale by viewBox/viewport ratio\n // 3. Add back the SVG position (but in SVG coordinates)\n return {\n x: (point.x - svgX) * scaleX + svgX,\n y: (point.y - svgY) * scaleY + svgY,\n }\n }\n}\n"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BG;AACG,SAAU,qBAAqB,CACjC,MAAuC,EAAA;IAEvC,OAAO,CAAC,KAAY,KAAW;AAC3B,QAAA,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO;QAC1B,IAAI,CAAC,GAAG,EAAE;AACN,YAAA,OAAO,KAAK;QAChB;;AAGA,QAAA,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,OAAO;AACpC,QAAA,IAAI,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,KAAK,CAAC,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,CAAC,EAAE;;AAE3D,YAAA,OAAO,KAAK;QAChB;;AAGA,QAAA,MAAM,IAAI,GAAG,GAAG,CAAC,qBAAqB,EAAE;AACxC,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,CAAC,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;AACvC,YAAA,OAAO,KAAK;QAChB;;QAGA,MAAM,MAAM,GAAG,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK;QACzC,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM;;QAG3C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,OAAO;QACvC,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,GAAG,MAAM,CAAC,OAAO;;;;;QAMtC,OAAO;YACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,IAAI,MAAM,GAAG,IAAI;YACnC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,IAAI,MAAM,GAAG,IAAI;SACtC;AACL,IAAA,CAAC;AACL;;;;"}
|
||||
23
node_modules/framer-motion/dist/es/utils/use-animation-frame.mjs
generated
vendored
Normal file
23
node_modules/framer-motion/dist/es/utils/use-animation-frame.mjs
generated
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
"use client";
|
||||
import { frame, cancelFrame } from 'motion-dom';
|
||||
import { useRef, useContext, useEffect } from 'react';
|
||||
import { MotionConfigContext } from '../context/MotionConfigContext.mjs';
|
||||
|
||||
function useAnimationFrame(callback) {
|
||||
const initialTimestamp = useRef(0);
|
||||
const { isStatic } = useContext(MotionConfigContext);
|
||||
useEffect(() => {
|
||||
if (isStatic)
|
||||
return;
|
||||
const provideTimeSinceStart = ({ timestamp, delta }) => {
|
||||
if (!initialTimestamp.current)
|
||||
initialTimestamp.current = timestamp;
|
||||
callback(timestamp - initialTimestamp.current, delta);
|
||||
};
|
||||
frame.update(provideTimeSinceStart, true);
|
||||
return () => cancelFrame(provideTimeSinceStart);
|
||||
}, [callback]);
|
||||
}
|
||||
|
||||
export { useAnimationFrame };
|
||||
//# sourceMappingURL=use-animation-frame.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-animation-frame.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-animation-frame.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-animation-frame.mjs","sources":["../../../src/utils/use-animation-frame.ts"],"sourcesContent":["\"use client\"\n\nimport { cancelFrame, frame, FrameData } from \"motion-dom\"\nimport { useContext, useEffect, useRef } from \"react\"\nimport { MotionConfigContext } from \"../context/MotionConfigContext\"\n\nexport type FrameCallback = (timestamp: number, delta: number) => void\n\nexport function useAnimationFrame(callback: FrameCallback) {\n const initialTimestamp = useRef(0)\n const { isStatic } = useContext(MotionConfigContext)\n\n useEffect(() => {\n if (isStatic) return\n\n const provideTimeSinceStart = ({ timestamp, delta }: FrameData) => {\n if (!initialTimestamp.current) initialTimestamp.current = timestamp\n\n callback(timestamp - initialTimestamp.current, delta)\n }\n\n frame.update(provideTimeSinceStart, true)\n return () => cancelFrame(provideTimeSinceStart)\n }, [callback])\n}\n"],"names":[],"mappings":";;;;;AAQM;AACF;;;AAII;;;;AAGmC;;AAGnC;AAEA;AACA;AACJ;AACJ;;"}
|
||||
61
node_modules/framer-motion/dist/es/utils/use-composed-ref.mjs
generated
vendored
Normal file
61
node_modules/framer-motion/dist/es/utils/use-composed-ref.mjs
generated
vendored
Normal file
@@ -0,0 +1,61 @@
|
||||
import * as React from 'react';
|
||||
|
||||
/**
|
||||
* Taken from https://github.com/radix-ui/primitives/blob/main/packages/react/compose-refs/src/compose-refs.tsx
|
||||
*/
|
||||
/**
|
||||
* Set a given ref to a given value
|
||||
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
||||
*/
|
||||
function setRef(ref, value) {
|
||||
if (typeof ref === "function") {
|
||||
return ref(value);
|
||||
}
|
||||
else if (ref !== null && ref !== undefined) {
|
||||
ref.current = value;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* A utility to compose multiple refs together
|
||||
* Accepts callback refs and RefObject(s)
|
||||
*/
|
||||
function composeRefs(...refs) {
|
||||
return (node) => {
|
||||
let hasCleanup = false;
|
||||
const cleanups = refs.map((ref) => {
|
||||
const cleanup = setRef(ref, node);
|
||||
if (!hasCleanup && typeof cleanup === "function") {
|
||||
hasCleanup = true;
|
||||
}
|
||||
return cleanup;
|
||||
});
|
||||
// React <19 will log an error to the console if a callback ref returns a
|
||||
// value. We don't use ref cleanups internally so this will only happen if a
|
||||
// user's ref callback returns a value, which we only expect if they are
|
||||
// using the cleanup functionality added in React 19.
|
||||
if (hasCleanup) {
|
||||
return () => {
|
||||
for (let i = 0; i < cleanups.length; i++) {
|
||||
const cleanup = cleanups[i];
|
||||
if (typeof cleanup === "function") {
|
||||
cleanup();
|
||||
}
|
||||
else {
|
||||
setRef(refs[i], null);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
}
|
||||
/**
|
||||
* A custom hook that composes multiple refs
|
||||
* Accepts callback refs and RefObject(s)
|
||||
*/
|
||||
function useComposedRefs(...refs) {
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
return React.useCallback(composeRefs(...refs), refs);
|
||||
}
|
||||
|
||||
export { useComposedRefs };
|
||||
//# sourceMappingURL=use-composed-ref.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-composed-ref.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-composed-ref.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-composed-ref.mjs","sources":["../../../src/utils/use-composed-ref.ts"],"sourcesContent":["/**\n * Taken from https://github.com/radix-ui/primitives/blob/main/packages/react/compose-refs/src/compose-refs.tsx\n */\nimport * as React from \"react\"\n\ntype PossibleRef<T> = React.Ref<T> | undefined\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T): void | (() => void) {\n if (typeof ref === \"function\") {\n return ref(value)\n } else if (ref !== null && ref !== undefined) {\n ;(ref as React.MutableRefObject<T>).current = value\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n return (node) => {\n let hasCleanup = false\n const cleanups = refs.map((ref) => {\n const cleanup = setRef(ref, node)\n if (!hasCleanup && typeof cleanup === \"function\") {\n hasCleanup = true\n }\n return cleanup\n })\n // React <19 will log an error to the console if a callback ref returns a\n // value. We don't use ref cleanups internally so this will only happen if a\n // user's ref callback returns a value, which we only expect if they are\n // using the cleanup functionality added in React 19.\n if (hasCleanup) {\n return () => {\n for (let i = 0; i < cleanups.length; i++) {\n const cleanup = cleanups[i]\n if (typeof cleanup === \"function\") {\n cleanup()\n } else {\n setRef(refs[i], null)\n }\n }\n }\n }\n }\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs)\n}\n\nexport { useComposedRefs }\n"],"names":[],"mappings":";;AAAA;;AAEG;AAKH;;;AAGG;AACH,SAAS,MAAM,CAAI,GAAmB,EAAE,KAAQ,EAAA;AAC5C,IAAA,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;AAC3B,QAAA,OAAO,GAAG,CAAC,KAAK,CAAC;IACrB;SAAO,IAAI,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,EAAE;AACxC,QAAA,GAAiC,CAAC,OAAO,GAAG,KAAK;IACvD;AACJ;AAEA;;;AAGG;AACH,SAAS,WAAW,CAAI,GAAG,IAAsB,EAAA;IAC7C,OAAO,CAAC,IAAI,KAAI;QACZ,IAAI,UAAU,GAAG,KAAK;QACtB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;YAC9B,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC;YACjC,IAAI,CAAC,UAAU,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE;gBAC9C,UAAU,GAAG,IAAI;YACrB;AACA,YAAA,OAAO,OAAO;AAClB,QAAA,CAAC,CAAC;;;;;QAKF,IAAI,UAAU,EAAE;AACZ,YAAA,OAAO,MAAK;AACR,gBAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACtC,oBAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC;AAC3B,oBAAA,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE;AAC/B,wBAAA,OAAO,EAAE;oBACb;yBAAO;wBACH,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC;oBACzB;gBACJ;AACJ,YAAA,CAAC;QACL;AACJ,IAAA,CAAC;AACL;AAEA;;;AAGG;AACH,SAAS,eAAe,CAAI,GAAG,IAAsB,EAAA;;AAEjD,IAAA,OAAO,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,EAAE,IAAI,CAAC;AACxD;;;;"}
|
||||
20
node_modules/framer-motion/dist/es/utils/use-constant.mjs
generated
vendored
Normal file
20
node_modules/framer-motion/dist/es/utils/use-constant.mjs
generated
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
"use client";
|
||||
import { useRef } from 'react';
|
||||
|
||||
/**
|
||||
* Creates a constant value over the lifecycle of a component.
|
||||
*
|
||||
* Even if `useMemo` is provided an empty array as its final argument, it doesn't offer
|
||||
* a guarantee that it won't re-run for performance reasons later on. By using `useConstant`
|
||||
* you can ensure that initialisers don't execute twice or more.
|
||||
*/
|
||||
function useConstant(init) {
|
||||
const ref = useRef(null);
|
||||
if (ref.current === null) {
|
||||
ref.current = init();
|
||||
}
|
||||
return ref.current;
|
||||
}
|
||||
|
||||
export { useConstant };
|
||||
//# sourceMappingURL=use-constant.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-constant.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-constant.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-constant.mjs","sources":["../../../src/utils/use-constant.ts"],"sourcesContent":["\"use client\"\n\nimport { useRef } from \"react\"\n\ntype Init<T> = () => T\n\n/**\n * Creates a constant value over the lifecycle of a component.\n *\n * Even if `useMemo` is provided an empty array as its final argument, it doesn't offer\n * a guarantee that it won't re-run for performance reasons later on. By using `useConstant`\n * you can ensure that initialisers don't execute twice or more.\n */\nexport function useConstant<T>(init: Init<T>) {\n const ref = useRef<T | null>(null)\n\n if (ref.current === null) {\n ref.current = init()\n }\n\n return ref.current\n}\n"],"names":[],"mappings":";;;AAMA;;;;;;AAMG;AACG;AACF;AAEA;AACI;;;AAIR;;"}
|
||||
49
node_modules/framer-motion/dist/es/utils/use-cycle.mjs
generated
vendored
Normal file
49
node_modules/framer-motion/dist/es/utils/use-cycle.mjs
generated
vendored
Normal file
@@ -0,0 +1,49 @@
|
||||
"use client";
|
||||
import { wrap } from 'motion-utils';
|
||||
import { useRef, useState, useCallback } from 'react';
|
||||
|
||||
/**
|
||||
* Cycles through a series of visual properties. Can be used to toggle between or cycle through animations. It works similar to `useState` in React. It is provided an initial array of possible states, and returns an array of two arguments.
|
||||
*
|
||||
* An index value can be passed to the returned `cycle` function to cycle to a specific index.
|
||||
*
|
||||
* ```jsx
|
||||
* import * as React from "react"
|
||||
* import { motion, useCycle } from "framer-motion"
|
||||
*
|
||||
* export const MyComponent = () => {
|
||||
* const [x, cycleX] = useCycle(0, 50, 100)
|
||||
*
|
||||
* return (
|
||||
* <motion.div
|
||||
* animate={{ x: x }}
|
||||
* onTap={() => cycleX()}
|
||||
* />
|
||||
* )
|
||||
* }
|
||||
* ```
|
||||
*
|
||||
* @param items - items to cycle through
|
||||
* @returns [currentState, cycleState]
|
||||
*
|
||||
* @public
|
||||
*/
|
||||
function useCycle(...items) {
|
||||
const index = useRef(0);
|
||||
const [item, setItem] = useState(items[index.current]);
|
||||
const runCycle = useCallback((next) => {
|
||||
index.current =
|
||||
typeof next !== "number"
|
||||
? wrap(0, items.length, index.current + 1)
|
||||
: next;
|
||||
setItem(items[index.current]);
|
||||
},
|
||||
// The array will change on each call, but by putting items.length at
|
||||
// the front of this array, we guarantee the dependency comparison will match up
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[items.length, ...items]);
|
||||
return [item, runCycle];
|
||||
}
|
||||
|
||||
export { useCycle };
|
||||
//# sourceMappingURL=use-cycle.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-cycle.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-cycle.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-cycle.mjs","sources":["../../../src/utils/use-cycle.ts"],"sourcesContent":["\"use client\"\n\nimport { wrap } from \"motion-utils\"\nimport { useCallback, useRef, useState } from \"react\"\n\nexport type Cycle = (i?: number) => void\n\nexport type CycleState<T> = [T, Cycle]\n\n/**\n * Cycles through a series of visual properties. Can be used to toggle between or cycle through animations. It works similar to `useState` in React. It is provided an initial array of possible states, and returns an array of two arguments.\n *\n * An index value can be passed to the returned `cycle` function to cycle to a specific index.\n *\n * ```jsx\n * import * as React from \"react\"\n * import { motion, useCycle } from \"framer-motion\"\n *\n * export const MyComponent = () => {\n * const [x, cycleX] = useCycle(0, 50, 100)\n *\n * return (\n * <motion.div\n * animate={{ x: x }}\n * onTap={() => cycleX()}\n * />\n * )\n * }\n * ```\n *\n * @param items - items to cycle through\n * @returns [currentState, cycleState]\n *\n * @public\n */\nexport function useCycle<T>(...items: T[]): CycleState<T> {\n const index = useRef(0)\n const [item, setItem] = useState(items[index.current])\n\n const runCycle = useCallback(\n (next?: number) => {\n index.current =\n typeof next !== \"number\"\n ? wrap(0, items.length, index.current + 1)\n : next\n\n setItem(items[index.current])\n },\n // The array will change on each call, but by putting items.length at\n // the front of this array, we guarantee the dependency comparison will match up\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [items.length, ...items]\n )\n return [item, runCycle]\n}\n"],"names":[],"mappings":";;;;AASA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;AACG;AACF;AACA;AAEA;AAEQ;;AAEQ;;;;;;;;AAUhB;AACJ;;"}
|
||||
21
node_modules/framer-motion/dist/es/utils/use-force-update.mjs
generated
vendored
Normal file
21
node_modules/framer-motion/dist/es/utils/use-force-update.mjs
generated
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
"use client";
|
||||
import { frame } from 'motion-dom';
|
||||
import { useState, useCallback } from 'react';
|
||||
import { useIsMounted } from './use-is-mounted.mjs';
|
||||
|
||||
function useForceUpdate() {
|
||||
const isMounted = useIsMounted();
|
||||
const [forcedRenderCount, setForcedRenderCount] = useState(0);
|
||||
const forceRender = useCallback(() => {
|
||||
isMounted.current && setForcedRenderCount(forcedRenderCount + 1);
|
||||
}, [forcedRenderCount]);
|
||||
/**
|
||||
* Defer this to the end of the next animation frame in case there are multiple
|
||||
* synchronous calls.
|
||||
*/
|
||||
const deferredForceRender = useCallback(() => frame.postRender(forceRender), [forceRender]);
|
||||
return [deferredForceRender, forcedRenderCount];
|
||||
}
|
||||
|
||||
export { useForceUpdate };
|
||||
//# sourceMappingURL=use-force-update.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-force-update.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-force-update.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-force-update.mjs","sources":["../../../src/utils/use-force-update.ts"],"sourcesContent":["\"use client\"\n\nimport { frame } from \"motion-dom\"\nimport { useCallback, useState } from \"react\"\nimport { useIsMounted } from \"./use-is-mounted\"\n\nexport function useForceUpdate(): [VoidFunction, number] {\n const isMounted = useIsMounted()\n const [forcedRenderCount, setForcedRenderCount] = useState(0)\n\n const forceRender = useCallback(() => {\n isMounted.current && setForcedRenderCount(forcedRenderCount + 1)\n }, [forcedRenderCount])\n\n /**\n * Defer this to the end of the next animation frame in case there are multiple\n * synchronous calls.\n */\n const deferredForceRender = useCallback(\n () => frame.postRender(forceRender),\n [forceRender]\n )\n\n return [deferredForceRender, forcedRenderCount]\n}\n"],"names":[],"mappings":";;;;;;AAOI;;AAGA;;AAEA;AAEA;;;AAGG;AACH;AAKA;AACJ;;"}
|
||||
25
node_modules/framer-motion/dist/es/utils/use-in-view.mjs
generated
vendored
Normal file
25
node_modules/framer-motion/dist/es/utils/use-in-view.mjs
generated
vendored
Normal file
@@ -0,0 +1,25 @@
|
||||
"use client";
|
||||
import { useState, useEffect } from 'react';
|
||||
import { inView } from '../render/dom/viewport/index.mjs';
|
||||
|
||||
function useInView(ref, { root, margin, amount, once = false, initial = false, } = {}) {
|
||||
const [isInView, setInView] = useState(initial);
|
||||
useEffect(() => {
|
||||
if (!ref.current || (once && isInView))
|
||||
return;
|
||||
const onEnter = () => {
|
||||
setInView(true);
|
||||
return once ? undefined : () => setInView(false);
|
||||
};
|
||||
const options = {
|
||||
root: (root && root.current) || undefined,
|
||||
margin,
|
||||
amount,
|
||||
};
|
||||
return inView(ref.current, onEnter, options);
|
||||
}, [root, ref, margin, once, amount]);
|
||||
return isInView;
|
||||
}
|
||||
|
||||
export { useInView };
|
||||
//# sourceMappingURL=use-in-view.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-in-view.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-in-view.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-in-view.mjs","sources":["../../../src/utils/use-in-view.ts"],"sourcesContent":["\"use client\"\n\nimport { RefObject, useEffect, useState } from \"react\"\nimport { inView, InViewOptions } from \"../render/dom/viewport\"\n\nexport interface UseInViewOptions\n extends Omit<InViewOptions, \"root\" | \"amount\"> {\n root?: RefObject<Element | null>\n once?: boolean\n amount?: \"some\" | \"all\" | number\n initial?: boolean\n}\n\nexport function useInView(\n ref: RefObject<Element | null>,\n {\n root,\n margin,\n amount,\n once = false,\n initial = false,\n }: UseInViewOptions = {}\n) {\n const [isInView, setInView] = useState(initial)\n\n useEffect(() => {\n if (!ref.current || (once && isInView)) return\n\n const onEnter = () => {\n setInView(true)\n\n return once ? undefined : () => setInView(false)\n }\n\n const options: InViewOptions = {\n root: (root && root.current) || undefined,\n margin,\n amount,\n }\n\n return inView(ref.current, onEnter, options)\n }, [root, ref, margin, once, amount])\n\n return isInView\n}\n"],"names":[],"mappings":";;;;AAaM;;;;;;;AAkBM;AACJ;AAEA;;;;;;AAOJ;AAEA;AACJ;;"}
|
||||
43
node_modules/framer-motion/dist/es/utils/use-instant-transition.mjs
generated
vendored
Normal file
43
node_modules/framer-motion/dist/es/utils/use-instant-transition.mjs
generated
vendored
Normal file
@@ -0,0 +1,43 @@
|
||||
"use client";
|
||||
import { frame } from 'motion-dom';
|
||||
import { MotionGlobalConfig } from 'motion-utils';
|
||||
import { useRef, useEffect } from 'react';
|
||||
import { useInstantLayoutTransition } from '../projection/use-instant-layout-transition.mjs';
|
||||
import { useForceUpdate } from './use-force-update.mjs';
|
||||
|
||||
function useInstantTransition() {
|
||||
const [forceUpdate, forcedRenderCount] = useForceUpdate();
|
||||
const startInstantLayoutTransition = useInstantLayoutTransition();
|
||||
const unlockOnFrameRef = useRef(-1);
|
||||
useEffect(() => {
|
||||
/**
|
||||
* Unblock after two animation frames, otherwise this will unblock too soon.
|
||||
*/
|
||||
frame.postRender(() => frame.postRender(() => {
|
||||
/**
|
||||
* If the callback has been called again after the effect
|
||||
* triggered this 2 frame delay, don't unblock animations. This
|
||||
* prevents the previous effect from unblocking the current
|
||||
* instant transition too soon. This becomes more likely when
|
||||
* used in conjunction with React.startTransition().
|
||||
*/
|
||||
if (forcedRenderCount !== unlockOnFrameRef.current)
|
||||
return;
|
||||
MotionGlobalConfig.instantAnimations = false;
|
||||
}));
|
||||
}, [forcedRenderCount]);
|
||||
return (callback) => {
|
||||
startInstantLayoutTransition(() => {
|
||||
MotionGlobalConfig.instantAnimations = true;
|
||||
forceUpdate();
|
||||
callback();
|
||||
unlockOnFrameRef.current = forcedRenderCount + 1;
|
||||
});
|
||||
};
|
||||
}
|
||||
function disableInstantTransitions() {
|
||||
MotionGlobalConfig.instantAnimations = false;
|
||||
}
|
||||
|
||||
export { disableInstantTransitions, useInstantTransition };
|
||||
//# sourceMappingURL=use-instant-transition.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-instant-transition.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-instant-transition.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-instant-transition.mjs","sources":["../../../src/utils/use-instant-transition.ts"],"sourcesContent":["\"use client\"\n\nimport { frame } from \"motion-dom\"\nimport { MotionGlobalConfig } from \"motion-utils\"\nimport { useEffect, useRef } from \"react\"\nimport { useInstantLayoutTransition } from \"../projection/use-instant-layout-transition\"\nimport { useForceUpdate } from \"./use-force-update\"\n\nexport function useInstantTransition() {\n const [forceUpdate, forcedRenderCount] = useForceUpdate()\n const startInstantLayoutTransition = useInstantLayoutTransition()\n const unlockOnFrameRef = useRef<number>(-1)\n\n useEffect(() => {\n /**\n * Unblock after two animation frames, otherwise this will unblock too soon.\n */\n frame.postRender(() =>\n frame.postRender(() => {\n /**\n * If the callback has been called again after the effect\n * triggered this 2 frame delay, don't unblock animations. This\n * prevents the previous effect from unblocking the current\n * instant transition too soon. This becomes more likely when\n * used in conjunction with React.startTransition().\n */\n if (forcedRenderCount !== unlockOnFrameRef.current) return\n MotionGlobalConfig.instantAnimations = false\n })\n )\n }, [forcedRenderCount])\n\n return (callback: () => void) => {\n startInstantLayoutTransition(() => {\n MotionGlobalConfig.instantAnimations = true\n forceUpdate()\n callback()\n unlockOnFrameRef.current = forcedRenderCount + 1\n })\n }\n}\n\nexport function disableInstantTransitions() {\n MotionGlobalConfig.instantAnimations = false\n}\n"],"names":[],"mappings":";;;;;;;;;AAUI;AACA;;AAGI;;AAEG;;AAGK;;;;;;AAMG;AACH;;AACA;;AAGZ;;;AAIQ;AACA;AACA;AACA;AACJ;AACJ;AACJ;;AAGI;AACJ;;"}
|
||||
17
node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs
generated
vendored
Normal file
17
node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs
generated
vendored
Normal file
@@ -0,0 +1,17 @@
|
||||
"use client";
|
||||
import { useRef } from 'react';
|
||||
import { useIsomorphicLayoutEffect } from './use-isomorphic-effect.mjs';
|
||||
|
||||
function useIsMounted() {
|
||||
const isMounted = useRef(false);
|
||||
useIsomorphicLayoutEffect(() => {
|
||||
isMounted.current = true;
|
||||
return () => {
|
||||
isMounted.current = false;
|
||||
};
|
||||
}, []);
|
||||
return isMounted;
|
||||
}
|
||||
|
||||
export { useIsMounted };
|
||||
//# sourceMappingURL=use-is-mounted.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-is-mounted.mjs","sources":["../../../src/utils/use-is-mounted.ts"],"sourcesContent":["\"use client\"\n\nimport { useRef } from \"react\"\nimport { useIsomorphicLayoutEffect } from \"./use-isomorphic-effect\"\n\nexport function 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"],"names":[],"mappings":";;;;;AAMI;;AAEI;AAEA;AACI;AACJ;;AAGJ;AACJ;;"}
|
||||
8
node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs
generated
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
"use client";
|
||||
import { useLayoutEffect, useEffect } from 'react';
|
||||
import { isBrowser } from './is-browser.mjs';
|
||||
|
||||
const useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
|
||||
|
||||
export { useIsomorphicLayoutEffect };
|
||||
//# sourceMappingURL=use-isomorphic-effect.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-isomorphic-effect.mjs","sources":["../../../src/utils/use-isomorphic-effect.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useLayoutEffect } from \"react\"\nimport { isBrowser } from \"./is-browser\"\n\nexport const useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect\n"],"names":[],"mappings":";;;;AAKO;;"}
|
||||
15
node_modules/framer-motion/dist/es/utils/use-motion-value-event.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/utils/use-motion-value-event.mjs
generated
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
"use client";
|
||||
import { useInsertionEffect } from 'react';
|
||||
|
||||
function useMotionValueEvent(value, event, callback) {
|
||||
/**
|
||||
* useInsertionEffect will create subscriptions before any other
|
||||
* effects will run. Effects run upwards through the tree so it
|
||||
* can be that binding a useLayoutEffect higher up the tree can
|
||||
* miss changes from lower down the tree.
|
||||
*/
|
||||
useInsertionEffect(() => value.on(event, callback), [value, event, callback]);
|
||||
}
|
||||
|
||||
export { useMotionValueEvent };
|
||||
//# sourceMappingURL=use-motion-value-event.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-motion-value-event.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-motion-value-event.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-motion-value-event.mjs","sources":["../../../src/utils/use-motion-value-event.ts"],"sourcesContent":["\"use client\"\n\nimport { MotionValue, MotionValueEventCallbacks } from \"motion-dom\"\nimport { useInsertionEffect } from \"react\"\n\nexport function useMotionValueEvent<\n V,\n EventName extends keyof MotionValueEventCallbacks<V>\n>(\n value: MotionValue<V>,\n event: EventName,\n callback: MotionValueEventCallbacks<V>[EventName]\n) {\n /**\n * useInsertionEffect will create subscriptions before any other\n * effects will run. Effects run upwards through the tree so it\n * can be that binding a useLayoutEffect higher up the tree can\n * miss changes from lower down the tree.\n */\n useInsertionEffect(\n () => value.on(event, callback),\n [value, event, callback]\n )\n}\n"],"names":[],"mappings":";;;;AAaI;;;;;AAKG;;AAKP;;"}
|
||||
20
node_modules/framer-motion/dist/es/utils/use-page-in-view.mjs
generated
vendored
Normal file
20
node_modules/framer-motion/dist/es/utils/use-page-in-view.mjs
generated
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
"use client";
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
function usePageInView() {
|
||||
const [isInView, setIsInView] = useState(true);
|
||||
useEffect(() => {
|
||||
const handleVisibilityChange = () => setIsInView(!document.hidden);
|
||||
if (document.hidden) {
|
||||
handleVisibilityChange();
|
||||
}
|
||||
document.addEventListener("visibilitychange", handleVisibilityChange);
|
||||
return () => {
|
||||
document.removeEventListener("visibilitychange", handleVisibilityChange);
|
||||
};
|
||||
}, []);
|
||||
return isInView;
|
||||
}
|
||||
|
||||
export { usePageInView };
|
||||
//# sourceMappingURL=use-page-in-view.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-page-in-view.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-page-in-view.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-page-in-view.mjs","sources":["../../../src/utils/use-page-in-view.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useState } from \"react\"\n\nexport function usePageInView() {\n const [isInView, setIsInView] = useState(true)\n\n useEffect(() => {\n const handleVisibilityChange = () => setIsInView(!document.hidden)\n\n if (document.hidden) {\n handleVisibilityChange()\n }\n\n document.addEventListener(\"visibilitychange\", handleVisibilityChange)\n\n return () => {\n document.removeEventListener(\n \"visibilitychange\",\n handleVisibilityChange\n )\n }\n }, [])\n\n return isInView\n}\n"],"names":[],"mappings":";;;;;;AAQQ;AAEA;AACI;;AAGJ;AAEA;AACI;AAIJ;;AAGJ;AACJ;;"}
|
||||
9
node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs
generated
vendored
Normal file
9
node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs
generated
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
"use client";
|
||||
import { useEffect } from 'react';
|
||||
|
||||
function useUnmountEffect(callback) {
|
||||
return useEffect(() => () => callback(), []);
|
||||
}
|
||||
|
||||
export { useUnmountEffect };
|
||||
//# sourceMappingURL=use-unmount-effect.mjs.map
|
||||
1
node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs.map
generated
vendored
Normal file
1
node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs.map
generated
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-unmount-effect.mjs","sources":["../../../src/utils/use-unmount-effect.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect } from \"react\"\n\nexport function useUnmountEffect(callback: () => void) {\n return useEffect(() => () => callback(), [])\n}\n"],"names":[],"mappings":";;;AAIM;AACF;AACJ;;"}
|
||||
Reference in New Issue
Block a user