Skip to content

Add all Field components to react-field#24426

Merged
behowell merged 30 commits into
microsoft:masterfrom
behowell:field/add-all-components
Sep 7, 2022
Merged

Add all Field components to react-field#24426
behowell merged 30 commits into
microsoft:masterfrom
behowell:field/add-all-components

Conversation

@behowell

@behowell behowell commented Aug 19, 2022

Copy link
Copy Markdown
Contributor

Current Behavior

Only InputField was added by PR #24394. The rest of the Field components still need to be implemented.

New Behavior

Add the following components:

  • CheckboxField
  • ComboboxField
  • DropdownField
  • RadioGroupField
  • SelectField
  • SliderField
  • SpinButtonField
  • SwitchField
  • TextareaField

Move most storybook stories directly under Field/*. Each individual component has one Default story to display props and basic example usage.

Related Issue(s)

Spec:

@fabricteam

fabricteam commented Aug 19, 2022

Copy link
Copy Markdown
Collaborator

📊 Bundle size report

🤖 This report was generated against ff6eaee1c2f0702585ec8b5d6545e564a0ef5a86

@codesandbox-ci

codesandbox-ci Bot commented Aug 19, 2022

Copy link
Copy Markdown

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 a5d5b04:

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

@size-auditor

size-auditor Bot commented Aug 19, 2022

Copy link
Copy Markdown

Asset size changes

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

Baseline commit: ff6eaee1c2f0702585ec8b5d6545e564a0ef5a86 (build)

@behowell
behowell marked this pull request as ready for review September 2, 2022 23:29
@behowell
behowell requested a review from a team as a code owner September 2, 2022 23:29
Comment thread packages/react-components/react-field/.storybook/main.js
@@ -0,0 +1 @@
SwitchField adds a Label, validation message, and hint text to the Switch control.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should this be like CheckboxField where a Label is not mentioned since Switch already has one?

Suggested change
SwitchField adds a Label, validation message, and hint text to the Switch control.
SwitchField adds a validation message and hint text to the Switch control.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This behavior is pending discussion with design. I'll update it once we decide how SwitchField should work.

import type { FieldProps } from '../../Field';
import { getFieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from '../../Field';

export type CheckboxFieldProps = Omit<FieldProps<typeof Checkbox>, 'label'> & {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does Switch also need to implement this behavior since it also already has a label prop?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm talking to Design about how the label prop of Switch should work. I logged this issue to implement the final behavior once we decide how it should work:

Comment thread packages/react-components/react-field/src/stories/Field/FieldDescription.md Outdated
@behowell
behowell requested a review from a team as a code owner September 7, 2022 00:06
@behowell
behowell merged commit 1112607 into microsoft:master Sep 7, 2022
@behowell
behowell deleted the field/add-all-components branch September 7, 2022 15:38
@behowell
behowell restored the field/add-all-components branch September 7, 2022 15:46
@behowell
behowell deleted the field/add-all-components branch September 7, 2022 15:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Field: Create all component-specific field components: SpinButtonField, SliderField, etc.

4 participants