Merge branch 'dev'

Author: pavlicekdominik

components/editor-form.html

@@ -69,6 +69,7 @@ <h2>Item Properties</h2>
         <div class="form-group full-width">
           <label for="tags">Tags</label>
           <input type="text" class="tag-input" id="tagInput" placeholder="Type to add tags...">
+          <div id="tagSuggestions" class="tag-suggestions hidden"></div>
           <div class="tags-container" id="tagsContainer">
           </div>
           <small class="help-text">Use tags for categorization, filtering, and gameplay logic</small>
@@ -209,9 +210,26 @@ <h2>Visual Assets</h2>
           <input type="file" id="meshPath" name="meshPath" accept=".fbx,.obj" />
           <small class="file-info">Accepted formats: FBX, OBJ</small>
         </div>
-        <div class="form-group">
-          <label for="materialPath">Material Path</label>
-          <input type="text" id="materialPath" name="materialPath" placeholder="/Game/Materials/..." />
+      </div>
+    </section>
+
+    <!-- Materials -->
+    <section class="form-section">
+      <h2>Materials</h2>
+      <div class="form-grid">
+        <div class="form-group full-width">
+          <label>Materials</label>
+          <div class="materials-header">
+            <button type="button" id="addMaterial" class="btn btn-secondary">
+              Add Material
+            </button>
+            <small class="help-text">
+              Define materials used by this item. Paths will auto-generate as "/Game/Materials/{MaterialName}"
+            </small>
+          </div>
+          <div id="materialsContainer" class="materials-container">
+            <!-- Material rows will be dynamically added here -->
+          </div>
         </div>
       </div>
     </section>

script/core/InventoryEditor.js

@@ -18,6 +18,7 @@ export class InventoryEditor {
         this.componentLoader = new ComponentLoader();
         this.currentTemplate = null;
         this.customPropCounter = 0;
+        this.materialCounter = 0;
         this.selectedTemplates = new Set();
         this.componentsLoaded = false;
         this.selectedTags = [];
@@ -53,6 +54,10 @@ export class InventoryEditor {
                 'Combat', 'Magic', 'Healing', 'Buff', 'Debuff', 'Craftable',
                 'Fire', 'Ice', 'Lightning', 'Earth', 'Water', 'Air',
                 'Melee', 'Ranged', 'Defense', 'Attack', 'Speed', 'Strength'
+            ],
+            materialPresets: [
+                'BaseMaterial', 'MetallicMaterial', 'EmissiveMaterial', 
+                'GlassMaterial', 'FabricMaterial', 'WoodMaterial'
             ]
         };
 
@@ -162,6 +167,7 @@ export class InventoryEditor {
             if (settings.rarities) this.settings.rarities = settings.rarities;
             if (settings.equipmentSlots) this.settings.equipmentSlots = settings.equipmentSlots;
             if (settings.tagSuggestions) this.settings.tagSuggestions = settings.tagSuggestions;
+            if (settings.materialPresets) this.settings.materialPresets = settings.materialPresets;
         } catch (error) {
             console.error('Failed to load settings:', error);
         }
@@ -207,6 +213,7 @@ export class InventoryEditor {
         addListener('deleteSelected', 'click', () => this.deleteSelectedTemplates());
 
         addListener('addCustomProp', 'click', () => this.ui.addCustomProperty());
+        addListener('addMaterial', 'click', () => this.form.addMaterialRow());
 
         addListener('isEquippable', 'change', (e) => {
             const equipmentSection = document.getElementById('equipmentSection');