Trilium Frontend API
    Preparing search index...

    Interface SortableCardProps<T>

    interface SortableCardProps<T extends SortableItem> {
        actions?: ComponentChildren;
        className?: string;
        description?: ComponentChildren;
        filterExtraKeywords?: string;
        filterOnly?: boolean;
        gripPlacement?: "start" | "end";
        heading?: string;
        itemCreationButtons?: ItemCreationButton<T>[];
        items: T[];
        onChange: (items: T[]) => void;
        onItemKeyDown?: (item: T, event: KeyboardEvent) => void;
        onSelect?: (key: string) => void;
        renderItem?: (item: T, index: number) => ComponentChildren;
        selectedKey?: string;
    }

    Type Parameters

    Hierarchy (View Summary)

    Index

    Controls for the card as a whole, kept at the far end of its heading — a help mark, or a button that adds to what the card holds.

    Taken as children rather than named one by one, so that the card needs no import of its own for them: Card is in the login and setup bundles, which have no business pulling in the app a help mark would reach for.

    className?: string
    description?: ComponentChildren

    Sentence introducing the card, shown between the heading and the first section.

    filterExtraKeywords?: string

    Words the card is found by that are not written on it, for a card with no name of its own or one whose name says less than what it holds. Reuse a sentence the page already has rather than inventing words for it: every word in it becomes one the card can be found by.

    filterOnly?: boolean

    Shows the card only while a filter is running, for content that is there to be found rather than read: a page's own actions, which a search cannot otherwise reach, named and pointing at the page they are carried out on.

    gripPlacement?: "start" | "end"

    Which edge of a segment holds the grip. Defaults to the trailing edge; use the leading one when the entries carry their own controls on the trailing side.

    heading?: string
    itemCreationButtons?: ItemCreationButton<T>[]

    The ways to create an entry, rendered as a row of buttons at the foot of the card and omitted when empty. Up to three; more than that makes each button too narrow to read.

    Enter on a segment uses the first of them.

    items: T[]

    The entries, in display order.

    onChange: (items: T[]) => void

    Called with the whole list in its new order after every change.

    onItemKeyDown?: (item: T, event: KeyboardEvent) => void

    Called for a key the card does not answer itself, with the entry that had the focus. For a caller whose entries have commands of their own.

    onSelect?: (key: string) => void
    renderItem?: (item: T, index: number) => ComponentChildren

    Renders the contents of a segment, for a card showing more than a name. Without it, the segment shows the item's caption and icon.

    selectedKey?: string

    The selected entry, for a caller that keeps the selection itself.