refactor: add wx-svelte-grid Cell type for database cells
Phase 2.2: Add proper type definitions for wx-svelte-grid - Created Cell interface export in wx-svelte-grid declarations - Updated all 9 database cell components to use Cell type - Removed custom Props interfaces with loose IRow typing - Improved IntelliSense support for grid component props 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
c074ea8bda
commit
271dcb3c81
10 changed files with 24 additions and 55 deletions
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import { getCharacterImage } from '$lib/features/database/detail/image'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
const { row }: Props = $props()
|
||||
const { row }: Cell = $props()
|
||||
</script>
|
||||
|
||||
<div class="image-cell">
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
let { row }: Props = $props()
|
||||
let { row }: Cell = $props()
|
||||
|
||||
// For database view, show maximum possible uncap level
|
||||
// Not the user's current uncap level
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
const { row }: Props = $props()
|
||||
const { row }: Cell = $props()
|
||||
|
||||
const element = $derived(row.element)
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,9 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
interface Props {
|
||||
row: any
|
||||
[key: string]: any // Allow additional props from wx-svelte-grid
|
||||
}
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
|
||||
const { row }: Props = $props()
|
||||
const { row }: Cell = $props()
|
||||
|
||||
// Get the most recent date from various date fields
|
||||
const getLastUpdated = (item: any): Date | null => {
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
const { row }: Props = $props()
|
||||
const { row }: Cell = $props()
|
||||
|
||||
const proficiency = $derived(row.proficiency)
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import { getSummonImage } from '$lib/features/database/detail/image'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
const { row }: Props = $props()
|
||||
const { row }: Cell = $props()
|
||||
</script>
|
||||
|
||||
<div class="image-cell">
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
let { row }: Props = $props()
|
||||
let { row }: Cell = $props()
|
||||
|
||||
// For database view, show maximum possible uncap level
|
||||
const uncap = $derived(row.uncap ?? {})
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import { getWeaponImage } from '$lib/features/database/detail/image'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
const { row }: Props = $props()
|
||||
const { row }: Cell = $props()
|
||||
</script>
|
||||
|
||||
<div class="image-cell">
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<svelte:options runes={true} />
|
||||
|
||||
<script lang="ts">
|
||||
import type { IRow } from 'wx-svelte-grid'
|
||||
import type { Cell } from 'wx-svelte-grid'
|
||||
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
|
||||
|
||||
interface Props {
|
||||
row: IRow
|
||||
}
|
||||
|
||||
let { row }: Props = $props()
|
||||
let { row }: Cell = $props()
|
||||
|
||||
// For database view, show maximum possible uncap level
|
||||
const uncap = $derived(row.uncap ?? {})
|
||||
|
|
|
|||
8
src/lib/types/declarations.d.ts
vendored
8
src/lib/types/declarations.d.ts
vendored
|
|
@ -32,12 +32,16 @@ declare module 'wx-svelte-grid' {
|
|||
[key: string]: any
|
||||
}
|
||||
|
||||
export interface ICellProps {
|
||||
// Cell component props - used by custom cell components
|
||||
export interface Cell {
|
||||
row: IRow
|
||||
col: IColumn
|
||||
value: any
|
||||
value?: any
|
||||
}
|
||||
|
||||
// Alias for backward compatibility
|
||||
export interface ICellProps extends Cell {}
|
||||
|
||||
export interface IDataConfig {
|
||||
data: IRow[]
|
||||
columns: IColumn[]
|
||||
|
|
|
|||
Loading…
Reference in a new issue