Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/capawesome-team/capacitor-file-picker
⚡️ Capacitor plugin that allows the user to select a file.
https://github.com/capawesome-team/capacitor-file-picker
List: capacitor-file-picker
android capacitor capacitor-android capacitor-ios capacitor-plugin capacitor-web capawesome file-chooser file-picker ios web
Last synced: about 1 month ago
JSON representation
⚡️ Capacitor plugin that allows the user to select a file.
- Host: GitHub
- URL: https://github.com/capawesome-team/capacitor-file-picker
- Owner: capawesome-team
- License: mit
- Archived: true
- Created: 2021-08-11T20:27:19.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-04-01T07:18:41.000Z (over 1 year ago)
- Last Synced: 2024-10-29T16:20:23.679Z (about 1 month ago)
- Topics: android, capacitor, capacitor-android, capacitor-ios, capacitor-plugin, capacitor-web, capawesome, file-chooser, file-picker, ios, web
- Language: Swift
- Homepage: https://capawesome.io/plugins/file-picker/
- Size: 785 KB
- Stars: 66
- Watchers: 3
- Forks: 10
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
- awesome-capacitor - File picker - Capacitor plugin that allows the user to select a file. ([Capawesome plugins](https://capawesome.io/))
README
## ⚠️ Deprecated repository
**This project has been moved to the following monorepo: [capawesome-team/capacitor-plugins](https://github.com/capawesome-team/capacitor-plugins).**
-----
File Picker
@capawesome/capacitor-file-picker
Capacitor plugin that allows the user to select a file.
## Maintainers
| Maintainer | GitHub | Social |
| ---------- | ----------------------------------------- | --------------------------------------------- |
| Robin Genz | [robingenz](https://github.com/robingenz) | [@robin_genz](https://twitter.com/robin_genz) |
## Sponsors
This is an MIT-licensed open source project.
It can grow thanks to the support by these awesome people.
If you'd like to join them, please read more [here](https://github.com/sponsors/capawesome-team).
## Installation
```bash
npm install @capawesome/capacitor-file-picker
npx cap sync
```
## Configuration
No configuration required for this plugin.
## Demo
A working example can be found here: [robingenz/capacitor-plugin-demo](https://github.com/robingenz/capacitor-plugin-demo)
## Usage
```typescript
import { FilePicker } from '@capawesome/capacitor-file-picker';
const pickFiles = async () => {
const result = await FilePicker.pickFiles({
types: ['image/png'],
multiple: true,
});
};
const pickImages = async () => {
const result = await FilePicker.pickImages({
multiple: true,
});
};
const pickMedia = async () => {
const result = await FilePicker.pickMedia({
multiple: true,
});
};
const pickVideos = async () => {
const result = await FilePicker.pickVideos({
multiple: true,
});
};
const appendFileToFormData = async () => {
const result = await FilePicker.pickFiles();
const file = result.files[0];
const formData = new FormData();
if (file.blob) {
const rawFile = new File(file.blob, file.name, {
type: file.mimeType,
});
formData.append('file', rawFile, file.name);
}
};
```
## API
* [`convertHeicToJpeg(...)`](#convertheictojpeg)
* [`pickFiles(...)`](#pickfiles)
* [`pickImages(...)`](#pickimages)
* [`pickMedia(...)`](#pickmedia)
* [`pickVideos(...)`](#pickvideos)
* [`addListener('pickerDismissed', ...)`](#addlistenerpickerdismissed)
* [`removeAllListeners()`](#removealllisteners)
* [Interfaces](#interfaces)
* [Type Aliases](#type-aliases)
### convertHeicToJpeg(...)
```typescript
convertHeicToJpeg(options: ConvertHeicToJpegOptions) => Promise
```
Convert a HEIC image to JPEG.
Only available on iOS.
| Param | Type |
| ------------- | ----------------------------------------------------------------------------- |
| **`options`** | ConvertHeicToJpegOptions |
**Returns:** Promise<ConvertHeicToJpegResult>
**Since:** 0.6.0
--------------------
### pickFiles(...)
```typescript
pickFiles(options?: PickFilesOptions | undefined) => Promise
```
Open the file picker that allows the user to select one or more files.
| Param | Type |
| ------------- | ------------------------------------------------------------- |
| **`options`** | PickFilesOptions |
**Returns:** Promise<PickFilesResult>
--------------------
### pickImages(...)
```typescript
pickImages(options?: PickMediaOptions | undefined) => Promise
```
Pick one or more images from the gallery.
On iOS 13 and older it only allows to pick one image.
Only available on Android and iOS.
| Param | Type |
| ------------- | ------------------------------------------------------------- |
| **`options`** | PickMediaOptions |
**Returns:** Promise<PickFilesResult>
**Since:** 0.5.3
--------------------
### pickMedia(...)
```typescript
pickMedia(options?: PickMediaOptions | undefined) => Promise
```
Pick one or more images or videos from the gallery.
On iOS 13 and older it only allows to pick one image or video.
Only available on Android and iOS.
| Param | Type |
| ------------- | ------------------------------------------------------------- |
| **`options`** | PickMediaOptions |
**Returns:** Promise<PickFilesResult>
**Since:** 0.5.3
--------------------
### pickVideos(...)
```typescript
pickVideos(options?: PickMediaOptions | undefined) => Promise
```
Pick one or more videos from the gallery.
On iOS 13 and older it only allows to pick one video.
Only available on Android and iOS.
| Param | Type |
| ------------- | ------------------------------------------------------------- |
| **`options`** | PickMediaOptions |
**Returns:** Promise<PickFilesResult>
**Since:** 0.5.3
--------------------
### addListener('pickerDismissed', ...)
```typescript
addListener(eventName: 'pickerDismissed', listenerFunc: () => void) => Promise & PluginListenerHandle
```
Called when the file picker is dismissed.
Only available on iOS.
| Param | Type |
| ------------------ | ------------------------------ |
| **`eventName`** | 'pickerDismissed' |
| **`listenerFunc`** | () => void |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 0.6.2
--------------------
### removeAllListeners()
```typescript
removeAllListeners() => Promise
```
Remove all listeners for this plugin.
**Since:** 0.6.2
--------------------
### Interfaces
#### ConvertHeicToJpegResult
| Prop | Type | Description | Since |
| ---------- | ------------------- | ------------------------------------- | ----- |
| **`path`** | string | The path of the converted JPEG image. | 0.6.0 |
#### ConvertHeicToJpegOptions
| Prop | Type | Description | Since |
| ---------- | ------------------- | --------------------------- | ----- |
| **`path`** | string | The path of the HEIC image. | 0.6.0 |
#### PickFilesResult
| Prop | Type |
| ----------- | ------------------- |
| **`files`** | File[] |
#### File
| Prop | Type | Description | Since |
| ---------------- | ------------------- | -------------------------------------------------------------------------------------------------------------------- | ----- |
| **`blob`** | Blob | The Blob instance of the file. Only available on Web. | |
| **`data`** | string | The Base64 string representation of the data contained in the file. Is only provided if `readData` is set to `true`. | |
| **`duration`** | number | The duration of the video in seconds. Only available on Android and iOS. | 0.5.3 |
| **`height`** | number | The height of the image or video in pixels. Only available on Android and iOS. | 0.5.3 |
| **`mimeType`** | string | The mime type of the file. | |
| **`modifiedAt`** | number | The last modified timestamp of the file in milliseconds. | 0.5.9 |
| **`name`** | string | The name of the file. | |
| **`path`** | string | The path of the file. Only available on Android and iOS. | |
| **`size`** | number | The size of the file in bytes. | |
| **`width`** | number | The width of the image or video in pixels. Only available on Android and iOS. | 0.5.3 |
#### PickFilesOptions
| Prop | Type | Description | Default |
| -------------- | --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
| **`types`** | string[] | List of accepted file types. Look at [IANA Media Types](https://www.iana.org/assignments/media-types/media-types.xhtml) for a complete list of standard media types. This option cannot be used with `multiple: true` on Android. | |
| **`multiple`** | boolean | Whether multiple files may be selected. | false |
| **`readData`** | boolean | Whether to read the file data. | false |
#### PickMediaOptions
| Prop | Type | Description | Default |
| -------------- | -------------------- | --------------------------------------- | ------------------ |
| **`multiple`** | boolean | Whether multiple files may be selected. | false |
| **`readData`** | boolean | Whether to read the file data. | false |
#### PluginListenerHandle
| Prop | Type |
| ------------ | ----------------------------------------- |
| **`remove`** | () => Promise<void> |
### Type Aliases
#### PickedFile
#### PickImagesOptions
#### PickImagesResult
#### PickMediaResult
#### PickVideosOptions
#### PickVideosResult
## Changelog
See [CHANGELOG.md](https://github.com/capawesome-team/capacitor-file-picker/blob/main/CHANGELOG.md).
## License
See [LICENSE](https://github.com/capawesome-team/capacitor-file-picker/blob/main/LICENSE).