From 026b5190806e52a0782486b3cbb533fb9e719a25 Mon Sep 17 00:00:00 2001
From: Ziad Saab
Date: Tue, 24 Sep 2024 11:59:16 -0500
Subject: [PATCH] Document FileInput component
---
snaps/assets/custom-ui-file-input.png | Bin 0 -> 21734 bytes
snaps/features/custom-ui/with-jsx.md | 55 +++++++++++++++++++++++++-
snaps/reference/entry-points.md | 2 +-
3 files changed, 55 insertions(+), 2 deletions(-)
create mode 100644 snaps/assets/custom-ui-file-input.png
diff --git a/snaps/assets/custom-ui-file-input.png b/snaps/assets/custom-ui-file-input.png
new file mode 100644
index 0000000000000000000000000000000000000000..7f69567c54319d9ae611f00bd1c8b725450b82d3
GIT binary patch
literal 21734
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
+### `FileInput`
+
+Outputs a file input component for use in [interactive UI](interactive-ui.md).
+
+#### Props
+
+- `name`: `string` - The name that will be sent to [`onUserInput`](../../reference/entry-points.md#onuserinput)
+ when a user interacts with the form.
+- `accept`: `string[]` - (Optional) The file types that the file input field accepts. If not
+specified, the file input field accepts all file types. For examples of
+valid values, see the [MDN documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept).
+- `compact`: `boolean` - (Optional) Whether the file input field is compact.
+
+#### Example
+
+```js
+import { FileInput } from "@metamask/snaps-sdk/jsx";
+
+export const onHomePage = async () => {
+ const interfaceId = await snap.request({
+ method: "snap_createInterface",
+ params: {
+ ui: (
+
+ File Upload
+
+
+ ),
+ },
+ });
+
+ return {
+ id: interfaceId,
+ }
+};
+
+export const onUserInput = async ({ id, event }) => {
+ if (event.type === UserInputEventType.FileUploadEvent && event.file !== null) {
+ console.log(event.file);
+ }
+};
+```
+
+
+
+
+
### `Form`
Outputs a form for use in [interactive UI](interactive-ui.md).
@@ -861,7 +915,6 @@ module.exports.onHomePage = async () => {
-<<<<<<< HEAD
### `Tooltip`
Outputs a tooltip when the wrapped child is hovered over.
diff --git a/snaps/reference/entry-points.md b/snaps/reference/entry-points.md
index 4497adf4b06..dfddfa22a0b 100644
--- a/snaps/reference/entry-points.md
+++ b/snaps/reference/entry-points.md
@@ -649,7 +649,7 @@ To respond to [interactive UI](../features/custom-ui/interactive-ui.md) events,
- `id` - The ID of the interface being acted on.
- `event` - An event object containing:
- `type` - The type of the event.
- Possible values are `ButtonClickEvent`, `FormSubmitEvent`, or `InputChangeEvent`.
+ Possible values are `ButtonClickEvent`, `FormSubmitEvent`, `InputChangeEvent`, and `FileInputEvent`.
These enums are exported from the `@metamask/snaps-sdk` module.
- `name` - The name of the component that fired the event.
Optional when the event type is `ButtonClickEvent`.