Entity preview
canonHover card with head, facts and actions for a CRM record.
Used in 1 file · 1 area · 1× — components/entity-preview
@acrm/ui <EntityPreview>.eref-hc .eref-hc-head .eref-hc-facts .eref-hc-act +1SourceStoryLegacy card entity-previews.htmlImport
import { EntityPreview } from '@acrm/ui'
Props
EntityPreview packages/ui/src/components/EntityPreview.tsx
| Name | Type | Default | Description |
|---|---|---|---|
children * | ReactNode | — | Trigger — typicky DS <EntityRef>. Obalí se span wrapperem s hover/fokus handlery. |
kind * | 'person' | 'company' | 'deal' | 'order' | 'document' | 'product' | 'segment' | 'meeting' | 'task' | 'note' | — | Typ záznamu — řídí identitu vlevo nahoře (avatar vs. --ic dlaždice + glyf). |
name * | string | — | Název entity (řídí i iniciály/hue avataru u osoby/firmy). |
photo | string | — | URL loga firmy / fotky osoby pro značku v hlavičce; bez ní iniciály (ACRM-490). |
subtitle | string | — | Podtitul BEZ typového prefixu (K1); server ho vynechá, když se rovná názvu (K4). |
subtitleIcon | 'phone' | 'mail' | 'place' | 'people' | 'priority' | 'link' | 'stage' | 'money' | 'next' | 'tag' | 'share' | 'folder' | 'web' | 'tag' | Glyf řádku s podtitulem. Default tag („co to je" — role, druh, zařazení). Volající ho upřesní tam, kde podtitul znamená něco jiného: u FIRMY je to doména, tedy world (ACRM-65, shodně s tím, jak doménu kreslí sloupec ve výpisu firem). |
subtitleHref | string | null | — | Podtitul jako odkaz (web firmy). Cíl počítá volající — viz EntityPreviewRow.href. |
subtitleOpenLabel | string | — | Popisek odkazu nad podtitulem (title) — „Otevřít web". |
facts | EntityPreviewFact[] | — | Pás fakt pod hlavou, skládaný z částí oddělovačem „ · ". |
excerpt | string | — | 3řádkový výňatek obsahu (line-clamp řeší CSS). |
rows | EntityPreviewRow[] | — | Řádky středu — ikona/avatar + hodnota. Žádné popisky (K1). |
state | 'ready' | 'loading' | 'unavailable' | 'ready' | Tři stavy karty. Default 'ready'. |
unavailableLabel | string | — | Věta pro state='unavailable'. Text VŽDY prop — žádný i18n coupling v DS. |
openLabel * | string | — | Text patičky („Otevřít detail") — text VŽDY prop, žádný i18n coupling. |
openHref | string | — | Když je dán, patička je <a href> (klik prostředním tlačítkem); jinak <button>. |
onOpen | (e: MouseEvent<HTMLElement, MouseEvent>) => void | — | Klik na patičku → otevřít detail záznamu. |
onShow | () => void | — | Prodleva doběhla a karta se OTEVÍRÁ. Tady a nikde jinde spouští appka fetch. |
onHide | () => void | — | Karta se zavřela (mouseleave/blur/Esc/scroll/resize). Tady appka ruší dotaz. |
delay | number | 300 | Prodleva otevření po hoveru/fokusu (ms). |
pinned | boolean | false | Karta je PŘIPNUTÁ — drží se otevřená, i když z ní kurzor odjede (ACRM-66). Povrch nad hodnotou řádku otevírá vlastní portálované menu (onOpen → <Popover>); leží MIMO kartu, takže cesta kurzoru do něj je pro kartu mouseleave a bez připnutí by kartu i menu zavřela. Dokud je pinned, hide(), scroll ani Esc kartu nezavírají (Esc patří menu). Po odepnutí se zavře, jen když kurzor mezitím odjel. |
ariaLabel | string | — | aria-label karty (default = name). |
className | string | — | Extra třídy kořene karty (.eref-hc). |
CSS classes
.eref-hc.eref-hc-head.eref-hc-facts.eref-hc-act.eref-hc-more