Merge branch 'master' of github.com:Budibase/budibase into issue#9

packages/bootstrap-components/src/Form.svelte

@@ -1,5 +1,5 @@
 <script>
-export let containerClass = "";
+
 export let formControls = [];
 
 export let _bb;
@@ -24,7 +24,7 @@ $ : {
                 _bb.insertComponent(
                     _bb.props.formControls[el].control,
                     htmlElements[el],
-                    labelElements[el]);
+                    htmlElements[el].childNodes.find(n => n.tagName === "LABEL"));
             } else {
                 _bb.appendComponent(
                     _bb.props.formControls[el].control,
@@ -38,9 +38,9 @@ $ : {
 </script>
 
 <form>
-    {#each formControls as child, index}
+    {#each formControls as child, idx}
-    <div class="form-group" bind:this={htmlElements[index]}>
+    <div class="form-group" bind:this={htmlElements[idx]}>
-        <label bind:this={labelElements[index]}>{labels[index]}</label>
+        <label>{labels[idx]}</label>
     </div>
     {/each}
 </form>

packages/builder/src/common/Modal.svelte

@@ -1,41 +1,41 @@
-<script>
+<script>
-import UIkit from "uikit";
+import UIkit from "uikit";
-
+
-export let isOpen = false;
+export let isOpen = false;
-export let onClosed = () => {};
+export let onClosed = () => {};
-export let id = "";
+export let id = "";
-
+
-let ukModal;
+let ukModal;
-let listenerAdded = false;
+let listenerAdded = false;
-
+
-$: {
+$: {
-    if(ukModal && !listenerAdded) {
+    if(ukModal && !listenerAdded) {
-        listenerAdded = true;
+        listenerAdded = true;
-        ukModal.addEventListener("hide", onClosed);
+        ukModal.addEventListener("hidden", onClosed);
-    }
+    }
-
+
-    if(ukModal) {
+    if(ukModal) {
-        if(isOpen) {
+        if(isOpen) {
-            UIkit.modal(ukModal).show();
+            UIkit.modal(ukModal).show();
-        } else {
+        } else {
-            UIkit.modal(ukModal).hide();
+            UIkit.modal(ukModal).hide();
-        }
+        }
-    }
+    }
-}
+}
-
+
-</script>
+</script>
-
+
-<div bind:this={ukModal} uk-modal {id}>
+<div bind:this={ukModal} uk-modal {id}>
-    <div class="uk-modal-dialog uk-modal-body" uk-overflow-auto>
+    <div class="uk-modal-dialog uk-modal-body" uk-overflow-auto>
-        <slot />
+        <slot />
-    </div>
+    </div>
-</div>
+</div>
-
+
-
+
-<style>
+<style>
-
+
-.uk-modal-dialog {
+.uk-modal-dialog {
-    border-radius: .3rem;
+    border-radius: .3rem;
-}
+}
-
+
 </style>

packages/builder/src/database/RecordView.svelte

@@ -39,6 +39,7 @@ store.subscribe($store => {
         editingField = true;
     }
 
+
     onFinishedFieldEdit = (field) => {
         if(field) {
             store.saveField(field);
@@ -139,7 +140,7 @@ const nameChanged = ev => {
     {/if}
 
     {#if editingField}
-    <Modal bind:isOpen={editingField}>
+    <Modal bind:isOpen={editingField} onClosed={() => onFinishedFieldEdit(false) }>
         <FieldView field={fieldToEdit} 
                    onFinished={onFinishedFieldEdit}
                    allFields={record.fields}