add uncap level editing to CharacterEditPane

This commit is contained in:
Justin Edmund 2025-12-02 17:19:41 -08:00
parent 2a4789c72a
commit 0f46960de6
2 changed files with 41 additions and 0 deletions

View file

@ -22,8 +22,11 @@
import EarringSelect from './edit/EarringSelect.svelte' import EarringSelect from './edit/EarringSelect.svelte'
import PerpetuityToggle from './edit/PerpetuityToggle.svelte' import PerpetuityToggle from './edit/PerpetuityToggle.svelte'
import Button from '$lib/components/ui/Button.svelte' import Button from '$lib/components/ui/Button.svelte'
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
export interface CharacterEditValues { export interface CharacterEditValues {
uncapLevel: number
transcendenceStep: number
awakening?: { awakening?: {
type?: Awakening type?: Awakening
level: number level: number
@ -34,6 +37,8 @@
} }
export interface CharacterEditUpdates { export interface CharacterEditUpdates {
uncapLevel?: number
transcendenceStep?: number
awakening?: { awakening?: {
id: string id: string
level: number level: number
@ -68,6 +73,8 @@
}: Props = $props() }: Props = $props()
// Internal state - initialized from currentValues // Internal state - initialized from currentValues
let uncapLevel = $state(currentValues.uncapLevel)
let transcendenceStep = $state(currentValues.transcendenceStep)
let selectedAwakening = $state<Awakening | undefined>(currentValues.awakening?.type) let selectedAwakening = $state<Awakening | undefined>(currentValues.awakening?.type)
let awakeningLevel = $state(currentValues.awakening?.level ?? 1) let awakeningLevel = $state(currentValues.awakening?.level ?? 1)
let rings = $state<ExtendedMastery[]>( let rings = $state<ExtendedMastery[]>(
@ -85,6 +92,8 @@
// Re-initialize when currentValues changes (e.g., switching between characters) // Re-initialize when currentValues changes (e.g., switching between characters)
$effect(() => { $effect(() => {
uncapLevel = currentValues.uncapLevel
transcendenceStep = currentValues.transcendenceStep
selectedAwakening = currentValues.awakening?.type selectedAwakening = currentValues.awakening?.type
awakeningLevel = currentValues.awakening?.level ?? 1 awakeningLevel = currentValues.awakening?.level ?? 1
rings = rings =
@ -125,8 +134,19 @@
'character-multi': 'e36b0573-79c3-4dd2-9524-c95def4bbb1a' 'character-multi': 'e36b0573-79c3-4dd2-9524-c95def4bbb1a'
} }
// Handlers for UncapIndicator
function handleUncapUpdate(newLevel: number) {
uncapLevel = newLevel
}
function handleTranscendenceUpdate(newStage: number) {
transcendenceStep = newStage
}
function handleSave() { function handleSave() {
const updates: CharacterEditUpdates = { const updates: CharacterEditUpdates = {
uncapLevel,
transcendenceStep,
rings, rings,
perpetuity: showPerpetuity ? perpetuity : undefined perpetuity: showPerpetuity ? perpetuity : undefined
} }
@ -156,6 +176,8 @@
function handleCancel() { function handleCancel() {
// Reset to original values // Reset to original values
uncapLevel = currentValues.uncapLevel
transcendenceStep = currentValues.transcendenceStep
selectedAwakening = currentValues.awakening?.type selectedAwakening = currentValues.awakening?.type
awakeningLevel = currentValues.awakening?.level ?? 1 awakeningLevel = currentValues.awakening?.level ?? 1
rings = rings =
@ -175,6 +197,23 @@
<div class="character-edit-pane"> <div class="character-edit-pane">
<div class="edit-sections"> <div class="edit-sections">
<DetailsSection title="Uncap Level">
<div class="section-content uncap-section">
<UncapIndicator
type="character"
{uncapLevel}
transcendenceStage={transcendenceStep}
special={characterData?.special}
flb={characterData?.uncap?.flb}
ulb={characterData?.uncap?.ulb}
transcendence={characterData?.uncap?.transcendence}
editable={true}
updateUncap={handleUncapUpdate}
updateTranscendence={handleTranscendenceUpdate}
/>
</div>
</DetailsSection>
{#if hasAwakening && availableAwakenings.length > 0} {#if hasAwakening && availableAwakenings.length > 0}
<DetailsSection title="Awakening"> <DetailsSection title="Awakening">
<div class="section-content"> <div class="section-content">

View file

@ -28,6 +28,8 @@
// Convert GridCharacter data to CharacterEditPane format // Convert GridCharacter data to CharacterEditPane format
const currentValues = $derived<CharacterEditValues>({ const currentValues = $derived<CharacterEditValues>({
uncapLevel: character.uncapLevel ?? 0,
transcendenceStep: character.transcendenceStep ?? 0,
awakening: character.awakening awakening: character.awakening
? { ? {
type: character.awakening.type, type: character.awakening.type,