Change typing for HOT instance from Handsontable to Core

handsontable · May 14, 2024 · f5fbeee · f5fbeee
1 parent a037c86
commit f5fbeee
Show file tree

Hide file tree

Showing 156 changed files with 165 additions and 161 deletions.
diff --git a/docs/content/guides/accessibility/accessibility/javascript/example1.ts b/docs/content/guides/accessibility/accessibility/javascript/example1.ts
@@ -545,7 +545,7 @@ const hotOptions = {
 };
 
 // Initialize the Handsontable instance with the specified configuration options
-let hotInstance: Handsontable = new Handsontable(app, hotOptions);
+let hotInstance: Core = new Handsontable(app, hotOptions);
 
 // Helper function to set up checkbox event handling
 const setupCheckbox = (element, callback) =>

diff --git a/docs/content/guides/accessories-and-menus/context-menu/javascript/example1.ts b/docs/content/guides/accessories-and-menus/context-menu/javascript/example1.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
     ['2017', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/accessories-and-menus/context-menu/javascript/example2.ts b/docs/content/guides/accessories-and-menus/context-menu/javascript/example2.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
     ['2017', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/accessories-and-menus/context-menu/javascript/example3.ts b/docs/content/guides/accessories-and-menus/context-menu/javascript/example3.ts
@@ -72,7 +72,7 @@ const contextMenuSettings: DetailedSettings = {
 }
 
 const container = document.querySelector('#example3');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
     ['2017', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/accessories-and-menus/export-to-csv/javascript/example1.ts b/docs/content/guides/accessories-and-menus/export-to-csv/javascript/example1.ts
@@ -4,7 +4,7 @@ import {ExportFile} from 'handsontable/plugins'
 
 const container = document.querySelector('#example1');
 const button = document.querySelector('#export-file');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2'],

diff --git a/docs/content/guides/accessories-and-menus/export-to-csv/javascript/example2.ts b/docs/content/guides/accessories-and-menus/export-to-csv/javascript/example2.ts
@@ -4,7 +4,7 @@ import {ExportFile} from 'handsontable/plugins'
 
 const container = document.querySelector('#example2');
 const button = document.querySelector('#export-blob');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2'],

diff --git a/docs/content/guides/accessories-and-menus/export-to-csv/javascript/example3.ts b/docs/content/guides/accessories-and-menus/export-to-csv/javascript/example3.ts
@@ -4,7 +4,7 @@ import {ExportFile} from 'handsontable/plugins'
 
 const container = document.querySelector('#example3');
 const button = document.querySelector('#export-string');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2'],

diff --git a/docs/content/guides/accessories-and-menus/undo-redo/javascript/example.ts b/docs/content/guides/accessories-and-menus/undo-redo/javascript/example.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1'],
     ['A2', 'B2', 'C2', 'D2', 'E2'],

diff --git a/docs/content/guides/cell-features/autofill-values/javascript/example1.ts b/docs/content/guides/cell-features/autofill-values/javascript/example1.ts
@@ -11,7 +11,7 @@ const data: (string | number)[][] = [
   ['2021', '', '', '', '']
 ];
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   rowHeaders: true,
   colHeaders: true,
   fillHandle: true, // possible values: true, false, "horizontal", "vertical",

diff --git a/docs/content/guides/cell-features/autofill-values/javascript/example2.ts b/docs/content/guides/cell-features/autofill-values/javascript/example2.ts
@@ -11,7 +11,7 @@ const data: (string | number)[][] = [
   ['2021', '', '', '', '']
 ];
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data,
   rowHeaders: true,
   colHeaders: true,

diff --git a/docs/content/guides/cell-features/clipboard/javascript/example1.ts b/docs/content/guides/cell-features/clipboard/javascript/example1.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1'],
     ['A2', 'B2', 'C2', 'D2', 'E2'],

diff --git a/docs/content/guides/cell-features/clipboard/javascript/example2.ts b/docs/content/guides/cell-features/clipboard/javascript/example2.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1', 'H1', 'I1', 'J1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2', 'H2', 'I2', 'J2'],

diff --git a/docs/content/guides/cell-features/clipboard/javascript/example3.ts b/docs/content/guides/cell-features/clipboard/javascript/example3.ts
@@ -5,7 +5,7 @@ const container = document.querySelector('#example3');
 const copyBtn = document.querySelector('#copy');
 const cutBtn = document.querySelector('#cut');
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   rowHeaders: true,
   colHeaders: true,
   data: [

diff --git a/docs/content/guides/cell-features/comments/javascript/example1.ts b/docs/content/guides/cell-features/comments/javascript/example1.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
     ['2017', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/cell-features/comments/javascript/example2.ts b/docs/content/guides/cell-features/comments/javascript/example2.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Toyota', 'Honda', 'Ford'],
     ['2018', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/cell-features/comments/javascript/example3.ts b/docs/content/guides/cell-features/comments/javascript/example3.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example3');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
     ['2017', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/cell-features/comments/javascript/example4.ts b/docs/content/guides/cell-features/comments/javascript/example4.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example4');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['', 'Tesla', 'Toyota', 'Honda', 'Ford'],
     ['2018', 10, 11, 12, 13, 15, 16],

diff --git a/docs/content/guides/cell-features/conditional-formatting/javascript/example1.ts b/docs/content/guides/cell-features/conditional-formatting/javascript/example1.ts
@@ -1,5 +1,8 @@
 import Handsontable from 'handsontable';
+import {BaseRenderer} from 'handsontable/renderers';
 import 'handsontable/dist/handsontable.full.min.css';
+import {CellProperties} from 'handsontable/settings'
+import Core from 'handsontable/core'
 
 const container = document.querySelector('#example1');
 const data: (string | number)[][] = [
@@ -9,15 +12,15 @@ const data: (string | number)[][] = [
   ['2019', '', 15, -12, 'readOnly']
 ];
 
-function firstRowRenderer(instance, td, row, col, prop, value, cellProperties) {
-  Handsontable.renderers.TextRenderer.apply(this, arguments);
+const firstRowRenderer: BaseRenderer = (instance, td, row, col, prop, value, cellProperties) => {
+  Handsontable.renderers.TextRenderer.apply(this, [instance, td, row, col, prop, value, cellProperties]);
   td.style.fontWeight = 'bold';
   td.style.color = 'green';
   td.style.background = '#CEC';
 }
 
-function negativeValueRenderer(instance, td, row, col, prop, value, cellProperties) {
-  Handsontable.renderers.TextRenderer.apply(this, arguments);
+const negativeValueRenderer: BaseRenderer = (instance, td, row, col, prop, value, cellProperties) => {
+  Handsontable.renderers.TextRenderer.apply(this, [instance, td, row, col, prop, value, cellProperties]);
 
   // if the row contains a negative number
   if (parseInt(value, 10) < 0) {
@@ -39,7 +42,7 @@ function negativeValueRenderer(instance, td, row, col, prop, value, cellProperti
 // maps function to a lookup string
 Handsontable.renderers.registerRenderer('negativeValueRenderer', negativeValueRenderer);
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data,
   licenseKey: 'non-commercial-and-evaluation',
   height: 'auto',
@@ -54,7 +57,7 @@ const hot: Handsontable = new Handsontable(container, {
     }
   },
   cells(row, col) {
-    const cellProperties = {};
+    const cellProperties: Partial<CellProperties> = {};
     const data = this.instance.getData();
 
     if (row === 0 || data[row] && data[row][col] === 'readOnly') {

diff --git a/docs/content/guides/cell-features/disabled-cells/javascript/example1.ts b/docs/content/guides/cell-features/disabled-cells/javascript/example1.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Tesla', year: 2017, chassis: 'black', bumper: 'black' },
     { car: 'Nissan', year: 2018, chassis: 'blue', bumper: 'blue' },

diff --git a/docs/content/guides/cell-features/disabled-cells/javascript/example2.ts b/docs/content/guides/cell-features/disabled-cells/javascript/example2.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Tesla', year: 2017, chassis: 'black', bumper: 'black' },
     { car: 'Nissan', year: 2018, chassis: 'blue', bumper: 'blue' },

diff --git a/docs/content/guides/cell-features/disabled-cells/javascript/example3.ts b/docs/content/guides/cell-features/disabled-cells/javascript/example3.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example3');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Tesla', year: 2017, chassis: 'black', bumper: 'black' },
     { car: 'Nissan', year: 2018, chassis: 'blue', bumper: 'blue' },

diff --git a/docs/content/guides/cell-features/disabled-cells/javascript/example4.ts b/docs/content/guides/cell-features/disabled-cells/javascript/example4.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example4');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Tesla', year: 2017, chassis: 'black', bumper: 'black' },
     { car: 'Nissan', year: 2018, chassis: 'blue', bumper: 'blue' },

diff --git a/docs/content/guides/cell-features/disabled-cells/javascript/exampleReadOnlyGrid.ts b/docs/content/guides/cell-features/disabled-cells/javascript/exampleReadOnlyGrid.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#exampleReadOnlyGrid');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Tesla', year: 2017, chassis: 'black', bumper: 'black' },
     { car: 'Nissan', year: 2018, chassis: 'blue', bumper: 'blue' },

diff --git a/docs/content/guides/cell-features/formatting-cells/javascript/example1.ts b/docs/content/guides/cell-features/formatting-cells/javascript/example1.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1'],
     ['A2', 'B2', 'C2', 'D2', 'E2'],

diff --git a/docs/content/guides/cell-features/formatting-cells/javascript/example2.ts b/docs/content/guides/cell-features/formatting-cells/javascript/example2.ts
@@ -10,7 +10,7 @@ Handsontable.renderers.registerRenderer('customStylesRenderer', (hotInstance, TD
 });
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1'],
     ['A2', 'B2', 'C2', 'D2', 'E2'],

diff --git a/docs/content/guides/cell-features/merge-cells/javascript/example1.ts b/docs/content/guides/cell-features/merge-cells/javascript/example1.ts
@@ -10,7 +10,7 @@ const data: string[][] = new Array(100) // number of rows
   );
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data,
   height: 320,
   colWidths: 47,

diff --git a/docs/content/guides/cell-features/selection/javascript/example1.ts b/docs/content/guides/cell-features/selection/javascript/example1.ts
@@ -3,7 +3,7 @@ import 'handsontable/dist/handsontable.full.min.css';
 
 const selectOption = document.querySelector('#selectOption');
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1', 'H1', 'I1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2', 'H2', 'I2'],

diff --git a/docs/content/guides/cell-features/selection/javascript/example2.ts b/docs/content/guides/cell-features/selection/javascript/example2.ts
@@ -4,7 +4,7 @@ import 'handsontable/dist/handsontable.full.min.css';
 const output = document.querySelector('#output');
 const getButton = document.querySelector('#getButton');
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1', 'H1', 'I1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2', 'H2', 'I2'],

diff --git a/docs/content/guides/cell-features/selection/javascript/example3.ts b/docs/content/guides/cell-features/selection/javascript/example3.ts
@@ -3,7 +3,7 @@ import 'handsontable/dist/handsontable.full.min.css';
 
 const button = document.querySelector('#set-data-action');
 const container = document.querySelector('#example3');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     ['A1', 'B1', 'C1', 'D1', 'E1', 'F1', 'G1', 'H1', 'I1'],
     ['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2', 'H2', 'I2'],

diff --git a/docs/content/guides/cell-features/text-alignment/javascript/example1.ts b/docs/content/guides/cell-features/text-alignment/javascript/example1.ts
@@ -10,7 +10,7 @@ const data: string[][] = new Array(100) // number of rows
   );
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data,
   colWidths: 100,
   height: 320,

diff --git a/docs/content/guides/cell-functions/cell-renderer/javascript/example4.ts b/docs/content/guides/cell-functions/cell-renderer/javascript/example4.ts
@@ -30,7 +30,7 @@ const data: Book[] = [
 ];
 
 const container = document.querySelector('#example4');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data,
   colWidths: [200, 200, 200, 80],
   colHeaders: ['Title', 'Description', 'Comments', 'Cover'],

diff --git a/docs/content/guides/cell-functions/cell-renderer/javascript/example5.ts b/docs/content/guides/cell-functions/cell-renderer/javascript/example5.ts
@@ -15,7 +15,7 @@ function customRenderer(instance, td) {
   }
 }
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   height: 'auto',
   columns: [
     {},

diff --git a/docs/content/guides/cell-functions/cell-validator/javascript/example1.ts b/docs/content/guides/cell-functions/cell-validator/javascript/example1.ts
@@ -17,7 +17,7 @@ const emailValidator = (value, callback) => {
   }, 1000);
 };
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { id: 1, name: { first: 'Joe', last: 'Fabiano' }, ip: '0.0.0.1', email: 'Joe.Fabiano@ex.com' },
     { id: 2, name: { first: 'Fred', last: 'Wecler' }, ip: '0.0.0.1', email: 'Fred.Wecler@ex.com' },

diff --git a/docs/content/guides/cell-types/autocomplete-cell-type/javascript/example1.ts b/docs/content/guides/cell-types/autocomplete-cell-type/javascript/example1.ts
@@ -5,7 +5,7 @@ const colors = ['yellow', 'red', 'orange and another color', 'green',
   'blue', 'gray', 'black', 'white', 'purple', 'lime', 'olive', 'cyan'];
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   licenseKey: 'non-commercial-and-evaluation',
   data: [
     ['BMW', 2017, 'black', 'black'],

diff --git a/docs/content/guides/cell-types/autocomplete-cell-type/javascript/example2.ts b/docs/content/guides/cell-types/autocomplete-cell-type/javascript/example2.ts
@@ -6,7 +6,7 @@ const colors = ['yellow', 'red', 'orange', 'green', 'blue',
 const cars = ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'];
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   licenseKey: 'non-commercial-and-evaluation',
   data: [
     ['BMW', 2017, 'black', 'black'],

diff --git a/docs/content/guides/cell-types/autocomplete-cell-type/javascript/example3.ts b/docs/content/guides/cell-types/autocomplete-cell-type/javascript/example3.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example3');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   licenseKey: 'non-commercial-and-evaluation',
   data: [
     ['BMW', 2017, 'black', 'black'],

diff --git a/docs/content/guides/cell-types/cell-type/javascript/example1.ts b/docs/content/guides/cell-types/cell-type/javascript/example1.ts
@@ -15,7 +15,7 @@ const greenRenderer = function(instance, td, row, col, prop, value, cellProperti
   td.style.backgroundColor = 'green';
 };
 
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { id: 1, name: 'Ted', isActive: true, color: 'orange', date: '2015-01-01' },
     { id: 2, name: 'John', isActive: false, color: 'black', date: null },

diff --git a/docs/content/guides/cell-types/cell-type/javascript/example2.ts b/docs/content/guides/cell-types/cell-type/javascript/example2.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   licenseKey: 'non-commercial-and-evaluation',
   data: [
     ['empty string', '', '', '', '', ''],

diff --git a/docs/content/guides/cell-types/checkbox-cell-type/javascript/example1.ts b/docs/content/guides/cell-types/checkbox-cell-type/javascript/example1.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example1');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Mercedes A 160', year: 2017, available: true, comesInBlack: 'yes' },
     { car: 'Citroen C4 Coupe', year: 2018, available: false, comesInBlack: 'yes' },

diff --git a/docs/content/guides/cell-types/checkbox-cell-type/javascript/example2.ts b/docs/content/guides/cell-types/checkbox-cell-type/javascript/example2.ts
@@ -2,7 +2,7 @@ import Handsontable from 'handsontable';
 import 'handsontable/dist/handsontable.full.min.css';
 
 const container = document.querySelector('#example2');
-const hot: Handsontable = new Handsontable(container, {
+const hot: Core = new Handsontable(container, {
   data: [
     { car: 'Mercedes A 160', year: 2017, available: true, comesInBlack: 'yes' },
     { car: 'Citroen C4 Coupe', year: 2018, available: false, comesInBlack: 'yes' },