proyectos/mission-control-ui
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Mission Control Dashboard - Initial implementation

Browse Source
This commit is contained in:
Daniel Arroyo
2026-03-27 18:36:05 +00:00
parent 257cea2c7d
commit a8fb4d4555
12516 changed files with 2307128 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

561
node_modules/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs generated vendored Normal file
View File

@@ -0,0 +1,561 @@
import { createBox, frame, eachAxis, measurePageBox, convertBoxToBoundingBox, convertBoundingBoxToBox, addValueToWillChange, animateMotionValue, mixNumber, addDomEvent, setDragLock, percent, calcLength, resize, isElementTextInput } from 'motion-dom';
import { invariant } from 'motion-utils';
import { addPointerEvent } from '../../events/add-pointer-event.mjs';
import { extractEventInfo } from '../../events/event-info.mjs';
import { getContextWindow } from '../../utils/get-context-window.mjs';
import { isRefObject } from '../../utils/is-ref-object.mjs';
import { PanSession } from '../pan/PanSession.mjs';
import { applyConstraints, calcRelativeConstraints, resolveDragElastic, rebaseAxisConstraints, calcViewportConstraints, calcOrigin, defaultElastic } from './utils/constraints.mjs';
const elementDragControls = new WeakMap();
class VisualElementDragControls {
constructor(visualElement) {
this.openDragLock = null;
this.isDragging = false;
this.currentDirection = null;
this.originPoint = { x: 0, y: 0 };
/**
* The permitted boundaries of travel, in pixels.
*/
this.constraints = false;
this.hasMutatedConstraints = false;
/**
* The per-axis resolved elastic values.
*/
this.elastic = createBox();
/**
* The latest pointer event. Used as fallback when the `cancel` and `stop` functions are called without arguments.
*/
this.latestPointerEvent = null;
/**
* The latest pan info. Used as fallback when the `cancel` and `stop` functions are called without arguments.
*/
this.latestPanInfo = null;
this.visualElement = visualElement;
}
start(originEvent, { snapToCursor = false, distanceThreshold } = {}) {
/**
* Don't start dragging if this component is exiting
*/
const { presenceContext } = this.visualElement;
if (presenceContext && presenceContext.isPresent === false)
return;
const onSessionStart = (event) => {
if (snapToCursor) {
this.snapToCursor(extractEventInfo(event).point);
}
this.stopAnimation();
};
const onStart = (event, info) => {
// Attempt to grab the global drag gesture lock - maybe make this part of PanSession
const { drag, dragPropagation, onDragStart } = this.getProps();
if (drag && !dragPropagation) {
if (this.openDragLock)
this.openDragLock();
this.openDragLock = setDragLock(drag);
// If we don 't have the lock, don't start dragging
if (!this.openDragLock)
return;
}
this.latestPointerEvent = event;
this.latestPanInfo = info;
this.isDragging = true;
this.currentDirection = null;
this.resolveConstraints();
if (this.visualElement.projection) {
this.visualElement.projection.isAnimationBlocked = true;
this.visualElement.projection.target = undefined;
}
/**
* Record gesture origin and pointer offset
*/
eachAxis((axis) => {
let current = this.getAxisMotionValue(axis).get() || 0;
/**
* If the MotionValue is a percentage value convert to px
*/
if (percent.test(current)) {
const { projection } = this.visualElement;
if (projection && projection.layout) {
const measuredAxis = projection.layout.layoutBox[axis];
if (measuredAxis) {
const length = calcLength(measuredAxis);
current = length * (parseFloat(current) / 100);
}
}
}
this.originPoint[axis] = current;
});
// Fire onDragStart event
if (onDragStart) {
frame.update(() => onDragStart(event, info), false, true);
}
addValueToWillChange(this.visualElement, "transform");
const { animationState } = this.visualElement;
animationState && animationState.setActive("whileDrag", true);
};
const onMove = (event, info) => {
this.latestPointerEvent = event;
this.latestPanInfo = info;
const { dragPropagation, dragDirectionLock, onDirectionLock, onDrag, } = this.getProps();
// If we didn't successfully receive the gesture lock, early return.
if (!dragPropagation && !this.openDragLock)
return;
const { offset } = info;
// Attempt to detect drag direction if directionLock is true
if (dragDirectionLock && this.currentDirection === null) {
this.currentDirection = getCurrentDirection(offset);
// If we've successfully set a direction, notify listener
if (this.currentDirection !== null) {
onDirectionLock && onDirectionLock(this.currentDirection);
}
return;
}
// Update each point with the latest position
this.updateAxis("x", info.point, offset);
this.updateAxis("y", info.point, offset);
/**
* Ideally we would leave the renderer to fire naturally at the end of
* this frame but if the element is about to change layout as the result
* of a re-render we want to ensure the browser can read the latest
* bounding box to ensure the pointer and element don't fall out of sync.
*/
this.visualElement.render();
/**
* This must fire after the render call as it might trigger a state
* change which itself might trigger a layout update.
*/
if (onDrag) {
frame.update(() => onDrag(event, info), false, true);
}
};
const onSessionEnd = (event, info) => {
this.latestPointerEvent = event;
this.latestPanInfo = info;
this.stop(event, info);
this.latestPointerEvent = null;
this.latestPanInfo = null;
};
const resumeAnimation = () => {
const { dragSnapToOrigin: snap } = this.getProps();
if (snap || this.constraints) {
this.startAnimation({ x: 0, y: 0 });
}
};
const { dragSnapToOrigin } = this.getProps();
this.panSession = new PanSession(originEvent, {
onSessionStart,
onStart,
onMove,
onSessionEnd,
resumeAnimation,
}, {
transformPagePoint: this.visualElement.getTransformPagePoint(),
dragSnapToOrigin,
distanceThreshold,
contextWindow: getContextWindow(this.visualElement),
element: this.visualElement.current,
});
}
/**
* @internal
*/
stop(event, panInfo) {
const finalEvent = event || this.latestPointerEvent;
const finalPanInfo = panInfo || this.latestPanInfo;
const isDragging = this.isDragging;
this.cancel();
if (!isDragging || !finalPanInfo || !finalEvent)
return;
const { velocity } = finalPanInfo;
this.startAnimation(velocity);
const { onDragEnd } = this.getProps();
if (onDragEnd) {
frame.postRender(() => onDragEnd(finalEvent, finalPanInfo));
}
}
/**
* @internal
*/
cancel() {
this.isDragging = false;
const { projection, animationState } = this.visualElement;
if (projection) {
projection.isAnimationBlocked = false;
}
this.endPanSession();
const { dragPropagation } = this.getProps();
if (!dragPropagation && this.openDragLock) {
this.openDragLock();
this.openDragLock = null;
}
animationState && animationState.setActive("whileDrag", false);
}
/**
* Clean up the pan session without modifying other drag state.
* This is used during unmount to ensure event listeners are removed
* without affecting projection animations or drag locks.
* @internal
*/
endPanSession() {
this.panSession && this.panSession.end();
this.panSession = undefined;
}
updateAxis(axis, _point, offset) {
const { drag } = this.getProps();
// If we're not dragging this axis, do an early return.
if (!offset || !shouldDrag(axis, drag, this.currentDirection))
return;
const axisValue = this.getAxisMotionValue(axis);
let next = this.originPoint[axis] + offset[axis];
// Apply constraints
if (this.constraints && this.constraints[axis]) {
next = applyConstraints(next, this.constraints[axis], this.elastic[axis]);
}
axisValue.set(next);
}
resolveConstraints() {
const { dragConstraints, dragElastic } = this.getProps();
const layout = this.visualElement.projection &&
!this.visualElement.projection.layout
? this.visualElement.projection.measure(false)
: this.visualElement.projection?.layout;
const prevConstraints = this.constraints;
if (dragConstraints && isRefObject(dragConstraints)) {
if (!this.constraints) {
this.constraints = this.resolveRefConstraints();
}
}
else {
if (dragConstraints && layout) {
this.constraints = calcRelativeConstraints(layout.layoutBox, dragConstraints);
}
else {
this.constraints = false;
}
}
this.elastic = resolveDragElastic(dragElastic);
/**
* If we're outputting to external MotionValues, we want to rebase the measured constraints
* from viewport-relative to component-relative. This only applies to relative (non-ref)
* constraints, as ref-based constraints from calcViewportConstraints are already in the
* correct coordinate space for the motion value transform offset.
*/
if (prevConstraints !== this.constraints &&
!isRefObject(dragConstraints) &&
layout &&
this.constraints &&
!this.hasMutatedConstraints) {
eachAxis((axis) => {
if (this.constraints !== false &&
this.getAxisMotionValue(axis)) {
this.constraints[axis] = rebaseAxisConstraints(layout.layoutBox[axis], this.constraints[axis]);
}
});
}
}
resolveRefConstraints() {
const { dragConstraints: constraints, onMeasureDragConstraints } = this.getProps();
if (!constraints || !isRefObject(constraints))
return false;
const constraintsElement = constraints.current;
invariant(constraintsElement !== null, "If `dragConstraints` is set as a React ref, that ref must be passed to another component's `ref` prop.", "drag-constraints-ref");
const { projection } = this.visualElement;
// TODO
if (!projection || !projection.layout)
return false;
const constraintsBox = measurePageBox(constraintsElement, projection.root, this.visualElement.getTransformPagePoint());
let measuredConstraints = calcViewportConstraints(projection.layout.layoutBox, constraintsBox);
/**
* If there's an onMeasureDragConstraints listener we call it and
* if different constraints are returned, set constraints to that
*/
if (onMeasureDragConstraints) {
const userConstraints = onMeasureDragConstraints(convertBoxToBoundingBox(measuredConstraints));
this.hasMutatedConstraints = !!userConstraints;
if (userConstraints) {
measuredConstraints = convertBoundingBoxToBox(userConstraints);
}
}
return measuredConstraints;
}
startAnimation(velocity) {
const { drag, dragMomentum, dragElastic, dragTransition, dragSnapToOrigin, onDragTransitionEnd, } = this.getProps();
const constraints = this.constraints || {};
const momentumAnimations = eachAxis((axis) => {
if (!shouldDrag(axis, drag, this.currentDirection)) {
return;
}
let transition = (constraints && constraints[axis]) || {};
if (dragSnapToOrigin === true ||
dragSnapToOrigin === axis)
transition = { min: 0, max: 0 };
/**
* Overdamp the boundary spring if `dragElastic` is disabled. There's still a frame
* of spring animations so we should look into adding a disable spring option to `inertia`.
* We could do something here where we affect the `bounceStiffness` and `bounceDamping`
* using the value of `dragElastic`.
*/
const bounceStiffness = dragElastic ? 200 : 1000000;
const bounceDamping = dragElastic ? 40 : 10000000;
const inertia = {
type: "inertia",
velocity: dragMomentum ? velocity[axis] : 0,
bounceStiffness,
bounceDamping,
timeConstant: 750,
restDelta: 1,
restSpeed: 10,
...dragTransition,
...transition,
};
// If we're not animating on an externally-provided `MotionValue` we can use the
// component's animation controls which will handle interactions with whileHover (etc),
// otherwise we just have to animate the `MotionValue` itself.
return this.startAxisValueAnimation(axis, inertia);
});
// Run all animations and then resolve the new drag constraints.
return Promise.all(momentumAnimations).then(onDragTransitionEnd);
}
startAxisValueAnimation(axis, transition) {
const axisValue = this.getAxisMotionValue(axis);
addValueToWillChange(this.visualElement, axis);
return axisValue.start(animateMotionValue(axis, axisValue, 0, transition, this.visualElement, false));
}
stopAnimation() {
eachAxis((axis) => this.getAxisMotionValue(axis).stop());
}
/**
* Drag works differently depending on which props are provided.
*
* - If _dragX and _dragY are provided, we output the gesture delta directly to those motion values.
* - Otherwise, we apply the delta to the x/y motion values.
*/
getAxisMotionValue(axis) {
const dragKey = `_drag${axis.toUpperCase()}`;
const props = this.visualElement.getProps();
const externalMotionValue = props[dragKey];
return externalMotionValue
? externalMotionValue
: this.visualElement.getValue(axis, (props.initial
? props.initial[axis]
: undefined) || 0);
}
snapToCursor(point) {
eachAxis((axis) => {
const { drag } = this.getProps();
// If we're not dragging this axis, do an early return.
if (!shouldDrag(axis, drag, this.currentDirection))
return;
const { projection } = this.visualElement;
const axisValue = this.getAxisMotionValue(axis);
if (projection && projection.layout) {
const { min, max } = projection.layout.layoutBox[axis];
/**
* The layout measurement includes the current transform value,
* so we need to add it back to get the correct snap position.
* This fixes an issue where elements with initial coordinates
* would snap to the wrong position on the first drag.
*/
const current = axisValue.get() || 0;
axisValue.set(point[axis] - mixNumber(min, max, 0.5) + current);
}
});
}
/**
* When the viewport resizes we want to check if the measured constraints
* have changed and, if so, reposition the element within those new constraints
* relative to where it was before the resize.
*/
scalePositionWithinConstraints() {
if (!this.visualElement.current)
return;
const { drag, dragConstraints } = this.getProps();
const { projection } = this.visualElement;
if (!isRefObject(dragConstraints) || !projection || !this.constraints)
return;
/**
* Stop current animations as there can be visual glitching if we try to do
* this mid-animation
*/
this.stopAnimation();
/**
* Record the relative position of the dragged element relative to the
* constraints box and save as a progress value.
*/
const boxProgress = { x: 0, y: 0 };
eachAxis((axis) => {
const axisValue = this.getAxisMotionValue(axis);
if (axisValue && this.constraints !== false) {
const latest = axisValue.get();
boxProgress[axis] = calcOrigin({ min: latest, max: latest }, this.constraints[axis]);
}
});
/**
* Update the layout of this element and resolve the latest drag constraints
*/
const { transformTemplate } = this.visualElement.getProps();
this.visualElement.current.style.transform = transformTemplate
? transformTemplate({}, "")
: "none";
projection.root && projection.root.updateScroll();
projection.updateLayout();
/**
* Reset constraints so resolveConstraints() will recalculate them
* with the freshly measured layout rather than returning the cached value.
*/
this.constraints = false;
this.resolveConstraints();
/**
* For each axis, calculate the current progress of the layout axis
* within the new constraints.
*/
eachAxis((axis) => {
if (!shouldDrag(axis, drag, null))
return;
/**
* Calculate a new transform based on the previous box progress
*/
const axisValue = this.getAxisMotionValue(axis);
const { min, max } = this.constraints[axis];
axisValue.set(mixNumber(min, max, boxProgress[axis]));
});
/**
* Flush the updated transform to the DOM synchronously to prevent
* a visual flash at the element's CSS layout position (0,0) when
* the transform was stripped for measurement.
*/
this.visualElement.render();
}
addListeners() {
if (!this.visualElement.current)
return;
elementDragControls.set(this.visualElement, this);
const element = this.visualElement.current;
/**
* Attach a pointerdown event listener on this DOM element to initiate drag tracking.
*/
const stopPointerListener = addPointerEvent(element, "pointerdown", (event) => {
const { drag, dragListener = true } = this.getProps();
const target = event.target;
/**
* Only block drag if clicking on a text input child element
* (input, textarea, select, contenteditable) where users might
* want to select text or interact with the control.
*
* Buttons and links don't block drag since they don't have
* click-and-move actions of their own.
*/
const isClickingTextInputChild = target !== element && isElementTextInput(target);
if (drag && dragListener && !isClickingTextInputChild) {
this.start(event);
}
});
/**
* If using ref-based constraints, observe both the draggable element
* and the constraint container for size changes via ResizeObserver.
* Setup is deferred because dragConstraints.current is null when
* addListeners first runs (React hasn't committed the ref yet).
*/
let stopResizeObservers;
const measureDragConstraints = () => {
const { dragConstraints } = this.getProps();
if (isRefObject(dragConstraints) && dragConstraints.current) {
this.constraints = this.resolveRefConstraints();
if (!stopResizeObservers) {
stopResizeObservers = startResizeObservers(element, dragConstraints.current, () => this.scalePositionWithinConstraints());
}
}
};
const { projection } = this.visualElement;
const stopMeasureLayoutListener = projection.addEventListener("measure", measureDragConstraints);
if (projection && !projection.layout) {
projection.root && projection.root.updateScroll();
projection.updateLayout();
}
frame.read(measureDragConstraints);
/**
* Attach a window resize listener to scale the draggable target within its defined
* constraints as the window resizes.
*/
const stopResizeListener = addDomEvent(window, "resize", () => this.scalePositionWithinConstraints());
/**
* If the element's layout changes, calculate the delta and apply that to
* the drag gesture's origin point.
*/
const stopLayoutUpdateListener = projection.addEventListener("didUpdate", (({ delta, hasLayoutChanged }) => {
if (this.isDragging && hasLayoutChanged) {
eachAxis((axis) => {
const motionValue = this.getAxisMotionValue(axis);
if (!motionValue)
return;
this.originPoint[axis] += delta[axis].translate;
motionValue.set(motionValue.get() + delta[axis].translate);
});
this.visualElement.render();
}
}));
return () => {
stopResizeListener();
stopPointerListener();
stopMeasureLayoutListener();
stopLayoutUpdateListener && stopLayoutUpdateListener();
stopResizeObservers && stopResizeObservers();
};
}
getProps() {
const props = this.visualElement.getProps();
const { drag = false, dragDirectionLock = false, dragPropagation = false, dragConstraints = false, dragElastic = defaultElastic, dragMomentum = true, } = props;
return {
...props,
drag,
dragDirectionLock,
dragPropagation,
dragConstraints,
dragElastic,
dragMomentum,
};
}
}
function skipFirstCall(callback) {
let isFirst = true;
return () => {
if (isFirst) {
isFirst = false;
return;
}
callback();
};
}
function startResizeObservers(element, constraintsElement, onResize) {
const stopElement = resize(element, skipFirstCall(onResize));
const stopContainer = resize(constraintsElement, skipFirstCall(onResize));
return () => {
stopElement();
stopContainer();
};
}
function shouldDrag(direction, drag, currentDirection) {
return ((drag === true || drag === direction) &&
(currentDirection === null || currentDirection === direction));
}
/**
* Based on an x/y offset determine the current drag direction. If both axis' offsets are lower
* than the provided threshold, return `null`.
*
* @param offset - The x/y offset from origin.
* @param lockThreshold - (Optional) - the minimum absolute offset before we can determine a drag direction.
*/
function getCurrentDirection(offset, lockThreshold = 10) {
let direction = null;
if (Math.abs(offset.y) > lockThreshold) {
direction = "y";
}
else if (Math.abs(offset.x) > lockThreshold) {
direction = "x";
}
return direction;
}
export { VisualElementDragControls, elementDragControls };
//# sourceMappingURL=VisualElementDragControls.mjs.map

1
node_modules/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs.map generated vendored Normal file
View File

File diff suppressed because one or more lines are too long

51
node_modules/framer-motion/dist/es/gestures/drag/index.mjs generated vendored Normal file
View File

@@ -0,0 +1,51 @@
import { Feature } from 'motion-dom';
import { noop } from 'motion-utils';
import { VisualElementDragControls } from './VisualElementDragControls.mjs';
class DragGesture extends Feature {
constructor(node) {
super(node);
this.removeGroupControls = noop;
this.removeListeners = noop;
this.controls = new VisualElementDragControls(node);
}
mount() {
// If we've been provided a DragControls for manual control over the drag gesture,
// subscribe this component to it on mount.
const { dragControls } = this.node.getProps();
if (dragControls) {
this.removeGroupControls = dragControls.subscribe(this.controls);
}
this.removeListeners = this.controls.addListeners() || noop;
}
update() {
const { dragControls } = this.node.getProps();
const { dragControls: prevDragControls } = this.node.prevProps || {};
if (dragControls !== prevDragControls) {
this.removeGroupControls();
if (dragControls) {
this.removeGroupControls = dragControls.subscribe(this.controls);
}
}
}
unmount() {
this.removeGroupControls();
this.removeListeners();
/**
* In React 19, during list reorder reconciliation, components may
* briefly unmount and remount while the drag is still active. If we're
* actively dragging, we should NOT end the pan session - it will
* continue tracking pointer events via its window-level listeners.
*
* The pan session will be properly cleaned up when:
* 1. The drag ends naturally (pointerup/pointercancel)
* 2. The component is truly removed from the DOM
*/
if (!this.controls.isDragging) {
this.controls.endPanSession();
}
}
}
export { DragGesture };
//# sourceMappingURL=index.mjs.map

1
node_modules/framer-motion/dist/es/gestures/drag/index.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../src/gestures/drag/index.ts"],"sourcesContent":["import { Feature, type VisualElement } from \"motion-dom\"\nimport { noop } from \"motion-utils\"\nimport { VisualElementDragControls } from \"./VisualElementDragControls\"\n\nexport class DragGesture extends Feature<HTMLElement> {\n controls: VisualElementDragControls\n\n removeGroupControls: Function = noop\n removeListeners: Function = noop\n\n constructor(node: VisualElement<HTMLElement>) {\n super(node)\n this.controls = new VisualElementDragControls(node)\n }\n\n mount() {\n // If we've been provided a DragControls for manual control over the drag gesture,\n // subscribe this component to it on mount.\n const { dragControls } = this.node.getProps()\n\n if (dragControls) {\n this.removeGroupControls = dragControls.subscribe(this.controls)\n }\n\n this.removeListeners = this.controls.addListeners() || noop\n }\n\n update() {\n const { dragControls } = this.node.getProps()\n const { dragControls: prevDragControls } = this.node.prevProps || {}\n\n if (dragControls !== prevDragControls) {\n this.removeGroupControls()\n if (dragControls) {\n this.removeGroupControls = dragControls.subscribe(this.controls)\n }\n }\n }\n\n unmount() {\n this.removeGroupControls()\n this.removeListeners()\n /**\n * In React 19, during list reorder reconciliation, components may\n * briefly unmount and remount while the drag is still active. If we're\n * actively dragging, we should NOT end the pan session - it will\n * continue tracking pointer events via its window-level listeners.\n *\n * The pan session will be properly cleaned up when:\n * 1. The drag ends naturally (pointerup/pointercancel)\n * 2. The component is truly removed from the DOM\n */\n if (!this.controls.isDragging) {\n this.controls.endPanSession()\n }\n }\n}\n"],"names":[],"mappings":";;;;AAIM,MAAO,WAAY,SAAQ,OAAoB,CAAA;AAMjD,IAAA,WAAA,CAAY,IAAgC,EAAA;QACxC,KAAK,CAAC,IAAI,CAAC;QAJf,IAAA,CAAA,mBAAmB,GAAa,IAAI;QACpC,IAAA,CAAA,eAAe,GAAa,IAAI;QAI5B,IAAI,CAAC,QAAQ,GAAG,IAAI,yBAAyB,CAAC,IAAI,CAAC;IACvD;IAEA,KAAK,GAAA;;;QAGD,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;QAE7C,IAAI,YAAY,EAAE;YACd,IAAI,CAAC,mBAAmB,GAAG,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;QACpE;QAEA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,YAAY,EAAE,IAAI,IAAI;IAC/D;IAEA,MAAM,GAAA;QACF,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAC7C,QAAA,MAAM,EAAE,YAAY,EAAE,gBAAgB,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE;AAEpE,QAAA,IAAI,YAAY,KAAK,gBAAgB,EAAE;YACnC,IAAI,CAAC,mBAAmB,EAAE;YAC1B,IAAI,YAAY,EAAE;gBACd,IAAI,CAAC,mBAAmB,GAAG,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;YACpE;QACJ;IACJ;IAEA,OAAO,GAAA;QACH,IAAI,CAAC,mBAAmB,EAAE;QAC1B,IAAI,CAAC,eAAe,EAAE;AACtB;;;;;;;;;AASG;AACH,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;AAC3B,YAAA,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE;QACjC;IACJ;AACH;;;;"}

117
node_modules/framer-motion/dist/es/gestures/drag/use-drag-controls.mjs generated vendored Normal file
View File

@@ -0,0 +1,117 @@
import { useConstant } from '../../utils/use-constant.mjs';
/**
* Can manually trigger a drag gesture on one or more `drag`-enabled `motion` components.
*
* ```jsx
* const dragControls = useDragControls()
*
* function startDrag(event) {
* dragControls.start(event, { snapToCursor: true })
* }
*
* return (
* <>
* <div onPointerDown={startDrag} />
* <motion.div drag="x" dragControls={dragControls} />
* </>
* )
* ```
*
* @public
*/
class DragControls {
constructor() {
this.componentControls = new Set();
}
/**
* Subscribe a component's internal `VisualElementDragControls` to the user-facing API.
*
* @internal
*/
subscribe(controls) {
this.componentControls.add(controls);
return () => this.componentControls.delete(controls);
}
/**
* Start a drag gesture on every `motion` component that has this set of drag controls
* passed into it via the `dragControls` prop.
*
* ```jsx
* dragControls.start(e, {
* snapToCursor: true
* })
* ```
*
* @param event - PointerEvent
* @param options - Options
*
* @public
*/
start(event, options) {
this.componentControls.forEach((controls) => {
controls.start(event.nativeEvent || event, options);
});
}
/**
* Cancels a drag gesture.
*
* ```jsx
* dragControls.cancel()
* ```
*
* @public
*/
cancel() {
this.componentControls.forEach((controls) => {
controls.cancel();
});
}
/**
* Stops a drag gesture.
*
* ```jsx
* dragControls.stop()
* ```
*
* @public
*/
stop() {
this.componentControls.forEach((controls) => {
controls.stop();
});
}
}
const createDragControls = () => new DragControls();
/**
* Usually, dragging is initiated by pressing down on a `motion` component with a `drag` prop
* and moving it. For some use-cases, for instance clicking at an arbitrary point on a video scrubber, we
* might want to initiate that dragging from a different component than the draggable one.
*
* By creating a `dragControls` using the `useDragControls` hook, we can pass this into
* the draggable component's `dragControls` prop. It exposes a `start` method
* that can start dragging from pointer events on other components.
*
* ```jsx
* const dragControls = useDragControls()
*
* function startDrag(event) {
* dragControls.start(event, { snapToCursor: true })
* }
*
* return (
* <>
* <div onPointerDown={startDrag} />
* <motion.div drag="x" dragControls={dragControls} />
* </>
* )
* ```
*
* @public
*/
function useDragControls() {
return useConstant(createDragControls);
}
export { DragControls, useDragControls };
//# sourceMappingURL=use-drag-controls.mjs.map

1
node_modules/framer-motion/dist/es/gestures/drag/use-drag-controls.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"use-drag-controls.mjs","sources":["../../../../src/gestures/drag/use-drag-controls.ts"],"sourcesContent":["import * as React from \"react\"\nimport { useConstant } from \"../../utils/use-constant\"\nimport {\n DragControlOptions,\n VisualElementDragControls,\n} from \"./VisualElementDragControls\"\n\n/**\n * Can manually trigger a drag gesture on one or more `drag`-enabled `motion` components.\n *\n * ```jsx\n * const dragControls = useDragControls()\n *\n * function startDrag(event) {\n * dragControls.start(event, { snapToCursor: true })\n * }\n *\n * return (\n * <>\n * <div onPointerDown={startDrag} />\n * <motion.div drag=\"x\" dragControls={dragControls} />\n * </>\n * )\n * ```\n *\n * @public\n */\nexport class DragControls {\n private componentControls = new Set<VisualElementDragControls>()\n\n /**\n * Subscribe a component's internal `VisualElementDragControls` to the user-facing API.\n *\n * @internal\n */\n subscribe(controls: VisualElementDragControls): () => void {\n this.componentControls.add(controls)\n\n return () => this.componentControls.delete(controls)\n }\n\n /**\n * Start a drag gesture on every `motion` component that has this set of drag controls\n * passed into it via the `dragControls` prop.\n *\n * ```jsx\n * dragControls.start(e, {\n * snapToCursor: true\n * })\n * ```\n *\n * @param event - PointerEvent\n * @param options - Options\n *\n * @public\n */\n start(\n event: React.PointerEvent | PointerEvent,\n options?: DragControlOptions\n ) {\n this.componentControls.forEach((controls) => {\n controls.start(\n (event as React.PointerEvent).nativeEvent || event,\n options\n )\n })\n }\n\n /**\n * Cancels a drag gesture.\n *\n * ```jsx\n * dragControls.cancel()\n * ```\n *\n * @public\n */\n cancel() {\n this.componentControls.forEach((controls) => {\n controls.cancel()\n })\n }\n\n /**\n * Stops a drag gesture.\n *\n * ```jsx\n * dragControls.stop()\n * ```\n *\n * @public\n */\n stop() {\n this.componentControls.forEach((controls) => {\n controls.stop()\n })\n }\n}\n\nconst createDragControls = () => new DragControls()\n\n/**\n * Usually, dragging is initiated by pressing down on a `motion` component with a `drag` prop\n * and moving it. For some use-cases, for instance clicking at an arbitrary point on a video scrubber, we\n * might want to initiate that dragging from a different component than the draggable one.\n *\n * By creating a `dragControls` using the `useDragControls` hook, we can pass this into\n * the draggable component's `dragControls` prop. It exposes a `start` method\n * that can start dragging from pointer events on other components.\n *\n * ```jsx\n * const dragControls = useDragControls()\n *\n * function startDrag(event) {\n * dragControls.start(event, { snapToCursor: true })\n * }\n *\n * return (\n * <>\n * <div onPointerDown={startDrag} />\n * <motion.div drag=\"x\" dragControls={dragControls} />\n * </>\n * )\n * ```\n *\n * @public\n */\nexport function useDragControls() {\n return useConstant(createDragControls)\n}\n"],"names":[],"mappings":";;AAOA;;;;;;;;;;;;;;;;;;;AAmBG;MACU,YAAY,CAAA;AAAzB,IAAA,WAAA,GAAA;AACY,QAAA,IAAA,CAAA,iBAAiB,GAAG,IAAI,GAAG,EAA6B;IAqEpE;AAnEI;;;;AAIG;AACH,IAAA,SAAS,CAAC,QAAmC,EAAA;AACzC,QAAA,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC;QAEpC,OAAO,MAAM,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,QAAQ,CAAC;IACxD;AAEA;;;;;;;;;;;;;;AAcG;IACH,KAAK,CACD,KAAwC,EACxC,OAA4B,EAAA;QAE5B,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,QAAQ,KAAI;YACxC,QAAQ,CAAC,KAAK,CACT,KAA4B,CAAC,WAAW,IAAI,KAAK,EAClD,OAAO,CACV;AACL,QAAA,CAAC,CAAC;IACN;AAEA;;;;;;;;AAQG;IACH,MAAM,GAAA;QACF,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,QAAQ,KAAI;YACxC,QAAQ,CAAC,MAAM,EAAE;AACrB,QAAA,CAAC,CAAC;IACN;AAEA;;;;;;;;AAQG;IACH,IAAI,GAAA;QACA,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,QAAQ,KAAI;YACxC,QAAQ,CAAC,IAAI,EAAE;AACnB,QAAA,CAAC,CAAC;IACN;AACH;AAED,MAAM,kBAAkB,GAAG,MAAM,IAAI,YAAY,EAAE;AAEnD;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;SACa,eAAe,GAAA;AAC3B,IAAA,OAAO,WAAW,CAAC,kBAAkB,CAAC;AAC1C;;;;"}

128
node_modules/framer-motion/dist/es/gestures/drag/utils/constraints.mjs generated vendored Normal file
View File

@@ -0,0 +1,128 @@
import { mixNumber, calcLength } from 'motion-dom';
import { progress, clamp } from 'motion-utils';
/**
* Apply constraints to a point. These constraints are both physical along an
* axis, and an elastic factor that determines how much to constrain the point
* by if it does lie outside the defined parameters.
*/
function applyConstraints(point, { min, max }, elastic) {
if (min !== undefined && point < min) {
// If we have a min point defined, and this is outside of that, constrain
point = elastic
? mixNumber(min, point, elastic.min)
: Math.max(point, min);
}
else if (max !== undefined && point > max) {
// If we have a max point defined, and this is outside of that, constrain
point = elastic
? mixNumber(max, point, elastic.max)
: Math.min(point, max);
}
return point;
}
/**
* Calculate constraints in terms of the viewport when defined relatively to the
* measured axis. This is measured from the nearest edge, so a max constraint of 200
* on an axis with a max value of 300 would return a constraint of 500 - axis length
*/
function calcRelativeAxisConstraints(axis, min, max) {
return {
min: min !== undefined ? axis.min + min : undefined,
max: max !== undefined
? axis.max + max - (axis.max - axis.min)
: undefined,
};
}
/**
* Calculate constraints in terms of the viewport when
* defined relatively to the measured bounding box.
*/
function calcRelativeConstraints(layoutBox, { top, left, bottom, right }) {
return {
x: calcRelativeAxisConstraints(layoutBox.x, left, right),
y: calcRelativeAxisConstraints(layoutBox.y, top, bottom),
};
}
/**
* Calculate viewport constraints when defined as another viewport-relative axis
*/
function calcViewportAxisConstraints(layoutAxis, constraintsAxis) {
let min = constraintsAxis.min - layoutAxis.min;
let max = constraintsAxis.max - layoutAxis.max;
// If the constraints axis is actually smaller than the layout axis then we can
// flip the constraints
if (constraintsAxis.max - constraintsAxis.min <
layoutAxis.max - layoutAxis.min) {
[min, max] = [max, min];
}
return { min, max };
}
/**
* Calculate viewport constraints when defined as another viewport-relative box
*/
function calcViewportConstraints(layoutBox, constraintsBox) {
return {
x: calcViewportAxisConstraints(layoutBox.x, constraintsBox.x),
y: calcViewportAxisConstraints(layoutBox.y, constraintsBox.y),
};
}
/**
* Calculate a transform origin relative to the source axis, between 0-1, that results
* in an asthetically pleasing scale/transform needed to project from source to target.
*/
function calcOrigin(source, target) {
let origin = 0.5;
const sourceLength = calcLength(source);
const targetLength = calcLength(target);
if (targetLength > sourceLength) {
origin = progress(target.min, target.max - sourceLength, source.min);
}
else if (sourceLength > targetLength) {
origin = progress(source.min, source.max - targetLength, target.min);
}
return clamp(0, 1, origin);
}
/**
* Rebase the calculated viewport constraints relative to the layout.min point.
*/
function rebaseAxisConstraints(layout, constraints) {
const relativeConstraints = {};
if (constraints.min !== undefined) {
relativeConstraints.min = constraints.min - layout.min;
}
if (constraints.max !== undefined) {
relativeConstraints.max = constraints.max - layout.min;
}
return relativeConstraints;
}
const defaultElastic = 0.35;
/**
* Accepts a dragElastic prop and returns resolved elastic values for each axis.
*/
function resolveDragElastic(dragElastic = defaultElastic) {
if (dragElastic === false) {
dragElastic = 0;
}
else if (dragElastic === true) {
dragElastic = defaultElastic;
}
return {
x: resolveAxisElastic(dragElastic, "left", "right"),
y: resolveAxisElastic(dragElastic, "top", "bottom"),
};
}
function resolveAxisElastic(dragElastic, minLabel, maxLabel) {
return {
min: resolvePointElastic(dragElastic, minLabel),
max: resolvePointElastic(dragElastic, maxLabel),
};
}
function resolvePointElastic(dragElastic, label) {
return typeof dragElastic === "number"
? dragElastic
: dragElastic[label] || 0;
}
export { applyConstraints, calcOrigin, calcRelativeAxisConstraints, calcRelativeConstraints, calcViewportAxisConstraints, calcViewportConstraints, defaultElastic, rebaseAxisConstraints, resolveAxisElastic, resolveDragElastic, resolvePointElastic };
//# sourceMappingURL=constraints.mjs.map

1
node_modules/framer-motion/dist/es/gestures/drag/utils/constraints.mjs.map generated vendored Normal file
View File

File diff suppressed because one or more lines are too long

41
node_modules/framer-motion/dist/es/gestures/focus.mjs generated vendored Normal file
View File

@@ -0,0 +1,41 @@
import { Feature, addDomEvent } from 'motion-dom';
import { pipe } from 'motion-utils';
class FocusGesture extends Feature {
constructor() {
super(...arguments);
this.isActive = false;
}
onFocus() {
let isFocusVisible = false;
/**
* If this element doesn't match focus-visible then don't
* apply whileHover. But, if matches throws that focus-visible
* is not a valid selector then in that browser outline styles will be applied
* to the element by default and we want to match that behaviour with whileFocus.
*/
try {
isFocusVisible = this.node.current.matches(":focus-visible");
}
catch (e) {
isFocusVisible = true;
}
if (!isFocusVisible || !this.node.animationState)
return;
this.node.animationState.setActive("whileFocus", true);
this.isActive = true;
}
onBlur() {
if (!this.isActive || !this.node.animationState)
return;
this.node.animationState.setActive("whileFocus", false);
this.isActive = false;
}
mount() {
this.unmount = pipe(addDomEvent(this.node.current, "focus", () => this.onFocus()), addDomEvent(this.node.current, "blur", () => this.onBlur()));
}
unmount() { }
}
export { FocusGesture };
//# sourceMappingURL=focus.mjs.map

1
node_modules/framer-motion/dist/es/gestures/focus.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"focus.mjs","sources":["../../../src/gestures/focus.ts"],"sourcesContent":["import { Feature, addDomEvent } from \"motion-dom\"\nimport { pipe } from \"motion-utils\"\n\nexport class FocusGesture extends Feature<Element> {\n private isActive = false\n\n onFocus() {\n let isFocusVisible = false\n\n /**\n * If this element doesn't match focus-visible then don't\n * apply whileHover. But, if matches throws that focus-visible\n * is not a valid selector then in that browser outline styles will be applied\n * to the element by default and we want to match that behaviour with whileFocus.\n */\n try {\n isFocusVisible = this.node.current!.matches(\":focus-visible\")\n } catch (e) {\n isFocusVisible = true\n }\n\n if (!isFocusVisible || !this.node.animationState) return\n\n this.node.animationState.setActive(\"whileFocus\", true)\n this.isActive = true\n }\n\n onBlur() {\n if (!this.isActive || !this.node.animationState) return\n this.node.animationState.setActive(\"whileFocus\", false)\n this.isActive = false\n }\n\n mount() {\n this.unmount = pipe(\n addDomEvent(this.node.current!, \"focus\", () => this.onFocus()),\n addDomEvent(this.node.current!, \"blur\", () => this.onBlur())\n ) as VoidFunction\n }\n\n unmount() {}\n}\n"],"names":[],"mappings":";;;AAGM,MAAO,YAAa,SAAQ,OAAgB,CAAA;AAAlD,IAAA,WAAA,GAAA;;QACY,IAAA,CAAA,QAAQ,GAAG,KAAK;IAqC5B;IAnCI,OAAO,GAAA;QACH,IAAI,cAAc,GAAG,KAAK;AAE1B;;;;;AAKG;AACH,QAAA,IAAI;YACA,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,OAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC;QACjE;QAAE,OAAO,CAAC,EAAE;YACR,cAAc,GAAG,IAAI;QACzB;QAEA,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE;QAElD,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,YAAY,EAAE,IAAI,CAAC;AACtD,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;IACxB;IAEA,MAAM,GAAA;QACF,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE;QACjD,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,YAAY,EAAE,KAAK,CAAC;AACvD,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;IACzB;IAEA,KAAK,GAAA;AACD,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CACf,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,OAAQ,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,EAAE,CAAC,EAC9D,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,OAAQ,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC,CAC/C;IACrB;AAEA,IAAA,OAAO,KAAI;AACd;;;;"}

29
node_modules/framer-motion/dist/es/gestures/hover.mjs generated vendored Normal file
View File

@@ -0,0 +1,29 @@
import { Feature, hover, frame } from 'motion-dom';
import { extractEventInfo } from '../events/event-info.mjs';
function handleHoverEvent(node, event, lifecycle) {
const { props } = node;
if (node.animationState && props.whileHover) {
node.animationState.setActive("whileHover", lifecycle === "Start");
}
const eventName = ("onHover" + lifecycle);
const callback = props[eventName];
if (callback) {
frame.postRender(() => callback(event, extractEventInfo(event)));
}
}
class HoverGesture extends Feature {
mount() {
const { current } = this.node;
if (!current)
return;
this.unmount = hover(current, (_element, startEvent) => {
handleHoverEvent(this.node, startEvent, "Start");
return (endEvent) => handleHoverEvent(this.node, endEvent, "End");
});
}
unmount() { }
}
export { HoverGesture };
//# sourceMappingURL=hover.mjs.map

1
node_modules/framer-motion/dist/es/gestures/hover.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"hover.mjs","sources":["../../../src/gestures/hover.ts"],"sourcesContent":["import { Feature, frame, hover, type VisualElement } from \"motion-dom\"\nimport { extractEventInfo } from \"../events/event-info\"\n\nfunction handleHoverEvent(\n node: VisualElement<Element>,\n event: PointerEvent,\n lifecycle: \"Start\" | \"End\"\n) {\n const { props } = node\n\n if (node.animationState && props.whileHover) {\n node.animationState.setActive(\"whileHover\", lifecycle === \"Start\")\n }\n\n const eventName = (\"onHover\" + lifecycle) as \"onHoverStart\" | \"onHoverEnd\"\n const callback = props[eventName]\n if (callback) {\n frame.postRender(() => callback(event, extractEventInfo(event)))\n }\n}\n\nexport class HoverGesture extends Feature<Element> {\n mount() {\n const { current } = this.node\n if (!current) return\n\n this.unmount = hover(current, (_element, startEvent) => {\n handleHoverEvent(this.node, startEvent, \"Start\")\n\n return (endEvent) => handleHoverEvent(this.node, endEvent, \"End\")\n })\n }\n\n unmount() {}\n}\n"],"names":[],"mappings":";;;AAGA,SAAS,gBAAgB,CACrB,IAA4B,EAC5B,KAAmB,EACnB,SAA0B,EAAA;AAE1B,IAAA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI;IAEtB,IAAI,IAAI,CAAC,cAAc,IAAI,KAAK,CAAC,UAAU,EAAE;QACzC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,YAAY,EAAE,SAAS,KAAK,OAAO,CAAC;IACtE;AAEA,IAAA,MAAM,SAAS,IAAI,SAAS,GAAG,SAAS,CAAkC;AAC1E,IAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC;IACjC,IAAI,QAAQ,EAAE;AACV,QAAA,KAAK,CAAC,UAAU,CAAC,MAAM,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC;IACpE;AACJ;AAEM,MAAO,YAAa,SAAQ,OAAgB,CAAA;IAC9C,KAAK,GAAA;AACD,QAAA,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,IAAI;AAC7B,QAAA,IAAI,CAAC,OAAO;YAAE;AAEd,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE,UAAU,KAAI;YACnD,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,EAAE,OAAO,CAAC;AAEhD,YAAA,OAAO,CAAC,QAAQ,KAAK,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC;AACrE,QAAA,CAAC,CAAC;IACN;AAEA,IAAA,OAAO,KAAI;AACd;;;;"}

279
node_modules/framer-motion/dist/es/gestures/pan/PanSession.mjs generated vendored Normal file
View File

@@ -0,0 +1,279 @@
import { frameData, frame, isPrimaryPointer, cancelFrame } from 'motion-dom';
import { pipe, secondsToMilliseconds, millisecondsToSeconds } from 'motion-utils';
import { addPointerEvent } from '../../events/add-pointer-event.mjs';
import { extractEventInfo } from '../../events/event-info.mjs';
import { distance2D } from '../../utils/distance.mjs';
const overflowStyles = /*#__PURE__*/ new Set(["auto", "scroll"]);
/**
* @internal
*/
class PanSession {
constructor(event, handlers, { transformPagePoint, contextWindow = window, dragSnapToOrigin = false, distanceThreshold = 3, element, } = {}) {
/**
* @internal
*/
this.startEvent = null;
/**
* @internal
*/
this.lastMoveEvent = null;
/**
* @internal
*/
this.lastMoveEventInfo = null;
/**
* Raw (untransformed) event info, re-transformed each frame
* so transformPagePoint sees the current parent matrix.
* @internal
*/
this.lastRawMoveEventInfo = null;
/**
* @internal
*/
this.handlers = {};
/**
* @internal
*/
this.contextWindow = window;
/**
* Scroll positions of scrollable ancestors and window.
* @internal
*/
this.scrollPositions = new Map();
/**
* Cleanup function for scroll listeners.
* @internal
*/
this.removeScrollListeners = null;
this.onElementScroll = (event) => {
this.handleScroll(event.target);
};
this.onWindowScroll = () => {
this.handleScroll(window);
};
this.updatePoint = () => {
if (!(this.lastMoveEvent && this.lastMoveEventInfo))
return;
// Re-transform raw point through current transformPagePoint so
// animated parent transforms (e.g. rotation) are picked up each frame
if (this.lastRawMoveEventInfo) {
this.lastMoveEventInfo = transformPoint(this.lastRawMoveEventInfo, this.transformPagePoint);
}
const info = getPanInfo(this.lastMoveEventInfo, this.history);
const isPanStarted = this.startEvent !== null;
// Only start panning if the offset is larger than 3 pixels. If we make it
// any larger than this we'll want to reset the pointer history
// on the first update to avoid visual snapping to the cursor.
const isDistancePastThreshold = distance2D(info.offset, { x: 0, y: 0 }) >= this.distanceThreshold;
if (!isPanStarted && !isDistancePastThreshold)
return;
const { point } = info;
const { timestamp } = frameData;
this.history.push({ ...point, timestamp });
const { onStart, onMove } = this.handlers;
if (!isPanStarted) {
onStart && onStart(this.lastMoveEvent, info);
this.startEvent = this.lastMoveEvent;
}
onMove && onMove(this.lastMoveEvent, info);
};
this.handlePointerMove = (event, info) => {
this.lastMoveEvent = event;
this.lastRawMoveEventInfo = info;
this.lastMoveEventInfo = transformPoint(info, this.transformPagePoint);
// Throttle mouse move event to once per frame
frame.update(this.updatePoint, true);
};
this.handlePointerUp = (event, info) => {
this.end();
const { onEnd, onSessionEnd, resumeAnimation } = this.handlers;
// Resume animation if dragSnapToOrigin is set OR if no drag started (user just clicked)
// This ensures constraint animations continue when interrupted by a click
if (this.dragSnapToOrigin || !this.startEvent) {
resumeAnimation && resumeAnimation();
}
if (!(this.lastMoveEvent && this.lastMoveEventInfo))
return;
const panInfo = getPanInfo(event.type === "pointercancel"
? this.lastMoveEventInfo
: transformPoint(info, this.transformPagePoint), this.history);
if (this.startEvent && onEnd) {
onEnd(event, panInfo);
}
onSessionEnd && onSessionEnd(event, panInfo);
};
// If we have more than one touch, don't start detecting this gesture
if (!isPrimaryPointer(event))
return;
this.dragSnapToOrigin = dragSnapToOrigin;
this.handlers = handlers;
this.transformPagePoint = transformPagePoint;
this.distanceThreshold = distanceThreshold;
this.contextWindow = contextWindow || window;
const info = extractEventInfo(event);
const initialInfo = transformPoint(info, this.transformPagePoint);
const { point } = initialInfo;
const { timestamp } = frameData;
this.history = [{ ...point, timestamp }];
const { onSessionStart } = handlers;
onSessionStart &&
onSessionStart(event, getPanInfo(initialInfo, this.history));
this.removeListeners = pipe(addPointerEvent(this.contextWindow, "pointermove", this.handlePointerMove), addPointerEvent(this.contextWindow, "pointerup", this.handlePointerUp), addPointerEvent(this.contextWindow, "pointercancel", this.handlePointerUp));
// Start scroll tracking if element provided
if (element) {
this.startScrollTracking(element);
}
}
/**
* Start tracking scroll on ancestors and window.
*/
startScrollTracking(element) {
// Store initial scroll positions for scrollable ancestors
let current = element.parentElement;
while (current) {
const style = getComputedStyle(current);
if (overflowStyles.has(style.overflowX) ||
overflowStyles.has(style.overflowY)) {
this.scrollPositions.set(current, {
x: current.scrollLeft,
y: current.scrollTop,
});
}
current = current.parentElement;
}
// Track window scroll
this.scrollPositions.set(window, {
x: window.scrollX,
y: window.scrollY,
});
// Capture listener catches element scroll events as they bubble
window.addEventListener("scroll", this.onElementScroll, {
capture: true,
});
// Direct window scroll listener (window scroll doesn't bubble)
window.addEventListener("scroll", this.onWindowScroll);
this.removeScrollListeners = () => {
window.removeEventListener("scroll", this.onElementScroll, {
capture: true,
});
window.removeEventListener("scroll", this.onWindowScroll);
};
}
/**
* Handle scroll compensation during drag.
*
* For element scroll: adjusts history origin since pageX/pageY doesn't change.
* For window scroll: adjusts lastMoveEventInfo since pageX/pageY would change.
*/
handleScroll(target) {
const initial = this.scrollPositions.get(target);
if (!initial)
return;
const isWindow = target === window;
const current = isWindow
? { x: window.scrollX, y: window.scrollY }
: {
x: target.scrollLeft,
y: target.scrollTop,
};
const delta = { x: current.x - initial.x, y: current.y - initial.y };
if (delta.x === 0 && delta.y === 0)
return;
if (isWindow) {
// Window scroll: pageX/pageY changes, so update lastMoveEventInfo
if (this.lastMoveEventInfo) {
this.lastMoveEventInfo.point.x += delta.x;
this.lastMoveEventInfo.point.y += delta.y;
}
}
else {
// Element scroll: pageX/pageY unchanged, so adjust history origin
if (this.history.length > 0) {
this.history[0].x -= delta.x;
this.history[0].y -= delta.y;
}
}
this.scrollPositions.set(target, current);
frame.update(this.updatePoint, true);
}
updateHandlers(handlers) {
this.handlers = handlers;
}
end() {
this.removeListeners && this.removeListeners();
this.removeScrollListeners && this.removeScrollListeners();
this.scrollPositions.clear();
cancelFrame(this.updatePoint);
}
}
function transformPoint(info, transformPagePoint) {
return transformPagePoint ? { point: transformPagePoint(info.point) } : info;
}
function subtractPoint(a, b) {
return { x: a.x - b.x, y: a.y - b.y };
}
function getPanInfo({ point }, history) {
return {
point,
delta: subtractPoint(point, lastDevicePoint(history)),
offset: subtractPoint(point, startDevicePoint(history)),
velocity: getVelocity(history, 0.1),
};
}
function startDevicePoint(history) {
return history[0];
}
function lastDevicePoint(history) {
return history[history.length - 1];
}
function getVelocity(history, timeDelta) {
if (history.length < 2) {
return { x: 0, y: 0 };
}
let i = history.length - 1;
let timestampedPoint = null;
const lastPoint = lastDevicePoint(history);
while (i >= 0) {
timestampedPoint = history[i];
if (lastPoint.timestamp - timestampedPoint.timestamp >
secondsToMilliseconds(timeDelta)) {
break;
}
i--;
}
if (!timestampedPoint) {
return { x: 0, y: 0 };
}
/**
* If the selected point is the pointer-down origin (history[0]),
* there are better movement points available, and the time gap
* is suspiciously large (>2x timeDelta), use the next point instead.
* This prevents stale pointer-down points from diluting velocity
* in hold-then-flick gestures.
*/
if (timestampedPoint === history[0] &&
history.length > 2 &&
lastPoint.timestamp - timestampedPoint.timestamp >
secondsToMilliseconds(timeDelta) * 2) {
timestampedPoint = history[1];
}
const time = millisecondsToSeconds(lastPoint.timestamp - timestampedPoint.timestamp);
if (time === 0) {
return { x: 0, y: 0 };
}
const currentVelocity = {
x: (lastPoint.x - timestampedPoint.x) / time,
y: (lastPoint.y - timestampedPoint.y) / time,
};
if (currentVelocity.x === Infinity) {
currentVelocity.x = 0;
}
if (currentVelocity.y === Infinity) {
currentVelocity.y = 0;
}
return currentVelocity;
}
export { PanSession };
//# sourceMappingURL=PanSession.mjs.map

1
node_modules/framer-motion/dist/es/gestures/pan/PanSession.mjs.map generated vendored Normal file
View File

File diff suppressed because one or more lines are too long

50
node_modules/framer-motion/dist/es/gestures/pan/index.mjs generated vendored Normal file
View File

@@ -0,0 +1,50 @@
import { Feature, frame } from 'motion-dom';
import { noop } from 'motion-utils';
import { addPointerEvent } from '../../events/add-pointer-event.mjs';
import { getContextWindow } from '../../utils/get-context-window.mjs';
import { PanSession } from './PanSession.mjs';
const asyncHandler = (handler) => (event, info) => {
if (handler) {
frame.update(() => handler(event, info), false, true);
}
};
class PanGesture extends Feature {
constructor() {
super(...arguments);
this.removePointerDownListener = noop;
}
onPointerDown(pointerDownEvent) {
this.session = new PanSession(pointerDownEvent, this.createPanHandlers(), {
transformPagePoint: this.node.getTransformPagePoint(),
contextWindow: getContextWindow(this.node),
});
}
createPanHandlers() {
const { onPanSessionStart, onPanStart, onPan, onPanEnd } = this.node.getProps();
return {
onSessionStart: asyncHandler(onPanSessionStart),
onStart: asyncHandler(onPanStart),
onMove: asyncHandler(onPan),
onEnd: (event, info) => {
delete this.session;
if (onPanEnd) {
frame.postRender(() => onPanEnd(event, info));
}
},
};
}
mount() {
this.removePointerDownListener = addPointerEvent(this.node.current, "pointerdown", (event) => this.onPointerDown(event));
}
update() {
this.session && this.session.updateHandlers(this.createPanHandlers());
}
unmount() {
this.removePointerDownListener();
this.session && this.session.end();
}
}
export { PanGesture };
//# sourceMappingURL=index.mjs.map

1
node_modules/framer-motion/dist/es/gestures/pan/index.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../src/gestures/pan/index.ts"],"sourcesContent":["import { Feature, frame, type PanInfo } from \"motion-dom\"\nimport { noop } from \"motion-utils\"\nimport { addPointerEvent } from \"../../events/add-pointer-event\"\nimport { getContextWindow } from \"../../utils/get-context-window\"\nimport { PanSession } from \"./PanSession\"\n\ntype PanEventHandler = (event: PointerEvent, info: PanInfo) => void\nconst asyncHandler =\n (handler?: PanEventHandler) => (event: PointerEvent, info: PanInfo) => {\n if (handler) {\n frame.update(() => handler(event, info), false, true)\n }\n }\n\nexport class PanGesture extends Feature<Element> {\n private session?: PanSession\n\n private removePointerDownListener: Function = noop\n\n onPointerDown(pointerDownEvent: PointerEvent) {\n this.session = new PanSession(\n pointerDownEvent,\n this.createPanHandlers(),\n {\n transformPagePoint: this.node.getTransformPagePoint(),\n contextWindow: getContextWindow(this.node),\n }\n )\n }\n\n createPanHandlers() {\n const { onPanSessionStart, onPanStart, onPan, onPanEnd } =\n this.node.getProps()\n\n return {\n onSessionStart: asyncHandler(onPanSessionStart),\n onStart: asyncHandler(onPanStart),\n onMove: asyncHandler(onPan),\n onEnd: (event: PointerEvent, info: PanInfo) => {\n delete this.session\n if (onPanEnd) {\n frame.postRender(() => onPanEnd(event, info))\n }\n },\n }\n }\n\n mount() {\n this.removePointerDownListener = addPointerEvent(\n this.node.current!,\n \"pointerdown\",\n (event: PointerEvent) => this.onPointerDown(event)\n )\n }\n\n update() {\n this.session && this.session.updateHandlers(this.createPanHandlers())\n }\n\n unmount() {\n this.removePointerDownListener()\n this.session && this.session.end()\n }\n}\n"],"names":[],"mappings":";;;;;;AAOA,MAAM,YAAY,GACd,CAAC,OAAyB,KAAK,CAAC,KAAmB,EAAE,IAAa,KAAI;IAClE,IAAI,OAAO,EAAE;AACT,QAAA,KAAK,CAAC,MAAM,CAAC,MAAM,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC;IACzD;AACJ,CAAC;AAEC,MAAO,UAAW,SAAQ,OAAgB,CAAA;AAAhD,IAAA,WAAA,GAAA;;QAGY,IAAA,CAAA,yBAAyB,GAAa,IAAI;IA8CtD;AA5CI,IAAA,aAAa,CAAC,gBAA8B,EAAA;AACxC,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,UAAU,CACzB,gBAAgB,EAChB,IAAI,CAAC,iBAAiB,EAAE,EACxB;AACI,YAAA,kBAAkB,EAAE,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE;AACrD,YAAA,aAAa,EAAE,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC;AAC7C,SAAA,CACJ;IACL;IAEA,iBAAiB,GAAA;AACb,QAAA,MAAM,EAAE,iBAAiB,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,GACpD,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;QAExB,OAAO;AACH,YAAA,cAAc,EAAE,YAAY,CAAC,iBAAiB,CAAC;AAC/C,YAAA,OAAO,EAAE,YAAY,CAAC,UAAU,CAAC;AACjC,YAAA,MAAM,EAAE,YAAY,CAAC,KAAK,CAAC;AAC3B,YAAA,KAAK,EAAE,CAAC,KAAmB,EAAE,IAAa,KAAI;gBAC1C,OAAO,IAAI,CAAC,OAAO;gBACnB,IAAI,QAAQ,EAAE;AACV,oBAAA,KAAK,CAAC,UAAU,CAAC,MAAM,QAAQ,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;gBACjD;YACJ,CAAC;SACJ;IACL;IAEA,KAAK,GAAA;QACD,IAAI,CAAC,yBAAyB,GAAG,eAAe,CAC5C,IAAI,CAAC,IAAI,CAAC,OAAQ,EAClB,aAAa,EACb,CAAC,KAAmB,KAAK,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CACrD;IACL;IAEA,MAAM,GAAA;AACF,QAAA,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC;IACzE;IAEA,OAAO,GAAA;QACH,IAAI,CAAC,yBAAyB,EAAE;QAChC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,EAAE;IACtC;AACH;;;;"}

36
node_modules/framer-motion/dist/es/gestures/press.mjs generated vendored Normal file
View File

@@ -0,0 +1,36 @@
import { Feature, press, frame } from 'motion-dom';
import { extractEventInfo } from '../events/event-info.mjs';
function handlePressEvent(node, event, lifecycle) {
const { props } = node;
if (node.current instanceof HTMLButtonElement && node.current.disabled) {
return;
}
if (node.animationState && props.whileTap) {
node.animationState.setActive("whileTap", lifecycle === "Start");
}
const eventName = ("onTap" + (lifecycle === "End" ? "" : lifecycle));
const callback = props[eventName];
if (callback) {
frame.postRender(() => callback(event, extractEventInfo(event)));
}
}
class PressGesture extends Feature {
mount() {
const { current } = this.node;
if (!current)
return;
const { globalTapTarget, propagate } = this.node.props;
this.unmount = press(current, (_element, startEvent) => {
handlePressEvent(this.node, startEvent, "Start");
return (endEvent, { success }) => handlePressEvent(this.node, endEvent, success ? "End" : "Cancel");
}, {
useGlobalTarget: globalTapTarget,
stopPropagation: propagate?.tap === false,
});
}
unmount() { }
}
export { PressGesture };
//# sourceMappingURL=press.mjs.map

1
node_modules/framer-motion/dist/es/gestures/press.mjs.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"press.mjs","sources":["../../../src/gestures/press.ts"],"sourcesContent":["import { Feature, frame, press, type VisualElement } from \"motion-dom\"\nimport { extractEventInfo } from \"../events/event-info\"\n\nfunction handlePressEvent(\n node: VisualElement<Element>,\n event: PointerEvent,\n lifecycle: \"Start\" | \"End\" | \"Cancel\"\n) {\n const { props } = node\n\n if (node.current instanceof HTMLButtonElement && node.current.disabled) {\n return\n }\n\n if (node.animationState && props.whileTap) {\n node.animationState.setActive(\"whileTap\", lifecycle === \"Start\")\n }\n\n const eventName = (\"onTap\" + (lifecycle === \"End\" ? \"\" : lifecycle)) as\n | \"onTapStart\"\n | \"onTap\"\n | \"onTapCancel\"\n\n const callback = props[eventName]\n if (callback) {\n frame.postRender(() => callback(event, extractEventInfo(event)))\n }\n}\n\nexport class PressGesture extends Feature<Element> {\n mount() {\n const { current } = this.node\n if (!current) return\n\n const { globalTapTarget, propagate } = this.node.props\n\n this.unmount = press(\n current,\n (_element, startEvent) => {\n handlePressEvent(this.node, startEvent, \"Start\")\n\n return (endEvent, { success }) =>\n handlePressEvent(\n this.node,\n endEvent,\n success ? \"End\" : \"Cancel\"\n )\n },\n {\n useGlobalTarget: globalTapTarget,\n stopPropagation: propagate?.tap === false,\n }\n )\n }\n\n unmount() {}\n}\n"],"names":[],"mappings":";;;AAGA,SAAS,gBAAgB,CACrB,IAA4B,EAC5B,KAAmB,EACnB,SAAqC,EAAA;AAErC,IAAA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI;AAEtB,IAAA,IAAI,IAAI,CAAC,OAAO,YAAY,iBAAiB,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE;QACpE;IACJ;IAEA,IAAI,IAAI,CAAC,cAAc,IAAI,KAAK,CAAC,QAAQ,EAAE;QACvC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,UAAU,EAAE,SAAS,KAAK,OAAO,CAAC;IACpE;AAEA,IAAA,MAAM,SAAS,IAAI,OAAO,IAAI,SAAS,KAAK,KAAK,GAAG,EAAE,GAAG,SAAS,CAAC,CAGhD;AAEnB,IAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC;IACjC,IAAI,QAAQ,EAAE;AACV,QAAA,KAAK,CAAC,UAAU,CAAC,MAAM,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC;IACpE;AACJ;AAEM,MAAO,YAAa,SAAQ,OAAgB,CAAA;IAC9C,KAAK,GAAA;AACD,QAAA,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,IAAI;AAC7B,QAAA,IAAI,CAAC,OAAO;YAAE;QAEd,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK;AAEtD,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAChB,OAAO,EACP,CAAC,QAAQ,EAAE,UAAU,KAAI;YACrB,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,EAAE,OAAO,CAAC;YAEhD,OAAO,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,KACzB,gBAAgB,CACZ,IAAI,CAAC,IAAI,EACT,QAAQ,EACR,OAAO,GAAG,KAAK,GAAG,QAAQ,CAC7B;AACT,QAAA,CAAC,EACD;AACI,YAAA,eAAe,EAAE,eAAe;AAChC,YAAA,eAAe,EAAE,SAAS,EAAE,GAAG,KAAK,KAAK;AAC5C,SAAA,CACJ;IACL;AAEA,IAAA,OAAO,KAAI;AACd;;;;"}