This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { | |
MotionValue, | |
useAnimationFrame, | |
useMotionValue, | |
} from "framer-motion"; | |
import React from "react"; | |
export interface Clock { | |
value: MotionValue<number>; | |
setRate: (rate: number) => void; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { motion } from 'framer-motion' | |
import React from 'react' | |
const images = [ | |
{ | |
src: 'https://a0.muscache.com/im/pictures/miso/Hosting-2810308/original/a653d85a-1a97-45d7-a213-78ef2286122a.jpeg?im_w=720', | |
alt: 'Tree' | |
}, | |
{ | |
src: 'https://a0.muscache.com/im/pictures/2cc58022-2004-4034-a281-22fb622e7461.jpg?im_w=720', |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { useState, useEffect, useRef } from "react"; | |
type AnimatedTextProps = { | |
text: string; | |
duration?: number; | |
className?: string; | |
}; | |
export default function AnimatedText({ | |
text, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { useEffect, useRef } from "react"; | |
import { | |
motion, | |
useInView, | |
useMotionValueEvent, | |
useScroll, | |
useTransform, | |
} from "framer-motion"; | |
export const ScrollAnimations = () => { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useMotionValue } from 'framer-motion'; | |
import { animate } from 'framer-motion'; | |
import { motion } from 'framer-motion' | |
import { useEffect } from 'react'; | |
import useMeasure from 'react-use-measure'; | |
const CarouselWords = () => { | |
return ( | |
<div className="flex flex-col overflow-hidden"> | |
<CarouselWord word={"Headless"} duration={40} /> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"use client"; | |
import { | |
animate, | |
motion, | |
useInView, | |
useMotionValue, | |
useTransform, | |
} from "framer-motion"; | |
import { useEffect, useRef } from "react"; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import type { ComponentType } from "react" | |
import type { MotionValue, Transition } from "framer-motion" | |
import { | |
useViewportScroll, | |
useVelocity, | |
useTransform, | |
useAnimation, | |
useMotionValue, | |
animate, | |
} from "framer-motion" |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import * as React from "react"; | |
import { useRef } from "react"; | |
import { motion, useCycle } from "framer-motion"; | |
import { useDimensions } from "./use-dimensions"; | |
import { MenuToggle } from "./MenuToggle"; | |
import { Navigation } from "./Navigation"; | |
const sidebar = { | |
open: (height = 1000) => ({ | |
clipPath: `circle(${height * 2 + 200}px at 40px 40px)`, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import type { ComponentType } from "react" | |
import { useState, useEffect } from "react" | |
import type { MotionValue, Transition } from "framer-motion" | |
import { | |
useScroll, | |
useVelocity, | |
useTransform, | |
useMotionValue, | |
animate, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { ReactNode } from 'react'; | |
import { motion } from 'framer-motion'; | |
type Props = { | |
children: ReactNode; | |
delay?: number; | |
}; | |
export default function WithBouncingAnimation({ children, delay }: Props) { | |
return ( |
NewerOlder