From f808c594eb67be12b3c6610bb474a0550ec49b40 Mon Sep 17 00:00:00 2001
From: Benny Joo <sldisek783@gmail.com>
Date: Thu, 31 Mar 2022 13:31:00 +0100
Subject: [PATCH] Improve demo

---
 docs/pages/experiments/joy/chip.tsx | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/docs/pages/experiments/joy/chip.tsx b/docs/pages/experiments/joy/chip.tsx
index b9c769e4b2f462..0d816e0e3c1f6d 100644
--- a/docs/pages/experiments/joy/chip.tsx
+++ b/docs/pages/experiments/joy/chip.tsx
@@ -64,10 +64,10 @@ export default function JoyChip() {
                   key={`${value}-without-decorator`}
                   sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}
                 >
-                  <Chip label={`${propName}: ${value}`} {...{ [propName]: value }} />
-                  {value && (
+                  <Chip {...{ [propName]: value }}>{`${propName}: ${value}`}</Chip>
+                  {value !== undefined && (
                     <Typography level="body3" sx={{ textAlign: 'center', mt: '4px' }}>
-                      {value}
+                      {`${value}`}
                     </Typography>
                   )}
                 </Box>
@@ -89,12 +89,11 @@ export default function JoyChip() {
                   <Chip
                     startDecorator={<ThumbUp />}
                     endDecorator={<ArrowDropDown />}
-                    label={`${propName}: ${value}`}
                     {...{ [propName]: value }}
-                  />
-                  {value && (
+                  >{`${propName}: ${value}`}</Chip>
+                  {value !== undefined && (
                     <Typography level="body3" sx={{ textAlign: 'center', mt: '4px' }}>
-                      {value}
+                      {`${value}`}
                     </Typography>
                   )}
                 </Box>