COMPONENT
IntentTable
Table intent-first pour données structurées: colonnes render, états loading/empty, densité, zébrage, sélection.
datasince 0.2.0
DESIGN SYSTEM
mode
Intent
Variant
Glow
Intensity
State
PLAYGROUND
Table
Row
Data
Astuce: loading a priorité sur empty visuellement.
PREVIEW
Example IntentTable preview
HouseRealmTierRoleStatusPowerUpdated
🐺
House Stark
house_stark
Winter is Coming
The North
Winterfell
Independent / North
Great HouseLord ParamountActive922026-01-28
🩸
House Bolton
house_bolton
Our Blades Are Sharp
The North
The Dreadfort
North (variable)
MajorVassalDefeated412026-01-21
🐻
House Mormont
house_mormont
Here We Stand
The North
Bear Island
Stark
MajorVassalActive662026-01-20
🐺
House Karstark
house_karstark
The Sun of Winter
The North
Karhold
Stark (historique)
MajorCadet BranchDeclining522026-01-18
🌿
House Umber
house_umber
?
The North
Last Hearth
Stark
MajorVassalActive582026-01-17
🪓
House Glover
house_glover
?
The North
Deepwood Motte
Stark
MajorVassalActive542026-01-16
🌫️
House Reed
house_reed
?
The North
Greywater Watch
Stark
MajorVassalActive492026-01-15
🦁
House Lannister
house_lannister
Hear Me Roar!
Westerlands
Casterly Rock
Crown (variable)
Great HouseLord ParamountActive952026-01-27
🐶
House Clegane
house_clegane
?
Westerlands
Clegane's Keep
Lannister
MinorVassalDeclining282026-01-19
⚔️
House Payne
house_payne
?
Westerlands
Payne Hall
Lannister
MinorVassalActive332026-01-14
🐗
House Crakehall
house_crakehall
None So Fierce
Westerlands
Crakehall
Lannister
MajorVassalActive472026-01-12
🌹
House Tyrell
house_tyrell
Growing Strong
The Reach
Highgarden
Crown (variable)
Great HouseLord ParamountDefeated712026-01-26
🦌
House Tarly
house_tarly
First in Battle
The Reach
Horn Hill
Tyrell (historique)
MajorVassalDeclining552026-01-23
🗼
House Hightower
house_hightower
We Light the Way
The Reach
Oldtown
Reach
PrincipalVassalActive782026-01-22
🍇
House Redwyne
house_redwyne
?
The Reach
The Arbor
Tyrell
MajorVassalActive632026-01-20
🦌
House Baratheon
house_baratheon
Ours is the Fury
Stormlands
Storm's End
Crown (variable)
Great HouseLord ParamountDeclining602026-01-25
🌙
House Tarth
house_tarth
?
Stormlands
Evenfall Hall
Stormlands
MajorVassalActive442026-01-13
🐟
House Tully
house_tully
Family, Duty, Honor
Riverlands
Riverrun
Stark (historique)
Great HouseLord ParamountDeclining572026-01-24
🌉
House Frey
house_frey
We Stand Together
Riverlands
The Twins
Crown (variable)
MajorVassalDefeated382026-01-19
🦅
House Mallister
house_mallister
Above the Rest
Riverlands
Seagard
Riverlands
MajorVassalActive452026-01-10
🦅
House Arryn
house_arryn
As High as Honor
The Vale
The Eyrie
Crown (variable)
Great HouseLord ParamountActive682026-01-23
🪨
House Royce
house_royce
We Remember
The Vale
Runestone
Arryn
MajorVassalActive532026-01-09
☀️
House Martell
house_martell
Unbowed, Unbent, Unbroken
Dorne
Sunspear
Independent / Crown (variable)
Great HouseLord ParamountActive642026-01-22
House Dayne
house_dayne
?
Dorne
Starfall
Martell
MajorVassalActive522026-01-12
🐙
House Greyjoy
house_greyjoy
We Do Not Sow
Iron Islands
Pyke
Independent / Crown (variable)
Great HouseLord ParamountDeclining592026-01-21
📚
House Harlaw
house_harlaw
?
Iron Islands
Harlaw
Greyjoy
MajorVassalActive442026-01-11
🐉
House Targaryen
house_targaryen
Fire and Blood
Crownlands
Dragonstone
Exiled / Claimants
Great HouseExiledRising832026-01-28
👑
House Baratheon of King's Landing
house_baratheon_kingslanding
Ours is the Fury
Crownlands
King's Landing
Crown
PrincipalRoyal DynastyDefeated462026-01-18
🕷️
House Baelish
house_baelish
?
Crownlands
Harrenhal (claim)
Crown (schemes)
MinorNeutralDefeated222026-01-16
RESOLVED
{
  "mode": "dark",
  "intent": "informed",
  "variant": "elevated",
  "intensity": "medium",
  "toneEffective": "informed",
  "glowKey": null,
  "glowBackground": null,
  "style": {
    "--intent-bg": "rgb(var(--ids-informed))",
    "--intent-ring": "rgb(var(--ids-informed))",
    "--intent-text": "var(--ids-color-blue-200)",
    "--intent-bg-opacity": "0.16",
    "--intent-ring-opacity": "0.3045",
    "--intent-border": "rgb(var(--ids-informed))",
    "--intent-glow-bg": "",
    "--intent-glow-fill-opacity": "0",
    "--intent-glow-border-opacity": "0",
    "--intent-glow-filter": "none"
  },
  "classes": {
    "base": "intent-surface inline-flex items-center gap-2",
    "surface": "intent-bg",
    "border": "intent-ring",
    "text": "intent-text",
    "ring": "",
    "shadow": "intent-shadow-soft",
    "glow": "",
    "disabled": ""
  },
  "warnings": []
}
PROPS
PropTypeDefault
PROPS SYSTÈME
intent
Intent sémantique (informed/empowered/warned/threatened/themed/toned/glowed).
IntentNameDEFAULT_INTENT
variant
Variant visuel (flat/outlined/elevated/ghost).
VariantNameDEFAULT_VARIANT
tone
Override de tone (n’a d’effet que si intent='toned').
ToneNameDEFAULT_TONE (si toned)
glow
Glow normal (true/false) ou glow esthétique (uniquement si intent='glowed').
boolean | GlowNamefalse (ou DEFAULT_GLOW_BY_INTENT)
intensity
Intensité (soft/medium/strong).
Intensitymedium
mode
Mode colorimétrique (dark/light).
ModeNamedark
disabled
Désactive l’état visuel (hooks + styles).
booleanfalse
PROPS LOCALES
className
Classes CSS additionnelles sur le root.
string
datarequis
Données à afficher.
T[]
columnsrequis
Définition des colonnes (header + renderer).
IntentTableColumn<T>[]
keyField
Clé unique ligne (champ ou fonction). Recommandé pour la sélection.
keyof T | (row: T, rowIndex: number) => string | number
rowIntent
Override intent/variant/tone par ligne (objet ou fonction).
IntentInput | ((row: T, rowIndex: number) => IntentInput | null | undefined)
loading
Affiche l’état de chargement.
booleanfalse
emptyLabel
Label quand data est vide.
React.ReactNodeNo data
loadingLabel
Label pendant le chargement.
React.ReactNodeLoading…
compact
Densité réduite.
booleanfalse
striped
Zébrage des lignes.
booleanfalse
hoverable
Hover sur les lignes.
booleantrue
stickyHeader
Header sticky (scroll vertical).
booleanfalse
selectable
Active la sélection de lignes.
booleanfalse
selectedKeys
Sélection contrôlée.
Array<string | number>
defaultSelectedKeys
Sélection par défaut (non contrôlée).
Array<string | number>[]
onSelectionChange
Callback de sélection.
(keys: Array<string | number>) => void
footer
Footer libre sous la table.
React.ReactNode
caption
Caption accessible (table).
React.ReactNode
(native props)
Props natives du root div.
Omit<React.HTMLAttributes<HTMLDivElement>, 'className' | 'children'>
TYPES & CONSTANTES
APIValeur / Référence
TYPES
IntentNametype
Type union des intents sémantiques.
"informed" | "empowered" | "warned" | "threatened" | "themed" | "toned" | "glowed"
VariantNametype
Type union des variants visuels.
"flat" | "outlined" | "elevated" | "ghost"
ToneNametype
Type union des tones (familles Tailwind + theme + black).
("slate" | "gray" | ... | "theme" | "black")
GlowNametype
Type union des aesthetic glows (utilisable quand intent='glowed').
"aurora" | "ember" | "cosmic" | "mythic" | "royal" | "mono"
Intensitytype
Intensité des effets (glow/contraste).
"soft" | "medium" | "strong"
ModeNametype
Mode colorimétrique.
"dark" | "light"
CONSTANTES
DEFAULT_INTENTconst
Intent par défaut si aucun intent n’est fourni.
informed
DEFAULT_VARIANTconst
Variant par défaut si aucun variant n’est fourni.
elevated
DEFAULT_GLOW_BY_INTENTconst
Mapping intent → glow par défaut (quand glow est implicite).
DEFAULT_GLOW_BY_INTENT