How to use the stylefire.transformProps.filter function in stylefire

To help you get started, we’ve selected a few stylefire examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github framer / motion / src / dom / unit-type-conversion.ts View on Github external
pos3: number
): GetActualMeasurementInPixels => (_bbox, { transform }) => {
    if (transform === "none" || !transform) return 0

    const matrix3d = transform.match(/^matrix3d\((.+)\)$/)

    if (matrix3d) {
        return getPosFromMatrix(matrix3d[1], pos3)
    } else {
        const matrix = transform.match(/^matrix\((.+)\)$/) as string[]
        return getPosFromMatrix(matrix[1], pos2)
    }
}

const transformKeys = new Set(["x", "y", "z"])
const nonTranslationalTransformKeys = transformProps.filter(
    key => !transformKeys.has(key)
)

type RemovedTransforms = [string, string | number][]
function removeNonTranslationalTransform(
    values: MotionValuesMap,
    elementStyler: Styler
) {
    const removedTransforms: RemovedTransforms = []

    nonTranslationalTransformKeys.forEach(key => {
        const value: MotionValue | undefined = values.get(key)
        if (value !== undefined) {
            removedTransforms.push([key, value.get()])
            value.set(key.startsWith("scale") ? 1 : 0)
        }

stylefire

Performant, simplified stylers for CSS, SVG, path and DOM scroll.

MIT
Latest version published 4 years ago

Package Health Score

64 / 100
Full package analysis