rfc: add FAST file selector spec to/in component specs

[litteredwitherrors]

💬 RFC

🔦 Context

Seeking feedback for this FAST specification for checkpoint 1.

FAST File Selector

Process

• Checkpoint 1 - Schedule a spec review meeting to cover the Overview section before proceeding to work on the Design section. Be sure to include relevant stakeholders such as members of the tools team.

• Checkpoint 2 - Schedule a spec review meeting before beginning the implementation work. Be sure to invite relevant stakeholders such as design system owners.

• Checkpoint 3 - Submit the component PR and schedule a component code review meeting or present the component in one of our Engineering Open Mic sessions. Address feedback from the review, obtain final approvals through GitHub, and merge.

Overview

A file input is a control that is used to give a user the ability to select files from their computer's file system.

Background

There is currently an existing HTML implementation that is part of the input element specification.

Related issues:
#4726

Use Cases

A user wants to upload a document, such as an image, from their device to the website or web application.

Non-goals

The file input will not utilize the base level javascript file API, but will rather invoke the native HTML element's click() function.

Features

• Prompts a user to select files to upload
• Ability to slot in a file list
• Ability to slot in a button

Risks and Challenges

N/A

Prior Art/Examples

• Ant Design
• Bootstrap
• Carbon
• Evergreen
• Materialise
• MOJ

---

[EisenbergEffect]

@litteredwitherrors Be sure to reach out to @williamw2. He's got something be built for tools/Creator that might be a good starting point for this work.

[daviddossett]

Would love to see this implemented. A couple of high-level, from-the-hip thoughts on what would be useful in the Webview UI Toolkit:

• Positioning of the file(s) value string relative to the button/drag target would be super useful
• Ability to remove file(s) via an icon button (or at least a slot for one)

I can do some quick sketches for what this would ideally look like in a VS Code extension context if that's helpful.

cc @hawkticehurst @worksofliam

[EisenbergEffect]

@daviddossett Awesome. Concrete use cases from real products are pure gold. Sketches are very welcome.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[janechu]

Unfortunately @microsoft/fast-components has been deprecated for some time.