rowSpan Property

[dragos-rosca]

I needed to add "rowSpan" to my <Td> component and it didn't work. Then I looked over the code and saw that the "colSpan" attribute is being considered and when this is sent to the component all the other props are also sent to the html <td> component.

This means that if I use <Td rowSpan={2}>[...]</Td> the "rowSpan" attribute will get ignored but if I use something like <Td colSpan={1} rowSpan={2}>[...]</Td> my "rowSpan" attribute will be passed to the html <td> component and I will get my desired functionality.

Can you please pass the props to the html <td> component when there is no "colSpan" involved?

class TdInner extends React.Component {
  render() {
    if (this.props.colSpan) {
      return <td {...allowed(this.props)} />
    }
    const { headers, children, columnKey } = this.props
    const classes = (this.props.className || '') + ' pivoted'
    return (
      <td className={classes} {...allowed(this.props)}> {/*<<=== Here I added the props */}
        <div className="tdBefore">{headers[columnKey]}</div>
        {children || <div>&nbsp;</div>}
      </td>
    )
  }
}

[coston]

Hey @dragos-rosca! Thanks for bringing this issue to light. Would you like to contribute a pull request?

[dragos-rosca]

Hello, thank you for the opportunity but I think you guys will do a better job.
Like there's a bug in my comment that overrides the "className" property in the <td> excluding your "pivoted" class.

[dragos-rosca]

I created a fork and I will add the code the best I can. See you at pull request!

[coston]

fixed with #116

[coston]

Thank you @dragos-rosca!