diff --git a/docs/docs/tree.md b/docs/docs/tree.md
index af93a22f..d7f5e206 100644
--- a/docs/docs/tree.md
+++ b/docs/docs/tree.md
@@ -9,6 +9,7 @@
 | **Name** | **Required** | **Type** | **Description** |
 | :----: | :----: | :----: | :---: |
 | title | |`string` | Title of the tree |
+| collapsable | | `boolean` | collapse enabled |
   
 ### Slots
 
diff --git a/packages/lib/src/tree/tree.wc.svelte b/packages/lib/src/tree/tree.wc.svelte
index d65a7922..da04c3a0 100644
--- a/packages/lib/src/tree/tree.wc.svelte
+++ b/packages/lib/src/tree/tree.wc.svelte
@@ -7,7 +7,8 @@
 
 <script lang="ts">
   export let title = 'Tree Title';
-  let expanded = false;
+  export let collapsable = true;
+  let expanded = !collapsable;
 </script>
 
 <svelte:document
@@ -27,7 +28,11 @@
 
 <div class="jp-tree">
   <div class="tree-header">
-    <button class="tree-arrow" on:click={() => (expanded = !expanded)}>
+    <button
+      class="tree-arrow"
+      on:click={() => expanded = !expanded}
+      disabled={!collapsable}
+    >
       <svg
         xmlns="http://www.w3.org/2000/svg"
         height="1em"