Package Exports

client-web-storage
client-web-storage/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (client-web-storage) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Client Web Storage

Browser storage interface for IndexedDB, WebSQL, LocalStorage, and in memory data with basic Schema and data validation.

Documentation

API References

Example

// todo.store.ts

import {ClientStore} from "client-web-storage";

interface ToDo {
    name: string;
    description: string;
    complete: boolean;
}

// create a store providing the name and schema object
// with default values or javasctipt types
const todoStore = new ClientStore<ToDo>("todo", {
    $name: String,
    description: "No Description",
    complete: false
});

Works with any web library or framework. Here is an example using React.

// app.tsx

import {useClientStore} from "client-web-storage/helpers/use-client-store";
import {todoStore} from "./stores/todo.store";

const App = () => {
    const {items, processing, error} = useClientStore<Todo>(todoStore);
        
    if(processing) {
        return <Spinner />
    }
    
    if(error) {
        return <p className="error">{error.message}</p>
    }
    
    const handleCreatItem = async () => {
        await todoStore.createItem({
            name: "Go to Gym" // only name is required (marked with $)
        });
    }
    
    return (
        <>
            <button type="button" onClick={handleCreatItem}>create todo</button>
            <FlatList list={items} renderItem={renderTodo}/>
        </>
    )
}

Installation

In Node Projects:

npm install client-web-storage

import {Schema, ClientStore} from "client-web-storage";

In the Browser

<!-- use the latest version -->
<script src="https://unpkg.com/client-web-storage/dist/client-web-storage.min.js"></script>

<!-- use a specific version -->
<script src="https://unpkg.com/client-web-storage@1.0.0/dist/client-web-storage.min.js"></script>

<script>
  const {Schema, ClientStore} = window.CWS;
</script>