Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add nameRenderer prop to RowHeaderCell #3362

Closed
DannyDelott opened this issue Feb 15, 2019 · 6 comments · Fixed by #3447
Closed

Add nameRenderer prop to RowHeaderCell #3362

DannyDelott opened this issue Feb 15, 2019 · 6 comments · Fixed by #3447

Comments

@DannyDelott
Copy link
Contributor

Feature request

Hi Blueprint team,

I'm currently working on a Blueprint Table and need to add a Tooltip to the RowHeaderCell text.

There is precedent for this in ColumnHeaderCell via the nameRenderer prop, however this functionality does not exist yet for the RowHeaderCell.

If the approach from ColumnHeaderCell can be repurposed here, I'm happy to submit a PR. This is a great UI library with a very thoughtful API.

Examples

<RowHeaderCell
  name="Population"
  nameRenderer={
    (name, index) =>
      <Tooltip content="The population as determined by the 2016 US Census">
        {name}
      </Tooltip>
  } />
@adidahiya
Copy link
Contributor

What kind of information are you showing in this tooltip? Can you share an example? We're likely open to PRs here, just want to understand the context a bit more first.

@adidahiya
Copy link
Contributor

Sorry, to elaborate: what are the columns in your example above? Why is population a row instead of a column?

@DannyDelott
Copy link
Contributor Author

Thanks for the response! Our columns describe different urban planning scenarios, and the rows correspond to parameters in those scenario.

Here's a screenshot of the UI mock we're working from:

image

@adidahiya
Copy link
Contributor

It looks like the data there is transposed in a way that doesn't really match how the table was designed to be used. @blueprintjs/table is more like a spreadsheet, where we expect the columns to be different parameters / attributes for a given entry, like a database. I think you're better off using the HTML table in @blueprintjs/core to implement that UI mock. Unfortunately we don't have an in-between component (there have been requests for things like #3368).

@DannyDelott
Copy link
Contributor Author

I think that's a great testimony for the flexibility of this table component then! We've been able to get very close to our design, save for this tooltipped row header. 😄

Since we still use the interactive features like right-click menus and multi-select, etc, using the HTML table doesn't quite fit our needs.

Our data model aside, this still seems like a useful feature for row headers and I'm happy to make a PR for it if it's an acceptable change.

@adidahiya
Copy link
Contributor

Ok, go for it 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants