Add edit/viewability to the item rarity (closes #152)

module/config.mjs

@@ -34,8 +34,10 @@ export const skills = {
 
 export const defaultItemTier = `simple`;
 export const itemTiers = [
-	`simple`, `greater`,
-	`rare`, `legendary`
+	{ value: `simple`, label: `dotdungeon.rarity.simple` },
+	{ value: `greater`, label: `dotdungeon.rarity.greater` },
+	{ value: `rare`, label: `dotdungeon.rarity.rare` },
+	{ value: `legendary`, label: `dotdungeon.rarity.legendary` },
 ];
 
 export const syncMilestones = [

module/models/Item/CommonItemData.mjs

@@ -31,7 +31,7 @@ export class CommonItemData extends foundry.abstract.TypeDataModel {
 			tier: new fields.StringField({
 				initial: DOTDUNGEON.defaultItemTier,
 				nullable: false,
-				choices: DOTDUNGEON.itemTiers,
+				choices: DOTDUNGEON.itemTiers.map(tier => tier.value),
 			}),
 			/*
 			If this property is set to true, the item will be shown in the combat tab

styles/v3/elements/select.scss

@@ -0,0 +1,25 @@
+@use "../mixins/material";
+
+.dotdungeon.style-v3 > .window-content {
+	select {
+		outline: none;
+		border: none;
+		@include material.elevate(3);
+		padding: 4px 8px;
+		color: white;
+		transition: all 200ms ease-in-out;
+
+		&:hover {
+			@include material.elevate(4);
+		}
+
+		&:focus-visible {
+			@include material.elevate(6);
+		}
+	}
+
+	option {
+		background: var(--surface);
+		color: var(--on-surface);
+	}
+}

styles/v3/elements/utilities.scss

@@ -2,4 +2,8 @@
 	.grow {
 		flex-grow: 1;
 	}
+
+	.text-center {
+		text-align: center;
+	}
 }

styles/v3/index.scss

@@ -5,6 +5,7 @@
 /* Element-Styling */
 @use "./elements/utilities.scss";
 @use "./elements/button.scss";
+@use "./elements/select.scss";
 @use "./elements/text-input.scss";
 @use "./elements/number-input.scss";
 @use "./elements/textarea.scss";

templates/items/untyped/v2/tabs/details.v2.untyped.hbs

@@ -37,8 +37,20 @@
 			{{dd-empty-state system.usage_cost}}
 		{{/if}}
 	</div>
-	<div class="tier panel">
-		Item Rarity
+	<div class="tier panel--row">
+		Rarity
+		<div class="grow"></div>
+		{{#if meta.isEditable}}
+			<select
+				class="text-center"
+				name="system.tier"
+				id="{{meta.idp}}-item-tier"
+			>
+				{{{ dd-options system.tier config.itemTiers localize=true }}}
+			</select>
+		{{else}}
+			{{dd-i18n (concat "dotdungeon.rarity." system.tier)}}
+		{{/if}}
 	</div>
 	{{#if meta.isEmbedded}}
 		<div class="location panel">