diff --git a/src/components/panel/Panel.vue b/src/components/panel/Panel.vue
index f37103da3..810ca1559 100644
--- a/src/components/panel/Panel.vue
+++ b/src/components/panel/Panel.vue
@@ -30,9 +30,15 @@ export default {
            d_collapsed: this.collapsed
         }
     },
+    watch: {
+        collapsed(newValue) {
+            this.d_collapsed = newValue;
+        }
+    },
     methods: {
         toggle(event) {
             this.d_collapsed = !this.d_collapsed;
+            this.$emit('update:collapsed', this.d_collapsed);
             this.$emit('toggle', {
                 originalEvent: event,
                 value: this.d_collapsed
diff --git a/src/views/panel/PanelDemo.vue b/src/views/panel/PanelDemo.vue
index 15f62bdb0..dad82fd51 100644
--- a/src/views/panel/PanelDemo.vue
+++ b/src/views/panel/PanelDemo.vue
@@ -32,8 +32,8 @@
 import PanelDoc from './PanelDoc';
 
 export default {
-		components: {
-				'PanelDoc': PanelDoc
-		}
+    components: {
+        'PanelDoc': PanelDoc
+    }
 }
 </script>
\ No newline at end of file
diff --git a/src/views/panel/PanelDoc.vue b/src/views/panel/PanelDoc.vue
index f746b0646..87a089b83 100644
--- a/src/views/panel/PanelDoc.vue
+++ b/src/views/panel/PanelDoc.vue
@@ -38,6 +38,22 @@ import Panel from 'primevue/panel';
 	Through Michael's life the nature of the family business becomes clear. The business of the family is just like the head of the family,
 	kind and benevolent to those who give respect, but given to ruthless violence whenever anything stands against the good of the family.
 &lt;/Panel&gt;
+</CodeHighlight>
+
+                <p>To control the initial state of the toggleable panel, use the <i>collapsed</i> property.</p>
+<CodeHighlight>
+&lt;Panel header="Header Text" :toggleable="true" :collapsed="true"&gt;
+	Content
+&lt;/Panel&gt;
+</CodeHighlight>
+
+                <p>Use the sync operator to enable two-way binding.</p>
+
+<CodeHighlight>
+&lt;button type="button" @click="isCollapsed = !isCollapsed">Toggle Programmatically&lt;/button&gt;
+&lt;Panel header="Header Text" :toggleable="true" :collapsed.sync="isCollapsed"&gt;
+	Content
+&lt;/Panel&gt;
 </CodeHighlight>
 
 				<h3>Properties</h3>