From dc822611fa4f2dea27e9a3d253d3fd34ae223925 Mon Sep 17 00:00:00 2001
From: Riccardo Perra <perrariccardo0@gmail.com>
Date: Sun, 9 Apr 2023 10:13:38 +0200
Subject: [PATCH] chore: fix demo

---
 README.md                                |  7 ++++---
 packages/playground/src/demo/Popover.tsx | 21 +++++++++++++++++++++
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 30ddc30..07ed856 100644
--- a/README.md
+++ b/README.md
@@ -4,10 +4,11 @@
 
 <div align="center">
 
-# CodeUI
+# CodeUI - [CodeImage](https://github.com/riccardoperra/codeimage) UI Kit
 
-[![pnpm](https://img.shields.io/badge/maintained%20with-pnpm-cc00ff.svg?style=for-the-badge&logo=pnpm)](https://pnpm.io/)
-[![turborepo](https://img.shields.io/badge/built%20with-turborepo-cc00ff.svg?style=for-the-badge&logo=turborepo)](https://turborepo.org/)
+[![pnpm](https://img.shields.io/badge/maintained%20with-pnpm-cc00ff.svg?logo=pnpm)](https://pnpm.io/)
+[![turborepo](https://img.shields.io/badge/built%20with-turborepo-cc00ff.svg?logo=turborepo)](https://turborepo.org/)
+[![Netlify Status](https://api.netlify.com/api/v1/badges/bcc7a6d1-e9dc-4650-a465-ced9cd676f6b/deploy-status?style=for=t)](https://app.netlify.com/sites/codeui/deploys)
 
 > **Warning** This is Still WIP
 
diff --git a/packages/playground/src/demo/Popover.tsx b/packages/playground/src/demo/Popover.tsx
index ad38cac..579055d 100644
--- a/packages/playground/src/demo/Popover.tsx
+++ b/packages/playground/src/demo/Popover.tsx
@@ -41,6 +41,27 @@ export function PopoverDemo() {
 						with SolidJS.
 					</PopoverContent>
 				</Popover>
+
+				<Popover isOpen={open()} onOpenChange={setOpen}>
+					<PopoverTrigger asChild>
+						<As component={Button} theme={"secondary"}>
+							Open (controlled)
+						</As>
+					</PopoverTrigger>
+					<PopoverContent title={"Title"}>About Kobalte A UI toolkit</PopoverContent>
+				</Popover>
+
+				<Popover placement={"bottom-start"}>
+					<PopoverTrigger asChild>
+						<As component={Button} theme={"secondary"}>
+							Custom position
+						</As>
+					</PopoverTrigger>
+					<PopoverContent title={"Title"}>
+						About Kobalte A UI toolkit for building accessible web apps and design systems
+						with SolidJS.
+					</PopoverContent>
+				</Popover>
 			</DemoSectionRow>
 		</div>
 	);