From eb8ca16a14705c7a560078c95053a05b76d9da53 Mon Sep 17 00:00:00 2001
From: Moritz Bischof <moritz.bischof1@gmail.com>
Date: Tue, 4 May 2021 19:24:27 +0200
Subject: [PATCH] add example usage to Checkbox docs

---
 docs/src/pages/components/Checkbox.svx | 30 ++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)

diff --git a/docs/src/pages/components/Checkbox.svx b/docs/src/pages/components/Checkbox.svx
index 8bbd26c4..1710fb0f 100644
--- a/docs/src/pages/components/Checkbox.svx
+++ b/docs/src/pages/components/Checkbox.svx
@@ -1,8 +1,38 @@
 <script>
   import { Checkbox } from "carbon-components-svelte";
   import Preview from "../../components/Preview.svelte";
+  import Playground from "../../components/playground/Playground.svelte";
 </script>
 
+<Playground
+    component={Checkbox}
+    props={{
+        labelText: {
+            component: "TextInput",
+            props: { value: "Label text", labelText: "Label" }
+        },
+        checked: {
+            component: "Checkbox",
+            props: { labelText: "Checked" }
+        },
+        indeterminate: {
+            component: "Checkbox",
+            props: { labelText: "Indeterminate" }
+        },
+        hideLabel: {
+            component: "Checkbox",
+            props: { labelText: "Hide label" }
+        },
+        disabled: {
+            component: "Checkbox",
+            props: { labelText: "Disabled" }
+        },
+        skeleton: {
+            component: "Checkbox",
+            props: { labelText: "Skeleton" }
+        },
+    }} />
+
 ### Default (unchecked)
 
 <Checkbox labelText="Label text" />