mattgperry

var h = require('virtual-dom/h');
var diff = require('virtual-dom/diff');
var patch = require('virtual-dom/patch');
var createElement = require('virtual-dom/create-element');
var redshift = require('redshift');
var renderAction = redshift.newAction();

// 1: Create a function that declares what the DOM should look like
function render(count) {
    return h('div', {

mattgperry

import sync, { cancelSync } from "framesync";
import { useEffect } from "react";

/**
  The code inside useAnimationLoop is guaranteed to run once a frame
  before Framer Motion/Popmotion/Pose renders

  useAnimationLoop(({ delta, timestamp }) => {
     // do stuff
  })

mattgperry

Hi [recruiter's name], 

Thanks for getting in touch. Sorry, but I'm not open to roles at Facebook.

Your company's current stance on political advertising is a conscious choice that's dangerously stoking divisions in society in the name of profit.

Also, while I understand the legal framework that allows them to do so, I disagree with massive profit-making American companies like Facebook coming over here and structuring themselves in a way that allows them to avoid local taxation. These companies then underpay European developers in relation to their west coast counterparts. Given our government's aptitude for taxing salaried individuals over corporations, this is another two methods your company uses to withhold the profits we generate for you. 

Please exclude me from your searches until your company discovers its moral compass
Thanks

mattgperry

const Component = () => {
  const frameCount = useRef(0)
  const prevValues = useRef()
  
  return <motion.div transformValues={values => {
    frameCount.current++
    
    const valuesToReturn = isEven(frameCount.current) ? prevValues.current : values
    
    prevValues.current = values

mattgperry

import * as React from "react"
import sync from "framesync"
import { MotionPlugins } from "../../motion/context/MotionPluginContext"
import { act } from "react-dom/test-utils"
import { fireEvent } from "@testing-library/dom"

export type Point = {
    x: number
    y: number
}

mattgperry

  test("drag handlers aren't frozen at drag session start", async () => {
        let count = 0
        const onDragEnd = deferred()
        const Component = () => {
            const [increment, setIncrement] = useState(1)
            return (
                <MockDrag>
                    <motion.div
                        drag
                        onDragStart={() => {

mattgperry

import { useEffect } from "react";
import sync from "framesync";
import { useMotionValue, MotionValue } from "framer-motion";

/**
 *  Combine multiple motion values into a new one using a template literal.
 *
 *  Updates in source motion values are batched to once per frame.
 *
 *  ```javascript

mattgperry

class MotionValue<T> {
  constructor(public current: T) {}
}

type UnwrapMotionValueArray<V extends MotionValue<any>[]> = { [K in keyof V ]: V[K] extends MotionValue<infer T> ? T : never }

function unwrap<T extends MotionValue<any>[]>(value: [...T]): UnwrapMotionValueArray<typeof value> {
  return value.map(v => v.current) as [...UnwrapMotionValueArray<T>]
}

mattgperry

import { motion, useMotionValue, useTransform } from "framer-motion"

export function Overlay({ isVisible }) {
  const opacity = useMotionValue(0)
  const pointerEvents = useTransform(
    opacity,
    latest => latest < 0.5 ? "none" : "auto"
  )
  
  return (

mattgperry

import { useEffect } from "react";

function handleSpace(event: KeyboardEvent) {
  if (event.key === " ") {
    event.preventDefault();
    const delta = event.shiftKey ? -window.innerHeight : window.innerHeight;
    window.scrollTo(0, window.scrollY + delta);
  }
}