readme updates for beta release

Author: lukasbach

packages/docs/docs/getstarted.mdx

@@ -8,13 +8,6 @@ sidebar_position: 0
 
 import { DemoBox } from "../src/components/demo/demo-box";
 
-:::danger[A note on stability]
-
-This project is currently in Alpha. Expect breaking changes in minor version bumps and incomplete changelogs.
-Bug reports and contributions are welcome!
-
-:::
-
 ## Installation
 
 To start using Headless Tree, install it to your project as dependency via
@@ -33,6 +26,13 @@ During Alpha, releases are published on an irregular basis, and changelogs may n
 The current main branch is always published to NPM under the `snapshot` tag, so you can use
 `npm install @headless-tree/core@snapshot @headless-tree/react@snapshot` to get the latest snapshot deployment.
 
+:::tip[Headless Tree is available!]
+
+Headless Tree is now available as Beta! If the library provides you with a benefit, leaving [a star
+on Github](https://github.com/lukasbach/headless-tree) would help a lot with the visibility of the project.
+
+:::
+
 ## Quick Start
 
 The React Bindings of Headless Tree provide a hook `useTree` that creates a tree instance, which you can use

packages/docs/package.json

@@ -22,6 +22,7 @@
     "prism-react-renderer": "^2.3.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
+    "react-icons": "^5.5.0",
     "react-syntax-highlighter": "^15.5.0"
   },
   "devDependencies": {

packages/docs/src/pages/index.module.css

@@ -60,6 +60,16 @@
   display: flex;
   align-items: center;
   justify-content: center;
+  gap: 8px;
+}
+
+.socialBtn {
+  height: 47px;
+  width: 80px;
+  padding: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .demoBox {

packages/docs/src/pages/index.tsx

@@ -3,10 +3,11 @@ import Link from "@docusaurus/Link";
 import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
 import Layout from "@theme/Layout";
 import Heading from "@theme/Heading";
-
 import { storybookRoot } from "@site/src/components/demo/demo-box";
 import { DemoGrid } from "@site/src/components/home/demo-grid";
 import { HomeNotes } from "@site/src/components/home/home-notes";
+import { RiBlueskyFill } from "react-icons/ri";
+import { BsDiscord } from "react-icons/bs";
 import styles from "./index.module.css";
 
 function HomepageHeader() {
@@ -36,6 +37,18 @@ function HomepageHeader() {
             >
               Get Started
             </Link>
+            <Link
+              className={`button button--outline button--secondary button--lg ${styles.socialBtn}`}
+              to="https://discord.gg/KuZ6EezzVw"
+            >
+              <BsDiscord size="2rem" />
+            </Link>
+            <Link
+              className={`button button--outline button--secondary button--lg ${styles.socialBtn}`}
+              to="https://bsky.app/profile/lukasbach.bsky.social"
+            >
+              <RiBlueskyFill size="2rem" />
+            </Link>
           </div>
         </div>
         <div className={styles.heroRight}>