Type-safe Kitten globals

Kitten has a global kitten namespace that make it easy to get started with building Small Web sites and apps with it.

If you’re building something quick, that might be all you need.

However, if you use JSDoc to implement type checking for your larger projects and include @ts-check in your files, the untyped global kitten object will be a source of false negatives for the type checker and litter your code with type errors. (And you won’t be able to take advantage of code hints while authoring.)

That’s what this simple package is for.

Simply install the module and import the default export and it will behave exactly like the default global kitten namespace but with type safety.

Install

npm install @small-web/kitten

Use

For example, in a Kitten page:

index.page.js

@ts-check

import kitten from '@small-web/kitten'

export default () => {
  return {
    markup: kitten.html`
      <!-- The Alpine.js example from https://alpinejs.dev/ -->
      <div x-data='{ open: false }'>
          <button @click='open = true'>Expand</button>
 
          <span x-show='open'>
              Content…
          </span>
      </div>
    `,
    libraries: [kitten.libraries.alpineJs]
  }

You can also pick and choose which elements you import instead of using the default export.

The following example is equivalent to the one above:

@ts-check

import { html, libraries } from '@small-web/kitten'

export default () => {
  return {
    markup: html`
      <!-- The Alpine.js example from https://alpinejs.dev/ -->
      <div x-data='{ open: false }'>
          <button @click='open = true'>Expand</button>
 
          <span x-show='open'>
              Content…
          </span>
      </div>
    `,
    libraries: [libraries.alpineJs]
  }

Database type safety

Kitten by default has at least two databases per project:

An internal database called _db and a custom one for you to use in your project called db.

This package provides a type-safe _db export for the internal database as the structure is well known. It also provides exports of the global Session and Upload classes and, due to an unfortunate limitation of JSDoc, instances of these classes in the internal database have the types SessionInstance and UploadInstance.

If you want type safety for your custom project database, please create and use a type-safe database app module.

Like this? Fund us!

Small Technology Foundation is a tiny, independent not-for-profit.

We exist in part thanks to patronage by people like you. If you share our vision and want to support our work, please become a patron or donate to us today and help us continue to exist.

License

Copyright © 2023-present Aral Balkan, Small Technology Foundation Released under AGPL 3.0.