rails_modal_manager 1.0.12 → 1.0.14

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e3731afb3a3d006cd6256e0e19780bb24e433153ca2f459807137ef52e0cfaf7
-  data.tar.gz: 6acd94d81d76b5490185a8675b8ddacd3a2759fe5f039f765ed23e31f17d4020
+  metadata.gz: b5a9a0c23b9c295ce794dca604668be79268eab2b0ef9aa3a72bce9f31642d37
+  data.tar.gz: f341afe4a3bcf1661a80a60fbbd8ad2c34b187f6fe15d04df16c57f9273bafdc
 SHA512:
-  metadata.gz: e81f5871bc33494bd283ac5adb41ca84571bfb9e3f9a23597e8a1b37ab1dfd62cd4033958030d2aaca80becc305593a68a0762d92d3d88c394d3ae80b693e22d
-  data.tar.gz: d87f1982e1dd5cb3df4c50f3ceea6a9fe1605ea789711528a89e942de5533d25fbdb8673d55a2d4b2e06ebc3305d9aeed27f58307c285887135f20bb873dd1ea
+  metadata.gz: 4213097d0638e6e1656a3bab74608e7ab6adcc1aa521532fefbb0fc74e8d248d0e6a5a672f60f9d7a1b0a7a3dd345acdf6f5112ec74ea8a7a97fc3762cc8f913
+  data.tar.gz: 5c9bd6533b30f62eae37e28d6ae6532ed7942f74cb45d8d62db8dc6d31c35797322fb83db2e9c258599ef0b78c8ee16f565ae827bc2080a329019719c2a30e56

data/app/assets/stylesheets/rails_modal_manager.css

@@ -1109,6 +1109,7 @@
   white-space: nowrap;
   cursor: pointer;
   transition: background-color 0.15s;
+  user-select: none;
 }
 
 .rmm-taskbar-item:hover {

data/app/javascript/rails_modal_manager/controllers/rmm_modal_controller.js

@@ -147,6 +147,9 @@ export default class extends Controller {
     // Register close callback
     modalStore.registerCloseCallback(modalId, () => this.close('programmatic'))
 
+    // Move to persistent container (outside Turbo Frame) to survive navigation
+    this.moveToChildModalsContainer()
+
     // Add to history stack
     if (this.enableHistoryStackValue && !historyStackManager.hasHisData('modal', modalId)) {
       historyStackManager.addHisData('modal', modalId, () => this.close('history'))
@@ -499,6 +502,10 @@ export default class extends Controller {
     if (!config || config.isMaximized) return
 
     modalStore.bringToFront(this.effectiveModalId)
+    // 히스토리 스택 순서도 동기화
+    if (this.enableHistoryStackValue) {
+      historyStackManager.moveToTop('modal', this.effectiveModalId)
+    }
     this.isDragging = true
 
     const clientX = e.type.includes('touch') ? e.touches[0].clientX : e.clientX
@@ -562,6 +569,10 @@ export default class extends Controller {
     if (!config || config.isMaximized) return
 
     modalStore.bringToFront(this.effectiveModalId)
+    // 히스토리 스택 순서도 동기화
+    if (this.enableHistoryStackValue) {
+      historyStackManager.moveToTop('modal', this.effectiveModalId)
+    }
     this.isResizing = true
     this.resizeDirection = direction
 
@@ -682,9 +693,48 @@ export default class extends Controller {
       historyStackManager.removeMultipleHisData('modal', allModalIds)
     }
 
+    // Move modal DOM to persistent container (outside Turbo Frame)
+    // This ensures minimized modals survive Turbo Frame navigation
+    this.moveToChildModalsContainer()
+
     this.dispatch('minimize', { detail: { modalId: modalId } })
   }
 
+  /**
+   * Move modal (with wrapper if exists) to #child-modals-container
+   * This prevents DOM removal when Turbo Frame content is replaced
+   */
+  moveToChildModalsContainer() {
+    const container = document.getElementById('child-modals-container')
+    if (!container) return
+
+    const overlay = this.getOverlay()
+    const parent = this.element.parentElement
+
+    // Determine what to move: wrapper (if exists) or just modal
+    let elementToMove = this.element
+
+    // Check if parent is a wrapper (has data-controller and is not body/frame/container)
+    if (parent &&
+        parent.dataset.controller &&
+        parent.id !== 'child-modals-container' &&
+        parent.tagName !== 'TURBO-FRAME' &&
+        parent.tagName !== 'BODY') {
+      elementToMove = parent
+    }
+
+    // Skip if already in container
+    if (elementToMove.parentElement === container) return
+
+    // If overlay is outside the element to move, move it first
+    if (overlay && !elementToMove.contains(overlay) && overlay.parentElement !== container) {
+      container.appendChild(overlay)
+    }
+
+    // Move the element (modal or wrapper including overlay)
+    container.appendChild(elementToMove)
+  }
+
   maximize() {
     const modalId = this.effectiveModalId
     const config = modalStore.getModalConfig(modalId)
@@ -756,6 +806,10 @@ export default class extends Controller {
 
   handleClick() {
     modalStore.bringToFront(this.effectiveModalId)
+    // 히스토리 스택 순서도 동기화 (뒤로가기 시 현재 최상위 모달이 닫히도록)
+    if (this.enableHistoryStackValue) {
+      historyStackManager.moveToTop('modal', this.effectiveModalId)
+    }
   }
 
   // ============================================
@@ -777,7 +831,18 @@ export default class extends Controller {
   // ============================================
 
   getOverlay() {
-    return document.getElementById(`${this.effectiveModalId}-overlay`)
+    const overlayId = `${this.effectiveModalId}-overlay`
+
+    // If this modal is inside child-modals-container, search there first
+    // This prevents finding duplicate overlays in turbo-frame
+    const container = document.getElementById('child-modals-container')
+    if (container && container.contains(this.element)) {
+      const overlayInContainer = container.querySelector(`#${overlayId}`)
+      if (overlayInContainer) return overlayInContainer
+    }
+
+    // Fallback to document-level search
+    return document.getElementById(overlayId)
   }
 
   hasAttribute(attr) {

data/app/javascript/rails_modal_manager/controllers/rmm_sidebar_controller.js

@@ -31,6 +31,11 @@ export default class extends Controller {
   connect() {
     this.currentItemId = null
 
+    // 모바일 사이즈(768px 미만)에서는 기본적으로 사이드바를 닫힌 상태로 시작
+    if (window.innerWidth < 768) {
+      this.collapsedValue = true
+    }
+
     if (this.collapsedValue) {
       this.element.classList.add('rmm-sidebar-collapsed')
     }

data/app/javascript/rails_modal_manager/history_stack_manager.js

@@ -285,6 +285,37 @@ function hasHisData(type, id) {
   return hisData.some((item) => item.type === type && item.id === id);
 }
 
+/**
+ * Move specific item to the top of the history stack
+ * - Used when a modal is brought to front (clicked/focused)
+ * - Does not affect browser history, only reorders the internal stack
+ *
+ * @param {string} type - Target type
+ * @param {string} id - Target's unique ID
+ * @returns {boolean} Whether move was successful
+ */
+function moveToTop(type, id) {
+  if (typeof window === 'undefined') return false;
+  if (!isEnabledForDevice(type)) return false;
+
+  const hisData = loadHisData();
+  const index = hisData.findIndex(
+    (item) => item.type === type && item.id === id
+  );
+
+  if (index === -1) return false;
+
+  // Already at top
+  if (index === hisData.length - 1) return true;
+
+  // Remove item from current position and add to end
+  const [item] = hisData.splice(index, 1);
+  hisData.push(item);
+  saveHisData(hisData);
+
+  return true;
+}
+
 /**
  * Return current stack size
  * @returns {number} Stack size
@@ -362,6 +393,7 @@ const historyStackManager = {
   removeMultipleHisData,
   silentRemoveHisData,
   popHisData,
+  moveToTop,
 
   // Utilities
   hasHisData,

data/lib/rails_modal_manager/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module RailsModalManager
-  VERSION = "1.0.12"
+  VERSION = "1.0.14"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: rails_modal_manager
 version: !ruby/object:Gem::Version
-  version: 1.0.12
+  version: 1.0.14
 platform: ruby
 authors:
 - reshacs