extract gw utilities (formatScore, parseScore, element constants)

src/lib/components/crew/EditCrewScoreModal.svelte

@@ -10,6 +10,7 @@
 	import ModalFooter from '$lib/components/ui/ModalFooter.svelte'
 	import Input from '$lib/components/ui/Input.svelte'
 	import { GW_ROUND_LABELS, type GwCrewScore, type GwRound } from '$lib/types/api/gw'
+	import { formatScore, parseScore } from '$lib/utils/gw'
 
 	interface Props {
 		open: boolean
@@ -80,16 +81,6 @@
 		}
 	}))
 
-	// Format number with commas
-	function formatScore(score: number): string {
-		return score.toLocaleString()
-	}
-
-	// Parse score string, removing commas
-	function parseScore(value: string): number {
-		return parseInt(value.replace(/,/g, ''), 10)
-	}
-
 	// Initialize form values
 	function initializeForm() {
 		if (existingScore) {

src/lib/components/crew/EditScoreModal.svelte

@@ -11,6 +11,7 @@
 	import Input from '$lib/components/ui/Input.svelte'
 	import Checkbox from '$lib/components/ui/checkbox/Checkbox.svelte'
 	import { GW_ROUND_LABELS, type GwIndividualScore, type GwRound } from '$lib/types/api/gw'
+	import { formatScore, parseScore } from '$lib/utils/gw'
 
 	interface Props {
 		open: boolean
@@ -60,16 +61,6 @@
 		}
 	}))
 
-	// Format number with commas
-	function formatScore(score: number): string {
-		return score.toLocaleString()
-	}
-
-	// Parse score string, removing commas
-	function parseScore(value: string): number {
-		return parseInt(value.replace(/,/g, ''), 10)
-	}
-
 	// Get label for a score
 	function getScoreLabel(score: GwIndividualScore): string {
 		if (score.isCumulative) {

src/lib/components/settings/ProfileSettings.svelte

@@ -6,6 +6,7 @@
 	import SettingsRow from '../ui/SettingsRow.svelte'
 	import { pictureData } from '$lib/utils/pictureData'
 	import { getAvatarSrc, getAvatarSrcSet } from '$lib/utils/avatar'
+	import { ELEMENT_HEX_COLORS } from '$lib/utils/gw'
 	import type { ElementType } from '../ui/SettingsNav.svelte'
 
 	interface Props {
@@ -52,19 +53,9 @@
 			}))
 	)
 
-	// Element colors for circle indicators
-	const elementColors: Record<string, string> = {
-		wind: '#3ee489',
-		fire: '#fa6d6d',
-		water: '#6cc9ff',
-		earth: '#fd9f5b',
-		dark: '#de7bff',
-		light: '#e8d633'
-	}
-
 	// Create SVG circle data URL for element color
 	function getElementCircle(el: string): string {
-		const color = elementColors[el] || '#888'
+		const color = ELEMENT_HEX_COLORS[el] || '#888'
 		const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><circle cx="8" cy="8" r="7" fill="${color}"/></svg>`
 		return `data:image/svg+xml,${encodeURIComponent(svg)}`
 	}

src/lib/utils/gw.ts

@@ -0,0 +1,64 @@
+/**
+ * Guild War (Unite and Fight) utility functions and constants
+ */
+
+/**
+ * Format a score number with commas for display
+ */
+export function formatScore(score: number): string {
+	return score.toLocaleString()
+}
+
+/**
+ * Parse a score string (with commas) back to a number
+ */
+export function parseScore(value: string): number {
+	return parseInt(value.replace(/,/g, ''), 10)
+}
+
+/**
+ * Element labels matching GranblueEnums::ELEMENTS
+ */
+export const ELEMENT_LABELS: Record<number, string> = {
+	0: 'Null',
+	1: 'Wind',
+	2: 'Fire',
+	3: 'Water',
+	4: 'Earth',
+	5: 'Dark',
+	6: 'Light'
+}
+
+/**
+ * Element CSS class names for badge styling
+ */
+export const ELEMENT_CSS_CLASSES: Record<number, string> = {
+	0: 'null',
+	1: 'wind',
+	2: 'fire',
+	3: 'water',
+	4: 'earth',
+	5: 'dark',
+	6: 'light'
+}
+
+/**
+ * Element hex colors for SVG rendering (used in dropdowns)
+ */
+export const ELEMENT_HEX_COLORS: Record<string, string> = {
+	wind: '#3ee489',
+	fire: '#fa6d6d',
+	water: '#6cc9ff',
+	earth: '#fd9f5b',
+	dark: '#de7bff',
+	light: '#e8d633'
+}
+
+/**
+ * Get element hex color by element ID
+ */
+export function getElementColor(elementId: number): string {
+	const className = ELEMENT_CSS_CLASSES[elementId]
+	if (!className) return '#888'
+	return ELEMENT_HEX_COLORS[className] ?? '#888'
+}