Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 | 38x 38x 38x 1175x 1175x 1175x 1175x 1175x 1175x 1175x 1175x 1442x 1442x 1442x 1175x 1115x 60x 1175x 23x 1152x 384x 1175x 38x 1x 1x 1x 1x | import { sortTransformProps } from "./transform" import { DOMVisualElementOptions } from "../../dom/types" import { MotionProps } from "../../../motion/types" import { HTMLRenderState, TransformOrigin } from "../types" const translateAlias: { [key: string]: string } = { x: "translateX", y: "translateY", z: "translateZ", transformPerspective: "perspective", } /** * 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. */ export function buildTransform( { transform, transformKeys }: HTMLRenderState, { enableHardwareAcceleration = true, allowTransformNone = true, }: DOMVisualElementOptions, transformIsDefault: boolean, transformTemplate?: MotionProps["transformTemplate"] ) { // The transform string we're going to build into. let transformString = "" // Transform keys into their default order - this will determine the output order. transformKeys.sort(sortTransformProps) // Track whether the defined transform has a defined z so we don't add a // second to enable hardware acceleration let transformHasZ = false // Loop over each transform and build them into transformString const numTransformKeys = transformKeys.length for (let i = 0; i < numTransformKeys; i++) { const key = transformKeys[i] transformString += `${translateAlias[key] || key}(${transform[key]}) ` if (key === "z") transformHasZ = true } if (!transformHasZ && enableHardwareAcceleration) { transformString += "translateZ(0)" } else { 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 (allowTransformNone && transformIsDefault) { transformString = "none" } return transformString } /** * Build a transformOrigin style. Uses the same defaults as the browser for * undefined origins. */ export function buildTransformOrigin({ originX = "50%", originY = "50%", originZ = 0, }: TransformOrigin) { return `${originX} ${originY} ${originZ}` } |