From e47b2fd6e1d119679810c9a0af578aeb05c7d66f Mon Sep 17 00:00:00 2001
From: irof <irof.ocean@gmail.com>
Date: Sun, 8 Feb 2026 02:13:14 +0900
Subject: [PATCH] =?UTF-8?q?=E6=8E=A8=E7=A7=BB=E7=B0=A1=E7=B4=84=E3=81=AE?=
 =?UTF-8?q?=E8=A1=A8=E7=A4=BA=E3=82=92HTML=E3=81=AB=E7=A7=BB=E5=8B=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/templates/assets/package.js     | 19 +++----------------
 .../src/main/resources/templates/package.html |  7 +++++++
 2 files changed, 10 insertions(+), 16 deletions(-)

diff --git a/jig-core/src/main/resources/templates/assets/package.js b/jig-core/src/main/resources/templates/assets/package.js
index fce738b23..3ee31da21 100644
--- a/jig-core/src/main/resources/templates/assets/package.js
+++ b/jig-core/src/main/resources/templates/assets/package.js
@@ -29,6 +29,7 @@ const dom = {
     getClearRelatedFilterButton: () => document.getElementById('clear-related-filter'),
     getDiagramDirectionRadios: () => document.querySelectorAll('input[name="diagram-direction"]'),
     getDiagramDirectionRadio: () => document.querySelector('input[name="diagram-direction"]'),
+    getTransitiveReductionToggle: () => document.getElementById('transitive-reduction-toggle'),
     getMutualDependencyList: () => document.getElementById('mutual-dependency-list'),
     getDiagram: () => document.getElementById('package-relation-diagram'),
     getDocumentBody: () => document.body,
@@ -1155,27 +1156,13 @@ function setupDiagramDirectionControl(context) {
 }
 
 function setupTransitiveReductionControl(context) {
-    const container = dom.getDiagramDirectionRadio()?.parentNode?.parentNode;
-    if (!container) return;
-
-    const controlContainer = document.createElement('div');
-    const checkbox = document.createElement('input');
-    checkbox.type = 'checkbox';
-    checkbox.id = 'transitive-reduction-toggle';
+    const checkbox = dom.getTransitiveReductionToggle();
+    if (!checkbox) return;
     checkbox.checked = context.transitiveReductionEnabled;
     checkbox.addEventListener('change', () => {
         context.transitiveReductionEnabled = checkbox.checked;
         renderDiagramAndTable(context);
     });
-
-    const label = document.createElement('label');
-    label.htmlFor = checkbox.id;
-    label.textContent = '推移簡約';
-    label.style.marginLeft = '4px';
-
-    controlContainer.appendChild(checkbox);
-    controlContainer.appendChild(label);
-    container.appendChild(controlContainer);
 }
 
 // 初期化
diff --git a/jig-core/src/main/resources/templates/package.html b/jig-core/src/main/resources/templates/package.html
index 421d0723f..3b84be2e1 100644
--- a/jig-core/src/main/resources/templates/package.html
+++ b/jig-core/src/main/resources/templates/package.html
@@ -64,6 +64,13 @@ <h1>パッケージ概要</h1>
                 横
             </label>
         </div>
+        <div class="control-row">
+            <label class="control-label" for="transitive-reduction-toggle">推移簡約:</label>
+            <label class="radio-label">
+                <input type="checkbox" id="transitive-reduction-toggle" checked>
+                有効
+            </label>
+        </div>
     </details>
 
     <pre id="package-relation-diagram" class="mermaid"></pre>