Initial commit
This commit is contained in:
477
node_modules/framer-motion/dist/es/render/VisualElement.mjs
generated
vendored
Normal file
477
node_modules/framer-motion/dist/es/render/VisualElement.mjs
generated
vendored
Normal file
@ -0,0 +1,477 @@
|
||||
import { initPrefersReducedMotion } from '../utils/reduced-motion/index.mjs';
|
||||
import { hasReducedMotionListener, prefersReducedMotion } from '../utils/reduced-motion/state.mjs';
|
||||
import { SubscriptionManager } from '../utils/subscription-manager.mjs';
|
||||
import { motionValue } from '../value/index.mjs';
|
||||
import { isMotionValue } from '../value/utils/is-motion-value.mjs';
|
||||
import { transformProps } from './html/utils/transform.mjs';
|
||||
import { isControllingVariants, isVariantNode } from './utils/is-controlling-variants.mjs';
|
||||
import { updateMotionValuesFromProps } from './utils/motion-values.mjs';
|
||||
import { resolveVariantFromProps } from './utils/resolve-variants.mjs';
|
||||
import { warnOnce } from '../utils/warn-once.mjs';
|
||||
import { featureDefinitions } from '../motion/features/definitions.mjs';
|
||||
import { visualElementStore } from './store.mjs';
|
||||
import { KeyframeResolver } from './utils/KeyframesResolver.mjs';
|
||||
import { isNumericalString } from '../utils/is-numerical-string.mjs';
|
||||
import { isZeroValueString } from '../utils/is-zero-value-string.mjs';
|
||||
import { findValueType } from './dom/value-types/find.mjs';
|
||||
import { complex } from '../value/types/complex/index.mjs';
|
||||
import { getAnimatableNone } from './dom/value-types/animatable-none.mjs';
|
||||
import { createBox } from '../projection/geometry/models.mjs';
|
||||
import { time } from '../frameloop/sync-time.mjs';
|
||||
import { frame, cancelFrame } from '../frameloop/frame.mjs';
|
||||
|
||||
const propEventHandlers = [
|
||||
"AnimationStart",
|
||||
"AnimationComplete",
|
||||
"Update",
|
||||
"BeforeLayoutMeasure",
|
||||
"LayoutMeasure",
|
||||
"LayoutAnimationStart",
|
||||
"LayoutAnimationComplete",
|
||||
];
|
||||
/**
|
||||
* A VisualElement is an imperative abstraction around UI elements such as
|
||||
* HTMLElement, SVGElement, Three.Object3D etc.
|
||||
*/
|
||||
class VisualElement {
|
||||
/**
|
||||
* This method takes React props and returns found MotionValues. For example, HTML
|
||||
* MotionValues will be found within the style prop, whereas for Three.js within attribute arrays.
|
||||
*
|
||||
* This isn't an abstract method as it needs calling in the constructor, but it is
|
||||
* intended to be one.
|
||||
*/
|
||||
scrapeMotionValuesFromProps(_props, _prevProps, _visualElement) {
|
||||
return {};
|
||||
}
|
||||
constructor({ parent, props, presenceContext, reducedMotionConfig, blockInitialAnimation, visualState, }, options = {}) {
|
||||
/**
|
||||
* A reference to the current underlying Instance, e.g. a HTMLElement
|
||||
* or Three.Mesh etc.
|
||||
*/
|
||||
this.current = null;
|
||||
/**
|
||||
* A set containing references to this VisualElement's children.
|
||||
*/
|
||||
this.children = new Set();
|
||||
/**
|
||||
* Determine what role this visual element should take in the variant tree.
|
||||
*/
|
||||
this.isVariantNode = false;
|
||||
this.isControllingVariants = false;
|
||||
/**
|
||||
* Decides whether this VisualElement should animate in reduced motion
|
||||
* mode.
|
||||
*
|
||||
* TODO: This is currently set on every individual VisualElement but feels
|
||||
* like it could be set globally.
|
||||
*/
|
||||
this.shouldReduceMotion = null;
|
||||
/**
|
||||
* A map of all motion values attached to this visual element. Motion
|
||||
* values are source of truth for any given animated value. A motion
|
||||
* value might be provided externally by the component via props.
|
||||
*/
|
||||
this.values = new Map();
|
||||
this.KeyframeResolver = KeyframeResolver;
|
||||
/**
|
||||
* Cleanup functions for active features (hover/tap/exit etc)
|
||||
*/
|
||||
this.features = {};
|
||||
/**
|
||||
* A map of every subscription that binds the provided or generated
|
||||
* motion values onChange listeners to this visual element.
|
||||
*/
|
||||
this.valueSubscriptions = new Map();
|
||||
/**
|
||||
* A reference to the previously-provided motion values as returned
|
||||
* from scrapeMotionValuesFromProps. We use the keys in here to determine
|
||||
* if any motion values need to be removed after props are updated.
|
||||
*/
|
||||
this.prevMotionValues = {};
|
||||
/**
|
||||
* An object containing a SubscriptionManager for each active event.
|
||||
*/
|
||||
this.events = {};
|
||||
/**
|
||||
* An object containing an unsubscribe function for each prop event subscription.
|
||||
* For example, every "Update" event can have multiple subscribers via
|
||||
* VisualElement.on(), but only one of those can be defined via the onUpdate prop.
|
||||
*/
|
||||
this.propEventSubscriptions = {};
|
||||
this.notifyUpdate = () => this.notify("Update", this.latestValues);
|
||||
this.render = () => {
|
||||
if (!this.current)
|
||||
return;
|
||||
this.triggerBuild();
|
||||
this.renderInstance(this.current, this.renderState, this.props.style, this.projection);
|
||||
};
|
||||
this.renderScheduledAt = 0.0;
|
||||
this.scheduleRender = () => {
|
||||
const now = time.now();
|
||||
if (this.renderScheduledAt < now) {
|
||||
this.renderScheduledAt = now;
|
||||
frame.render(this.render, false, true);
|
||||
}
|
||||
};
|
||||
const { latestValues, renderState } = visualState;
|
||||
this.latestValues = latestValues;
|
||||
this.baseTarget = { ...latestValues };
|
||||
this.initialValues = props.initial ? { ...latestValues } : {};
|
||||
this.renderState = renderState;
|
||||
this.parent = parent;
|
||||
this.props = props;
|
||||
this.presenceContext = presenceContext;
|
||||
this.depth = parent ? parent.depth + 1 : 0;
|
||||
this.reducedMotionConfig = reducedMotionConfig;
|
||||
this.options = options;
|
||||
this.blockInitialAnimation = Boolean(blockInitialAnimation);
|
||||
this.isControllingVariants = isControllingVariants(props);
|
||||
this.isVariantNode = isVariantNode(props);
|
||||
if (this.isVariantNode) {
|
||||
this.variantChildren = new Set();
|
||||
}
|
||||
this.manuallyAnimateOnMount = Boolean(parent && parent.current);
|
||||
/**
|
||||
* Any motion values that are provided to the element when created
|
||||
* aren't yet bound to the element, as this would technically be impure.
|
||||
* However, we iterate through the motion values and set them to the
|
||||
* initial values for this component.
|
||||
*
|
||||
* TODO: This is impure and we should look at changing this to run on mount.
|
||||
* Doing so will break some tests but this isn't necessarily a breaking change,
|
||||
* more a reflection of the test.
|
||||
*/
|
||||
const { willChange, ...initialMotionValues } = this.scrapeMotionValuesFromProps(props, {}, this);
|
||||
for (const key in initialMotionValues) {
|
||||
const value = initialMotionValues[key];
|
||||
if (latestValues[key] !== undefined && isMotionValue(value)) {
|
||||
value.set(latestValues[key], false);
|
||||
}
|
||||
}
|
||||
}
|
||||
mount(instance) {
|
||||
this.current = instance;
|
||||
visualElementStore.set(instance, this);
|
||||
if (this.projection && !this.projection.instance) {
|
||||
this.projection.mount(instance);
|
||||
}
|
||||
if (this.parent && this.isVariantNode && !this.isControllingVariants) {
|
||||
this.removeFromVariantTree = this.parent.addVariantChild(this);
|
||||
}
|
||||
this.values.forEach((value, key) => this.bindToMotionValue(key, value));
|
||||
if (!hasReducedMotionListener.current) {
|
||||
initPrefersReducedMotion();
|
||||
}
|
||||
this.shouldReduceMotion =
|
||||
this.reducedMotionConfig === "never"
|
||||
? false
|
||||
: this.reducedMotionConfig === "always"
|
||||
? true
|
||||
: prefersReducedMotion.current;
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
warnOnce(this.shouldReduceMotion !== true, "You have Reduced Motion enabled on your device. Animations may not appear as expected.");
|
||||
}
|
||||
if (this.parent)
|
||||
this.parent.children.add(this);
|
||||
this.update(this.props, this.presenceContext);
|
||||
}
|
||||
unmount() {
|
||||
visualElementStore.delete(this.current);
|
||||
this.projection && this.projection.unmount();
|
||||
cancelFrame(this.notifyUpdate);
|
||||
cancelFrame(this.render);
|
||||
this.valueSubscriptions.forEach((remove) => remove());
|
||||
this.valueSubscriptions.clear();
|
||||
this.removeFromVariantTree && this.removeFromVariantTree();
|
||||
this.parent && this.parent.children.delete(this);
|
||||
for (const key in this.events) {
|
||||
this.events[key].clear();
|
||||
}
|
||||
for (const key in this.features) {
|
||||
const feature = this.features[key];
|
||||
if (feature) {
|
||||
feature.unmount();
|
||||
feature.isMounted = false;
|
||||
}
|
||||
}
|
||||
this.current = null;
|
||||
}
|
||||
bindToMotionValue(key, value) {
|
||||
if (this.valueSubscriptions.has(key)) {
|
||||
this.valueSubscriptions.get(key)();
|
||||
}
|
||||
const valueIsTransform = transformProps.has(key);
|
||||
const removeOnChange = value.on("change", (latestValue) => {
|
||||
this.latestValues[key] = latestValue;
|
||||
this.props.onUpdate && frame.preRender(this.notifyUpdate);
|
||||
if (valueIsTransform && this.projection) {
|
||||
this.projection.isTransformDirty = true;
|
||||
}
|
||||
});
|
||||
const removeOnRenderRequest = value.on("renderRequest", this.scheduleRender);
|
||||
let removeSyncCheck;
|
||||
if (window.MotionCheckAppearSync) {
|
||||
removeSyncCheck = window.MotionCheckAppearSync(this, key, value);
|
||||
}
|
||||
this.valueSubscriptions.set(key, () => {
|
||||
removeOnChange();
|
||||
removeOnRenderRequest();
|
||||
if (removeSyncCheck)
|
||||
removeSyncCheck();
|
||||
if (value.owner)
|
||||
value.stop();
|
||||
});
|
||||
}
|
||||
sortNodePosition(other) {
|
||||
/**
|
||||
* If these nodes aren't even of the same type we can't compare their depth.
|
||||
*/
|
||||
if (!this.current ||
|
||||
!this.sortInstanceNodePosition ||
|
||||
this.type !== other.type) {
|
||||
return 0;
|
||||
}
|
||||
return this.sortInstanceNodePosition(this.current, other.current);
|
||||
}
|
||||
updateFeatures() {
|
||||
let key = "animation";
|
||||
for (key in featureDefinitions) {
|
||||
const featureDefinition = featureDefinitions[key];
|
||||
if (!featureDefinition)
|
||||
continue;
|
||||
const { isEnabled, Feature: FeatureConstructor } = featureDefinition;
|
||||
/**
|
||||
* If this feature is enabled but not active, make a new instance.
|
||||
*/
|
||||
if (!this.features[key] &&
|
||||
FeatureConstructor &&
|
||||
isEnabled(this.props)) {
|
||||
this.features[key] = new FeatureConstructor(this);
|
||||
}
|
||||
/**
|
||||
* If we have a feature, mount or update it.
|
||||
*/
|
||||
if (this.features[key]) {
|
||||
const feature = this.features[key];
|
||||
if (feature.isMounted) {
|
||||
feature.update();
|
||||
}
|
||||
else {
|
||||
feature.mount();
|
||||
feature.isMounted = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
triggerBuild() {
|
||||
this.build(this.renderState, this.latestValues, this.props);
|
||||
}
|
||||
/**
|
||||
* Measure the current viewport box with or without transforms.
|
||||
* Only measures axis-aligned boxes, rotate and skew must be manually
|
||||
* removed with a re-render to work.
|
||||
*/
|
||||
measureViewportBox() {
|
||||
return this.current
|
||||
? this.measureInstanceViewportBox(this.current, this.props)
|
||||
: createBox();
|
||||
}
|
||||
getStaticValue(key) {
|
||||
return this.latestValues[key];
|
||||
}
|
||||
setStaticValue(key, value) {
|
||||
this.latestValues[key] = value;
|
||||
}
|
||||
/**
|
||||
* Update the provided props. Ensure any newly-added motion values are
|
||||
* added to our map, old ones removed, and listeners updated.
|
||||
*/
|
||||
update(props, presenceContext) {
|
||||
if (props.transformTemplate || this.props.transformTemplate) {
|
||||
this.scheduleRender();
|
||||
}
|
||||
this.prevProps = this.props;
|
||||
this.props = props;
|
||||
this.prevPresenceContext = this.presenceContext;
|
||||
this.presenceContext = presenceContext;
|
||||
/**
|
||||
* Update prop event handlers ie onAnimationStart, onAnimationComplete
|
||||
*/
|
||||
for (let i = 0; i < propEventHandlers.length; i++) {
|
||||
const key = propEventHandlers[i];
|
||||
if (this.propEventSubscriptions[key]) {
|
||||
this.propEventSubscriptions[key]();
|
||||
delete this.propEventSubscriptions[key];
|
||||
}
|
||||
const listenerName = ("on" + key);
|
||||
const listener = props[listenerName];
|
||||
if (listener) {
|
||||
this.propEventSubscriptions[key] = this.on(key, listener);
|
||||
}
|
||||
}
|
||||
this.prevMotionValues = updateMotionValuesFromProps(this, this.scrapeMotionValuesFromProps(props, this.prevProps, this), this.prevMotionValues);
|
||||
if (this.handleChildMotionValue) {
|
||||
this.handleChildMotionValue();
|
||||
}
|
||||
}
|
||||
getProps() {
|
||||
return this.props;
|
||||
}
|
||||
/**
|
||||
* Returns the variant definition with a given name.
|
||||
*/
|
||||
getVariant(name) {
|
||||
return this.props.variants ? this.props.variants[name] : undefined;
|
||||
}
|
||||
/**
|
||||
* Returns the defined default transition on this component.
|
||||
*/
|
||||
getDefaultTransition() {
|
||||
return this.props.transition;
|
||||
}
|
||||
getTransformPagePoint() {
|
||||
return this.props.transformPagePoint;
|
||||
}
|
||||
getClosestVariantNode() {
|
||||
return this.isVariantNode
|
||||
? this
|
||||
: this.parent
|
||||
? this.parent.getClosestVariantNode()
|
||||
: undefined;
|
||||
}
|
||||
/**
|
||||
* Add a child visual element to our set of children.
|
||||
*/
|
||||
addVariantChild(child) {
|
||||
const closestVariantNode = this.getClosestVariantNode();
|
||||
if (closestVariantNode) {
|
||||
closestVariantNode.variantChildren &&
|
||||
closestVariantNode.variantChildren.add(child);
|
||||
return () => closestVariantNode.variantChildren.delete(child);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Add a motion value and bind it to this visual element.
|
||||
*/
|
||||
addValue(key, value) {
|
||||
// Remove existing value if it exists
|
||||
const existingValue = this.values.get(key);
|
||||
if (value !== existingValue) {
|
||||
if (existingValue)
|
||||
this.removeValue(key);
|
||||
this.bindToMotionValue(key, value);
|
||||
this.values.set(key, value);
|
||||
this.latestValues[key] = value.get();
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Remove a motion value and unbind any active subscriptions.
|
||||
*/
|
||||
removeValue(key) {
|
||||
this.values.delete(key);
|
||||
const unsubscribe = this.valueSubscriptions.get(key);
|
||||
if (unsubscribe) {
|
||||
unsubscribe();
|
||||
this.valueSubscriptions.delete(key);
|
||||
}
|
||||
delete this.latestValues[key];
|
||||
this.removeValueFromRenderState(key, this.renderState);
|
||||
}
|
||||
/**
|
||||
* Check whether we have a motion value for this key
|
||||
*/
|
||||
hasValue(key) {
|
||||
return this.values.has(key);
|
||||
}
|
||||
getValue(key, defaultValue) {
|
||||
if (this.props.values && this.props.values[key]) {
|
||||
return this.props.values[key];
|
||||
}
|
||||
let value = this.values.get(key);
|
||||
if (value === undefined && defaultValue !== undefined) {
|
||||
value = motionValue(defaultValue === null ? undefined : defaultValue, { owner: this });
|
||||
this.addValue(key, value);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
/**
|
||||
* If we're trying to animate to a previously unencountered value,
|
||||
* we need to check for it in our state and as a last resort read it
|
||||
* directly from the instance (which might have performance implications).
|
||||
*/
|
||||
readValue(key, target) {
|
||||
var _a;
|
||||
let value = this.latestValues[key] !== undefined || !this.current
|
||||
? this.latestValues[key]
|
||||
: (_a = this.getBaseTargetFromProps(this.props, key)) !== null && _a !== void 0 ? _a : this.readValueFromInstance(this.current, key, this.options);
|
||||
if (value !== undefined && value !== null) {
|
||||
if (typeof value === "string" &&
|
||||
(isNumericalString(value) || isZeroValueString(value))) {
|
||||
// If this is a number read as a string, ie "0" or "200", convert it to a number
|
||||
value = parseFloat(value);
|
||||
}
|
||||
else if (!findValueType(value) && complex.test(target)) {
|
||||
value = getAnimatableNone(key, target);
|
||||
}
|
||||
this.setBaseTarget(key, isMotionValue(value) ? value.get() : value);
|
||||
}
|
||||
return isMotionValue(value) ? value.get() : value;
|
||||
}
|
||||
/**
|
||||
* Set the base target to later animate back to. This is currently
|
||||
* only hydrated on creation and when we first read a value.
|
||||
*/
|
||||
setBaseTarget(key, value) {
|
||||
this.baseTarget[key] = value;
|
||||
}
|
||||
/**
|
||||
* Find the base target for a value thats been removed from all animation
|
||||
* props.
|
||||
*/
|
||||
getBaseTarget(key) {
|
||||
var _a;
|
||||
const { initial } = this.props;
|
||||
let valueFromInitial;
|
||||
if (typeof initial === "string" || typeof initial === "object") {
|
||||
const variant = resolveVariantFromProps(this.props, initial, (_a = this.presenceContext) === null || _a === void 0 ? void 0 : _a.custom);
|
||||
if (variant) {
|
||||
valueFromInitial = variant[key];
|
||||
}
|
||||
}
|
||||
/**
|
||||
* If this value still exists in the current initial variant, read that.
|
||||
*/
|
||||
if (initial && valueFromInitial !== undefined) {
|
||||
return valueFromInitial;
|
||||
}
|
||||
/**
|
||||
* Alternatively, if this VisualElement config has defined a getBaseTarget
|
||||
* so we can read the value from an alternative source, try that.
|
||||
*/
|
||||
const target = this.getBaseTargetFromProps(this.props, key);
|
||||
if (target !== undefined && !isMotionValue(target))
|
||||
return target;
|
||||
/**
|
||||
* If the value was initially defined on initial, but it doesn't any more,
|
||||
* return undefined. Otherwise return the value as initially read from the DOM.
|
||||
*/
|
||||
return this.initialValues[key] !== undefined &&
|
||||
valueFromInitial === undefined
|
||||
? undefined
|
||||
: this.baseTarget[key];
|
||||
}
|
||||
on(eventName, callback) {
|
||||
if (!this.events[eventName]) {
|
||||
this.events[eventName] = new SubscriptionManager();
|
||||
}
|
||||
return this.events[eventName].add(callback);
|
||||
}
|
||||
notify(eventName, ...args) {
|
||||
if (this.events[eventName]) {
|
||||
this.events[eventName].notify(...args);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { VisualElement };
|
||||
23
node_modules/framer-motion/dist/es/render/components/create-factory.mjs
generated
vendored
Normal file
23
node_modules/framer-motion/dist/es/render/components/create-factory.mjs
generated
vendored
Normal file
@ -0,0 +1,23 @@
|
||||
import { createRendererMotionComponent } from '../../motion/index.mjs';
|
||||
import { isSVGComponent } from '../dom/utils/is-svg-component.mjs';
|
||||
import { svgMotionConfig } from '../svg/config-motion.mjs';
|
||||
import { htmlMotionConfig } from '../html/config-motion.mjs';
|
||||
import { createUseRender } from '../dom/use-render.mjs';
|
||||
|
||||
function createMotionComponentFactory(preloadedFeatures, createVisualElement) {
|
||||
return function createMotionComponent(Component, { forwardMotionProps } = { forwardMotionProps: false }) {
|
||||
const baseConfig = isSVGComponent(Component)
|
||||
? svgMotionConfig
|
||||
: htmlMotionConfig;
|
||||
const config = {
|
||||
...baseConfig,
|
||||
preloadedFeatures,
|
||||
useRender: createUseRender(forwardMotionProps),
|
||||
createVisualElement,
|
||||
Component,
|
||||
};
|
||||
return createRendererMotionComponent(config);
|
||||
};
|
||||
}
|
||||
|
||||
export { createMotionComponentFactory };
|
||||
38
node_modules/framer-motion/dist/es/render/components/create-proxy.mjs
generated
vendored
Normal file
38
node_modules/framer-motion/dist/es/render/components/create-proxy.mjs
generated
vendored
Normal file
@ -0,0 +1,38 @@
|
||||
import { warnOnce } from '../../utils/warn-once.mjs';
|
||||
|
||||
function createDOMMotionComponentProxy(componentFactory) {
|
||||
if (typeof Proxy === "undefined") {
|
||||
return componentFactory;
|
||||
}
|
||||
/**
|
||||
* A cache of generated `motion` components, e.g `motion.div`, `motion.input` etc.
|
||||
* Rather than generating them anew every render.
|
||||
*/
|
||||
const componentCache = new Map();
|
||||
const deprecatedFactoryFunction = (...args) => {
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
warnOnce(false, "motion() is deprecated. Use motion.create() instead.");
|
||||
}
|
||||
return componentFactory(...args);
|
||||
};
|
||||
return new Proxy(deprecatedFactoryFunction, {
|
||||
/**
|
||||
* Called when `motion` is referenced with a prop: `motion.div`, `motion.input` etc.
|
||||
* The prop name is passed through as `key` and we can use that to generate a `motion`
|
||||
* DOM component with that name.
|
||||
*/
|
||||
get: (_target, key) => {
|
||||
if (key === "create")
|
||||
return componentFactory;
|
||||
/**
|
||||
* If this element doesn't exist in the component cache, create it and cache.
|
||||
*/
|
||||
if (!componentCache.has(key)) {
|
||||
componentCache.set(key, componentFactory(key));
|
||||
}
|
||||
return componentCache.get(key);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
export { createDOMMotionComponentProxy };
|
||||
6
node_modules/framer-motion/dist/es/render/components/m/create.mjs
generated
vendored
Normal file
6
node_modules/framer-motion/dist/es/render/components/m/create.mjs
generated
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
import { createMotionComponentFactory } from '../create-factory.mjs';
|
||||
|
||||
const createMinimalMotionComponent =
|
||||
/*@__PURE__*/ createMotionComponentFactory();
|
||||
|
||||
export { createMinimalMotionComponent };
|
||||
227
node_modules/framer-motion/dist/es/render/components/m/elements.mjs
generated
vendored
Normal file
227
node_modules/framer-motion/dist/es/render/components/m/elements.mjs
generated
vendored
Normal file
@ -0,0 +1,227 @@
|
||||
"use client";
|
||||
import { createMinimalMotionComponent } from './create.mjs';
|
||||
|
||||
/**
|
||||
* HTML components
|
||||
*/
|
||||
const MotionA = /*@__PURE__*/ createMinimalMotionComponent("a");
|
||||
const MotionAbbr = /*@__PURE__*/ createMinimalMotionComponent("abbr");
|
||||
const MotionAddress =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("address");
|
||||
const MotionArea = /*@__PURE__*/ createMinimalMotionComponent("area");
|
||||
const MotionArticle =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("article");
|
||||
const MotionAside = /*@__PURE__*/ createMinimalMotionComponent("aside");
|
||||
const MotionAudio = /*@__PURE__*/ createMinimalMotionComponent("audio");
|
||||
const MotionB = /*@__PURE__*/ createMinimalMotionComponent("b");
|
||||
const MotionBase = /*@__PURE__*/ createMinimalMotionComponent("base");
|
||||
const MotionBdi = /*@__PURE__*/ createMinimalMotionComponent("bdi");
|
||||
const MotionBdo = /*@__PURE__*/ createMinimalMotionComponent("bdo");
|
||||
const MotionBig = /*@__PURE__*/ createMinimalMotionComponent("big");
|
||||
const MotionBlockquote =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("blockquote");
|
||||
const MotionBody = /*@__PURE__*/ createMinimalMotionComponent("body");
|
||||
const MotionButton = /*@__PURE__*/ createMinimalMotionComponent("button");
|
||||
const MotionCanvas = /*@__PURE__*/ createMinimalMotionComponent("canvas");
|
||||
const MotionCaption =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("caption");
|
||||
const MotionCite = /*@__PURE__*/ createMinimalMotionComponent("cite");
|
||||
const MotionCode = /*@__PURE__*/ createMinimalMotionComponent("code");
|
||||
const MotionCol = /*@__PURE__*/ createMinimalMotionComponent("col");
|
||||
const MotionColgroup =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("colgroup");
|
||||
const MotionData = /*@__PURE__*/ createMinimalMotionComponent("data");
|
||||
const MotionDatalist =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("datalist");
|
||||
const MotionDd = /*@__PURE__*/ createMinimalMotionComponent("dd");
|
||||
const MotionDel = /*@__PURE__*/ createMinimalMotionComponent("del");
|
||||
const MotionDetails =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("details");
|
||||
const MotionDfn = /*@__PURE__*/ createMinimalMotionComponent("dfn");
|
||||
const MotionDialog = /*@__PURE__*/ createMinimalMotionComponent("dialog");
|
||||
const MotionDiv = /*@__PURE__*/ createMinimalMotionComponent("div");
|
||||
const MotionDl = /*@__PURE__*/ createMinimalMotionComponent("dl");
|
||||
const MotionDt = /*@__PURE__*/ createMinimalMotionComponent("dt");
|
||||
const MotionEm = /*@__PURE__*/ createMinimalMotionComponent("em");
|
||||
const MotionEmbed = /*@__PURE__*/ createMinimalMotionComponent("embed");
|
||||
const MotionFieldset =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("fieldset");
|
||||
const MotionFigcaption =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("figcaption");
|
||||
const MotionFigure = /*@__PURE__*/ createMinimalMotionComponent("figure");
|
||||
const MotionFooter = /*@__PURE__*/ createMinimalMotionComponent("footer");
|
||||
const MotionForm = /*@__PURE__*/ createMinimalMotionComponent("form");
|
||||
const MotionH1 = /*@__PURE__*/ createMinimalMotionComponent("h1");
|
||||
const MotionH2 = /*@__PURE__*/ createMinimalMotionComponent("h2");
|
||||
const MotionH3 = /*@__PURE__*/ createMinimalMotionComponent("h3");
|
||||
const MotionH4 = /*@__PURE__*/ createMinimalMotionComponent("h4");
|
||||
const MotionH5 = /*@__PURE__*/ createMinimalMotionComponent("h5");
|
||||
const MotionH6 = /*@__PURE__*/ createMinimalMotionComponent("h6");
|
||||
const MotionHead = /*@__PURE__*/ createMinimalMotionComponent("head");
|
||||
const MotionHeader = /*@__PURE__*/ createMinimalMotionComponent("header");
|
||||
const MotionHgroup = /*@__PURE__*/ createMinimalMotionComponent("hgroup");
|
||||
const MotionHr = /*@__PURE__*/ createMinimalMotionComponent("hr");
|
||||
const MotionHtml = /*@__PURE__*/ createMinimalMotionComponent("html");
|
||||
const MotionI = /*@__PURE__*/ createMinimalMotionComponent("i");
|
||||
const MotionIframe = /*@__PURE__*/ createMinimalMotionComponent("iframe");
|
||||
const MotionImg = /*@__PURE__*/ createMinimalMotionComponent("img");
|
||||
const MotionInput = /*@__PURE__*/ createMinimalMotionComponent("input");
|
||||
const MotionIns = /*@__PURE__*/ createMinimalMotionComponent("ins");
|
||||
const MotionKbd = /*@__PURE__*/ createMinimalMotionComponent("kbd");
|
||||
const MotionKeygen = /*@__PURE__*/ createMinimalMotionComponent("keygen");
|
||||
const MotionLabel = /*@__PURE__*/ createMinimalMotionComponent("label");
|
||||
const MotionLegend = /*@__PURE__*/ createMinimalMotionComponent("legend");
|
||||
const MotionLi = /*@__PURE__*/ createMinimalMotionComponent("li");
|
||||
const MotionLink = /*@__PURE__*/ createMinimalMotionComponent("link");
|
||||
const MotionMain = /*@__PURE__*/ createMinimalMotionComponent("main");
|
||||
const MotionMap = /*@__PURE__*/ createMinimalMotionComponent("map");
|
||||
const MotionMark = /*@__PURE__*/ createMinimalMotionComponent("mark");
|
||||
const MotionMenu = /*@__PURE__*/ createMinimalMotionComponent("menu");
|
||||
const MotionMenuitem =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("menuitem");
|
||||
const MotionMeter = /*@__PURE__*/ createMinimalMotionComponent("meter");
|
||||
const MotionNav = /*@__PURE__*/ createMinimalMotionComponent("nav");
|
||||
const MotionObject = /*@__PURE__*/ createMinimalMotionComponent("object");
|
||||
const MotionOl = /*@__PURE__*/ createMinimalMotionComponent("ol");
|
||||
const MotionOptgroup =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("optgroup");
|
||||
const MotionOption = /*@__PURE__*/ createMinimalMotionComponent("option");
|
||||
const MotionOutput = /*@__PURE__*/ createMinimalMotionComponent("output");
|
||||
const MotionP = /*@__PURE__*/ createMinimalMotionComponent("p");
|
||||
const MotionParam = /*@__PURE__*/ createMinimalMotionComponent("param");
|
||||
const MotionPicture =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("picture");
|
||||
const MotionPre = /*@__PURE__*/ createMinimalMotionComponent("pre");
|
||||
const MotionProgress =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("progress");
|
||||
const MotionQ = /*@__PURE__*/ createMinimalMotionComponent("q");
|
||||
const MotionRp = /*@__PURE__*/ createMinimalMotionComponent("rp");
|
||||
const MotionRt = /*@__PURE__*/ createMinimalMotionComponent("rt");
|
||||
const MotionRuby = /*@__PURE__*/ createMinimalMotionComponent("ruby");
|
||||
const MotionS = /*@__PURE__*/ createMinimalMotionComponent("s");
|
||||
const MotionSamp = /*@__PURE__*/ createMinimalMotionComponent("samp");
|
||||
const MotionScript = /*@__PURE__*/ createMinimalMotionComponent("script");
|
||||
const MotionSection =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("section");
|
||||
const MotionSelect = /*@__PURE__*/ createMinimalMotionComponent("select");
|
||||
const MotionSmall = /*@__PURE__*/ createMinimalMotionComponent("small");
|
||||
const MotionSource = /*@__PURE__*/ createMinimalMotionComponent("source");
|
||||
const MotionSpan = /*@__PURE__*/ createMinimalMotionComponent("span");
|
||||
const MotionStrong = /*@__PURE__*/ createMinimalMotionComponent("strong");
|
||||
const MotionStyle = /*@__PURE__*/ createMinimalMotionComponent("style");
|
||||
const MotionSub = /*@__PURE__*/ createMinimalMotionComponent("sub");
|
||||
const MotionSummary =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("summary");
|
||||
const MotionSup = /*@__PURE__*/ createMinimalMotionComponent("sup");
|
||||
const MotionTable = /*@__PURE__*/ createMinimalMotionComponent("table");
|
||||
const MotionTbody = /*@__PURE__*/ createMinimalMotionComponent("tbody");
|
||||
const MotionTd = /*@__PURE__*/ createMinimalMotionComponent("td");
|
||||
const MotionTextarea =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("textarea");
|
||||
const MotionTfoot = /*@__PURE__*/ createMinimalMotionComponent("tfoot");
|
||||
const MotionTh = /*@__PURE__*/ createMinimalMotionComponent("th");
|
||||
const MotionThead = /*@__PURE__*/ createMinimalMotionComponent("thead");
|
||||
const MotionTime = /*@__PURE__*/ createMinimalMotionComponent("time");
|
||||
const MotionTitle = /*@__PURE__*/ createMinimalMotionComponent("title");
|
||||
const MotionTr = /*@__PURE__*/ createMinimalMotionComponent("tr");
|
||||
const MotionTrack = /*@__PURE__*/ createMinimalMotionComponent("track");
|
||||
const MotionU = /*@__PURE__*/ createMinimalMotionComponent("u");
|
||||
const MotionUl = /*@__PURE__*/ createMinimalMotionComponent("ul");
|
||||
const MotionVideo = /*@__PURE__*/ createMinimalMotionComponent("video");
|
||||
const MotionWbr = /*@__PURE__*/ createMinimalMotionComponent("wbr");
|
||||
const MotionWebview =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("webview");
|
||||
/**
|
||||
* SVG components
|
||||
*/
|
||||
const MotionAnimate =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("animate");
|
||||
const MotionCircle = /*@__PURE__*/ createMinimalMotionComponent("circle");
|
||||
const MotionDefs = /*@__PURE__*/ createMinimalMotionComponent("defs");
|
||||
const MotionDesc = /*@__PURE__*/ createMinimalMotionComponent("desc");
|
||||
const MotionEllipse =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("ellipse");
|
||||
const MotionG = /*@__PURE__*/ createMinimalMotionComponent("g");
|
||||
const MotionImage = /*@__PURE__*/ createMinimalMotionComponent("image");
|
||||
const MotionLine = /*@__PURE__*/ createMinimalMotionComponent("line");
|
||||
const MotionFilter = /*@__PURE__*/ createMinimalMotionComponent("filter");
|
||||
const MotionMarker = /*@__PURE__*/ createMinimalMotionComponent("marker");
|
||||
const MotionMask = /*@__PURE__*/ createMinimalMotionComponent("mask");
|
||||
const MotionMetadata =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("metadata");
|
||||
const MotionPath = /*@__PURE__*/ createMinimalMotionComponent("path");
|
||||
const MotionPattern =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("pattern");
|
||||
const MotionPolygon =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("polygon");
|
||||
const MotionPolyline =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("polyline");
|
||||
const MotionRect = /*@__PURE__*/ createMinimalMotionComponent("rect");
|
||||
const MotionStop = /*@__PURE__*/ createMinimalMotionComponent("stop");
|
||||
const MotionSvg = /*@__PURE__*/ createMinimalMotionComponent("svg");
|
||||
const MotionSymbol = /*@__PURE__*/ createMinimalMotionComponent("symbol");
|
||||
const MotionText = /*@__PURE__*/ createMinimalMotionComponent("text");
|
||||
const MotionTspan = /*@__PURE__*/ createMinimalMotionComponent("tspan");
|
||||
const MotionUse = /*@__PURE__*/ createMinimalMotionComponent("use");
|
||||
const MotionView = /*@__PURE__*/ createMinimalMotionComponent("view");
|
||||
const MotionClipPath =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("clipPath");
|
||||
const MotionFeBlend =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feBlend");
|
||||
const MotionFeColorMatrix =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feColorMatrix");
|
||||
const MotionFeComponentTransfer =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feComponentTransfer");
|
||||
const MotionFeComposite =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feComposite");
|
||||
const MotionFeConvolveMatrix =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feConvolveMatrix");
|
||||
const MotionFeDiffuseLighting =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feDiffuseLighting");
|
||||
const MotionFeDisplacementMap =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feDisplacementMap");
|
||||
const MotionFeDistantLight =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feDistantLight");
|
||||
const MotionFeDropShadow =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feDropShadow");
|
||||
const MotionFeFlood =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feFlood");
|
||||
const MotionFeFuncA =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feFuncA");
|
||||
const MotionFeFuncB =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feFuncB");
|
||||
const MotionFeFuncG =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feFuncG");
|
||||
const MotionFeFuncR =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feFuncR");
|
||||
const MotionFeGaussianBlur =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feGaussianBlur");
|
||||
const MotionFeImage =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feImage");
|
||||
const MotionFeMerge =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feMerge");
|
||||
const MotionFeMergeNode =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feMergeNode");
|
||||
const MotionFeMorphology =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feMorphology");
|
||||
const MotionFeOffset =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feOffset");
|
||||
const MotionFePointLight =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("fePointLight");
|
||||
const MotionFeSpecularLighting =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feSpecularLighting");
|
||||
const MotionFeSpotLight =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feSpotLight");
|
||||
const MotionFeTile = /*@__PURE__*/ createMinimalMotionComponent("feTile");
|
||||
const MotionFeTurbulence =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("feTurbulence");
|
||||
const MotionForeignObject =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("foreignObject");
|
||||
const MotionLinearGradient =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("linearGradient");
|
||||
const MotionRadialGradient =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("radialGradient");
|
||||
const MotionTextPath =
|
||||
/*@__PURE__*/ createMinimalMotionComponent("textPath");
|
||||
|
||||
export { MotionA, MotionAbbr, MotionAddress, MotionAnimate, MotionArea, MotionArticle, MotionAside, MotionAudio, MotionB, MotionBase, MotionBdi, MotionBdo, MotionBig, MotionBlockquote, MotionBody, MotionButton, MotionCanvas, MotionCaption, MotionCircle, MotionCite, MotionClipPath, MotionCode, MotionCol, MotionColgroup, MotionData, MotionDatalist, MotionDd, MotionDefs, MotionDel, MotionDesc, MotionDetails, MotionDfn, MotionDialog, MotionDiv, MotionDl, MotionDt, MotionEllipse, MotionEm, MotionEmbed, MotionFeBlend, MotionFeColorMatrix, MotionFeComponentTransfer, MotionFeComposite, MotionFeConvolveMatrix, MotionFeDiffuseLighting, MotionFeDisplacementMap, MotionFeDistantLight, MotionFeDropShadow, MotionFeFlood, MotionFeFuncA, MotionFeFuncB, MotionFeFuncG, MotionFeFuncR, MotionFeGaussianBlur, MotionFeImage, MotionFeMerge, MotionFeMergeNode, MotionFeMorphology, MotionFeOffset, MotionFePointLight, MotionFeSpecularLighting, MotionFeSpotLight, MotionFeTile, MotionFeTurbulence, MotionFieldset, MotionFigcaption, MotionFigure, MotionFilter, MotionFooter, MotionForeignObject, MotionForm, MotionG, MotionH1, MotionH2, MotionH3, MotionH4, MotionH5, MotionH6, MotionHead, MotionHeader, MotionHgroup, MotionHr, MotionHtml, MotionI, MotionIframe, MotionImage, MotionImg, MotionInput, MotionIns, MotionKbd, MotionKeygen, MotionLabel, MotionLegend, MotionLi, MotionLine, MotionLinearGradient, MotionLink, MotionMain, MotionMap, MotionMark, MotionMarker, MotionMask, MotionMenu, MotionMenuitem, MotionMetadata, MotionMeter, MotionNav, MotionObject, MotionOl, MotionOptgroup, MotionOption, MotionOutput, MotionP, MotionParam, MotionPath, MotionPattern, MotionPicture, MotionPolygon, MotionPolyline, MotionPre, MotionProgress, MotionQ, MotionRadialGradient, MotionRect, MotionRp, MotionRt, MotionRuby, MotionS, MotionSamp, MotionScript, MotionSection, MotionSelect, MotionSmall, MotionSource, MotionSpan, MotionStop, MotionStrong, MotionStyle, MotionSub, MotionSummary, MotionSup, MotionSvg, MotionSymbol, MotionTable, MotionTbody, MotionTd, MotionText, MotionTextPath, MotionTextarea, MotionTfoot, MotionTh, MotionThead, MotionTime, MotionTitle, MotionTr, MotionTrack, MotionTspan, MotionU, MotionUl, MotionUse, MotionVideo, MotionView, MotionWbr, MotionWebview };
|
||||
6
node_modules/framer-motion/dist/es/render/components/m/proxy.mjs
generated
vendored
Normal file
6
node_modules/framer-motion/dist/es/render/components/m/proxy.mjs
generated
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
import { createDOMMotionComponentProxy } from '../create-proxy.mjs';
|
||||
import { createMinimalMotionComponent } from './create.mjs';
|
||||
|
||||
const m = /*@__PURE__*/ createDOMMotionComponentProxy(createMinimalMotionComponent);
|
||||
|
||||
export { m };
|
||||
15
node_modules/framer-motion/dist/es/render/components/motion/create.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/render/components/motion/create.mjs
generated
vendored
Normal file
@ -0,0 +1,15 @@
|
||||
import { animations } from '../../../motion/features/animations.mjs';
|
||||
import { drag } from '../../../motion/features/drag.mjs';
|
||||
import { gestureAnimations } from '../../../motion/features/gestures.mjs';
|
||||
import { layout } from '../../../motion/features/layout.mjs';
|
||||
import { createMotionComponentFactory } from '../create-factory.mjs';
|
||||
import { createDomVisualElement } from '../../dom/create-visual-element.mjs';
|
||||
|
||||
const createMotionComponent = /*@__PURE__*/ createMotionComponentFactory({
|
||||
...animations,
|
||||
...gestureAnimations,
|
||||
...drag,
|
||||
...layout,
|
||||
}, createDomVisualElement);
|
||||
|
||||
export { createMotionComponent };
|
||||
194
node_modules/framer-motion/dist/es/render/components/motion/elements.mjs
generated
vendored
Normal file
194
node_modules/framer-motion/dist/es/render/components/motion/elements.mjs
generated
vendored
Normal file
@ -0,0 +1,194 @@
|
||||
"use client";
|
||||
import { createMotionComponent } from './create.mjs';
|
||||
|
||||
/**
|
||||
* HTML components
|
||||
*/
|
||||
const MotionA = /*@__PURE__*/ createMotionComponent("a");
|
||||
const MotionAbbr = /*@__PURE__*/ createMotionComponent("abbr");
|
||||
const MotionAddress = /*@__PURE__*/ createMotionComponent("address");
|
||||
const MotionArea = /*@__PURE__*/ createMotionComponent("area");
|
||||
const MotionArticle = /*@__PURE__*/ createMotionComponent("article");
|
||||
const MotionAside = /*@__PURE__*/ createMotionComponent("aside");
|
||||
const MotionAudio = /*@__PURE__*/ createMotionComponent("audio");
|
||||
const MotionB = /*@__PURE__*/ createMotionComponent("b");
|
||||
const MotionBase = /*@__PURE__*/ createMotionComponent("base");
|
||||
const MotionBdi = /*@__PURE__*/ createMotionComponent("bdi");
|
||||
const MotionBdo = /*@__PURE__*/ createMotionComponent("bdo");
|
||||
const MotionBig = /*@__PURE__*/ createMotionComponent("big");
|
||||
const MotionBlockquote =
|
||||
/*@__PURE__*/ createMotionComponent("blockquote");
|
||||
const MotionBody = /*@__PURE__*/ createMotionComponent("body");
|
||||
const MotionButton = /*@__PURE__*/ createMotionComponent("button");
|
||||
const MotionCanvas = /*@__PURE__*/ createMotionComponent("canvas");
|
||||
const MotionCaption = /*@__PURE__*/ createMotionComponent("caption");
|
||||
const MotionCite = /*@__PURE__*/ createMotionComponent("cite");
|
||||
const MotionCode = /*@__PURE__*/ createMotionComponent("code");
|
||||
const MotionCol = /*@__PURE__*/ createMotionComponent("col");
|
||||
const MotionColgroup = /*@__PURE__*/ createMotionComponent("colgroup");
|
||||
const MotionData = /*@__PURE__*/ createMotionComponent("data");
|
||||
const MotionDatalist = /*@__PURE__*/ createMotionComponent("datalist");
|
||||
const MotionDd = /*@__PURE__*/ createMotionComponent("dd");
|
||||
const MotionDel = /*@__PURE__*/ createMotionComponent("del");
|
||||
const MotionDetails = /*@__PURE__*/ createMotionComponent("details");
|
||||
const MotionDfn = /*@__PURE__*/ createMotionComponent("dfn");
|
||||
const MotionDialog = /*@__PURE__*/ createMotionComponent("dialog");
|
||||
const MotionDiv = /*@__PURE__*/ createMotionComponent("div");
|
||||
const MotionDl = /*@__PURE__*/ createMotionComponent("dl");
|
||||
const MotionDt = /*@__PURE__*/ createMotionComponent("dt");
|
||||
const MotionEm = /*@__PURE__*/ createMotionComponent("em");
|
||||
const MotionEmbed = /*@__PURE__*/ createMotionComponent("embed");
|
||||
const MotionFieldset = /*@__PURE__*/ createMotionComponent("fieldset");
|
||||
const MotionFigcaption =
|
||||
/*@__PURE__*/ createMotionComponent("figcaption");
|
||||
const MotionFigure = /*@__PURE__*/ createMotionComponent("figure");
|
||||
const MotionFooter = /*@__PURE__*/ createMotionComponent("footer");
|
||||
const MotionForm = /*@__PURE__*/ createMotionComponent("form");
|
||||
const MotionH1 = /*@__PURE__*/ createMotionComponent("h1");
|
||||
const MotionH2 = /*@__PURE__*/ createMotionComponent("h2");
|
||||
const MotionH3 = /*@__PURE__*/ createMotionComponent("h3");
|
||||
const MotionH4 = /*@__PURE__*/ createMotionComponent("h4");
|
||||
const MotionH5 = /*@__PURE__*/ createMotionComponent("h5");
|
||||
const MotionH6 = /*@__PURE__*/ createMotionComponent("h6");
|
||||
const MotionHead = /*@__PURE__*/ createMotionComponent("head");
|
||||
const MotionHeader = /*@__PURE__*/ createMotionComponent("header");
|
||||
const MotionHgroup = /*@__PURE__*/ createMotionComponent("hgroup");
|
||||
const MotionHr = /*@__PURE__*/ createMotionComponent("hr");
|
||||
const MotionHtml = /*@__PURE__*/ createMotionComponent("html");
|
||||
const MotionI = /*@__PURE__*/ createMotionComponent("i");
|
||||
const MotionIframe = /*@__PURE__*/ createMotionComponent("iframe");
|
||||
const MotionImg = /*@__PURE__*/ createMotionComponent("img");
|
||||
const MotionInput = /*@__PURE__*/ createMotionComponent("input");
|
||||
const MotionIns = /*@__PURE__*/ createMotionComponent("ins");
|
||||
const MotionKbd = /*@__PURE__*/ createMotionComponent("kbd");
|
||||
const MotionKeygen = /*@__PURE__*/ createMotionComponent("keygen");
|
||||
const MotionLabel = /*@__PURE__*/ createMotionComponent("label");
|
||||
const MotionLegend = /*@__PURE__*/ createMotionComponent("legend");
|
||||
const MotionLi = /*@__PURE__*/ createMotionComponent("li");
|
||||
const MotionLink = /*@__PURE__*/ createMotionComponent("link");
|
||||
const MotionMain = /*@__PURE__*/ createMotionComponent("main");
|
||||
const MotionMap = /*@__PURE__*/ createMotionComponent("map");
|
||||
const MotionMark = /*@__PURE__*/ createMotionComponent("mark");
|
||||
const MotionMenu = /*@__PURE__*/ createMotionComponent("menu");
|
||||
const MotionMenuitem = /*@__PURE__*/ createMotionComponent("menuitem");
|
||||
const MotionMeter = /*@__PURE__*/ createMotionComponent("meter");
|
||||
const MotionNav = /*@__PURE__*/ createMotionComponent("nav");
|
||||
const MotionObject = /*@__PURE__*/ createMotionComponent("object");
|
||||
const MotionOl = /*@__PURE__*/ createMotionComponent("ol");
|
||||
const MotionOptgroup = /*@__PURE__*/ createMotionComponent("optgroup");
|
||||
const MotionOption = /*@__PURE__*/ createMotionComponent("option");
|
||||
const MotionOutput = /*@__PURE__*/ createMotionComponent("output");
|
||||
const MotionP = /*@__PURE__*/ createMotionComponent("p");
|
||||
const MotionParam = /*@__PURE__*/ createMotionComponent("param");
|
||||
const MotionPicture = /*@__PURE__*/ createMotionComponent("picture");
|
||||
const MotionPre = /*@__PURE__*/ createMotionComponent("pre");
|
||||
const MotionProgress = /*@__PURE__*/ createMotionComponent("progress");
|
||||
const MotionQ = /*@__PURE__*/ createMotionComponent("q");
|
||||
const MotionRp = /*@__PURE__*/ createMotionComponent("rp");
|
||||
const MotionRt = /*@__PURE__*/ createMotionComponent("rt");
|
||||
const MotionRuby = /*@__PURE__*/ createMotionComponent("ruby");
|
||||
const MotionS = /*@__PURE__*/ createMotionComponent("s");
|
||||
const MotionSamp = /*@__PURE__*/ createMotionComponent("samp");
|
||||
const MotionScript = /*@__PURE__*/ createMotionComponent("script");
|
||||
const MotionSection = /*@__PURE__*/ createMotionComponent("section");
|
||||
const MotionSelect = /*@__PURE__*/ createMotionComponent("select");
|
||||
const MotionSmall = /*@__PURE__*/ createMotionComponent("small");
|
||||
const MotionSource = /*@__PURE__*/ createMotionComponent("source");
|
||||
const MotionSpan = /*@__PURE__*/ createMotionComponent("span");
|
||||
const MotionStrong = /*@__PURE__*/ createMotionComponent("strong");
|
||||
const MotionStyle = /*@__PURE__*/ createMotionComponent("style");
|
||||
const MotionSub = /*@__PURE__*/ createMotionComponent("sub");
|
||||
const MotionSummary = /*@__PURE__*/ createMotionComponent("summary");
|
||||
const MotionSup = /*@__PURE__*/ createMotionComponent("sup");
|
||||
const MotionTable = /*@__PURE__*/ createMotionComponent("table");
|
||||
const MotionTbody = /*@__PURE__*/ createMotionComponent("tbody");
|
||||
const MotionTd = /*@__PURE__*/ createMotionComponent("td");
|
||||
const MotionTextarea = /*@__PURE__*/ createMotionComponent("textarea");
|
||||
const MotionTfoot = /*@__PURE__*/ createMotionComponent("tfoot");
|
||||
const MotionTh = /*@__PURE__*/ createMotionComponent("th");
|
||||
const MotionThead = /*@__PURE__*/ createMotionComponent("thead");
|
||||
const MotionTime = /*@__PURE__*/ createMotionComponent("time");
|
||||
const MotionTitle = /*@__PURE__*/ createMotionComponent("title");
|
||||
const MotionTr = /*@__PURE__*/ createMotionComponent("tr");
|
||||
const MotionTrack = /*@__PURE__*/ createMotionComponent("track");
|
||||
const MotionU = /*@__PURE__*/ createMotionComponent("u");
|
||||
const MotionUl = /*@__PURE__*/ createMotionComponent("ul");
|
||||
const MotionVideo = /*@__PURE__*/ createMotionComponent("video");
|
||||
const MotionWbr = /*@__PURE__*/ createMotionComponent("wbr");
|
||||
const MotionWebview = /*@__PURE__*/ createMotionComponent("webview");
|
||||
/**
|
||||
* SVG components
|
||||
*/
|
||||
const MotionAnimate = /*@__PURE__*/ createMotionComponent("animate");
|
||||
const MotionCircle = /*@__PURE__*/ createMotionComponent("circle");
|
||||
const MotionDefs = /*@__PURE__*/ createMotionComponent("defs");
|
||||
const MotionDesc = /*@__PURE__*/ createMotionComponent("desc");
|
||||
const MotionEllipse = /*@__PURE__*/ createMotionComponent("ellipse");
|
||||
const MotionG = /*@__PURE__*/ createMotionComponent("g");
|
||||
const MotionImage = /*@__PURE__*/ createMotionComponent("image");
|
||||
const MotionLine = /*@__PURE__*/ createMotionComponent("line");
|
||||
const MotionFilter = /*@__PURE__*/ createMotionComponent("filter");
|
||||
const MotionMarker = /*@__PURE__*/ createMotionComponent("marker");
|
||||
const MotionMask = /*@__PURE__*/ createMotionComponent("mask");
|
||||
const MotionMetadata = /*@__PURE__*/ createMotionComponent("metadata");
|
||||
const MotionPath = /*@__PURE__*/ createMotionComponent("path");
|
||||
const MotionPattern = /*@__PURE__*/ createMotionComponent("pattern");
|
||||
const MotionPolygon = /*@__PURE__*/ createMotionComponent("polygon");
|
||||
const MotionPolyline = /*@__PURE__*/ createMotionComponent("polyline");
|
||||
const MotionRect = /*@__PURE__*/ createMotionComponent("rect");
|
||||
const MotionStop = /*@__PURE__*/ createMotionComponent("stop");
|
||||
const MotionSvg = /*@__PURE__*/ createMotionComponent("svg");
|
||||
const MotionSymbol = /*@__PURE__*/ createMotionComponent("symbol");
|
||||
const MotionText = /*@__PURE__*/ createMotionComponent("text");
|
||||
const MotionTspan = /*@__PURE__*/ createMotionComponent("tspan");
|
||||
const MotionUse = /*@__PURE__*/ createMotionComponent("use");
|
||||
const MotionView = /*@__PURE__*/ createMotionComponent("view");
|
||||
const MotionClipPath = /*@__PURE__*/ createMotionComponent("clipPath");
|
||||
const MotionFeBlend = /*@__PURE__*/ createMotionComponent("feBlend");
|
||||
const MotionFeColorMatrix =
|
||||
/*@__PURE__*/ createMotionComponent("feColorMatrix");
|
||||
const MotionFeComponentTransfer = /*@__PURE__*/ createMotionComponent("feComponentTransfer");
|
||||
const MotionFeComposite =
|
||||
/*@__PURE__*/ createMotionComponent("feComposite");
|
||||
const MotionFeConvolveMatrix =
|
||||
/*@__PURE__*/ createMotionComponent("feConvolveMatrix");
|
||||
const MotionFeDiffuseLighting =
|
||||
/*@__PURE__*/ createMotionComponent("feDiffuseLighting");
|
||||
const MotionFeDisplacementMap =
|
||||
/*@__PURE__*/ createMotionComponent("feDisplacementMap");
|
||||
const MotionFeDistantLight =
|
||||
/*@__PURE__*/ createMotionComponent("feDistantLight");
|
||||
const MotionFeDropShadow =
|
||||
/*@__PURE__*/ createMotionComponent("feDropShadow");
|
||||
const MotionFeFlood = /*@__PURE__*/ createMotionComponent("feFlood");
|
||||
const MotionFeFuncA = /*@__PURE__*/ createMotionComponent("feFuncA");
|
||||
const MotionFeFuncB = /*@__PURE__*/ createMotionComponent("feFuncB");
|
||||
const MotionFeFuncG = /*@__PURE__*/ createMotionComponent("feFuncG");
|
||||
const MotionFeFuncR = /*@__PURE__*/ createMotionComponent("feFuncR");
|
||||
const MotionFeGaussianBlur =
|
||||
/*@__PURE__*/ createMotionComponent("feGaussianBlur");
|
||||
const MotionFeImage = /*@__PURE__*/ createMotionComponent("feImage");
|
||||
const MotionFeMerge = /*@__PURE__*/ createMotionComponent("feMerge");
|
||||
const MotionFeMergeNode =
|
||||
/*@__PURE__*/ createMotionComponent("feMergeNode");
|
||||
const MotionFeMorphology =
|
||||
/*@__PURE__*/ createMotionComponent("feMorphology");
|
||||
const MotionFeOffset = /*@__PURE__*/ createMotionComponent("feOffset");
|
||||
const MotionFePointLight =
|
||||
/*@__PURE__*/ createMotionComponent("fePointLight");
|
||||
const MotionFeSpecularLighting =
|
||||
/*@__PURE__*/ createMotionComponent("feSpecularLighting");
|
||||
const MotionFeSpotLight =
|
||||
/*@__PURE__*/ createMotionComponent("feSpotLight");
|
||||
const MotionFeTile = /*@__PURE__*/ createMotionComponent("feTile");
|
||||
const MotionFeTurbulence =
|
||||
/*@__PURE__*/ createMotionComponent("feTurbulence");
|
||||
const MotionForeignObject =
|
||||
/*@__PURE__*/ createMotionComponent("foreignObject");
|
||||
const MotionLinearGradient =
|
||||
/*@__PURE__*/ createMotionComponent("linearGradient");
|
||||
const MotionRadialGradient =
|
||||
/*@__PURE__*/ createMotionComponent("radialGradient");
|
||||
const MotionTextPath = /*@__PURE__*/ createMotionComponent("textPath");
|
||||
|
||||
export { MotionA, MotionAbbr, MotionAddress, MotionAnimate, MotionArea, MotionArticle, MotionAside, MotionAudio, MotionB, MotionBase, MotionBdi, MotionBdo, MotionBig, MotionBlockquote, MotionBody, MotionButton, MotionCanvas, MotionCaption, MotionCircle, MotionCite, MotionClipPath, MotionCode, MotionCol, MotionColgroup, MotionData, MotionDatalist, MotionDd, MotionDefs, MotionDel, MotionDesc, MotionDetails, MotionDfn, MotionDialog, MotionDiv, MotionDl, MotionDt, MotionEllipse, MotionEm, MotionEmbed, MotionFeBlend, MotionFeColorMatrix, MotionFeComponentTransfer, MotionFeComposite, MotionFeConvolveMatrix, MotionFeDiffuseLighting, MotionFeDisplacementMap, MotionFeDistantLight, MotionFeDropShadow, MotionFeFlood, MotionFeFuncA, MotionFeFuncB, MotionFeFuncG, MotionFeFuncR, MotionFeGaussianBlur, MotionFeImage, MotionFeMerge, MotionFeMergeNode, MotionFeMorphology, MotionFeOffset, MotionFePointLight, MotionFeSpecularLighting, MotionFeSpotLight, MotionFeTile, MotionFeTurbulence, MotionFieldset, MotionFigcaption, MotionFigure, MotionFilter, MotionFooter, MotionForeignObject, MotionForm, MotionG, MotionH1, MotionH2, MotionH3, MotionH4, MotionH5, MotionH6, MotionHead, MotionHeader, MotionHgroup, MotionHr, MotionHtml, MotionI, MotionIframe, MotionImage, MotionImg, MotionInput, MotionIns, MotionKbd, MotionKeygen, MotionLabel, MotionLegend, MotionLi, MotionLine, MotionLinearGradient, MotionLink, MotionMain, MotionMap, MotionMark, MotionMarker, MotionMask, MotionMenu, MotionMenuitem, MotionMetadata, MotionMeter, MotionNav, MotionObject, MotionOl, MotionOptgroup, MotionOption, MotionOutput, MotionP, MotionParam, MotionPath, MotionPattern, MotionPicture, MotionPolygon, MotionPolyline, MotionPre, MotionProgress, MotionQ, MotionRadialGradient, MotionRect, MotionRp, MotionRt, MotionRuby, MotionS, MotionSamp, MotionScript, MotionSection, MotionSelect, MotionSmall, MotionSource, MotionSpan, MotionStop, MotionStrong, MotionStyle, MotionSub, MotionSummary, MotionSup, MotionSvg, MotionSymbol, MotionTable, MotionTbody, MotionTd, MotionText, MotionTextPath, MotionTextarea, MotionTfoot, MotionTh, MotionThead, MotionTime, MotionTitle, MotionTr, MotionTrack, MotionTspan, MotionU, MotionUl, MotionUse, MotionVideo, MotionView, MotionWbr, MotionWebview };
|
||||
6
node_modules/framer-motion/dist/es/render/components/motion/proxy.mjs
generated
vendored
Normal file
6
node_modules/framer-motion/dist/es/render/components/motion/proxy.mjs
generated
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
import { createDOMMotionComponentProxy } from '../create-proxy.mjs';
|
||||
import { createMotionComponent } from './create.mjs';
|
||||
|
||||
const motion = /*@__PURE__*/ createDOMMotionComponentProxy(createMotionComponent);
|
||||
|
||||
export { motion };
|
||||
130
node_modules/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs
generated
vendored
Normal file
130
node_modules/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs
generated
vendored
Normal file
@ -0,0 +1,130 @@
|
||||
import { isNone } from '../../animation/utils/is-none.mjs';
|
||||
import { getVariableValue } from './utils/css-variables-conversion.mjs';
|
||||
import { isCSSVariableToken } from './utils/is-css-variable.mjs';
|
||||
import { positionalKeys, isNumOrPxType, positionalValues } from './utils/unit-conversion.mjs';
|
||||
import { findDimensionValueType } from './value-types/dimensions.mjs';
|
||||
import { KeyframeResolver } from '../utils/KeyframesResolver.mjs';
|
||||
import { makeNoneKeyframesAnimatable } from '../html/utils/make-none-animatable.mjs';
|
||||
|
||||
class DOMKeyframesResolver extends KeyframeResolver {
|
||||
constructor(unresolvedKeyframes, onComplete, name, motionValue, element) {
|
||||
super(unresolvedKeyframes, onComplete, name, motionValue, element, true);
|
||||
}
|
||||
readKeyframes() {
|
||||
const { unresolvedKeyframes, element, name } = this;
|
||||
if (!element || !element.current)
|
||||
return;
|
||||
super.readKeyframes();
|
||||
/**
|
||||
* If any keyframe is a CSS variable, we need to find its value by sampling the element
|
||||
*/
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
let keyframe = unresolvedKeyframes[i];
|
||||
if (typeof keyframe === "string") {
|
||||
keyframe = keyframe.trim();
|
||||
if (isCSSVariableToken(keyframe)) {
|
||||
const resolved = getVariableValue(keyframe, element.current);
|
||||
if (resolved !== undefined) {
|
||||
unresolvedKeyframes[i] = resolved;
|
||||
}
|
||||
if (i === unresolvedKeyframes.length - 1) {
|
||||
this.finalKeyframe = keyframe;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Resolve "none" values. We do this potentially twice - once before and once after measuring keyframes.
|
||||
* This could be seen as inefficient but it's a trade-off to avoid measurements in more situations, which
|
||||
* have a far bigger performance impact.
|
||||
*/
|
||||
this.resolveNoneKeyframes();
|
||||
/**
|
||||
* Check to see if unit type has changed. If so schedule jobs that will
|
||||
* temporarily set styles to the destination keyframes.
|
||||
* Skip if we have more than two keyframes or this isn't a positional value.
|
||||
* TODO: We can throw if there are multiple keyframes and the value type changes.
|
||||
*/
|
||||
if (!positionalKeys.has(name) || unresolvedKeyframes.length !== 2) {
|
||||
return;
|
||||
}
|
||||
const [origin, target] = unresolvedKeyframes;
|
||||
const originType = findDimensionValueType(origin);
|
||||
const targetType = findDimensionValueType(target);
|
||||
/**
|
||||
* Either we don't recognise these value types or we can animate between them.
|
||||
*/
|
||||
if (originType === targetType)
|
||||
return;
|
||||
/**
|
||||
* If both values are numbers or pixels, we can animate between them by
|
||||
* converting them to numbers.
|
||||
*/
|
||||
if (isNumOrPxType(originType) && isNumOrPxType(targetType)) {
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
const value = unresolvedKeyframes[i];
|
||||
if (typeof value === "string") {
|
||||
unresolvedKeyframes[i] = parseFloat(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
/**
|
||||
* Else, the only way to resolve this is by measuring the element.
|
||||
*/
|
||||
this.needsMeasurement = true;
|
||||
}
|
||||
}
|
||||
resolveNoneKeyframes() {
|
||||
const { unresolvedKeyframes, name } = this;
|
||||
const noneKeyframeIndexes = [];
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
if (isNone(unresolvedKeyframes[i])) {
|
||||
noneKeyframeIndexes.push(i);
|
||||
}
|
||||
}
|
||||
if (noneKeyframeIndexes.length) {
|
||||
makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name);
|
||||
}
|
||||
}
|
||||
measureInitialState() {
|
||||
const { element, unresolvedKeyframes, name } = this;
|
||||
if (!element || !element.current)
|
||||
return;
|
||||
if (name === "height") {
|
||||
this.suspendedScrollY = window.pageYOffset;
|
||||
}
|
||||
this.measuredOrigin = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current));
|
||||
unresolvedKeyframes[0] = this.measuredOrigin;
|
||||
// Set final key frame to measure after next render
|
||||
const measureKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
|
||||
if (measureKeyframe !== undefined) {
|
||||
element.getValue(name, measureKeyframe).jump(measureKeyframe, false);
|
||||
}
|
||||
}
|
||||
measureEndState() {
|
||||
var _a;
|
||||
const { element, name, unresolvedKeyframes } = this;
|
||||
if (!element || !element.current)
|
||||
return;
|
||||
const value = element.getValue(name);
|
||||
value && value.jump(this.measuredOrigin, false);
|
||||
const finalKeyframeIndex = unresolvedKeyframes.length - 1;
|
||||
const finalKeyframe = unresolvedKeyframes[finalKeyframeIndex];
|
||||
unresolvedKeyframes[finalKeyframeIndex] = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current));
|
||||
if (finalKeyframe !== null && this.finalKeyframe === undefined) {
|
||||
this.finalKeyframe = finalKeyframe;
|
||||
}
|
||||
// If we removed transform values, reapply them before the next render
|
||||
if ((_a = this.removedTransforms) === null || _a === void 0 ? void 0 : _a.length) {
|
||||
this.removedTransforms.forEach(([unsetTransformName, unsetTransformValue]) => {
|
||||
element
|
||||
.getValue(unsetTransformName)
|
||||
.set(unsetTransformValue);
|
||||
});
|
||||
}
|
||||
this.resolveNoneKeyframes();
|
||||
}
|
||||
}
|
||||
|
||||
export { DOMKeyframesResolver };
|
||||
43
node_modules/framer-motion/dist/es/render/dom/DOMVisualElement.mjs
generated
vendored
Normal file
43
node_modules/framer-motion/dist/es/render/dom/DOMVisualElement.mjs
generated
vendored
Normal file
@ -0,0 +1,43 @@
|
||||
import { VisualElement } from '../VisualElement.mjs';
|
||||
import { DOMKeyframesResolver } from './DOMKeyframesResolver.mjs';
|
||||
import { isMotionValue } from '../../value/utils/is-motion-value.mjs';
|
||||
|
||||
class DOMVisualElement extends VisualElement {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.KeyframeResolver = DOMKeyframesResolver;
|
||||
}
|
||||
sortInstanceNodePosition(a, b) {
|
||||
/**
|
||||
* compareDocumentPosition returns a bitmask, by using the bitwise &
|
||||
* we're returning true if 2 in that bitmask is set to true. 2 is set
|
||||
* to true if b preceeds a.
|
||||
*/
|
||||
return a.compareDocumentPosition(b) & 2 ? 1 : -1;
|
||||
}
|
||||
getBaseTargetFromProps(props, key) {
|
||||
return props.style
|
||||
? props.style[key]
|
||||
: undefined;
|
||||
}
|
||||
removeValueFromRenderState(key, { vars, style }) {
|
||||
delete vars[key];
|
||||
delete style[key];
|
||||
}
|
||||
handleChildMotionValue() {
|
||||
if (this.childSubscription) {
|
||||
this.childSubscription();
|
||||
delete this.childSubscription;
|
||||
}
|
||||
const { children } = this.props;
|
||||
if (isMotionValue(children)) {
|
||||
this.childSubscription = children.on("change", (latest) => {
|
||||
if (this.current) {
|
||||
this.current.textContent = `${latest}`;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { DOMVisualElement };
|
||||
14
node_modules/framer-motion/dist/es/render/dom/create-visual-element.mjs
generated
vendored
Normal file
14
node_modules/framer-motion/dist/es/render/dom/create-visual-element.mjs
generated
vendored
Normal file
@ -0,0 +1,14 @@
|
||||
import { Fragment } from 'react';
|
||||
import { HTMLVisualElement } from '../html/HTMLVisualElement.mjs';
|
||||
import { SVGVisualElement } from '../svg/SVGVisualElement.mjs';
|
||||
import { isSVGComponent } from './utils/is-svg-component.mjs';
|
||||
|
||||
const createDomVisualElement = (Component, options) => {
|
||||
return isSVGComponent(Component)
|
||||
? new SVGVisualElement(options)
|
||||
: new HTMLVisualElement(options, {
|
||||
allowProjection: Component !== Fragment,
|
||||
});
|
||||
};
|
||||
|
||||
export { createDomVisualElement };
|
||||
14
node_modules/framer-motion/dist/es/render/dom/features-animation.mjs
generated
vendored
Normal file
14
node_modules/framer-motion/dist/es/render/dom/features-animation.mjs
generated
vendored
Normal file
@ -0,0 +1,14 @@
|
||||
import { animations } from '../../motion/features/animations.mjs';
|
||||
import { gestureAnimations } from '../../motion/features/gestures.mjs';
|
||||
import { createDomVisualElement } from './create-visual-element.mjs';
|
||||
|
||||
/**
|
||||
* @public
|
||||
*/
|
||||
const domAnimation = {
|
||||
renderer: createDomVisualElement,
|
||||
...animations,
|
||||
...gestureAnimations,
|
||||
};
|
||||
|
||||
export { domAnimation };
|
||||
14
node_modules/framer-motion/dist/es/render/dom/features-max.mjs
generated
vendored
Normal file
14
node_modules/framer-motion/dist/es/render/dom/features-max.mjs
generated
vendored
Normal file
@ -0,0 +1,14 @@
|
||||
import { drag } from '../../motion/features/drag.mjs';
|
||||
import { layout } from '../../motion/features/layout.mjs';
|
||||
import { domAnimation } from './features-animation.mjs';
|
||||
|
||||
/**
|
||||
* @public
|
||||
*/
|
||||
const domMax = {
|
||||
...domAnimation,
|
||||
...drag,
|
||||
...layout,
|
||||
};
|
||||
|
||||
export { domMax };
|
||||
12
node_modules/framer-motion/dist/es/render/dom/features-min.mjs
generated
vendored
Normal file
12
node_modules/framer-motion/dist/es/render/dom/features-min.mjs
generated
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
import { animations } from '../../motion/features/animations.mjs';
|
||||
import { createDomVisualElement } from './create-visual-element.mjs';
|
||||
|
||||
/**
|
||||
* @public
|
||||
*/
|
||||
const domMin = {
|
||||
renderer: createDomVisualElement,
|
||||
...animations,
|
||||
};
|
||||
|
||||
export { domMin };
|
||||
64
node_modules/framer-motion/dist/es/render/dom/resize/handle-element.mjs
generated
vendored
Normal file
64
node_modules/framer-motion/dist/es/render/dom/resize/handle-element.mjs
generated
vendored
Normal file
@ -0,0 +1,64 @@
|
||||
import { resolveElements } from 'motion-dom';
|
||||
|
||||
const resizeHandlers = new WeakMap();
|
||||
let observer;
|
||||
function getElementSize(target, borderBoxSize) {
|
||||
if (borderBoxSize) {
|
||||
const { inlineSize, blockSize } = borderBoxSize[0];
|
||||
return { width: inlineSize, height: blockSize };
|
||||
}
|
||||
else if (target instanceof SVGElement && "getBBox" in target) {
|
||||
return target.getBBox();
|
||||
}
|
||||
else {
|
||||
return {
|
||||
width: target.offsetWidth,
|
||||
height: target.offsetHeight,
|
||||
};
|
||||
}
|
||||
}
|
||||
function notifyTarget({ target, contentRect, borderBoxSize, }) {
|
||||
var _a;
|
||||
(_a = resizeHandlers.get(target)) === null || _a === void 0 ? void 0 : _a.forEach((handler) => {
|
||||
handler({
|
||||
target,
|
||||
contentSize: contentRect,
|
||||
get size() {
|
||||
return getElementSize(target, borderBoxSize);
|
||||
},
|
||||
});
|
||||
});
|
||||
}
|
||||
function notifyAll(entries) {
|
||||
entries.forEach(notifyTarget);
|
||||
}
|
||||
function createResizeObserver() {
|
||||
if (typeof ResizeObserver === "undefined")
|
||||
return;
|
||||
observer = new ResizeObserver(notifyAll);
|
||||
}
|
||||
function resizeElement(target, handler) {
|
||||
if (!observer)
|
||||
createResizeObserver();
|
||||
const elements = resolveElements(target);
|
||||
elements.forEach((element) => {
|
||||
let elementHandlers = resizeHandlers.get(element);
|
||||
if (!elementHandlers) {
|
||||
elementHandlers = new Set();
|
||||
resizeHandlers.set(element, elementHandlers);
|
||||
}
|
||||
elementHandlers.add(handler);
|
||||
observer === null || observer === void 0 ? void 0 : observer.observe(element);
|
||||
});
|
||||
return () => {
|
||||
elements.forEach((element) => {
|
||||
const elementHandlers = resizeHandlers.get(element);
|
||||
elementHandlers === null || elementHandlers === void 0 ? void 0 : elementHandlers.delete(handler);
|
||||
if (!(elementHandlers === null || elementHandlers === void 0 ? void 0 : elementHandlers.size)) {
|
||||
observer === null || observer === void 0 ? void 0 : observer.unobserve(element);
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export { resizeElement };
|
||||
30
node_modules/framer-motion/dist/es/render/dom/resize/handle-window.mjs
generated
vendored
Normal file
30
node_modules/framer-motion/dist/es/render/dom/resize/handle-window.mjs
generated
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
const windowCallbacks = new Set();
|
||||
let windowResizeHandler;
|
||||
function createWindowResizeHandler() {
|
||||
windowResizeHandler = () => {
|
||||
const size = {
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight,
|
||||
};
|
||||
const info = {
|
||||
target: window,
|
||||
size,
|
||||
contentSize: size,
|
||||
};
|
||||
windowCallbacks.forEach((callback) => callback(info));
|
||||
};
|
||||
window.addEventListener("resize", windowResizeHandler);
|
||||
}
|
||||
function resizeWindow(callback) {
|
||||
windowCallbacks.add(callback);
|
||||
if (!windowResizeHandler)
|
||||
createWindowResizeHandler();
|
||||
return () => {
|
||||
windowCallbacks.delete(callback);
|
||||
if (!windowCallbacks.size && windowResizeHandler) {
|
||||
windowResizeHandler = undefined;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export { resizeWindow };
|
||||
8
node_modules/framer-motion/dist/es/render/dom/resize/index.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/render/dom/resize/index.mjs
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
import { resizeElement } from './handle-element.mjs';
|
||||
import { resizeWindow } from './handle-window.mjs';
|
||||
|
||||
function resize(a, b) {
|
||||
return typeof a === "function" ? resizeWindow(a) : resizeElement(a, b);
|
||||
}
|
||||
|
||||
export { resize };
|
||||
87
node_modules/framer-motion/dist/es/render/dom/scroll/index.mjs
generated
vendored
Normal file
87
node_modules/framer-motion/dist/es/render/dom/scroll/index.mjs
generated
vendored
Normal file
@ -0,0 +1,87 @@
|
||||
import { scrollInfo } from './track.mjs';
|
||||
import { observeTimeline } from './observe.mjs';
|
||||
import { supportsScrollTimeline } from './supports.mjs';
|
||||
import { noop } from 'motion-utils';
|
||||
|
||||
function scrollTimelineFallback({ source, container, axis = "y", }) {
|
||||
// Support legacy source argument. Deprecate later.
|
||||
if (source)
|
||||
container = source;
|
||||
// ScrollTimeline records progress as a percentage CSSUnitValue
|
||||
const currentTime = { value: 0 };
|
||||
const cancel = scrollInfo((info) => {
|
||||
currentTime.value = info[axis].progress * 100;
|
||||
}, { container, axis });
|
||||
return { currentTime, cancel };
|
||||
}
|
||||
const timelineCache = new Map();
|
||||
function getTimeline({ source, container = document.documentElement, axis = "y", } = {}) {
|
||||
// Support legacy source argument. Deprecate later.
|
||||
if (source)
|
||||
container = source;
|
||||
if (!timelineCache.has(container)) {
|
||||
timelineCache.set(container, {});
|
||||
}
|
||||
const elementCache = timelineCache.get(container);
|
||||
if (!elementCache[axis]) {
|
||||
elementCache[axis] = supportsScrollTimeline()
|
||||
? new ScrollTimeline({ source: container, axis })
|
||||
: scrollTimelineFallback({ source: container, axis });
|
||||
}
|
||||
return elementCache[axis];
|
||||
}
|
||||
/**
|
||||
* If the onScroll function has two arguments, it's expecting
|
||||
* more specific information about the scroll from scrollInfo.
|
||||
*/
|
||||
function isOnScrollWithInfo(onScroll) {
|
||||
return onScroll.length === 2;
|
||||
}
|
||||
/**
|
||||
* Currently, we only support element tracking with `scrollInfo`, though in
|
||||
* the future we can also offer ViewTimeline support.
|
||||
*/
|
||||
function needsElementTracking(options) {
|
||||
return options && (options.target || options.offset);
|
||||
}
|
||||
function scrollFunction(onScroll, options) {
|
||||
if (isOnScrollWithInfo(onScroll) || needsElementTracking(options)) {
|
||||
return scrollInfo((info) => {
|
||||
onScroll(info[options.axis].progress, info);
|
||||
}, options);
|
||||
}
|
||||
else {
|
||||
return observeTimeline(onScroll, getTimeline(options));
|
||||
}
|
||||
}
|
||||
function scrollAnimation(animation, options) {
|
||||
animation.flatten();
|
||||
if (needsElementTracking(options)) {
|
||||
animation.pause();
|
||||
return scrollInfo((info) => {
|
||||
animation.time = animation.duration * info[options.axis].progress;
|
||||
}, options);
|
||||
}
|
||||
else {
|
||||
const timeline = getTimeline(options);
|
||||
if (animation.attachTimeline) {
|
||||
return animation.attachTimeline(timeline, (valueAnimation) => {
|
||||
valueAnimation.pause();
|
||||
return observeTimeline((progress) => {
|
||||
valueAnimation.time = valueAnimation.duration * progress;
|
||||
}, timeline);
|
||||
});
|
||||
}
|
||||
else {
|
||||
return noop;
|
||||
}
|
||||
}
|
||||
}
|
||||
function scroll(onScroll, { axis = "y", ...options } = {}) {
|
||||
const optionsWithDefaults = { axis, ...options };
|
||||
return typeof onScroll === "function"
|
||||
? scrollFunction(onScroll, optionsWithDefaults)
|
||||
: scrollAnimation(onScroll, optionsWithDefaults);
|
||||
}
|
||||
|
||||
export { scroll };
|
||||
56
node_modules/framer-motion/dist/es/render/dom/scroll/info.mjs
generated
vendored
Normal file
56
node_modules/framer-motion/dist/es/render/dom/scroll/info.mjs
generated
vendored
Normal file
@ -0,0 +1,56 @@
|
||||
import { progress } from '../../../utils/progress.mjs';
|
||||
import { velocityPerSecond } from '../../../utils/velocity-per-second.mjs';
|
||||
|
||||
/**
|
||||
* A time in milliseconds, beyond which we consider the scroll velocity to be 0.
|
||||
*/
|
||||
const maxElapsed = 50;
|
||||
const createAxisInfo = () => ({
|
||||
current: 0,
|
||||
offset: [],
|
||||
progress: 0,
|
||||
scrollLength: 0,
|
||||
targetOffset: 0,
|
||||
targetLength: 0,
|
||||
containerLength: 0,
|
||||
velocity: 0,
|
||||
});
|
||||
const createScrollInfo = () => ({
|
||||
time: 0,
|
||||
x: createAxisInfo(),
|
||||
y: createAxisInfo(),
|
||||
});
|
||||
const keys = {
|
||||
x: {
|
||||
length: "Width",
|
||||
position: "Left",
|
||||
},
|
||||
y: {
|
||||
length: "Height",
|
||||
position: "Top",
|
||||
},
|
||||
};
|
||||
function updateAxisInfo(element, axisName, info, time) {
|
||||
const axis = info[axisName];
|
||||
const { length, position } = keys[axisName];
|
||||
const prev = axis.current;
|
||||
const prevTime = info.time;
|
||||
axis.current = element[`scroll${position}`];
|
||||
axis.scrollLength = element[`scroll${length}`] - element[`client${length}`];
|
||||
axis.offset.length = 0;
|
||||
axis.offset[0] = 0;
|
||||
axis.offset[1] = axis.scrollLength;
|
||||
axis.progress = progress(0, axis.scrollLength, axis.current);
|
||||
const elapsed = time - prevTime;
|
||||
axis.velocity =
|
||||
elapsed > maxElapsed
|
||||
? 0
|
||||
: velocityPerSecond(axis.current - prev, elapsed);
|
||||
}
|
||||
function updateScrollInfo(element, info, time) {
|
||||
updateAxisInfo(element, "x", info, time);
|
||||
updateAxisInfo(element, "y", info, time);
|
||||
info.time = time;
|
||||
}
|
||||
|
||||
export { createScrollInfo, updateScrollInfo };
|
||||
18
node_modules/framer-motion/dist/es/render/dom/scroll/observe.mjs
generated
vendored
Normal file
18
node_modules/framer-motion/dist/es/render/dom/scroll/observe.mjs
generated
vendored
Normal file
@ -0,0 +1,18 @@
|
||||
import { frame, cancelFrame } from '../../../frameloop/frame.mjs';
|
||||
|
||||
function observeTimeline(update, timeline) {
|
||||
let prevProgress;
|
||||
const onFrame = () => {
|
||||
const { currentTime } = timeline;
|
||||
const percentage = currentTime === null ? 0 : currentTime.value;
|
||||
const progress = percentage / 100;
|
||||
if (prevProgress !== progress) {
|
||||
update(progress);
|
||||
}
|
||||
prevProgress = progress;
|
||||
};
|
||||
frame.update(onFrame, true);
|
||||
return () => cancelFrame(onFrame);
|
||||
}
|
||||
|
||||
export { observeTimeline };
|
||||
45
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/edge.mjs
generated
vendored
Normal file
45
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/edge.mjs
generated
vendored
Normal file
@ -0,0 +1,45 @@
|
||||
const namedEdges = {
|
||||
start: 0,
|
||||
center: 0.5,
|
||||
end: 1,
|
||||
};
|
||||
function resolveEdge(edge, length, inset = 0) {
|
||||
let delta = 0;
|
||||
/**
|
||||
* If we have this edge defined as a preset, replace the definition
|
||||
* with the numerical value.
|
||||
*/
|
||||
if (edge in namedEdges) {
|
||||
edge = namedEdges[edge];
|
||||
}
|
||||
/**
|
||||
* Handle unit values
|
||||
*/
|
||||
if (typeof edge === "string") {
|
||||
const asNumber = parseFloat(edge);
|
||||
if (edge.endsWith("px")) {
|
||||
delta = asNumber;
|
||||
}
|
||||
else if (edge.endsWith("%")) {
|
||||
edge = asNumber / 100;
|
||||
}
|
||||
else if (edge.endsWith("vw")) {
|
||||
delta = (asNumber / 100) * document.documentElement.clientWidth;
|
||||
}
|
||||
else if (edge.endsWith("vh")) {
|
||||
delta = (asNumber / 100) * document.documentElement.clientHeight;
|
||||
}
|
||||
else {
|
||||
edge = asNumber;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* If the edge is defined as a number, handle as a progress value.
|
||||
*/
|
||||
if (typeof edge === "number") {
|
||||
delta = length * edge;
|
||||
}
|
||||
return inset + delta;
|
||||
}
|
||||
|
||||
export { namedEdges, resolveEdge };
|
||||
59
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/index.mjs
generated
vendored
Normal file
59
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/index.mjs
generated
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
import { calcInset } from './inset.mjs';
|
||||
import { ScrollOffset } from './presets.mjs';
|
||||
import { resolveOffset } from './offset.mjs';
|
||||
import { interpolate } from '../../../../utils/interpolate.mjs';
|
||||
import { defaultOffset } from '../../../../utils/offsets/default.mjs';
|
||||
|
||||
const point = { x: 0, y: 0 };
|
||||
function getTargetSize(target) {
|
||||
return "getBBox" in target && target.tagName !== "svg"
|
||||
? target.getBBox()
|
||||
: { width: target.clientWidth, height: target.clientHeight };
|
||||
}
|
||||
function resolveOffsets(container, info, options) {
|
||||
const { offset: offsetDefinition = ScrollOffset.All } = options;
|
||||
const { target = container, axis = "y" } = options;
|
||||
const lengthLabel = axis === "y" ? "height" : "width";
|
||||
const inset = target !== container ? calcInset(target, container) : point;
|
||||
/**
|
||||
* Measure the target and container. If they're the same thing then we
|
||||
* use the container's scrollWidth/Height as the target, from there
|
||||
* all other calculations can remain the same.
|
||||
*/
|
||||
const targetSize = target === container
|
||||
? { width: container.scrollWidth, height: container.scrollHeight }
|
||||
: getTargetSize(target);
|
||||
const containerSize = {
|
||||
width: container.clientWidth,
|
||||
height: container.clientHeight,
|
||||
};
|
||||
/**
|
||||
* Reset the length of the resolved offset array rather than creating a new one.
|
||||
* TODO: More reusable data structures for targetSize/containerSize would also be good.
|
||||
*/
|
||||
info[axis].offset.length = 0;
|
||||
/**
|
||||
* Populate the offset array by resolving the user's offset definition into
|
||||
* a list of pixel scroll offets.
|
||||
*/
|
||||
let hasChanged = !info[axis].interpolate;
|
||||
const numOffsets = offsetDefinition.length;
|
||||
for (let i = 0; i < numOffsets; i++) {
|
||||
const offset = resolveOffset(offsetDefinition[i], containerSize[lengthLabel], targetSize[lengthLabel], inset[axis]);
|
||||
if (!hasChanged && offset !== info[axis].interpolatorOffsets[i]) {
|
||||
hasChanged = true;
|
||||
}
|
||||
info[axis].offset[i] = offset;
|
||||
}
|
||||
/**
|
||||
* If the pixel scroll offsets have changed, create a new interpolator function
|
||||
* to map scroll value into a progress.
|
||||
*/
|
||||
if (hasChanged) {
|
||||
info[axis].interpolate = interpolate(info[axis].offset, defaultOffset(offsetDefinition));
|
||||
info[axis].interpolatorOffsets = [...info[axis].offset];
|
||||
}
|
||||
info[axis].progress = info[axis].interpolate(info[axis].current);
|
||||
}
|
||||
|
||||
export { resolveOffsets };
|
||||
45
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/inset.mjs
generated
vendored
Normal file
45
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/inset.mjs
generated
vendored
Normal file
@ -0,0 +1,45 @@
|
||||
function calcInset(element, container) {
|
||||
const inset = { x: 0, y: 0 };
|
||||
let current = element;
|
||||
while (current && current !== container) {
|
||||
if (current instanceof HTMLElement) {
|
||||
inset.x += current.offsetLeft;
|
||||
inset.y += current.offsetTop;
|
||||
current = current.offsetParent;
|
||||
}
|
||||
else if (current.tagName === "svg") {
|
||||
/**
|
||||
* This isn't an ideal approach to measuring the offset of <svg /> tags.
|
||||
* It would be preferable, given they behave like HTMLElements in most ways
|
||||
* to use offsetLeft/Top. But these don't exist on <svg />. Likewise we
|
||||
* can't use .getBBox() like most SVG elements as these provide the offset
|
||||
* relative to the SVG itself, which for <svg /> is usually 0x0.
|
||||
*/
|
||||
const svgBoundingBox = current.getBoundingClientRect();
|
||||
current = current.parentElement;
|
||||
const parentBoundingBox = current.getBoundingClientRect();
|
||||
inset.x += svgBoundingBox.left - parentBoundingBox.left;
|
||||
inset.y += svgBoundingBox.top - parentBoundingBox.top;
|
||||
}
|
||||
else if (current instanceof SVGGraphicsElement) {
|
||||
const { x, y } = current.getBBox();
|
||||
inset.x += x;
|
||||
inset.y += y;
|
||||
let svg = null;
|
||||
let parent = current.parentNode;
|
||||
while (!svg) {
|
||||
if (parent.tagName === "svg") {
|
||||
svg = parent;
|
||||
}
|
||||
parent = current.parentNode;
|
||||
}
|
||||
current = svg;
|
||||
}
|
||||
else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
return inset;
|
||||
}
|
||||
|
||||
export { calcInset };
|
||||
35
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/offset.mjs
generated
vendored
Normal file
35
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/offset.mjs
generated
vendored
Normal file
@ -0,0 +1,35 @@
|
||||
import { resolveEdge, namedEdges } from './edge.mjs';
|
||||
|
||||
const defaultOffset = [0, 0];
|
||||
function resolveOffset(offset, containerLength, targetLength, targetInset) {
|
||||
let offsetDefinition = Array.isArray(offset) ? offset : defaultOffset;
|
||||
let targetPoint = 0;
|
||||
let containerPoint = 0;
|
||||
if (typeof offset === "number") {
|
||||
/**
|
||||
* If we're provided offset: [0, 0.5, 1] then each number x should become
|
||||
* [x, x], so we default to the behaviour of mapping 0 => 0 of both target
|
||||
* and container etc.
|
||||
*/
|
||||
offsetDefinition = [offset, offset];
|
||||
}
|
||||
else if (typeof offset === "string") {
|
||||
offset = offset.trim();
|
||||
if (offset.includes(" ")) {
|
||||
offsetDefinition = offset.split(" ");
|
||||
}
|
||||
else {
|
||||
/**
|
||||
* If we're provided a definition like "100px" then we want to apply
|
||||
* that only to the top of the target point, leaving the container at 0.
|
||||
* Whereas a named offset like "end" should be applied to both.
|
||||
*/
|
||||
offsetDefinition = [offset, namedEdges[offset] ? offset : `0`];
|
||||
}
|
||||
}
|
||||
targetPoint = resolveEdge(offsetDefinition[0], targetLength, targetInset);
|
||||
containerPoint = resolveEdge(offsetDefinition[1], containerLength);
|
||||
return targetPoint - containerPoint;
|
||||
}
|
||||
|
||||
export { resolveOffset };
|
||||
20
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/presets.mjs
generated
vendored
Normal file
20
node_modules/framer-motion/dist/es/render/dom/scroll/offsets/presets.mjs
generated
vendored
Normal file
@ -0,0 +1,20 @@
|
||||
const ScrollOffset = {
|
||||
Enter: [
|
||||
[0, 1],
|
||||
[1, 1],
|
||||
],
|
||||
Exit: [
|
||||
[0, 0],
|
||||
[1, 0],
|
||||
],
|
||||
Any: [
|
||||
[1, 0],
|
||||
[0, 1],
|
||||
],
|
||||
All: [
|
||||
[0, 0],
|
||||
[1, 1],
|
||||
],
|
||||
};
|
||||
|
||||
export { ScrollOffset };
|
||||
48
node_modules/framer-motion/dist/es/render/dom/scroll/on-scroll-handler.mjs
generated
vendored
Normal file
48
node_modules/framer-motion/dist/es/render/dom/scroll/on-scroll-handler.mjs
generated
vendored
Normal file
@ -0,0 +1,48 @@
|
||||
import { warnOnce } from '../../../utils/warn-once.mjs';
|
||||
import { updateScrollInfo } from './info.mjs';
|
||||
import { resolveOffsets } from './offsets/index.mjs';
|
||||
|
||||
function measure(container, target = container, info) {
|
||||
/**
|
||||
* Find inset of target within scrollable container
|
||||
*/
|
||||
info.x.targetOffset = 0;
|
||||
info.y.targetOffset = 0;
|
||||
if (target !== container) {
|
||||
let node = target;
|
||||
while (node && node !== container) {
|
||||
info.x.targetOffset += node.offsetLeft;
|
||||
info.y.targetOffset += node.offsetTop;
|
||||
node = node.offsetParent;
|
||||
}
|
||||
}
|
||||
info.x.targetLength =
|
||||
target === container ? target.scrollWidth : target.clientWidth;
|
||||
info.y.targetLength =
|
||||
target === container ? target.scrollHeight : target.clientHeight;
|
||||
info.x.containerLength = container.clientWidth;
|
||||
info.y.containerLength = container.clientHeight;
|
||||
/**
|
||||
* In development mode ensure scroll containers aren't position: static as this makes
|
||||
* it difficult to measure their relative positions.
|
||||
*/
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
if (container && target && target !== container) {
|
||||
warnOnce(getComputedStyle(container).position !== "static", "Please ensure that the container has a non-static position, like 'relative', 'fixed', or 'absolute' to ensure scroll offset is calculated correctly.");
|
||||
}
|
||||
}
|
||||
}
|
||||
function createOnScrollHandler(element, onScroll, info, options = {}) {
|
||||
return {
|
||||
measure: () => measure(element, options.target, info),
|
||||
update: (time) => {
|
||||
updateScrollInfo(element, info, time);
|
||||
if (options.offset || options.target) {
|
||||
resolveOffsets(element, info, options);
|
||||
}
|
||||
},
|
||||
notify: () => onScroll(info),
|
||||
};
|
||||
}
|
||||
|
||||
export { createOnScrollHandler };
|
||||
5
node_modules/framer-motion/dist/es/render/dom/scroll/supports.mjs
generated
vendored
Normal file
5
node_modules/framer-motion/dist/es/render/dom/scroll/supports.mjs
generated
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
import { memo } from '../../../utils/memo.mjs';
|
||||
|
||||
const supportsScrollTimeline = memo(() => window.ScrollTimeline !== undefined);
|
||||
|
||||
export { supportsScrollTimeline };
|
||||
84
node_modules/framer-motion/dist/es/render/dom/scroll/track.mjs
generated
vendored
Normal file
84
node_modules/framer-motion/dist/es/render/dom/scroll/track.mjs
generated
vendored
Normal file
@ -0,0 +1,84 @@
|
||||
import { resize } from '../resize/index.mjs';
|
||||
import { createScrollInfo } from './info.mjs';
|
||||
import { createOnScrollHandler } from './on-scroll-handler.mjs';
|
||||
import { frame, cancelFrame, frameData } from '../../../frameloop/frame.mjs';
|
||||
|
||||
const scrollListeners = new WeakMap();
|
||||
const resizeListeners = new WeakMap();
|
||||
const onScrollHandlers = new WeakMap();
|
||||
const getEventTarget = (element) => element === document.documentElement ? window : element;
|
||||
function scrollInfo(onScroll, { container = document.documentElement, ...options } = {}) {
|
||||
let containerHandlers = onScrollHandlers.get(container);
|
||||
/**
|
||||
* Get the onScroll handlers for this container.
|
||||
* If one isn't found, create a new one.
|
||||
*/
|
||||
if (!containerHandlers) {
|
||||
containerHandlers = new Set();
|
||||
onScrollHandlers.set(container, containerHandlers);
|
||||
}
|
||||
/**
|
||||
* Create a new onScroll handler for the provided callback.
|
||||
*/
|
||||
const info = createScrollInfo();
|
||||
const containerHandler = createOnScrollHandler(container, onScroll, info, options);
|
||||
containerHandlers.add(containerHandler);
|
||||
/**
|
||||
* Check if there's a scroll event listener for this container.
|
||||
* If not, create one.
|
||||
*/
|
||||
if (!scrollListeners.has(container)) {
|
||||
const measureAll = () => {
|
||||
for (const handler of containerHandlers)
|
||||
handler.measure();
|
||||
};
|
||||
const updateAll = () => {
|
||||
for (const handler of containerHandlers) {
|
||||
handler.update(frameData.timestamp);
|
||||
}
|
||||
};
|
||||
const notifyAll = () => {
|
||||
for (const handler of containerHandlers)
|
||||
handler.notify();
|
||||
};
|
||||
const listener = () => {
|
||||
frame.read(measureAll, false, true);
|
||||
frame.read(updateAll, false, true);
|
||||
frame.update(notifyAll, false, true);
|
||||
};
|
||||
scrollListeners.set(container, listener);
|
||||
const target = getEventTarget(container);
|
||||
window.addEventListener("resize", listener, { passive: true });
|
||||
if (container !== document.documentElement) {
|
||||
resizeListeners.set(container, resize(container, listener));
|
||||
}
|
||||
target.addEventListener("scroll", listener, { passive: true });
|
||||
}
|
||||
const listener = scrollListeners.get(container);
|
||||
frame.read(listener, false, true);
|
||||
return () => {
|
||||
var _a;
|
||||
cancelFrame(listener);
|
||||
/**
|
||||
* Check if we even have any handlers for this container.
|
||||
*/
|
||||
const currentHandlers = onScrollHandlers.get(container);
|
||||
if (!currentHandlers)
|
||||
return;
|
||||
currentHandlers.delete(containerHandler);
|
||||
if (currentHandlers.size)
|
||||
return;
|
||||
/**
|
||||
* If no more handlers, remove the scroll listener too.
|
||||
*/
|
||||
const scrollListener = scrollListeners.get(container);
|
||||
scrollListeners.delete(container);
|
||||
if (scrollListener) {
|
||||
getEventTarget(container).removeEventListener("scroll", scrollListener);
|
||||
(_a = resizeListeners.get(container)) === null || _a === void 0 ? void 0 : _a();
|
||||
window.removeEventListener("resize", scrollListener);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export { scrollInfo };
|
||||
33
node_modules/framer-motion/dist/es/render/dom/use-render.mjs
generated
vendored
Normal file
33
node_modules/framer-motion/dist/es/render/dom/use-render.mjs
generated
vendored
Normal file
@ -0,0 +1,33 @@
|
||||
import { Fragment, useMemo, createElement } from 'react';
|
||||
import { useHTMLProps } from '../html/use-props.mjs';
|
||||
import { filterProps } from './utils/filter-props.mjs';
|
||||
import { isSVGComponent } from './utils/is-svg-component.mjs';
|
||||
import { useSVGProps } from '../svg/use-props.mjs';
|
||||
import { isMotionValue } from '../../value/utils/is-motion-value.mjs';
|
||||
|
||||
function createUseRender(forwardMotionProps = false) {
|
||||
const useRender = (Component, props, ref, { latestValues }, isStatic) => {
|
||||
const useVisualProps = isSVGComponent(Component)
|
||||
? useSVGProps
|
||||
: useHTMLProps;
|
||||
const visualProps = useVisualProps(props, latestValues, isStatic, Component);
|
||||
const filteredProps = filterProps(props, typeof Component === "string", forwardMotionProps);
|
||||
const elementProps = Component !== Fragment
|
||||
? { ...filteredProps, ...visualProps, ref }
|
||||
: {};
|
||||
/**
|
||||
* If component has been handed a motion value as its child,
|
||||
* memoise its initial value and render that. Subsequent updates
|
||||
* will be handled by the onChange handler
|
||||
*/
|
||||
const { children } = props;
|
||||
const renderedChildren = useMemo(() => (isMotionValue(children) ? children.get() : children), [children]);
|
||||
return createElement(Component, {
|
||||
...elementProps,
|
||||
children: renderedChildren,
|
||||
});
|
||||
};
|
||||
return useRender;
|
||||
}
|
||||
|
||||
export { createUseRender };
|
||||
6
node_modules/framer-motion/dist/es/render/dom/utils/camel-to-dash.mjs
generated
vendored
Normal file
6
node_modules/framer-motion/dist/es/render/dom/utils/camel-to-dash.mjs
generated
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
/**
|
||||
* Convert camelCase to dash-case properties.
|
||||
*/
|
||||
const camelToDash = (str) => str.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase();
|
||||
|
||||
export { camelToDash };
|
||||
42
node_modules/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs
generated
vendored
Normal file
42
node_modules/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs
generated
vendored
Normal file
@ -0,0 +1,42 @@
|
||||
import { invariant } from 'motion-utils';
|
||||
import { isNumericalString } from '../../../utils/is-numerical-string.mjs';
|
||||
import { isCSSVariableToken } from './is-css-variable.mjs';
|
||||
|
||||
/**
|
||||
* Parse Framer's special CSS variable format into a CSS token and a fallback.
|
||||
*
|
||||
* ```
|
||||
* `var(--foo, #fff)` => [`--foo`, '#fff']
|
||||
* ```
|
||||
*
|
||||
* @param current
|
||||
*/
|
||||
const splitCSSVariableRegex =
|
||||
// eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words
|
||||
/^var\(--(?:([\w-]+)|([\w-]+), ?([a-zA-Z\d ()%#.,-]+))\)/u;
|
||||
function parseCSSVariable(current) {
|
||||
const match = splitCSSVariableRegex.exec(current);
|
||||
if (!match)
|
||||
return [,];
|
||||
const [, token1, token2, fallback] = match;
|
||||
return [`--${token1 !== null && token1 !== void 0 ? token1 : token2}`, fallback];
|
||||
}
|
||||
const maxDepth = 4;
|
||||
function getVariableValue(current, element, depth = 1) {
|
||||
invariant(depth <= maxDepth, `Max CSS variable fallback depth detected in property "${current}". This may indicate a circular fallback dependency.`);
|
||||
const [token, fallback] = parseCSSVariable(current);
|
||||
// No CSS variable detected
|
||||
if (!token)
|
||||
return;
|
||||
// Attempt to read this CSS variable off the element
|
||||
const resolved = window.getComputedStyle(element).getPropertyValue(token);
|
||||
if (resolved) {
|
||||
const trimmed = resolved.trim();
|
||||
return isNumericalString(trimmed) ? parseFloat(trimmed) : trimmed;
|
||||
}
|
||||
return isCSSVariableToken(fallback)
|
||||
? getVariableValue(fallback, element, depth + 1)
|
||||
: fallback;
|
||||
}
|
||||
|
||||
export { getVariableValue, parseCSSVariable };
|
||||
59
node_modules/framer-motion/dist/es/render/dom/utils/filter-props.mjs
generated
vendored
Normal file
59
node_modules/framer-motion/dist/es/render/dom/utils/filter-props.mjs
generated
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
import { isValidMotionProp } from '../../../motion/utils/valid-prop.mjs';
|
||||
|
||||
let shouldForward = (key) => !isValidMotionProp(key);
|
||||
function loadExternalIsValidProp(isValidProp) {
|
||||
if (!isValidProp)
|
||||
return;
|
||||
// Explicitly filter our events
|
||||
shouldForward = (key) => key.startsWith("on") ? !isValidMotionProp(key) : isValidProp(key);
|
||||
}
|
||||
/**
|
||||
* Emotion and Styled Components both allow users to pass through arbitrary props to their components
|
||||
* to dynamically generate CSS. They both use the `@emotion/is-prop-valid` package to determine which
|
||||
* of these should be passed to the underlying DOM node.
|
||||
*
|
||||
* However, when styling a Motion component `styled(motion.div)`, both packages pass through *all* props
|
||||
* as it's seen as an arbitrary component rather than a DOM node. Motion only allows arbitrary props
|
||||
* passed through the `custom` prop so it doesn't *need* the payload or computational overhead of
|
||||
* `@emotion/is-prop-valid`, however to fix this problem we need to use it.
|
||||
*
|
||||
* By making it an optionalDependency we can offer this functionality only in the situations where it's
|
||||
* actually required.
|
||||
*/
|
||||
try {
|
||||
/**
|
||||
* We attempt to import this package but require won't be defined in esm environments, in that case
|
||||
* isPropValid will have to be provided via `MotionContext`. In a 6.0.0 this should probably be removed
|
||||
* in favour of explicit injection.
|
||||
*/
|
||||
loadExternalIsValidProp(require("@emotion/is-prop-valid").default);
|
||||
}
|
||||
catch (_a) {
|
||||
// We don't need to actually do anything here - the fallback is the existing `isPropValid`.
|
||||
}
|
||||
function filterProps(props, isDom, forwardMotionProps) {
|
||||
const filteredProps = {};
|
||||
for (const key in props) {
|
||||
/**
|
||||
* values is considered a valid prop by Emotion, so if it's present
|
||||
* this will be rendered out to the DOM unless explicitly filtered.
|
||||
*
|
||||
* We check the type as it could be used with the `feColorMatrix`
|
||||
* element, which we support.
|
||||
*/
|
||||
if (key === "values" && typeof props.values === "object")
|
||||
continue;
|
||||
if (shouldForward(key) ||
|
||||
(forwardMotionProps === true && isValidMotionProp(key)) ||
|
||||
(!isDom && !isValidMotionProp(key)) ||
|
||||
// If trying to use native HTML drag events, forward drag listeners
|
||||
(props["draggable"] &&
|
||||
key.startsWith("onDrag"))) {
|
||||
filteredProps[key] =
|
||||
props[key];
|
||||
}
|
||||
}
|
||||
return filteredProps;
|
||||
}
|
||||
|
||||
export { filterProps, loadExternalIsValidProp };
|
||||
15
node_modules/framer-motion/dist/es/render/dom/utils/is-css-variable.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/render/dom/utils/is-css-variable.mjs
generated
vendored
Normal file
@ -0,0 +1,15 @@
|
||||
const checkStringStartsWith = (token) => (key) => typeof key === "string" && key.startsWith(token);
|
||||
const isCSSVariableName =
|
||||
/*@__PURE__*/ checkStringStartsWith("--");
|
||||
const startsAsVariableToken =
|
||||
/*@__PURE__*/ checkStringStartsWith("var(--");
|
||||
const isCSSVariableToken = (value) => {
|
||||
const startsWithToken = startsAsVariableToken(value);
|
||||
if (!startsWithToken)
|
||||
return false;
|
||||
// Ensure any comments are stripped from the value as this can harm performance of the regex.
|
||||
return singleCssVariableRegex.test(value.split("/*")[0].trim());
|
||||
};
|
||||
const singleCssVariableRegex = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu;
|
||||
|
||||
export { isCSSVariableName, isCSSVariableToken };
|
||||
30
node_modules/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs
generated
vendored
Normal file
30
node_modules/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs
generated
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
import { lowercaseSVGElements } from '../../svg/lowercase-elements.mjs';
|
||||
|
||||
function isSVGComponent(Component) {
|
||||
if (
|
||||
/**
|
||||
* If it's not a string, it's a custom React component. Currently we only support
|
||||
* HTML custom React components.
|
||||
*/
|
||||
typeof Component !== "string" ||
|
||||
/**
|
||||
* If it contains a dash, the element is a custom HTML webcomponent.
|
||||
*/
|
||||
Component.includes("-")) {
|
||||
return false;
|
||||
}
|
||||
else if (
|
||||
/**
|
||||
* If it's in our list of lowercase SVG tags, it's an SVG component
|
||||
*/
|
||||
lowercaseSVGElements.indexOf(Component) > -1 ||
|
||||
/**
|
||||
* If it contains a capital letter, it's an SVG component
|
||||
*/
|
||||
/[A-Z]/u.test(Component)) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
export { isSVGComponent };
|
||||
5
node_modules/framer-motion/dist/es/render/dom/utils/is-svg-element.mjs
generated
vendored
Normal file
5
node_modules/framer-motion/dist/es/render/dom/utils/is-svg-element.mjs
generated
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
function isSVGElement(element) {
|
||||
return element instanceof SVGElement && element.tagName !== "svg";
|
||||
}
|
||||
|
||||
export { isSVGElement };
|
||||
65
node_modules/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs
generated
vendored
Normal file
65
node_modules/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs
generated
vendored
Normal file
@ -0,0 +1,65 @@
|
||||
import { transformPropOrder } from '../../html/utils/transform.mjs';
|
||||
import { number } from '../../../value/types/numbers/index.mjs';
|
||||
import { px } from '../../../value/types/numbers/units.mjs';
|
||||
|
||||
const positionalKeys = new Set([
|
||||
"width",
|
||||
"height",
|
||||
"top",
|
||||
"left",
|
||||
"right",
|
||||
"bottom",
|
||||
"x",
|
||||
"y",
|
||||
"translateX",
|
||||
"translateY",
|
||||
]);
|
||||
const isNumOrPxType = (v) => v === number || v === px;
|
||||
const getPosFromMatrix = (matrix, pos) => parseFloat(matrix.split(", ")[pos]);
|
||||
const getTranslateFromMatrix = (pos2, pos3) => (_bbox, { transform }) => {
|
||||
if (transform === "none" || !transform)
|
||||
return 0;
|
||||
const matrix3d = transform.match(/^matrix3d\((.+)\)$/u);
|
||||
if (matrix3d) {
|
||||
return getPosFromMatrix(matrix3d[1], pos3);
|
||||
}
|
||||
else {
|
||||
const matrix = transform.match(/^matrix\((.+)\)$/u);
|
||||
if (matrix) {
|
||||
return getPosFromMatrix(matrix[1], pos2);
|
||||
}
|
||||
else {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
};
|
||||
const transformKeys = new Set(["x", "y", "z"]);
|
||||
const nonTranslationalTransformKeys = transformPropOrder.filter((key) => !transformKeys.has(key));
|
||||
function removeNonTranslationalTransform(visualElement) {
|
||||
const removedTransforms = [];
|
||||
nonTranslationalTransformKeys.forEach((key) => {
|
||||
const value = visualElement.getValue(key);
|
||||
if (value !== undefined) {
|
||||
removedTransforms.push([key, value.get()]);
|
||||
value.set(key.startsWith("scale") ? 1 : 0);
|
||||
}
|
||||
});
|
||||
return removedTransforms;
|
||||
}
|
||||
const positionalValues = {
|
||||
// Dimensions
|
||||
width: ({ x }, { paddingLeft = "0", paddingRight = "0" }) => x.max - x.min - parseFloat(paddingLeft) - parseFloat(paddingRight),
|
||||
height: ({ y }, { paddingTop = "0", paddingBottom = "0" }) => y.max - y.min - parseFloat(paddingTop) - parseFloat(paddingBottom),
|
||||
top: (_bbox, { top }) => parseFloat(top),
|
||||
left: (_bbox, { left }) => parseFloat(left),
|
||||
bottom: ({ y }, { top }) => parseFloat(top) + (y.max - y.min),
|
||||
right: ({ x }, { left }) => parseFloat(left) + (x.max - x.min),
|
||||
// Transform
|
||||
x: getTranslateFromMatrix(4, 13),
|
||||
y: getTranslateFromMatrix(5, 14),
|
||||
};
|
||||
// Alias translate longform names
|
||||
positionalValues.translateX = positionalValues.x;
|
||||
positionalValues.translateY = positionalValues.y;
|
||||
|
||||
export { isNumOrPxType, positionalKeys, positionalValues, removeNonTranslationalTransform };
|
||||
15
node_modules/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs
generated
vendored
Normal file
@ -0,0 +1,15 @@
|
||||
import { complex } from '../../../value/types/complex/index.mjs';
|
||||
import { filter } from '../../../value/types/complex/filter.mjs';
|
||||
import { getDefaultValueType } from './defaults.mjs';
|
||||
|
||||
function getAnimatableNone(key, value) {
|
||||
let defaultValueType = getDefaultValueType(key);
|
||||
if (defaultValueType !== filter)
|
||||
defaultValueType = complex;
|
||||
// If value is not recognised as animatable, ie "none", create an animatable version origin based on the target
|
||||
return defaultValueType.getAnimatableNone
|
||||
? defaultValueType.getAnimatableNone(value)
|
||||
: undefined;
|
||||
}
|
||||
|
||||
export { getAnimatableNone };
|
||||
30
node_modules/framer-motion/dist/es/render/dom/value-types/defaults.mjs
generated
vendored
Normal file
30
node_modules/framer-motion/dist/es/render/dom/value-types/defaults.mjs
generated
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
import { color } from '../../../value/types/color/index.mjs';
|
||||
import { filter } from '../../../value/types/complex/filter.mjs';
|
||||
import { numberValueTypes } from './number.mjs';
|
||||
|
||||
/**
|
||||
* A map of default value types for common values
|
||||
*/
|
||||
const defaultValueTypes = {
|
||||
...numberValueTypes,
|
||||
// Color props
|
||||
color,
|
||||
backgroundColor: color,
|
||||
outlineColor: color,
|
||||
fill: color,
|
||||
stroke: color,
|
||||
// Border props
|
||||
borderColor: color,
|
||||
borderTopColor: color,
|
||||
borderRightColor: color,
|
||||
borderBottomColor: color,
|
||||
borderLeftColor: color,
|
||||
filter,
|
||||
WebkitFilter: filter,
|
||||
};
|
||||
/**
|
||||
* Gets the default ValueType for the provided value key
|
||||
*/
|
||||
const getDefaultValueType = (key) => defaultValueTypes[key];
|
||||
|
||||
export { defaultValueTypes, getDefaultValueType };
|
||||
15
node_modules/framer-motion/dist/es/render/dom/value-types/dimensions.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/render/dom/value-types/dimensions.mjs
generated
vendored
Normal file
@ -0,0 +1,15 @@
|
||||
import { number } from '../../../value/types/numbers/index.mjs';
|
||||
import { px, percent, degrees, vw, vh } from '../../../value/types/numbers/units.mjs';
|
||||
import { testValueType } from './test.mjs';
|
||||
import { auto } from './type-auto.mjs';
|
||||
|
||||
/**
|
||||
* A list of value types commonly used for dimensions
|
||||
*/
|
||||
const dimensionValueTypes = [number, px, percent, degrees, vw, vh, auto];
|
||||
/**
|
||||
* Tests a dimensional value against the list of dimension ValueTypes
|
||||
*/
|
||||
const findDimensionValueType = (v) => dimensionValueTypes.find(testValueType(v));
|
||||
|
||||
export { dimensionValueTypes, findDimensionValueType };
|
||||
15
node_modules/framer-motion/dist/es/render/dom/value-types/find.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/render/dom/value-types/find.mjs
generated
vendored
Normal file
@ -0,0 +1,15 @@
|
||||
import { color } from '../../../value/types/color/index.mjs';
|
||||
import { complex } from '../../../value/types/complex/index.mjs';
|
||||
import { dimensionValueTypes } from './dimensions.mjs';
|
||||
import { testValueType } from './test.mjs';
|
||||
|
||||
/**
|
||||
* A list of all ValueTypes
|
||||
*/
|
||||
const valueTypes = [...dimensionValueTypes, color, complex];
|
||||
/**
|
||||
* Tests a value against the list of ValueTypes
|
||||
*/
|
||||
const findValueType = (v) => valueTypes.find(testValueType(v));
|
||||
|
||||
export { findValueType };
|
||||
10
node_modules/framer-motion/dist/es/render/dom/value-types/get-as-type.mjs
generated
vendored
Normal file
10
node_modules/framer-motion/dist/es/render/dom/value-types/get-as-type.mjs
generated
vendored
Normal file
@ -0,0 +1,10 @@
|
||||
/**
|
||||
* Provided a value and a ValueType, returns the value as that value type.
|
||||
*/
|
||||
const getValueAsType = (value, type) => {
|
||||
return type && typeof value === "number"
|
||||
? type.transform(value)
|
||||
: value;
|
||||
};
|
||||
|
||||
export { getValueAsType };
|
||||
41
node_modules/framer-motion/dist/es/render/dom/value-types/number-browser.mjs
generated
vendored
Normal file
41
node_modules/framer-motion/dist/es/render/dom/value-types/number-browser.mjs
generated
vendored
Normal file
@ -0,0 +1,41 @@
|
||||
import { px } from '../../../value/types/numbers/units.mjs';
|
||||
|
||||
const browserNumberValueTypes = {
|
||||
// Border props
|
||||
borderWidth: px,
|
||||
borderTopWidth: px,
|
||||
borderRightWidth: px,
|
||||
borderBottomWidth: px,
|
||||
borderLeftWidth: px,
|
||||
borderRadius: px,
|
||||
radius: px,
|
||||
borderTopLeftRadius: px,
|
||||
borderTopRightRadius: px,
|
||||
borderBottomRightRadius: px,
|
||||
borderBottomLeftRadius: px,
|
||||
// Positioning props
|
||||
width: px,
|
||||
maxWidth: px,
|
||||
height: px,
|
||||
maxHeight: px,
|
||||
top: px,
|
||||
right: px,
|
||||
bottom: px,
|
||||
left: px,
|
||||
// Spacing props
|
||||
padding: px,
|
||||
paddingTop: px,
|
||||
paddingRight: px,
|
||||
paddingBottom: px,
|
||||
paddingLeft: px,
|
||||
margin: px,
|
||||
marginTop: px,
|
||||
marginRight: px,
|
||||
marginBottom: px,
|
||||
marginLeft: px,
|
||||
// Misc
|
||||
backgroundPositionX: px,
|
||||
backgroundPositionY: px,
|
||||
};
|
||||
|
||||
export { browserNumberValueTypes };
|
||||
18
node_modules/framer-motion/dist/es/render/dom/value-types/number.mjs
generated
vendored
Normal file
18
node_modules/framer-motion/dist/es/render/dom/value-types/number.mjs
generated
vendored
Normal file
@ -0,0 +1,18 @@
|
||||
import { alpha } from '../../../value/types/numbers/index.mjs';
|
||||
import { px } from '../../../value/types/numbers/units.mjs';
|
||||
import { browserNumberValueTypes } from './number-browser.mjs';
|
||||
import { transformValueTypes } from './transform.mjs';
|
||||
import { int } from './type-int.mjs';
|
||||
|
||||
const numberValueTypes = {
|
||||
...browserNumberValueTypes,
|
||||
...transformValueTypes,
|
||||
zIndex: int,
|
||||
size: px,
|
||||
// SVG
|
||||
fillOpacity: alpha,
|
||||
strokeOpacity: alpha,
|
||||
numOctaves: int,
|
||||
};
|
||||
|
||||
export { numberValueTypes };
|
||||
6
node_modules/framer-motion/dist/es/render/dom/value-types/test.mjs
generated
vendored
Normal file
6
node_modules/framer-motion/dist/es/render/dom/value-types/test.mjs
generated
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
/**
|
||||
* Tests a provided value against a ValueType
|
||||
*/
|
||||
const testValueType = (v) => (type) => type.test(v);
|
||||
|
||||
export { testValueType };
|
||||
31
node_modules/framer-motion/dist/es/render/dom/value-types/transform.mjs
generated
vendored
Normal file
31
node_modules/framer-motion/dist/es/render/dom/value-types/transform.mjs
generated
vendored
Normal file
@ -0,0 +1,31 @@
|
||||
import { scale, alpha } from '../../../value/types/numbers/index.mjs';
|
||||
import { degrees, px, progressPercentage } from '../../../value/types/numbers/units.mjs';
|
||||
|
||||
const transformValueTypes = {
|
||||
rotate: degrees,
|
||||
rotateX: degrees,
|
||||
rotateY: degrees,
|
||||
rotateZ: degrees,
|
||||
scale,
|
||||
scaleX: scale,
|
||||
scaleY: scale,
|
||||
scaleZ: scale,
|
||||
skew: degrees,
|
||||
skewX: degrees,
|
||||
skewY: degrees,
|
||||
distance: px,
|
||||
translateX: px,
|
||||
translateY: px,
|
||||
translateZ: px,
|
||||
x: px,
|
||||
y: px,
|
||||
z: px,
|
||||
perspective: px,
|
||||
transformPerspective: px,
|
||||
opacity: alpha,
|
||||
originX: progressPercentage,
|
||||
originY: progressPercentage,
|
||||
originZ: px,
|
||||
};
|
||||
|
||||
export { transformValueTypes };
|
||||
9
node_modules/framer-motion/dist/es/render/dom/value-types/type-auto.mjs
generated
vendored
Normal file
9
node_modules/framer-motion/dist/es/render/dom/value-types/type-auto.mjs
generated
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
/**
|
||||
* ValueType for "auto"
|
||||
*/
|
||||
const auto = {
|
||||
test: (v) => v === "auto",
|
||||
parse: (v) => v,
|
||||
};
|
||||
|
||||
export { auto };
|
||||
8
node_modules/framer-motion/dist/es/render/dom/value-types/type-int.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/render/dom/value-types/type-int.mjs
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
import { number } from '../../../value/types/numbers/index.mjs';
|
||||
|
||||
const int = {
|
||||
...number,
|
||||
transform: Math.round,
|
||||
};
|
||||
|
||||
export { int };
|
||||
43
node_modules/framer-motion/dist/es/render/dom/viewport/index.mjs
generated
vendored
Normal file
43
node_modules/framer-motion/dist/es/render/dom/viewport/index.mjs
generated
vendored
Normal file
@ -0,0 +1,43 @@
|
||||
import { resolveElements } from 'motion-dom';
|
||||
|
||||
const thresholds = {
|
||||
some: 0,
|
||||
all: 1,
|
||||
};
|
||||
function inView(elementOrSelector, onStart, { root, margin: rootMargin, amount = "some" } = {}) {
|
||||
const elements = resolveElements(elementOrSelector);
|
||||
const activeIntersections = new WeakMap();
|
||||
const onIntersectionChange = (entries) => {
|
||||
entries.forEach((entry) => {
|
||||
const onEnd = activeIntersections.get(entry.target);
|
||||
/**
|
||||
* If there's no change to the intersection, we don't need to
|
||||
* do anything here.
|
||||
*/
|
||||
if (entry.isIntersecting === Boolean(onEnd))
|
||||
return;
|
||||
if (entry.isIntersecting) {
|
||||
const newOnEnd = onStart(entry);
|
||||
if (typeof newOnEnd === "function") {
|
||||
activeIntersections.set(entry.target, newOnEnd);
|
||||
}
|
||||
else {
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
}
|
||||
else if (onEnd) {
|
||||
onEnd(entry);
|
||||
activeIntersections.delete(entry.target);
|
||||
}
|
||||
});
|
||||
};
|
||||
const observer = new IntersectionObserver(onIntersectionChange, {
|
||||
root,
|
||||
rootMargin,
|
||||
threshold: typeof amount === "number" ? amount : thresholds[amount],
|
||||
});
|
||||
elements.forEach((element) => observer.observe(element));
|
||||
return () => observer.disconnect();
|
||||
}
|
||||
|
||||
export { inView };
|
||||
43
node_modules/framer-motion/dist/es/render/html/HTMLVisualElement.mjs
generated
vendored
Normal file
43
node_modules/framer-motion/dist/es/render/html/HTMLVisualElement.mjs
generated
vendored
Normal file
@ -0,0 +1,43 @@
|
||||
import { buildHTMLStyles } from './utils/build-styles.mjs';
|
||||
import { isCSSVariableName } from '../dom/utils/is-css-variable.mjs';
|
||||
import { transformProps } from './utils/transform.mjs';
|
||||
import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.mjs';
|
||||
import { renderHTML } from './utils/render.mjs';
|
||||
import { getDefaultValueType } from '../dom/value-types/defaults.mjs';
|
||||
import { measureViewportBox } from '../../projection/utils/measure.mjs';
|
||||
import { DOMVisualElement } from '../dom/DOMVisualElement.mjs';
|
||||
|
||||
function getComputedStyle(element) {
|
||||
return window.getComputedStyle(element);
|
||||
}
|
||||
class HTMLVisualElement extends DOMVisualElement {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.type = "html";
|
||||
this.renderInstance = renderHTML;
|
||||
}
|
||||
readValueFromInstance(instance, key) {
|
||||
if (transformProps.has(key)) {
|
||||
const defaultType = getDefaultValueType(key);
|
||||
return defaultType ? defaultType.default || 0 : 0;
|
||||
}
|
||||
else {
|
||||
const computedStyle = getComputedStyle(instance);
|
||||
const value = (isCSSVariableName(key)
|
||||
? computedStyle.getPropertyValue(key)
|
||||
: computedStyle[key]) || 0;
|
||||
return typeof value === "string" ? value.trim() : value;
|
||||
}
|
||||
}
|
||||
measureInstanceViewportBox(instance, { transformPagePoint }) {
|
||||
return measureViewportBox(instance, transformPagePoint);
|
||||
}
|
||||
build(renderState, latestValues, props) {
|
||||
buildHTMLStyles(renderState, latestValues, props.transformTemplate);
|
||||
}
|
||||
scrapeMotionValuesFromProps(props, prevProps, visualElement) {
|
||||
return scrapeMotionValuesFromProps(props, prevProps, visualElement);
|
||||
}
|
||||
}
|
||||
|
||||
export { HTMLVisualElement, getComputedStyle };
|
||||
12
node_modules/framer-motion/dist/es/render/html/config-motion.mjs
generated
vendored
Normal file
12
node_modules/framer-motion/dist/es/render/html/config-motion.mjs
generated
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
import { makeUseVisualState } from '../../motion/utils/use-visual-state.mjs';
|
||||
import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.mjs';
|
||||
import { createHtmlRenderState } from './utils/create-render-state.mjs';
|
||||
|
||||
const htmlMotionConfig = {
|
||||
useVisualState: makeUseVisualState({
|
||||
scrapeMotionValuesFromProps,
|
||||
createRenderState: createHtmlRenderState,
|
||||
}),
|
||||
};
|
||||
|
||||
export { htmlMotionConfig };
|
||||
57
node_modules/framer-motion/dist/es/render/html/use-props.mjs
generated
vendored
Normal file
57
node_modules/framer-motion/dist/es/render/html/use-props.mjs
generated
vendored
Normal file
@ -0,0 +1,57 @@
|
||||
import { useMemo } from 'react';
|
||||
import { isForcedMotionValue } from '../../motion/utils/is-forced-motion-value.mjs';
|
||||
import { isMotionValue } from '../../value/utils/is-motion-value.mjs';
|
||||
import { buildHTMLStyles } from './utils/build-styles.mjs';
|
||||
import { createHtmlRenderState } from './utils/create-render-state.mjs';
|
||||
|
||||
function copyRawValuesOnly(target, source, props) {
|
||||
for (const key in source) {
|
||||
if (!isMotionValue(source[key]) && !isForcedMotionValue(key, props)) {
|
||||
target[key] = source[key];
|
||||
}
|
||||
}
|
||||
}
|
||||
function useInitialMotionValues({ transformTemplate }, visualState) {
|
||||
return useMemo(() => {
|
||||
const state = createHtmlRenderState();
|
||||
buildHTMLStyles(state, visualState, transformTemplate);
|
||||
return Object.assign({}, state.vars, state.style);
|
||||
}, [visualState]);
|
||||
}
|
||||
function useStyle(props, visualState) {
|
||||
const styleProp = props.style || {};
|
||||
const style = {};
|
||||
/**
|
||||
* Copy non-Motion Values straight into style
|
||||
*/
|
||||
copyRawValuesOnly(style, styleProp, props);
|
||||
Object.assign(style, useInitialMotionValues(props, visualState));
|
||||
return style;
|
||||
}
|
||||
function useHTMLProps(props, visualState) {
|
||||
// The `any` isn't ideal but it is the type of createElement props argument
|
||||
const htmlProps = {};
|
||||
const style = useStyle(props, visualState);
|
||||
if (props.drag && props.dragListener !== false) {
|
||||
// Disable the ghost element when a user drags
|
||||
htmlProps.draggable = false;
|
||||
// Disable text selection
|
||||
style.userSelect =
|
||||
style.WebkitUserSelect =
|
||||
style.WebkitTouchCallout =
|
||||
"none";
|
||||
// Disable scrolling on the draggable direction
|
||||
style.touchAction =
|
||||
props.drag === true
|
||||
? "none"
|
||||
: `pan-${props.drag === "x" ? "y" : "x"}`;
|
||||
}
|
||||
if (props.tabIndex === undefined &&
|
||||
(props.onTap || props.onTapStart || props.whileTap)) {
|
||||
htmlProps.tabIndex = 0;
|
||||
}
|
||||
htmlProps.style = style;
|
||||
return htmlProps;
|
||||
}
|
||||
|
||||
export { copyRawValuesOnly, useHTMLProps };
|
||||
65
node_modules/framer-motion/dist/es/render/html/utils/build-styles.mjs
generated
vendored
Normal file
65
node_modules/framer-motion/dist/es/render/html/utils/build-styles.mjs
generated
vendored
Normal file
@ -0,0 +1,65 @@
|
||||
import { buildTransform } from './build-transform.mjs';
|
||||
import { isCSSVariableName } from '../../dom/utils/is-css-variable.mjs';
|
||||
import { transformProps } from './transform.mjs';
|
||||
import { getValueAsType } from '../../dom/value-types/get-as-type.mjs';
|
||||
import { numberValueTypes } from '../../dom/value-types/number.mjs';
|
||||
|
||||
function buildHTMLStyles(state, latestValues, transformTemplate) {
|
||||
const { style, vars, transformOrigin } = state;
|
||||
// Track whether we encounter any transform or transformOrigin values.
|
||||
let hasTransform = false;
|
||||
let hasTransformOrigin = false;
|
||||
/**
|
||||
* Loop over all our latest animated values and decide whether to handle them
|
||||
* as a style or CSS variable.
|
||||
*
|
||||
* Transforms and transform origins are kept separately for further processing.
|
||||
*/
|
||||
for (const key in latestValues) {
|
||||
const value = latestValues[key];
|
||||
if (transformProps.has(key)) {
|
||||
// If this is a transform, flag to enable further transform processing
|
||||
hasTransform = true;
|
||||
continue;
|
||||
}
|
||||
else if (isCSSVariableName(key)) {
|
||||
vars[key] = value;
|
||||
continue;
|
||||
}
|
||||
else {
|
||||
// Convert the value to its default value type, ie 0 -> "0px"
|
||||
const valueAsType = getValueAsType(value, numberValueTypes[key]);
|
||||
if (key.startsWith("origin")) {
|
||||
// If this is a transform origin, flag and enable further transform-origin processing
|
||||
hasTransformOrigin = true;
|
||||
transformOrigin[key] =
|
||||
valueAsType;
|
||||
}
|
||||
else {
|
||||
style[key] = valueAsType;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!latestValues.transform) {
|
||||
if (hasTransform || transformTemplate) {
|
||||
style.transform = buildTransform(latestValues, state.transform, transformTemplate);
|
||||
}
|
||||
else if (style.transform) {
|
||||
/**
|
||||
* If we have previously created a transform but currently don't have any,
|
||||
* reset transform style to none.
|
||||
*/
|
||||
style.transform = "none";
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Build a transformOrigin style. Uses the same defaults as the browser for
|
||||
* undefined origins.
|
||||
*/
|
||||
if (hasTransformOrigin) {
|
||||
const { originX = "50%", originY = "50%", originZ = 0, } = transformOrigin;
|
||||
style.transformOrigin = `${originX} ${originY} ${originZ}`;
|
||||
}
|
||||
}
|
||||
|
||||
export { buildHTMLStyles };
|
||||
62
node_modules/framer-motion/dist/es/render/html/utils/build-transform.mjs
generated
vendored
Normal file
62
node_modules/framer-motion/dist/es/render/html/utils/build-transform.mjs
generated
vendored
Normal file
@ -0,0 +1,62 @@
|
||||
import { transformPropOrder } from './transform.mjs';
|
||||
import { getValueAsType } from '../../dom/value-types/get-as-type.mjs';
|
||||
import { numberValueTypes } from '../../dom/value-types/number.mjs';
|
||||
|
||||
const translateAlias = {
|
||||
x: "translateX",
|
||||
y: "translateY",
|
||||
z: "translateZ",
|
||||
transformPerspective: "perspective",
|
||||
};
|
||||
const numTransforms = transformPropOrder.length;
|
||||
/**
|
||||
* Build a CSS transform style from individual x/y/scale etc properties.
|
||||
*
|
||||
* This outputs with a default order of transforms/scales/rotations, this can be customised by
|
||||
* providing a transformTemplate function.
|
||||
*/
|
||||
function buildTransform(latestValues, transform, transformTemplate) {
|
||||
// The transform string we're going to build into.
|
||||
let transformString = "";
|
||||
let transformIsDefault = true;
|
||||
/**
|
||||
* Loop over all possible transforms in order, adding the ones that
|
||||
* are present to the transform string.
|
||||
*/
|
||||
for (let i = 0; i < numTransforms; i++) {
|
||||
const key = transformPropOrder[i];
|
||||
const value = latestValues[key];
|
||||
if (value === undefined)
|
||||
continue;
|
||||
let valueIsDefault = true;
|
||||
if (typeof value === "number") {
|
||||
valueIsDefault = value === (key.startsWith("scale") ? 1 : 0);
|
||||
}
|
||||
else {
|
||||
valueIsDefault = parseFloat(value) === 0;
|
||||
}
|
||||
if (!valueIsDefault || transformTemplate) {
|
||||
const valueAsType = getValueAsType(value, numberValueTypes[key]);
|
||||
if (!valueIsDefault) {
|
||||
transformIsDefault = false;
|
||||
const transformName = translateAlias[key] || key;
|
||||
transformString += `${transformName}(${valueAsType}) `;
|
||||
}
|
||||
if (transformTemplate) {
|
||||
transform[key] = valueAsType;
|
||||
}
|
||||
}
|
||||
}
|
||||
transformString = transformString.trim();
|
||||
// If we have a custom `transform` template, pass our transform values and
|
||||
// generated transformString to that before returning
|
||||
if (transformTemplate) {
|
||||
transformString = transformTemplate(transform, transformIsDefault ? "" : transformString);
|
||||
}
|
||||
else if (transformIsDefault) {
|
||||
transformString = "none";
|
||||
}
|
||||
return transformString;
|
||||
}
|
||||
|
||||
export { buildTransform };
|
||||
8
node_modules/framer-motion/dist/es/render/html/utils/create-render-state.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/render/html/utils/create-render-state.mjs
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
const createHtmlRenderState = () => ({
|
||||
style: {},
|
||||
transform: {},
|
||||
transformOrigin: {},
|
||||
vars: {},
|
||||
});
|
||||
|
||||
export { createHtmlRenderState };
|
||||
30
node_modules/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs
generated
vendored
Normal file
30
node_modules/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs
generated
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
import { analyseComplexValue } from '../../../value/types/complex/index.mjs';
|
||||
import { getAnimatableNone } from '../../dom/value-types/animatable-none.mjs';
|
||||
|
||||
/**
|
||||
* If we encounter keyframes like "none" or "0" and we also have keyframes like
|
||||
* "#fff" or "200px 200px" we want to find a keyframe to serve as a template for
|
||||
* the "none" keyframes. In this case "#fff" or "200px 200px" - then these get turned into
|
||||
* zero equivalents, i.e. "#fff0" or "0px 0px".
|
||||
*/
|
||||
const invalidTemplates = new Set(["auto", "none", "0"]);
|
||||
function makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name) {
|
||||
let i = 0;
|
||||
let animatableTemplate = undefined;
|
||||
while (i < unresolvedKeyframes.length && !animatableTemplate) {
|
||||
const keyframe = unresolvedKeyframes[i];
|
||||
if (typeof keyframe === "string" &&
|
||||
!invalidTemplates.has(keyframe) &&
|
||||
analyseComplexValue(keyframe).values.length) {
|
||||
animatableTemplate = unresolvedKeyframes[i];
|
||||
}
|
||||
i++;
|
||||
}
|
||||
if (animatableTemplate && name) {
|
||||
for (const noneIndex of noneKeyframeIndexes) {
|
||||
unresolvedKeyframes[noneIndex] = getAnimatableNone(name, animatableTemplate);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { makeNoneKeyframesAnimatable };
|
||||
9
node_modules/framer-motion/dist/es/render/html/utils/render.mjs
generated
vendored
Normal file
9
node_modules/framer-motion/dist/es/render/html/utils/render.mjs
generated
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
function renderHTML(element, { style, vars }, styleProp, projection) {
|
||||
Object.assign(element.style, style, projection && projection.getProjectionStyles(styleProp));
|
||||
// Loop over any CSS variables and assign those.
|
||||
for (const key in vars) {
|
||||
element.style.setProperty(key, vars[key]);
|
||||
}
|
||||
}
|
||||
|
||||
export { renderHTML };
|
||||
20
node_modules/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs
generated
vendored
Normal file
20
node_modules/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs
generated
vendored
Normal file
@ -0,0 +1,20 @@
|
||||
import { isForcedMotionValue } from '../../../motion/utils/is-forced-motion-value.mjs';
|
||||
import { isMotionValue } from '../../../value/utils/is-motion-value.mjs';
|
||||
|
||||
function scrapeMotionValuesFromProps(props, prevProps, visualElement) {
|
||||
var _a;
|
||||
const { style } = props;
|
||||
const newValues = {};
|
||||
for (const key in style) {
|
||||
if (isMotionValue(style[key]) ||
|
||||
(prevProps.style &&
|
||||
isMotionValue(prevProps.style[key])) ||
|
||||
isForcedMotionValue(key, props) ||
|
||||
((_a = visualElement === null || visualElement === void 0 ? void 0 : visualElement.getValue(key)) === null || _a === void 0 ? void 0 : _a.liveStyle) !== undefined) {
|
||||
newValues[key] = style[key];
|
||||
}
|
||||
}
|
||||
return newValues;
|
||||
}
|
||||
|
||||
export { scrapeMotionValuesFromProps };
|
||||
28
node_modules/framer-motion/dist/es/render/html/utils/transform.mjs
generated
vendored
Normal file
28
node_modules/framer-motion/dist/es/render/html/utils/transform.mjs
generated
vendored
Normal file
@ -0,0 +1,28 @@
|
||||
/**
|
||||
* Generate a list of every possible transform key.
|
||||
*/
|
||||
const transformPropOrder = [
|
||||
"transformPerspective",
|
||||
"x",
|
||||
"y",
|
||||
"z",
|
||||
"translateX",
|
||||
"translateY",
|
||||
"translateZ",
|
||||
"scale",
|
||||
"scaleX",
|
||||
"scaleY",
|
||||
"rotate",
|
||||
"rotateX",
|
||||
"rotateY",
|
||||
"rotateZ",
|
||||
"skew",
|
||||
"skewX",
|
||||
"skewY",
|
||||
];
|
||||
/**
|
||||
* A quick lookup for transform props.
|
||||
*/
|
||||
const transformProps = new Set(transformPropOrder);
|
||||
|
||||
export { transformPropOrder, transformProps };
|
||||
41
node_modules/framer-motion/dist/es/render/object/ObjectVisualElement.mjs
generated
vendored
Normal file
41
node_modules/framer-motion/dist/es/render/object/ObjectVisualElement.mjs
generated
vendored
Normal file
@ -0,0 +1,41 @@
|
||||
import { createBox } from '../../projection/geometry/models.mjs';
|
||||
import { VisualElement } from '../VisualElement.mjs';
|
||||
|
||||
function isObjectKey(key, object) {
|
||||
return key in object;
|
||||
}
|
||||
class ObjectVisualElement extends VisualElement {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.type = "object";
|
||||
}
|
||||
readValueFromInstance(instance, key) {
|
||||
if (isObjectKey(key, instance)) {
|
||||
const value = instance[key];
|
||||
if (typeof value === "string" || typeof value === "number") {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
getBaseTargetFromProps() {
|
||||
return undefined;
|
||||
}
|
||||
removeValueFromRenderState(key, renderState) {
|
||||
delete renderState.output[key];
|
||||
}
|
||||
measureInstanceViewportBox() {
|
||||
return createBox();
|
||||
}
|
||||
build(renderState, latestValues) {
|
||||
Object.assign(renderState.output, latestValues);
|
||||
}
|
||||
renderInstance(instance, { output }) {
|
||||
Object.assign(instance, output);
|
||||
}
|
||||
sortInstanceNodePosition() {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
|
||||
export { ObjectVisualElement };
|
||||
3
node_modules/framer-motion/dist/es/render/store.mjs
generated
vendored
Normal file
3
node_modules/framer-motion/dist/es/render/store.mjs
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
const visualElementStore = new WeakMap();
|
||||
|
||||
export { visualElementStore };
|
||||
45
node_modules/framer-motion/dist/es/render/svg/SVGVisualElement.mjs
generated
vendored
Normal file
45
node_modules/framer-motion/dist/es/render/svg/SVGVisualElement.mjs
generated
vendored
Normal file
@ -0,0 +1,45 @@
|
||||
import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.mjs';
|
||||
import { DOMVisualElement } from '../dom/DOMVisualElement.mjs';
|
||||
import { buildSVGAttrs } from './utils/build-attrs.mjs';
|
||||
import { camelToDash } from '../dom/utils/camel-to-dash.mjs';
|
||||
import { camelCaseAttributes } from './utils/camel-case-attrs.mjs';
|
||||
import { transformProps } from '../html/utils/transform.mjs';
|
||||
import { renderSVG } from './utils/render.mjs';
|
||||
import { getDefaultValueType } from '../dom/value-types/defaults.mjs';
|
||||
import { createBox } from '../../projection/geometry/models.mjs';
|
||||
import { isSVGTag } from './utils/is-svg-tag.mjs';
|
||||
|
||||
class SVGVisualElement extends DOMVisualElement {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.type = "svg";
|
||||
this.isSVGTag = false;
|
||||
this.measureInstanceViewportBox = createBox;
|
||||
}
|
||||
getBaseTargetFromProps(props, key) {
|
||||
return props[key];
|
||||
}
|
||||
readValueFromInstance(instance, key) {
|
||||
if (transformProps.has(key)) {
|
||||
const defaultType = getDefaultValueType(key);
|
||||
return defaultType ? defaultType.default || 0 : 0;
|
||||
}
|
||||
key = !camelCaseAttributes.has(key) ? camelToDash(key) : key;
|
||||
return instance.getAttribute(key);
|
||||
}
|
||||
scrapeMotionValuesFromProps(props, prevProps, visualElement) {
|
||||
return scrapeMotionValuesFromProps(props, prevProps, visualElement);
|
||||
}
|
||||
build(renderState, latestValues, props) {
|
||||
buildSVGAttrs(renderState, latestValues, this.isSVGTag, props.transformTemplate);
|
||||
}
|
||||
renderInstance(instance, renderState, styleProp, projection) {
|
||||
renderSVG(instance, renderState, styleProp, projection);
|
||||
}
|
||||
mount(instance) {
|
||||
this.isSVGTag = isSVGTag(instance.tagName);
|
||||
super.mount(instance);
|
||||
}
|
||||
}
|
||||
|
||||
export { SVGVisualElement };
|
||||
40
node_modules/framer-motion/dist/es/render/svg/config-motion.mjs
generated
vendored
Normal file
40
node_modules/framer-motion/dist/es/render/svg/config-motion.mjs
generated
vendored
Normal file
@ -0,0 +1,40 @@
|
||||
import { renderSVG } from './utils/render.mjs';
|
||||
import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.mjs';
|
||||
import { makeUseVisualState } from '../../motion/utils/use-visual-state.mjs';
|
||||
import { createSvgRenderState } from './utils/create-render-state.mjs';
|
||||
import { buildSVGAttrs } from './utils/build-attrs.mjs';
|
||||
import { isSVGTag } from './utils/is-svg-tag.mjs';
|
||||
import { frame } from '../../frameloop/frame.mjs';
|
||||
|
||||
const svgMotionConfig = {
|
||||
useVisualState: makeUseVisualState({
|
||||
scrapeMotionValuesFromProps: scrapeMotionValuesFromProps,
|
||||
createRenderState: createSvgRenderState,
|
||||
onMount: (props, instance, { renderState, latestValues }) => {
|
||||
frame.read(() => {
|
||||
try {
|
||||
renderState.dimensions =
|
||||
typeof instance.getBBox ===
|
||||
"function"
|
||||
? instance.getBBox()
|
||||
: instance.getBoundingClientRect();
|
||||
}
|
||||
catch (e) {
|
||||
// Most likely trying to measure an unrendered element under Firefox
|
||||
renderState.dimensions = {
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 0,
|
||||
height: 0,
|
||||
};
|
||||
}
|
||||
});
|
||||
frame.render(() => {
|
||||
buildSVGAttrs(renderState, latestValues, isSVGTag(instance.tagName), props.transformTemplate);
|
||||
renderSVG(instance, renderState);
|
||||
});
|
||||
},
|
||||
}),
|
||||
};
|
||||
|
||||
export { svgMotionConfig };
|
||||
33
node_modules/framer-motion/dist/es/render/svg/lowercase-elements.mjs
generated
vendored
Normal file
33
node_modules/framer-motion/dist/es/render/svg/lowercase-elements.mjs
generated
vendored
Normal file
@ -0,0 +1,33 @@
|
||||
/**
|
||||
* We keep these listed separately as we use the lowercase tag names as part
|
||||
* of the runtime bundle to detect SVG components
|
||||
*/
|
||||
const lowercaseSVGElements = [
|
||||
"animate",
|
||||
"circle",
|
||||
"defs",
|
||||
"desc",
|
||||
"ellipse",
|
||||
"g",
|
||||
"image",
|
||||
"line",
|
||||
"filter",
|
||||
"marker",
|
||||
"mask",
|
||||
"metadata",
|
||||
"path",
|
||||
"pattern",
|
||||
"polygon",
|
||||
"polyline",
|
||||
"rect",
|
||||
"stop",
|
||||
"switch",
|
||||
"symbol",
|
||||
"svg",
|
||||
"text",
|
||||
"tspan",
|
||||
"use",
|
||||
"view",
|
||||
];
|
||||
|
||||
export { lowercaseSVGElements };
|
||||
24
node_modules/framer-motion/dist/es/render/svg/use-props.mjs
generated
vendored
Normal file
24
node_modules/framer-motion/dist/es/render/svg/use-props.mjs
generated
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
import { useMemo } from 'react';
|
||||
import { copyRawValuesOnly } from '../html/use-props.mjs';
|
||||
import { buildSVGAttrs } from './utils/build-attrs.mjs';
|
||||
import { createSvgRenderState } from './utils/create-render-state.mjs';
|
||||
import { isSVGTag } from './utils/is-svg-tag.mjs';
|
||||
|
||||
function useSVGProps(props, visualState, _isStatic, Component) {
|
||||
const visualProps = useMemo(() => {
|
||||
const state = createSvgRenderState();
|
||||
buildSVGAttrs(state, visualState, isSVGTag(Component), props.transformTemplate);
|
||||
return {
|
||||
...state.attrs,
|
||||
style: { ...state.style },
|
||||
};
|
||||
}, [visualState]);
|
||||
if (props.style) {
|
||||
const rawStyles = {};
|
||||
copyRawValuesOnly(rawStyles, props.style, props);
|
||||
visualProps.style = { ...rawStyles, ...visualProps.style };
|
||||
}
|
||||
return visualProps;
|
||||
}
|
||||
|
||||
export { useSVGProps };
|
||||
52
node_modules/framer-motion/dist/es/render/svg/utils/build-attrs.mjs
generated
vendored
Normal file
52
node_modules/framer-motion/dist/es/render/svg/utils/build-attrs.mjs
generated
vendored
Normal file
@ -0,0 +1,52 @@
|
||||
import { buildHTMLStyles } from '../../html/utils/build-styles.mjs';
|
||||
import { calcSVGTransformOrigin } from './transform-origin.mjs';
|
||||
import { buildSVGPath } from './path.mjs';
|
||||
|
||||
/**
|
||||
* Build SVG visual attrbutes, like cx and style.transform
|
||||
*/
|
||||
function buildSVGAttrs(state, { attrX, attrY, attrScale, originX, originY, pathLength, pathSpacing = 1, pathOffset = 0,
|
||||
// This is object creation, which we try to avoid per-frame.
|
||||
...latest }, isSVGTag, transformTemplate) {
|
||||
buildHTMLStyles(state, latest, transformTemplate);
|
||||
/**
|
||||
* For svg tags we just want to make sure viewBox is animatable and treat all the styles
|
||||
* as normal HTML tags.
|
||||
*/
|
||||
if (isSVGTag) {
|
||||
if (state.style.viewBox) {
|
||||
state.attrs.viewBox = state.style.viewBox;
|
||||
}
|
||||
return;
|
||||
}
|
||||
state.attrs = state.style;
|
||||
state.style = {};
|
||||
const { attrs, style, dimensions } = state;
|
||||
/**
|
||||
* However, we apply transforms as CSS transforms. So if we detect a transform we take it from attrs
|
||||
* and copy it into style.
|
||||
*/
|
||||
if (attrs.transform) {
|
||||
if (dimensions)
|
||||
style.transform = attrs.transform;
|
||||
delete attrs.transform;
|
||||
}
|
||||
// Parse transformOrigin
|
||||
if (dimensions &&
|
||||
(originX !== undefined || originY !== undefined || style.transform)) {
|
||||
style.transformOrigin = calcSVGTransformOrigin(dimensions, originX !== undefined ? originX : 0.5, originY !== undefined ? originY : 0.5);
|
||||
}
|
||||
// Render attrX/attrY/attrScale as attributes
|
||||
if (attrX !== undefined)
|
||||
attrs.x = attrX;
|
||||
if (attrY !== undefined)
|
||||
attrs.y = attrY;
|
||||
if (attrScale !== undefined)
|
||||
attrs.scale = attrScale;
|
||||
// Build SVG path if one has been defined
|
||||
if (pathLength !== undefined) {
|
||||
buildSVGPath(attrs, pathLength, pathSpacing, pathOffset, false);
|
||||
}
|
||||
}
|
||||
|
||||
export { buildSVGAttrs };
|
||||
30
node_modules/framer-motion/dist/es/render/svg/utils/camel-case-attrs.mjs
generated
vendored
Normal file
30
node_modules/framer-motion/dist/es/render/svg/utils/camel-case-attrs.mjs
generated
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
/**
|
||||
* A set of attribute names that are always read/written as camel case.
|
||||
*/
|
||||
const camelCaseAttributes = new Set([
|
||||
"baseFrequency",
|
||||
"diffuseConstant",
|
||||
"kernelMatrix",
|
||||
"kernelUnitLength",
|
||||
"keySplines",
|
||||
"keyTimes",
|
||||
"limitingConeAngle",
|
||||
"markerHeight",
|
||||
"markerWidth",
|
||||
"numOctaves",
|
||||
"targetX",
|
||||
"targetY",
|
||||
"surfaceScale",
|
||||
"specularConstant",
|
||||
"specularExponent",
|
||||
"stdDeviation",
|
||||
"tableValues",
|
||||
"viewBox",
|
||||
"gradientTransform",
|
||||
"pathLength",
|
||||
"startOffset",
|
||||
"textLength",
|
||||
"lengthAdjust",
|
||||
]);
|
||||
|
||||
export { camelCaseAttributes };
|
||||
8
node_modules/framer-motion/dist/es/render/svg/utils/create-render-state.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/render/svg/utils/create-render-state.mjs
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
import { createHtmlRenderState } from '../../html/utils/create-render-state.mjs';
|
||||
|
||||
const createSvgRenderState = () => ({
|
||||
...createHtmlRenderState(),
|
||||
attrs: {},
|
||||
});
|
||||
|
||||
export { createSvgRenderState };
|
||||
3
node_modules/framer-motion/dist/es/render/svg/utils/is-svg-tag.mjs
generated
vendored
Normal file
3
node_modules/framer-motion/dist/es/render/svg/utils/is-svg-tag.mjs
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
const isSVGTag = (tag) => typeof tag === "string" && tag.toLowerCase() === "svg";
|
||||
|
||||
export { isSVGTag };
|
||||
32
node_modules/framer-motion/dist/es/render/svg/utils/path.mjs
generated
vendored
Normal file
32
node_modules/framer-motion/dist/es/render/svg/utils/path.mjs
generated
vendored
Normal file
@ -0,0 +1,32 @@
|
||||
import { px } from '../../../value/types/numbers/units.mjs';
|
||||
|
||||
const dashKeys = {
|
||||
offset: "stroke-dashoffset",
|
||||
array: "stroke-dasharray",
|
||||
};
|
||||
const camelKeys = {
|
||||
offset: "strokeDashoffset",
|
||||
array: "strokeDasharray",
|
||||
};
|
||||
/**
|
||||
* Build SVG path properties. Uses the path's measured length to convert
|
||||
* our custom pathLength, pathSpacing and pathOffset into stroke-dashoffset
|
||||
* and stroke-dasharray attributes.
|
||||
*
|
||||
* This function is mutative to reduce per-frame GC.
|
||||
*/
|
||||
function buildSVGPath(attrs, length, spacing = 1, offset = 0, useDashCase = true) {
|
||||
// Normalise path length by setting SVG attribute pathLength to 1
|
||||
attrs.pathLength = 1;
|
||||
// We use dash case when setting attributes directly to the DOM node and camel case
|
||||
// when defining props on a React component.
|
||||
const keys = useDashCase ? dashKeys : camelKeys;
|
||||
// Build the dash offset
|
||||
attrs[keys.offset] = px.transform(-offset);
|
||||
// Build the dash array
|
||||
const pathLength = px.transform(length);
|
||||
const pathSpacing = px.transform(spacing);
|
||||
attrs[keys.array] = `${pathLength} ${pathSpacing}`;
|
||||
}
|
||||
|
||||
export { buildSVGPath };
|
||||
12
node_modules/framer-motion/dist/es/render/svg/utils/render.mjs
generated
vendored
Normal file
12
node_modules/framer-motion/dist/es/render/svg/utils/render.mjs
generated
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
import { camelToDash } from '../../dom/utils/camel-to-dash.mjs';
|
||||
import { renderHTML } from '../../html/utils/render.mjs';
|
||||
import { camelCaseAttributes } from './camel-case-attrs.mjs';
|
||||
|
||||
function renderSVG(element, renderState, _styleProp, projection) {
|
||||
renderHTML(element, renderState, undefined, projection);
|
||||
for (const key in renderState.attrs) {
|
||||
element.setAttribute(!camelCaseAttributes.has(key) ? camelToDash(key) : key, renderState.attrs[key]);
|
||||
}
|
||||
}
|
||||
|
||||
export { renderSVG };
|
||||
19
node_modules/framer-motion/dist/es/render/svg/utils/scrape-motion-values.mjs
generated
vendored
Normal file
19
node_modules/framer-motion/dist/es/render/svg/utils/scrape-motion-values.mjs
generated
vendored
Normal file
@ -0,0 +1,19 @@
|
||||
import { isMotionValue } from '../../../value/utils/is-motion-value.mjs';
|
||||
import { scrapeMotionValuesFromProps as scrapeMotionValuesFromProps$1 } from '../../html/utils/scrape-motion-values.mjs';
|
||||
import { transformPropOrder } from '../../html/utils/transform.mjs';
|
||||
|
||||
function scrapeMotionValuesFromProps(props, prevProps, visualElement) {
|
||||
const newValues = scrapeMotionValuesFromProps$1(props, prevProps, visualElement);
|
||||
for (const key in props) {
|
||||
if (isMotionValue(props[key]) ||
|
||||
isMotionValue(prevProps[key])) {
|
||||
const targetKey = transformPropOrder.indexOf(key) !== -1
|
||||
? "attr" + key.charAt(0).toUpperCase() + key.substring(1)
|
||||
: key;
|
||||
newValues[targetKey] = props[key];
|
||||
}
|
||||
}
|
||||
return newValues;
|
||||
}
|
||||
|
||||
export { scrapeMotionValuesFromProps };
|
||||
18
node_modules/framer-motion/dist/es/render/svg/utils/transform-origin.mjs
generated
vendored
Normal file
18
node_modules/framer-motion/dist/es/render/svg/utils/transform-origin.mjs
generated
vendored
Normal file
@ -0,0 +1,18 @@
|
||||
import { px } from '../../../value/types/numbers/units.mjs';
|
||||
|
||||
function calcOrigin(origin, offset, size) {
|
||||
return typeof origin === "string"
|
||||
? origin
|
||||
: px.transform(offset + size * origin);
|
||||
}
|
||||
/**
|
||||
* The SVG transform origin defaults are different to CSS and is less intuitive,
|
||||
* so we use the measured dimensions of the SVG to reconcile these.
|
||||
*/
|
||||
function calcSVGTransformOrigin(dimensions, originX, originY) {
|
||||
const pxOriginX = calcOrigin(originX, dimensions.x, dimensions.width);
|
||||
const pxOriginY = calcOrigin(originY, dimensions.y, dimensions.height);
|
||||
return `${pxOriginX} ${pxOriginY}`;
|
||||
}
|
||||
|
||||
export { calcSVGTransformOrigin };
|
||||
164
node_modules/framer-motion/dist/es/render/utils/KeyframesResolver.mjs
generated
vendored
Normal file
164
node_modules/framer-motion/dist/es/render/utils/KeyframesResolver.mjs
generated
vendored
Normal file
@ -0,0 +1,164 @@
|
||||
import { removeNonTranslationalTransform } from '../dom/utils/unit-conversion.mjs';
|
||||
import { frame } from '../../frameloop/frame.mjs';
|
||||
|
||||
const toResolve = new Set();
|
||||
let isScheduled = false;
|
||||
let anyNeedsMeasurement = false;
|
||||
function measureAllKeyframes() {
|
||||
if (anyNeedsMeasurement) {
|
||||
const resolversToMeasure = Array.from(toResolve).filter((resolver) => resolver.needsMeasurement);
|
||||
const elementsToMeasure = new Set(resolversToMeasure.map((resolver) => resolver.element));
|
||||
const transformsToRestore = new Map();
|
||||
/**
|
||||
* Write pass
|
||||
* If we're measuring elements we want to remove bounding box-changing transforms.
|
||||
*/
|
||||
elementsToMeasure.forEach((element) => {
|
||||
const removedTransforms = removeNonTranslationalTransform(element);
|
||||
if (!removedTransforms.length)
|
||||
return;
|
||||
transformsToRestore.set(element, removedTransforms);
|
||||
element.render();
|
||||
});
|
||||
// Read
|
||||
resolversToMeasure.forEach((resolver) => resolver.measureInitialState());
|
||||
// Write
|
||||
elementsToMeasure.forEach((element) => {
|
||||
element.render();
|
||||
const restore = transformsToRestore.get(element);
|
||||
if (restore) {
|
||||
restore.forEach(([key, value]) => {
|
||||
var _a;
|
||||
(_a = element.getValue(key)) === null || _a === void 0 ? void 0 : _a.set(value);
|
||||
});
|
||||
}
|
||||
});
|
||||
// Read
|
||||
resolversToMeasure.forEach((resolver) => resolver.measureEndState());
|
||||
// Write
|
||||
resolversToMeasure.forEach((resolver) => {
|
||||
if (resolver.suspendedScrollY !== undefined) {
|
||||
window.scrollTo(0, resolver.suspendedScrollY);
|
||||
}
|
||||
});
|
||||
}
|
||||
anyNeedsMeasurement = false;
|
||||
isScheduled = false;
|
||||
toResolve.forEach((resolver) => resolver.complete());
|
||||
toResolve.clear();
|
||||
}
|
||||
function readAllKeyframes() {
|
||||
toResolve.forEach((resolver) => {
|
||||
resolver.readKeyframes();
|
||||
if (resolver.needsMeasurement) {
|
||||
anyNeedsMeasurement = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
function flushKeyframeResolvers() {
|
||||
readAllKeyframes();
|
||||
measureAllKeyframes();
|
||||
}
|
||||
class KeyframeResolver {
|
||||
constructor(unresolvedKeyframes, onComplete, name, motionValue, element, isAsync = false) {
|
||||
/**
|
||||
* Track whether this resolver has completed. Once complete, it never
|
||||
* needs to attempt keyframe resolution again.
|
||||
*/
|
||||
this.isComplete = false;
|
||||
/**
|
||||
* Track whether this resolver is async. If it is, it'll be added to the
|
||||
* resolver queue and flushed in the next frame. Resolvers that aren't going
|
||||
* to trigger read/write thrashing don't need to be async.
|
||||
*/
|
||||
this.isAsync = false;
|
||||
/**
|
||||
* Track whether this resolver needs to perform a measurement
|
||||
* to resolve its keyframes.
|
||||
*/
|
||||
this.needsMeasurement = false;
|
||||
/**
|
||||
* Track whether this resolver is currently scheduled to resolve
|
||||
* to allow it to be cancelled and resumed externally.
|
||||
*/
|
||||
this.isScheduled = false;
|
||||
this.unresolvedKeyframes = [...unresolvedKeyframes];
|
||||
this.onComplete = onComplete;
|
||||
this.name = name;
|
||||
this.motionValue = motionValue;
|
||||
this.element = element;
|
||||
this.isAsync = isAsync;
|
||||
}
|
||||
scheduleResolve() {
|
||||
this.isScheduled = true;
|
||||
if (this.isAsync) {
|
||||
toResolve.add(this);
|
||||
if (!isScheduled) {
|
||||
isScheduled = true;
|
||||
frame.read(readAllKeyframes);
|
||||
frame.resolveKeyframes(measureAllKeyframes);
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.readKeyframes();
|
||||
this.complete();
|
||||
}
|
||||
}
|
||||
readKeyframes() {
|
||||
const { unresolvedKeyframes, name, element, motionValue } = this;
|
||||
/**
|
||||
* If a keyframe is null, we hydrate it either by reading it from
|
||||
* the instance, or propagating from previous keyframes.
|
||||
*/
|
||||
for (let i = 0; i < unresolvedKeyframes.length; i++) {
|
||||
if (unresolvedKeyframes[i] === null) {
|
||||
/**
|
||||
* If the first keyframe is null, we need to find its value by sampling the element
|
||||
*/
|
||||
if (i === 0) {
|
||||
const currentValue = motionValue === null || motionValue === void 0 ? void 0 : motionValue.get();
|
||||
const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
|
||||
if (currentValue !== undefined) {
|
||||
unresolvedKeyframes[0] = currentValue;
|
||||
}
|
||||
else if (element && name) {
|
||||
const valueAsRead = element.readValue(name, finalKeyframe);
|
||||
if (valueAsRead !== undefined && valueAsRead !== null) {
|
||||
unresolvedKeyframes[0] = valueAsRead;
|
||||
}
|
||||
}
|
||||
if (unresolvedKeyframes[0] === undefined) {
|
||||
unresolvedKeyframes[0] = finalKeyframe;
|
||||
}
|
||||
if (motionValue && currentValue === undefined) {
|
||||
motionValue.set(unresolvedKeyframes[0]);
|
||||
}
|
||||
}
|
||||
else {
|
||||
unresolvedKeyframes[i] = unresolvedKeyframes[i - 1];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
setFinalKeyframe() { }
|
||||
measureInitialState() { }
|
||||
renderEndStyles() { }
|
||||
measureEndState() { }
|
||||
complete() {
|
||||
this.isComplete = true;
|
||||
this.onComplete(this.unresolvedKeyframes, this.finalKeyframe);
|
||||
toResolve.delete(this);
|
||||
}
|
||||
cancel() {
|
||||
if (!this.isComplete) {
|
||||
this.isScheduled = false;
|
||||
toResolve.delete(this);
|
||||
}
|
||||
}
|
||||
resume() {
|
||||
if (!this.isComplete)
|
||||
this.scheduleResolve();
|
||||
}
|
||||
}
|
||||
|
||||
export { KeyframeResolver, flushKeyframeResolvers };
|
||||
332
node_modules/framer-motion/dist/es/render/utils/animation-state.mjs
generated
vendored
Normal file
332
node_modules/framer-motion/dist/es/render/utils/animation-state.mjs
generated
vendored
Normal file
@ -0,0 +1,332 @@
|
||||
import { isAnimationControls } from '../../animation/utils/is-animation-controls.mjs';
|
||||
import { isKeyframesTarget } from '../../animation/utils/is-keyframes-target.mjs';
|
||||
import { shallowCompare } from '../../utils/shallow-compare.mjs';
|
||||
import { isVariantLabel } from './is-variant-label.mjs';
|
||||
import { resolveVariant } from './resolve-dynamic-variants.mjs';
|
||||
import { variantPriorityOrder } from './variant-props.mjs';
|
||||
import { animateVisualElement } from '../../animation/interfaces/visual-element.mjs';
|
||||
import { getVariantContext } from './get-variant-context.mjs';
|
||||
|
||||
const reversePriorityOrder = [...variantPriorityOrder].reverse();
|
||||
const numAnimationTypes = variantPriorityOrder.length;
|
||||
function animateList(visualElement) {
|
||||
return (animations) => Promise.all(animations.map(({ animation, options }) => animateVisualElement(visualElement, animation, options)));
|
||||
}
|
||||
function createAnimationState(visualElement) {
|
||||
let animate = animateList(visualElement);
|
||||
let state = createState();
|
||||
let isInitialRender = true;
|
||||
/**
|
||||
* This function will be used to reduce the animation definitions for
|
||||
* each active animation type into an object of resolved values for it.
|
||||
*/
|
||||
const buildResolvedTypeValues = (type) => (acc, definition) => {
|
||||
var _a;
|
||||
const resolved = resolveVariant(visualElement, definition, type === "exit"
|
||||
? (_a = visualElement.presenceContext) === null || _a === void 0 ? void 0 : _a.custom
|
||||
: undefined);
|
||||
if (resolved) {
|
||||
const { transition, transitionEnd, ...target } = resolved;
|
||||
acc = { ...acc, ...target, ...transitionEnd };
|
||||
}
|
||||
return acc;
|
||||
};
|
||||
/**
|
||||
* This just allows us to inject mocked animation functions
|
||||
* @internal
|
||||
*/
|
||||
function setAnimateFunction(makeAnimator) {
|
||||
animate = makeAnimator(visualElement);
|
||||
}
|
||||
/**
|
||||
* When we receive new props, we need to:
|
||||
* 1. Create a list of protected keys for each type. This is a directory of
|
||||
* value keys that are currently being "handled" by types of a higher priority
|
||||
* so that whenever an animation is played of a given type, these values are
|
||||
* protected from being animated.
|
||||
* 2. Determine if an animation type needs animating.
|
||||
* 3. Determine if any values have been removed from a type and figure out
|
||||
* what to animate those to.
|
||||
*/
|
||||
function animateChanges(changedActiveType) {
|
||||
const { props } = visualElement;
|
||||
const context = getVariantContext(visualElement.parent) || {};
|
||||
/**
|
||||
* A list of animations that we'll build into as we iterate through the animation
|
||||
* types. This will get executed at the end of the function.
|
||||
*/
|
||||
const animations = [];
|
||||
/**
|
||||
* Keep track of which values have been removed. Then, as we hit lower priority
|
||||
* animation types, we can check if they contain removed values and animate to that.
|
||||
*/
|
||||
const removedKeys = new Set();
|
||||
/**
|
||||
* A dictionary of all encountered keys. This is an object to let us build into and
|
||||
* copy it without iteration. Each time we hit an animation type we set its protected
|
||||
* keys - the keys its not allowed to animate - to the latest version of this object.
|
||||
*/
|
||||
let encounteredKeys = {};
|
||||
/**
|
||||
* If a variant has been removed at a given index, and this component is controlling
|
||||
* variant animations, we want to ensure lower-priority variants are forced to animate.
|
||||
*/
|
||||
let removedVariantIndex = Infinity;
|
||||
/**
|
||||
* Iterate through all animation types in reverse priority order. For each, we want to
|
||||
* detect which values it's handling and whether or not they've changed (and therefore
|
||||
* need to be animated). If any values have been removed, we want to detect those in
|
||||
* lower priority props and flag for animation.
|
||||
*/
|
||||
for (let i = 0; i < numAnimationTypes; i++) {
|
||||
const type = reversePriorityOrder[i];
|
||||
const typeState = state[type];
|
||||
const prop = props[type] !== undefined
|
||||
? props[type]
|
||||
: context[type];
|
||||
const propIsVariant = isVariantLabel(prop);
|
||||
/**
|
||||
* If this type has *just* changed isActive status, set activeDelta
|
||||
* to that status. Otherwise set to null.
|
||||
*/
|
||||
const activeDelta = type === changedActiveType ? typeState.isActive : null;
|
||||
if (activeDelta === false)
|
||||
removedVariantIndex = i;
|
||||
/**
|
||||
* If this prop is an inherited variant, rather than been set directly on the
|
||||
* component itself, we want to make sure we allow the parent to trigger animations.
|
||||
*
|
||||
* TODO: Can probably change this to a !isControllingVariants check
|
||||
*/
|
||||
let isInherited = prop === context[type] &&
|
||||
prop !== props[type] &&
|
||||
propIsVariant;
|
||||
/**
|
||||
*
|
||||
*/
|
||||
if (isInherited &&
|
||||
isInitialRender &&
|
||||
visualElement.manuallyAnimateOnMount) {
|
||||
isInherited = false;
|
||||
}
|
||||
/**
|
||||
* Set all encountered keys so far as the protected keys for this type. This will
|
||||
* be any key that has been animated or otherwise handled by active, higher-priortiy types.
|
||||
*/
|
||||
typeState.protectedKeys = { ...encounteredKeys };
|
||||
// Check if we can skip analysing this prop early
|
||||
if (
|
||||
// If it isn't active and hasn't *just* been set as inactive
|
||||
(!typeState.isActive && activeDelta === null) ||
|
||||
// If we didn't and don't have any defined prop for this animation type
|
||||
(!prop && !typeState.prevProp) ||
|
||||
// Or if the prop doesn't define an animation
|
||||
isAnimationControls(prop) ||
|
||||
typeof prop === "boolean") {
|
||||
continue;
|
||||
}
|
||||
/**
|
||||
* As we go look through the values defined on this type, if we detect
|
||||
* a changed value or a value that was removed in a higher priority, we set
|
||||
* this to true and add this prop to the animation list.
|
||||
*/
|
||||
const variantDidChange = checkVariantsDidChange(typeState.prevProp, prop);
|
||||
let shouldAnimateType = variantDidChange ||
|
||||
// If we're making this variant active, we want to always make it active
|
||||
(type === changedActiveType &&
|
||||
typeState.isActive &&
|
||||
!isInherited &&
|
||||
propIsVariant) ||
|
||||
// If we removed a higher-priority variant (i is in reverse order)
|
||||
(i > removedVariantIndex && propIsVariant);
|
||||
let handledRemovedValues = false;
|
||||
/**
|
||||
* As animations can be set as variant lists, variants or target objects, we
|
||||
* coerce everything to an array if it isn't one already
|
||||
*/
|
||||
const definitionList = Array.isArray(prop) ? prop : [prop];
|
||||
/**
|
||||
* Build an object of all the resolved values. We'll use this in the subsequent
|
||||
* animateChanges calls to determine whether a value has changed.
|
||||
*/
|
||||
let resolvedValues = definitionList.reduce(buildResolvedTypeValues(type), {});
|
||||
if (activeDelta === false)
|
||||
resolvedValues = {};
|
||||
/**
|
||||
* Now we need to loop through all the keys in the prev prop and this prop,
|
||||
* and decide:
|
||||
* 1. If the value has changed, and needs animating
|
||||
* 2. If it has been removed, and needs adding to the removedKeys set
|
||||
* 3. If it has been removed in a higher priority type and needs animating
|
||||
* 4. If it hasn't been removed in a higher priority but hasn't changed, and
|
||||
* needs adding to the type's protectedKeys list.
|
||||
*/
|
||||
const { prevResolvedValues = {} } = typeState;
|
||||
const allKeys = {
|
||||
...prevResolvedValues,
|
||||
...resolvedValues,
|
||||
};
|
||||
const markToAnimate = (key) => {
|
||||
shouldAnimateType = true;
|
||||
if (removedKeys.has(key)) {
|
||||
handledRemovedValues = true;
|
||||
removedKeys.delete(key);
|
||||
}
|
||||
typeState.needsAnimating[key] = true;
|
||||
const motionValue = visualElement.getValue(key);
|
||||
if (motionValue)
|
||||
motionValue.liveStyle = false;
|
||||
};
|
||||
for (const key in allKeys) {
|
||||
const next = resolvedValues[key];
|
||||
const prev = prevResolvedValues[key];
|
||||
// If we've already handled this we can just skip ahead
|
||||
if (encounteredKeys.hasOwnProperty(key))
|
||||
continue;
|
||||
/**
|
||||
* If the value has changed, we probably want to animate it.
|
||||
*/
|
||||
let valueHasChanged = false;
|
||||
if (isKeyframesTarget(next) && isKeyframesTarget(prev)) {
|
||||
valueHasChanged = !shallowCompare(next, prev);
|
||||
}
|
||||
else {
|
||||
valueHasChanged = next !== prev;
|
||||
}
|
||||
if (valueHasChanged) {
|
||||
if (next !== undefined && next !== null) {
|
||||
// If next is defined and doesn't equal prev, it needs animating
|
||||
markToAnimate(key);
|
||||
}
|
||||
else {
|
||||
// If it's undefined, it's been removed.
|
||||
removedKeys.add(key);
|
||||
}
|
||||
}
|
||||
else if (next !== undefined && removedKeys.has(key)) {
|
||||
/**
|
||||
* If next hasn't changed and it isn't undefined, we want to check if it's
|
||||
* been removed by a higher priority
|
||||
*/
|
||||
markToAnimate(key);
|
||||
}
|
||||
else {
|
||||
/**
|
||||
* If it hasn't changed, we add it to the list of protected values
|
||||
* to ensure it doesn't get animated.
|
||||
*/
|
||||
typeState.protectedKeys[key] = true;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Update the typeState so next time animateChanges is called we can compare the
|
||||
* latest prop and resolvedValues to these.
|
||||
*/
|
||||
typeState.prevProp = prop;
|
||||
typeState.prevResolvedValues = resolvedValues;
|
||||
/**
|
||||
*
|
||||
*/
|
||||
if (typeState.isActive) {
|
||||
encounteredKeys = { ...encounteredKeys, ...resolvedValues };
|
||||
}
|
||||
if (isInitialRender && visualElement.blockInitialAnimation) {
|
||||
shouldAnimateType = false;
|
||||
}
|
||||
/**
|
||||
* If this is an inherited prop we want to skip this animation
|
||||
* unless the inherited variants haven't changed on this render.
|
||||
*/
|
||||
const willAnimateViaParent = isInherited && variantDidChange;
|
||||
const needsAnimating = !willAnimateViaParent || handledRemovedValues;
|
||||
if (shouldAnimateType && needsAnimating) {
|
||||
animations.push(...definitionList.map((animation) => ({
|
||||
animation: animation,
|
||||
options: { type },
|
||||
})));
|
||||
}
|
||||
}
|
||||
/**
|
||||
* If there are some removed value that haven't been dealt with,
|
||||
* we need to create a new animation that falls back either to the value
|
||||
* defined in the style prop, or the last read value.
|
||||
*/
|
||||
if (removedKeys.size) {
|
||||
const fallbackAnimation = {};
|
||||
removedKeys.forEach((key) => {
|
||||
const fallbackTarget = visualElement.getBaseTarget(key);
|
||||
const motionValue = visualElement.getValue(key);
|
||||
if (motionValue)
|
||||
motionValue.liveStyle = true;
|
||||
// @ts-expect-error - @mattgperry to figure if we should do something here
|
||||
fallbackAnimation[key] = fallbackTarget !== null && fallbackTarget !== void 0 ? fallbackTarget : null;
|
||||
});
|
||||
animations.push({ animation: fallbackAnimation });
|
||||
}
|
||||
let shouldAnimate = Boolean(animations.length);
|
||||
if (isInitialRender &&
|
||||
(props.initial === false || props.initial === props.animate) &&
|
||||
!visualElement.manuallyAnimateOnMount) {
|
||||
shouldAnimate = false;
|
||||
}
|
||||
isInitialRender = false;
|
||||
return shouldAnimate ? animate(animations) : Promise.resolve();
|
||||
}
|
||||
/**
|
||||
* Change whether a certain animation type is active.
|
||||
*/
|
||||
function setActive(type, isActive) {
|
||||
var _a;
|
||||
// If the active state hasn't changed, we can safely do nothing here
|
||||
if (state[type].isActive === isActive)
|
||||
return Promise.resolve();
|
||||
// Propagate active change to children
|
||||
(_a = visualElement.variantChildren) === null || _a === void 0 ? void 0 : _a.forEach((child) => { var _a; return (_a = child.animationState) === null || _a === void 0 ? void 0 : _a.setActive(type, isActive); });
|
||||
state[type].isActive = isActive;
|
||||
const animations = animateChanges(type);
|
||||
for (const key in state) {
|
||||
state[key].protectedKeys = {};
|
||||
}
|
||||
return animations;
|
||||
}
|
||||
return {
|
||||
animateChanges,
|
||||
setActive,
|
||||
setAnimateFunction,
|
||||
getState: () => state,
|
||||
reset: () => {
|
||||
state = createState();
|
||||
isInitialRender = true;
|
||||
},
|
||||
};
|
||||
}
|
||||
function checkVariantsDidChange(prev, next) {
|
||||
if (typeof next === "string") {
|
||||
return next !== prev;
|
||||
}
|
||||
else if (Array.isArray(next)) {
|
||||
return !shallowCompare(next, prev);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
function createTypeState(isActive = false) {
|
||||
return {
|
||||
isActive,
|
||||
protectedKeys: {},
|
||||
needsAnimating: {},
|
||||
prevResolvedValues: {},
|
||||
};
|
||||
}
|
||||
function createState() {
|
||||
return {
|
||||
animate: createTypeState(true),
|
||||
whileInView: createTypeState(),
|
||||
whileHover: createTypeState(),
|
||||
whileTap: createTypeState(),
|
||||
whileDrag: createTypeState(),
|
||||
whileFocus: createTypeState(),
|
||||
exit: createTypeState(),
|
||||
};
|
||||
}
|
||||
|
||||
export { checkVariantsDidChange, createAnimationState };
|
||||
3
node_modules/framer-motion/dist/es/render/utils/compare-by-depth.mjs
generated
vendored
Normal file
3
node_modules/framer-motion/dist/es/render/utils/compare-by-depth.mjs
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
const compareByDepth = (a, b) => a.depth - b.depth;
|
||||
|
||||
export { compareByDepth };
|
||||
24
node_modules/framer-motion/dist/es/render/utils/flat-tree.mjs
generated
vendored
Normal file
24
node_modules/framer-motion/dist/es/render/utils/flat-tree.mjs
generated
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
import { addUniqueItem, removeItem } from '../../utils/array.mjs';
|
||||
import { compareByDepth } from './compare-by-depth.mjs';
|
||||
|
||||
class FlatTree {
|
||||
constructor() {
|
||||
this.children = [];
|
||||
this.isDirty = false;
|
||||
}
|
||||
add(child) {
|
||||
addUniqueItem(this.children, child);
|
||||
this.isDirty = true;
|
||||
}
|
||||
remove(child) {
|
||||
removeItem(this.children, child);
|
||||
this.isDirty = true;
|
||||
}
|
||||
forEach(callback) {
|
||||
this.isDirty && this.children.sort(compareByDepth);
|
||||
this.isDirty = false;
|
||||
this.children.forEach(callback);
|
||||
}
|
||||
}
|
||||
|
||||
export { FlatTree };
|
||||
28
node_modules/framer-motion/dist/es/render/utils/get-variant-context.mjs
generated
vendored
Normal file
28
node_modules/framer-motion/dist/es/render/utils/get-variant-context.mjs
generated
vendored
Normal file
@ -0,0 +1,28 @@
|
||||
import { isVariantLabel } from './is-variant-label.mjs';
|
||||
import { variantProps } from './variant-props.mjs';
|
||||
|
||||
const numVariantProps = variantProps.length;
|
||||
function getVariantContext(visualElement) {
|
||||
if (!visualElement)
|
||||
return undefined;
|
||||
if (!visualElement.isControllingVariants) {
|
||||
const context = visualElement.parent
|
||||
? getVariantContext(visualElement.parent) || {}
|
||||
: {};
|
||||
if (visualElement.props.initial !== undefined) {
|
||||
context.initial = visualElement.props.initial;
|
||||
}
|
||||
return context;
|
||||
}
|
||||
const context = {};
|
||||
for (let i = 0; i < numVariantProps; i++) {
|
||||
const name = variantProps[i];
|
||||
const prop = visualElement.props[name];
|
||||
if (isVariantLabel(prop) || prop === false) {
|
||||
context[name] = prop;
|
||||
}
|
||||
}
|
||||
return context;
|
||||
}
|
||||
|
||||
export { getVariantContext };
|
||||
13
node_modules/framer-motion/dist/es/render/utils/is-controlling-variants.mjs
generated
vendored
Normal file
13
node_modules/framer-motion/dist/es/render/utils/is-controlling-variants.mjs
generated
vendored
Normal file
@ -0,0 +1,13 @@
|
||||
import { isAnimationControls } from '../../animation/utils/is-animation-controls.mjs';
|
||||
import { isVariantLabel } from './is-variant-label.mjs';
|
||||
import { variantProps } from './variant-props.mjs';
|
||||
|
||||
function isControllingVariants(props) {
|
||||
return (isAnimationControls(props.animate) ||
|
||||
variantProps.some((name) => isVariantLabel(props[name])));
|
||||
}
|
||||
function isVariantNode(props) {
|
||||
return Boolean(isControllingVariants(props) || props.variants);
|
||||
}
|
||||
|
||||
export { isControllingVariants, isVariantNode };
|
||||
8
node_modules/framer-motion/dist/es/render/utils/is-variant-label.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/render/utils/is-variant-label.mjs
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
/**
|
||||
* Decides if the supplied variable is variant label
|
||||
*/
|
||||
function isVariantLabel(v) {
|
||||
return typeof v === "string" || Array.isArray(v);
|
||||
}
|
||||
|
||||
export { isVariantLabel };
|
||||
59
node_modules/framer-motion/dist/es/render/utils/motion-values.mjs
generated
vendored
Normal file
59
node_modules/framer-motion/dist/es/render/utils/motion-values.mjs
generated
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
import { warnOnce } from '../../utils/warn-once.mjs';
|
||||
import { motionValue } from '../../value/index.mjs';
|
||||
import { isMotionValue } from '../../value/utils/is-motion-value.mjs';
|
||||
|
||||
function updateMotionValuesFromProps(element, next, prev) {
|
||||
for (const key in next) {
|
||||
const nextValue = next[key];
|
||||
const prevValue = prev[key];
|
||||
if (isMotionValue(nextValue)) {
|
||||
/**
|
||||
* If this is a motion value found in props or style, we want to add it
|
||||
* to our visual element's motion value map.
|
||||
*/
|
||||
element.addValue(key, nextValue);
|
||||
/**
|
||||
* Check the version of the incoming motion value with this version
|
||||
* and warn against mismatches.
|
||||
*/
|
||||
if (process.env.NODE_ENV === "development") {
|
||||
warnOnce(nextValue.version === "11.13.1", `Attempting to mix Motion versions ${nextValue.version} with 11.13.1 may not work as expected.`);
|
||||
}
|
||||
}
|
||||
else if (isMotionValue(prevValue)) {
|
||||
/**
|
||||
* If we're swapping from a motion value to a static value,
|
||||
* create a new motion value from that
|
||||
*/
|
||||
element.addValue(key, motionValue(nextValue, { owner: element }));
|
||||
}
|
||||
else if (prevValue !== nextValue) {
|
||||
/**
|
||||
* If this is a flat value that has changed, update the motion value
|
||||
* or create one if it doesn't exist. We only want to do this if we're
|
||||
* not handling the value with our animation state.
|
||||
*/
|
||||
if (element.hasValue(key)) {
|
||||
const existingValue = element.getValue(key);
|
||||
if (existingValue.liveStyle === true) {
|
||||
existingValue.jump(nextValue);
|
||||
}
|
||||
else if (!existingValue.hasAnimated) {
|
||||
existingValue.set(nextValue);
|
||||
}
|
||||
}
|
||||
else {
|
||||
const latestValue = element.getStaticValue(key);
|
||||
element.addValue(key, motionValue(latestValue !== undefined ? latestValue : nextValue, { owner: element }));
|
||||
}
|
||||
}
|
||||
}
|
||||
// Handle removed values
|
||||
for (const key in prev) {
|
||||
if (next[key] === undefined)
|
||||
element.removeValue(key);
|
||||
}
|
||||
return next;
|
||||
}
|
||||
|
||||
export { updateMotionValuesFromProps };
|
||||
8
node_modules/framer-motion/dist/es/render/utils/resolve-dynamic-variants.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/render/utils/resolve-dynamic-variants.mjs
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
import { resolveVariantFromProps } from './resolve-variants.mjs';
|
||||
|
||||
function resolveVariant(visualElement, definition, custom) {
|
||||
const props = visualElement.getProps();
|
||||
return resolveVariantFromProps(props, definition, custom !== undefined ? custom : props.custom, visualElement);
|
||||
}
|
||||
|
||||
export { resolveVariant };
|
||||
36
node_modules/framer-motion/dist/es/render/utils/resolve-variants.mjs
generated
vendored
Normal file
36
node_modules/framer-motion/dist/es/render/utils/resolve-variants.mjs
generated
vendored
Normal file
@ -0,0 +1,36 @@
|
||||
function getValueState(visualElement) {
|
||||
const state = [{}, {}];
|
||||
visualElement === null || visualElement === void 0 ? void 0 : visualElement.values.forEach((value, key) => {
|
||||
state[0][key] = value.get();
|
||||
state[1][key] = value.getVelocity();
|
||||
});
|
||||
return state;
|
||||
}
|
||||
function resolveVariantFromProps(props, definition, custom, visualElement) {
|
||||
/**
|
||||
* If the variant definition is a function, resolve.
|
||||
*/
|
||||
if (typeof definition === "function") {
|
||||
const [current, velocity] = getValueState(visualElement);
|
||||
definition = definition(custom !== undefined ? custom : props.custom, current, velocity);
|
||||
}
|
||||
/**
|
||||
* If the variant definition is a variant label, or
|
||||
* the function returned a variant label, resolve.
|
||||
*/
|
||||
if (typeof definition === "string") {
|
||||
definition = props.variants && props.variants[definition];
|
||||
}
|
||||
/**
|
||||
* At this point we've resolved both functions and variant labels,
|
||||
* but the resolved variant label might itself have been a function.
|
||||
* If so, resolve. This can only have returned a valid target object.
|
||||
*/
|
||||
if (typeof definition === "function") {
|
||||
const [current, velocity] = getValueState(visualElement);
|
||||
definition = definition(custom !== undefined ? custom : props.custom, current, velocity);
|
||||
}
|
||||
return definition;
|
||||
}
|
||||
|
||||
export { resolveVariantFromProps };
|
||||
27
node_modules/framer-motion/dist/es/render/utils/setters.mjs
generated
vendored
Normal file
27
node_modules/framer-motion/dist/es/render/utils/setters.mjs
generated
vendored
Normal file
@ -0,0 +1,27 @@
|
||||
import { resolveFinalValueInKeyframes } from '../../utils/resolve-value.mjs';
|
||||
import { motionValue } from '../../value/index.mjs';
|
||||
import { resolveVariant } from './resolve-dynamic-variants.mjs';
|
||||
|
||||
/**
|
||||
* Set VisualElement's MotionValue, creating a new MotionValue for it if
|
||||
* it doesn't exist.
|
||||
*/
|
||||
function setMotionValue(visualElement, key, value) {
|
||||
if (visualElement.hasValue(key)) {
|
||||
visualElement.getValue(key).set(value);
|
||||
}
|
||||
else {
|
||||
visualElement.addValue(key, motionValue(value));
|
||||
}
|
||||
}
|
||||
function setTarget(visualElement, definition) {
|
||||
const resolved = resolveVariant(visualElement, definition);
|
||||
let { transitionEnd = {}, transition = {}, ...target } = resolved || {};
|
||||
target = { ...target, ...transitionEnd };
|
||||
for (const key in target) {
|
||||
const value = resolveFinalValueInKeyframes(target[key]);
|
||||
setMotionValue(visualElement, key, value);
|
||||
}
|
||||
}
|
||||
|
||||
export { setTarget };
|
||||
12
node_modules/framer-motion/dist/es/render/utils/variant-props.mjs
generated
vendored
Normal file
12
node_modules/framer-motion/dist/es/render/utils/variant-props.mjs
generated
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
const variantPriorityOrder = [
|
||||
"animate",
|
||||
"whileInView",
|
||||
"whileFocus",
|
||||
"whileHover",
|
||||
"whileTap",
|
||||
"whileDrag",
|
||||
"exit",
|
||||
];
|
||||
const variantProps = ["initial", ...variantPriorityOrder];
|
||||
|
||||
export { variantPriorityOrder, variantProps };
|
||||
Reference in New Issue
Block a user