decidim-core 0.31.2 → 0.31.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d24b967768820d8eb01abd435e318b7a869af854b0f374ca54c54a6dddbdddb6
-  data.tar.gz: f4374ee02ae0c5c9a580c8ad1c371c6552719be39b40e22cdf3d37018464950c
+  metadata.gz: c44cbb210028e54b7a2bcc3a10fc79e041e355eac55e81b9a4b934f5fb5b42db
+  data.tar.gz: 0d87937801924b8d92ef31e2b136019090118d89b46ddbe5f2ce4052eef207b0
 SHA512:
-  metadata.gz: a4baebaa527bd42897989aee6feeb29b4bf2773872b3bb7f8379a230111a94f0ee8565e15b02599fb6a1c20bb83a24feed96707448eecc70b866d74a8dd34bec
-  data.tar.gz: 47436bb0abfd556afcebe781b153aaaa9e960653be07fdf19486f11d82bfc40b61472dc24cfbc397838b19638a395bbad3dc3af8e1d791b2277412b3b56e719d
+  metadata.gz: 508ad856daf2345e66f3c6b0b01c1a0c851d225eca8d0e4e739d79f5584dacb6de8c0155b8a3f28ac80961f6346c31ef3d6fdc14f80299fd80184ea64697b4ef
+  data.tar.gz: 931b27cfcafe94a6f922d26c2c419dbf89386f64147234d5cf129641b52e2651e877cbfff63ec13f9844c5e6f91c12730df30f0fea2a5dffe2f6c61551bee522

data/app/cells/decidim/content_blocks/highlighted_elements_with_cell_for_list_cell.rb

@@ -19,10 +19,14 @@ module Decidim
         @list_cell ||= cell(
           list_cell_path,
           published_components.one? ? published_components.first : published_components,
-          **model.settings.to_h, see_all_path:
+          **model.settings.to_h, **extra_list_cell_options, see_all_path:
         )
       end
 
+      def extra_list_cell_options
+        {}
+      end
+
       def see_all_path; end
     end
   end

data/app/cells/decidim/report_button/already_reported_modal.erb

@@ -1,7 +1,7 @@
 <%= decidim_modal id: modal_id, class: "flag-modal" do %>
   <div data-dialog-container>
     <%= icon "flag-line" %>
-    <h2 tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_modal.title") %></h2>
+    <h2 id="dialog-title-<%= modal_id %>" tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_modal.title") %></h2>
     <div>
       <div class="form__wrapper flag-modal__form">
         <p class="flag-modal__form-description"><%= t("decidim.shared.flag_modal.already_reported") %></p>

data/app/cells/decidim/report_button/flag_modal.erb

@@ -2,7 +2,7 @@
   <%= decidim_form_for report_form, builder:, url: report_path, method: :post, html: { id: nil, data: { controller: "report-form" } } do |f| %>
     <div data-dialog-container>
       <%= icon "flag-line" %>
-      <h2 tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_modal.title") %></h2>
+      <h2 id="dialog-title-<%= modal_id %>" tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_modal.title") %></h2>
       <div>
         <div class="form__wrapper flag-modal__form">
           <p id="dialog-desc-<%= modal_id %>" class="flag-modal__form-description"><%= t("decidim.shared.flag_modal.description") %></p>

data/app/cells/decidim/report_user_button/already_reported_modal.erb

@@ -1,7 +1,7 @@
 <%= decidim_modal id: modal_id, class: "flag-user-modal" do %>
   <div data-dialog-container>
     <%= icon "flag-line" %>
-    <h2 tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_user_modal.title") %></h2>
+    <h2 id="dialog-title-<%= modal_id %>" tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_user_modal.title") %></h2>
     <div>
       <div class="form__wrapper flag-modal__form">
         <p class="flag-modal__form-description"><%= t("decidim.shared.flag_user_modal.already_reported") %></p>

data/app/cells/decidim/report_user_button/flag_modal.erb

@@ -2,7 +2,7 @@
   <%= decidim_form_for report_form, builder:, url: report_path, method: :post, html: { id: nil, data: { controller: "report-form" } } do |f| %>
     <div data-dialog-container>
       <%= icon "flag-line" %>
-      <h2 tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_user_modal.title") %></h2>
+      <h2 id="dialog-title-<%= modal_id %>" tabindex="-1" data-dialog-title><%= t("decidim.shared.flag_user_modal.title") %></h2>
       <div>
         <div class="form__wrapper flag-modal__form">
           <p class="flag-modal__form-description"><%= t("decidim.shared.flag_user_modal.description") %></p>

data/app/cells/decidim/share_text_widget/modal.erb

@@ -1,6 +1,6 @@
 <%= decidim_modal id: "socialShare", class: "share-modal" do %>
   <div data-dialog-container>
-    <h2 tabindex="-1" data-dialog-title><%= t("share", scope: "decidim.shared.share_modal") %></h2>
+    <h2 id="dialog-title-socialShare" tabindex="-1" data-dialog-title><%= t("share", scope: "decidim.shared.share_modal") %></h2>
 
     <div>
 

data/app/cells/decidim/upload_modal/files.erb

@@ -42,7 +42,11 @@
             <% end %>
           <% end %>
           <% if attachment_blob.present? %>
-            <%= form.hidden_field attribute, value: attachment_blob.signed_id, id: "hidden_#{attribute}_#{attachment_blob.id}" %>
+            <% if is_persisted_attachment %>
+              <%= form.hidden_field attribute, value: attachment.id, id: "hidden_#{attribute}_#{attachment.id}" %>
+            <% else %>
+              <%= form.hidden_field attribute, value: attachment_blob.signed_id, id: "hidden_#{attribute}_#{attachment_blob.id}" %>
+            <% end %>
           <% end %>
         </div>
       <% end %>

data/app/cells/decidim/upload_modal_cell.rb

@@ -128,7 +128,16 @@ module Decidim
       @attachments = begin
         attachments = options[:attachments] || form.object.send(attribute)
         attachments = Array(attachments).compact_blank
-        attachments.map { |attachment| attachment.is_a?(String) ? ActiveStorage::Blob.find_signed(attachment) : attachment }
+        attachments.map do |attachment|
+          case attachment
+          when String
+            ActiveStorage::Blob.find_signed(attachment)
+          when Integer
+            Decidim::Attachment.find_by(id: attachment)
+          else
+            attachment
+          end
+        end.compact
       end
     end
 

data/app/commands/decidim/multiple_attachments_methods.rb

@@ -41,8 +41,9 @@ module Decidim
 
     def create_attachments(first_weight: 0)
       weight = first_weight
-      # Add the weights first to the old document
-      @form.documents.each do |document|
+      # Add the weights first to the old documents
+      document_ids = keep_ids
+      Decidim::Attachment.where(id: document_ids).each do |document|
         document.update!(weight:)
         weight += 1
       end
@@ -59,7 +60,7 @@ module Decidim
       documents = include_all_attachments ? documents_attached_to.attachments.with_attached_file : documents_attached_to.documents
 
       documents.each do |document|
-        document.destroy! if @form.documents.map(&:id).exclude? document.id
+        document.destroy! unless keep_ids.include?(document.id)
       end
 
       documents_attached_to.reload
@@ -98,5 +99,21 @@ module Decidim
     def blob(signed_id)
       ActiveStorage::Blob.find_signed(signed_id)
     end
+
+    def keep_ids
+      documents_array = Array(@form.documents)
+      documents_array.map do |doc|
+        case doc
+        when Decidim::Attachment
+          doc.id
+        when Integer
+          doc
+        when String
+          doc.match?(/\A\d+\z/) ? doc.to_i : nil
+        when Hash
+          (doc[:id] || doc["id"]).to_i
+        end
+      end.compact
+    end
   end
 end

data/app/jobs/decidim/find_and_update_descendants_job.rb

@@ -4,8 +4,14 @@ module Decidim
   # Update search indexes for each descendants of a given element
   class FindAndUpdateDescendantsJob < ApplicationJob
     queue_as :default
+    MAX_DEPTH = 5
+
+    def perform(element, current_depth = 0)
+      if current_depth >= MAX_DEPTH
+        Rails.logger.warn "Max depth of #{MAX_DEPTH} reached for element #{element.class.name} with id #{element.id}. Stopping recursion."
+        return
+      end
 
-    def perform(element)
       descendants_collector = components_for(element)
       descendants_collector << element.comments.to_a if element.respond_to?(:comments)
 
@@ -14,7 +20,7 @@ module Decidim
       descendants_collector.each do |descendants|
         next if descendants.blank?
 
-        Decidim::UpdateSearchIndexesJob.perform_later(descendants)
+        Decidim::UpdateSearchIndexesJob.perform_later(descendants, current_depth + 1)
       end
     end
 

data/app/jobs/decidim/update_search_indexes_job.rb

@@ -4,8 +4,8 @@ module Decidim
   class UpdateSearchIndexesJob < ApplicationJob
     queue_as :default
 
-    def perform(elements)
-      elements.each { |element| element.try(:try_update_index_for_search_resource) }
+    def perform(elements, current_depth = 0)
+      elements.each { |element| element.try(:try_update_index_for_search_resource, current_depth) }
     end
   end
 end

data/app/packs/src/decidim/a11y.js

@@ -8,6 +8,13 @@ import Dialogs from "a11y-dialog-component";
  * @return {void}
  */
 const createDialog = (component) => {
+  const getFocusableElements = (container) => {
+    const selectors = "a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex='-1'])";
+    return Array.from(container.querySelectorAll(selectors)).filter(
+      (el) => el.offsetParent !== null
+    );
+  };
+
   const {
     dataset: { dialog, ...attrs }
   } = component;
@@ -29,11 +36,33 @@ const createDialog = (component) => {
     backdropSelector: `[data-dialog="${dialog}"]`,
     enableAutoFocus: false,
     onOpen: (params, trigger) => {
+      const keyHandler = (event) => {
+        if (event.key !== "Tab") {
+          return;
+        }
+        const focusable = getFocusableElements(params);
+        if (focusable.length === 0) {
+          return;
+        }
+        if (event.shiftKey && document.activeElement === focusable[0]) {
+          event.preventDefault();
+          focusable[focusable.length - 1].focus({ preventScroll: true });
+        } else if (!event.shiftKey && document.activeElement === focusable[focusable.length - 1]) {
+          event.preventDefault();
+          focusable[0].focus({ preventScroll: true });
+        }
+      };
+      params._focusTrapHandler = keyHandler;
+      params.addEventListener("keydown", keyHandler);
       setFocusOnTitle(params);
       window.focusGuard.trap(params, trigger);
       params.dispatchEvent(new CustomEvent("open.dialog"));
     },
     onClose: (params) => {
+      if (params._focusTrapHandler) {
+        params.removeEventListener("keydown", params._focusTrapHandler);
+        Reflect.deleteProperty(params, "_focusTrapHandler");
+      }
       window.focusGuard.disable();
       params.dispatchEvent(new CustomEvent("close.dialog"));
     },

data/app/packs/src/decidim/a11y.test.js

@@ -0,0 +1,81 @@
+/* global jest */
+
+import { createDialog } from "src/decidim/a11y"
+
+describe("a11y dialog focus trap", () => {
+  const dialogHtml = `
+    <button id="open-btn" data-dialog-open="testDialog">Open</button>
+    <div id="test-dialog" data-dialog="testDialog">
+      <div data-dialog-container>
+        <h2 id="dialog-title-testDialog" tabindex="-1" data-dialog-title>Test Dialog</h2>
+        <a href="#">Link 1</a>
+        <button>Button 1</button>
+        <input type="text" />
+        <button>Button 2</button>
+        <a href="#">Link 2</a>
+      </div>
+      <div data-dialog-actions>
+        <button data-dialog-close="testDialog">Close</button>
+      </div>
+    </div>
+  `;
+
+  beforeEach(() => {
+    document.body.innerHTML = dialogHtml;
+    window.Decidim = {
+      currentDialogs: {}
+    };
+    window.focusGuard = {
+      trap: jest.fn(),
+      disable: jest.fn()
+    };
+  });
+
+  describe("keydown handler", () => {
+    let dialogEl = null;
+
+    beforeEach(() => {
+      const component = document.querySelector("[data-dialog]");
+      createDialog(component);
+      dialogEl = document.querySelector("[data-dialog='testDialog']");
+      // Get the dialog from Decidim.currentDialogs and open it
+      const dialog = window.Decidim.currentDialogs.testDialog;
+      dialog.open();
+    });
+
+    it("adds keydown handler on open", () => {
+      expect(dialogEl._focusTrapHandler).toBeDefined();
+    });
+
+    it("handles Tab key", () => {
+      const selectors = "a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex='-1'])";
+      const tabbableElements = Array.from(dialogEl.querySelectorAll(selectors)).filter(
+        (el) => el.offsetParent || el.offsetParent === null
+      );
+      tabbableElements[tabbableElements.length - 1].focus();
+
+      const event = new KeyboardEvent("keydown", { key: "Tab", bubbles: true });
+      const preventDefault = jest.fn();
+      event.preventDefault = preventDefault;
+
+      dialogEl.dispatchEvent(event);
+
+      expect(preventDefault).toHaveBeenCalled();
+    });
+  });
+
+  describe("onClose cleanup", () => {
+    it("removes the keydown handler on close", () => {
+      const component = document.querySelector("[data-dialog]");
+      createDialog(component);
+      const dialogEl = document.querySelector("[data-dialog='testDialog']");
+
+      const dialog = window.Decidim.currentDialogs.testDialog;
+      dialog.open();
+      expect(dialogEl._focusTrapHandler).toBeDefined();
+
+      dialog.close();
+      expect(dialogEl._focusTrapHandler).toBeUndefined();
+    });
+  });
+});

data/app/packs/src/decidim/confirm.js

@@ -169,7 +169,9 @@ export const initializeConfirm = () => {
     return handleDocumentEvent(ev, [
       Rails.linkClickSelector,
       Rails.buttonClickSelector,
-      Rails.formInputClickSelector
+      Rails.formInputClickSelector,
+      'button[data-confirm][type="button"]',
+      "form button[data-confirm]"
     ]);
   });
   document.addEventListener("change", (ev) => {
@@ -187,6 +189,11 @@ export const initializeConfirm = () => {
     $(Rails.formInputClickSelector).on("click.confirm", (ev) => {
       handleConfirm(ev, getMatchingEventTarget(ev, Rails.formInputClickSelector));
     });
+
+    // Handle button[type="button"] with data-confirm inside forms
+    $('button[data-confirm][type="button"]').on("click.confirm", (ev) => {
+      handleConfirm(ev, ev.currentTarget);
+    });
   });
 };
 

data/app/packs/src/decidim/confirm.test.js

@@ -0,0 +1,225 @@
+/* global jest */
+
+jest.mock("src/decidim/refactor/moved/icon", () => () => "<svg></svg>");
+
+describe("Confirm dialog for button[type='button']", () => {
+  let mockRails = null;
+  let mockDecidim = null;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    document.body.innerHTML = `
+      <div id="confirm-modal" style="display: none;">
+        <div data-dialog-title></div>
+        <div class="confirm-modal-icon"></div>
+        <div data-confirm-modal-content></div>
+        <button data-confirm-ok>Confirm</button>
+        <button data-confirm-cancel>Cancel</button>
+      </div>
+    `;
+
+    mockRails = {
+      linkClickSelector: "a[data-confirm]",
+      buttonClickSelector: "button[data-confirm]:not([form])",
+      formInputClickSelector: 'form button[type="submit"], form button:not([type])',
+      inputChangeSelector: "input[data-confirm], select[data-confirm]",
+      formSubmitSelector: "form[data-confirm]",
+      stopEverything: jest.fn(),
+      fire: jest.fn((el, event) => {
+        const evt = new CustomEvent(event);
+        el.dispatchEvent(evt);
+        return true;
+      }),
+      matches: function(element, selector) {
+        if (element instanceof Element) {
+          return element.matches(selector);
+        }
+        return false;
+      }
+    };
+
+    mockDecidim = {
+      currentDialogs: {
+        "confirm-modal": {
+          open: jest.fn(),
+          close: jest.fn()
+        }
+      }
+    };
+
+    window.Rails = mockRails;
+    window.Decidim = mockDecidim;
+  });
+
+  afterEach(() => {
+    document.body.innerHTML = "";
+  });
+
+  describe("selector matching for button[type='button'] with data-confirm", () => {
+    it("matches button[data-confirm][type='button'] selector", () => {
+      const button = document.createElement("button");
+      button.type = "button";
+      button.setAttribute("data-confirm", "Are you sure?");
+
+      expect(button.matches('button[data-confirm][type="button"]')).toBe(true);
+    });
+
+    it("matches form button[data-confirm] selector", () => {
+      const form = document.createElement("form");
+      const button = document.createElement("button");
+      button.setAttribute("data-confirm", "Are you sure?");
+      form.appendChild(button);
+
+      expect(button.matches("form button[data-confirm]")).toBe(true);
+    });
+
+    it("does not match regular button without data-confirm", () => {
+      const button = document.createElement("button");
+      button.type = "button";
+
+      expect(button.matches('button[data-confirm][type="button"]')).toBe(false);
+    });
+
+    it("does not match button[type='submit'] with the type='button' selector", () => {
+      const button = document.createElement("button");
+      button.type = "submit";
+      button.setAttribute("data-confirm", "Are you sure?");
+
+      expect(button.matches('button[data-confirm][type="button"]')).toBe(false);
+    });
+
+    it("matches button[type='button'] inside form", () => {
+      document.body.innerHTML = `
+        <form>
+          <button type="button" data-confirm="Test message">Click me</button>
+        </form>
+      `;
+
+      const button = document.querySelector('button[type="button"]');
+      expect(button.matches('button[data-confirm][type="button"]')).toBe(true);
+      expect(button.matches("form button[data-confirm]")).toBe(true);
+    });
+
+    it("does not match button[type='button'] without data-confirm inside form", () => {
+      document.body.innerHTML = `
+        <form>
+          <button type="button">Click me</button>
+        </form>
+      `;
+
+      const button = document.querySelector('button[type="button"]');
+      expect(button.matches('button[data-confirm][type="button"]')).toBe(false);
+      expect(button.matches("form button[data-confirm]")).toBe(false);
+    });
+  });
+
+  describe("initializeConfirm - selectors registration", () => {
+    it("adds click event listener with proper selectors including button[type='button'] support", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      const addEventListenerSpy = jest.spyOn(document, "addEventListener");
+
+      initializeConfirm();
+
+      expect(addEventListenerSpy).toHaveBeenCalledWith("click", expect.any(Function));
+    });
+
+    it("adds change event listener for input change selector", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      const addEventListenerSpy = jest.spyOn(document, "addEventListener");
+
+      initializeConfirm();
+
+      const changeHandlerCalls = addEventListenerSpy.mock.calls.filter(
+        (call) => call[0] === "change"
+      );
+      expect(changeHandlerCalls.length).toBeGreaterThan(0);
+    });
+
+    it("adds submit event listener for form submit selector", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      const addEventListenerSpy = jest.spyOn(document, "addEventListener");
+
+      initializeConfirm();
+
+      const submitHandlerCalls = addEventListenerSpy.mock.calls.filter(
+        (call) => call[0] === "submit"
+      );
+      expect(submitHandlerCalls.length).toBeGreaterThan(0);
+    });
+
+    it("adds turbo:load event listener for Foundation Abide compatibility", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      const addEventListenerSpy = jest.spyOn(document, "addEventListener");
+
+      initializeConfirm();
+
+      const turboLoadCalls = addEventListenerSpy.mock.calls.filter(
+        (call) => call[0] === "turbo:load"
+      );
+      expect(turboLoadCalls.length).toBeGreaterThan(0);
+    });
+  });
+
+  describe("handleDocumentEvent with button[type='button'] support", () => {
+    it("handles click on button[type='button'] with data-confirm and form attribute", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      document.body.innerHTML = `
+        <form id="my-form">
+          <button type="button" form="my-form" data-confirm="Are you sure?">Click me</button>
+        </form>
+      `;
+
+      const button = document.querySelector('button[type="button"]');
+      const openSpy = jest.spyOn(mockDecidim.currentDialogs["confirm-modal"], "open");
+
+      initializeConfirm();
+
+      button.click();
+
+      expect(openSpy).toHaveBeenCalled();
+    });
+
+    it("handles click on button[type='button'] with data-confirm outside form", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      document.body.innerHTML = `
+        <button type="button" data-confirm="Are you sure?">Click me</button>
+      `;
+
+      const button = document.querySelector('button[type="button"]');
+      const openSpy = jest.spyOn(mockDecidim.currentDialogs["confirm-modal"], "open");
+
+      initializeConfirm();
+
+      button.click();
+
+      expect(openSpy).toHaveBeenCalled();
+    });
+
+    it("does not trigger confirm for button without data-confirm attribute", async () => {
+      const { initializeConfirm } = await import("src/decidim/confirm.js");
+
+      document.body.innerHTML = `
+        <form>
+          <button type="button">Click me</button>
+        </form>
+      `;
+
+      const button = document.querySelector('button[type="button"]');
+      const openSpy = jest.spyOn(mockDecidim.currentDialogs["confirm-modal"], "open");
+
+      initializeConfirm();
+
+      button.click();
+
+      expect(openSpy).not.toHaveBeenCalled();
+    });
+  });
+});
+
+/* dummy end */

data/app/packs/src/decidim/controllers/language_change/controller.js

@@ -10,6 +10,7 @@ export default class extends Controller {
   connect() {
     this.handleChange = this.handleChange.bind(this);
     this.element.addEventListener("change", this.handleChange);
+    this.element.dispatchEvent(new Event("change"));
   }
 
   disconnect() {

data/app/packs/src/decidim/controllers/language_change/language_change.test.js

@@ -72,6 +72,19 @@ describe("LanguageChangeController", () => {
       expect(removeSpy).toHaveBeenCalledWith("change", controller.handleChange);
       removeSpy.mockRestore();
     });
+
+    it("activates the selected option's panel on connect", () => {
+      const options = selectElement.querySelectorAll("option");
+      options[1].selected = true;
+
+      controller.disconnect();
+      controller.connect();
+
+      expect(panel0.classList.contains("is-active")).toBe(false);
+      expect(panel0.ariaHidden).toBe("true");
+      expect(panel1.classList.contains("is-active")).toBe(true);
+      expect(panel1.ariaHidden).toBe("false");
+    });
   });
 
   describe("handleChange", () => {

data/app/packs/src/decidim/datepicker/datepicker_functions.js

@@ -1,5 +1,31 @@
 // Utility helper functions for the date and time picker functionality
 
+export const adjustPickerPosition = (input, datePickerContainer, selector) => {
+  const parent = input.closest(selector);
+
+  if (getComputedStyle(parent).position === "static") {
+    parent.style.position = "relative";
+  }
+
+  const rect = input.getBoundingClientRect();
+  const calendarHeight = datePickerContainer.offsetHeight;
+  const spaceAbove = rect.top;
+  const spaceBelow = window.innerHeight - rect.bottom;
+  const openBelow = spaceBelow >= calendarHeight || spaceBelow >= spaceAbove;
+
+  if (openBelow) {
+    // Open below
+    datePickerContainer.style.top = `${input.offsetHeight}px`;
+    datePickerContainer.style.bottom = "";
+  } else {
+    // Open above
+    datePickerContainer.style.top = "";
+    datePickerContainer.style.bottom = `${input.offsetHeight}px`;
+  }
+
+  datePickerContainer.style.right = "0px";
+};
+
 export const setHour = (value, format) => {
   const hour = value.split(":")[0];
   if (format === 12) {

data/app/packs/src/decidim/datepicker/generate_datepicker.js

@@ -1,6 +1,6 @@
 /* eslint-disable require-jsdoc */
 import icon from "src/decidim/refactor/moved/icon"
-import { dateToPicker, formatDate, displayDate, formatTime, calculateDatepickerPos } from "src/decidim/datepicker/datepicker_functions"
+import { dateToPicker, formatDate, displayDate, formatTime, calculateDatepickerPos, adjustPickerPosition } from "src/decidim/datepicker/datepicker_functions"
 import { dateKeyDownListener, dateBeforeInputListener } from "src/decidim/datepicker/datepicker_listeners"
 import { getDictionary } from "src/decidim/refactor/moved/i18n"
 
@@ -136,6 +136,7 @@ export default function generateDatePicker(input, row, formats) {
     };
     pickedDate = null;
     datePickerContainer.style.display = "block";
+    adjustPickerPosition(date, datePickerContainer, ".datepicker__date-column");
 
     document.addEventListener("click", datePickerDisplay);