add suggestion props to all database section components

This commit is contained in:
Justin Edmund 2025-12-01 23:52:06 -08:00
parent bba78d5781
commit 1ea0eee86c
13 changed files with 559 additions and 67 deletions

View file

@ -30,16 +30,18 @@
</script> </script>
{#if suggestion !== undefined && suggestion !== null && !dismissed} {#if suggestion !== undefined && suggestion !== null && !dismissed}
<TooltipBase.Root bind:open={isOpen} openDelay={0} closeDelay={100}> <TooltipBase.Root bind:open={isOpen} delayDuration={0}>
<TooltipBase.Trigger asChild let:builder> <TooltipBase.Trigger>
<button {#snippet child({ props })}
{...builder} <button
type="button" {...props}
class="suggestion-badge" type="button"
aria-label="Wiki suggestion available" class="suggestion-badge"
> aria-label="Wiki suggestion available"
<Icon name="sparkles" size={14} /> >
</button> <Icon name="sparkles" size={14} />
</button>
{/snippet}
</TooltipBase.Trigger> </TooltipBase.Trigger>
<TooltipBase.Content class="suggestion-tooltip" sideOffset={4}> <TooltipBase.Content class="suggestion-tooltip" sideOffset={4}>
<div class="suggestion-content"> <div class="suggestion-content">

View file

@ -1,29 +1,70 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { CharacterSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import CopyableText from '$lib/components/ui/CopyableText.svelte'
import { getRarityLabel, getRarityOptions } from '$lib/utils/rarity' import { getRarityLabel, getRarityOptions } from '$lib/utils/rarity'
interface Props { interface Props {
character: any character: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: CharacterSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { character, editMode = false, editData = $bindable() }: Props = $props() let {
character,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const rarityOptions = getRarityOptions() const rarityOptions = getRarityOptions()
</script> </script>
<DetailsContainer title="Metadata"> <DetailsContainer title="Metadata">
{#if editMode} {#if editMode}
<DetailItem label="Rarity" bind:value={editData.rarity} editable={true} type="select" options={rarityOptions} /> <SuggestionDetailItem
<DetailItem label="Granblue ID" bind:value={editData.granblueId} editable={true} type="text" /> label="Rarity"
bind:value={editData.rarity}
editable={true}
type="select"
options={rarityOptions}
suggestion={suggestions?.rarity}
dismissedSuggestion={dismissedSuggestions?.has('rarity')}
onAcceptSuggestion={() => onAcceptSuggestion?.('rarity', suggestions?.rarity)}
onDismissSuggestion={() => onDismissSuggestion?.('rarity')}
/>
<SuggestionDetailItem
label="Granblue ID"
bind:value={editData.granblueId}
editable={true}
type="text"
suggestion={suggestions?.granblueId}
dismissedSuggestion={dismissedSuggestions?.has('granblueId')}
onAcceptSuggestion={() => onAcceptSuggestion?.('granblueId', suggestions?.granblueId)}
onDismissSuggestion={() => onDismissSuggestion?.('granblueId')}
/>
<DetailItem label="Character ID" bind:value={editData.characterId} editable={true} type="number" /> <DetailItem label="Character ID" bind:value={editData.characterId} editable={true} type="number" />
{:else} {:else}
<DetailItem label="Rarity" value={getRarityLabel(character.rarity)} /> <DetailItem label="Rarity" value={getRarityLabel(character.rarity)} />
<DetailItem label="Granblue ID" value={character.granblueId} /> <DetailItem label="Granblue ID">
{#if character.granblueId}
<CopyableText value={character.granblueId} />
{:else}
{/if}
</DetailItem>
{/if} {/if}
</DetailsContainer> </DetailsContainer>

View file

@ -1,16 +1,31 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { CharacterSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
interface Props { interface Props {
character: any character: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: CharacterSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { character, editMode = false, editData = $bindable() }: Props = $props() let {
character,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const flb = $derived(editMode ? Boolean(editData.flb) : Boolean(character?.uncap?.flb)) const flb = $derived(editMode ? Boolean(editData.flb) : Boolean(character?.uncap?.flb))
const ulb = $derived(editMode ? Boolean(editData.ulb) : Boolean(character?.uncap?.ulb)) const ulb = $derived(editMode ? Boolean(editData.ulb) : Boolean(character?.uncap?.ulb))
@ -18,10 +33,40 @@
<DetailsContainer title="HP Stats"> <DetailsContainer title="HP Stats">
{#if editMode} {#if editMode}
<DetailItem label="Base HP" bind:value={editData.minHp} editable={true} type="number" placeholder="0" /> <SuggestionDetailItem
<DetailItem label="Max HP" bind:value={editData.maxHp} editable={true} type="number" placeholder="0" /> label="Base HP"
bind:value={editData.minHp}
editable={true}
type="number"
placeholder="0"
suggestion={suggestions?.minHp}
dismissedSuggestion={dismissedSuggestions?.has('minHp')}
onAcceptSuggestion={() => onAcceptSuggestion?.('minHp', suggestions?.minHp)}
onDismissSuggestion={() => onDismissSuggestion?.('minHp')}
/>
<SuggestionDetailItem
label="Max HP"
bind:value={editData.maxHp}
editable={true}
type="number"
placeholder="0"
suggestion={suggestions?.maxHp}
dismissedSuggestion={dismissedSuggestions?.has('maxHp')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxHp', suggestions?.maxHp)}
onDismissSuggestion={() => onDismissSuggestion?.('maxHp')}
/>
{#if flb} {#if flb}
<DetailItem label="Max HP (FLB)" bind:value={editData.maxHpFlb} editable={true} type="number" placeholder="0" /> <SuggestionDetailItem
label="Max HP (FLB)"
bind:value={editData.maxHpFlb}
editable={true}
type="number"
placeholder="0"
suggestion={suggestions?.maxHpFlb}
dismissedSuggestion={dismissedSuggestions?.has('maxHpFlb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxHpFlb', suggestions?.maxHpFlb)}
onDismissSuggestion={() => onDismissSuggestion?.('maxHpFlb')}
/>
{/if} {/if}
{#if ulb} {#if ulb}
<DetailItem label="Max HP (ULB)" bind:value={editData.maxHpUlb} editable={true} type="number" placeholder="0" /> <DetailItem label="Max HP (ULB)" bind:value={editData.maxHpUlb} editable={true} type="number" placeholder="0" />
@ -40,10 +85,40 @@
<DetailsContainer title="Attack Stats"> <DetailsContainer title="Attack Stats">
{#if editMode} {#if editMode}
<DetailItem label="Base Attack" bind:value={editData.minAtk} editable={true} type="number" placeholder="0" /> <SuggestionDetailItem
<DetailItem label="Max Attack" bind:value={editData.maxAtk} editable={true} type="number" placeholder="0" /> label="Base Attack"
bind:value={editData.minAtk}
editable={true}
type="number"
placeholder="0"
suggestion={suggestions?.minAtk}
dismissedSuggestion={dismissedSuggestions?.has('minAtk')}
onAcceptSuggestion={() => onAcceptSuggestion?.('minAtk', suggestions?.minAtk)}
onDismissSuggestion={() => onDismissSuggestion?.('minAtk')}
/>
<SuggestionDetailItem
label="Max Attack"
bind:value={editData.maxAtk}
editable={true}
type="number"
placeholder="0"
suggestion={suggestions?.maxAtk}
dismissedSuggestion={dismissedSuggestions?.has('maxAtk')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxAtk', suggestions?.maxAtk)}
onDismissSuggestion={() => onDismissSuggestion?.('maxAtk')}
/>
{#if flb} {#if flb}
<DetailItem label="Max Attack (FLB)" bind:value={editData.maxAtkFlb} editable={true} type="number" placeholder="0" /> <SuggestionDetailItem
label="Max Attack (FLB)"
bind:value={editData.maxAtkFlb}
editable={true}
type="number"
placeholder="0"
suggestion={suggestions?.maxAtkFlb}
dismissedSuggestion={dismissedSuggestions?.has('maxAtkFlb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxAtkFlb', suggestions?.maxAtkFlb)}
onDismissSuggestion={() => onDismissSuggestion?.('maxAtkFlb')}
/>
{/if} {/if}
{#if ulb} {#if ulb}
<DetailItem label="Max Attack (ULB)" bind:value={editData.maxAtkUlb} editable={true} type="number" placeholder="0" /> <DetailItem label="Max Attack (ULB)" bind:value={editData.maxAtkUlb} editable={true} type="number" placeholder="0" />

View file

@ -1,8 +1,10 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { CharacterSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import ElementLabel from '$lib/components/labels/ElementLabel.svelte' import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte' import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte'
import { getElementOptions } from '$lib/utils/element' import { getElementOptions } from '$lib/utils/element'
@ -14,9 +16,22 @@
character: any character: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: CharacterSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { character, editMode = false, editData = $bindable() }: Props = $props() let {
character,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const elementOptions = getElementOptions() const elementOptions = getElementOptions()
const raceOptions = getRaceOptions() const raceOptions = getRaceOptions()
@ -26,12 +41,72 @@
<DetailsContainer title="Details"> <DetailsContainer title="Details">
{#if editMode} {#if editMode}
<DetailItem label="Element" bind:value={editData.element} editable={true} type="select" options={elementOptions} /> <SuggestionDetailItem
<DetailItem label="Race 1" bind:value={editData.race1} editable={true} type="select" options={raceOptions} /> label="Element"
<DetailItem label="Race 2" bind:value={editData.race2} editable={true} type="select" options={raceOptions} /> bind:value={editData.element}
<DetailItem label="Gender" bind:value={editData.gender} editable={true} type="select" options={genderOptions} /> editable={true}
<DetailItem label="Proficiency 1" bind:value={editData.proficiency1} editable={true} type="select" options={proficiencyOptions} /> type="select"
<DetailItem label="Proficiency 2" bind:value={editData.proficiency2} editable={true} type="select" options={proficiencyOptions} /> options={elementOptions}
suggestion={suggestions?.element}
dismissedSuggestion={dismissedSuggestions?.has('element')}
onAcceptSuggestion={() => onAcceptSuggestion?.('element', suggestions?.element)}
onDismissSuggestion={() => onDismissSuggestion?.('element')}
/>
<SuggestionDetailItem
label="Race 1"
bind:value={editData.race1}
editable={true}
type="select"
options={raceOptions}
suggestion={suggestions?.race1}
dismissedSuggestion={dismissedSuggestions?.has('race1')}
onAcceptSuggestion={() => onAcceptSuggestion?.('race1', suggestions?.race1)}
onDismissSuggestion={() => onDismissSuggestion?.('race1')}
/>
<SuggestionDetailItem
label="Race 2"
bind:value={editData.race2}
editable={true}
type="select"
options={raceOptions}
suggestion={suggestions?.race2}
dismissedSuggestion={dismissedSuggestions?.has('race2')}
onAcceptSuggestion={() => onAcceptSuggestion?.('race2', suggestions?.race2)}
onDismissSuggestion={() => onDismissSuggestion?.('race2')}
/>
<SuggestionDetailItem
label="Gender"
bind:value={editData.gender}
editable={true}
type="select"
options={genderOptions}
suggestion={suggestions?.gender}
dismissedSuggestion={dismissedSuggestions?.has('gender')}
onAcceptSuggestion={() => onAcceptSuggestion?.('gender', suggestions?.gender)}
onDismissSuggestion={() => onDismissSuggestion?.('gender')}
/>
<SuggestionDetailItem
label="Proficiency 1"
bind:value={editData.proficiency1}
editable={true}
type="select"
options={proficiencyOptions}
suggestion={suggestions?.proficiency1}
dismissedSuggestion={dismissedSuggestions?.has('proficiency1')}
onAcceptSuggestion={() => onAcceptSuggestion?.('proficiency1', suggestions?.proficiency1)}
onDismissSuggestion={() => onDismissSuggestion?.('proficiency1')}
/>
<SuggestionDetailItem
label="Proficiency 2"
bind:value={editData.proficiency2}
editable={true}
type="select"
options={proficiencyOptions}
suggestion={suggestions?.proficiency2}
dismissedSuggestion={dismissedSuggestions?.has('proficiency2')}
onAcceptSuggestion={() => onAcceptSuggestion?.('proficiency2', suggestions?.proficiency2)}
onDismissSuggestion={() => onDismissSuggestion?.('proficiency2')}
/>
{:else} {:else}
<DetailItem label="Element"> <DetailItem label="Element">
<ElementLabel element={character.element} size="medium" /> <ElementLabel element={character.element} size="medium" />

View file

@ -1,8 +1,10 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { CharacterSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte' import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
import { getCharacterMaxUncapLevel } from '$lib/utils/uncap' import { getCharacterMaxUncapLevel } from '$lib/utils/uncap'
import { getElementLabel } from '$lib/utils/element' import { getElementLabel } from '$lib/utils/element'
@ -13,9 +15,22 @@
character: any character: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: CharacterSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { character, editMode = false, editData = $bindable() }: Props = $props() let {
character,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const uncap = $derived( const uncap = $derived(
editMode editMode
@ -92,8 +107,30 @@
{/if} {/if}
{#if editMode} {#if editMode}
<DetailItem label="FLB" bind:value={editData.flb} editable={true} type="checkbox" element={elementName} onchange={handleFlbChange} /> <SuggestionDetailItem
<DetailItem label="ULB" bind:value={editData.ulb} editable={true} type="checkbox" element={elementName} onchange={handleUlbChange} /> label="FLB"
bind:value={editData.flb}
editable={true}
type="checkbox"
element={elementName}
onchange={handleFlbChange}
suggestion={suggestions?.flb}
dismissedSuggestion={dismissedSuggestions?.has('flb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('flb', suggestions?.flb)}
onDismissSuggestion={() => onDismissSuggestion?.('flb')}
/>
<SuggestionDetailItem
label="ULB"
bind:value={editData.ulb}
editable={true}
type="checkbox"
element={elementName}
onchange={handleUlbChange}
suggestion={suggestions?.ulb}
dismissedSuggestion={dismissedSuggestions?.has('ulb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('ulb', suggestions?.ulb)}
onDismissSuggestion={() => onDismissSuggestion?.('ulb')}
/>
<DetailItem label="Transcendence" bind:value={editData.transcendence} editable={true} type="checkbox" element={elementName} onchange={handleTranscendenceChange} /> <DetailItem label="Transcendence" bind:value={editData.transcendence} editable={true} type="checkbox" element={elementName} onchange={handleTranscendenceChange} />
<div class="special-field"> <div class="special-field">
<DetailItem label="Special" bind:value={editData.special} editable={true} type="checkbox" element={elementName} onchange={handleSpecialChange} /> <DetailItem label="Special" bind:value={editData.special} editable={true} type="checkbox" element={elementName} onchange={handleSpecialChange} />

View file

@ -1,23 +1,69 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { SummonSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import CopyableText from '$lib/components/ui/CopyableText.svelte'
import { getRarityLabel, getRarityOptions } from '$lib/utils/rarity' import { getRarityLabel, getRarityOptions } from '$lib/utils/rarity'
let { summon, editMode = false, editData = $bindable<any>() }: interface Props {
{ summon: any; editMode?: boolean; editData?: any } = $props() summon: any
editMode?: boolean
editData?: any
// Suggestion support for batch import
suggestions?: SummonSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
}
let {
summon,
editMode = false,
editData = $bindable<any>(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const rarityOptions = getRarityOptions() const rarityOptions = getRarityOptions()
</script> </script>
<DetailsContainer title="Metadata"> <DetailsContainer title="Metadata">
{#if editMode} {#if editMode}
<DetailItem label="Rarity" bind:value={editData.rarity} editable={true} type="select" options={rarityOptions} /> <SuggestionDetailItem
<DetailItem label="Granblue ID" bind:value={editData.granblue_id} editable={true} type="text" /> label="Rarity"
bind:value={editData.rarity}
editable={true}
type="select"
options={rarityOptions}
suggestion={suggestions?.rarity}
dismissedSuggestion={dismissedSuggestions?.has('rarity')}
onAcceptSuggestion={() => onAcceptSuggestion?.('rarity', suggestions?.rarity)}
onDismissSuggestion={() => onDismissSuggestion?.('rarity')}
/>
<SuggestionDetailItem
label="Granblue ID"
bind:value={editData.granblue_id}
editable={true}
type="text"
suggestion={suggestions?.granblueId}
dismissedSuggestion={dismissedSuggestions?.has('granblueId')}
onAcceptSuggestion={() => onAcceptSuggestion?.('granblueId', suggestions?.granblueId)}
onDismissSuggestion={() => onDismissSuggestion?.('granblueId')}
/>
{:else} {:else}
<DetailItem label="Rarity" value={getRarityLabel(summon.rarity)} /> <DetailItem label="Rarity" value={getRarityLabel(summon.rarity)} />
<DetailItem label="Granblue ID" value={summon.granblueId} /> <DetailItem label="Granblue ID">
{#if summon.granblueId}
<CopyableText value={summon.granblueId} />
{:else}
{/if}
</DetailItem>
{/if} {/if}
</DetailsContainer> </DetailsContainer>

View file

@ -1,16 +1,31 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { SummonSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
interface Props { interface Props {
summon: any summon: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: SummonSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { summon, editMode = false, editData = $bindable() }: Props = $props() let {
summon,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const flb = $derived(editMode ? Boolean(editData.flb) : Boolean(summon?.uncap?.flb)) const flb = $derived(editMode ? Boolean(editData.flb) : Boolean(summon?.uncap?.flb))
const ulb = $derived(editMode ? Boolean(editData.ulb) : Boolean(summon?.uncap?.ulb)) const ulb = $derived(editMode ? Boolean(editData.ulb) : Boolean(summon?.uncap?.ulb))
@ -21,27 +36,39 @@
<DetailsContainer title="HP Stats"> <DetailsContainer title="HP Stats">
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="Base HP" label="Base HP"
bind:value={editData.minHp} bind:value={editData.minHp}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.minHp}
dismissedSuggestion={dismissedSuggestions?.has('minHp')}
onAcceptSuggestion={() => onAcceptSuggestion?.('minHp', suggestions?.minHp)}
onDismissSuggestion={() => onDismissSuggestion?.('minHp')}
/> />
<DetailItem <SuggestionDetailItem
label="Max HP" label="Max HP"
bind:value={editData.maxHp} bind:value={editData.maxHp}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxHp}
dismissedSuggestion={dismissedSuggestions?.has('maxHp')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxHp', suggestions?.maxHp)}
onDismissSuggestion={() => onDismissSuggestion?.('maxHp')}
/> />
{#if flb} {#if flb}
<DetailItem <SuggestionDetailItem
label="Max HP (FLB)" label="Max HP (FLB)"
bind:value={editData.maxHpFlb} bind:value={editData.maxHpFlb}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxHpFlb}
dismissedSuggestion={dismissedSuggestions?.has('maxHpFlb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxHpFlb', suggestions?.maxHpFlb)}
onDismissSuggestion={() => onDismissSuggestion?.('maxHpFlb')}
/> />
{/if} {/if}
{#if ulb} {#if ulb}
@ -79,27 +106,39 @@
<DetailsContainer title="Attack Stats"> <DetailsContainer title="Attack Stats">
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="Base Attack" label="Base Attack"
bind:value={editData.minAtk} bind:value={editData.minAtk}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.minAtk}
dismissedSuggestion={dismissedSuggestions?.has('minAtk')}
onAcceptSuggestion={() => onAcceptSuggestion?.('minAtk', suggestions?.minAtk)}
onDismissSuggestion={() => onDismissSuggestion?.('minAtk')}
/> />
<DetailItem <SuggestionDetailItem
label="Max Attack" label="Max Attack"
bind:value={editData.maxAtk} bind:value={editData.maxAtk}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxAtk}
dismissedSuggestion={dismissedSuggestions?.has('maxAtk')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxAtk', suggestions?.maxAtk)}
onDismissSuggestion={() => onDismissSuggestion?.('maxAtk')}
/> />
{#if flb} {#if flb}
<DetailItem <SuggestionDetailItem
label="Max Attack (FLB)" label="Max Attack (FLB)"
bind:value={editData.maxAtkFlb} bind:value={editData.maxAtkFlb}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxAtkFlb}
dismissedSuggestion={dismissedSuggestions?.has('maxAtkFlb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxAtkFlb', suggestions?.maxAtkFlb)}
onDismissSuggestion={() => onDismissSuggestion?.('maxAtkFlb')}
/> />
{/if} {/if}
{#if ulb} {#if ulb}

View file

@ -1,8 +1,10 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { SummonSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import ElementLabel from '$lib/components/labels/ElementLabel.svelte' import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
import { getElementOptions } from '$lib/utils/element' import { getElementOptions } from '$lib/utils/element'
@ -10,21 +12,38 @@
summon: any summon: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: SummonSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { summon, editMode = false, editData = $bindable() }: Props = $props() let {
summon,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const elementOptions = getElementOptions() const elementOptions = getElementOptions()
</script> </script>
<DetailsContainer title="Details"> <DetailsContainer title="Details">
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="Element" label="Element"
bind:value={editData.element} bind:value={editData.element}
editable={true} editable={true}
type="select" type="select"
options={elementOptions} options={elementOptions}
suggestion={suggestions?.element}
dismissedSuggestion={dismissedSuggestions?.has('element')}
onAcceptSuggestion={() => onAcceptSuggestion?.('element', suggestions?.element)}
onDismissSuggestion={() => onDismissSuggestion?.('element')}
/> />
<DetailItem <DetailItem
label="Series" label="Series"

View file

@ -1,8 +1,10 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { SummonSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte' import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
import { getSummonMaxUncapLevel } from '$lib/utils/uncap' import { getSummonMaxUncapLevel } from '$lib/utils/uncap'
import { getElementLabel } from '$lib/utils/element' import { getElementLabel } from '$lib/utils/element'
@ -13,9 +15,22 @@
summon: any summon: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: SummonSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { summon, editMode = false, editData = $bindable() }: Props = $props() let {
summon,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const uncap = $derived( const uncap = $derived(
editMode editMode
@ -81,21 +96,29 @@
{/if} {/if}
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="FLB" label="FLB"
bind:value={editData.flb} bind:value={editData.flb}
editable={true} editable={true}
type="checkbox" type="checkbox"
element={elementName} element={elementName}
onchange={handleFlbChange} onchange={handleFlbChange}
suggestion={suggestions?.flb}
dismissedSuggestion={dismissedSuggestions?.has('flb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('flb', suggestions?.flb)}
onDismissSuggestion={() => onDismissSuggestion?.('flb')}
/> />
<DetailItem <SuggestionDetailItem
label="ULB" label="ULB"
bind:value={editData.ulb} bind:value={editData.ulb}
editable={true} editable={true}
type="checkbox" type="checkbox"
element={elementName} element={elementName}
onchange={handleUlbChange} onchange={handleUlbChange}
suggestion={suggestions?.ulb}
dismissedSuggestion={dismissedSuggestions?.has('ulb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('ulb', suggestions?.ulb)}
onDismissSuggestion={() => onDismissSuggestion?.('ulb')}
/> />
<DetailItem <DetailItem
label="Transcendence" label="Transcendence"
@ -105,12 +128,16 @@
element={elementName} element={elementName}
onchange={handleTranscendenceChange} onchange={handleTranscendenceChange}
/> />
<DetailItem <SuggestionDetailItem
label="Subaura" label="Subaura"
bind:value={editData.subaura} bind:value={editData.subaura}
editable={true} editable={true}
type="checkbox" type="checkbox"
element={elementName} element={elementName}
suggestion={suggestions?.subaura}
dismissedSuggestion={dismissedSuggestions?.has('subaura')}
onAcceptSuggestion={() => onAcceptSuggestion?.('subaura', suggestions?.subaura)}
onDismissSuggestion={() => onDismissSuggestion?.('subaura')}
/> />
<DetailItem <DetailItem
label="Limit" label="Limit"

View file

@ -1,23 +1,69 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { WeaponSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import CopyableText from '$lib/components/ui/CopyableText.svelte'
import { getRarityLabel, getRarityOptions } from '$lib/utils/rarity' import { getRarityLabel, getRarityOptions } from '$lib/utils/rarity'
let { weapon, editMode = false, editData = $bindable<any>() }: interface Props {
{ weapon: any; editMode?: boolean; editData?: any } = $props() weapon: any
editMode?: boolean
editData?: any
// Suggestion support for batch import
suggestions?: WeaponSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
}
let {
weapon,
editMode = false,
editData = $bindable<any>(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const rarityOptions = getRarityOptions() const rarityOptions = getRarityOptions()
</script> </script>
<DetailsContainer title="Metadata"> <DetailsContainer title="Metadata">
{#if editMode} {#if editMode}
<DetailItem label="Rarity" bind:value={editData.rarity} editable={true} type="select" options={rarityOptions} /> <SuggestionDetailItem
<DetailItem label="Granblue ID" bind:value={editData.granblue_id} editable={true} type="text" /> label="Rarity"
bind:value={editData.rarity}
editable={true}
type="select"
options={rarityOptions}
suggestion={suggestions?.rarity}
dismissedSuggestion={dismissedSuggestions?.has('rarity')}
onAcceptSuggestion={() => onAcceptSuggestion?.('rarity', suggestions?.rarity)}
onDismissSuggestion={() => onDismissSuggestion?.('rarity')}
/>
<SuggestionDetailItem
label="Granblue ID"
bind:value={editData.granblue_id}
editable={true}
type="text"
suggestion={suggestions?.granblueId}
dismissedSuggestion={dismissedSuggestions?.has('granblueId')}
onAcceptSuggestion={() => onAcceptSuggestion?.('granblueId', suggestions?.granblueId)}
onDismissSuggestion={() => onDismissSuggestion?.('granblueId')}
/>
{:else} {:else}
<DetailItem label="Rarity" value={getRarityLabel(weapon.rarity)} /> <DetailItem label="Rarity" value={getRarityLabel(weapon.rarity)} />
<DetailItem label="Granblue ID" value={weapon.granblueId} /> <DetailItem label="Granblue ID">
{#if weapon.granblueId}
<CopyableText value={weapon.granblueId} />
{:else}
{/if}
</DetailItem>
{/if} {/if}
</DetailsContainer> </DetailsContainer>

View file

@ -1,16 +1,31 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { WeaponSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
interface Props { interface Props {
weapon: any weapon: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: WeaponSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { weapon, editMode = false, editData = $bindable() }: Props = $props() let {
weapon,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const flb = $derived(editMode ? Boolean(editData.flb) : Boolean(weapon?.uncap?.flb)) const flb = $derived(editMode ? Boolean(editData.flb) : Boolean(weapon?.uncap?.flb))
const ulb = $derived(editMode ? Boolean(editData.ulb) : Boolean(weapon?.uncap?.ulb)) const ulb = $derived(editMode ? Boolean(editData.ulb) : Boolean(weapon?.uncap?.ulb))
@ -41,27 +56,39 @@
<DetailsContainer title="HP Stats"> <DetailsContainer title="HP Stats">
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="Base HP" label="Base HP"
bind:value={editData.minHp} bind:value={editData.minHp}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.minHp}
dismissedSuggestion={dismissedSuggestions?.has('minHp')}
onAcceptSuggestion={() => onAcceptSuggestion?.('minHp', suggestions?.minHp)}
onDismissSuggestion={() => onDismissSuggestion?.('minHp')}
/> />
<DetailItem <SuggestionDetailItem
label="Max HP" label="Max HP"
bind:value={editData.maxHp} bind:value={editData.maxHp}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxHp}
dismissedSuggestion={dismissedSuggestions?.has('maxHp')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxHp', suggestions?.maxHp)}
onDismissSuggestion={() => onDismissSuggestion?.('maxHp')}
/> />
{#if flb} {#if flb}
<DetailItem <SuggestionDetailItem
label="Max HP (FLB)" label="Max HP (FLB)"
bind:value={editData.maxHpFlb} bind:value={editData.maxHpFlb}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxHpFlb}
dismissedSuggestion={dismissedSuggestions?.has('maxHpFlb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxHpFlb', suggestions?.maxHpFlb)}
onDismissSuggestion={() => onDismissSuggestion?.('maxHpFlb')}
/> />
{/if} {/if}
{#if ulb} {#if ulb}
@ -87,27 +114,39 @@
<DetailsContainer title="Attack Stats"> <DetailsContainer title="Attack Stats">
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="Base Attack" label="Base Attack"
bind:value={editData.minAtk} bind:value={editData.minAtk}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.minAtk}
dismissedSuggestion={dismissedSuggestions?.has('minAtk')}
onAcceptSuggestion={() => onAcceptSuggestion?.('minAtk', suggestions?.minAtk)}
onDismissSuggestion={() => onDismissSuggestion?.('minAtk')}
/> />
<DetailItem <SuggestionDetailItem
label="Max Attack" label="Max Attack"
bind:value={editData.maxAtk} bind:value={editData.maxAtk}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxAtk}
dismissedSuggestion={dismissedSuggestions?.has('maxAtk')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxAtk', suggestions?.maxAtk)}
onDismissSuggestion={() => onDismissSuggestion?.('maxAtk')}
/> />
{#if flb} {#if flb}
<DetailItem <SuggestionDetailItem
label="Max Attack (FLB)" label="Max Attack (FLB)"
bind:value={editData.maxAtkFlb} bind:value={editData.maxAtkFlb}
editable={true} editable={true}
type="number" type="number"
placeholder="0" placeholder="0"
suggestion={suggestions?.maxAtkFlb}
dismissedSuggestion={dismissedSuggestions?.has('maxAtkFlb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('maxAtkFlb', suggestions?.maxAtkFlb)}
onDismissSuggestion={() => onDismissSuggestion?.('maxAtkFlb')}
/> />
{/if} {/if}
{#if ulb} {#if ulb}

View file

@ -1,8 +1,10 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { WeaponSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import ElementLabel from '$lib/components/labels/ElementLabel.svelte' import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte' import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte'
import { getElementLabel, getElementOptions } from '$lib/utils/element' import { getElementLabel, getElementOptions } from '$lib/utils/element'
@ -15,9 +17,22 @@
weapon: any weapon: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: WeaponSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { weapon, editMode = false, editData = $bindable() }: Props = $props() let {
weapon,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const elementOptions = getElementOptions() const elementOptions = getElementOptions()
const proficiencyOptions = getProficiencyOptions() const proficiencyOptions = getProficiencyOptions()
@ -44,19 +59,27 @@
<DetailsContainer title="Details"> <DetailsContainer title="Details">
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="Element" label="Element"
bind:value={editData.element} bind:value={editData.element}
editable={true} editable={true}
type="select" type="select"
options={elementOptions} options={elementOptions}
suggestion={suggestions?.element}
dismissedSuggestion={dismissedSuggestions?.has('element')}
onAcceptSuggestion={() => onAcceptSuggestion?.('element', suggestions?.element)}
onDismissSuggestion={() => onDismissSuggestion?.('element')}
/> />
<DetailItem <SuggestionDetailItem
label="Proficiency" label="Proficiency"
bind:value={editData.proficiency} bind:value={editData.proficiency}
editable={true} editable={true}
type="select" type="select"
options={proficiencyOptions} options={proficiencyOptions}
suggestion={suggestions?.proficiency}
dismissedSuggestion={dismissedSuggestions?.has('proficiency')}
onAcceptSuggestion={() => onAcceptSuggestion?.('proficiency', suggestions?.proficiency)}
onDismissSuggestion={() => onDismissSuggestion?.('proficiency')}
/> />
<DetailItem <DetailItem
label="Series" label="Series"

View file

@ -1,8 +1,10 @@
<svelte:options runes={true} /> <svelte:options runes={true} />
<script lang="ts"> <script lang="ts">
import type { WeaponSuggestions } from '$lib/api/adapters/entity.adapter'
import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte' import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
import DetailItem from '$lib/components/ui/DetailItem.svelte' import DetailItem from '$lib/components/ui/DetailItem.svelte'
import SuggestionDetailItem from '$lib/components/ui/SuggestionDetailItem.svelte'
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte' import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
import { getElementLabel } from '$lib/utils/element' import { getElementLabel } from '$lib/utils/element'
@ -12,9 +14,22 @@
weapon: any weapon: any
editMode?: boolean editMode?: boolean
editData?: any editData?: any
// Suggestion support for batch import
suggestions?: WeaponSuggestions
dismissedSuggestions?: Set<string>
onAcceptSuggestion?: (field: string, value: any) => void
onDismissSuggestion?: (field: string) => void
} }
let { weapon, editMode = false, editData = $bindable() }: Props = $props() let {
weapon,
editMode = false,
editData = $bindable(),
suggestions,
dismissedSuggestions,
onAcceptSuggestion,
onDismissSuggestion
}: Props = $props()
const uncap = $derived( const uncap = $derived(
editMode editMode
@ -79,21 +94,29 @@
{/if} {/if}
{#if editMode} {#if editMode}
<DetailItem <SuggestionDetailItem
label="FLB" label="FLB"
bind:value={editData.flb} bind:value={editData.flb}
editable={true} editable={true}
type="checkbox" type="checkbox"
element={elementName} element={elementName}
onchange={handleFlbChange} onchange={handleFlbChange}
suggestion={suggestions?.flb}
dismissedSuggestion={dismissedSuggestions?.has('flb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('flb', suggestions?.flb)}
onDismissSuggestion={() => onDismissSuggestion?.('flb')}
/> />
<DetailItem <SuggestionDetailItem
label="ULB" label="ULB"
bind:value={editData.ulb} bind:value={editData.ulb}
editable={true} editable={true}
type="checkbox" type="checkbox"
element={elementName} element={elementName}
onchange={handleUlbChange} onchange={handleUlbChange}
suggestion={suggestions?.ulb}
dismissedSuggestion={dismissedSuggestions?.has('ulb')}
onAcceptSuggestion={() => onAcceptSuggestion?.('ulb', suggestions?.ulb)}
onDismissSuggestion={() => onDismissSuggestion?.('ulb')}
/> />
<DetailItem <DetailItem
label="Transcendence" label="Transcendence"