refactor Progress to remove label and description slots by tomi-msft · Pull Request #25067 · microsoft/fluentui

tomi-msft · 2022-10-04T00:22:50Z

This PR is a followup to #24023. As per comments in #24418, Progress will be changed to more match the api surface of the html element, and a ProgressField component will be added to replace the label and description slots

…c-react into react-progress-refactor

fabricteam · 2022-10-04T00:32:03Z

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
`react-progress` Progress	`13.44 kB` `5.247 kB`	`11.25 kB` `4.514 kB`	`-2.19 kB` `-733 B`

_{🤖 This report was generated against 1c8b241a322ca3d2ddb5dbe78154bb7bab1271df}

codesandbox-ci · 2022-10-04T00:45:34Z

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 69898d9:

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

size-auditor · 2022-10-04T00:46:33Z

Asset size changes

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

Baseline commit: 1c8b241a322ca3d2ddb5dbe78154bb7bab1271df (build)

packages/react-components/react-progress/src/components/Progress/Progress.types.ts

packages/react-components/react-progress/src/components/Progress/useProgress.tsx

packages/react-components/react-progress/src/components/Progress/useProgressStyles.ts

packages/react-components/react-progress/src/stories/Progress/ProgressDeterminate.stories.tsx

Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>

packages/react-components/react-progress/src/components/Progress/Progress.types.ts

packages/react-components/react-progress/src/components/Progress/useProgress.tsx

packages/react-components/react-progress/src/components/Progress/useProgressStyles.ts

behowell · 2022-10-04T18:05:28Z

packages/react-components/react-progress/src/stories/Progress/ProgressDefault.stories.tsx

-  return <Progress {...props} percentComplete={50} />;
+  return <Progress {...props} />;
 };

 Default.parameters = {
  docs: {
    description: {
-      story: `Default determinate Progress bar`,
+      story: `Default indeterminate Progress bar`,


This is a bit of a style choice, but I'd actually recommend leaving the default story showing the determinate case (i.e. with value={0.5}), and have a separate story for the indeterminate case. Even though indeterminate is the "default" with no props, the determinate case seems like a more typical scenario.

I follow that, I'll make the default determinate and change the determinate story to indeterminate

packages/react-components/react-progress/src/components/Progress/Progress.types.ts

packages/react-components/react-progress/src/components/Progress/useProgressStyles.ts

Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

packages/react-components/react-progress/src/stories/Progress/ProgressIndeterminate.stories.tsx

packages/react-components/react-progress/src/stories/Progress/ProgressDefault.stories.tsx

…ProgressIndeterminate.stories.tsx Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

packages/react-components/react-progress/src/components/Progress/Progress.types.ts

…ss/Progress.types.ts Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

* master: (62 commits) chore(migrate-converged): add functionality to execute various v9 package file restructuring tasks (microsoft#24458) chore(react-dialog): updates stories (microsoft#25070) refactor Progress to remove label and description slots (microsoft#25067) fix(SplitButton): Remove borders from hover and pressed state in primary split buttons (microsoft#25059) chore(react-persona): Add vr, conformance, and unit tests (microsoft#25007) (docs): update Icon docs with examples (microsoft#24768) Split button/primary hc fix (microsoft#25066) chore(react-utilities): restricts trigger API types (microsoft#25044) Add utilities export @fluentui/style-utilities v8 (microsoft#25065) chore: migrate whole repo to webpack 5 (microsoft#24542) applying package updates BREAKING: refactor `useTable` to be composable (microsoft#24947) Added shims to shim packages (microsoft#25048) Add Progress SPEC (microsoft#24418) applying package updates chore(react-persona): Add bundle-size command for bundle-size fixtures (microsoft#25055) fix(Button): Remove margin added to buttons by Safari (microsoft#25052) fix: Menu triggers no longer take focus when they are mounted (microsoft#25016) chore: deletes react-trigger package (microsoft#25042) Fixed a minor typo: immmediately => immediately (microsoft#25036) ...

) * refactor Progress to remove label and description slots * api and snapshot update * Apply suggestions from code review Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com> * Apply suggestions from code review Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com> * api and stories update * Update packages/react-components/react-progress/src/stories/Progress/ProgressIndeterminate.stories.tsx Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com> * update stories * Update packages/react-components/react-progress/src/components/Progress/Progress.types.ts Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com> Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com> Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

refactor Progress to remove label and description slots

562fec3

tomi-msft requested a review from a team as a code owner October 4, 2022 00:22

msft-fluent-ui-bot assigned miroslavstastny Oct 4, 2022

Merge branch 'master' of https://github.com/OfficeDev/office-ui-fabri…

98d4ebd

…c-react into react-progress-refactor

github-actions bot added this to the October Project Cycle Q4 2022 milestone Oct 4, 2022

api and snapshot update

2c857da

khmakoto reviewed Oct 4, 2022

View reviewed changes

Apply suggestions from code review

c4cb7dc

Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>

behowell reviewed Oct 4, 2022

View reviewed changes

packages/react-components/react-progress/src/components/Progress/useProgressStyles.ts Outdated Show resolved Hide resolved

tomi-msft and others added 2 commits October 4, 2022 12:11

Apply suggestions from code review

836e4e2

Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

api and stories update

d2ea304

behowell reviewed Oct 4, 2022

View reviewed changes

packages/react-components/react-progress/src/stories/Progress/ProgressIndeterminate.stories.tsx Outdated Show resolved Hide resolved

behowell reviewed Oct 4, 2022

View reviewed changes

packages/react-components/react-progress/src/stories/Progress/ProgressDefault.stories.tsx Outdated Show resolved Hide resolved

tomi-msft and others added 2 commits October 4, 2022 13:43

Update packages/react-components/react-progress/src/stories/Progress/…

eab1032

…ProgressIndeterminate.stories.tsx Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

update stories

07d65df

behowell approved these changes Oct 4, 2022

View reviewed changes

packages/react-components/react-progress/src/components/Progress/Progress.types.ts Outdated Show resolved Hide resolved

Update packages/react-components/react-progress/src/components/Progre…

69898d9

…ss/Progress.types.ts Co-authored-by: Ben Howell <48106640+behowell@users.noreply.github.com>

tomi-msft enabled auto-merge (squash) October 5, 2022 04:09

tomi-msft merged commit 5a3ac20 into microsoft:master Oct 5, 2022

tomi-msft mentioned this pull request Oct 5, 2022

Progress #24980

Closed

21 tasks

Conversation

tomi-msft commented Oct 4, 2022

Uh oh!

fabricteam commented Oct 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Bundle size report

Uh oh!

codesandbox-ci bot commented Oct 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

size-auditor bot commented Oct 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Asset size changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

behowell Oct 4, 2022

Choose a reason for hiding this comment

Uh oh!

tomi-msft Oct 4, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

fabricteam commented Oct 4, 2022 •

edited

Loading

codesandbox-ci bot commented Oct 4, 2022 •

edited

Loading

size-auditor bot commented Oct 4, 2022 •

edited

Loading