Skip to content

feat: support items prop and render function#24125

Closed
ling1726 wants to merge 4 commits intomicrosoft:masterfrom
ling1726:feat/table-render-func
Closed

feat: support items prop and render function#24125
ling1726 wants to merge 4 commits intomicrosoft:masterfrom
ling1726:feat/table-render-func

Conversation

@ling1726
Copy link
Contributor

@ling1726 ling1726 commented Jul 28, 2022 •
edited
Loading

Rendering with React children is still supported, but this PR enables
the items prop with a render function for rows in TableBody. This allows the component to receive a items prop and a columns prop (in the future) which will be quite useful for managing internal state.

Also considering potentially removing the children API later

<Table items={items}>
  <TableBody>
    {(item: typeof items[0]) => (
      <TableRow>
        <TableCell media={item.file.icon}>{item.file.label}</TableCell>
        <TableCell
          media={<Avatar name={item.author.label} badge={{ status: item.author.status as PresenceBadgeStatus }} />}
        >
          {item.author.label}
        </TableCell>
        <TableCell>{item.lastUpdated.label}</TableCell>
        <TableCell media={item.lastUpdate.icon}>{item.lastUpdate.label}</TableCell>
      </TableRow>
    )}
  </TableBody>
</Table>

Addresses #23983

@ling1726
feat: support items prop and render function
f3a158a 
Rendering with React children is still supported, but this PR enables
the `items` prop with a render function for rows in `TableBody` for ease
of use
@github-actions github-actions bot added this to the July Project Cycle Q3 2022 milestone Jul 28, 2022
@fabricteam
Copy link
Collaborator

fabricteam commented Jul 28, 2022 •
edited
Loading

📊 Bundle size report

🤖 This report was generated against d89096c3760a269822a29aac7452719e1b1293c7

@codesandbox-ci
Copy link

codesandbox-ci bot commented Jul 28, 2022 •
edited
Loading

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 61b35de:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@size-auditor
Copy link

size-auditor bot commented Jul 28, 2022 •
edited
Loading

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: d89096c3760a269822a29aac7452719e1b1293c7 (build)

@ling1726 ling1726 marked this pull request as ready for review July 28, 2022 17:43
@ling1726 ling1726 requested a review from a team as a code owner July 28, 2022 17:43
@ling1726 ling1726 marked this pull request as draft July 29, 2022 06:16
@ling1726
Copy link
Contributor Author

ling1726 commented Jul 29, 2022

Moving as draft, not sure if there are really any benefits to render functions now that I think about it

@ling1726 ling1726 mentioned this pull request Aug 4, 2022
Closed
@ling1726 ling1726 closed this Oct 17, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

@TristanWatanabe TristanWatanabe

Labels

None yet

Projects

None yet

Milestone

July Project Cycle Q3 2022

Development

Successfully merging this pull request may close these issues.

3 participants

@ling1726 @fabricteam @TristanWatanabe