Card Components require "children" prop despite child views

[stakez]

Current behaviour

The card components (parent, title, content etc) demands explicit "children" prop even with child views.

Expected behaviour

The card components should not require "children" prop when child views are present

How to reproduce?

Create any Card components in a project.

Preview

Your Environment

software	version
ios	x
android	x
react-native	0.78.2
react-native-paper	5.13.3
node	x.x.x
npm or yarn	x.x.x
expo sdk	x.x.x

[adolfogc]

Hi, I'm observing the same error, temporarily using a View component instead confirmed the source of the error:

//<Card mode="elevated" style={{marginBottom}}>
<View style={{marginBottom}}>

I think the error is due to assuming that all possible child components access those properties:

https://github.com/callstack/react-native-paper/blob/main/src/components/Card/Card.tsx#L278

A potential fix:

  const content = (
    <View style={[styles.innerContainer, contentStyle]} testID={testID}>
      {React.Children.map(children, (child, index) => {
        if (!React.isValidElement(child)) {
          return child;
        }

        const childType = child.type;
        if (
          childType === CardContent ||
          childType === CardActions ||
          childType === CardCover ||
          childType === CardTitle
        ) {
          return React.cloneElement(child as React.ReactElement<any>, {
            index,
            total,
            siblings,
            borderRadiusStyles,
          });
        } else {
          return child;
        }
      })}
    </View>
  );

[fredguevs]

Hi! If no one is currently working on this, I'd like to take a crack at contributing to this issue as part of a university open source software engineering assignment.

[lukewalczak]

Hey folks! Can someone share a sample repro repository that illustrates the issue?

[adolfogc]

Hi @lukewalczak , the fix I suggested in my previous comment here is for a different run-time error that affects the Card component. I posted it in the wrong issue --probably should open a proper one for it.

[adolfogc]

Please see #4710, sorry for the confusion here.