[FilePicker] Update icon type from 'importAction' to 'export' by ragini-pandey · Pull Request #9351 · elastic/eui

ragini-pandey · 2026-02-02T11:10:42Z

Summary

Changed the default icon for EuiFilePicker from importAction to export. The export icon features an upward-pointing arrow which better represents the "upload" action that the file picker performs.

Files changed:

packages/eui/src/components/form/file_picker/file_picker.tsx - Updated icon type from importAction to export
packages/eui/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap - Updated snapshot to reflect the icon change
packages/eui/changelogs/upcoming/9013.md - Added changelog entry

Why are we making this change?

Closes #9013

The previous importAction icon (arrow pointing down) was misleading for a file upload component. As discussed in elastic/kibana#232845, the conventional usage of these icons is:

Arrow pointing up → "uploading" action (pushing data into the system)
Arrow pointing down → "downloading" action (pulling data from the system)

Since EuiFilePicker is used to upload files into the system, the export icon (arrow pointing up) is the correct choice.

Screenshots

Before	After

Impact to users

Non-breaking change: This is a visual-only change to the default icon
No action required: Users do not need to make any code changes
Visual difference: The file picker icon will now show an upward arrow instead of a downward arrow, which better communicates the upload action

QA

General checklist

Browser QA
- Checked in both light and dark modes
- Checked in both MacOS and Windows high contrast modes
- Checked in mobile
- Checked in Chrome, Safari, Edge, and Firefox
- Checked for accessibility including keyboard-only and screenreader modes
Docs site QA
- Added documentation - N/A (no new props or API changes)
- Props have proper autodocs - N/A
- ~~Checked Code Sandbox works for any docs examples~~ - N/A
Code quality checklist
- Added or updated jest and cypress tests - Updated snapshot
- Updated visual regression tests - N/A (icon change is intentional)
Release checklist
- A changelog entry exists and is marked appropriately
- ~~If applicable, added the breaking change issue label~~ - N/A (not a breaking change)
- ~~If the changes unblock an issue in a different repo, smoke tested carefully~~
Designer checklist
- If applicable, file an issue to update EUI's Figma library with any corresponding UI changes

github-actions · 2026-02-02T11:10:50Z

👋 Since this is a community submitted pull request, a Buildkite build has not been started automatically. Would an Elastic organization member please verify the contents of this pull request and kick off a build manually?

…d indication

…ter upload indication

… update

…-pandey/eui into fix/9013-file-picker-icon

weronikaolejniczak · 2026-02-02T12:12:44Z

buildkite test this

weronikaolejniczak · 2026-02-02T12:33:05Z

@JoseLuisGJ can you verify this is the expected glyph?

Before	After

weronikaolejniczak · 2026-02-04T10:34:00Z

Whenever we make changes that affect how components look, we run visual regression tests. This requires Docker and Storybook running, and this command: yarn workspace @elastic/eui test-visual-regression update --storiesFilter=EuiFilePicker. It's not something we can easily run in CI. I went ahead and pushed the updated reference images for you on 2f59aa6 😄 Once the CI passes, we can merge!

ragini-pandey · 2026-02-04T11:08:48Z

Whenever we make changes that affect how components look, we run visual regression tests. This requires Docker and Storybook running, and this command: yarn workspace @elastic/eui test-visual-regression update --storiesFilter=EuiFilePicker. It's not something we can easily run in CI. I went ahead and pushed the updated reference images for you on 2f59aa6 😄 Once the CI passes, we can merge!

I wasn’t aware of this before.
Thanks for explaining and for pushing the updated reference images 🙌
I’ll make sure to handle this correctly in upcoming PRs

weronikaolejniczak · 2026-02-05T15:40:28Z

buildkite test this

elasticmachine · 2026-02-05T15:59:16Z

💚 Build Succeeded

History

💚 Build #2555 succeeded e396f98

elasticmachine · 2026-02-05T16:18:22Z

💚 Build Succeeded

Buildkite Build
Commit: 2f59aa6

History

💚 Build #5693 succeeded e396f98

weronikaolejniczak

Thank you for contributing, @ragini-pandey 🙏🏻 It's a great PR, looking forward to seeing more!

## Dependency updates - `@elastic/eui`: v112.2.0 ⏩ v112.3.0 - `@elastic/eslint-plugin-eui`: v2.7.0 ⏩ v2.8.0 --- ## Package updates ### `@elastic/eui` [v112.3.0](https://github.com/elastic/eui/releases/tag/v112.3.0) - Added new `server` icon. ([#9355](elastic/eui#9355)) - Added `className` support to `EuiMarkdownEditor`'s `toolbarProps` for custom toolbar styling ([#9349](elastic/eui#9349)) - Updated `EuiFilePicker` to use the `upload` icon to better indicate uploads. ([#9351](elastic/eui#9351)) - Exported the flyout system store singleton and added an event observer for emitting close session events ([#9347](elastic/eui#9347)) - Updated `EuiIcon` to use standard dynamic imports for icon assets, enabling native support for modern bundlers (Rollup, Parcel) and improving initial load performance ([#9342](elastic/eui#9342)) **Bug fixes** - Fixed a potential crash in the flyout system: due to asynchronous state updates and React's batching behavior, it was possible to experience a crash when closing a managed flyout. ([#9356](elastic/eui#9356)) ### `@elastic/eslint-plugin-eui` v2.8.0 - Added new `icon-accessibility-rules` rule. ([#9357](elastic/eui#9357)) - Added new `badge-accessibility-rules` rule. ([#9354](elastic/eui#9354))

[FilePicker] Update icon type from 'importAction' to 'export'

9b3cf99

ragini-pandey requested a review from a team as a code owner February 2, 2026 11:10

github-actions Bot added the community contribution (Don't delete - used for automation) label Feb 2, 2026

[FilePicker] Update changelog to reflect icon change for better uploa…

fea013e

…d indication

weronikaolejniczak reviewed Feb 2, 2026

View reviewed changes

Comment thread packages/eui/changelogs/upcoming/9351.md

Update changelog to reflect improvement in EuiFilePicker icon for bet…

82b8249

…ter upload indication

ragini-pandey force-pushed the fix/9013-file-picker-icon branch from 0a20e86 to 82b8249 Compare February 2, 2026 11:19

ragini-pandey requested a review from weronikaolejniczak February 2, 2026 11:20

Merge branch 'main' into fix/9013-file-picker-icon

78ae4cb

weronikaolejniczak reviewed Feb 2, 2026

View reviewed changes

Comment thread packages/eui/changelogs/upcoming/9351.md Outdated

ragini-pandey added 2 commits February 2, 2026 17:14

Remove redundant section header from changelog for EuiFilePicker icon…

0e69182

… update

Merge branch 'fix/9013-file-picker-icon' of https://github.com/ragini…

e396f98

…-pandey/eui into fix/9013-file-picker-icon

ragini-pandey requested a review from weronikaolejniczak February 2, 2026 11:50

weronikaolejniczak requested a review from JoseLuisGJ February 2, 2026 12:33

JoseLuisGJ reviewed Feb 4, 2026

View reviewed changes

Comment thread packages/eui/src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap Outdated

Comment thread packages/eui/src/components/form/file_picker/file_picker.tsx Outdated

weronikaolejniczak reviewed Feb 4, 2026

View reviewed changes

Comment thread packages/eui/changelogs/upcoming/9351.md Outdated

Address review: change icon from 'export' to 'upload'

4d480aa

ragini-pandey requested review from JoseLuisGJ and weronikaolejniczak February 4, 2026 10:23

chore: update VRT references

2f59aa6

JoseLuisGJ approved these changes Feb 5, 2026

View reviewed changes

weronikaolejniczak approved these changes Feb 6, 2026

View reviewed changes

weronikaolejniczak merged commit 0bfb13e into elastic:main Feb 6, 2026
5 checks passed

mgadewoll mentioned this pull request Feb 9, 2026

Upgrade EUI to v112.3.0 elastic/kibana#252315

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[FilePicker] Update icon type from 'importAction' to 'export'#9351

[FilePicker] Update icon type from 'importAction' to 'export'#9351
weronikaolejniczak merged 8 commits intoelastic:mainfrom
ragini-pandey:fix/9013-file-picker-icon

ragini-pandey commented Feb 2, 2026 •

edited by JasonStoltz

Loading

Uh oh!

github-actions Bot commented Feb 2, 2026

Uh oh!

Uh oh!

Uh oh!

weronikaolejniczak commented Feb 2, 2026

Uh oh!

weronikaolejniczak commented Feb 2, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

weronikaolejniczak commented Feb 4, 2026

Uh oh!

ragini-pandey commented Feb 4, 2026

Uh oh!

weronikaolejniczak commented Feb 5, 2026

Uh oh!

elasticmachine commented Feb 5, 2026

Uh oh!

elasticmachine commented Feb 5, 2026

Uh oh!

weronikaolejniczak left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

ragini-pandey commented Feb 2, 2026 • edited by JasonStoltz Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Why are we making this change?

Screenshots

Impact to users

QA

General checklist

Uh oh!

github-actions Bot commented Feb 2, 2026

Uh oh!

Uh oh!

Uh oh!

weronikaolejniczak commented Feb 2, 2026

Uh oh!

weronikaolejniczak commented Feb 2, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

weronikaolejniczak commented Feb 4, 2026

Uh oh!

ragini-pandey commented Feb 4, 2026

Uh oh!

weronikaolejniczak commented Feb 5, 2026

Uh oh!

elasticmachine commented Feb 5, 2026

💚 Build Succeeded

History

Uh oh!

elasticmachine commented Feb 5, 2026

💚 Build Succeeded

History

Uh oh!

weronikaolejniczak left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

ragini-pandey commented Feb 2, 2026 •

edited by JasonStoltz

Loading