alchemy_cms 7.1.0.pre.b2 → 7.1.0.pre.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d58b4f365ee68fac527d4ffad812ad68343fcfcb0b17ace3348aebd57d25c4d3
-  data.tar.gz: 91017ca029bc75e2f15d9c4ad3e60cf17f81a00f6bb72ca66f4a16c02d71f46b
+  metadata.gz: 52cea190db8dfb6571f62d93f72942df0c05afbf7b7988b952da56cbbba5dd91
+  data.tar.gz: efd336249755bc11de59ff751be0af224ab9861f902df7ddd4226a97208840b6
 SHA512:
-  metadata.gz: 6d1a10956e3ee72021b402063f36f930da4db1d48b631159e9bec9535bddc4f9b369dffdfb5d20f5b3a4e33f699bee4b93f1d8eaa4e6cc1269b1585c14c9792e
-  data.tar.gz: 0a3936c7a71f7d32ddc348f3cff42be35204816bc88cc6223e400dba647da412c4a009879d855c289b75be743375b81976e5a3038cc8023e86d4eb77195559ec
+  metadata.gz: 587dee2f8372e32252543bbf6dd86bad7ab69d1734c2f129b3b6c4d11519e32f476f8605d2675e3df8cde2a1485ec470383baab818ab236895d61e0f37f9b631
+  data.tar.gz: dfdaa30ab9f4429d75fdc1bf4930cce9e5b093f9a5e4ca2a3a090008e90c0747b8efb6c7dc40fecc0874fd788db9de82da3a6e071eeed2c65e297ca2a3c9b7a2

data/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 7.1.0-rc1 (2024-01-15)
+
+- Use title attribute for link_to_dialog and delete_button tooltip [#2688](https://github.com/AlchemyCMS/alchemy_cms/pull/2688) ([tvdeyen](https://github.com/tvdeyen))
+- Add alchemy-clipboard-button component [#2687](https://github.com/AlchemyCMS/alchemy_cms/pull/2687) ([tvdeyen](https://github.com/tvdeyen))
+- Fix layout of empty picture archive [#2686](https://github.com/AlchemyCMS/alchemy_cms/pull/2686) ([tvdeyen](https://github.com/tvdeyen))
+- Fix Tinymce language config [#2685](https://github.com/AlchemyCMS/alchemy_cms/pull/2685) ([tvdeyen](https://github.com/tvdeyen))
+- Add richtext input type for form builder [#2684](https://github.com/AlchemyCMS/alchemy_cms/pull/2684) ([tvdeyen](https://github.com/tvdeyen))
+- Add support for legacy icon styles [#2683](https://github.com/AlchemyCMS/alchemy_cms/pull/2683) ([tvdeyen](https://github.com/tvdeyen))
+- Fix imports of ES modules [#2682](https://github.com/AlchemyCMS/alchemy_cms/pull/2682) ([tvdeyen](https://github.com/tvdeyen))
+- Use webp for image cropper [#2681](https://github.com/AlchemyCMS/alchemy_cms/pull/2681) ([tvdeyen](https://github.com/tvdeyen))
+- Fix sizing of tinymce textarea [#2680](https://github.com/AlchemyCMS/alchemy_cms/pull/2680) ([tvdeyen](https://github.com/tvdeyen))
+
 ## 7.1.0-b2 (2024-01-09)
 
 - Download and bundle third party JS packages with npm [#2679](https://github.com/AlchemyCMS/alchemy_cms/pull/2679) ([tvdeyen](https://github.com/tvdeyen))

data/app/assets/stylesheets/alchemy/filter_field.scss

@@ -14,6 +14,11 @@
     padding-left: 28px;
     padding-right: 24px;
     margin: 0;
+
+    .input & {
+      float: none;
+      width: 100%;
+    }
   }
 
   .js_filter_field_clear {

data/app/assets/stylesheets/tinymce/skins/ui/alchemy/skin.min.scss

@@ -2229,6 +2229,11 @@ body.tox-dialog__disable-scroll {
   -ms-flex-preferred-size: auto;
 }
 
+.tox .tox-form__group--stretched .tox-textarea-wrap {
+  display: flex;
+  flex: 1;
+}
+
 .tox .tox-form__group--stretched .tox-textarea {
   flex: 1;
   -ms-flex-preferred-size: auto;

data/app/helpers/alchemy/admin/base_helper.rb

@@ -54,11 +54,18 @@ module Alchemy
       def link_to_dialog(content, url, options = {}, html_options = {})
         default_options = {modal: true}
         options = default_options.merge(options)
-        link_to content, url,
-          html_options.merge(
-            "data-dialog-options" => options.to_json,
-            :is => "alchemy-dialog-link"
-          )
+        if html_options[:title]
+          tooltip = html_options.delete(:title)
+        end
+        anchor = link_to(content, url, html_options.merge(
+          "data-dialog-options" => options.to_json,
+          :is => "alchemy-dialog-link"
+        ))
+        if tooltip
+          content_tag("sl-tooltip", anchor, content: tooltip)
+        else
+          anchor
+        end
       end
 
       # Used for translations selector in Alchemy cockpit user settings.
@@ -194,16 +201,22 @@ module Alchemy
           message: Alchemy.t("Are you sure?"),
           icon: "delete-bin-2"
         }.merge(options)
-        button_with_confirm(
+
+        if html_options[:title]
+          tooltip = html_options.delete(:title)
+        end
+        button = button_with_confirm(
           render_icon(options[:icon]),
-          url, {
-            message: options[:message]
-          }, {
+          url, options, {
             method: "delete",
-            title: options[:title],
             class: "icon_button #{html_options.delete(:class)}".strip
           }.merge(html_options)
         )
+        if tooltip
+          content_tag("sl-tooltip", button, content: tooltip)
+        else
+          button
+        end
       end
 
       # (internal) Renders translated Module Names for html title element.

data/app/helpers/alchemy/base_helper.rb

@@ -28,7 +28,7 @@ module Alchemy
     # @return [String]
     def render_icon(icon_name, options = {})
       options = {style: "line", fixed_width: true}.merge(options)
-      style = options[:style] && "-#{options[:style]}"
+      style = options[:style] && "-#{ri_style(options[:style])}"
       classes = [
         "icon",
         "ri-#{ri_icon(icon_name)}#{style}",
@@ -134,5 +134,20 @@ module Alchemy
         icon_name
       end
     end
+
+    # Returns the Remix icon style for given style
+    #
+    # @param style [String] The style name
+    # @return [String] The RemixIcon style
+    def ri_style(style)
+      case style.to_s
+      when "solid", "fill"
+        "fill"
+      when "line", "regular"
+        "line"
+      else
+        style
+      end
+    end
   end
 end

data/app/javascript/alchemy_admin/components/button.js

@@ -1,4 +1,4 @@
-import Spinner from "../spinner"
+import Spinner from "alchemy_admin/spinner"
 
 class Button extends HTMLButtonElement {
   connectedCallback() {

data/app/javascript/alchemy_admin/components/clipboard_button.js

@@ -0,0 +1,27 @@
+import "clipboard"
+
+class ClipboardButton extends HTMLElement {
+  constructor() {
+    super()
+
+    this.innerHTML = `
+      <i class="icon ri-clipboard-line ri-fw"></i>
+    `
+
+    this.clipboard = new ClipboardJS(this, {
+      text: () => {
+        return this.getAttribute("content")
+      }
+    })
+
+    this.clipboard.on("success", () => {
+      Alchemy.growl(this.getAttribute("success-text"))
+    })
+  }
+
+  disconnectedCallback() {
+    this.clipboard.destroy()
+  }
+}
+
+customElements.define("alchemy-clipboard-button", ClipboardButton)

data/app/javascript/alchemy_admin/components/element_editor.js

@@ -4,9 +4,9 @@ import fileEditors from "alchemy_admin/file_editors"
 import pictureEditors from "alchemy_admin/picture_editors"
 import IngredientAnchorLink from "alchemy_admin/ingredient_anchor_link"
 import { post } from "alchemy_admin/utils/ajax"
-import { createHtmlElement } from "../utils/dom_helpers"
+import { createHtmlElement } from "alchemy_admin/utils/dom_helpers"
 
-import "./element_editor/publish_element_button"
+import "alchemy_admin/components/element_editor/publish_element_button"
 
 export class ElementEditor extends HTMLElement {
   constructor() {

data/app/javascript/alchemy_admin/components/tinymce.js

@@ -103,7 +103,7 @@ class Tinymce extends AlchemyHTMLElement {
     return {
       ...Alchemy.TinymceDefaults,
       ...customConfig,
-      locale: currentLocale(),
+      language: currentLocale(),
       selector: `#${this.editorId}`
     }
   }

data/app/javascript/alchemy_admin.js

@@ -21,6 +21,7 @@ import PagePublicationFields from "alchemy_admin/page_publication_fields"
 // Web Components
 import "alchemy_admin/components/button"
 import "alchemy_admin/components/char_counter"
+import "alchemy_admin/components/clipboard_button"
 import "alchemy_admin/components/datepicker"
 import "alchemy_admin/components/dialog_link"
 import "alchemy_admin/components/element_editor"
@@ -33,7 +34,6 @@ import "alchemy_admin/components/page_select"
 import "alchemy_admin/components/select"
 import "alchemy_admin/components/spinner"
 import "alchemy_admin/components/tinymce"
-import "alchemy_admin/clipboard"
 
 import { setDefaultAnimation } from "shoelace"
 

data/app/views/alchemy/admin/attachments/show.html.erb

@@ -8,16 +8,20 @@
   <div class="value with-icon">
     <label><%= Alchemy::Attachment.human_attribute_name(:url) %></label>
     <p><%= @attachment.url %></p>
-    <a data-clipboard-text="<%= @attachment.url %>" data-clipboard-success-text="<%= Alchemy.t("Copied to clipboard") %>" class="icon_button--right">
-      <%= render_icon(:clipboard) %>
-    </a>
+    <alchemy-clipboard-button
+      content="<%= @attachment.url %>"
+      success-text="<%= Alchemy.t("Copied to clipboard") %>"
+      class="icon_button--right"
+    ></alchemy-clipboard-button>
   </div>
   <div class="value with-icon">
     <label><%= Alchemy::Attachment.human_attribute_name(:download_url) %></label>
     <p><%= @attachment.url(download: true) %></p>
-    <a data-clipboard-text="<%= @attachment.url(download: true) %>" data-clipboard-success-text="<%= Alchemy.t("Copied to clipboard") %>" class="icon_button--right">
-      <%= render_icon(:clipboard) %>
-    </a>
+    <alchemy-clipboard-button
+      content="<%= @attachment.url(download: true) %>"
+      success-text="<%= Alchemy.t("Copied to clipboard") %>"
+      class="icon_button--right"
+    ></alchemy-clipboard-button>
   </div>
 </div>
 

data/app/views/alchemy/admin/crop.html.erb

@@ -8,7 +8,7 @@
     <%= simple_format Alchemy.t(:explain_cropping) %>
   <% end %>
   <div class="thumbnail_background">
-    <%= image_tag @picture.url(size: '800x600', flatten: true), id: 'imageToCrop' %>
+    <%= image_tag @picture.url(size: '800x600', flatten: true, format: "webp"), id: 'imageToCrop' %>
   </div>
   <form>
     <%= button_tag Alchemy.t(:apply), type: 'submit' %>

data/app/views/alchemy/admin/nodes/index.html.erb

@@ -11,6 +11,7 @@
       label: Alchemy.t(:create_menu),
       url: alchemy.new_admin_node_path,
       hotkey: 'alt+n',
+      tooltip_placement: "top-start",
       dialog_options: {
         title: Alchemy.t(:create_menu),
         size: '450x120'

data/app/views/alchemy/admin/partials/_toolbar_button.html.erb

@@ -7,7 +7,6 @@
         options[:dialog_options],
         {
           class: ["icon_button", options[:active] && "active"].compact,
-          title: options[:title],
           "data-alchemy-hotkey" => options[:hotkey]
         }.merge(options[:link_options])
       ) %>

data/app/views/alchemy/admin/pictures/_archive.html.erb

@@ -38,7 +38,6 @@
       style: 'float: none'
     ) %>
   </div>
-  <div id="pictures" class="picture-size--<%= @size %>">
   <% if @pictures.blank? and @recent_pictures.blank? and search_filter_params[:q].blank? %>
     <%= render_message do %>
       <%= Alchemy.t(:no_images_in_archive) %>
@@ -48,9 +47,10 @@
       <%= Alchemy.t(:no_search_results) %>
     <% end %>
   <% else %>
-    <%= render partial: 'picture', collection: @pictures %>
+    <div id="pictures" class="picture-size--<%= @size %>">
+      <%= render partial: 'picture', collection: @pictures %>
+    </div>
   <% end %>
-  </div>
 <% end %>
 
 <%= paginate @pictures, theme: 'alchemy' %>

data/app/views/alchemy/admin/pictures/_archive_overlay.html.erb

@@ -8,7 +8,20 @@
       <%= render 'tag_list' %>
     </div>
   </div>
-  <div id="overlay_picture_list" class="picture-size--<%= @size %>">
-    <%= render 'overlay_picture_list' %>
-  </div>
+  <% if @pictures.empty? %>
+    <%= render_message do %>
+      <% if search_filter_params.empty? %>
+        <%= Alchemy.t(:no_images_in_archive) %>
+      <% else %>
+        <%= Alchemy.t(:no_search_results) %>
+      <% end %>
+    <% end %>
+  <% else %>
+    <div id="overlay_picture_list" class="picture-size--<%= @size %>">
+      <%= render partial: 'picture_to_assign',
+        collection: @pictures,
+        locals: {size: @size} %>
+      <%= paginate @pictures, theme: 'alchemy', remote: true, hide_per_page_select: true %>
+    </div>
+  <% end %>
 </div>

data/app/views/layouts/alchemy/admin.html.erb

@@ -55,7 +55,7 @@
           }, {'data-alchemy-hotkey' => 'alt+q'}) %>
         <% else %>
           <%= link_to(alchemy.root_path) do %>
-            <i class="icon ri-logout-r-line ri-fw ri-lg"></i>
+            <i class="icon ri-logout-box-r-line ri-fw ri-lg"></i>
             <label><%= Alchemy.t(:leave) %></label>
           <% end %>
         <% end %>

data/eslint.config.js

@@ -0,0 +1,17 @@
+module.exports = [
+  {
+    rules: {
+      "no-restricted-imports": [
+        "error",
+        {
+          patterns: [
+            {
+              group: ["./", "../"],
+              message: "Relative imports are not allowed."
+            }
+          ]
+        }
+      ]
+    }
+  }
+]

data/lib/alchemy/forms/builder.rb

@@ -43,6 +43,13 @@ module Alchemy
         template.content_tag("alchemy-datepicker", date_field, type: type)
       end
 
+      # Renders a simple_form input that displays a richtext editor
+      #
+      def richtext(attribute_name, options = {})
+        text_area = input(attribute_name, options.merge(as: :text))
+        template.content_tag("alchemy-tinymce", text_area)
+      end
+
       # Renders a button tag wrapped in a div with 'submit' class.
       #
       def submit(label, options = {})

data/lib/alchemy/test_support/capybara_helpers.rb

@@ -47,7 +47,7 @@ module Alchemy
       end
 
       def click_button_with_tooltip(content)
-        find(%([content="#{content}"] > button)).click
+        find(%([content="#{content}"] button)).click
       end
 
       def click_link_with_tooltip(content)

data/lib/alchemy/version.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 module Alchemy
-  VERSION = "7.1.0-b2"
+  VERSION = "7.1.0-rc1"
 
   def self.version
     VERSION

data/package.json

@@ -3,6 +3,7 @@
   "scripts": {
     "test": "jest",
     "lint": "prettier --check 'app/javascript/**/*.js'",
+    "eslint": "eslint app/javascript/**/*.js",
     "build": "rollup -c"
   },
   "keywords": [],
@@ -25,6 +26,7 @@
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-terser": "^0.4.4",
     "babel-jest": "^29.6.4",
+    "eslint": "^8.56.0",
     "jest": "^29.6.4",
     "jest-environment-jsdom": "^29.6.4",
     "jquery": "^3.7.1",

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: alchemy_cms
 version: !ruby/object:Gem::Version
-  version: 7.1.0.pre.b2
+  version: 7.1.0.pre.rc1
 platform: ruby
 authors:
 - Thomas von Deyen
@@ -13,7 +13,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-01-09 00:00:00.000000000 Z
+date: 2024-01-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionmailer
@@ -884,10 +884,10 @@ files:
 - app/helpers/alchemy/pages_helper.rb
 - app/helpers/alchemy/url_helper.rb
 - app/javascript/alchemy_admin.js
-- app/javascript/alchemy_admin/clipboard.js
 - app/javascript/alchemy_admin/components/alchemy_html_element.js
 - app/javascript/alchemy_admin/components/button.js
 - app/javascript/alchemy_admin/components/char_counter.js
+- app/javascript/alchemy_admin/components/clipboard_button.js
 - app/javascript/alchemy_admin/components/datepicker.js
 - app/javascript/alchemy_admin/components/dialog_link.js
 - app/javascript/alchemy_admin/components/element_editor.js
@@ -1128,7 +1128,6 @@ files:
 - app/views/alchemy/admin/pictures/_filter_and_size_bar.html.erb
 - app/views/alchemy/admin/pictures/_form.html.erb
 - app/views/alchemy/admin/pictures/_infos.html.erb
-- app/views/alchemy/admin/pictures/_overlay_picture_list.html.erb
 - app/views/alchemy/admin/pictures/_picture.html.erb
 - app/views/alchemy/admin/pictures/_picture_to_assign.html.erb
 - app/views/alchemy/admin/pictures/_tag_list.html.erb
@@ -1252,6 +1251,7 @@ files:
 - db/migrate/20230123112425_add_searchable_to_alchemy_pages.rb
 - db/migrate/20230505132743_add_indexes_to_alchemy_pictures.rb
 - db/migrate/20231113104432_create_page_mutexes.rb
+- eslint.config.js
 - lib/alchemy.rb
 - lib/alchemy/ability_helper.rb
 - lib/alchemy/admin/locale.rb

data/app/javascript/alchemy_admin/clipboard.js

@@ -1,16 +0,0 @@
-import "clipboard"
-
-const clipboard = new ClipboardJS("[data-clipboard-text]")
-
-clipboard.on("success", (e) => {
-  Alchemy.growl(e.trigger.dataset.clipboardSuccessText)
-  e.clearSelection()
-})
-
-const currentDialog = Alchemy.currentDialog()
-
-if (currentDialog) {
-  currentDialog.dialog.on("DialogClose.Alchemy", () => {
-    clipboard.destroy()
-  })
-}

data/app/views/alchemy/admin/pictures/_overlay_picture_list.html.erb

@@ -1,10 +0,0 @@
-<% if @pictures.empty? %>
-  <%= render_message do %>
-    <%= Alchemy.t(:no_images_in_archive) %>
-  <% end %>
-<% else %>
-  <%= render partial: 'picture_to_assign',
-    collection: @pictures,
-    locals: {size: @size} %>
-  <%= paginate @pictures, theme: 'alchemy', remote: true, hide_per_page_select: true %>
-<% end %>