From e2297daa5d75225dc6af40a5644b2afdb430e4db Mon Sep 17 00:00:00 2001
From: Oliver-Akins <Oliver.akins1999@gmail.com>
Date: Wed, 29 Jan 2025 21:46:56 -0700
Subject: [PATCH] RC-93 | Group Input

---
 langs/en-ca.json                              |  1 +
 module/data/Item/Skill.mjs                    | 14 ++++++++++
 module/handlebarHelpers/inputs/formFields.mjs |  8 +++++-
 module/handlebarHelpers/inputs/groupInput.mjs | 26 ++++++++++++++++++
 module/handlebarHelpers/inputs/textInput.mjs  | 27 +++++++++++++++++++
 templates/Apps/AllItemSheetV1/style.css       | 13 ++++++++-
 6 files changed, 87 insertions(+), 2 deletions(-)
 create mode 100644 module/handlebarHelpers/inputs/groupInput.mjs
 create mode 100644 module/handlebarHelpers/inputs/textInput.mjs

diff --git a/langs/en-ca.json b/langs/en-ca.json
index 28a8dfc..0ed068f 100644
--- a/langs/en-ca.json
+++ b/langs/en-ca.json
@@ -33,6 +33,7 @@
 				"Rare": "Rare",
 				"Scarce": "Scarce"
 			},
+			"advances": "Advances",
 			"ammo": "Ammo",
 			"anatomy": {
 				"head": "Head",
diff --git a/module/data/Item/Skill.mjs b/module/data/Item/Skill.mjs
index 57c52c9..c02351a 100644
--- a/module/data/Item/Skill.mjs
+++ b/module/data/Item/Skill.mjs
@@ -58,6 +58,20 @@ export class SkillData extends foundry.abstract.TypeDataModel {
 					value: ability,
 				})),
 			},
+			{
+				type: `group`,
+				title: `RipCrypt.common.advances`,
+				paddingTop: `20px`,
+				fields: Object.values(gameTerms.Rank).map(rank => {
+					return {
+						id: `advance-${rank}`,
+						type: `text`,
+						label: `RipCrypt.common.rankNames.${rank}`,
+						path: `system.advances.${rank}`,
+						value: this.advances[rank] ?? ``,
+					};
+				}),
+			},
 		];
 		return fields;
 	};
diff --git a/module/handlebarHelpers/inputs/formFields.mjs b/module/handlebarHelpers/inputs/formFields.mjs
index c916962..bf97126 100644
--- a/module/handlebarHelpers/inputs/formFields.mjs
+++ b/module/handlebarHelpers/inputs/formFields.mjs
@@ -1,8 +1,10 @@
 import { barInput } from "./barInput.mjs";
 import { booleanInput } from "./booleanInput.mjs";
 import { dropdownInput } from "./dropdownInput.mjs";
+import { groupInput } from "./groupInput.mjs";
 import { numberInput } from "./numberInput.mjs";
 import { stringSet } from "./stringSet.mjs";
+import { textInput } from "./textInput.mjs";
 
 const { getType } = foundry.utils;
 
@@ -12,6 +14,8 @@ const inputTypes = {
 	bar: barInput,
 	dropdown: dropdownInput,
 	boolean: booleanInput,
+	group: groupInput,
+	text: textInput,
 };
 
 const typesToSanitize = new Set([ `string`, `number` ]);
@@ -21,7 +25,9 @@ export function formFields(inputs, opts) {
 	for (const input of inputs) {
 		if (inputTypes[input.type] == null) { continue };
 
-		input.limited ??= true;
+		if (input.type !== `group`) {
+			input.limited ??= true;
+		};
 
 		if (typesToSanitize.has(getType(input.value))) {
 			input.value = Handlebars.escapeExpression(input.value);
diff --git a/module/handlebarHelpers/inputs/groupInput.mjs b/module/handlebarHelpers/inputs/groupInput.mjs
new file mode 100644
index 0000000..d6a5c45
--- /dev/null
+++ b/module/handlebarHelpers/inputs/groupInput.mjs
@@ -0,0 +1,26 @@
+import { formFields } from "./formFields.mjs";
+import { localizer } from "../../utils/Localizer.mjs";
+
+export function groupInput(input, data) {
+	const title = localizer(input.title);
+
+	const content = formFields(
+		input.fields,
+		{
+			data: { root: data },
+			hash: { joiner: input.joiner ?? `` },
+		},
+	);
+
+	return `<rc-border
+		data-input-type="group"
+		var:border-color="${input.borderColor ?? `var(--accent-1)`}"
+		var:vertical-displacement="${input.verticalDisplacement ?? `12px`}"
+		var:padding-top="${input.paddingTop ?? `16px`}"
+	>
+		<div slot="title">${title}</div>
+		<div slot="content" class="content">
+			${content}
+		</div>
+	</rc-border>`;
+};
diff --git a/module/handlebarHelpers/inputs/textInput.mjs b/module/handlebarHelpers/inputs/textInput.mjs
new file mode 100644
index 0000000..340a9a9
--- /dev/null
+++ b/module/handlebarHelpers/inputs/textInput.mjs
@@ -0,0 +1,27 @@
+import { localizer } from "../../utils/Localizer.mjs";
+
+export function textInput(input, data) {
+	const label = localizer(input.label);
+	const id = `${data.meta.idp}-${input.id}`;
+
+	if (!data.meta.editable) {
+		return `<div data-input-type="integer">
+			<span class="label">${label}</span>
+			<span class="value">${data.meta.limited && input.limited ? `???` : input.value}</span>
+		</div>`;
+	};
+
+	return `<div data-input-type="text">
+		<label
+			for="${id}"
+		>
+			${label}
+		</label>
+		<input
+			type="text"
+			id="${id}"
+			value="${input.value}"
+			name="${input.path}"
+		/>
+	</div>`;
+};
diff --git a/templates/Apps/AllItemSheetV1/style.css b/templates/Apps/AllItemSheetV1/style.css
index 9f95b26..fd168c9 100644
--- a/templates/Apps/AllItemSheetV1/style.css
+++ b/templates/Apps/AllItemSheetV1/style.css
@@ -26,9 +26,20 @@
 	background: var(--base-background);
 	color: var(--base-text);
 
-	> [data-input-type] {
+	[data-input-type] {
 		display: contents;
 	}
+	> [data-input-type="group"] {
+		display: unset;
+		grid-column: 1 / -1;
+
+		> .content {
+			display: grid;
+			grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
+			column-gap: var(--col-gap);
+			row-gap: var(--row-gap);
+		}
+	}
 
 	hr {
 		background: var(--accent-1);