[EuiCheckbox] Remove `type`/`inList` prop #7814

cee-chen · 2024-06-05T21:29:21Z

Summary

Note

This PR is merging into main and not a feature branch - I wanted the breaking type inList change in at the same time as our other June deprecations

Checkbox `type` breaking change

Discussed in [Storybook] Add stories for more components (form components) - Part 1 #7781 (comment)
Related Kibana PR removing usages: [EuiCheckbox] Remove inList type checkboxes kibana#184881

QA

EuiTable selection checkboxes render as before with no visual regressions

General checklist

Browser QA
- Checked for accessibility including keyboard-only and screenreader modes
- Checked in Chrome, Safari, Edge, and Firefox
  ~~- [ ] Checked in both light and dark modes~~
  - [ ] Checked in mobile
Docs site QA - N/A
- [ ] Added documentation - N/A, not documented
- Props have proper autodocs (using @default if default values are missing) and playground toggles
  ~~- [ ] Checked Code Sandbox works for any docs examples~~
Code quality checklist - N/A, tests should pass as before
Release checklist
- A changelog entry exists and is marked appropriately.
- If applicable, added the breaking change issue label (and filled out the breaking change checklist)
Designer checklist - N/A

- the mount/update logic isn't needed whatsoever that I can tell for indeterminate checkboxes, it still works with just a ref callback

github-actions · 2024-06-05T21:53:18Z

This PR contains breaking changes. The opener of this pull request is asked to perform the following due diligence steps below, to assist EUI in our next Kibana upgrade:

If this PR contains prop/API changes:
- Search through Kibana for <EuiComponent usages (example search)
- In the PR description or in a PR comment, include a count or list with the number of component usages in Kibana that will need to be updated (if that amount is "none", include that information as well)

Log | Bot Usage

mgadewoll

Awesome improvements! 🔥 The changes look good to me and components work as expected 👍

mgadewoll · 2024-06-06T14:27:36Z

packages/eui/src/components/form/checkbox/checkbox.tsx

-    indeterminate: false,
-    compressed: false,
-  };
+export const EuiCheckbox: FunctionComponent<EuiCheckboxProps> = ({


Awesome that you're going the extra mile to migrate this to a function component! ❤️

packages/eui/changelogs/upcoming/7814.md

- it isn't doing anything that _not passing a label_ doesn't already do - all Kibana and Cloud usages are already covered by the noLabel CSS/logic

kibanamachine · 2024-06-06T18:26:47Z

Preview staging links for this PR:

Docs site: https://eui.elastic.co/pr_7814/
Storybook: https://eui.elastic.co/pr_7814/storybook

elasticmachine · 2024-06-06T18:26:51Z

💚 Build Succeeded

Buildkite Build
Commit: 7ab5b2e

History

💚 Build #2112 succeeded 321ef0a

## Summary The `type="inList"` prop is about to be deprecated shortly by EUI (elastic/eui#7814), so this is being removed ahead of time. The same style already gets applied when no `label` prop is passed, so no visual regressions should occur (hence the removal of an unnecessary prop). That being said, we would appreciate a quick smoke check of the affected tables by CODEOWNERs to ensure your selection checkboxes look the same as before/unbroken. Thank you!

`v94.6.0` ⏩ `v95.0.0-backport.0` _[Questions? Please see our Kibana upgrade FAQ.](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)_ --- ## [`v95.0.0-backport.0`](https://github.com/elastic/eui/releases/v95.0.0-backport.0) **This is a backport release only intended for use by Kibana.** - Updated `EuiSteps` to support a new `titleSize="xxs"` style, which outputs the same title font size but smaller unnumbered step indicators ([#7813](elastic/eui#7813)) - Updated `EuiStepsHorizontal` to support a new `size="xs"` style, which outputs smaller unnumbered step indicators ([#7813](elastic/eui#7813)) - Updated `EuiStepNumber` to support new `titleSize="none"` which omits rendering step numbers, and will only render icons ([#7813](elastic/eui#7813)) ## [`v95.0.0`](https://github.com/elastic/eui/releases/v95.0.0) - Added `move` glyph to `EuiIcon` ([#7789](elastic/eui#7789)) - Updated `EuiBasicTable` and `EuiInMemoryTable`s with `selection` - the header row checkbox will now render an indeterminate state if some (but not all) rows are selected ([#7817](elastic/eui#7817)) **Bug fixes** - Fixed an `EuiDataGrid` visual bug when using `lineCount` row heights where the clamped text was still visible for some font sizes ([#7793](elastic/eui#7793)) - Fixed `EuiSearchBar`'s filter configs to always respect `autoClose: false` ([#7806](elastic/eui#7806)) **Breaking changes** - Removed deprecated `EUI_CHARTS_THEME_DARK`, `EUI_CHARTS_THEME_LIGHT` and `EUI_SPARKLINE_THEME_PARTIAL` exports ([#7682](elastic/eui#7682)) - Removed deprecated `euiPalettePositive` and `euiPaletteNegative`. Use `euiPaletteGreen` and `euiPaletteRed` instead ([#7808](elastic/eui#7808)) - Removed `type="inList"` from `EuiCheckbox`. Simply omit passing a `label` prop to render this style of checkbox ([#7814](elastic/eui#7814)) - Removed the unused `compressed` prop from `EuiCheckbox` and `EuiRadio`. This prop was not doing anything on individual components. ([#7818](elastic/eui#7818)) **CSS-in-JS conversions** - Converted `EuiCheckboxGroup` to Emotion ([#7818](elastic/eui#7818)) - Converted `EuiRadioGroup` to Emotion ([#7818](elastic/eui#7818)) --------- Co-authored-by: Cee Chen <constance.chen@elastic.co> Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Cee Chen <549407+cee-chen@users.noreply.github.com>

`v94.6.0` ⏩ `v95.0.0-backport.0` _[Questions? Please see our Kibana upgrade FAQ.](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)_ --- ## [`v95.0.0-backport.0`](https://github.com/elastic/eui/releases/v95.0.0-backport.0) **This is a backport release only intended for use by Kibana.** - Updated `EuiSteps` to support a new `titleSize="xxs"` style, which outputs the same title font size but smaller unnumbered step indicators ([elastic#7813](elastic/eui#7813)) - Updated `EuiStepsHorizontal` to support a new `size="xs"` style, which outputs smaller unnumbered step indicators ([elastic#7813](elastic/eui#7813)) - Updated `EuiStepNumber` to support new `titleSize="none"` which omits rendering step numbers, and will only render icons ([elastic#7813](elastic/eui#7813)) ## [`v95.0.0`](https://github.com/elastic/eui/releases/v95.0.0) - Added `move` glyph to `EuiIcon` ([elastic#7789](elastic/eui#7789)) - Updated `EuiBasicTable` and `EuiInMemoryTable`s with `selection` - the header row checkbox will now render an indeterminate state if some (but not all) rows are selected ([elastic#7817](elastic/eui#7817)) **Bug fixes** - Fixed an `EuiDataGrid` visual bug when using `lineCount` row heights where the clamped text was still visible for some font sizes ([elastic#7793](elastic/eui#7793)) - Fixed `EuiSearchBar`'s filter configs to always respect `autoClose: false` ([elastic#7806](elastic/eui#7806)) **Breaking changes** - Removed deprecated `EUI_CHARTS_THEME_DARK`, `EUI_CHARTS_THEME_LIGHT` and `EUI_SPARKLINE_THEME_PARTIAL` exports ([elastic#7682](elastic/eui#7682)) - Removed deprecated `euiPalettePositive` and `euiPaletteNegative`. Use `euiPaletteGreen` and `euiPaletteRed` instead ([elastic#7808](elastic/eui#7808)) - Removed `type="inList"` from `EuiCheckbox`. Simply omit passing a `label` prop to render this style of checkbox ([elastic#7814](elastic/eui#7814)) - Removed the unused `compressed` prop from `EuiCheckbox` and `EuiRadio`. This prop was not doing anything on individual components. ([elastic#7818](elastic/eui#7818)) **CSS-in-JS conversions** - Converted `EuiCheckboxGroup` to Emotion ([elastic#7818](elastic/eui#7818)) - Converted `EuiRadioGroup` to Emotion ([elastic#7818](elastic/eui#7818)) --------- Co-authored-by: Cee Chen <constance.chen@elastic.co> Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Cee Chen <549407+cee-chen@users.noreply.github.com>

cee-chen changed the title ~~Checkbox cleanup~~ [EuiCheckbox] Remove type/inList prop; [EuiBasicTable] Support indeterminate checkboxes in header row Jun 5, 2024

[EuiCheckbox][tech debt] EuiCheckbox from class to a function component

f377bcd

- the mount/update logic isn't needed whatsoever that I can tell for indeterminate checkboxes, it still works with just a ref callback

cee-chen force-pushed the checkbox-cleanup branch from fa481bb to 0dfb7d2 Compare June 5, 2024 21:38

cee-chen added the breaking change label Jun 5, 2024

cee-chen force-pushed the checkbox-cleanup branch 2 times, most recently from 3c193a6 to 321ef0a Compare June 5, 2024 22:04

cee-chen mentioned this pull request Jun 5, 2024

[EuiCheckbox] Remove inList type checkboxes elastic/kibana#184881

Merged

cee-chen marked this pull request as ready for review June 5, 2024 22:53

cee-chen requested a review from a team as a code owner June 5, 2024 22:53

tkajtoch self-requested a review June 6, 2024 12:06

mgadewoll approved these changes Jun 6, 2024

View reviewed changes

[EuiCheckbox] 🔥 Remove type="inList" prop

7ab5b2e

- it isn't doing anything that _not passing a label_ doesn't already do - all Kibana and Cloud usages are already covered by the noLabel CSS/logic

cee-chen force-pushed the checkbox-cleanup branch from 321ef0a to 7ab5b2e Compare June 6, 2024 18:00

cee-chen changed the title ~~[EuiCheckbox] Remove type/inList prop; [EuiBasicTable] Support indeterminate checkboxes in header row~~ [EuiCheckbox] Remove type/inList prop Jun 6, 2024

cee-chen requested a review from mgadewoll June 6, 2024 18:06

cee-chen mentioned this pull request Jun 6, 2024

[EuiBasicTable] Support indeterminate checkboxes in header row #7817

Merged

8 tasks

cee-chen merged commit c0148bf into elastic:main Jun 6, 2024
5 checks passed

cee-chen deleted the checkbox-cleanup branch June 6, 2024 18:33

tkajtoch mentioned this pull request Jun 11, 2024

Upgrade EUI to v95.0.0 elastic/kibana#185943

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[EuiCheckbox] Remove `type`/`inList` prop #7814

[EuiCheckbox] Remove `type`/`inList` prop #7814

cee-chen commented Jun 5, 2024 •

edited

Loading

github-actions bot commented Jun 5, 2024 •

edited by cee-chen

Loading

mgadewoll left a comment

mgadewoll Jun 6, 2024

kibanamachine commented Jun 6, 2024

elasticmachine commented Jun 6, 2024

[EuiCheckbox] Remove type/inList prop #7814

[EuiCheckbox] Remove type/inList prop #7814

Conversation

cee-chen commented Jun 5, 2024 • edited Loading

Summary

Checkbox type breaking change

QA

General checklist

github-actions bot commented Jun 5, 2024 • edited by cee-chen Loading

mgadewoll left a comment

Choose a reason for hiding this comment

mgadewoll Jun 6, 2024

Choose a reason for hiding this comment

kibanamachine commented Jun 6, 2024

elasticmachine commented Jun 6, 2024

💚 Build Succeeded

History

[EuiCheckbox] Remove `type`/`inList` prop #7814

[EuiCheckbox] Remove `type`/`inList` prop #7814

cee-chen commented Jun 5, 2024 •

edited

Loading

Checkbox `type` breaking change

github-actions bot commented Jun 5, 2024 •

edited by cee-chen

Loading