[Emotion] Convert EuiDescriptionList by breehall · Pull Request #5971 · elastic/eui

breehall · 2022-06-15T15:51:50Z

Summary

This PR converts EuiDescriptionList and the euiBreakpoint mixin to Emotion

Updated the EuiDescriptionListTitle and EuiDescriptionListDescription by allowing them to contain their own styles based on the align, type, textStyle, and compressed props. These components receive access to the props from the new EuiDescriptionListContext which passes down the four props.

While this is a change in architecture, I don't believe that this would be a breaking change because nothing will change with the implementation for EuiDescriptionList.

Updated EuiDescriptionList docs examples to give more insight on using EuiDescriptionListTitle and EuiDescriptionListDescription manually.

Checklist

…escription-list Merge in latest code from main

…EuiDescriptionList styles

…ted the euiBreakopint mixin to TypeScript

…escription-list Pulling in code from main

cee-chen · 2022-06-16T20:36:14Z

jenkins test this

…atements

kibanamachine · 2022-06-20T15:38:17Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

…nts to be displayed with flex instead of block

kibanamachine · 2022-06-20T20:16:05Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

…escription-list Pulling in the latest code from main

kibanamachine · 2022-06-20T22:06:12Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

kibanamachine · 2022-06-20T23:06:56Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

src/components/description_list/__snapshots__/description_list.test.tsx.snap

breehall · 2022-06-27T13:43:00Z

Hey @constancecchen, do you mind reviewing this?

cee-chen · 2022-06-27T16:48:22Z

Hey Bree! No problem, but as a heads up I'm currently working on the latest Kibana EUI upgrade and reviewing Elizabet's EuiIcon PR, so it may take me a day to get to reviewing this PR.

breehall · 2022-06-27T17:27:40Z

@constancecchen It completely slipped my mind that you're currently working on the upgrade! I don't want to overload you. Is it ok if I reassign it?

cchaos · 2022-06-27T17:31:29Z

@breehall I can take a pass at it for you today

breehall · 2022-06-27T17:32:18Z

@cchaos Awesome, thank you!

kibanamachine · 2022-06-27T19:26:15Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

…tyles.ts Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

…ps. The type prop will be available by accessing the data-type attribute on EuiDescriptionList

…escription-list Pulling in main branch

…l/eui into emotion/description-list Pulling in current code from emotion/description-list branch

kibanamachine · 2022-07-26T14:39:29Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

…the function. Updated snapshots that were required from the move of the data-type attribute from the child DescriptionList elements to the parent

kibanamachine · 2022-07-26T15:29:56Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

src/components/description_list/description_list_description.styles.ts

src/components/description_list/description_list_title.styles.ts

src/components/description_list/description_list_title.tsx

cee-chen · 2022-07-27T15:36:46Z

@breehall Looking good! My only blocking comments are on on the xl media query selector, everything else is optional.

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

kibanamachine · 2022-07-27T16:17:13Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

kibanamachine · 2022-07-27T17:42:10Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

cee-chen

🎉 It's happening!! Thanks for your patience with all my feedback!

kibanamachine · 2022-07-27T20:46:00Z

Preview documentation changes for this PR: https://eui.elastic.co/pr_5971/

breehall added 6 commits June 8, 2022 10:27

inital commit in EuiDescriptionList Emotion conversion

79da367

Merge branch 'main' of https://github.com/breehall/eui into emotion/d…

b8ed043

…escription-list Merge in latest code from main

Update description_list.styles.ts with the row and responsive column …

8578777

…EuiDescriptionList styles

Converted the remaining styles for DescriptionList to Emotion. Conver…

f117767

…ted the euiBreakopint mixin to TypeScript

Merge branch 'main' of https://github.com/breehall/eui into emotion/d…

b0d7ced

…escription-list Pulling in code from main

Updated DescriptionList tests and added Changlelog entry

374be59

breehall added 2 commits June 20, 2022 11:03

Removed original Sass file for DescriptionList and removed console st…

aabedbe

…atements

CHANGELOG

9e5d1e6

Resolved bug in descriptionlist column styling that caused list eleme…

94cca23

…nts to be displayed with flex instead of block

breehall added 2 commits June 20, 2022 16:18

Merge branch 'main' of https://github.com/breehall/eui into emotion/d…

6bceb4c

…escription-list Pulling in the latest code from main

Changelog update

2508142

Update snapshots for DescriptionList

58d6928

breehall marked this pull request as ready for review June 21, 2022 00:27

TGspace reviewed Jun 21, 2022

View reviewed changes

src/components/description_list/__snapshots__/description_list.test.tsx.snap Outdated Show resolved Hide resolved

breehall mentioned this pull request Jun 22, 2022

[Meta][CSS-in-JS] Component conversions #5685

Closed

49 tasks

breehall requested a review from cee-chen June 27, 2022 13:42

cchaos added 2 commits June 27, 2022 14:10

Fixed duplicate class keys

d1a55ca

WIP: Moving styles to EuiDescriptionListTitle

2bb8bba

breehall marked this pull request as draft June 27, 2022 19:41

breehall and others added 11 commits July 26, 2022 10:10

Update src/components/description_list/description_list_title.styles.ts

628c0f5

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_title.styles.ts

6a46bb2

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_title.styles.ts

c88604c

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_description.s…

4de25a2

…tyles.ts Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_title.styles.ts

e4e0b58

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_title.styles.ts

773fe6a

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_title.styles.ts

5e88e0d

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update src/components/description_list/description_list_title.styles.ts

c296617

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Removed classNames for the type, align, textStyle, and compressed pro…

dd57a4b

…ps. The type prop will be available by accessing the data-type attribute on EuiDescriptionList

Merge branch 'main' of https://github.com/breehall/eui into emotion/d…

dfe232e

…escription-list Pulling in main branch

Merge branch 'emotion/description-list' of https://github.com/breehal…

d82ebf2

…l/eui into emotion/description-list Pulling in current code from emotion/description-list branch

Updated parameters of euiBreakpoint to match the latest iteration of …

f1f73d6

…the function. Updated snapshots that were required from the move of the data-type attribute from the child DescriptionList elements to the parent

cee-chen reviewed Jul 27, 2022

View reviewed changes

src/components/description_list/description_list_description.styles.ts Outdated Show resolved Hide resolved

cee-chen reviewed Jul 27, 2022

View reviewed changes

src/components/description_list/description_list_title.styles.ts Outdated Show resolved Hide resolved

cee-chen reviewed Jul 27, 2022

View reviewed changes

src/components/description_list/description_list_title.styles.ts Outdated Show resolved Hide resolved

cee-chen reviewed Jul 27, 2022

View reviewed changes

src/components/description_list/description_list_title.tsx Outdated Show resolved Hide resolved

Update src/components/description_list/description_list_title.styles.ts

1b792ea

Co-authored-by: Constance <constancecchen@users.noreply.github.com>

Update required EuiDescriptionList child test cases

d4ee78b

[PR feedback] DRY out context defaults in text

d7858c4

cee-chen approved these changes Jul 27, 2022

View reviewed changes

breehall merged commit 59df738 into elastic:main Jul 27, 2022

thompsongl mentioned this pull request Aug 15, 2022

Upgrade EUI to v62.2.3 elastic/kibana#138837

Merged

cee-chen mentioned this pull request Sep 13, 2023

[EuiDescriptionListTitle] Misc compressed style fixes #7185

Merged

4 tasks

breehall deleted the emotion/description-list branch September 18, 2023 19:36

Conversation

breehall commented Jun 15, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Checklist

Uh oh!

cee-chen commented Jun 16, 2022

Uh oh!

kibanamachine commented Jun 20, 2022

Uh oh!

kibanamachine commented Jun 20, 2022

Uh oh!

kibanamachine commented Jun 20, 2022

Uh oh!

kibanamachine commented Jun 20, 2022

Uh oh!

Uh oh!

breehall commented Jun 27, 2022

Uh oh!

cee-chen commented Jun 27, 2022

Uh oh!

breehall commented Jun 27, 2022

Uh oh!

cchaos commented Jun 27, 2022

Uh oh!

breehall commented Jun 27, 2022

Uh oh!

kibanamachine commented Jun 27, 2022

Uh oh!

kibanamachine commented Jul 26, 2022

Uh oh!

kibanamachine commented Jul 26, 2022

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

cee-chen commented Jul 27, 2022

Uh oh!

kibanamachine commented Jul 27, 2022

Uh oh!

kibanamachine commented Jul 27, 2022

Uh oh!

cee-chen left a comment

Choose a reason for hiding this comment

Uh oh!

kibanamachine commented Jul 27, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

breehall commented Jun 15, 2022 •

edited

Loading