Kikko is a wrapper around SQLite interfaces. It brings transaction support, middlewares for queries, and SQLite adapters for the most popular platforms.

It also allows you to build data heavy reactive interfaces on top of SQLite for any platform with any framework or lib.

This project is in an active development! Don't expect it to work stable before stable release. Some backend could not work, and breaking API changes may happen.

Full documentation can be found on the site.

Also you can check React example at CodeSanbox (multi-tab is not supported due to CORS).

Actually, what kikko is:

1. Correct transaction handling, with transaction and queries queue
2. Middlewares api, to intercept all running queries
3. Built-in profiler information

And it also require db backend, that should implement needed interface. Other things, like reactive-queries-plugin(which gives reactivity for React or Vue) or migrations-plugin, are optional to install and use.

Features

Simple React component example

import {
  makeId,
  sql,
  useDbQuery,
  useFirstRowDbQuery,
  useRunDbQuery,
} from "@kikko-land/react";

type Note = { id: string; title: string };
const notesTable = sql.table`notes`;

export const Notes = () => {
  const notes = useDbQuery<Note>(sql`SELECT * FROM ${notesTable}`);
  const notesCount = useFirstRowDbQuery<{ count: number }>(
    sql`SELECT COUNT(*) FROM ${notesTable}`
  );

  const [addNote, addNoteState] = useRunDbQuery((db) => async () => {
    const id = makeId();

    await db.runQuery(
      sql`INSERT INTO ${notesTable}(id, title) VALUES(${id}, ${`Note#${id}`})`
    );
  });

  return (
    <>
      <button
        onClick={addNote}
        disabled={
          addNoteState.type === "running" || addNoteState.type === "waitingDb"
        }
      >
        Add note
      </button>
      <div>Add note result: {JSON.stringify(addNoteState)}</div>
      <div>Query result (total notes count: {notesCount.data?.count})</div>
      <pre>{JSON.stringify(notes)}</pre>
    </>
  );
};

Supported platforms