Backstage
    Preparing search index...

    Interface CellProfileProps

    Props for the CellProfile component.

    CellProfile renders a table cell with an avatar, name, and optional description. It is one of the cell components (Cell, CellText, CellProfile) that must be used as the top-level element returned from ColumnConfig.cell or a custom RowRenderFn.

    interface CellProfileProps {
        allowsArrowNavigation?: boolean;
        children?: ChildrenOrFunction<CellRenderProps>;
        className?: string;
        color?: TextColors;
        colSpan?: number;
        description?: string;
        dir?: string;
        focusMode?: "cell" | "child";
        hidden?: boolean;
        href?: string;
        id?: Key;
        inert?: boolean;
        lang?: string;
        name?: string;
        onAnimationEnd?: AnimationEventHandler<HTMLTableCellElement>;
        onAnimationEndCapture?: AnimationEventHandler<HTMLTableCellElement>;
        onAnimationIteration?: AnimationEventHandler<HTMLTableCellElement>;
        onAnimationIterationCapture?: AnimationEventHandler<HTMLTableCellElement>;
        onAnimationStart?: AnimationEventHandler<HTMLTableCellElement>;
        onAnimationStartCapture?: AnimationEventHandler<HTMLTableCellElement>;
        onAuxClick?: MouseEventHandler<HTMLTableCellElement>;
        onAuxClickCapture?: MouseEventHandler<HTMLTableCellElement>;
        onClick?: MouseEventHandler<HTMLTableCellElement>;
        onClickCapture?: MouseEventHandler<HTMLTableCellElement>;
        onContextMenu?: MouseEventHandler<HTMLTableCellElement>;
        onContextMenuCapture?: MouseEventHandler<HTMLTableCellElement>;
        onDoubleClick?: MouseEventHandler<HTMLTableCellElement>;
        onDoubleClickCapture?: MouseEventHandler<HTMLTableCellElement>;
        onGotPointerCapture?: PointerEventHandler<HTMLTableCellElement>;
        onGotPointerCaptureCapture?: PointerEventHandler<HTMLTableCellElement>;
        onLostPointerCapture?: PointerEventHandler<HTMLTableCellElement>;
        onLostPointerCaptureCapture?: PointerEventHandler<HTMLTableCellElement>;
        onMouseDown?: MouseEventHandler<HTMLTableCellElement>;
        onMouseDownCapture?: MouseEventHandler<HTMLTableCellElement>;
        onMouseEnter?: MouseEventHandler<HTMLTableCellElement>;
        onMouseLeave?: MouseEventHandler<HTMLTableCellElement>;
        onMouseMove?: MouseEventHandler<HTMLTableCellElement>;
        onMouseMoveCapture?: MouseEventHandler<HTMLTableCellElement>;
        onMouseOut?: MouseEventHandler<HTMLTableCellElement>;
        onMouseOutCapture?: MouseEventHandler<HTMLTableCellElement>;
        onMouseOver?: MouseEventHandler<HTMLTableCellElement>;
        onMouseOverCapture?: MouseEventHandler<HTMLTableCellElement>;
        onMouseUp?: MouseEventHandler<HTMLTableCellElement>;
        onMouseUpCapture?: MouseEventHandler<HTMLTableCellElement>;
        onPointerCancel?: PointerEventHandler<HTMLTableCellElement>;
        onPointerCancelCapture?: PointerEventHandler<HTMLTableCellElement>;
        onPointerDown?: PointerEventHandler<HTMLTableCellElement>;
        onPointerDownCapture?: PointerEventHandler<HTMLTableCellElement>;
        onPointerEnter?: PointerEventHandler<HTMLTableCellElement>;
        onPointerLeave?: PointerEventHandler<HTMLTableCellElement>;
        onPointerMove?: PointerEventHandler<HTMLTableCellElement>;
        onPointerMoveCapture?: PointerEventHandler<HTMLTableCellElement>;
        onPointerOut?: PointerEventHandler<HTMLTableCellElement>;
        onPointerOutCapture?: PointerEventHandler<HTMLTableCellElement>;
        onPointerOver?: PointerEventHandler<HTMLTableCellElement>;
        onPointerOverCapture?: PointerEventHandler<HTMLTableCellElement>;
        onPointerUp?: PointerEventHandler<HTMLTableCellElement>;
        onPointerUpCapture?: PointerEventHandler<HTMLTableCellElement>;
        onScroll?: UIEventHandler<HTMLTableCellElement>;
        onScrollCapture?: UIEventHandler<HTMLTableCellElement>;
        onTouchCancel?: TouchEventHandler<HTMLTableCellElement>;
        onTouchCancelCapture?: TouchEventHandler<HTMLTableCellElement>;
        onTouchEnd?: TouchEventHandler<HTMLTableCellElement>;
        onTouchEndCapture?: TouchEventHandler<HTMLTableCellElement>;
        onTouchMove?: TouchEventHandler<HTMLTableCellElement>;
        onTouchMoveCapture?: TouchEventHandler<HTMLTableCellElement>;
        onTouchStart?: TouchEventHandler<HTMLTableCellElement>;
        onTouchStartCapture?: TouchEventHandler<HTMLTableCellElement>;
        onTransitionCancel?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionCancelCapture?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionEnd?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionEndCapture?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionRun?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionRunCapture?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionStart?: TransitionEventHandler<HTMLTableCellElement>;
        onTransitionStartCapture?: TransitionEventHandler<HTMLTableCellElement>;
        onWheel?: WheelEventHandler<HTMLTableCellElement>;
        onWheelCapture?: WheelEventHandler<HTMLTableCellElement>;
        render?: DOMRenderFunction<"div" | "td", CellRenderProps>;
        src?: string;
        style?: StyleOrFunction<CellRenderProps>;
        suppressHydrationWarning?: boolean;
        textValue?: string;
        translate?: "yes" | "no";
    }

    Hierarchy (View Summary)

    Index
    allowsArrowNavigation?: boolean

    Whether the cell should support arrow key navigation even when the containing table uses tab keyboard navigation. Allows users to navigate between cells and rows with arrow keys while focus is on an interactive child element within the cell.

    children?: ChildrenOrFunction<CellRenderProps>

    The children of the component. A function may be provided to alter the children based on component state.

    className?: string
    color?: TextColors
    colSpan?: number

    Indicates how many columns the data cell spans.

    description?: string
    dir?: string
    focusMode?: "cell" | "child"

    Whether the cell or its first focusable child element should be focused when the cell is focused. Defaults to 'child' in arrow keyboard navigation mode and 'cell' in tab keyboard navigation mode.

    hidden?: boolean
    href?: string
    id?: Key

    The unique id of the cell.

    inert?: boolean
    lang?: string
    name?: string
    onAnimationEnd?: AnimationEventHandler<HTMLTableCellElement>
    onAnimationEndCapture?: AnimationEventHandler<HTMLTableCellElement>
    onAnimationIteration?: AnimationEventHandler<HTMLTableCellElement>
    onAnimationIterationCapture?: AnimationEventHandler<HTMLTableCellElement>
    onAnimationStart?: AnimationEventHandler<HTMLTableCellElement>
    onAnimationStartCapture?: AnimationEventHandler<HTMLTableCellElement>
    onAuxClick?: MouseEventHandler<HTMLTableCellElement>
    onAuxClickCapture?: MouseEventHandler<HTMLTableCellElement>
    onClick?: MouseEventHandler<HTMLTableCellElement>
    onClickCapture?: MouseEventHandler<HTMLTableCellElement>
    onContextMenu?: MouseEventHandler<HTMLTableCellElement>
    onContextMenuCapture?: MouseEventHandler<HTMLTableCellElement>
    onDoubleClick?: MouseEventHandler<HTMLTableCellElement>
    onDoubleClickCapture?: MouseEventHandler<HTMLTableCellElement>
    onGotPointerCapture?: PointerEventHandler<HTMLTableCellElement>
    onGotPointerCaptureCapture?: PointerEventHandler<HTMLTableCellElement>
    onLostPointerCapture?: PointerEventHandler<HTMLTableCellElement>
    onLostPointerCaptureCapture?: PointerEventHandler<HTMLTableCellElement>
    onMouseDown?: MouseEventHandler<HTMLTableCellElement>
    onMouseDownCapture?: MouseEventHandler<HTMLTableCellElement>
    onMouseEnter?: MouseEventHandler<HTMLTableCellElement>
    onMouseLeave?: MouseEventHandler<HTMLTableCellElement>
    onMouseMove?: MouseEventHandler<HTMLTableCellElement>
    onMouseMoveCapture?: MouseEventHandler<HTMLTableCellElement>
    onMouseOut?: MouseEventHandler<HTMLTableCellElement>
    onMouseOutCapture?: MouseEventHandler<HTMLTableCellElement>
    onMouseOver?: MouseEventHandler<HTMLTableCellElement>
    onMouseOverCapture?: MouseEventHandler<HTMLTableCellElement>
    onMouseUp?: MouseEventHandler<HTMLTableCellElement>
    onMouseUpCapture?: MouseEventHandler<HTMLTableCellElement>
    onPointerCancel?: PointerEventHandler<HTMLTableCellElement>
    onPointerCancelCapture?: PointerEventHandler<HTMLTableCellElement>
    onPointerDown?: PointerEventHandler<HTMLTableCellElement>
    onPointerDownCapture?: PointerEventHandler<HTMLTableCellElement>
    onPointerEnter?: PointerEventHandler<HTMLTableCellElement>
    onPointerLeave?: PointerEventHandler<HTMLTableCellElement>
    onPointerMove?: PointerEventHandler<HTMLTableCellElement>
    onPointerMoveCapture?: PointerEventHandler<HTMLTableCellElement>
    onPointerOut?: PointerEventHandler<HTMLTableCellElement>
    onPointerOutCapture?: PointerEventHandler<HTMLTableCellElement>
    onPointerOver?: PointerEventHandler<HTMLTableCellElement>
    onPointerOverCapture?: PointerEventHandler<HTMLTableCellElement>
    onPointerUp?: PointerEventHandler<HTMLTableCellElement>
    onPointerUpCapture?: PointerEventHandler<HTMLTableCellElement>
    onScroll?: UIEventHandler<HTMLTableCellElement>
    onScrollCapture?: UIEventHandler<HTMLTableCellElement>
    onTouchCancel?: TouchEventHandler<HTMLTableCellElement>
    onTouchCancelCapture?: TouchEventHandler<HTMLTableCellElement>
    onTouchEnd?: TouchEventHandler<HTMLTableCellElement>
    onTouchEndCapture?: TouchEventHandler<HTMLTableCellElement>
    onTouchMove?: TouchEventHandler<HTMLTableCellElement>
    onTouchMoveCapture?: TouchEventHandler<HTMLTableCellElement>
    onTouchStart?: TouchEventHandler<HTMLTableCellElement>
    onTouchStartCapture?: TouchEventHandler<HTMLTableCellElement>
    onTransitionCancel?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionCancelCapture?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionEnd?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionEndCapture?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionRun?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionRunCapture?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionStart?: TransitionEventHandler<HTMLTableCellElement>
    onTransitionStartCapture?: TransitionEventHandler<HTMLTableCellElement>
    onWheel?: WheelEventHandler<HTMLTableCellElement>
    onWheelCapture?: WheelEventHandler<HTMLTableCellElement>
    render?: DOMRenderFunction<"div" | "td", CellRenderProps>

    Overrides the default DOM element with a custom render function. This allows rendering existing components with built-in styles and behaviors such as router links, animation libraries, and pre-styled components.

    Requirements:

    • You must render the expected element type (e.g. if <button> is expected, you cannot render an <a>).
    • Only a single root DOM element can be rendered (no fragments).
    • You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate.
    src?: string
    style?: StyleOrFunction<CellRenderProps>

    The inline style for the element. A function may be provided to compute the style based on component state.

    suppressHydrationWarning?: boolean

    A React-only flag that suppresses the warning React normally logs when an element's server-rendered content doesn't match the client render during hydration. See React docs.

    textValue?: string

    A string representation of the cell's contents, used for features like typeahead.

    translate?: "yes" | "no"