{"id":13599188,"url":"https://github.com/koodeau/metawrite","last_synced_at":"2026-03-03T22:01:47.231Z","repository":{"id":43780023,"uuid":"458602162","full_name":"koodeau/metawrite","owner":"koodeau","description":"Appwrite SDK with ready to go components for Svelte / SvelteKit","archived":false,"fork":false,"pushed_at":"2023-03-07T08:09:41.000Z","size":954,"stargazers_count":26,"open_issues_count":3,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-10-27T10:52:07.163Z","etag":null,"topics":["appwrite","collaborate","components","github","learn","library","sdk","svelte","sveltekit"],"latest_commit_sha":null,"homepage":"https://increas.io/metawrite","language":"Svelte","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/koodeau.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2022-02-12T18:12:15.000Z","updated_at":"2024-04-15T14:56:20.000Z","dependencies_parsed_at":"2024-01-16T23:26:02.781Z","dependency_job_id":"6b2f42a8-5fc6-4310-8613-a2787d4a6ae1","html_url":"https://github.com/koodeau/metawrite","commit_stats":{"total_commits":112,"total_committers":1,"mean_commits":112.0,"dds":0.0,"last_synced_commit":"7e73a107a1b0a230be4de1e6ab47a80835e9a650"},"previous_names":[],"tags_count":48,"template":false,"template_full_name":null,"purl":"pkg:github/koodeau/metawrite","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koodeau%2Fmetawrite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koodeau%2Fmetawrite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koodeau%2Fmetawrite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koodeau%2Fmetawrite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/koodeau","download_url":"https://codeload.github.com/koodeau/metawrite/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koodeau%2Fmetawrite/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30063358,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-03T18:21:05.932Z","status":"ssl_error","status_checked_at":"2026-03-03T18:20:59.341Z","response_time":61,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["appwrite","collaborate","components","github","learn","library","sdk","svelte","sveltekit"],"created_at":"2024-08-01T17:01:00.654Z","updated_at":"2026-03-03T22:01:47.213Z","avatar_url":"https://github.com/koodeau.png","language":"Svelte","funding_links":[],"categories":["Enhancers/Extensions"],"sub_categories":["The _How To's?_"],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg alt=\"Metawrite\" src=\"static/logo.svg\" /\u003e\n\u003c/p\u003e\n\n\u003ca href=\"https://www.npmjs.com/package/metawrite\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/npm-CB3837?style=for-the-badge\u0026logo=npm\u0026logoColor=white\" /\u003e\n\u003c/a\u003e\n\n\u003ca href=\"https://classic.yarnpkg.com/en/package/metawrite\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Yarn-2C8EBB?style=for-the-badge\u0026logo=yarn\u0026logoColor=white\" /\u003e\n\u003c/a\u003e\n\n# Support Us \n\n**Get free $100 credits on DigitalOcean:**\n\n\u003ca href=\"https://do.koodeau.com\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Digital_Ocean-0080FF?style=for-the-badge\u0026logo=DigitalOcean\u0026logoColor=white\" /\u003e\n\u003c/a\u003e\n\n**Join our Discord:**\n\n\u003ca href=\"https://discord.gg/n3WZxtbkCm\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Discord-5865F2?style=for-the-badge\u0026logo=discord\u0026logoColor=white\" /\u003e\n\u003c/a\u003e\n\n---\n\n[![npm Package](https://github.com/koodeau/metawrite/actions/workflows/npm-publish.yml/badge.svg)](https://github.com/koodeau/metawrite/actions/workflows/npm-publish.yml) \n\nMetawrite is [Appwrite](https://appwrite.io/) SDK with ready to go components for `Svelte` / `SvelteKit`\n\nThis package is maintained by [Increasio](https://increas.io).\n\n\u003e Note: versions `x.x.n` means some minor changes to package documentation or typings.\n\u003e \n\u003e versions `x.n.x` might include some minor breaking changes. See [Release Notes](https://github.com/koodeau/metawrite/blob/main/CHANGELOG.md).\n\u003e \n\u003e versions `n.x.x` might include some major breaking changes. See [Release Notes](https://github.com/koodeau/metawrite/blob/main/CHANGELOG.md).\n\n## Important info\n\nThe 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).\n\n\u003e Please consider using [template](https://github.com/koodeau/sveltekit-metawrite), this is temporary \n\n# Documentation\n\n### Installation\n\nUsing NPM:\n\n```bash\nnpm install metawrite\n```\n\nUsing Yarn:\n\n```bash\nyarn add metawrite\n```\n\n# Table of contents\n\n- [Support Us](#support-us)\n\t- [Important info](#important-info)\n- [Documentation](#documentation)\n\t\t- [Installation](#installation)\n- [Table of contents](#table-of-contents)\n- [Usage](#usage)\n\t- [Initialize](#initialize)\n\t\t- [Properties](#properties)\n\t- [Create user](#create-user)\n\t\t- [Directives](#directives)\n\t\t\t- [Arguments](#arguments)\n\t\t- [Events](#events)\n\t\t\t- [Arguments](#arguments-1)\n\t\t\t- [Arguments](#arguments-2)\n\t- [Login via Email](#login-via-email)\n\t\t- [Directives](#directives-1)\n\t\t\t- [Arguments](#arguments-3)\n\t\t- [Events](#events-1)\n\t\t\t- [Arguments](#arguments-4)\n\t\t\t- [Arguments](#arguments-5)\n\t- [Login via OAuth2](#login-via-oauth2)\n\t\t- [Properties](#properties-1)\n\t\t- [Directives](#directives-2)\n\t- [Get user](#get-user)\n\t\t- [Directives](#directives-3)\n\t- [Get Collection](#get-collection)\n\t\t- [Properties](#properties-2)\n\t\t- [Directives](#directives-4)\n\t\t\t- [Arguments](#arguments-6)\n\t- [Get Document](#get-document)\n\t\t- [Properties](#properties-3)\n\t\t- [Directives](#directives-5)\n\t\t\t- [Arguments](#arguments-7)\n\t\t- [Events](#events-2)\n- [API](#api)\n\t- [Account](#account)\n\t\t- [`\u003cUser /\u003e`](#user-)\n\t\t\t- [Slots](#slots)\n\t\t\t- [Directives](#directives-6)\n\t\t\t- [Events](#events-3)\n\t\t\t- [Example](#example)\n\t\t- [`\u003cCreate /\u003e`](#create-)\n\t\t\t- [Directives](#directives-7)\n\t\t\t- [Events](#events-4)\n\t\t\t- [Example](#example-1)\n\t\t- [`\u003cPreferences /\u003e`](#preferences-)\n\t\t\t- [Slots](#slots-1)\n\t\t\t- [Directives](#directives-8)\n\t\t\t- [Events](#events-5)\n\t\t\t- [Example](#example-2)\n\t\t- [`\u003cRecoverPassword /\u003e`](#recoverpassword-)\n\t\t\t- [Directives](#directives-9)\n\t\t\t- [Events](#events-6)\n\t\t\t- [Example](#example-3)\n\t\t- [`\u003cUpdate /\u003e`](#update-)\n\t\t\t- [Directives](#directives-10)\n\t\t\t- [Events](#events-7)\n\t\t\t- [Example](#example-4)\n\t\t- [`\u003cVerification /\u003e`](#verification-)\n\t\t\t- [Directives](#directives-11)\n\t\t\t- [Events](#events-8)\n\t\t\t- [Example](#example-5)\n\t- [Auth](#auth)\n\t\t- [`\u003cAuthEmail /\u003e`](#authemail-)\n\t\t\t- [Slots](#slots-2)\n\t\t\t- [Directives](#directives-12)\n\t\t\t- [Events](#events-9)\n\t\t\t- [Example](#example-6)\n\t\t- [`\u003cAuthOAuth2 /\u003e`](#authoauth2-)\n\t\t\t- [Properties](#properties-4)\n\t\t\t- [Example](#example-7)\n\t\t- [`\u003cCreateAnonymousSession /\u003e`](#createanonymoussession-)\n\t\t\t- [Directives](#directives-13)\n\t\t\t- [Example](#example-8)\n\t\t- [`\u003cCreateJWT /\u003e`](#createjwt-)\n\t\t\t- [Directives](#directives-14)\n\t\t\t- [Example](#example-9)\n\t\t- [`\u003cMagicURL /\u003e`](#magicurl-)\n\t\t\t- [Directives](#directives-15)\n\t\t\t- [Example](#example-10)\n\t- [Avatars](#avatars)\n\t\t- [`\u003cBrowser /\u003e`](#browser-)\n\t\t\t- [Arguments](#arguments-8)\n\t\t\t- [Directives](#directives-16)\n\t\t\t- [Example](#example-11)\n\t\t- [`\u003cCreditCard /\u003e`](#creditcard-)\n\t\t\t- [Arguments](#arguments-9)\n\t\t\t- [Directives](#directives-17)\n\t\t\t- [Example](#example-12)\n\t\t- [`\u003cFavicon /\u003e`](#favicon-)\n\t\t\t- [Arguments](#arguments-10)\n\t\t\t- [Directives](#directives-18)\n\t\t- [`\u003cFlag /\u003e`](#flag-)\n\t\t\t- [Arguments](#arguments-11)\n\t\t\t- [Directives](#directives-19)\n\t\t\t- [Example](#example-13)\n\t\t- [`\u003cImage /\u003e`](#image-)\n\t\t\t- [Arguments](#arguments-12)\n\t\t\t- [Directives](#directives-20)\n\t\t\t- [Example](#example-14)\n\t\t- [`\u003cQR /\u003e`](#qr-)\n\t\t\t- [Arguments](#arguments-13)\n\t\t\t- [Directives](#directives-21)\n\t\t\t- [Example](#example-15)\n\t- [Database](#database)\n\t\t- [`\u003cCollection /\u003e`](#collection-)\n\t\t\t- [Arguments](#arguments-14)\n\t\t\t- [Slots](#slots-3)\n\t\t\t- [Directives](#directives-22)\n\t\t\t- [Example](#example-16)\n\t\t- [`\u003cDocument /\u003e`](#document-)\n\t\t\t- [Arguments](#arguments-15)\n\t\t\t- [Slots](#slots-4)\n\t\t\t- [Directives](#directives-23)\n\t\t\t- [Example](#example-17)\n\t- [Realtime](#realtime)\n\t\t\t- [Arguments](#arguments-16)\n\t\t\t- [Directives](#directives-24)\n\t\t\t- [Example](#example-18)\n\t- [Storage](#storage)\n\t\t- [`\u003cStorage /\u003e`](#storage-)\n\t\t\t- [Directives](#directives-25)\n\t\t\t- [Example](#example-19)\n\t\t- [`\u003cFileList /\u003e`](#filelist-)\n\t\t\t- [Arguments](#arguments-17)\n\t\t\t- [Slots](#slots-5)\n\t\t\t- [Directives](#directives-26)\n\t\t\t- [Example](#example-20)\n\t\t- [`\u003cFile /\u003e`](#file-)\n\t\t\t- [Arguments](#arguments-18)\n\t\t\t- [Directives](#directives-27)\n\t\t\t- [Example](#example-21)\n\t- [Functions](#functions)\n\t\t- [`\u003cFunction /\u003e`](#function-)\n\t\t\t- [Directives](#directives-28)\n\t\t\t- [Slots](#slots-6)\n\t\t\t- [Example](#example-22)\n\t- [Locale](#locale)\n\t\t- [`\u003cContinents /\u003e`](#continents-)\n\t\t\t- [Directives](#directives-29)\n\t\t\t- [Slots](#slots-7)\n\t\t\t- [Example](#example-23)\n\t\t- [`\u003cCountries /\u003e`](#countries-)\n\t\t\t- [Arguments](#arguments-19)\n\t\t\t- [Slots](#slots-8)\n\t\t\t- [Directives](#directives-30)\n\t\t\t- [Example](#example-24)\n\t\t- [`\u003cCurrencies /\u003e`](#currencies-)\n\t\t\t- [Slots](#slots-9)\n\t\t\t- [Directives](#directives-31)\n\t\t\t- [Example](#example-25)\n\t\t- [`\u003cLanguages /\u003e`](#languages-)\n\t\t\t- [Slots](#slots-10)\n\t\t\t- [Directives](#directives-32)\n\t\t\t- [Example](#example-26)\n\t\t- [`\u003cLocale /\u003e`](#locale-)\n\t\t\t- [Slots](#slots-11)\n\t\t\t- [Directives](#directives-33)\n\t\t\t- [Example](#example-27)\n\t\t- [`\u003cPhoneCodes /\u003e`](#phonecodes-)\n\t\t\t- [Slots](#slots-12)\n\t\t\t- [Directives](#directives-34)\n\t\t\t- [Example](#example-28)\n- [Stack](#stack)\n\n# Usage\n\n\u003e You need a running instance of Appwrite to use this library. Go to https://appwrite.io/docs/installation for more instructions.\n\n**Psuedo Example**\n\nHandle multiple levels of async relational data (and their loading \u0026 fallback states) entirely from the Svelte markup.\n\n```svelte\n\u003c!-- 1. 💪 Appwrite App --\u003e\n\u003cAppwrite {...config}\u003e\n\n    \u003c!-- 2. 😀 Get the current user if logged in --\u003e\n    \u003cUser let:user\u003e\n\n        \u003ch1\u003eHello {user.name}!\u003c/h1\u003e\n\n        \u003c!-- 3. 📚 Get all the documents from a collection --\u003e\n        \u003cCollection collectionId=\"5f56a3035a01f\" let:documents\u003e\n            You have {documents.length} documents.\n\n            {#each documents as document}\n\n                \u003c!-- 4. 📜 Get a document --\u003e\n                \u003cDocument collectionId=\"5f56a3035a01f\" documentId={document.$id} {document}\u003e\n                    Title: {document.title}\n                    Text: {document.text}\n...\n```\n\n## Initialize\n\nMust be initialised and wrap every `metawrite` component.\n\n```svelte\n\u003cscript\u003e\n\timport { Appwrite } from 'metawrite';\n\n\tconst config = {\n\t\tendpoint: 'http://localhost/v1',\n\t\tproject: 'demo',\n\t\tlocale: 'fr'\n\t};\n\u003c/script\u003e\n\n\u003cAppwrite {...config}\u003e...\u003c/Appwrite\u003e\n```\n\n### Properties\n\n| Name       | Description                                     |\n| ---------- | ----------------------------------------------- |\n| `endpoint` | Your Appwrite endpoint. `@type - {string}`      |\n| `project`  | Your project ID. `@type - {string}`             |\n| `locale`   | _Optional_ The users locale. `@type - {string}` |\n| `realtime`   | _Optional_ Set Custom realtime endpoint. By default the same as `endpoint`. `@type - {string}` |\n\n## Create user\n\nRegisters a new account.\n\n```svelte\n\u003cscript\u003e\n\timport { Create } from 'metawrite';\n\n\tlet email = '';\n\tlet password = '';\n\tlet name = '';\n\n\tconst success = (e) =\u003e {\n\t\t//success callback\n\t\t// `e` contains the user object\n\t};\n\n\tconst failure = (e) =\u003e {\n\t\t//failure callback\n\t};\n\u003c/script\u003e\n\n\u003cCreate let:actions on:success on:failure\u003e\n\t\u003cinput type=\"text\" bind:value={email} /\u003e\n\t\u003cinput type=\"password\" bind:value={password} /\u003e\n\t\u003cinput type=\"text\" bind:value={name} /\u003e\n\t\u003cbutton on:click={actions.create(email, password, name)}\u003eRegister\u003c/button\u003e\n\u003c/Create\u003e\n```\n\n### Directives\n\n**let:actions** `object`\n\nObject with function.\n\n#### Arguments\n\n| Name                            | Description                              |\n| ------------------------------- | ---------------------------------------- |\n| `create(email, password, name)` | Registers a new user. `@type - {string}` |\n\n### Events\n\n**on:success**\n\nTriggers on successful register.\n\n#### Arguments\n\n| Name       | Description |\n| ---------- | ----------- |\n| `response` | Response    |\n\n**on:failure**\n\nTriggers on failed register.\n\n#### Arguments\n\n| Name       | Description |\n| ---------- | ----------- |\n| `response` | Response    |\n\n## Login via Email\n\nLogin via email and password.\n\n```svelte\n\u003cscript\u003e\n\timport { AuthEmail } from 'metawrite';\n\n\tlet email = '';\n\tlet password = '';\n\n\tconst success = (e) =\u003e {\n\t\t//success callback\n\t\t// `e` contains the user object\n\t};\n\n\tconst failure = (e) =\u003e {\n\t\t//failure callback\n\t};\n\u003c/script\u003e\n\n\u003cAuthEmail let:authorize on:success on:failure\u003e\n\t\u003cinput type=\"text\" bind:value={email} /\u003e\n\t\u003cinput type=\"text\" bind:value={password} /\u003e\n\t\u003cbutton on:click={authorize(email, password)}\u003eLogin\u003c/button\u003e\n\u003c/AuthEmail\u003e\n```\n\n### Directives\n\n**let:authorize** `function`\n\nInitiates login.\n\n#### Arguments\n\n| Name       | Description                  |\n| ---------- | ---------------------------- |\n| `email`    | E-Mail. `@type - {string}`   |\n| `password` | Password. `@type - {string}` |\n\n### Events\n\n**on:success**\n\nTriggers on successful login.\n\n#### Arguments\n\n| Name    | Description                |\n| ------- | -------------------------- |\n| `email` | E-Mail. `@type - {string}` |\n\n**on:failure**\n\nTriggers on failed login.\n\n#### Arguments\n\n| Name    | Description   |\n| ------- | ------------- |\n| `error` | Error object. |\n\n## Login via OAuth2\n\nLogin via an OAuth2 provider.\n\n```svelte\n\u003cscript\u003e\n\timport { AuthOAuth2 } from 'metawrite';\n\u003c/script\u003e\n\n\u003cAuthOAuth2\n\tauthProvider=\"google\"\n\tsuccess=\"http://localhost:3000?success\"\n\tfailure=\"http://localhost:3000?failure\"\n\tlet:authorize\n\u003e\n\t\u003cbutton on:click={authorize}\u003eLogin Google\u003c/button\u003e\n\u003c/AuthOAuth2\u003e\n```\n\n### Properties\n\n| Name       | Description                         |\n| ---------- | ----------------------------------- |\n| `authProvider` | OAuth2 provider. `@type - {string}` |\n| `success`  | Success url. `@type - {string}`     |\n| `failure`  | Failure url. `@type - {string}`     |\n\n### Directives\n\n**let:authorize** `function`\n\n## Get user\n\nRequests current user to check if logged in.\n\n```svelte\n\u003cscript\u003e\n\timport { User } from 'metawrite';\n\u003c/script\u003e\n\n\u003cUser let:user\u003e\n\t\u003ch1\u003eHello {user.name}!\u003c/h1\u003e\n\t\u003cdiv\u003e{user.email}\u003c/div\u003e\n\n\t\u003cdiv slot=\"error\"\u003eYou are not logged in!\u003c/div\u003e\n\u003c/User\u003e\n```\n\n### Directives\n\n**let:user** `object`\n\nGet currently logged in user data.\n\n## Get Collection\n\nGet a list of all the documents from a collection.\n\n```svelte\n\u003cscript\u003e\n\timport { Collection } from 'metawrite';\n\u003c/script\u003e\n\n\u003cCollection collectionId=\"5f56a3035a01f\" let:documents\u003e\n\tYou have {documents.length} documents.\n\u003c/Collection\u003e\n```\n\n### Properties\n\n| Name           | Description                                                            |\n| -------------- | ---------------------------------------------------------------------- |\n| `collectionId` | Collection unique ID. `@type - {string}`                               |\n| _additional_   | same as [here](https://appwrite.io/docs/client/database#listDocuments) |\n\n### Directives\n\n**let:documents** `array`\n\nArray of documents.\n\n**let:actions** `object`\n\nObject with function.\n\n#### Arguments\n\n| Name                        | Description                                                                                                                                        |\n| --------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `reload()`                  | Re-fetch collection.                                                                                                                               |\n| `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}` |\n\n## Get Document\n\nGet a document. If you pass the `document` property with data from \u003cCollection /\u003e, there wont be any data requested.\n\n```svelte\n\u003cscript\u003e\n\timport { Document } from 'metawrite';\n\u003c/script\u003e\n\n\u003cDocument documentId=\"5f56a3asda01f\" let:document\u003e\n\tTitle: {document.title}\n\tText: {document.text}\n\u003c/Document\u003e\n```\n\n### Properties\n\n| Name           | Description                              |\n| -------------- | ---------------------------------------- |\n| `documentId`   | Document unique ID. `@type - {string}`   |\n| `collectionId` | Collection unique ID. `@type - {string}` |\n| or             |                                          |\n| `document`     | Document passed from `\u003cCollection /\u003e`    |\n\n### Directives\n\n**let:document** `object`\n\nA JSON object with the document data.\n\n**let:actions** `object`\n\nObject with function.\n\n#### Arguments\n\n| Name           | Description                                       |\n| -------------- | ------------------------------------------------- |\n| `update(data)` | Update the document. `data` is `@type - {string}` |\n| `remove()`     | Deletes the document.                             |\n| `reload()`     | Re-fetch document.                                |\n\n### Events\n\n**on:change**\n\nTriggers on update or remove login.\n\n# API\n\n## Account\n\nThe Account components allow you to manage a user account.\n\n### `\u003cUser /\u003e`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n| `logout()` | Logout current session. |\n| `logoutAll()` | Logout from all session. |\n| `logoutFrom(session)` | Logout from specific session. `session` is `@type - {string}` |\n\n- **let:user** `object`\n- **let:error**\n\n#### Events\n\n- **on:success** On user fetch success.\n- **on:failure** On user fetch failure.\n- **on:successLogout** On `logout` success.\n- **on:failureLogout** On `logout` failure.\n- **on:successLogoutFrom** On `logoutFrom` success.\n- **on:failureLogoutFrom** On `logoutFrom` failure.\n- **on:successLogoutAll** On `logoutAll` success.\n- **on:failureLogoutAll** On `logoutAll` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { User } from 'metawrite';\n\u003c/script\u003e\n\n\u003cUser let:actions let:user\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload user data\u003c/button\u003e\n\t\u003cbutton on:click={actions.get()}\u003eGet logged in user data\u003c/button\u003e\n\t\u003cbutton on:click={actions.logout()}\u003eLog out from current session\u003c/button\u003e\n\t\u003cbutton on:click={actions.logoutFrom('sessionId')}\u003eLog out from specific session\u003c/button\u003e\n\t\u003cbutton on:click={actions.logoutAll()}\u003eLog out from all sessions\u003c/button\u003e\n\n\t\u003c!-- If logged in --\u003e\n\t\u003cp\u003eHi, {user.name}\u003c/p\u003e\n\u003c/User\u003e\n```\n\n### `\u003cCreate /\u003e`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `create(email, password, name)` | Creates a user. `email` and `password` are required - `@type - {string}`. `name` is _optional_ - `@type - {string}` |\n\n#### Events\n\n- **on:success** On `create` success.\n- **on:failure** On `create` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Create } from 'metawrite';\n\n\tlet name,\n\t\temail,\n\t\tpassword = '';\n\n\tconst success = (e) =\u003e {\n\t\t// success callback\n\t\t// `e` contains the user object\n\t};\n\n\tconst failure = (e) =\u003e {\n\t\t// failure callback\n\t};\n\u003c/script\u003e\n\n\u003cCreate let:actions on:success on:failure\u003e\n\t\u003cinput type=\"text\" name=\"name\" placeholder=\"name\" bind:value={name} /\u003e\n\t\u003cinput type=\"text\" name=\"email\" placeholder=\"email\" bind:value={email} /\u003e\n\t\u003cinput type=\"password\" name=\"password\" placeholder=\"password\" bind:value={password} /\u003e\n\t\u003cbutton on:click={actions.create(name, email, password)}\u003eCreate Account\u003c/button\u003e\n\u003c/Create\u003e\n```\n\n### `\u003cPreferences /\u003e`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reloads preferences. |\n| `update(prefs)` | Update preferences. `prefs` - `@type - {object}` |\n\n#### Events\n\n- **on:success** On init and `reload` success.\n- **on:failure** On init and `reload` failure.\n- **on:successUpdate** On `update` success.\n- **on:failureUpdate** On `update` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Preferences } from 'metawrite';\n\n\tlet prefs = {\n\t\t// You can pass only the specific settings you wish to update.\n\t};\n\u003c/script\u003e\n\n\u003cPreferences let:actions\u003e\n\t\u003cbutton\n\t\ton:click={() =\u003e {\n\t\t\tactions.update(prefs);\n\t\t\tactions.reload();\n\t\t}}\u003eUpdate Preferences\u003c/button\n\t\u003e\n\u003c/Preferences\u003e\n```\n\n### `\u003cRecoverPassword /\u003e`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `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. |\n| `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}`. |\n\n#### Events\n\n- **on:successRecover** On init and `reload` success.\n- **on:failureRecover** On init and `reload` failure.\n- **on:successComplete** On `update` success.\n- **on:failureComplete** On `update` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n    import { RecoverPassword } from \"metawrite\";\n\n    const url = \"http://localhost:3000/reset-password\"; // URL that will point to the next step.\n    let email = '';\n\n    const successRecover = e =\u003e {\n    //success callback\n    // `e` contains the user object\n  };\n\n  const failureRecover = e =\u003e {\n    //failure callback\n  }\n\u003c/script\u003e\n\n\u003c!-- localhost/forgot-password --\u003e\n\u003cRecoverPassword let:actions on:successRecover on:failureRecover\u003e\n    \u003cinput name=\"email\" type=\"text\" bind:value={email, url} placeholder=\"Email\" /\u003e\n    \u003cbutton on:click{actions.recover(email)}\u003eRecover Password\u003c/button\u003e\n\u003c/RecoverPassword\u003e\n\n\u003c!-- Then on localhost/reset-password  --\u003e\n\u003cscript\u003e\n    import { RecoverPassword } from \"metawrite\";\n\n    let password, passwordAgain = '';\n\n    const successComplete = e =\u003e {\n    //success callback\n    // `e` contains the user object\n  };\n\n  const failureComplete = e =\u003e {\n    //failure callback\n  }\n\u003c/script\u003e\n\n\u003cRecoverPassword let:actions on:successComplete on:failureComplete\u003e\n    \u003cinput type=\"password\" name=\"password\" bind:value{password} placeholder=\"Password\" /\u003e\n    \u003cinput type=\"password\" name=\"password\" bind:value{passwordAgain} placeholder=\"Confirm Password\" /\u003e\n    \u003cbutton on:click{actions.complete(password, passwordAgain)}\u003eSet New Password\u003c/button\u003e\n\u003c/RecoverPassword\u003e\n```\n\n### `\u003cUpdate /\u003e`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `name(name)` | Update name. All fields are required. `@type - {string}` |\n| `email(email, password)` | Update email. All fields are required. `@type - {string}` |\n| `password(password, oldPassword)` | Update password. All fields are required. `@type - {string}` |\n\n#### Events\n\n- **on:successName** On `name` success.\n- **on:failureName** On `name` failure.\n- **on:successEmail** On `email` success.\n- **on:failureEmail** On `email` failure.\n- **on:successPassword** On `password` success.\n- **on:failurePassword** On `password` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Update } from 'metawrite';\n\n\tlet name,\n\t\temail,\n\t\tpassword,\n\t\tnewPassword,\n\t\toldPassword = '';\n\u003c/script\u003e\n\n\u003cUpdate let:actions\u003e\n\t\u003cbutton on:click={actions.name(name)}\u003eThis updates name\u003c/button\u003e\n\t\u003cbutton on:click={actions.email(email, password)}\u003eThis updates email\u003c/button\u003e\n\t\u003cbutton on:click={actions.password(newPassword, oldPassword)}\u003eThis updates password\u003c/button\u003e\n\u003c/Update\u003e\n```\n\n### `\u003cVerification /\u003e`\n\nCreates and automatically validates user email verification.\n\n- `url` of type string for action `create` should be where your app is hosted or `localhost`.\n- For `update` action you don't need to pass anything, the process is automated.\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `create(url)` | Create Verification. `url` is what URL used to create verification link sent to your email inbox. `@type - {string}` |\n| `update(user, secret)` | Complete Verification. `user` and `secret` are set automatically by `metawrite`. |\n\n#### Events\n\n- **on:successCreate** On `create` success.\n- **on:failureCreate** On `create` failure.\n- **on:successComplete** On `complete` success.\n- **on:failureComplete** On `complete` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Verification } from 'metawrite';\n\n\tconst url = window.location.href;\n\u003c/script\u003e\n\n\u003cVerification let:actions\u003e\n\t\u003cbutton on:click={actions.create(url)} /\u003e\n\t\u003cbutton on:click={actions.update()}\u003eUpdate email verification status\u003c/button\u003e\n\u003c/Verification\u003e\n```\n\n## Auth\n\nThe Auth components allow you to authenticate a user account.\n\n### `\u003cAuthEmail /\u003e`\n\n#### Slots\n\n- **loading**\n- **success**\n- **error**\n\n#### Directives\n\n- **let:authorize(email, password)**\n- **let:user**\n- **let:error**\n\n#### Events\n\n- **on:success** On `authorize` success.\n- **on:failure** On `authorize` failure.\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { AuthEmail } from 'metawrite';\n\n\tlet email = '';\n\tlet password = '';\n\n\tconst success = (e) =\u003e {\n\t\t//success callback\n\t\t// `e` contains the user object\n\t};\n\n\tconst failure = (e) =\u003e {\n\t\t//failure callback\n\t};\n\u003c/script\u003e\n\n\u003cAuthEmail let:authorize on:success on:failure\u003e\n\t\u003cinput type=\"text\" bind:value={email} /\u003e\n\t\u003cinput type=\"text\" bind:value={password} /\u003e\n\t\u003cbutton on:click={authorize(email, password)}\u003eLogin\u003c/button\u003e\n\u003c/AuthEmail\u003e\n```\n\n### `\u003cAuthOAuth2 /\u003e`\n\n#### Properties\n\n| Name            | Description                         |\n| --------------- | ----------------------------------- |\n| `authProvider`      | OAuth2 provider. `@type - {string}` |\n| `success`       | Success url. `@type - {string}`     |\n| `failure`       | Failure url. `@type - {string}`     |\n| #### Directives |                                     |\n\n**let:authorize()**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { AuthOAuth2 } from 'metawrite';\n\u003c/script\u003e\n\n\u003cAuthOAuth2\n\tauthProvider=\"google\"\n\tsuccess=\"http://localhost:3000?success\"\n\tfailure=\"http://localhost:3000?failure\"\n\tlet:authorize\n\u003e\n\t\u003cbutton on:click={authorize}\u003eLogin Google\u003c/button\u003e\n\u003c/AuthOAuth2\u003e\n```\n\n### `\u003cCreateAnonymousSession /\u003e`\n\n#### Directives\n\n**let:actions**\n\n| Name       | Description                |\n| ---------- | -------------------------- |\n| `create()` | Creates anonymous session. |\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { CreateAnonymousSession } from 'metawrite';\n\u003c/script\u003e\n\n\u003cCreateAnonymousSession let:actions\u003e\n\t\u003cbutton on:click={actions.create}\u003eCreate Anonymous Session\u003c/button\u003e\n\u003c/CreateAnonymousSession\u003e\n```\n\n### `\u003cCreateJWT /\u003e`\n\nCreates JWT token.\n\n#### Directives\n\n**let:actions**\n\n| Name       | Description        |\n| ---------- | ------------------ |\n| `create()` | Creates JWT token. |\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { CreateJWT } from 'metawrite';\n\u003c/script\u003e\n\n\u003cCreateJWT let:actions\u003e\n\t\u003cbutton on:click={actions.create}\u003eCreate JWT token\u003c/button\u003e\n\u003c/CreateJWT\u003e\n```\n\n### `\u003cMagicURL /\u003e`\n\n#### Directives\n\n**let:actions**\n\n| Name                        | Description                                                  |\n| --------------------------- | ------------------------------------------------------------ |\n| `create(sessionId, email, url)` | Creates Magic URL Session. email is required, url is to point on complete step `string`, `sessionId` is not required |\n| `complete()` | Validates and completes Magic URL Session. |\n\n#### Example \n\n```svelte\n\u003cscript\u003e\n    import { MagicURL } from \"metawrite\";\n\n    let email = \"\"\n    const url = \"http://localhost:3000/page-to-complete\"\n\n\tconst successCreate = (e) =\u003e {\n\t\tconsole.log(e)\n\t}\n\tconst failureCreate = (e) =\u003e {\n\t\tconsole.log(e)\n\t}\n\tconst successComplete = (e) =\u003e {\n\t\tconsole.log(e)\n\t}\n\tconst failureComplete = (e) =\u003e {\n\t\tconsole.log(e)\n\t}\n\u003c/script\u003e\n\n\u003cMagicURL let:actions on:successCreate on:successComplete on:failureCreate on:failureComplete\u003e\n\t\t\u003cinput type=\"email\" name=\"email\" placeholder=\"Email\" bind:value={email} /\u003e\n\t\t\u003cbutton on:click={actions.create(email, url)}\u003eSend login link\u003c/button\u003e\n\t\t\u003cbutton on:click={actions.complete()}\u003eConfirm Login\u003c/button\u003e\n\u003c/MagicURL\u003e\n```\n\n## Avatars\n\nThe Avatar components aim to help you complete everyday tasks related to your app image, icons, and avatars.\n\n### `\u003cBrowser /\u003e`\n\n#### Arguments\n\n- code - _required_ `@type - {string}`\n- width - _optional_ `@type - {number}`\n- height - _optional_ `@type - {string}`\n- quality - _optional_ `@type - {string}`\n\n#### Directives\n\n- **let:src** Image link `@type - {URL}`\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Browser } from 'metawrite';\n\u003c/script\u003e\n\n\u003cBrowser code=\"firefox\" let:src\u003e\n\t\u003cimg src={String(src)} alt=\"Browser\" /\u003e\n\u003c/Browser\u003e\n```\n\n### `\u003cCreditCard /\u003e`\n\n#### Arguments\n\n- code - _required_ `@type - {string}`\n- width - _optional_ `@type - {number}`\n- height - _optional_ `@type - {string}`\n- quality - _optional_ `@type - {string}`\n\n#### Directives\n\n- **let:src** Image link `@type - {URL}`\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { CreditCard } from 'metawrite';\n\u003c/script\u003e\n\n\u003cCreditCard code=\"amex\" let:src\u003e\n\t\u003cimg src={String(src)} alt=\"card\" /\u003e\n\u003c/CreditCard\u003e\n```\n\n### `\u003cFavicon /\u003e`\n\n#### Arguments\n\n- url - _required_ `@type - {string}`\n\n#### Directives\n\n- **let:src** Image link `@type - {URL}`\n\n```svelte\n\u003cscript\u003e\n\timport { Favicon } from 'metawrite';\n\tconst url = window.location.href;\n\u003c/script\u003e\n\n\u003cFavicon {url} let:src\u003e\n\t\u003cimg src={String(src)} alt=\"favicon\" /\u003e\n\u003c/Favicon\u003e\n```\n\n### `\u003cFlag /\u003e`\n\n#### Arguments\n\n- code - _required_ `@type - {string}`\n- width - _optional_ `@type - {number}`\n- height - _optional_ `@type - {string}`\n- quality - _optional_ `@type - {string}`\n\n#### Directives\n\n- **let:src** Image link `@type - {URL}`\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Flag } from 'metawrite';\n\u003c/script\u003e\n\n\u003cFlag code=\"canada\" let:src\u003e\n\t\u003cimg src={String(src)} alt=\"flag\" /\u003e\n\u003c/Flag\u003e\n```\n\n### `\u003cImage /\u003e`\n\n#### Arguments\n\n- url - _required_ `@type - {string}`\n- width - _optional_ `@type - {number}`\n- height - _optional_ `@type - {number}`\n\n#### Directives\n\n- **let:src** Image link `@type - {URL}`\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Image } from 'metawrite';\n\n\tlet url = 'https://increas.io/';\n\tlet width,\n\t\theight = 100;\n\u003c/script\u003e\n\n\u003cImage {url} {width} {height} let:src\u003e\n\t\u003cimg src={String(src)} alt=\"someImage\" /\u003e\n\u003c/Image\u003e\n```\n\n### `\u003cQR /\u003e`\n\n#### Arguments\n\n- text - _required_ `@type - {string}`\n- size - _optional_ `@type - {optional}`\n- margin - _optional_ `@type - {number}`\n- download - _optional_ `@type - {boolean}`\n\n#### Directives\n\n- **let:src** Image link `@type - {URL}`\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { QR } from 'metawrite';\n\n\tlet text = 'https://increas.io/'; // could be any text\n\tlet size = 500;\n\tlet margin = 1;\n\tlet download = false;\n\u003c/script\u003e\n\n\u003cQR {text} {size} {margin} {download} let:src\u003e\n\t\u003cimg src={String(src)} alt=\"QR Code\" /\u003e\n\u003c/QR\u003e\n```\n\n## Database\n\nThe 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.\n\n### `\u003cCollection /\u003e`\n\n#### Arguments\n\n- collectionId - *required* `@type - {string}`\n\n- cache - *optional*, by default set to false `@type - {boolean}`\n\n  **query: `@type - {object}`**\n\n- queries - *optional* `@type - {string[]}`\n\n- limit - *optional* `@type - {number}`\n\n- offset - *optional* `@type - {number}`\n\n- cursor - *optional* `@type - {string}`\n\n- cursorDirection - *optional* `@type - {string}`\n\n- orderAttributes - *optional* `@type - {string[]}`\n\n- orderTypes - *optional* `@type - {string[]}`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n| `create(documentId, data, read, write)` | Creates a Document. `data` - `@type - {string}`.\u003cbr /\u003e `read`/`write` is optional `@type - {string[]}`.\u003cbr /\u003e`documentId` is optional, by default generates unique `@type - {string}`. |\n\n- **let:documents**\n- **let:error**\n\n#### Example \n\n```svelte\n\u003cscript\u003e\n  import { Collection } from \"metawrite\";\n\u003c/script\u003e\n\n\u003cCollection collectionId=\"5f56a3035a01f\" let:documents\u003e\n  You have {documents.length} documents.\n\u003c/Collection\u003e\n```\n\n### `\u003cDocument /\u003e`\n\n#### Arguments\n\n- documentId - *required* `@type - {string}`\n- collectionId - *required* `@type - {string}`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n| `update(data)` | Updates a Document. `data` - `@type - {object}` |\n| `remove()` | Removes a Document. |\n\n- **let:document**\n- **let:error**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Collection, Document } from 'metawrite';\n\n\tconst collectionId = '5f56a3035a01f';\n\u003c/script\u003e\n\n\u003cCollection {collectionId} let:documents\u003e\n\tYou have {documents.length} documents:\n\t{#each documents as document}\n\t\t\u003cDocument {collectionId} documentId={document.$id} let:document let:actions\u003e\n\t\t\tTitle: {document.title}\n\t\t\tText: {document.text}\n\t\t\t\u003cbutton on:click={() =\u003e {actions.remove()}}\u003eDelete\u003c/button\u003e\n\t\t\u003c/Document\u003e\n\t{/each}\n\u003c/Collection\u003e\n```\n\n## Realtime\n\nFor more information about using Realtime in Appwrite see [Realtime documentation](https://appwrite.io/docs/realtime).\n\nRealtime allows you to listen to any events on the server-side in realtime using the subscribe method.\n\nInstead 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.\n\nThis lets you build an interactive and responsive user experience by providing information from all of Appwrite's services in realtime.\n\n#### Arguments\n\n- channels - *required* `string | string[]`\n\n#### Directives\n\n**let:payload** - The payload from the subscription will contain [following properties](https://appwrite.io/docs/realtime#payload).\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `subscribe()` | Subscribing to all updates related to one or more channels. |\n| `unsubscribe()` | If you no longer want to receive updates from a subscription, you can unsubscribe so that your callbacks are no longer called. |\n\n#### Example \n\n```svelte\n\u003cscript\u003e\n\timport { Realtime } from 'metawrite';\n\u003c/script\u003e\n\n\u003cRealtime channels=\"account\" let:actions let:payload\u003e\n\t\u003ch1\u003e{payload.timestamp}\u003c/h1\u003e\n\t\u003cbutton on:click={actions.subscribe()}\u003eSubscribe to Account channel\u003c/button\u003e\n\t\u003cbutton on:click={actions.unsubscribe()}\u003eUnsubscribe from Account channel\u003c/button\u003e\n\u003c/Realtime\u003e\n```\n\n## Storage\n\nThe Storage components allow you to manage your project files. You can upload, view, download, and query all your project files.\n\n### `\u003cStorage /\u003e`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `create(bucketId, fileId, file, read, write)` | Uploads a file. \u003cbr /\u003e`fileId` is required `@type - {string}`, `\"unique()\"` will generate random unique id, but you can use custom.\u003cbr /\u003e`file` is `@type - {File}` and required.\u003cbr /\u003e`read`/`write` is `@type - {string[]}` and *optional* |\n\n#### Example\n\n```svelte\n\u003cscript lang=\"ts\"\u003e\n    import { Storage } from \"metawrite\"\n\n    // Required\n\tlet bucketId = \"default\"\n    let file: File;\n    let fileId = \"unique()\"; // this will generate random unique id, but you can use custom\n\n    // Optional\n    let read: string[];\n    let write: string[];\n\u003c/script\u003e\n\n\u003cStorage {file} let:actions\u003e\n    \u003cbutton on:click={actions.create(bucketId, fileId, file, read, write)}\u003eUpload File\u003c/button\u003e\n\u003c/Storage\u003e\n```\n\n### `\u003cFileList /\u003e`\n\n#### Arguments\n\n- bucketId - *required* `@type - {string}`\n- search - *optional* `@type - {string}`\n- limit - *optional* `@type - {number}`\n- offset - *optional* `@type - {number}`\n- cursor - *optional* `@type - {string}`\n- cursorDirection - *optional* `@type - {string}`\n- orderType - *optional* `@type - {string} ` =\u003e write  `\"ASC\"` or `\"DESC\"`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:files**\n- **let:error**\n\n#### Example \n\n```svelte\n\u003cscript\u003e\n    import { FileList } from \"metawrite\"\n\n    // Optional\n    let bucketId = 'default';\n    let search = '';\n    let limit = 10;\n    let offset = 0;\n    let orderType = 'ASC';\n\u003c/script\u003e\n\n\u003cFileList {bucketId} {search} {limit} {offset} {orderType}let:actions let:files\u003e\n    {#each files as file}\n        \u003cp\u003eFile: {file.name}\u003c/p\u003e\n    {/each}\n    \u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\u003c/FileList\u003e\n```\n\n### `\u003cFile /\u003e`\n\n#### Arguments\n\n- bucketId - it is your Bucket ID `@type - {string}`\n- fileId - it is File ID `@type - {string}`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `download()` | Downloads file. |\n| `view()` | Get file for View. |\n| `preview(width, height, quality, background, output)` | Get file for preview. |\n| `update(read, write)` | Updates a file. |\n| `delete()` | Deletes a file. |\n\n#### Example \n\n```svelte\n\u003cscript lang=\"ts\"\u003e\n\timport { File } from 'metawrite';\n\n\t// Required\n\tlet bucketId: string;\n\tlet fileId: string;\n\n\t// OPTIONAL\n\t/** @type {number} */ let width;\n\t/** @type {number} */ let height;\n\t/** @type {string} */ let gravity;\n\t/** @type {number} */ let quality;\n\t/** @type {number} */ let borderWidth;\n\t/** @type {string} */ let borderColor;\n\t/** @type {number} */ let borderRadius;\n\t/** @type {number} */ let opacity;\n\t/** @type {number} */ let rotation;\n\t/** @type {string} */ let background;\n\t/** @type {string} */ let output;\n\t/** @type {string[]} */ let read;\n\t/** @type {string[]} */ let write;\n\u003c/script\u003e\n\n\u003cFile {bucketId} {fileId} let:actions\u003e\n\t\u003cbutton on:click={actions.download()}\u003eDownload File\u003c/button\u003e\n\t\u003cbutton on:click={actions.view()}\u003eFile View\u003c/button\u003e\n\t\u003cbutton on:click={actions.preview()}\u003ePreview File\u003c/button\u003e\n\t\u003cbutton on:click={actions.update(read, write)}\u003eUpdate File\u003c/button\u003e\n\t\u003cbutton on:click={actions.delete()}\u003eDelete File\u003c/button\u003e\n\u003c/File\u003e\n```\n\n## Functions\n\nThe Functions service allows you to create custom behaviour that can be triggered by any supported Appwrite system events or by a predefined schedule.\n\nAppwrite 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.\n\nYou can learn more by following Appwrite's [Cloud Functions tutorial](https://appwrite.io/docs/functions).\n\n### `\u003cFunction /\u003e`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n| `create(functionId, data)` | Creates Execution. `functionId` is _required_, `data` could be empty string because _optional_. `@type {string}`|\n| `create(functionId, executionId)` | Get Execution. Both parameters are required. `@type {string}` |\n\n- **let:executions**\n\n#### Slots\n\n- **error**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Function } from 'metawrite';\n\tlet functionId = 'someExecution'; // required\n\tlet newFunctionId = '';\n\tlet data = 'String of custom data to send to function.'; // could be empty string because optional\n\u003c/script\u003e\n\n\u003cFunction {functionId} {data} let:actions let:executions\u003e\n\t{#each executions as execution}\n\t\t\u003cp\u003e\n\t\t\tExecution ID: {execution.$id}, Function ID: {execution.functionId}, Date Created: {execution.dateCreated}\n\t\t\u003c/p\u003e\n\t{/each}\n\t\u003cinput type=\"text\" name=\"functionId\" placeholder=\"Function ID\" bind:value={newFunctionId} /\u003e\n\t\u003cbutton on:click={actions.create(newFunctionId, data)}\u003eCreate Execution\u003c/button\u003e\n\u003c/Function\u003e\n```\n\n## Locale\n\nThe Locale components allow you to customize your app based on your users' location.\n\n### `\u003cContinents /\u003e`\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:continents**\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Continents } from 'metawrite';\n\u003c/script\u003e\n\n\u003cContinents let:actions let:continents\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eThere are {continents.sum} continents:\u003c/p\u003e\n\t{#each continents.continents as continent}\n\t\t\u003cp\u003e{continent.name}, {continent.code}\u003c/p\u003e\n\t{/each}\n\u003c/Continents\u003e\n```\n\n### `\u003cCountries /\u003e`\n\n#### Arguments\n\n- eu\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:countries**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Countries } from 'metawrite';\n\n\tlet eu = true; // if you want to list only EU countries\n\u003c/script\u003e\n\n\u003cCountries let:actions let:countries\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eThere are {countries.sum} countries in the world:\u003c/p\u003e\n\t{#each countries.countries as country}\n\t\t\u003cp\u003e{country.name}, {country.code}\u003c/p\u003e\n\t{/each}\n\u003c/Countries\u003e\n\n\u003cCountries {eu} let:actions let:countries\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eThere are {countries.sum} countries in EU:\u003c/p\u003e\n\t{#each countries.countries as country}\n\t\t\u003cp\u003e{country.name}, {country.code}\u003c/p\u003e\n\t{/each}\n\u003c/Countries\u003e\n```\n\n### `\u003cCurrencies /\u003e`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:currencies**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Currencies } from 'metawrite';\n\u003c/script\u003e\n\n\u003cCurrencies let:actions let:currencies\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eThere are {currencies.sum} currencies:\u003c/p\u003e\n\t{#each currencies.currencies as currency}\n\t\t\u003cp\u003e{currency.symbol} - {currency.name} ({currency.code})\u003c/p\u003e\n\t{/each}\n\u003c/Currencies\u003e\n```\n\n### `\u003cLanguages /\u003e`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:languages**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Languages } from 'metawrite';\n\u003c/script\u003e\n\n\u003cLanguages let:actions let:languages\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eThere are {languages.sum} languages:\u003c/p\u003e\n\t{#each languages.languages as language}\n\t\t\u003cp\u003e{language.name}, {language.code}\u003e\u003c/p\u003e\n\t{/each}\n\u003c/Languages\u003e\n```\n\n### `\u003cLocale /\u003e`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:code** `object`\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { Locale } from 'metawrite';\n\u003c/script\u003e\n\n\u003cLocale let:actions let:code\u003e\n\t\u003ch1\u003eActive Session\u003c/h1\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eLocation: {code.country}, {code.continentCode}\u003c/p\u003e\n\t\u003cp\u003eIP: {code.ip}\u003c/p\u003e\n\u003c/Locale\u003e\n```\n\n### `\u003cPhoneCodes /\u003e`\n\n#### Slots\n\n- **loading**\n- **error**\n\n#### Directives\n\n**let:actions**\n| Name | Description |\n| --- | --- |\n| `reload()` | Reload. |\n\n- **let:codes**\n\n#### Example\n\n```svelte\n\u003cscript\u003e\n\timport { PhoneCodes } from 'metawrite';\n\u003c/script\u003e\n\n\u003cPhoneCodes let:actions let:codes\u003e\n\t\u003cbutton on:click={actions.reload()}\u003eReload\u003c/button\u003e\n\t\u003cp\u003eThere are {codes.sum} phone codes:\u003c/p\u003e\n\t{#each codes.phones as phone}\n\t\t\u003cp\u003e{phone.code} - {phone.countyName}\u003e\u003c/p\u003e\n\t{/each}\n\u003c/PhoneCodes\u003e\n```\n\n# Stack\n\u003cimg src=\"https://img.shields.io/badge/Svelte-4A4A55?style=for-the-badge\u0026logo=svelte\u0026logoColor=FF3E00\" /\u003e\n\u003cimg src=\"https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge\u0026logo=typescript\u0026logoColor=white\" /\u003e\n\u003cimg src=\"https://img.shields.io/badge/JavaScript-323330?style=for-the-badge\u0026logo=javascript\u0026logoColor=F7DF1E\" /\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkoodeau%2Fmetawrite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkoodeau%2Fmetawrite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkoodeau%2Fmetawrite/lists"}