Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/koodeau/metawrite
Appwrite SDK with ready to go components for Svelte / SvelteKit
https://github.com/koodeau/metawrite
appwrite collaborate components github learn library sdk svelte sveltekit
Last synced: 2 days ago
JSON representation
Appwrite SDK with ready to go components for Svelte / SvelteKit
- Host: GitHub
- URL: https://github.com/koodeau/metawrite
- Owner: koodeau
- License: apache-2.0
- Created: 2022-02-12T18:12:15.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-03-07T08:09:41.000Z (over 1 year ago)
- Last Synced: 2024-10-31T12:39:50.367Z (9 days ago)
- Topics: appwrite, collaborate, components, github, learn, library, sdk, svelte, sveltekit
- Language: Svelte
- Homepage: https://increas.io/metawrite
- Size: 932 KB
- Stars: 26
- Watchers: 2
- Forks: 1
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-svelte-kit - Metawrite SDK
README
# Support Us
**Get free $100 credits on DigitalOcean:**
**Join our Discord:**
---
[](https://github.com/koodeau/metawrite/actions/workflows/npm-publish.yml)
Metawrite is [Appwrite](https://appwrite.io/) SDK with ready to go components for `Svelte` / `SvelteKit`
This package is maintained by [Increasio](https://increas.io).
> Note: versions `x.x.n` means some minor changes to package documentation or typings.
>
> versions `x.n.x` might include some minor breaking changes. See [Release Notes](https://github.com/koodeau/metawrite/blob/main/CHANGELOG.md).
>
> versions `n.x.x` might include some major breaking changes. See [Release Notes](https://github.com/koodeau/metawrite/blob/main/CHANGELOG.md).
## Important info
The package is fully working and compatible with Appwrite Server 0.12, Web SDK 6, and SvelteKit. But people are currently facing difficulties with `npm install metawrite`. We have ready and configured [**SvelteKit template**](https://github.com/koodeau/sveltekit-metawrite) that uses Metawrite and could be also used as Docker image like described [here](https://github.com/koodeau/sveltekit-metawrite#appwrite-and-sveltekit-combo).
> Please consider using [template](https://github.com/koodeau/sveltekit-metawrite), this is temporary
# Documentation
### Installation
Using NPM:
```bash
npm install metawrite
```
Using Yarn:
```bash
yarn add metawrite
```
# Table of contents
- [Support Us](#support-us)
- [Important info](#important-info)
- [Documentation](#documentation)
- [Installation](#installation)
- [Table of contents](#table-of-contents)
- [Usage](#usage)
- [Initialize](#initialize)
- [Properties](#properties)
- [Create user](#create-user)
- [Directives](#directives)
- [Arguments](#arguments)
- [Events](#events)
- [Arguments](#arguments-1)
- [Arguments](#arguments-2)
- [Login via Email](#login-via-email)
- [Directives](#directives-1)
- [Arguments](#arguments-3)
- [Events](#events-1)
- [Arguments](#arguments-4)
- [Arguments](#arguments-5)
- [Login via OAuth2](#login-via-oauth2)
- [Properties](#properties-1)
- [Directives](#directives-2)
- [Get user](#get-user)
- [Directives](#directives-3)
- [Get Collection](#get-collection)
- [Properties](#properties-2)
- [Directives](#directives-4)
- [Arguments](#arguments-6)
- [Get Document](#get-document)
- [Properties](#properties-3)
- [Directives](#directives-5)
- [Arguments](#arguments-7)
- [Events](#events-2)
- [API](#api)
- [Account](#account)
- [``](#user-)
- [Slots](#slots)
- [Directives](#directives-6)
- [Events](#events-3)
- [Example](#example)
- [``](#create-)
- [Directives](#directives-7)
- [Events](#events-4)
- [Example](#example-1)
- [``](#preferences-)
- [Slots](#slots-1)
- [Directives](#directives-8)
- [Events](#events-5)
- [Example](#example-2)
- [``](#recoverpassword-)
- [Directives](#directives-9)
- [Events](#events-6)
- [Example](#example-3)
- [``](#update-)
- [Directives](#directives-10)
- [Events](#events-7)
- [Example](#example-4)
- [``](#verification-)
- [Directives](#directives-11)
- [Events](#events-8)
- [Example](#example-5)
- [Auth](#auth)
- [``](#authemail-)
- [Slots](#slots-2)
- [Directives](#directives-12)
- [Events](#events-9)
- [Example](#example-6)
- [``](#authoauth2-)
- [Properties](#properties-4)
- [Example](#example-7)
- [``](#createanonymoussession-)
- [Directives](#directives-13)
- [Example](#example-8)
- [``](#createjwt-)
- [Directives](#directives-14)
- [Example](#example-9)
- [``](#magicurl-)
- [Directives](#directives-15)
- [Example](#example-10)
- [Avatars](#avatars)
- [``](#browser-)
- [Arguments](#arguments-8)
- [Directives](#directives-16)
- [Example](#example-11)
- [``](#creditcard-)
- [Arguments](#arguments-9)
- [Directives](#directives-17)
- [Example](#example-12)
- [``](#favicon-)
- [Arguments](#arguments-10)
- [Directives](#directives-18)
- [``](#flag-)
- [Arguments](#arguments-11)
- [Directives](#directives-19)
- [Example](#example-13)
- [``](#image-)
- [Arguments](#arguments-12)
- [Directives](#directives-20)
- [Example](#example-14)
- [``](#qr-)
- [Arguments](#arguments-13)
- [Directives](#directives-21)
- [Example](#example-15)
- [Database](#database)
- [``](#collection-)
- [Arguments](#arguments-14)
- [Slots](#slots-3)
- [Directives](#directives-22)
- [Example](#example-16)
- [``](#document-)
- [Arguments](#arguments-15)
- [Slots](#slots-4)
- [Directives](#directives-23)
- [Example](#example-17)
- [Realtime](#realtime)
- [Arguments](#arguments-16)
- [Directives](#directives-24)
- [Example](#example-18)
- [Storage](#storage)
- [``](#storage-)
- [Directives](#directives-25)
- [Example](#example-19)
- [``](#filelist-)
- [Arguments](#arguments-17)
- [Slots](#slots-5)
- [Directives](#directives-26)
- [Example](#example-20)
- [``](#file-)
- [Arguments](#arguments-18)
- [Directives](#directives-27)
- [Example](#example-21)
- [Functions](#functions)
- [``](#function-)
- [Directives](#directives-28)
- [Slots](#slots-6)
- [Example](#example-22)
- [Locale](#locale)
- [``](#continents-)
- [Directives](#directives-29)
- [Slots](#slots-7)
- [Example](#example-23)
- [``](#countries-)
- [Arguments](#arguments-19)
- [Slots](#slots-8)
- [Directives](#directives-30)
- [Example](#example-24)
- [``](#currencies-)
- [Slots](#slots-9)
- [Directives](#directives-31)
- [Example](#example-25)
- [``](#languages-)
- [Slots](#slots-10)
- [Directives](#directives-32)
- [Example](#example-26)
- [``](#locale-)
- [Slots](#slots-11)
- [Directives](#directives-33)
- [Example](#example-27)
- [``](#phonecodes-)
- [Slots](#slots-12)
- [Directives](#directives-34)
- [Example](#example-28)
- [Stack](#stack)
# Usage
> You need a running instance of Appwrite to use this library. Go to https://appwrite.io/docs/installation for more instructions.
**Psuedo Example**
Handle multiple levels of async relational data (and their loading & fallback states) entirely from the Svelte markup.
```svelte
Hello {user.name}!
You have {documents.length} documents.
{#each documents as document}
Title: {document.title}
Text: {document.text}
...
```
## Initialize
Must be initialised and wrap every `metawrite` component.
```svelte
import { Appwrite } from 'metawrite';
const config = {
endpoint: 'http://localhost/v1',
project: 'demo',
locale: 'fr'
};
...
```
### Properties
| Name | Description |
| ---------- | ----------------------------------------------- |
| `endpoint` | Your Appwrite endpoint. `@type - {string}` |
| `project` | Your project ID. `@type - {string}` |
| `locale` | _Optional_ The users locale. `@type - {string}` |
| `realtime` | _Optional_ Set Custom realtime endpoint. By default the same as `endpoint`. `@type - {string}` |
## Create user
Registers a new account.
```svelte
import { Create } from 'metawrite';
let email = '';
let password = '';
let name = '';
const success = (e) => {
//success callback
// `e` contains the user object
};
const failure = (e) => {
//failure callback
};
Register
```
### Directives
**let:actions** `object`
Object with function.
#### Arguments
| Name | Description |
| ------------------------------- | ---------------------------------------- |
| `create(email, password, name)` | Registers a new user. `@type - {string}` |
### Events
**on:success**
Triggers on successful register.
#### Arguments
| Name | Description |
| ---------- | ----------- |
| `response` | Response |
**on:failure**
Triggers on failed register.
#### Arguments
| Name | Description |
| ---------- | ----------- |
| `response` | Response |
## Login via Email
Login via email and password.
```svelte
import { AuthEmail } from 'metawrite';
let email = '';
let password = '';
const success = (e) => {
//success callback
// `e` contains the user object
};
const failure = (e) => {
//failure callback
};
Login
```
### Directives
**let:authorize** `function`
Initiates login.
#### Arguments
| Name | Description |
| ---------- | ---------------------------- |
| `email` | E-Mail. `@type - {string}` |
| `password` | Password. `@type - {string}` |
### Events
**on:success**
Triggers on successful login.
#### Arguments
| Name | Description |
| ------- | -------------------------- |
| `email` | E-Mail. `@type - {string}` |
**on:failure**
Triggers on failed login.
#### Arguments
| Name | Description |
| ------- | ------------- |
| `error` | Error object. |
## Login via OAuth2
Login via an OAuth2 provider.
```svelte
import { AuthOAuth2 } from 'metawrite';
Login Google
```
### Properties
| Name | Description |
| ---------- | ----------------------------------- |
| `authProvider` | OAuth2 provider. `@type - {string}` |
| `success` | Success url. `@type - {string}` |
| `failure` | Failure url. `@type - {string}` |
### Directives
**let:authorize** `function`
## Get user
Requests current user to check if logged in.
```svelte
import { User } from 'metawrite';
Hello {user.name}!
{user.email}
You are not logged in!
```
### Directives
**let:user** `object`
Get currently logged in user data.
## Get Collection
Get a list of all the documents from a collection.
```svelte
import { Collection } from 'metawrite';
You have {documents.length} documents.
```
### Properties
| Name | Description |
| -------------- | ---------------------------------------------------------------------- |
| `collectionId` | Collection unique ID. `@type - {string}` |
| _additional_ | same as [here](https://appwrite.io/docs/client/database#listDocuments) |
### Directives
**let:documents** `array`
Array of documents.
**let:actions** `object`
Object with function.
#### Arguments
| Name | Description |
| --------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------- |
| `reload()` | Re-fetch collection. |
| `create(data, read, write)` | Create a new Document in the collection. `read`/`write` is optional and current user by default `@type - {string[]}`. `data` is `@type - {string}` |
## Get Document
Get a document. If you pass the `document` property with data from , there wont be any data requested.
```svelte
import { Document } from 'metawrite';
Title: {document.title}
Text: {document.text}
```
### Properties
| Name | Description |
| -------------- | ---------------------------------------- |
| `documentId` | Document unique ID. `@type - {string}` |
| `collectionId` | Collection unique ID. `@type - {string}` |
| or | |
| `document` | Document passed from `` |
### Directives
**let:document** `object`
A JSON object with the document data.
**let:actions** `object`
Object with function.
#### Arguments
| Name | Description |
| -------------- | ------------------------------------------------- |
| `update(data)` | Update the document. `data` is `@type - {string}` |
| `remove()` | Deletes the document. |
| `reload()` | Re-fetch document. |
### Events
**on:change**
Triggers on update or remove login.
# API
## Account
The Account components allow you to manage a user account.
### ``
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
| `logout()` | Logout current session. |
| `logoutAll()` | Logout from all session. |
| `logoutFrom(session)` | Logout from specific session. `session` is `@type - {string}` |
- **let:user** `object`
- **let:error**
#### Events
- **on:success** On user fetch success.
- **on:failure** On user fetch failure.
- **on:successLogout** On `logout` success.
- **on:failureLogout** On `logout` failure.
- **on:successLogoutFrom** On `logoutFrom` success.
- **on:failureLogoutFrom** On `logoutFrom` failure.
- **on:successLogoutAll** On `logoutAll` success.
- **on:failureLogoutAll** On `logoutAll` failure.
#### Example
```svelte
import { User } from 'metawrite';
Reload user data
Get logged in user data
Log out from current session
Log out from specific session
Log out from all sessions
Hi, {user.name}
```
### ``
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `create(email, password, name)` | Creates a user. `email` and `password` are required - `@type - {string}`. `name` is _optional_ - `@type - {string}` |
#### Events
- **on:success** On `create` success.
- **on:failure** On `create` failure.
#### Example
```svelte
import { Create } from 'metawrite';
let name,
email,
password = '';
const success = (e) => {
// success callback
// `e` contains the user object
};
const failure = (e) => {
// failure callback
};
Create Account
```
### ``
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reloads preferences. |
| `update(prefs)` | Update preferences. `prefs` - `@type - {object}` |
#### Events
- **on:success** On init and `reload` success.
- **on:failure** On init and `reload` failure.
- **on:successUpdate** On `update` success.
- **on:failureUpdate** On `update` failure.
#### Example
```svelte
import { Preferences } from 'metawrite';
let prefs = {
// You can pass only the specific settings you wish to update.
};
{
actions.update(prefs);
actions.reload();
}}>Update Preferences
```
### ``
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `recover(email, url)` | Recover password. `email` and `url` is required and `@type - {string}`. `url` is your page where you will handle `secret` with `complete` function. |
| `complete(user, secret, password, passwordAgain)` | Complete password recovery. `user` and `secret` are set automatically by `metawrite`, so you don’t have to set them. `password` and `passwordAgain` are required - `@type - {string}`. |
#### Events
- **on:successRecover** On init and `reload` success.
- **on:failureRecover** On init and `reload` failure.
- **on:successComplete** On `update` success.
- **on:failureComplete** On `update` failure.
#### Example
```svelte
import { RecoverPassword } from "metawrite";
const url = "http://localhost:3000/reset-password"; // URL that will point to the next step.
let email = '';
const successRecover = e => {
//success callback
// `e` contains the user object
};
const failureRecover = e => {
//failure callback
}
Recover Password
import { RecoverPassword } from "metawrite";
let password, passwordAgain = '';
const successComplete = e => {
//success callback
// `e` contains the user object
};
const failureComplete = e => {
//failure callback
}
Set New Password
```
### ``
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `name(name)` | Update name. All fields are required. `@type - {string}` |
| `email(email, password)` | Update email. All fields are required. `@type - {string}` |
| `password(password, oldPassword)` | Update password. All fields are required. `@type - {string}` |
#### Events
- **on:successName** On `name` success.
- **on:failureName** On `name` failure.
- **on:successEmail** On `email` success.
- **on:failureEmail** On `email` failure.
- **on:successPassword** On `password` success.
- **on:failurePassword** On `password` failure.
#### Example
```svelte
import { Update } from 'metawrite';
let name,
email,
password,
newPassword,
oldPassword = '';
This updates name
This updates email
This updates password
```
### ``
Creates and automatically validates user email verification.
- `url` of type string for action `create` should be where your app is hosted or `localhost`.
- For `update` action you don't need to pass anything, the process is automated.
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `create(url)` | Create Verification. `url` is what URL used to create verification link sent to your email inbox. `@type - {string}` |
| `update(user, secret)` | Complete Verification. `user` and `secret` are set automatically by `metawrite`. |
#### Events
- **on:successCreate** On `create` success.
- **on:failureCreate** On `create` failure.
- **on:successComplete** On `complete` success.
- **on:failureComplete** On `complete` failure.
#### Example
```svelte
import { Verification } from 'metawrite';
const url = window.location.href;
Update email verification status
```
## Auth
The Auth components allow you to authenticate a user account.
### ``
#### Slots
- **loading**
- **success**
- **error**
#### Directives
- **let:authorize(email, password)**
- **let:user**
- **let:error**
#### Events
- **on:success** On `authorize` success.
- **on:failure** On `authorize` failure.
#### Example
```svelte
import { AuthEmail } from 'metawrite';
let email = '';
let password = '';
const success = (e) => {
//success callback
// `e` contains the user object
};
const failure = (e) => {
//failure callback
};
Login
```
### ``
#### Properties
| Name | Description |
| --------------- | ----------------------------------- |
| `authProvider` | OAuth2 provider. `@type - {string}` |
| `success` | Success url. `@type - {string}` |
| `failure` | Failure url. `@type - {string}` |
| #### Directives | |
**let:authorize()**
#### Example
```svelte
import { AuthOAuth2 } from 'metawrite';
Login Google
```
### ``
#### Directives
**let:actions**
| Name | Description |
| ---------- | -------------------------- |
| `create()` | Creates anonymous session. |
#### Example
```svelte
import { CreateAnonymousSession } from 'metawrite';
Create Anonymous Session
```
### ``
Creates JWT token.
#### Directives
**let:actions**
| Name | Description |
| ---------- | ------------------ |
| `create()` | Creates JWT token. |
#### Example
```svelte
import { CreateJWT } from 'metawrite';
Create JWT token
```
### ``
#### Directives
**let:actions**
| Name | Description |
| --------------------------- | ------------------------------------------------------------ |
| `create(sessionId, email, url)` | Creates Magic URL Session. email is required, url is to point on complete step `string`, `sessionId` is not required |
| `complete()` | Validates and completes Magic URL Session. |
#### Example
```svelte
import { MagicURL } from "metawrite";
let email = ""
const url = "http://localhost:3000/page-to-complete"
const successCreate = (e) => {
console.log(e)
}
const failureCreate = (e) => {
console.log(e)
}
const successComplete = (e) => {
console.log(e)
}
const failureComplete = (e) => {
console.log(e)
}
Send login link
Confirm Login
```
## Avatars
The Avatar components aim to help you complete everyday tasks related to your app image, icons, and avatars.
### ``
#### Arguments
- code - _required_ `@type - {string}`
- width - _optional_ `@type - {number}`
- height - _optional_ `@type - {string}`
- quality - _optional_ `@type - {string}`
#### Directives
- **let:src** Image link `@type - {URL}`
#### Example
```svelte
import { Browser } from 'metawrite';
})
```
### ``
#### Arguments
- code - _required_ `@type - {string}`
- width - _optional_ `@type - {number}`
- height - _optional_ `@type - {string}`
- quality - _optional_ `@type - {string}`
#### Directives
- **let:src** Image link `@type - {URL}`
#### Example
```svelte
import { CreditCard } from 'metawrite';
```
### ``
#### Arguments
- url - _required_ `@type - {string}`
#### Directives
- **let:src** Image link `@type - {URL}`
```svelte
import { Favicon } from 'metawrite';
const url = window.location.href;
```
### ``
#### Arguments
- code - _required_ `@type - {string}`
- width - _optional_ `@type - {number}`
- height - _optional_ `@type - {string}`
- quality - _optional_ `@type - {string}`
#### Directives
- **let:src** Image link `@type - {URL}`
#### Example
```svelte
import { Flag } from 'metawrite';
```
### ``
#### Arguments
- url - _required_ `@type - {string}`
- width - _optional_ `@type - {number}`
- height - _optional_ `@type - {number}`
#### Directives
- **let:src** Image link `@type - {URL}`
#### Example
```svelte
import { Image } from 'metawrite';
let url = 'https://increas.io/';
let width,
height = 100;
```
### ``
#### Arguments
- text - _required_ `@type - {string}`
- size - _optional_ `@type - {optional}`
- margin - _optional_ `@type - {number}`
- download - _optional_ `@type - {boolean}`
#### Directives
- **let:src** Image link `@type - {URL}`
#### Example
```svelte
import { QR } from 'metawrite';
let text = 'https://increas.io/'; // could be any text
let size = 500;
let margin = 1;
let download = false;
```
## Database
The Database components allow you to create structured collections of documents, query and filter lists of documents, and manage an advanced set of read and write access permissions.
### ``
#### Arguments
- collectionId - *required* `@type - {string}`
- cache - *optional*, by default set to false `@type - {boolean}`
**query: `@type - {object}`**
- queries - *optional* `@type - {string[]}`
- limit - *optional* `@type - {number}`
- offset - *optional* `@type - {number}`
- cursor - *optional* `@type - {string}`
- cursorDirection - *optional* `@type - {string}`
- orderAttributes - *optional* `@type - {string[]}`
- orderTypes - *optional* `@type - {string[]}`
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
| `create(documentId, data, read, write)` | Creates a Document. `data` - `@type - {string}`.
`read`/`write` is optional `@type - {string[]}`.
`documentId` is optional, by default generates unique `@type - {string}`. |
- **let:documents**
- **let:error**
#### Example
```svelte
import { Collection } from "metawrite";
You have {documents.length} documents.
```
### ``
#### Arguments
- documentId - *required* `@type - {string}`
- collectionId - *required* `@type - {string}`
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
| `update(data)` | Updates a Document. `data` - `@type - {object}` |
| `remove()` | Removes a Document. |
- **let:document**
- **let:error**
#### Example
```svelte
import { Collection, Document } from 'metawrite';
const collectionId = '5f56a3035a01f';
You have {documents.length} documents:
{#each documents as document}
Title: {document.title}
Text: {document.text}
{actions.remove()}}>Delete
{/each}
```
## Realtime
For more information about using Realtime in Appwrite see [Realtime documentation](https://appwrite.io/docs/realtime).
Realtime allows you to listen to any events on the server-side in realtime using the subscribe method.
Instead of requesting new data via HTTP, the subscription will receive new data every time it changes, any connected client receives that update within milliseconds via a WebSocket connection.
This lets you build an interactive and responsive user experience by providing information from all of Appwrite's services in realtime.
#### Arguments
- channels - *required* `string | string[]`
#### Directives
**let:payload** - The payload from the subscription will contain [following properties](https://appwrite.io/docs/realtime#payload).
**let:actions**
| Name | Description |
| --- | --- |
| `subscribe()` | Subscribing to all updates related to one or more channels. |
| `unsubscribe()` | If you no longer want to receive updates from a subscription, you can unsubscribe so that your callbacks are no longer called. |
#### Example
```svelte
import { Realtime } from 'metawrite';
{payload.timestamp}
Subscribe to Account channel
Unsubscribe from Account channel
```
## Storage
The Storage components allow you to manage your project files. You can upload, view, download, and query all your project files.
### ``
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `create(bucketId, fileId, file, read, write)` | Uploads a file.
`fileId` is required `@type - {string}`, `"unique()"` will generate random unique id, but you can use custom.
`file` is `@type - {File}` and required.
`read`/`write` is `@type - {string[]}` and *optional* |
#### Example
```svelte
import { Storage } from "metawrite"
// Required
let bucketId = "default"
let file: File;
let fileId = "unique()"; // this will generate random unique id, but you can use custom
// Optional
let read: string[];
let write: string[];
Upload File
```
### ``
#### Arguments
- bucketId - *required* `@type - {string}`
- search - *optional* `@type - {string}`
- limit - *optional* `@type - {number}`
- offset - *optional* `@type - {number}`
- cursor - *optional* `@type - {string}`
- cursorDirection - *optional* `@type - {string}`
- orderType - *optional* `@type - {string} ` => write `"ASC"` or `"DESC"`
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:files**
- **let:error**
#### Example
```svelte
import { FileList } from "metawrite"
// Optional
let bucketId = 'default';
let search = '';
let limit = 10;
let offset = 0;
let orderType = 'ASC';
{#each files as file}
File: {file.name}
{/each}
Reload
```
### ``
#### Arguments
- bucketId - it is your Bucket ID `@type - {string}`
- fileId - it is File ID `@type - {string}`
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `download()` | Downloads file. |
| `view()` | Get file for View. |
| `preview(width, height, quality, background, output)` | Get file for preview. |
| `update(read, write)` | Updates a file. |
| `delete()` | Deletes a file. |
#### Example
```svelte
import { File } from 'metawrite';
// Required
let bucketId: string;
let fileId: string;
// OPTIONAL
/** @type {number} */ let width;
/** @type {number} */ let height;
/** @type {string} */ let gravity;
/** @type {number} */ let quality;
/** @type {number} */ let borderWidth;
/** @type {string} */ let borderColor;
/** @type {number} */ let borderRadius;
/** @type {number} */ let opacity;
/** @type {number} */ let rotation;
/** @type {string} */ let background;
/** @type {string} */ let output;
/** @type {string[]} */ let read;
/** @type {string[]} */ let write;
Download File
File View
Preview File
Update File
Delete File
```
## Functions
The Functions service allows you to create custom behaviour that can be triggered by any supported Appwrite system events or by a predefined schedule.
Appwrite Cloud Functions lets you automatically run backend code in response to events triggered by Appwrite or by setting it to be executed in a predefined schedule. Your code is stored in a secure way on your Appwrite instance and is executed in an isolated environment.
You can learn more by following Appwrite's [Cloud Functions tutorial](https://appwrite.io/docs/functions).
### ``
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
| `create(functionId, data)` | Creates Execution. `functionId` is _required_, `data` could be empty string because _optional_. `@type {string}`|
| `create(functionId, executionId)` | Get Execution. Both parameters are required. `@type {string}` |
- **let:executions**
#### Slots
- **error**
#### Example
```svelte
import { Function } from 'metawrite';
let functionId = 'someExecution'; // required
let newFunctionId = '';
let data = 'String of custom data to send to function.'; // could be empty string because optional
{#each executions as execution}
Execution ID: {execution.$id}, Function ID: {execution.functionId}, Date Created: {execution.dateCreated}
{/each}
Create Execution
```
## Locale
The Locale components allow you to customize your app based on your users' location.
### ``
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:continents**
#### Slots
- **loading**
- **error**
#### Example
```svelte
import { Continents } from 'metawrite';
Reload
There are {continents.sum} continents:
{#each continents.continents as continent}
{continent.name}, {continent.code}
{/each}
```
### ``
#### Arguments
- eu
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:countries**
#### Example
```svelte
import { Countries } from 'metawrite';
let eu = true; // if you want to list only EU countries
Reload
There are {countries.sum} countries in the world:
{#each countries.countries as country}
{country.name}, {country.code}
{/each}
Reload
There are {countries.sum} countries in EU:
{#each countries.countries as country}
{country.name}, {country.code}
{/each}
```
### ``
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:currencies**
#### Example
```svelte
import { Currencies } from 'metawrite';
Reload
There are {currencies.sum} currencies:
{#each currencies.currencies as currency}
{currency.symbol} - {currency.name} ({currency.code})
{/each}
```
### ``
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:languages**
#### Example
```svelte
import { Languages } from 'metawrite';
Reload
There are {languages.sum} languages:
{#each languages.languages as language}
{language.name}, {language.code}>
{/each}
```
### ``
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:code** `object`
#### Example
```svelte
import { Locale } from 'metawrite';
Active Session
Reload
Location: {code.country}, {code.continentCode}
IP: {code.ip}
```
### ``
#### Slots
- **loading**
- **error**
#### Directives
**let:actions**
| Name | Description |
| --- | --- |
| `reload()` | Reload. |
- **let:codes**
#### Example
```svelte
import { PhoneCodes } from 'metawrite';
Reload
There are {codes.sum} phone codes:
{#each codes.phones as phone}
{phone.code} - {phone.countyName}>
{/each}
```
# Stack
