From 0429bb62bd8b151b99f2a1ea6e1641afda6f0f2b Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Sun, 21 Dec 2025 23:51:57 -0800
Subject: [PATCH] migrate on:click to onclick for svelte 5

---
 src/lib/components/job/JobItem.svelte         | 2 +-
 src/lib/components/job/JobSection.svelte      | 8 ++++----
 src/lib/components/job/JobSkillItem.svelte    | 4 ++--
 src/lib/components/job/JobSkillSlot.svelte    | 2 +-
 src/lib/components/job/JobTierSelector.svelte | 4 ++--
 src/routes/(app)/test/images/+page.svelte     | 4 ++--
 6 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/lib/components/job/JobItem.svelte b/src/lib/components/job/JobItem.svelte
index 25de17dc..a650d24d 100644
--- a/src/lib/components/job/JobItem.svelte
+++ b/src/lib/components/job/JobItem.svelte
@@ -22,7 +22,7 @@
 <button
 	class="job-item"
 	class:selected
-	on:click={onClick}
+	onclick={onClick}
 	aria-pressed={selected}
 	aria-label="{job.name.en} - {selected ? 'Currently selected' : 'Click to select'}"
 >
diff --git a/src/lib/components/job/JobSection.svelte b/src/lib/components/job/JobSection.svelte
index cb84473d..a84b2935 100644
--- a/src/lib/components/job/JobSection.svelte
+++ b/src/lib/components/job/JobSection.svelte
@@ -69,7 +69,7 @@
 		{/if}
 
 		{#if canEdit && job}
-			<button class="change-job-button" on:click={onSelectJob} aria-label="Change job">
+			<button class="change-job-button" onclick={onSelectJob} aria-label="Change job">
 				<Icon name="arrow-left" size={16} />
 			</button>
 		{/if}
@@ -80,7 +80,7 @@
 		{#if job}
 			<div class="job-header">
 				{#if canEdit}
-					<button class="job-name clickable" on:click={onSelectJob}>
+					<button class="job-name clickable" onclick={onSelectJob}>
 						<div class="job-name-row">
 							<img src={jobIconUrl} alt="{job.name.en} icon" class="job-icon" />
 							<h3>{job.name.en}</h3>
@@ -140,8 +140,8 @@
 						class:editable={canEdit}
 						role={canEdit ? 'button' : undefined}
 						tabindex={canEdit ? 0 : undefined}
-						on:click={() => canEdit && onSelectAccessory?.()}
-						on:keydown={(e) => {
+						onclick={() => canEdit && onSelectAccessory?.()}
+						onkeydown={(e) => {
 							if (canEdit && onSelectAccessory && (e.key === 'Enter' || e.key === ' ')) {
 								e.preventDefault()
 								onSelectAccessory()
diff --git a/src/lib/components/job/JobSkillItem.svelte b/src/lib/components/job/JobSkillItem.svelte
index 2b3a23b3..9ae97e49 100644
--- a/src/lib/components/job/JobSkillItem.svelte
+++ b/src/lib/components/job/JobSkillItem.svelte
@@ -29,7 +29,7 @@
 <button
 	class="skill-item {getSkillColorClass(skill)}"
 	class:current={variant === 'current'}
-	on:click={onClick}
+	onclick={onClick}
 	{disabled}
 	aria-label="{skill.name.en} - {getSkillCategoryName(skill)} skill"
 >
@@ -43,7 +43,7 @@
 	</div>
 
 	{#if variant === 'current' && onRemove}
-		<button class="remove-button" on:click|stopPropagation={onRemove} aria-label="Remove skill">
+		<button class="remove-button" onclick={(e) => { e.stopPropagation(); onRemove?.(); }} aria-label="Remove skill">
 			Remove
 		</button>
 	{/if}
diff --git a/src/lib/components/job/JobSkillSlot.svelte b/src/lib/components/job/JobSkillSlot.svelte
index 603c8bc9..2e3c6831 100644
--- a/src/lib/components/job/JobSkillSlot.svelte
+++ b/src/lib/components/job/JobSkillSlot.svelte
@@ -54,7 +54,7 @@
 			class="skill-slot editable"
 			class:empty={!isFilled}
 			style:--category-color={categoryColor}
-			on:click={handleClick}
+			onclick={handleClick}
 			type="button"
 		>
 			{@render SlotBody({ locked: false })}
diff --git a/src/lib/components/job/JobTierSelector.svelte b/src/lib/components/job/JobTierSelector.svelte
index fc696644..f9657b33 100644
--- a/src/lib/components/job/JobTierSelector.svelte
+++ b/src/lib/components/job/JobTierSelector.svelte
@@ -30,7 +30,7 @@
 			<button
 				class="tier-button"
 				class:selected={selectedTiers.has(tier.value)}
-				on:click={() => handleTierClick(tier.value)}
+				onclick={() => handleTierClick(tier.value)}
 				type="button"
 			>
 				{tier.shortLabel}
@@ -42,7 +42,7 @@
 			<button
 				class="tier-button"
 				class:selected={selectedTiers.has(tier.value)}
-				on:click={() => handleTierClick(tier.value)}
+				onclick={() => handleTierClick(tier.value)}
 				type="button"
 			>
 				{tier.shortLabel}
diff --git a/src/routes/(app)/test/images/+page.svelte b/src/routes/(app)/test/images/+page.svelte
index 1f8d1ed5..bbe74ea4 100644
--- a/src/routes/(app)/test/images/+page.svelte
+++ b/src/routes/(app)/test/images/+page.svelte
@@ -224,10 +224,10 @@
 				<img
 					src={imageUrl}
 					alt="Test image"
-					on:error={(e) => {
+					onerror={(e) => {
 						e.currentTarget.classList.add('error')
 					}}
-					on:load={(e) => {
+					onload={(e) => {
 						e.currentTarget.classList.remove('error')
 					}}
 				/>