diff --git a/package.json b/package.json
index 7355c1d..5d74ccb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tiny-components/sidebar-form",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "sidebar to handle forms",
   "repository": {
     "type": "git",
diff --git a/src/sidebarFormHeader.riot b/src/sidebarFormHeader.riot
index 60943e9..d6f2be6 100644
--- a/src/sidebarFormHeader.riot
+++ b/src/sidebarFormHeader.riot
@@ -4,11 +4,23 @@
             { props.title }
         </div>
         <div class="bar__end">
-            <button class="button button--icon button--hover-icon-contrast m-top-3 m-bottom-3" type="button" onclick={ props.close }>
+            <button class="button button--icon button--hover-icon-contrast m-top-3 m-bottom-3" type="button" onclick={ () => { handleClose() } }>
                 <svg class="icon fill-danger" aria-hidden="true">
                     <use xlink:href="/symbol-defs.svg#icon-close"></use>
                 </svg>
             </button>
         </div>
     </div>
-</tiny-sidebar-form-header>
\ No newline at end of file
+
+    <script>
+
+        import { sidebarFormStore } from '@tiny-components/sidebar-form'
+
+        export default {
+            handleClose() {
+                sidebarFormStore.close(this.props.name)
+            }
+        }
+
+    </script>
+</tiny-sidebar-form-header>