From 31abf138b94cd34f3d1f42d79f896127ab43389b Mon Sep 17 00:00:00 2001
From: dogancanbakir <dogancanbakir@protonmail.com>
Date: Mon, 1 Jun 2020 15:13:47 +0000
Subject: [PATCH 1/2] Fix annotation widget

---
 formasaurus/widgets.py | 30 ++++++++++++++++++------------
 1 file changed, 18 insertions(+), 12 deletions(-)

diff --git a/formasaurus/widgets.py b/formasaurus/widgets.py
index 2592a54..70bfff5 100644
--- a/formasaurus/widgets.py
+++ b/formasaurus/widgets.py
@@ -15,6 +15,8 @@
 )
 from formasaurus.utils import inverse_mapping, download
 
+out = widgets.Output()
+
 
 def AddPageWidget(storage):
     """
@@ -59,7 +61,9 @@ def render(i):
             widget
         ])
 
-    def on_change(name, value):
+    def on_change(change):
+        value = change['new']
+
         for i in rendered:
             rendered[i].close()
 
@@ -71,10 +75,12 @@ def on_change(name, value):
         if save_func:
             save_func()
 
-        display(rendered[value])
+        with out:
+            display(rendered[value])
 
-    slider.on_trait_change(on_change, 'value')
-    on_change('value', slider.value)
+    slider.observe(on_change, names='value')
+    on_change({'new': slider.value})
+    display(out)
 
 
 def FormAnnotator(ann, annotate_fields=True, annotate_types=True, max_fields=80):
@@ -140,10 +146,10 @@ def FormTypeSelect(ann):
         description='form type:',
     )
 
-    def on_change(name, value):
-        ann.info['forms'][ann.index] = form_types[value]
+    def on_change(change):
+        ann.info['forms'][ann.index] = form_types[change['new']]
 
-    type_select.on_trait_change(on_change, 'value')
+    type_select.observe(on_change, names='value')
     return type_select
 
 
@@ -157,10 +163,10 @@ def FieldTypeSelect(ann, field_name):
         value=field_types_inv[tp],
     )
 
-    def on_change(name, value):
-        ann.fields[field_name] = field_types[value]
+    def on_change(change):
+        ann.fields[field_name] = field_types[change['new']]
 
-    type_select.on_trait_change(on_change, 'value')
+    type_select.observe(on_change, names='value')
     return type_select
 
 
@@ -188,8 +194,8 @@ def HtmlCode(form_html, field_name=None, max_height=None, **kwargs):
         kw['color'] = "#777"
     kw.update(kwargs)
     style = '; '.join([
-        'white-space:pre-wrap',
-        'max-width:800px',
+        'white-space:normal',
+        'max-width:inherit',
         'word-wrap:break-word',
         'font-family:monospace',
         'overflow:scroll',

From 0c83e19cd1c394fede7957755bd2384f58207fdb Mon Sep 17 00:00:00 2001
From: dogancanbakir <dogancanbakir@protonmail.com>
Date: Mon, 1 Jun 2020 18:15:08 +0000
Subject: [PATCH 2/2] Fix prev widget render issue

---
 formasaurus/widgets.py | 13 +++----------
 1 file changed, 3 insertions(+), 10 deletions(-)

diff --git a/formasaurus/widgets.py b/formasaurus/widgets.py
index 70bfff5..226c65a 100644
--- a/formasaurus/widgets.py
+++ b/formasaurus/widgets.py
@@ -48,7 +48,6 @@ def MultiFormAnnotator(annotations,
     A widget with a paginator for annotating multiple forms.
     """
     back, forward, slider = get_pager_elements(0, len(annotations) - 1)
-    rendered = {}
 
     def render(i):
         widget = FormAnnotator(
@@ -63,20 +62,14 @@ def render(i):
 
     def on_change(change):
         value = change['new']
-
-        for i in rendered:
-            rendered[i].close()
-
-        if value not in rendered:
-            rendered[value] = render(value)
-        else:
-            rendered[value].open()
+        rendered_widget = render(value)
 
         if save_func:
             save_func()
 
         with out:
-            display(rendered[value])
+            out.clear_output()
+            display(rendered_widget)
 
     slider.observe(on_change, names='value')
     on_change({'new': slider.value})