reflex-dev/reflex · error · TypeError

Expected a Component or callable, got {component!r} of type

Error message

Expected a Component or callable, got {component!r} of type {type(component)}

What it means

rx.component()-style conversion (into_component) accepts a Component instance, a callable returning a Component, or None-like shortcuts; anything else that isn't callable raises TypeError. The value's repr and type are included to help identify the bad value, typically a string/Var/attribute accessed by mistake.

Source

Thrown at reflex/compiler/compiler.py:910

def into_component(component: Component | ComponentCallable) -> Component:
    """Convert a component to a Component.

    Args:
        component: The component to convert.

    Returns:
        The converted component.

    Raises:
        TypeError: If the component is not a Component.

    # noqa: DAR401
    """
    if (converted := _into_component_once(component)) is not None:
        return converted
    if not callable(component):
        msg = f"Expected a Component or callable, got {component!r} of type {type(component)}"
        raise TypeError(msg)

    try:
        component_called = component()
    except KeyError as e:
        if isinstance(e, ReflexError):
            _modify_exception(e)
            raise
        key = e.args[0] if e.args else None
        if key is not None and isinstance(key, Var):
            raise TypeError(
                "Cannot access a primitive map with a Var. Consider calling rx.Var.create() on the map."
            ).with_traceback(e.__traceback__) from None
        raise
    except TypeError as e:
        if isinstance(e, ReflexError):
            _modify_exception(e)
            raise
        message = e.args[0] if e.args else None

View on GitHub (pinned to 45b8ed5ab7)

Solutions

  1. Wrap the value in an appropriate component (rx.text(value) for strings) or call the factory to produce a Component
  2. Check the repr/type in the message to find where the bad value enters your layout
  3. If the value may be conditionally a component, use rx.cond(...) instead of relying on truthiness
  4. Add type annotations (rx.Component) to render/page functions so mypy/pyright catches it early

Example fix

# before
def index():
    return State.message  # TypeError: Expected a Component or callable
# after
def index():
    return rx.text(State.message)
Defensive patterns

Strategy: type-guard

Type guard

from reflex.component import Component
from collections.abc import Callable

def is_renderable(value) -> bool:
    return isinstance(value, Component) or callable(value)

Try / catch

try:
    child = rx.component(value)
except TypeError as e:
    if "Expected a Component or callable" in str(e):
        child = rx.text(str(value))
    else:
        raise

Prevention

When it happens

Trigger: Passing a non-Component, non-callable value where a component is expected: a plain string, a number, a Var, a dict, or the result of calling something that returned None/non-Component. Common: forgetting to call a component factory (though that yields a Component only when called), or using State.some_var where a component was meant, or referencing an undefined attribute that resolved to a non-callable.

Common situations: Refactoring render methods and returning a Var or string instead of rx.text(...); copy-paste from docs where a component was replaced by its string name; passing component props through generic wrappers that lose the type.

Related errors


AI-assisted analysis of reflex-dev/reflex@45b8ed5ab7 (2026-08-28). Data as JSON: /api/errors/b7151e9b5c0a1705. Report an issue: GitHub.