Installation

npm i -D @scriptpilot/vueuse

Usage

// Import to the application store or to any componentimport{useComposable}from'@scriptpilot/vueuse'// Initalize the composableconstcomposable=useComposable({ ...options})// Use a methodcomposable.method({ ...options})// Use a stateconsole.log(composable.state.value)

Demo App

Composables

Type

// MethodsgetType({ value})// Returns the type of the given value as a string

LocalStorage

// OptionslocalStorageKey// Local Storage key to make the state persistentdefaultValue// Default value, for objects, it will be merged with the local storage// Methodsreset()// Reset value to the default value// Statestate// Read/Writable reactive state

Collection

// OptionslocalStorageKey// Local Storage key to make the collection persistent, optionalprimaryKey// Primary key used by all documents, default is $key// MethodsaddDoc({ doc})// Add new document, key is created as UUID v4 if not providedupdateDoc({ key, updates})// Apply the updates to the documemt with the given keyremoveDoc({ key})// Remove the document with the given keysetDocs({ docs})// Replace all documents, create keys if not provided// Statedocuments// Read-only reactive array with all documents of the collection

MySQLAPI

// OptionsapiUrl// API endpoint, defaults: http://localhost:8000/api.php in dev, /api.php in prod// MethodsisAvailable()// Returns true if API is available or false if notapiRequest({ path, method, data})// Returns promise, resolves with JSON responsecreateDoc({ table, doc})// Returns promise, resolves with record keyupdateDoc({ table, key, updates})// Returns promise, resolves with record keydeleteDoc({ table, key})// Returns promise, resolves with record keygetDoc({ table, key})// Returns promise, resolves with recordgetCollection({ path})// Returns promise, resolves with record arrayuuid()// Returns a new UUID v4 string

MySQLCollection

// OptionslocalStorageKey// Local Storage key to make the collection persistent, optionalprimaryKey// Primary key used by all documents, default is $keyapiUrl// API endpoint, /api.php file by defaultsyncTable// Table name for the PHP CRUD APIsyncFilter// Filter options for the PHP CRUD API, optionalsyncInterval// Sync interval in milliseconds, 1.000 by defaultsyncStatus// Sync status, true by default// MethodsaddDoc({ doc})// Add new document, key is created as UUID v4 if not providedupdateDoc({ key, updates})// Apply the updates to the documemt with the given keyremoveDoc({ key})// Remove the document with the given keysetDocs({ docs})// Replace all documents, create keys if not providedrunSync()// Run sync manuallystartSync()// Start automatic synchronizationstopSync()// Stop automatic synchronization// Statedocuments// Read-only reactive array with all documents of the collection

`$key`varchar(36)NOT NULL,`$updated`bigint(14)NOT NULL,`$synchronized`bigint(14)NOT NULL,`$deleted`tinyint(1)NOT NULL DEFAULT0,

Google Auth

// OptionsclientId// Google OAuth Client IDclientSecret// Google OAuth Client SecretredirectUrl// Redirection URL, optional, website origin by defaultscope// Scope as string or array// MethodssignIn()// Sign-in user to Google via redirectsignOut()// Sign-out user from Google// Statetoken// Readonly, reactive access token, automatically refreshed