diff --git a/app/layout.tsx b/app/layout.tsx index 6186aaa..afd66cc 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,8 +1,8 @@ import "./globals.css"; import type { Metadata } from "next"; import { Inter } from "next/font/google"; -import { ThemeProvider } from "@/components/providers/theme-provider"; -import { ToasterProvider } from "@/components/providers/toast-provider"; +import { ThemeProvider } from "@/components/providers/ThemeProvider"; +import { ToasterProvider } from "@/components/providers/ToastProvider"; import TanStackProvider from "@/components/providers/TanstackProvider"; const inter = Inter({ subsets: ["latin"] }); diff --git a/app/page.tsx b/app/page.tsx index 3f90699..6293a4d 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,21 +1,23 @@ import ScrollToTop from "@/components/ui/back-to-top"; import { Hero } from "@/components/landing/hero"; import { Navigation } from "@/components/landing/navigation"; -import SiteCounter from "@/components/landing/site-counter"; +import SiteCounter from "@/components/landing/stats"; import AboutTailspin from "@/components/landing/about-tailspin"; import FAQ from "@/components/landing/faq"; import Timeline from "@/components/landing/timeline"; import ThanksPage from "@/components/landing/thanks"; import StepperCard from "@/components/ui/useCode/StepperCard"; import RatingBody from "@/components/core/rating-area/rating-component"; +import GrowOnScroll from "@/components/ui/grow-on-scroll"; +import Footer from "@/components/landing/footer"; +import ComponentCarousel from "@/components/ui/component-carousel"; +import { Separator } from "@/components/ui/separator"; export default function Home() { return (
- -
- -
-
-
- +
+
+
+

+ It looks like you"re on a small screen +

+

+ We hate to be non-inclusive towards phones and + tablets, however we want to provide you with the + best experience possible! +

+
+
-
- -
-
+ + -
+ +
- + , ]} + title='Some useless information' + />
+
+
+
); } diff --git a/components/core/rating-area/rating-component.tsx b/components/core/rating-area/rating-component.tsx index c33c23f..9ef1a98 100644 --- a/components/core/rating-area/rating-component.tsx +++ b/components/core/rating-area/rating-component.tsx @@ -27,8 +27,8 @@ For example: */ const RatingBody = () => { return ( -
- +
+ Rate Tailspin diff --git a/components/landing/about-tailspin.tsx b/components/landing/about-tailspin.tsx index b460453..699e732 100644 --- a/components/landing/about-tailspin.tsx +++ b/components/landing/about-tailspin.tsx @@ -1,6 +1,7 @@ import Link from "next/link"; import { Button } from "@/components/ui/button"; import { BarChartBig } from "lucide-react"; +import FlipOnScroll from "../ui/flip-on-scroll"; type AboutTailSpinBoxesProps = { title: string; @@ -14,7 +15,7 @@ const AboutTailSpinBoxes: React.FC = ({ footer, }) => { return ( -
+

{title} @@ -26,19 +27,22 @@ const AboutTailSpinBoxes: React.FC = ({ {footer} )} -

+ ); }; const AboutTailspin = () => { return (
+

+ Tailspin +

Show off your skills and compete against the world @@ -134,18 +138,3 @@ const AboutTailspin = () => { }; export default AboutTailspin; -// footer={ -// <> -// profile picture -//
-//
Bonnie Green
-//
-// Developer at Open AI -//
-//
-// -// } diff --git a/components/landing/faq.tsx b/components/landing/faq.tsx index 033bf61..2a5996c 100644 --- a/components/landing/faq.tsx +++ b/components/landing/faq.tsx @@ -11,7 +11,7 @@ import Link from "next/link"; const FAQ = () => { return (
FAQ @@ -157,7 +157,7 @@ const FAQ = () => { - + Not an FAQ, but in the spirit of transparency... diff --git a/components/landing/feedback/feedback-card.tsx b/components/landing/feedback/feedback-card.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/components/landing/footer.tsx b/components/landing/footer.tsx new file mode 100644 index 0000000..d7599af --- /dev/null +++ b/components/landing/footer.tsx @@ -0,0 +1,47 @@ +import Link from "next/link"; +import { TailspinLogo } from "../ui/spinning-logo"; + +const Footer = () => { + return ( +
+
+
+ + + + Tailspin + + + +
+
+ + No © 2023{" "} + + Tailspin + + . No Rights Reserved. + +
+
+ ); +}; + +export default Footer; diff --git a/components/landing/hero.tsx b/components/landing/hero.tsx index 1c72867..c2fb108 100644 --- a/components/landing/hero.tsx +++ b/components/landing/hero.tsx @@ -1,36 +1,41 @@ import { ArrowHead } from "@/components/ui/arrow"; -import { cn } from "@/lib/utils"; -import { Montserrat } from "next/font/google"; import { HeroSubText } from "@/components/ui/typewriter-effect"; -import { TailspinLogo } from "@/components/ui/spinning-logo"; import HeroPageToast from "./hero-page-toast"; - -const font = Montserrat({ weight: "700", subsets: ["latin"] }); +import { Button } from "../ui/button"; +import Link from "next/link"; export const Hero = () => { return (
-

-
- - Tailspin +
+

Competitive TailwindCSS

+

Learn, Practice, Develop

+
+
-

-
-
- + Show off your Tailwind skills and build community. +
+
+ + + +
+
+ Forever free. Not affiliated with{" "} + + The Tailwind Org + +
+
{ strokeWidth='4' />
-
+
); diff --git a/components/landing/navigation.tsx b/components/landing/navigation.tsx index 9ab4384..47fb6d8 100644 --- a/components/landing/navigation.tsx +++ b/components/landing/navigation.tsx @@ -1,39 +1,129 @@ -import { Button } from "@/components/ui/button"; +"use client"; + import Link from "next/link"; import { TailspinLogo } from "../ui/spinning-logo"; +import { + NavigationMenu, + NavigationMenuContent, + NavigationMenuItem, + NavigationMenuLink, + NavigationMenuList, + NavigationMenuTrigger, + navigationMenuTriggerStyle, +} from "@/components/ui/navigation-menu"; +import { cn } from "@/lib/utils"; +import { Button } from "../ui/button"; +import { useState } from "react"; +import { Code2, Menu } from "lucide-react"; -// TODO: Add better responsiveness and mobile design, refactor Button into the button component +interface ListItemProps { + className?: string; + title: string; + children: React.ReactNode; + href: string; +} -export const Navigation = () => { +const ListItem: React.FC = ({ + className, + title, + children, + href, +}) => { return ( - +
+ + + + + + Getting started + + +
    +
  • + + + +
    + Tailspin +
    +

    + Competitive TailwindCSS + built for the community by + the community. +

    + +
    +
  • + + Discover our Ethos and the motivation + for Tailspin. + + + Try out Tailspin. Just follow the steps + and happy coding! + + + Need a little help? We got you. + +
+
+
+ + + + {" "} + Let's write some code! + + + +
+
+
+
); }; diff --git a/components/landing/site-counter.tsx b/components/landing/site-counter.tsx deleted file mode 100644 index babda27..0000000 --- a/components/landing/site-counter.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import { CodeSubmitCountBox } from "../ui/statistics/code-submit-count-box"; -import { SiteRatingStatBox } from "../ui/statistics/site-rating"; -import { SiteVisitCountBox } from "../ui/statistics/site-visit-count-box"; - -const SiteCounter = async () => { - return ( -
- - - -
- ); -}; - -export default SiteCounter; diff --git a/components/landing/stats.tsx b/components/landing/stats.tsx new file mode 100644 index 0000000..0514e71 --- /dev/null +++ b/components/landing/stats.tsx @@ -0,0 +1,20 @@ +import { CodeSubmitCountBox } from "../ui/statistics/code-submit-count-box"; +import { SiteRatingStatBox } from "../ui/statistics/site-rating"; +import { SiteVisitCountBox } from "../ui/statistics/site-visit-count-box"; + +const SiteCounter = async () => { + return ( +
+

+ Some Statistics +

+
+ + + +
+
+ ); +}; + +export default SiteCounter; diff --git a/components/landing/thanks.tsx b/components/landing/thanks.tsx index 37a94a7..51c3b40 100644 --- a/components/landing/thanks.tsx +++ b/components/landing/thanks.tsx @@ -70,7 +70,7 @@ const ThanksPage = async () => { ["https://tanstack.com/favicon.ico", "ReactQuery"], ]); return ( -
+
diff --git a/components/landing/timeline.tsx b/components/landing/timeline.tsx index 2e198c8..4bf47cf 100644 --- a/components/landing/timeline.tsx +++ b/components/landing/timeline.tsx @@ -16,57 +16,62 @@ const TimelineSVGIcon = () => { const Timeline = () => { return ( -
-

Timeline

-
    -
  1. - -

    - V0 - - Current - -

    - -

    - Building out this landing page. Polishing the - interactive playground. Adding nice UI/UX. -

    -
  2. -
  3. - -

    - V1.0 -

    - -

    - Innovate and make incremental improvements to the core - business of Tailspin - the coding page. Iteratively add, - optimize, and beautify features to the coding page. -

    -
  4. -
  5. - -

    - V1.1 -

    - -

    - Implement user profiles to keep track of their progress. - Provide intelligent dashboards to help users analyze - their performance in an empirical and systematic manner. - Provide a fully customizable public profile page that - optimizes showing off user's achievements and - accomplishments. -

    -
  6. -
+
+

+ Timeline +

+
+
    +
  1. + +

    + V0 + + Current + +

    + +

    + Building out this landing page. Polishing the + interactive playground. Adding nice UI/UX. +

    +
  2. +
  3. + +

    + V1.0 +

    + +

    + Innovate and make incremental improvements to the + core business of Tailspin - the coding page. + Iteratively add, optimize, and beautify features to + the coding page. +

    +
  4. +
  5. + +

    + V1.1 +

    + +

    + Implement user profiles to keep track of their + progress. Provide intelligent dashboards to help + users analyze their performance in an empirical and + systematic manner. Provide a fully customizable + public profile page that optimizes showing off + user's achievements and accomplishments. +

    +
  6. +
+
); }; diff --git a/components/providers/theme-provider.tsx b/components/providers/ThemeProvider.tsx similarity index 100% rename from components/providers/theme-provider.tsx rename to components/providers/ThemeProvider.tsx diff --git a/components/providers/toast-provider.tsx b/components/providers/ToastProvider.tsx similarity index 100% rename from components/providers/toast-provider.tsx rename to components/providers/ToastProvider.tsx diff --git a/components/ui/component-carousel.tsx b/components/ui/component-carousel.tsx new file mode 100644 index 0000000..42d3e1e --- /dev/null +++ b/components/ui/component-carousel.tsx @@ -0,0 +1,49 @@ +"use client"; + +import { useState } from "react"; +import { Button } from "./button"; +import { ArrowBigLeft, ArrowBigRight } from "lucide-react"; + +interface ComponentCarouselProps { + nodes: React.ReactNode[]; + title?: string; +} + +const ComponentCarousel: React.FC = ({ + nodes, + title, +}) => { + const [page, setPage] = useState(0); + + return ( +
+

{title}

+
+ +
+ {nodes[page]} +

+ {page + 1}/{nodes.length} +

+
+ +
+
+ ); +}; + +export default ComponentCarousel; diff --git a/components/ui/flip-on-scroll.tsx b/components/ui/flip-on-scroll.tsx new file mode 100644 index 0000000..ddd6ce8 --- /dev/null +++ b/components/ui/flip-on-scroll.tsx @@ -0,0 +1,39 @@ +"use client"; + +import { motion, useInView } from "framer-motion"; +import { useRef } from "react"; + +type FlipOnScrollProps = { + children: React.ReactNode; +}; + +const variants = { + visible: { + rotateY: 0, + opacity: 1, + transition: { duration: 0.5, ease: "easeOut" }, + }, + hidden: { + rotateY: 90, + opacity: 0, + transition: { duration: 0.5, ease: "easeIn" }, + }, +}; + +const FlipOnScroll: React.FC = ({ children }) => { + const ref = useRef(null); + const isInView = useInView(ref); + return ( + + {children} + + ); +}; + +export default FlipOnScroll; diff --git a/components/ui/grow-on-scroll.tsx b/components/ui/grow-on-scroll.tsx new file mode 100644 index 0000000..8abb6d6 --- /dev/null +++ b/components/ui/grow-on-scroll.tsx @@ -0,0 +1,46 @@ +"use client"; + +import { useRef, useEffect } from "react"; +import { motion, useAnimation, useInView } from "framer-motion"; +import { cn } from "@/lib/utils"; + +interface GrowOnScrollProps { + children: React.ReactNode; + className?: string; +} + +const GrowOnScroll: React.FC = ({ children, className }) => { + const controls = useAnimation(); + const ref = useRef(null); + const isInView = useInView(ref); + + useEffect(() => { + if (isInView) { + controls.start("visible"); + } else { + controls.start("hidden"); + } + }, [controls, isInView]); + + const variants = { + visible: { scale: 1, opacity: 1, transition: { duration: 0.5 } }, + hidden: { scale: 0.8, opacity: 0 }, + }; + + return ( + + {children} + + ); +}; + +export default GrowOnScroll; diff --git a/components/ui/navigation-menu.tsx b/components/ui/navigation-menu.tsx new file mode 100644 index 0000000..afcc17a --- /dev/null +++ b/components/ui/navigation-menu.tsx @@ -0,0 +1,128 @@ +import * as React from "react"; +import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu"; +import { cva } from "class-variance-authority"; +import { ChevronDown } from "lucide-react"; + +import { cn } from "@/lib/utils"; + +const NavigationMenu = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children} + + +)); +NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName; + +const NavigationMenuList = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName; + +const NavigationMenuItem = NavigationMenuPrimitive.Item; + +const navigationMenuTriggerStyle = cva( + "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50" +); + +const NavigationMenuTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children}{" "} + +)); +NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName; + +const NavigationMenuContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName; + +const NavigationMenuLink = NavigationMenuPrimitive.Link; + +const NavigationMenuViewport = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( +
+ +
+)); +NavigationMenuViewport.displayName = + NavigationMenuPrimitive.Viewport.displayName; + +const NavigationMenuIndicator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +
+ +)); +NavigationMenuIndicator.displayName = + NavigationMenuPrimitive.Indicator.displayName; + +export { + navigationMenuTriggerStyle, + NavigationMenu, + NavigationMenuList, + NavigationMenuItem, + NavigationMenuContent, + NavigationMenuTrigger, + NavigationMenuLink, + NavigationMenuIndicator, + NavigationMenuViewport, +}; diff --git a/components/ui/stat-box.tsx b/components/ui/stat-box.tsx index a65be5d..187ebe8 100644 --- a/components/ui/stat-box.tsx +++ b/components/ui/stat-box.tsx @@ -1,8 +1,15 @@ -export const Box = (props: any) => { +interface StatBoxProps { + icon: React.ReactNode; + content: string; +} + +const StatBox: React.FC = ({ icon, content }) => { return ( -
- {" "} - {props.children}{" "} +
+ {icon} + {content}
); }; + +export default StatBox; diff --git a/components/ui/statistics/code-submit-count-box.tsx b/components/ui/statistics/code-submit-count-box.tsx index 127dacc..889bcf8 100644 --- a/components/ui/statistics/code-submit-count-box.tsx +++ b/components/ui/statistics/code-submit-count-box.tsx @@ -1,9 +1,15 @@ "use client"; import { getCodeSubmitCount } from "@/client-side-queries/rq-queries/code-submit"; -import { Box } from "../stat-box"; +import StatBox from "../stat-box"; +import { CheckCheckIcon } from "lucide-react"; export const CodeSubmitCountBox = (props: any) => { const value = getCodeSubmitCount(); - return How many people have submitted their code : {value}; + return ( + } + content={`How many people have submitted their code : ${value}`} + /> + ); }; diff --git a/components/ui/statistics/site-rating.tsx b/components/ui/statistics/site-rating.tsx index 640d33c..3de9aa4 100644 --- a/components/ui/statistics/site-rating.tsx +++ b/components/ui/statistics/site-rating.tsx @@ -1,9 +1,10 @@ "use client"; import React from "react"; -import { Box } from "../stat-box"; import { useGetRating } from "@/client-side-queries/rq-queries/rating-submit"; import { Skeleton } from "@/components/ui/skeleton"; +import StatBox from "../stat-box"; +import { Star } from "lucide-react"; function SkeletonDemo() { return ( @@ -25,25 +26,15 @@ export const SiteRatingStatBox = (props: any) => { value.map( (val: { field_name: string; field_value: string }) => ( - -
-

- {val.field_name} :{" "} - {( - Number( - val.field_value.split("-")[0] - ) / - Number( - val.field_value.split("-")[1] - ) - ).toFixed(2)}{" "} - stars. -

-

- {val.field_value.split("-")[1]} ratings. -

-
-
+ } + content={`${val.field_name}:${( + Number(val.field_value.split("-")[0]) / + Number(val.field_value.split("-")[1]) + ).toFixed(2)} with ${ + val.field_value.split("-")[1] + } ratings`} + />
) ) diff --git a/components/ui/statistics/site-visit-count-box.tsx b/components/ui/statistics/site-visit-count-box.tsx index ed9e0fe..ae30c9b 100644 --- a/components/ui/statistics/site-visit-count-box.tsx +++ b/components/ui/statistics/site-visit-count-box.tsx @@ -1,11 +1,17 @@ -import { Box } from "../stat-box"; import { directDB_getSiteCount, directDB_incrementSiteCount, } from "@/client-side-queries/direct-db-query/landing-page-queries"; +import StatBox from "../stat-box"; +import { User } from "lucide-react"; export const SiteVisitCountBox = async (props: any) => { const siteCountValue = await directDB_getSiteCount(); await directDB_incrementSiteCount(siteCountValue[1]!, siteCountValue[0]!); - return Site Visitors: {siteCountValue[0]}; + return ( + } + content={`Site Visitors: ${siteCountValue[0]}`} + /> + ); }; diff --git a/components/ui/typewriter-effect.tsx b/components/ui/typewriter-effect.tsx index 38b107d..07810e5 100644 --- a/components/ui/typewriter-effect.tsx +++ b/components/ui/typewriter-effect.tsx @@ -6,9 +6,16 @@ export const HeroSubText = () => { return ( ); diff --git a/components/ui/useCode/StepperCard.tsx b/components/ui/useCode/StepperCard.tsx index d9358cc..21086ea 100644 --- a/components/ui/useCode/StepperCard.tsx +++ b/components/ui/useCode/StepperCard.tsx @@ -11,8 +11,8 @@ import { StepperForm } from "./Stepper-Form"; export function StepperCard() { return ( - - + + Try One Of Our Coding Challenges!!! @@ -24,7 +24,6 @@ export function StepperCard() { - diff --git a/components/ui/useCode/TOS-FormField.tsx b/components/ui/useCode/TOS-FormField.tsx index 4af71ed..7ddc36d 100644 --- a/components/ui/useCode/TOS-FormField.tsx +++ b/components/ui/useCode/TOS-FormField.tsx @@ -9,6 +9,7 @@ import { progressIncrements, useStepperStore, } from "@/data-store/stepper-store"; +import Image from "next/image"; import Link from "next/link"; export function TOSFormField(form: any) { @@ -49,9 +50,12 @@ export function TOSFormField(form: any) { className='italic text-blue-500 underline' > Tailspin's terms & conditions. - Open Tab in New Page diff --git a/package.json b/package.json index 549bca0..ea0d0fc 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-dropdown-menu": "^2.0.6", "@radix-ui/react-label": "^2.0.2", + "@radix-ui/react-navigation-menu": "^1.1.4", "@radix-ui/react-progress": "^1.0.3", "@radix-ui/react-scroll-area": "^1.0.5", "@radix-ui/react-select": "^2.0.0", @@ -32,6 +33,7 @@ "axios": "^1.5.1", "class-variance-authority": "^0.7.0", "clsx": "^2.0.0", + "framer-motion": "^10.16.4", "js-beautify": "^1.14.9", "lucide-react": "^0.279.0", "next": "13.4.19", diff --git a/yarn.lock b/yarn.lock index ed20908..1eafc2b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -26,11 +26,23 @@ dependencies: "@emotion/memoize" "0.7.1" +"@emotion/is-prop-valid@^0.8.2": + version "0.8.8" + resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a" + integrity sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA== + dependencies: + "@emotion/memoize" "0.7.4" + "@emotion/memoize@0.7.1": version "0.7.1" resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.1.tgz#e93c13942592cf5ef01aa8297444dc192beee52f" integrity sha512-Qv4LTqO11jepd5Qmlp3M1YEjBumoTHcHFdgPTQ+sFlIL5myi/7xu/POwP7IRu6odBdmLXdtIs1D6TuW6kbwbbg== +"@emotion/memoize@0.7.4": + version "0.7.4" + resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb" + integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw== + "@eslint-community/eslint-utils@^4.2.0": version "4.4.0" resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59" @@ -477,6 +489,27 @@ aria-hidden "^1.1.1" react-remove-scroll "2.5.5" +"@radix-ui/react-navigation-menu@^1.1.4": + version "1.1.4" + resolved "https://registry.yarnpkg.com/@radix-ui/react-navigation-menu/-/react-navigation-menu-1.1.4.tgz#654151310c3f9a29afd19fb60ddc7977e54b8a3d" + integrity sha512-Cc+seCS3PmWmjI51ufGG7zp1cAAIRqHVw7C9LOA2TZ+R4hG6rDvHcTqIsEEFLmZO3zNVH72jOOE7kKNy8W+RtA== + dependencies: + "@babel/runtime" "^7.13.10" + "@radix-ui/primitive" "1.0.1" + "@radix-ui/react-collection" "1.0.3" + "@radix-ui/react-compose-refs" "1.0.1" + "@radix-ui/react-context" "1.0.1" + "@radix-ui/react-direction" "1.0.1" + "@radix-ui/react-dismissable-layer" "1.0.5" + "@radix-ui/react-id" "1.0.1" + "@radix-ui/react-presence" "1.0.1" + "@radix-ui/react-primitive" "1.0.3" + "@radix-ui/react-use-callback-ref" "1.0.1" + "@radix-ui/react-use-controllable-state" "1.0.1" + "@radix-ui/react-use-layout-effect" "1.0.1" + "@radix-ui/react-use-previous" "1.0.1" + "@radix-ui/react-visually-hidden" "1.0.3" + "@radix-ui/react-popper@1.1.3": version "1.1.3" resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-1.1.3.tgz#24c03f527e7ac348fabf18c89795d85d21b00b42" @@ -2178,6 +2211,15 @@ fraction.js@^4.2.0: resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-4.3.7.tgz#06ca0085157e42fda7f9e726e79fefc4068840f7" integrity sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew== +framer-motion@^10.16.4: + version "10.16.4" + resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-10.16.4.tgz#30279ef5499b8d85db3a298ee25c83429933e9f8" + integrity sha512-p9V9nGomS3m6/CALXqv6nFGMuFOxbWsmaOrdmhyQimMIlLl3LC7h7l86wge/Js/8cRu5ktutS/zlzgR7eBOtFA== + dependencies: + tslib "^2.4.0" + optionalDependencies: + "@emotion/is-prop-valid" "^0.8.2" + fs.realpath@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"