From a335b51932ddbe1901de1d3ac3128f43628a891b Mon Sep 17 00:00:00 2001
From: cosmo <cptncosmo@gmail.com>
Date: Sun, 26 Apr 2026 19:16:38 +0200
Subject: [PATCH] feat: add item icons to data schema and update picker UI to
 display them

---
 scripts/ikonis-data.js  | 1 +
 scripts/ikonis-sheet.js | 5 +++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/scripts/ikonis-data.js b/scripts/ikonis-data.js
index 29cf4e5..37e6d3e 100644
--- a/scripts/ikonis-data.js
+++ b/scripts/ikonis-data.js
@@ -39,6 +39,7 @@ export function getAugments() {
                 id: id,
                 name: name.replace("Ikonis:", "").trim(),
                 fullName: name,
+                img: feature.img || "systems/daggerheart/assets/icons/documents/items/chip.svg",
                 effect: effectLine || "Native Feature",
                 cost: costLine || ""
             });
diff --git a/scripts/ikonis-sheet.js b/scripts/ikonis-sheet.js
index e5e6ce7..1c96395 100644
--- a/scripts/ikonis-sheet.js
+++ b/scripts/ikonis-sheet.js
@@ -135,11 +135,12 @@ export function patchIkonisSheet() {
                 </div>
                 <div class="picker-list" style="flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 0.75rem;">
                     ${available.map(a => `
-                        <div class="picker-item" data-id="${a.id}" style="border: 2px solid #2d3436; background: #1a1a2e; padding: 1rem; border-radius: 8px; cursor: pointer;">
+                        <div class="picker-item" data-id="${a.id}" style="border: 2px solid #2d3436; background: #1a1a2e; padding: 1rem; border-radius: 8px; cursor: pointer; display: flex; align-items: center; gap: 1rem;">
+                            <img src="${a.img}" style="width: 40px; height: 40px; border: none; filter: drop-shadow(0 0 5px rgba(255,255,255,0.1));">
                             <div class="augment-info">
                                 <strong class="aug-name" style="display: block; font-size: 1.1rem; color: #ffffff;">${a.name}</strong>
                                 <span style="display: block; margin: 2px 0; font-size: 0.9rem; color: #d1d8e0;">${a.effect}</span>
-                                <small style="display: block; color: #888; font-style: italic;">Cost: ${a.cost}</small>
+                                <small style="display: block; color: #888; font-style: italic;">${a.cost}</small>
                             </div>
                         </div>
                     `).join('')}