Fixed ts typings (#14)

.github/workflows/ci.yml

@@ -43,9 +43,13 @@ jobs:
       - name: Run tests
         run: |
           npm i
-          npm run formatCheck
+          rm -r ./types
           npx tsc
-          npx quick-lint-js ./**/*.mjs ./**/*.ts
+          npx tsc -p ./test
+          # ensure that committed and generated types are the same
+          git diff --exit-code
+          npx quick-lint-js ./**/*.mjs
+          npm run formatCheck
           NODE_V8_COVERAGE=coverage0 npx c8 -r lcovonly --all --src ./src node --experimental-test-coverage ./test/all.mjs
         if: ${{ env.TAG_NAME == '' }}
 

index.d.ts → index.d.mts

@@ -3,7 +3,7 @@ import { DetailedBlessedProps } from "react-blessed";
 import Blessed from "@farjs/blessed";
 
 type ButtonElement = Blessed.Widgets.ButtonElement;
-type FormElement = Blessed.Widgets.FormElement;
+type FormElement = Blessed.Widgets.FormElement<any>;
 type TextElement = Blessed.Widgets.TextElement;
 
 declare module "react" {

package.json

@@ -5,15 +5,19 @@
   "license": "MIT",
   "description": "Terminal UI React.js components library",
   "scripts": {
-    "lint": "quick-lint-js ./**/*.mjs ./**/*.ts",
-    "test": "tsc && bun test && node ./test/all.mjs",
-    "format": "prettier **/*.mjs **/*.ts --write",
-    "formatCheck": "prettier **/*.mjs **/*.ts --check"
+    "lint": "quick-lint-js ./**/*.mjs",
+    "test": "tsc && tsc -p ./test && bun test && node ./test/all.mjs",
+    "format": "prettier **/*.mjs --write",
+    "formatCheck": "prettier **/*.mjs --check"
   },
   "type": "module",
   "exports": {
-    "./*": "./src/*"
+    "./*": {
+      "types": "./types/*",
+      "default": "./src/*"
+    }
   },
+  "types": "./types/*",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -47,10 +51,10 @@
     "@types/react-blessed": "^0.7.3",
     "@types/react-test-renderer": "^17.0.1",
     "c8": "^7.13.0",
-    "mock-fn": "^1.0.0",
+    "mock-fn": "^1.1.0",
     "prettier": "^2.8.8",
     "quick-lint-js": "^3.0.0",
-    "react-assert": "^1.0.3",
+    "react-assert": "^1.1.0",
     "react-test-renderer": "^17.0.1",
     "typescript": "^4.9.5"
   }

src/Button.mjs

@@ -1,11 +1,18 @@
-/**
- * @typedef {import("./Button").ButtonProps} ButtonProps
- */
 import React, { useState } from "react";
 import * as UI from "./UI.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly left: number;
+ *  readonly top: number;
+ *  readonly label: string;
+ *  readonly style: import("@farjs/blessed").Widgets.Types.TStyle;
+ *  onPress(): void;
+ * }} ButtonProps
+ */
+
 /**
  * @param {ButtonProps} props
  */

src/ButtonsPanel.mjs

@@ -1,11 +1,25 @@
-/**
- * @typedef {import("./ButtonsPanel").ButtonsPanelProps} ButtonsPanelProps
- */
 import React from "react";
 import Button from "./Button.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly label: string;
+ *  onAction(): void;
+ * }} ButtonsPanelAction
+ */
+
+/**
+ * @typedef {{
+ *  readonly top: number;
+ *  readonly actions: ButtonsPanelAction[];
+ *  readonly style: import("@farjs/blessed").Widgets.Types.TStyle;
+ *  readonly padding?: number;
+ *  readonly margin?: number;
+ * }} ButtonsPanelProps
+ */
+
 /**
  * @param {ButtonsPanelProps} props
  */

src/CheckBox.mjs

@@ -1,11 +1,19 @@
-/**
- * @typedef {import("./CheckBox").CheckBoxProps} CheckBoxProps
- */
 import React from "react";
 import Button from "./Button.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly left: number;
+ *  readonly top: number;
+ *  readonly value: boolean;
+ *  readonly label: string;
+ *  readonly style: import("@farjs/blessed").Widgets.Types.TStyle;
+ *  onChange(): void;
+ * }} CheckBoxProps
+ */
+
 /**
  * @param {CheckBoxProps} props
  */

src/ComboBox.mjs

@@ -1,9 +1,8 @@
 /**
  * @typedef {import("@farjs/blessed").BlessedProgram} BlessedProgram
  * @typedef {import("@farjs/blessed").Widgets.BlessedElement} BlessedElement
- * @typedef {import("./ListViewport").ListViewport} ListViewport
- * @typedef {import("./TextInput").TextInputState} TextInputState
- * @typedef {import("./ComboBox").ComboBoxProps} ComboBoxProps
+ * @typedef {import("./ListViewport.mjs").ListViewport} ListViewport
+ * @typedef {import("./TextInput.mjs").TextInputState} TextInputState
  */
 import React, { useRef, useState } from "react";
 import { createListViewport } from "./ListViewport.mjs";
@@ -14,6 +13,18 @@ import ComboBoxPopup from "./ComboBoxPopup.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly left: number;
+ *  readonly top: number;
+ *  readonly width: number;
+ *  readonly items: string[];
+ *  readonly value: string;
+ *  onChange(value: string): void;
+ *  onEnter?(): void;
+ * }} ComboBoxProps
+ */
+
 /**
  * @param {ComboBoxProps} props
  */

src/ComboBoxPopup.mjs

@@ -1,5 +1,5 @@
 /**
- * @typedef {import("./ComboBoxPopup").ComboBoxPopupProps} ComboBoxPopupProps
+ * @typedef {import("./ListViewport.mjs").ListViewport} ListViewport
  */
 import React from "react";
 import SingleBorder from "./border/SingleBorder.mjs";
@@ -8,6 +8,19 @@ import ScrollBar from "./ScrollBar.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly left: number;
+ *  readonly top: number;
+ *  readonly width: number;
+ *  readonly items: string[];
+ *  readonly style: import("@farjs/blessed").Widgets.Types.TStyle;
+ *  readonly viewport: ListViewport;
+ *  setViewport(viewport: ListViewport): void;
+ *  onClick(index: number): void;
+ * }} ComboBoxPopupProps
+ */
+
 /**
  * @param {ComboBoxPopupProps} props
  */

src/ListBox.mjs

@@ -1,6 +1,5 @@
 /**
  * @typedef {import("@farjs/blessed").Widgets.Events.IKeyEventArg} IKeyEventArg
- * @typedef {import("./ListBox").ListBoxProps} ListBoxProps
  */
 import React, { useLayoutEffect, useState } from "react";
 import { createListViewport } from "./ListViewport.mjs";
@@ -9,6 +8,20 @@ import ScrollBar from "./ScrollBar.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly left: number;
+ *  readonly top: number;
+ *  readonly width: number;
+ *  readonly height: number;
+ *  readonly style: import("@farjs/blessed").Widgets.Types.TStyle;
+ *  readonly items: string[];
+ *  readonly selected: number;
+ *  onAction(index: number): void;
+ *  onSelect?(index: number): void;
+ * }} ListBoxProps
+ */
+
 /**
  * @param {ListBoxProps} props
  */

src/ListView.mjs

@@ -2,14 +2,28 @@
  * @typedef {import("@farjs/blessed").Widgets.Types.TStyle} BlessedStyle
  * @typedef {import("@farjs/blessed").Widgets.BlessedElement} BlessedElement
  * @typedef {import("@farjs/blessed").Widgets.Events.IMouseEventArg} MouseEvent
- * @typedef {import("./ListView").ListViewProps} ListViewProps
+ * @typedef {import("./ListViewport.mjs").ListViewport} ListViewport
  */
 import React, { useLayoutEffect, useRef } from "react";
 import * as UI from "./UI.mjs";
 import UiString from "./UiString.mjs";
 
 const h = React.createElement;
 
+/**
+ * @typedef {{
+ *  readonly left: number;
+ *  readonly top: number;
+ *  readonly width: number;
+ *  readonly height: number;
+ *  readonly items: string[];
+ *  readonly style: BlessedStyle;
+ *  readonly viewport: ListViewport;
+ *  setViewport(viewport: ListViewport): void;
+ *  onClick(index: number): void;
+ * }} ListViewProps
+ */
+
 /**
  * @param {number} selected
  * @param {string[]} items

src/ListViewport.mjs

@@ -1,5 +1,19 @@
 /**
- * @typedef {import("./ListViewport").ListViewport} ListViewport
+ * @typedef {{
+ *  readonly offset: number;
+ *  readonly focused: number;
+ *  readonly length: number;
+ *  readonly viewLength: number;
+ *  updated(offset: number, focused?: number): ListViewport;
+ *  down(): ListViewport;
+ *  up(): ListViewport;
+ *  pagedown(): ListViewport;
+ *  pageup(): ListViewport;
+ *  end(): ListViewport;
+ *  home(): ListViewport;
+ *  onKeypress(keyFull: string): ListViewport | undefined;
+ *  resize(viewLength: number): ListViewport;
+ * }} ListViewport
  */
 
 /**