first commit
This commit is contained in:
3
node_modules/motion-dom/dist/es/render/dom/is-css-var.mjs
generated
vendored
Normal file
3
node_modules/motion-dom/dist/es/render/dom/is-css-var.mjs
generated
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
const isCSSVar = (name) => name.startsWith("--");
|
||||
|
||||
export { isCSSVar };
|
||||
83
node_modules/motion-dom/dist/es/render/dom/parse-transform.mjs
generated
vendored
Normal file
83
node_modules/motion-dom/dist/es/render/dom/parse-transform.mjs
generated
vendored
Normal file
@@ -0,0 +1,83 @@
|
||||
const radToDeg = (rad) => (rad * 180) / Math.PI;
|
||||
const rotate = (v) => {
|
||||
const angle = radToDeg(Math.atan2(v[1], v[0]));
|
||||
return rebaseAngle(angle);
|
||||
};
|
||||
const matrix2dParsers = {
|
||||
x: 4,
|
||||
y: 5,
|
||||
translateX: 4,
|
||||
translateY: 5,
|
||||
scaleX: 0,
|
||||
scaleY: 3,
|
||||
scale: (v) => (Math.abs(v[0]) + Math.abs(v[3])) / 2,
|
||||
rotate,
|
||||
rotateZ: rotate,
|
||||
skewX: (v) => radToDeg(Math.atan(v[1])),
|
||||
skewY: (v) => radToDeg(Math.atan(v[2])),
|
||||
skew: (v) => (Math.abs(v[1]) + Math.abs(v[2])) / 2,
|
||||
};
|
||||
const rebaseAngle = (angle) => {
|
||||
angle = angle % 360;
|
||||
if (angle < 0)
|
||||
angle += 360;
|
||||
return angle;
|
||||
};
|
||||
const rotateZ = rotate;
|
||||
const scaleX = (v) => Math.sqrt(v[0] * v[0] + v[1] * v[1]);
|
||||
const scaleY = (v) => Math.sqrt(v[4] * v[4] + v[5] * v[5]);
|
||||
const matrix3dParsers = {
|
||||
x: 12,
|
||||
y: 13,
|
||||
z: 14,
|
||||
translateX: 12,
|
||||
translateY: 13,
|
||||
translateZ: 14,
|
||||
scaleX,
|
||||
scaleY,
|
||||
scale: (v) => (scaleX(v) + scaleY(v)) / 2,
|
||||
rotateX: (v) => rebaseAngle(radToDeg(Math.atan2(v[6], v[5]))),
|
||||
rotateY: (v) => rebaseAngle(radToDeg(Math.atan2(-v[2], v[0]))),
|
||||
rotateZ,
|
||||
rotate: rotateZ,
|
||||
skewX: (v) => radToDeg(Math.atan(v[4])),
|
||||
skewY: (v) => radToDeg(Math.atan(v[1])),
|
||||
skew: (v) => (Math.abs(v[1]) + Math.abs(v[4])) / 2,
|
||||
};
|
||||
function defaultTransformValue(name) {
|
||||
return name.includes("scale") ? 1 : 0;
|
||||
}
|
||||
function parseValueFromTransform(transform, name) {
|
||||
if (!transform || transform === "none") {
|
||||
return defaultTransformValue(name);
|
||||
}
|
||||
const matrix3dMatch = transform.match(/^matrix3d\(([-\d.e\s,]+)\)$/u);
|
||||
let parsers;
|
||||
let match;
|
||||
if (matrix3dMatch) {
|
||||
parsers = matrix3dParsers;
|
||||
match = matrix3dMatch;
|
||||
}
|
||||
else {
|
||||
const matrix2dMatch = transform.match(/^matrix\(([-\d.e\s,]+)\)$/u);
|
||||
parsers = matrix2dParsers;
|
||||
match = matrix2dMatch;
|
||||
}
|
||||
if (!match) {
|
||||
return defaultTransformValue(name);
|
||||
}
|
||||
const valueParser = parsers[name];
|
||||
const values = match[1].split(",").map(convertTransformToNumber);
|
||||
return typeof valueParser === "function"
|
||||
? valueParser(values)
|
||||
: values[valueParser];
|
||||
}
|
||||
const readTransformValue = (instance, name) => {
|
||||
const { transform = "none" } = getComputedStyle(instance);
|
||||
return parseValueFromTransform(transform, name);
|
||||
};
|
||||
function convertTransformToNumber(value) {
|
||||
return parseFloat(value.trim());
|
||||
}
|
||||
|
||||
export { defaultTransformValue, parseValueFromTransform, readTransformValue };
|
||||
10
node_modules/motion-dom/dist/es/render/dom/style-computed.mjs
generated
vendored
Normal file
10
node_modules/motion-dom/dist/es/render/dom/style-computed.mjs
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
import { isCSSVar } from './is-css-var.mjs';
|
||||
|
||||
function getComputedStyle(element, name) {
|
||||
const computedStyle = window.getComputedStyle(element);
|
||||
return isCSSVar(name)
|
||||
? computedStyle.getPropertyValue(name)
|
||||
: computedStyle[name];
|
||||
}
|
||||
|
||||
export { getComputedStyle };
|
||||
9
node_modules/motion-dom/dist/es/render/dom/style-set.mjs
generated
vendored
Normal file
9
node_modules/motion-dom/dist/es/render/dom/style-set.mjs
generated
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
import { isCSSVar } from './is-css-var.mjs';
|
||||
|
||||
function setStyle(element, name, value) {
|
||||
isCSSVar(name)
|
||||
? element.style.setProperty(name, value)
|
||||
: (element.style[name] = value);
|
||||
}
|
||||
|
||||
export { setStyle };
|
||||
5
node_modules/motion-dom/dist/es/render/dom/utils/camel-to-dash.mjs
generated
vendored
Normal file
5
node_modules/motion-dom/dist/es/render/dom/utils/camel-to-dash.mjs
generated
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
function camelToDash(str) {
|
||||
return str.replace(/([A-Z])/g, (match) => `-${match.toLowerCase()}`);
|
||||
}
|
||||
|
||||
export { camelToDash };
|
||||
13
node_modules/motion-dom/dist/es/render/utils/keys-position.mjs
generated
vendored
Normal file
13
node_modules/motion-dom/dist/es/render/utils/keys-position.mjs
generated
vendored
Normal file
@@ -0,0 +1,13 @@
|
||||
import { transformPropOrder } from './keys-transform.mjs';
|
||||
|
||||
const positionalKeys = new Set([
|
||||
"width",
|
||||
"height",
|
||||
"top",
|
||||
"left",
|
||||
"right",
|
||||
"bottom",
|
||||
...transformPropOrder,
|
||||
]);
|
||||
|
||||
export { positionalKeys };
|
||||
28
node_modules/motion-dom/dist/es/render/utils/keys-transform.mjs
generated
vendored
Normal file
28
node_modules/motion-dom/dist/es/render/utils/keys-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 = /*@__PURE__*/ (() => new Set(transformPropOrder))();
|
||||
|
||||
export { transformPropOrder, transformProps };
|
||||
Reference in New Issue
Block a user