Gjs

GJS TypeScript type definitions for Gjs using ts-for-gir v4.7.0.

GJS is GNOME's JavaScript runtime. With these type definitions your editor knows the GTK API: it type-checks calls, completes method names, and shows the upstream C documentation inline.

Install

Install the type definitions with npm:

npm install @girs/gjs

Usage

Import it like any other module:

import Gjs from '@girs/gjs';

For CommonJS:

const Gjs = require('@girs/gjs');

Global types

After the import, the global types of GJS are also available:

import '@girs/gjs';

print('Hello World from print');

const ByteArray = imports.byteArray;

// And so on...

Global DOM types

Some types that conflict with the DOM are outsourced to allow frameworks like Gjsify to rebuild the DOM API without causing type conflicts. Import them explicitly:

import '@girs/gjs/dom';

console.log('Hello World from console');

const encoder = new TextEncoder();
const encoded = encoder.encode('𝓽𝓮𝔁𝓽');

setTimeout(() => {
  // ...
}, 1000);

// And so on...

These collide with the DOM types. Exclude the DOM lib in your tsconfig.json or jsconfig.json, or set noLib.

Ambient Modules

GJS's built-in ambient modules are importable too. For this you need to include the @girs/gjs or @girs/gjs/ambient in your tsconfig or entry point Typescript file:

index.ts:

import '@girs/gjs'

tsconfig.json:

{
  "compilerOptions": {
    ...
  },
  "include": ["@girs/gjs"],
  ...
}

gettext, system and cairo now resolve as ESM imports, with types:

import gettext from 'gettext';
import system from 'system';
import cairo from 'cairo';

GIR modules

If you want to have types for GObject Introspection modules, you have to add them to your dependencies and import them as well, see the description of these modules, e.g. gtk-4.0, gio-2.0, adw-1 and much more.

These types will then be available to you:

import '@girs/gjs'
import '@girs/gjs/dom'
import '@girs/gio-2.0'
import '@girs/gtk-4.0'
import '@girs/adw-1'

import Gio from 'gi://Gio?version=2.0';
import Gtk from 'gi://Gtk?version=4.0';
import Adwaita from 'gi://adw?version=1';

const button = new Gtk.Button();

// ...

Bundle

Most projects want a bundler. esbuild is the smallest thing that works; the examples directory has setups for several others.

Other packages

All existing pre-generated packages can be found on gjsify/types.