coveragebook_components 0.5.2 → 0.5.4

data/app/components/coco/app/blocks/slide_editor/slide_editor.js

@@ -2,6 +2,7 @@ import { CocoComponent } from "@js/coco";
 import { getData } from "@helpers/alpine";
 import { captureElementScreenshot } from "@helpers/screenshot";
 import { isDark } from "@helpers/color";
+import { wasSuccessful } from "@helpers/turbo_events";
 import { withUndo } from "@js/base/mixins";
 
 export default CocoComponent("appSlideEditor", (data) => {
@@ -54,10 +55,19 @@ export default CocoComponent("appSlideEditor", (data) => {
 
     undo(name, value) {
       this[name] = value;
+      this.$nextTick(() => this.updateTextareaSizes());
     },
 
     redo(name, value) {
       this[name] = value;
+      this.$nextTick(() => this.updateTextareaSizes());
+    },
+
+    updateTextareaSizes() {
+      const inputs = this.$root.querySelectorAll(
+        "[data-component='app-seamless-textarea']"
+      );
+      Array.from(inputs).forEach((el) => getData(el).onResize());
     },
 
     handleImageDrop(event) {
@@ -71,8 +81,6 @@ export default CocoComponent("appSlideEditor", (data) => {
     },
 
     async save() {
-      if (this.saving) return;
-
       this.clearErrors();
       this.saving = true;
 
@@ -82,7 +90,7 @@ export default CocoComponent("appSlideEditor", (data) => {
         } catch (error) {
           this.thumbnailFile = null;
           message = error.message || "Error generating slide thumbnail";
-          this._handleSaveError(message, { error });
+          this.handleSaveError(message, { error });
           return;
         }
       }
@@ -90,13 +98,22 @@ export default CocoComponent("appSlideEditor", (data) => {
       const form = this.$refs.form && this.$refs.form.querySelector("form");
 
       if (form && form.dataset.submit !== "false") {
-        form.requestSubmit();
+        const submitButton = form.querySelector("[type='submit']");
+        if (submitButton) {
+          submitButton.click();
+        } else {
+          this.handleSaveError("Slide form is missing a submit button");
+        }
       } else {
         this.submitSuccess();
       }
     },
 
-    submitSuccess() {
+    submitEnd($event) {
+      this[wasSuccessful($event) ? "submitSuccess" : "submitError"]($event);
+    },
+
+    submitSuccess($event) {
       this.history.clear();
       this._fields.forEach((name) => (this.saved[name] = this[name]));
       this.saving = false;
@@ -106,13 +123,22 @@ export default CocoComponent("appSlideEditor", (data) => {
     },
 
     submitError($event) {
-      message = "Error saving slide";
-      this._handleSaveError(message, { event: $event });
+      const message = "Error saving slide - form could not be submitted";
+      this.handleSaveError(message, { event: $event });
     },
 
     directUploadError($event) {
-      $event.preventDefault();
-      this._handleSaveError($event.detail.error, { event: $event });
+      $event.preventDefault(); // prevent generic alert dialog error
+
+      const message = $event.detail.error || "Error uploading file to storage";
+      this.handleSaveError(message, { event: $event });
+    },
+
+    handleSaveError(message = "Error saving slide", context = {}) {
+      this.errors.push({ message, context });
+      this.saving = false;
+
+      this.$dispatch("slide:save-end", { success: false });
     },
 
     clearErrors() {
@@ -159,13 +185,6 @@ export default CocoComponent("appSlideEditor", (data) => {
       );
     },
 
-    _handleSaveError(message = "Error saving slide", context = {}) {
-      this.errors.push({ message, context });
-      this.saving = false;
-
-      this.$dispatch("slide:save-end", { success: false });
-    },
-
     /* bindings */
 
     slide: {

data/app/components/coco/app/blocks/slide_editor/slide_editor.rb

@@ -18,7 +18,7 @@ module Coco
         renders_one :text_1, ->(value = nil, **textarea_options) do
           Coco::App::Elements::SeamlessTextarea.new(**textarea_options,
             value: value,
-            multiline: false,
+            multiline: true,
             data: {role: "text-1-editor"},
             x: {modelable: "value", model: "text1"})
         end

data/app/components/coco/app/elements/color_picker/color_picker.rb

@@ -7,14 +7,14 @@ module Coco
 
         DEFAULT_SWATCHES = [
           {color: "#111827"},
+          {color: "#F3F4F6"},
           {color: "#FFFFFF"},
-          {color: "#E78188"},
-          {color: "#D50201"},
-          {color: "#FC5C0E"},
           {color: "#FEC878"},
-          {color: "#F5EEE6"},
-          {color: "#C1DAA9"},
+          {color: "#FC5C0E"},
+          {color: "#D50201"},
           {color: "#1A8871"},
+          {color: "#C1DAA9"},
+          {color: "#F5EEE6"},
           {color: "#91C7E1"},
           {color: "#0164FF"},
           {color: "#3A2D86"}

data/app/components/coco/base/button/button.css

@@ -1,11 +1,10 @@
 @layer components {
   [data-coco].coco-button {
     @apply inline-flex transition-colors w-auto bg-transparent text-current border border-transparent select-none flex-none;
-    @apply outline-none focus-visible:outline-0;
     width: min-content;
 
     .button-element {
-      @apply inline-flex w-full no-underline;
+      @apply inline-flex w-full no-underline outline-none focus-visible:outline-0;
     }
 
     .button-inner {

data/app/components/coco/base/button/button.html.erb

@@ -24,7 +24,7 @@
               class="button-icon"
               x-ref="<%= name %>Icon"
               x-show="showIcon('<%= name %>')"
-              <%= "x-cloak" unless name == :default %>>
+              <%= "x-cloak" unless name.to_sym == :default %>>
               <%= props[:icon] %>
             </span>
           <% else %>
@@ -42,7 +42,7 @@
               class="button-content"
               x-ref="<%= name %>Content"
               x-show="showContent('<%= name %>')"
-              <%= "x-cloak" unless name == :default %>>
+              <%= "x-cloak" unless name.to_sym == :default %>>
               <%= props[:text] %>
             </span>
           <% else %>

data/app/components/coco/book/blocks/slides/editable_slide/editable_slide.rb

@@ -32,7 +32,7 @@ module Coco
           end
 
           def render?
-            @has_content || @render_empty == true
+            @has_content || bg_image.present? || @render_empty == true
           end
 
           def slide_styles