[EuiDatePicker] `react-datepicker` to `src/`; use EUI services by thompsongl · Pull Request #5339 · elastic/eui

thompsongl · 2021-11-01T15:58:30Z

Summary

Beginning of #3901

📦 Moves react-datepicker inside src/
- Renames .jsx files to .js (up for discussion)
- Allows for direct import of DatePicker (no separate build step)
✨ Allows EuiDatePicker to use EUI components
- EuiPopover
- EuiFocusTrap
- EuiOutsideClickDetector
- EuiScreenReaderOnly
- Negates all react-datepicker dependencies

Discuss

🗑️ More removals from date_picker/react-datepicker/
- All build- and repo-related files are not necessary
- .babelrc and package.json files interfere with EUI build and need to be renamed
- Tests and docs?
📄 License
- Am I missing anything from a license perspective?
- Is keeping LICENSE in the directory enough?
⚠️ Breaking changes
- I think I avoided all breaking changes with the exception of popperProps, which was spread onto the Popper component but not documented in EUI

Fixes #3476, closes #3850

Checklist

Check against all themes for compatibility in both light and dark modes
Checked in mobile
Checked in Chrome, Safari, Edge, and Firefox
Props have proper autodocs and playground toggles

- [ ] Added documentation

Checked Code Sandbox works for any docs examples
Added or updated jest and cypress tests
Checked for breaking changes and labeled appropriately
Checked for accessibility including keyboard-only and screenreader modes
A changelog entry exists and is marked appropriately

kibanamachine · 2021-11-01T16:24:01Z

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

kibanamachine · 2021-11-01T18:00:07Z

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

kibanamachine · 2021-11-01T18:57:39Z

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

src/components/date_picker/react-datepicker/README.md

src/components/date_picker/react-datepicker/src/year_dropdown_options.js

src/components/popover/popover.tsx

cee-chen · 2021-11-03T19:25:59Z

Sorry just saw your PR description request for discussion:

🗑️ More removals from date_picker/react-datepicker/
All build- and repo-related files are not necessary
.babelrc and package.json files interfere with EUI build and need to be renamed
Tests and docs?

++ to removing stuff that isn't actually sources:

I'd nuke all the root-level build/repo related files except for README and LICENSE (just IMO) as well as scripts/
I'd definitely nuke docs-site/ and examples/hello-world/
I'm torn on docs/ and test/ - those seem mildly useful. And I just used docs/ (for example) to compare against the OG react-datepicker to confirm that it had onCalendarClose vs. EUI which did not. Since those 2 folders aren't overly hefty I think I'd vote for keeping them in and copying them manually if and when we go to react-datepicker for updates (I don't actually know if we ever even do that or if that's reasonable).

📄 License
Am I missing anything from a license perspective?
Is keeping LICENSE in the directory enough?

IIRC should be fine, but @chandlerprall certainly knows more than me!

kibanamachine · 2021-11-09T23:00:51Z

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

cchaos · 2021-11-10T14:50:57Z

I'd definitely nuke docs-site/ and examples/hello-world/

Yes please!!!

src/theme_dark.scss

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

kibanamachine · 2021-11-10T16:14:49Z

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

thompsongl · 2021-11-10T16:26:05Z

Update: Deleted everything except for src/ (obviously), test/, docs/, LICENSE, and README. Also renamed package.json to original.package.json (I like the idea of keeping it, but it needs to be renamed because babel is weird)

kibanamachine · 2021-11-10T16:53:22Z

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

kibanamachine · 2021-11-10T17:32:12Z

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

thompsongl · 2021-11-11T17:32:16Z

Hmm, something broke with the month / year dropdowns where the options are no longer selectable.

Fixed!

kibanamachine · 2021-11-11T17:57:25Z

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

cchaos

I clicked through our docs and couldn't find any other issues. I can't wait to convert these to real EUI components and no more positioning hacks!

src/components/date_picker/date_picker.tsx

src/components/date_picker/react-datepicker/src/index.js

Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com>

src/components/date_picker/date_picker.tsx

kibanamachine · 2021-11-11T22:26:07Z

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

cee-chen

Sweeet! I didn't find anything else personally on a second pass/skim/+quick QA - LGTM!

Also hot DANG

kibanamachine · 2021-11-11T23:35:29Z

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

chandlerprall

Can we exclude the docs & test directories from being published, similar to how the postinstall script is managed in .npmignore ?

Our license guidelines aren't very clear here, but I think it's safest and clearest to enforce having react-datepicker's MIT license head each file under its docs, src, and test dirs

thompsongl · 2021-11-16T21:07:26Z

I think it's safest and clearest to enforce having react-datepicker's MIT license head each file under its docs, src, and test dirs

c96c95e inlines the license in nested react-datepicker directories

Can we exclude the docs & test directories from being published, similar to how the postinstall script is managed in .npmignore ?

No further changes necessary to accomplish this. .npmignore already omits everything but .scss files, and the compile script ignores all other potentially matching files. Also confirmed the dist/ bundle does not include test/ or docs/ files.

kibanamachine · 2021-11-16T21:34:26Z

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

kibanamachine · 2021-11-16T22:09:37Z

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

thompsongl · 2021-11-17T15:51:18Z

jenkins test this

kibanamachine · 2021-11-17T16:22:14Z

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

chandlerprall · 2021-11-17T18:56:25Z

c96c95e inlines the license in nested react-datepicker directories

Confirmed!

No further changes necessary to accomplish this. .npmignore already omits everything but .scss files, and the compile script ignores all other potentially matching files. Also confirmed the dist/ bundle does not include test/ or docs/ files.

Ah, perfect! Tested with a yarn build locally to triple check and everything looks good to me ❤️

thompsongl added 5 commits October 29, 2021 14:47

move react-datepicker to src

441a4bc

update import statements

b7f2ed4

use eui components to avoid all react-datepicker dependencies

1f283ee

file extensions; prefix babel with . to allow jest to run

410b9d3

update build script

0e34847

snapshots

4e3c9a2

thompsongl marked this pull request as ready for review November 1, 2021 17:35

thompsongl added 2 commits November 1, 2021 13:22

readme update

1190cb3

clean up

2339bb5

cee-chen reviewed Nov 3, 2021

View reviewed changes

src/components/date_picker/react-datepicker/README.md Outdated Show resolved Hide resolved

cee-chen reviewed Nov 3, 2021

View reviewed changes

src/components/date_picker/react-datepicker/src/year_dropdown_options.js Outdated Show resolved Hide resolved

cee-chen reviewed Nov 3, 2021

View reviewed changes

src/components/popover/popover.tsx Show resolved Hide resolved

cee-chen mentioned this pull request Nov 8, 2021

[EuiDatePicker] eui's global css file clobbers react-datepicker's css #5356

Closed

Merge branch 'main' into 3901-datepicker

cdf614f

cchaos reviewed Nov 10, 2021

View reviewed changes

src/theme_dark.scss Show resolved Hide resolved

Update src/components/date_picker/react-datepicker/README.md

b8b06b7

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

remove unnecessary react-datepicker files

76f7a2e

snapshot update

134e6e4

CL

1161684

thompsongl requested a review from chandlerprall November 10, 2021 18:36

fix dropdown outside click detection

ee56038

cchaos approved these changes Nov 11, 2021

View reviewed changes

src/components/date_picker/date_picker.tsx Outdated Show resolved Hide resolved

src/components/date_picker/react-datepicker/src/index.js Outdated Show resolved Hide resolved

thompsongl and others added 2 commits November 11, 2021 15:46

Update src/components/date_picker/date_picker.tsx

c4ed08a

Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com>

review updates

23dc50a

cee-chen reviewed Nov 11, 2021

View reviewed changes

src/components/date_picker/date_picker.tsx Outdated Show resolved Hide resolved

clean up exports and d.ts

42829cb

cee-chen approved these changes Nov 11, 2021

View reviewed changes

cchaos mentioned this pull request Nov 15, 2021

[EuiDatePickerRange] Error state relies on color alone #4612

Closed

chandlerprall suggested changes Nov 16, 2021

View reviewed changes

thompsongl added 2 commits November 16, 2021 15:01

inline license

c96c95e

Merge branch 'main' into 3901-datepicker

1f4591d

thompsongl requested a review from chandlerprall November 16, 2021 21:07

Merge branch 'main' into 3901-datepicker

af9d576

chandlerprall approved these changes Nov 17, 2021

View reviewed changes

thompsongl merged commit e218320 into elastic:main Nov 17, 2021

1Copenut mentioned this pull request Nov 19, 2021

Bumping EUI to v41.2.2 elastic/kibana#119205

Merged

thompsongl mentioned this pull request Nov 22, 2021

[EuiSuperDatePicker] Ensure i18n coverage #5398

Closed

2 tasks

thompsongl mentioned this pull request Dec 6, 2021

2021 Roadmap - First 6 months #4054

Closed

24 tasks

cchaos mentioned this pull request Dec 21, 2021

[EuiDatePicker] Time selection only popover isn't positioned properly #5496

Closed

cee-chen mentioned this pull request May 4, 2022

May 2022 deprecations #5868

Merged

2 tasks

Conversation

thompsongl commented Nov 1, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Checklist

Uh oh!

kibanamachine commented Nov 1, 2021

Uh oh!

kibanamachine commented Nov 1, 2021

Uh oh!

kibanamachine commented Nov 1, 2021

Uh oh!

Uh oh!

Uh oh!

Uh oh!

cee-chen commented Nov 3, 2021

Uh oh!

kibanamachine commented Nov 9, 2021

Uh oh!

cchaos commented Nov 10, 2021

Uh oh!

Uh oh!

kibanamachine commented Nov 10, 2021

Uh oh!

thompsongl commented Nov 10, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

kibanamachine commented Nov 10, 2021

Uh oh!

kibanamachine commented Nov 10, 2021

Uh oh!

thompsongl commented Nov 11, 2021

Uh oh!

kibanamachine commented Nov 11, 2021

Uh oh!

cchaos left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

kibanamachine commented Nov 11, 2021

Uh oh!

cee-chen left a comment

Choose a reason for hiding this comment

Uh oh!

kibanamachine commented Nov 11, 2021

Uh oh!

chandlerprall left a comment

Choose a reason for hiding this comment

Uh oh!

thompsongl commented Nov 16, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

kibanamachine commented Nov 16, 2021

Uh oh!

kibanamachine commented Nov 16, 2021

Uh oh!

thompsongl commented Nov 17, 2021

Uh oh!

kibanamachine commented Nov 17, 2021

Uh oh!

chandlerprall commented Nov 17, 2021

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

thompsongl commented Nov 1, 2021 •

edited

Loading

thompsongl commented Nov 10, 2021 •

edited

Loading

thompsongl commented Nov 16, 2021 •

edited

Loading