glib-web 0.18.0 → 1.0.1

package/components/_responsive.vue

@@ -106,7 +106,7 @@ a.panels-responsive {
     content: "\A";
     width: 100%;
     height: 100%;
-    background: rgba(0, 0, 0, 0.2);
+    background: rgba(0, 0, 0, 0.1);
     position: absolute;
     top: 0;
     left: 0;

package/components/fields/_patternText.vue

@@ -13,6 +13,7 @@
       :min="$sanitizeValue(spec.min)"
       :max="$sanitizeValue(spec.max)"
       :pattern="pattern"
+      :rules="$validation()"
       :outlined="$classes().includes('outlined')"
       :style="$styles()"
       clearable

package/components/fields/richText.vue

@@ -1,12 +1,18 @@
 <template>
   <div :style="$styles()" :class="$classes()">
     <v-progress-linear v-if="showProgress" v-model="progress.value" />
-    <VueEditor v-model="rawValue" :editor-toolbar="customToolbar" />
-    <input type="hidden" :name="spec.name" :value="markdownValue" />
+    <VueEditor
+      v-model="rawValue"
+      :editor-toolbar="customToolbar"
+      use-custom-image-handler
+      @text-change="separateOutImages"
+      @image-added="uploadImage"
+    />
+    <input type="hidden" :name="spec.name" :value="produceValue" />
     <input
       v-for="(imageKey, index) in imageKeys"
       :key="index"
-      type="text"
+      type="hidden"
       :name="imageUploader.name"
       :value="images[imageKey]"
     />
@@ -41,29 +47,23 @@ export default {
     imageKeys: [],
     progress: { value: -1 },
     imageUploader: {},
+    produce: "markdown",
     turndownService: new TurndownService({ headingStyle: "atx" })
   }),
   computed: {
     showProgress: function() {
       return this.progress.value >= 0;
     },
-    markdownValue: function() {
-      return this.turndownService.turndown(this.rawValue);
+    produceValue: function() {
+      if (this.produce == "html") {
+        return this.cleanValue;
+      } else if (this.produce == "markdown") {
+        return this.turndownService.turndown(this.cleanValue);
+      } else {
+        return null;
+      }
     }
   },
-  // mounted: function () {
-  //   const vm = this
-  //   this.rawValue = (this.spec.value || "").replace(/\{\{image([0-9]+)\}\}/g, function (_, index) {
-  //     const image = vm.spec.images[index - 1]
-  //     if (image && vm.$type.isString(image.value) && vm.$type.isString(image.fileUrl)) {
-  //       const url = image.fileUrl
-  //       const key = url.hashCode().toString()
-  //       vm.images[key] = image.value
-  //       return `<img src="${url}">`
-  //     }
-  //     return "{{IMAGE_NOT_FOUND}}"
-  //   })
-  // },
   mounted() {
     this.registerScrollEvent();
   },
@@ -90,13 +90,16 @@ export default {
             const url = image.fileUrl;
             const key = url.hashCode().toString();
             vm.images[key] = image.value;
-            return `<img src="${url}">`;
+            return url;
           }
           return "{{IMAGE_NOT_FOUND}}";
         }
       );
 
       this.imageUploader = this.spec.imageUploader;
+      if (this.spec.produce) {
+        this.produce = this.spec.produce;
+      }
     },
     uploadImage: function(file, editor, cursorLocation) {
       let vm = this;

package/components/mixins/styles.js

@@ -202,7 +202,10 @@ export default {
         // Has to be executed before $ready(). This executes regardless of whether a form is found because fields
         // may be used without a form.
         this.fieldName = this.spec.name;
-        this.fieldModel = this._sanitizeValue(this.spec.value);
+        // Don't initialize fieldModel unnecessarily because this will trigger validations on page load
+        if (this.spec.value) {
+          this.fieldModel = this._sanitizeValue(this.spec.value);
+        }
       }
     },
     $classes(spec) {

package/nav/drawer.vue

@@ -26,7 +26,7 @@
       <panels-responsive :spec="spec.header" />
     </template>
 
-    <glib-component v-if="spec.custom" :spec="spec.custom" />
+    <glib-component v-if="spec.body" :spec="spec.body" />
 
     <v-list dense class="pt-0">
       <div v-for="(item, index) in spec.rows" :key="index" class="nav-item">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glib-web",
-  "version": "0.18.0",
+  "version": "1.0.1",
   "description": "",
   "main": "index.js",
   "scripts": {