docs: add links to egghead course

website/components/mdx-components.tsx

@@ -19,6 +19,7 @@ import { useFramework } from "./framework"
 import { KeyboardTable } from "./keyboard-table"
 import { PropTable } from "./prop-table"
 import { Showcase } from "./showcase"
+import Image from "next/image"
 
 function SnippetItem({ body, id }: { body: MDX; id: string }) {
   const content = useMDX(body.code)
@@ -60,6 +61,13 @@ const components: Record<string, FC<any>> = {
   Admonition(props) {
     return <div {...props} />
   },
+  Image(props) {
+    return (
+      <Box rounded="md" overflow="hidden" mt="6" display="inline-block">
+        <Image alt="" {...props} />
+      </Box>
+    )
+  },
   Resources(props) {
     const comp = allComponents.find((c) => c.package === props.pkg)
     if (!comp) return null

website/data/overview/introduction.mdx

@@ -6,14 +6,16 @@ description: The why and the what behind Zag
 # Introduction to Zag
 
 Zag is a framework agnostic toolkit for implementing complex, interactive, and
-accessible UI components in your design system and web applications.
+accessible UI components in your design system and web applications. Works for
+React, Solid and Vue.
 
 > Zag is part of the next evolution of Chakra UI, and one of the four arms of
 > the future of Chakra UI.
 > [**Watch the talk here**](https://www.youtube.com/watch?v=I5xEc9t-HZg)
 
-With Zag, you can build accessible UI components in React, Solid and Vue without
-sweating over the logic.
+<a href="https://www.youtube.com/watch?v=I5xEc9t-HZg">
+  <Image src="/lee-rob-interview.png" width="640" height="210" />
+</a>
 
 ## Motivation
 
@@ -53,6 +55,18 @@ framework they're built with. That's why we built Zag.
   component machine is an NPM package and can be installed individually so you
   can use them incrementally.
 
+## Learn
+
+[Watch the course](https://egghead.io/courses/statechart-driven-ui-components-with-zag-js-53f85394)
+on Egghead to learn how to build statechart-driven UI components with Zag.js.
+
+This course will give you a deep dive into how Zag works and how you can use it
+to build complex UI components.
+
+<a href="https://egghead.io/courses/statechart-driven-ui-components-with-zag-js-53f85394">
+  <Image src="/og-banner-zag-course.png" width="640" height="210" />
+</a>
+
 ## Fun Facts
 
 **Zag** means to _take a sharp change in direction_. This clearly describes our