feat: enable sorting items by clicking on item list headers

src/lang/de.json

@@ -21,21 +21,28 @@
     "DS4.HeadingDescription": "Beschreibung",
     "DS4.AttackType": "Angriffsart",
     "DS4.AttackTypeAbbr": "AA",
+    "DS4.SortByAttackType": "Nach Angriffsart sortieren",
     "DS4.DialogAttackTypeSelection": "Welche Angriffsart?",
     "DS4.DialogAttributeTraitSelection": "Welches Attribut und welche Eigenschaft?",
     "DS4.WeaponBonus": "Waffenbonus",
     "DS4.WeaponBonusAbbr": "WB",
+    "DS4.SortByWeaponBonus": "Nach Waffenbonus sortieren",
     "DS4.OpponentDefense": "Gegnerabwehr",
     "DS4.OpponentDefenseAbbr": "GA",
+    "DS4.SortByOpponentDefense": "Nach Gegnerabwehr sortieren",
     "DS4.AttackTypeMelee": "Schlagen",
     "DS4.AttackTypeRanged": "Schießen",
     "DS4.AttackTypeMeleeRanged": "Schlagen + Schießen",
     "DS4.Description": "Beschreibung",
+    "DS4.SortByDescription": "Nach Beschreibung sortieren",
     "DS4.Quantity": "Menge",
+    "DS4.SortByQuantity": "Nach Menge sortieren",
     "DS4.PriceGold": "Preis (Gold)",
     "DS4.StorageLocation": "Wo gelagert",
+    "DS4.SortByStorageLocation": "Nach Lagerungsort sortieren",
     "DS4.ItemEquipped": "Ausgerüstet",
     "DS4.ItemEquippedAbbr": "A",
+    "DS4.SortByItemEquipped": "Nach Ausgerüstet sortieren",
     "DS4.ItemOwner": "Besitzer",
     "DS4.ItemAvailability": "Verfügbarkeit",
     "DS4.ItemAvailabilityHamlet": "Dorf",
@@ -46,6 +53,7 @@
     "DS4.ItemAvailabilityUnset": "nicht gesetzt",
     "DS4.ItemAvailabilityNowhere": "nirgendwo",
     "DS4.ItemName": "Name",
+    "DS4.SortByItemName": "Nach Name sortieren",
     "DS4.ItemTypeWeapon": "Waffe",
     "DS4.ItemTypeWeaponPlural": "Waffen",
     "DS4.ItemTypeArmor": "Panzerung",
@@ -72,10 +80,13 @@
     "DS4.ItemSpellCheckFlavor": "{actor} wirkt {spell}.",
     "DS4.ArmorType": "Panzerungstyp",
     "DS4.ArmorTypeAbbr": "PAT",
+    "DS4.SortByArmorType": "Nach Panzerungstyp sortieren",
     "DS4.ArmorMaterialType": "Materialtyp",
     "DS4.ArmorMaterialTypeAbbr": "Mat.",
+    "DS4.SortByArmorMaterialType": "Nach Materialtyp sortieren",
     "DS4.ArmorValue": "Panzerungswert",
     "DS4.ArmorValueAbbr": "PA",
+    "DS4.SortByArmorValue": "Nach Panzerungswert sortieren",
     "DS4.ArmorTypeBody": "Körper",
     "DS4.ArmorTypeBodyAbbr": "Körper",
     "DS4.ArmorTypeHelmet": "Helm",
@@ -98,6 +109,7 @@
     "DS4.ArmorMaterialTypeNaturalAbbr": "Natürlich",
     "DS4.SpellType": "Zauberspruchtyp",
     "DS4.SpellTypeAbbr": "T",
+    "DS4.SortBySpellType": "Nach Zauberspruchtyp sortieren",
     "DS4.SpellTypeSpellcasting": "Zaubern",
     "DS4.SpellTypeTargetedSpellcasting": "Zielzaubern",
     "DS4.SpellCategory": "Kategorie",
@@ -112,6 +124,7 @@
     "DS4.SpellCategoryUnset": "Nicht gesetzt",
     "DS4.SpellBonus": "Zauberbonus",
     "DS4.SpellBonusAbbr": "ZB",
+    "DS4.SortBySpellBonus": "Nach Zauberbonus sortieren",
     "DS4.SpellMaxDistance": "Reichweite",
     "DS4.SpellEffectRadius": "Effektradius",
     "DS4.SpellDuration": "Wirkdauer",
@@ -177,6 +190,7 @@
     "DS4.CharacterSlayerPoints": "Slayerpunkte",
     "DS4.CharacterSlayerPointsAbbr": "SP",
     "DS4.TalentRank": "Rang",
+    "DS4.SortByTalentRank": "Nach Rang sortieren",
     "DS4.TalentRankBase": "Erworbener Rang",
     "DS4.TalentRankMax": "Maximaler Rang",
     "DS4.TalentRankMod": "Zusätzlicher Rang",

src/lang/en.json

@@ -21,21 +21,28 @@
     "DS4.HeadingDescription": "Description",
     "DS4.AttackType": "Attack Type",
     "DS4.AttackTypeAbbr": "AT",
+    "DS4.SortByAttackType": "Sort by Attack Type",
     "DS4.DialogAttackTypeSelection": "Which Attack Type?",
     "DS4.DialogAttributeTraitSelection": "Which Attribute and Trait?",
     "DS4.WeaponBonus": "Weapon Bonus",
     "DS4.WeaponBonusAbbr": "WB",
+    "DS4.SortByWeaponBonus": "Sort by Weapon Bonus",
     "DS4.OpponentDefense": "Opponent Defense",
     "DS4.OpponentDefenseAbbr": "OD",
+    "DS4.SortByOpponentDefense": "Sort by Opponent Defense",
     "DS4.AttackTypeMelee": "Melee",
     "DS4.AttackTypeRanged": "Ranged",
     "DS4.AttackTypeMeleeRanged": "Melee / Ranged",
     "DS4.Description": "Description",
+    "DS4.SortByDescription": "Sort by Description",
     "DS4.Quantity": "Quantity",
+    "DS4.SortByQuantity": "Sort by Quantity",
     "DS4.PriceGold": "Price (Gold)",
     "DS4.StorageLocation": "Stored at",
+    "DS4.SortByStorageLocation": "Sort by Storage Location",
     "DS4.ItemEquipped": "Equipped",
     "DS4.ItemEquippedAbbr": "E",
+    "DS4.SortByItemEquipped": "Sort by Equipped",
     "DS4.ItemOwner": "Owner",
     "DS4.ItemAvailability": "Availability",
     "DS4.ItemAvailabilityHamlet": "Hamlet",
@@ -46,6 +53,7 @@
     "DS4.ItemAvailabilityUnset": "Unset",
     "DS4.ItemAvailabilityNowhere": "Nowhere",
     "DS4.ItemName": "Name",
+    "DS4.SortByItemName": "Sort by Name",
     "DS4.ItemTypeWeapon": "Weapon",
     "DS4.ItemTypeWeaponPlural": "Weapons",
     "DS4.ItemTypeArmor": "Armor",
@@ -72,10 +80,13 @@
     "DS4.ItemSpellCheckFlavor": "{actor} casts {spell}.",
     "DS4.ArmorType": "Armor Type",
     "DS4.ArmorTypeAbbr": "AT",
+    "DS4.SortByArmorType": "Sort by Armor Type",
     "DS4.ArmorMaterialType": "Material Type",
     "DS4.ArmorMaterialTypeAbbr": "Mat.",
+    "DS4.SortByArmorMaterialType": "Sort by Material Type",
     "DS4.ArmorValue": "Armor Value",
     "DS4.ArmorValueAbbr": "AV",
+    "DS4.SortByArmorValue": "Sort by Armor Value",
     "DS4.ArmorTypeBody": "Body",
     "DS4.ArmorTypeBodyAbbr": "Body",
     "DS4.ArmorTypeHelmet": "Helmet",
@@ -98,6 +109,7 @@
     "DS4.ArmorMaterialTypeNaturalAbbr": "Natural",
     "DS4.SpellType": "Spell Type",
     "DS4.SpellTypeAbbr": "T",
+    "DS4.SortBySpellType": "Sort by Spell Type",
     "DS4.SpellTypeSpellcasting": "Spellcasting",
     "DS4.SpellTypeTargetedSpellcasting": "Targeted Spellcasting",
     "DS4.SpellCategory": "Category",
@@ -112,6 +124,7 @@
     "DS4.SpellCategoryUnset": "Unset",
     "DS4.SpellBonus": "Spell Bonus",
     "DS4.SpellBonusAbbr": "SB",
+    "DS4.SortBySpellBonus": "Sort by Spell Bonus",
     "DS4.SpellMaxDistance": "Range",
     "DS4.SpellEffectRadius": "Radius",
     "DS4.SpellDuration": "Duration",
@@ -177,6 +190,7 @@
     "DS4.CharacterSlayerPoints": "Slayer Points",
     "DS4.CharacterSlayerPointsAbbr": "SP",
     "DS4.TalentRank": "Rank",
+    "DS4.SortByTalentRank": "Sort by Rank",
     "DS4.TalentRankBase": "Acquired Ranks",
     "DS4.TalentRankMax": "Maximum Ranks",
     "DS4.TalentRankMod": "Additional Ranks",

src/module/actor/sheets/actor-sheet.ts

@@ -9,6 +9,7 @@ import { DS4ActiveEffect } from "../../active-effect";
 import { ModifiableDataBaseTotal } from "../../common/common-data";
 import { DS4 } from "../../config";
 import { getCanvas, getGame } from "../../helpers";
+import type { DS4Item } from "../../item/item";
 import { DS4Settings, getDS4Settings } from "../../settings";
 import notifications from "../../ui/notifications";
 import { enforce } from "../../utils";
@@ -108,6 +109,8 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Options, DS4ActorSheetD
 
         html.find(".rollable-item").on("click", this.onRollItem.bind(this));
         html.find(".rollable-check").on("click", this.onRollCheck.bind(this));
+
+        html.find(".sort-items").on("click", this.onSortItems.bind(this));
     }
 
     /**
@@ -257,9 +260,9 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Options, DS4ActorSheetD
         enforce(element instanceof HTMLInputElement);
         if (element.disabled) return;
 
-        const effectElement = element.closest(embeddedDocumentListEntryProperties[documentName].selector);
+        const documentElement = element.closest(embeddedDocumentListEntryProperties[documentName].selector);
-        enforce(effectElement instanceof HTMLElement);
+        enforce(documentElement instanceof HTMLElement);
-        const id = effectElement.dataset[embeddedDocumentListEntryProperties[documentName].idDataAttribute];
+        const id = documentElement.dataset[embeddedDocumentListEntryProperties[documentName].idDataAttribute];
         const property = element.dataset["property"];
         enforce(property !== undefined, TypeError("HTML element does not provide 'data-property' attribute"));
 
@@ -344,6 +347,49 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Options, DS4ActorSheetD
         event.dataTransfer?.setData("text/plain", JSON.stringify(dragData));
     }
 
+    /**
+     * Sort items according to the item list header that has been clicked.
+     * @param event - The originating click event
+     */
+    protected onSortItems(event: JQuery.ClickEvent<unknown, unknown, HTMLElement>): void {
+        event.preventDefault();
+        const target = event.currentTarget;
+        const type = target.parentElement?.dataset["type"];
+        enforce(type !== undefined, `Could not find property 'type' in the dataset of the parent of ${target}`);
+        const dataPath = target.dataset["dataPath"];
+        enforce(dataPath !== undefined, `Could not find property 'dataPath' in the dataset of ${target}`);
+        const items = this.actor.items.filter((item) => item.type === type);
+        items.sort((a, b) => a.data.sort - b.data.sort);
+
+        const sortFunction =
+            (invert: boolean) =>
+            (a: DS4Item, b: DS4Item): number => {
+                const propertyA = getProperty(a.data, dataPath);
+                const propertyB = getProperty(b.data, dataPath);
+                if (typeof propertyA === "string" || typeof propertyB === "string") {
+                    return invert
+                        ? (propertyB ?? "").localeCompare(propertyA ?? "")
+                        : (propertyA ?? "").localeCompare(propertyB ?? "");
+                } else {
+                    return invert ? propertyB - propertyA : propertyA - propertyB;
+                }
+            };
+
+        const sortedItems = [...items].sort(sortFunction(false));
+        const wasSortedAlready = !sortedItems.find((item, index) => item !== items[index]);
+
+        if (wasSortedAlready) {
+            sortedItems.sort(sortFunction(true));
+        }
+
+        const updates = sortedItems.map((item, i) => ({
+            _id: item.id,
+            sort: (i + 1) * CONST.SORT_INTEGER_DENSITY,
+        }));
+
+        this.actor.updateEmbeddedDocuments("Item", updates);
+    }
+
     /** @override */
     protected async _onDropItem(event: DragEvent, data: ActorSheet.DropData.Item): Promise<unknown> {
         const item = await Item.fromDropData(data);
@@ -362,7 +408,7 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Options, DS4ActorSheetD
     }
 }
 
-interface DS4ActorSheetData extends ActorSheet.Data<ActorSheet.Options> {
+interface DS4ActorSheetData extends ActorSheet.Data {
     config: typeof DS4;
     itemsByType: Record<string, foundry.data.ItemData[]>;
     enrichedEffects: EnrichedActiveEffectDataSource[];

src/scss/components/_embedded_document_list.scss

@@ -132,6 +132,10 @@
             text-overflow: ellipsis;
         }
     }
+
+    &__clickable {
+        cursor: pointer;
+    }
 }
 
 .ds4-embedded-document-list-title {

src/templates/sheets/actor/components/item-list-header.hbs

@@ -12,12 +12,15 @@ SPDX-License-Identifier: MIT
 !-- @param isEquipable: A flag to enable the equipped column.
 !-- @param hasQuantity: A flag to enable the quantity column.
 !-- @param hideDescription: A flag to disable the description column.
+!-- @param type: The type of the items in this table.
 !-- @param @partial-block: Custom column headers can be passed using the partial block.
 --}}
-<li class="ds4-embedded-document-list__row ds4-embedded-document-list__row--header">
+<li class="ds4-embedded-document-list__row ds4-embedded-document-list__row--header" data-type={{type}}>
     {{!-- equipped --}}
     {{#if isEquipable}}
-    <div title="{{localize 'DS4.ItemEquipped'}}">{{localize 'DS4.ItemEquippedAbbr'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.equipped"
+        title="{{localize 'DS4.SortByItemEquipped'}}">
+        {{localize 'DS4.ItemEquippedAbbr'}}</div>
     {{/if}}
 
     {{!-- image --}}
@@ -25,11 +28,14 @@ SPDX-License-Identifier: MIT
 
     {{!-- amount --}}
     {{#if hasQuantity}}
-    <div title="{{localize 'DS4.Quantity'}}">#</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.quantity"
+        title="{{localize 'DS4.SortByQuantity'}}">#</div>
     {{/if}}
 
     {{!-- name --}}
-    <div>{{localize 'DS4.ItemName'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="name"
+        title="{{localize 'DS4.SortByItemName'}}">{{localize 'DS4.ItemName'}}
+    </div>
 
     {{!-- item type specifics --}}
     {{#if @partial-block }}
@@ -38,7 +44,9 @@ SPDX-License-Identifier: MIT
 
     {{!-- description --}}
     {{#unless hideDescription}}
-    <div>{{localize 'DS4.Description'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.description"
+        title="{{localize 'DS4.SortByDescription'}}">{{localize
+        'DS4.Description'}}</div>
     {{/unless}}
 
     {{!-- control buttons placeholder --}}

src/templates/sheets/actor/components/items-overview.hbs

@@ -10,17 +10,23 @@ SPDX-License-Identifier: MIT
 <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeWeaponPlural'}}</h4>
 {{#unless (isEmpty itemsByType.weapon)}}
 <ol class="ds4-embedded-document-list ds4-embedded-document-list--weapon item-list">
-    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true}}
+    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true
+    type='weapon'}}
     {{!-- attack type --}}
-    <div class="ds4-embedded-document-list__image" title="{{localize 'DS4.AttackType'}}">{{localize 'DS4.AttackTypeAbbr'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.attackType"
+        title="{{localize 'DS4.SortByAttackType'}}">
+        {{localize
+        'DS4.AttackTypeAbbr'}}</div>
 
     {{!-- weapon bonus --}}
-    <div title="{{localize 'DS4.WeaponBonus'}}">
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.weaponBonus"
+        title="{{localize 'DS4.SortByWeaponBonus'}}">
         {{localize 'DS4.WeaponBonusAbbr'}}
     </div>
 
     {{!-- opponent defense --}}
-    <div title="{{localize 'DS4.OpponentDefense'}}">
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.opponentDefense"
+        title="{{localize 'DS4.SortByOpponentDefense'}}">
         {{localize 'DS4.OpponentDefenseAbbr'}}
     </div>
     {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
@@ -29,7 +35,8 @@ SPDX-License-Identifier: MIT
     {{#> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData isEquipable=true
     hasQuantity=true}}
     {{!-- attack type --}}
-    <img class="ds4-embedded-document-list__image" src="{{lookup ../../config.icons.attackTypes itemData.data.attackType}}"
+    <img class="ds4-embedded-document-list__image"
+        src="{{lookup ../../config.icons.attackTypes itemData.data.attackType}}"
         title="{{lookup ../../config.i18n.attackTypes itemData.data.attackType}}" />
 
     {{!-- weapon bonus --}}
@@ -48,15 +55,19 @@ documentType='item' type='weapon'}}
 <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeArmorPlural'}}</h4>
 {{#unless (isEmpty itemsByType.armor)}}
 <ol class="ds4-embedded-document-list ds4-embedded-document-list--armor item-list">
-    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true}}
+    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true
+    type="armor"}}
     {{!-- armor material type --}}
-    <div title="{{localize 'DS4.ArmorMaterialType'}}">{{localize 'DS4.ArmorMaterialTypeAbbr'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.armorMaterialType"
+        title="{{localize 'DS4.SortByArmorMaterialType'}}">{{localize 'DS4.ArmorMaterialTypeAbbr'}}</div>
 
     {{!-- armor type --}}
-    <div title="{{localize 'DS4.ArmorType'}}">{{localize 'DS4.ArmorTypeAbbr'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.armorType"
+        title="{{localize 'DS4.SortByArmorType'}}">{{localize 'DS4.ArmorTypeAbbr'}}</div>
 
     {{!-- armor value --}}
-    <div title="{{localize 'DS4.ArmorValue'}}">
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.armorValue"
+        title="{{localize 'DS4.SortByArmorValue'}}">
         {{localize 'DS4.ArmorValueAbbr'}}
     </div>
     {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
@@ -87,9 +98,11 @@ documentType='item' type='armor'}}
 <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeShieldPlural'}}</h4>
 {{#unless (isEmpty itemsByType.shield)}}
 <ol class="ds4-embedded-document-list ds4-embedded-document-list--shield item-list">
-    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true}}
+    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true
+    type='shield'}}
     {{!-- armor value --}}
-    <div title="{{localize 'DS4.ArmorValue'}}">
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.armorValue"
+        title="{{localize 'DS4.SortByArmorValue'}}">
         {{localize 'DS4.ArmorValueAbbr'}}
     </div>
     {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
@@ -109,16 +122,19 @@ documentType='item' type='shield'}}
 <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeEquipmentPlural'}}</h4>
 {{#unless (isEmpty itemsByType.equipment)}}
 <ol class="ds4-embedded-document-list ds4-embedded-document-list--equipment item-list">
-    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true}}
+    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hasQuantity=true
+    type='equipment'}}
     {{!-- storage location --}}
-    <div>{{localize 'DS4.StorageLocation'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.storageLocation"
+        title="{{localize 'DS4.SortByStorageLocation'}}">{{localize 'DS4.StorageLocation'}}</div>
     {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
     {{#each itemsByType.equipment as |itemData id|}}
     {{#> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData isEquipable=true
     hasQuantity=true}}
     {{!-- storage location --}}
-    <input class="ds4-embedded-document-list__editable change-item" type="text" value="{{itemData.data.storageLocation}}"
+    <input class="ds4-embedded-document-list__editable change-item" type="text"
-        data-dtype="String" data-property="data.storageLocation" title="{{localize 'DS4.StorageLocation'}}">
+        value="{{itemData.data.storageLocation}}" data-dtype="String" data-property="data.storageLocation"
+        title="{{localize 'DS4.StorageLocation'}}">
     {{/systems/ds4/templates/sheets/actor/components/item-list-entry.hbs}}
     {{/each}}
 </ol>
@@ -130,15 +146,17 @@ documentType='item' type='equipment'}}
 <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeLootPlural'}}</h4>
 {{#unless (isEmpty itemsByType.loot)}}
 <ol class="ds4-embedded-document-list ds4-embedded-document-list--loot item-list">
-    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs hasQuantity=true}}
+    {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs hasQuantity=true type='loot'}}
     {{!-- storage location --}}
-    <div>{{localize 'DS4.StorageLocation'}}</div>
+    <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.storageLocation"
+        title="{{localize 'DS4.SortByStorageLocation'}}">{{localize 'DS4.StorageLocation'}}</div>
     {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
     {{#each itemsByType.loot as |itemData id|}}
     {{#> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData hasQuantity=true}}
     {{!-- storage location --}}
-    <input class="ds4-embedded-document-list__editable change-item" type="text" value="{{itemData.data.storageLocation}}"
+    <input class="ds4-embedded-document-list__editable change-item" type="text"
-        data-dtype="String" data-property="data.storageLocation" title="{{localize 'DS4.StorageLocation'}}">
+        value="{{itemData.data.storageLocation}}" data-dtype="String" data-property="data.storageLocation"
+        title="{{localize 'DS4.StorageLocation'}}">
     {{/systems/ds4/templates/sheets/actor/components/item-list-entry.hbs}}
     {{/each}}
 </ol>

src/templates/sheets/actor/tabs/character-abilities.hbs

@@ -10,9 +10,10 @@ SPDX-License-Identifier: MIT
     <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeTalentPlural'}}</h4>
     {{#unless (isEmpty itemsByType.talent)}}
     <ol class="ds4-embedded-document-list ds4-embedded-document-list--talent item-list">
-        {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
+        {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs type='talent'}}
         {{!-- rank --}}
-        <div>{{localize 'DS4.TalentRank'}}</div>
+        <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.rank.total"
+            title="{{localize 'DS4.SortByTalentRank'}}">{{localize 'DS4.TalentRank'}}</div>
         {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
         {{#each itemsByType.talent as |itemData id|}}
         {{#> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData}}
@@ -29,7 +30,7 @@ SPDX-License-Identifier: MIT
     <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeRacialAbilityPlural'}}</h4>
     {{#unless (isEmpty itemsByType.racialAbility)}}
     <ol class="ds4-embedded-document-list ds4-embedded-document-list--racial-ability item-list">
-        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
+        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs type='racialAbility'}}
         {{#each itemsByType.racialAbility as |itemData id|}}
         {{> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData}}
         {{/each}}
@@ -42,7 +43,7 @@ SPDX-License-Identifier: MIT
     <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeLanguagePlural'}}</h4>
     {{#unless (isEmpty itemsByType.language)}}
     <ol class="ds4-embedded-document-list ds4-embedded-document-list--language item-list">
-        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
+        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs type='language'}}
         {{#each itemsByType.language as |itemData id|}}
         {{> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData}}
         {{/each}}
@@ -55,7 +56,7 @@ SPDX-License-Identifier: MIT
     <h4 class="ds4-embedded-document-list-title">{{localize 'DS4.ItemTypeAlphabetPlural'}}</h4>
     {{#unless (isEmpty itemsByType.alphabet)}}
     <ol class="ds4-embedded-document-list ds4-embedded-document-list--alphabet item-list">
-        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
+        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs type='alphabet'}}
         {{#each itemsByType.alphabet as |itemData id|}}
         {{> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData}}
         {{/each}}

src/templates/sheets/actor/tabs/creature-abilities.hbs

@@ -8,7 +8,7 @@ SPDX-License-Identifier: MIT
 <div class="tab abilities" data-group="primary" data-tab="abilities">
     {{#unless (isEmpty itemsByType.specialCreatureAbility)}}
     <ol class="ds4-embedded-document-list ds4-embedded-document-list--special-creature-ability item-list">
-        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
+        {{> systems/ds4/templates/sheets/actor/components/item-list-header.hbs type='specialCreatureAbility'}}
         {{#each itemsByType.specialCreatureAbility as |itemData id|}}
         {{> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData}}
         {{/each}}

src/templates/sheets/actor/tabs/spells.hbs

@@ -52,12 +52,15 @@ titleKey=titleKey}}
 <div class="tab spells" data-group="primary" data-tab="spells">
     {{#unless (isEmpty itemsByType.spell)}}
     <ol class="ds4-embedded-document-list ds4-embedded-document-list--spell item-list">
-        {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hideDescription=true}}
+        {{#> systems/ds4/templates/sheets/actor/components/item-list-header.hbs isEquipable=true hideDescription=true
+        type='spell'}}
         {{!-- spell type --}}
-        <div title="{{localize 'DS4.SpellType'}}">{{localize 'DS4.SpellTypeAbbr'}}</div>
+        <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.spellType"
+            title="{{localize 'DS4.SortBySpellType'}}">{{localize 'DS4.SpellTypeAbbr'}}</div>
 
         {{!-- spell bonus --}}
-        <div title="{{localize 'DS4.SpellBonus'}}">{{localize 'DS4.SpellBonusAbbr'}}</div>
+        <div class="ds4-embedded-document-list__clickable sort-items" data-data-path="data.bonus"
+            title="{{localize 'DS4.SortBySpellBonus'}}">{{localize 'DS4.SpellBonusAbbr'}}</div>
 
         {{!-- max. distance --}}
         <div title="{{localize 'DS4.SpellMaxDistance'}}"><i class="fas fa-ruler"></i></div>
@@ -68,16 +71,18 @@ titleKey=titleKey}}
         {{!-- cooldown duration --}}
         <div title="{{localize 'DS4.SpellCooldownDuration'}}"><i class="fas fa-hourglass-half"></i></div>
         {{/systems/ds4/templates/sheets/actor/components/item-list-header.hbs}}
+
         {{#each itemsByType.spell as |itemData id|}}
         {{#> systems/ds4/templates/sheets/actor/components/item-list-entry.hbs itemData=itemData isEquipable=true
         hideDescription=true}}
         {{!-- spell type --}}
-        <img class="ds4-embedded-document-list__image" src="{{lookup ../../config.icons.spellTypes itemData.data.spellType}}"
+        <img class="ds4-embedded-document-list__image"
+            src="{{lookup ../../config.icons.spellTypes itemData.data.spellType}}"
             title="{{lookup ../../config.i18n.spellTypes itemData.data.spellType}}" />
 
         {{!-- spell bonus --}}
-        <input class="ds4-embedded-document-list__editable change-item" type="text" data-dtype="String" data-property="data.bonus"
+        <input class="ds4-embedded-document-list__editable change-item" type="text" data-dtype="String"
-            value="{{itemData.data.bonus}}" title="{{localize 'DS4.SpellBonus'}}" />
+            data-property="data.bonus" value="{{itemData.data.bonus}}" title="{{localize 'DS4.SpellBonus'}}" />
 
         {{!-- max. distance --}}
         {{> distanceUnit titleKey='DS4.SpellMaxDistance' unitDatum=itemData.data.maxDistance