Skip to content

feat(tokens): Add colorNeutralBackgroundAlpha and colorNeutralStrokeAlpha tokens#27034

Merged
layershifter merged 10 commits intomicrosoft:masterfrom
miroslavstastny:feat/theme-tokens
Mar 15, 2023
Merged

feat(tokens): Add colorNeutralBackgroundAlpha and colorNeutralStrokeAlpha tokens#27034
layershifter merged 10 commits intomicrosoft:masterfrom
miroslavstastny:feat/theme-tokens

Conversation

@miroslavstastny
Copy link
Member

@miroslavstastny miroslavstastny commented Mar 2, 2023

Adds colorNeutralBackgroundAlpha, colorNeutralBackgroundAlpha2 and colorNeutralStrokeAlpha tokens

image

Related Issue(s)

@size-auditor
Copy link

size-auditor bot commented Mar 2, 2023

Asset size changes

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

Baseline commit: 746ca114924046a84e8aa76bb514d68c8d81ddf3 (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Mar 2, 2023

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 1304 1295 5000
Button mount 933 929 5000
Field mount 1981 1937 5000
FluentProvider mount 1538 1548 5000
FluentProviderWithTheme mount 585 583 10
FluentProviderWithTheme virtual-rerender 549 529 10
FluentProviderWithTheme virtual-rerender-with-unmount 586 583 10
InfoButton mount 521 518 5000
MakeStyles mount 1943 1947 50000
Persona mount 2842 2845 5000
SpinButton mount 2265 2231 5000

@codesandbox-ci
Copy link

codesandbox-ci bot commented Mar 2, 2023

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 3ae2cb4:

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

@fabricteam
Copy link
Collaborator

fabricteam commented Mar 2, 2023

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-components
react-components: Button, FluentProvider & webLightTheme
67.03 kB
18.099 kB
67.15 kB
18.121 kB
120 B
22 B
react-components
react-components: FluentProvider & webLightTheme
37.861 kB
12.034 kB
37.981 kB
12.053 kB
120 B
19 B
react-theme
Teams: all themes
30.908 kB
6.714 kB
31.33 kB
6.764 kB
422 B
50 B
react-theme
Teams: Light theme
17.776 kB
5.141 kB
17.895 kB
5.162 kB
119 B
21 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-accordion
Accordion (including children components)
88.789 kB
26.532 kB
react-alert
Alert
90.467 kB
22.106 kB
react-avatar
Avatar
54.149 kB
14.571 kB
react-avatar
AvatarGroup
18.064 kB
6.664 kB
react-avatar
AvatarGroupItem
70.425 kB
19.075 kB
react-badge
Badge
25.746 kB
7.568 kB
react-badge
CounterBadge
26.725 kB
7.874 kB
react-badge
PresenceBadge
28.318 kB
7.779 kB
react-button
Button
39.613 kB
9.935 kB
react-button
CompoundButton
46.795 kB
11.405 kB
react-button
MenuButton
44.296 kB
11.255 kB
react-button
SplitButton
52.846 kB
12.866 kB
react-button
ToggleButton
57.982 kB
11.853 kB
react-card
Card - All
83.548 kB
23.894 kB
react-card
Card
78.317 kB
22.433 kB
react-card
CardFooter
9.045 kB
3.806 kB
react-card
CardHeader
10.984 kB
4.509 kB
react-card
CardPreview
9.852 kB
4.159 kB
react-checkbox
Checkbox
35.895 kB
10.82 kB
react-checkbox
CheckboxField
42.8 kB
12.714 kB
react-combobox
Combobox (including child components)
88.7 kB
28.099 kB
react-combobox
ComboboxField
85.066 kB
27.838 kB
react-combobox
Dropdown (including child components)
87.387 kB
27.842 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
206.317 kB
57.147 kB
react-dialog
Dialog (including children components)
92.72 kB
27.216 kB
react-divider
Divider
19.754 kB
6.68 kB
react-field
Field
20.397 kB
7.053 kB
react-image
Image
13.897 kB
4.974 kB
react-infobutton
InfoButton
130.438 kB
39.407 kB
react-input
Input
25.664 kB
7.695 kB
react-input
InputField
35.613 kB
10.592 kB
react-label
Label
12.461 kB
4.57 kB
react-link
Link
12.306 kB
5.073 kB
react-menu
Menu (including children components)
130.333 kB
39.499 kB
react-menu
Menu (including selectable components)
133.509 kB
40.037 kB
react-overflow
hooks only
11.214 kB
4.271 kB
react-persona
Persona
61.21 kB
16.521 kB
react-popover
Popover
117.51 kB
35.799 kB
react-portal
Portal
11.715 kB
4.265 kB
react-portal-compat
PortalCompatProvider
6.324 kB
2.129 kB
react-positioning
usePositioning
24.01 kB
8.793 kB
react-progress
ProgressBar
15.846 kB
5.658 kB
react-progress
ProgressField
26.289 kB
8.819 kB
react-provider
FluentProvider
19.928 kB
6.832 kB
react-radio
Radio
35.392 kB
11.117 kB
react-radio
RadioGroup
17.872 kB
6.523 kB
react-radio
RadioGroupField
28.023 kB
9.681 kB
react-select
Select
26.87 kB
8.761 kB
react-select
SelectField
36.179 kB
11.28 kB
react-slider
Slider
35.816 kB
11.043 kB
react-slider
SliderField
45.717 kB
13.975 kB
react-spinbutton
SpinButton
35.559 kB
10.351 kB
react-spinbutton
SpinButtonField
44.565 kB
12.765 kB
react-spinner
Spinner
23.336 kB
7.18 kB
react-switch
Switch
30.943 kB
9.25 kB
react-switch
SwitchField
37.805 kB
11.148 kB
react-table
DataGrid
149.792 kB
40.502 kB
react-table
Table (Primitives only)
46.798 kB
12.557 kB
react-table
Table as DataGrid
137.684 kB
35.154 kB
react-table
Table (Selection only)
85.511 kB
21.173 kB
react-table
Table (Sort only)
84.832 kB
20.982 kB
react-text
Text - Default
14.898 kB
5.31 kB
react-text
Text - Wrappers
15.571 kB
5.23 kB
react-textarea
Textarea
28.981 kB
9.071 kB
react-textarea
TextareaField
39.334 kB
12.008 kB
react-theme
Single theme token import
69 B
89 B
react-tooltip
Tooltip
49.351 kB
16.799 kB
🤖 This report was generated against 746ca114924046a84e8aa76bb514d68c8d81ddf3

@fabricteam
Copy link
Collaborator

fabricteam commented Mar 2, 2023

🕵 fluentuiv9 No visual regressions between this PR and main

@miroslavstastny miroslavstastny requested review from a team and GeoffCoxMSFT as code owners March 2, 2023 12:21
@miroslavstastny miroslavstastny requested a review from a team as a code owner March 2, 2023 14:20
@Hotell Hotell removed their assignment Mar 3, 2023
miroslavstastny and others added 2 commits March 6, 2023 15:55
Co-authored-by: Martin Hochel <hochelmartin@gmail.com>
@layershifter layershifter enabled auto-merge (squash) March 15, 2023 07:58
@layershifter layershifter merged commit 76e6598 into microsoft:master Mar 15, 2023
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Mar 15, 2023
* master: (141 commits)
  chore: prerequisite changes before migrating v9 packages to SWC based transpilation (microsoft#26965)
  feat: Add InfoLabel component (microsoft#27118)
  fix(tools): update migrate-converged generator to add node field to package.json exports map (microsoft#27152)
  applying package updates
  fix: Embed play/pause indicator should render correctly in high contrast mode (microsoft#27213)
  feat(tokens): Add colorNeutralBackgroundAlpha and colorNeutralStrokeAlpha tokens (microsoft#27034)
  chore: Prepare release 0.66.4 (microsoft#27163)
  fix(react-datepicker-compat): Fix text entry issues with input (microsoft#27204)
  fix: Smooth out animation of indeterminate progress bar (microsoft#27201)
  Add cxe-red as a codeowner of react-file-type-icons (microsoft#27147)
  Added documentation about custom style hooks (microsoft#27087)
  Custom style react-text (microsoft#27078)
  Custom style react-image (microsoft#27066)
  Add JSDoc for tabster focus indicator selector (microsoft#27041)
  Theme designer: Move colors to local files (microsoft#27191)
  docs(react-card): move card out of preview (microsoft#27185)
  Include values in typography table (microsoft#27189)
  feat: accept a className in `mountNode` in `Portal` (microsoft#27008)
  RFC: Extend `mountNode` prop in `Portal` (microsoft#27009)
  applying package updates
  ...
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Mar 15, 2023
* master: (141 commits)
  chore: prerequisite changes before migrating v9 packages to SWC based transpilation (microsoft#26965)
  feat: Add InfoLabel component (microsoft#27118)
  fix(tools): update migrate-converged generator to add node field to package.json exports map (microsoft#27152)
  applying package updates
  fix: Embed play/pause indicator should render correctly in high contrast mode (microsoft#27213)
  feat(tokens): Add colorNeutralBackgroundAlpha and colorNeutralStrokeAlpha tokens (microsoft#27034)
  chore: Prepare release 0.66.4 (microsoft#27163)
  fix(react-datepicker-compat): Fix text entry issues with input (microsoft#27204)
  fix: Smooth out animation of indeterminate progress bar (microsoft#27201)
  Add cxe-red as a codeowner of react-file-type-icons (microsoft#27147)
  Added documentation about custom style hooks (microsoft#27087)
  Custom style react-text (microsoft#27078)
  Custom style react-image (microsoft#27066)
  Add JSDoc for tabster focus indicator selector (microsoft#27041)
  Theme designer: Move colors to local files (microsoft#27191)
  docs(react-card): move card out of preview (microsoft#27185)
  Include values in typography table (microsoft#27189)
  feat: accept a className in `mountNode` in `Portal` (microsoft#27008)
  RFC: Extend `mountNode` prop in `Portal` (microsoft#27009)
  applying package updates
  ...
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.

[Feature]: Neutral Stroke Alpha + Neutral background alpha token

6 participants