Initial changes and adjustments for migrate to TS

.codesandbox/ci.json

@@ -1,10 +1,10 @@
 {
  "buildCommand": "build",
  "packages": [
- "tmp"
+ ".bundle"
  ],
  "publishDirectory": {
- "handsontable": "tmp"
+ "handsontable": ".bundle"
  },
  "sandboxes": [
  "github/handsontable/examples/tree/master/vanilla/pull-request"

.config/base.js

@@ -12,7 +12,7 @@ licenseBody += '\nRelease date: ' + process.env.HOT_RELEASE_DATE + ' (built at '
 module.exports.create = function create(envArgs) {
  const config = {
  devtool: false,
- entry: ['./src/index.js'],
+ entry: ['./src/index.ts'],
  performance: {
  maxEntrypointSize: 2000000,
  maxAssetSize: 2000000,
@@ -26,6 +26,7 @@ module.exports.create = function create(envArgs) {
  umdNamedDefine: true,
  },
  resolve: {
+ extensions: ['.ts', '.js'],
  alias: {},
  },
  mode: 'none',
@@ -47,7 +48,7 @@ module.exports.create = function create(envArgs) {
  loader: path.resolve(__dirname, 'loader/empty-loader.js'),
  },
  {
- test: /\.js$/,
+ test: /\.(j|t)s$/,
  loader: 'babel-loader',
  exclude: [
  /node_modules/,

.config/languages-development.js

@@ -18,7 +18,7 @@ function getEntryJsFiles() {
  const filesInLanguagesDirectory = fs.readdirSync(SOURCE_LANGUAGES_DIRECTORY);
 
  filesInLanguagesDirectory.forEach((fileName) => {
- const jsExtensionRegExp = /\.js$/;
+ const jsExtensionRegExp = /\.ts$/;
 
  if (jsExtensionRegExp.test(fileName)) {
  let fileNameWithoutExtension = fileName.replace(jsExtensionRegExp, '');
@@ -35,7 +35,7 @@ function getEntryJsFiles() {
 }
 
 const ruleForSnippetsInjection = {
- test: /\.js$/,
+ test: /\.ts$/,
  loader: StringReplacePlugin.replace({
  replacements: [
  {
@@ -74,6 +74,9 @@ module.exports.create = function create() {
  path: path.resolve(__dirname, '../' + OUTPUT_LANGUAGES_DIRECTORY),
  umdNamedDefine: true,
  },
+ resolve: {
+ extensions: ['.ts', '.js'],
+ },
  externals: {
  [PACKAGE_FILENAME]: {
  root: 'Handsontable',
@@ -84,7 +87,7 @@ module.exports.create = function create() {
  },
  module: {
  rules: [
- {test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader'},
+ {test: /\.ts$/, exclude: /node_modules/, loader: 'babel-loader'},
  ruleForSnippetsInjection
  ]
  },

.config/walkontable.js

@@ -12,16 +12,19 @@ module.exports.create = function create() {
  devtool: 'cheap-module-source-map',
  mode: 'none',
  output: {
- filename: 'walkontable.js',
+ filename: 'walkontable.ts',
  globalObject: `typeof self !== 'undefined' ? self : this`,
  library: 'Walkontable',
  libraryTarget: 'var',
  path: path.resolve(wotPath, 'dist'),
  },
+ resolve: {
+ extensions: ['.ts', '.js'],
+ },
  module: {
  rules: [
  {
- test: /\.js$/,
+ test: /\.ts$/,
  loader: 'babel-loader',
  exclude: [
  /node_modules/,

.eslintignore

@@ -7,3 +7,4 @@ src/3rdparty/walkontable/dist/*
 test/lib/*
 test/dist/*
 tmp/*
+./bundle

.eslintrc.js

@@ -6,6 +6,14 @@ module.exports = {
  'jsdoc',
  'handsontable',
  ],
+ settings: {
+ 'import/resolver': {
+ node: {
+ extensions: ['.js', '.ts'],
+ moduleDirectory: ['node_modules', 'src/'],
+ },
+ },
+ },
  env: {
  browser: true,
  commonjs: true,
@@ -174,7 +182,7 @@ module.exports = {
  files: [
  'test/**',
  'src/3rdparty/walkontable/test/**',
- '*.unit.js',
+ '*.unit.ts',
  '*.spec.js',
  'src/plugins/**/__tests__/helpers/**',
  ],
@@ -194,7 +202,7 @@ module.exports = {
  }
  },
  {
- files: ['*.unit.js', '*.spec.js'],
+ files: ['*.unit.ts', '*.spec.js'],
  rules: {
  'no-undef': 'off',
  'jsdoc/require-description-complete-sentence': 'off',

.gitignore

@@ -14,6 +14,7 @@ dev*.html
 dev*.js
 npm-debug.log
 
+.bundle/
 !dist/README.md
 dist/hyperformula/
 node_modules/

babel.config.js

@@ -32,7 +32,8 @@ const babelPresetConfig = () => ({
 
 module.exports = {
  presets: [
- ['@babel/preset-env', babelPresetConfig()]
+ ['@babel/preset-env', babelPresetConfig()],
+ '@babel/preset-typescript',
  ],
  plugins: [
  ['@babel/plugin-proposal-object-rest-spread', { useBuiltIns: true }],

docs/.vuepress/tools/jsdoc-convert/jsdoc.js

@@ -13,52 +13,52 @@ const pathToSource = '../../../../src';
 const pathToDist = '../../../next/api';
 const urlPrefix = '/next/api/';
 const whitelist = [
- 'dataMap/metaManager/metaSchema.js',
- 'pluginHooks.js',
- 'core.js',
- 'translations/indexMapper.js',
- 'editors/baseEditor/baseEditor.js',
- '3rdparty/walkontable/src/cell/coords.js',
- 'plugins/copyPaste/focusableElement.js',
- 'dataMap.js',
- 'translations/maps/hidingMap.js',
- 'translations/maps/indexesSequence.js',
- 'translations/maps/trimmingMap.js',
- 'utils/samplesGenerator.js',
- 'translations/maps/physicalIndexToValueMap.js',
- 'utils/ghostTable.js'
+ 'dataMap/metaManager/metaSchema.ts',
+ 'pluginHooks.ts',
+ 'core.ts',
+ 'translations/indexMapper.ts',
+ 'editors/baseEditor/baseEditor.ts',
+ '3rdparty/walkontable/src/cell/coords.ts',
+ 'plugins/copyPaste/focusableElement.ts',
+ 'dataMap.ts',
+ 'translations/maps/hidingMap.ts',
+ 'translations/maps/indexesSequence.ts',
+ 'translations/maps/trimmingMap.ts',
+ 'utils/samplesGenerator.ts',
+ 'translations/maps/physicalIndexToValueMap.ts',
+ 'utils/ghostTable.ts'
 ];
 
 const seo = {
- 'dataMap/metaManager/metaSchema.js': {
+ 'dataMap/metaManager/metaSchema.ts': {
  title: 'Options',
  metaTitle: 'Options - API Reference - Handsontable Documentation',
  permalink: '/next/api/options'
  },
- 'pluginHooks.js': {
+ 'pluginHooks.ts': {
  title: 'Hooks',
  metaTitle: 'Hooks - API Reference - Handsontable Documentation',
  permalink: '/next/api/hooks'
  },
- 'core.js': {
+ 'core.ts': {
  title: 'Core',
  metaTitle: 'Core - API Reference - Handsontable Documentation',
  permalink: '/next/api/core'
  },
- '3rdparty/walkontable/src/cell/coords.js': {
+ '3rdparty/walkontable/src/cell/coords.ts': {
  title: 'CellCoords',
  metaTitle: 'CellCoords - API Reference - Handsontable Documentation',
  permalink: '/next/api/coords'
  },
 };
 
 /// classifications
-const isJsdocOptions = data => data[0]?.meta.filename === 'metaSchema.js';
+const isJsdocOptions = data => data[0]?.meta.filename === 'metaSchema.ts';
 const isJsdocPlugin = data => data[0]?.customTags?.filter(tag => tag.tag === 'plugin' && tag.value).length > 0 ?? false;
 const isPlugin = (file) => {
  const parts = file.split(/[./]/);
 
- return parts[0] === 'plugins' && parts[1] === parts[2] && parts[3] === 'js';
+ return parts[0] === 'plugins' && parts[1] === parts[2] && parts[3] === 'ts';
 };
 
 /// paths construction
@@ -67,7 +67,7 @@ const source = file => path.join(__dirname, pathToSource, file);
 const flat = file => file.split('/').pop();
 
 const distFileName = file => flat(file
- .replace(/(.*)\.js/, '$1.md') // set md extension
+ .replace(/(.*)\.ts/, '$1.md') // set md extension
  .replace(/^([A-Z])/, (_, upper) => upper.toLowerCase()) // enforce camelCase
 );
 const dist = file => path.join(__dirname, pathToDist, distFileName(file));
@@ -277,6 +277,7 @@ const postProcess = initialText => postProcessors.reduce((text, postProcessor) =
 const fromJsdoc = file => jsdoc2md.getTemplateDataSync({
  files: source(file),
  'no-cache': true,
+ configure: path.join(__dirname, 'jsdoc.json')
 });
 
 const toMd = data => dmd(data, {
@@ -313,7 +314,7 @@ const traversePlugins = function* () {
  }
 
  if (fs.statSync(source(path.join('plugins', item))).isDirectory()) {
- yield path.join('plugins', item, `${item}.js`);
+ yield path.join('plugins', item, `${item}.ts`);
  }
  }
 };

docs/.vuepress/tools/jsdoc-convert/jsdoc.json

@@ -0,0 +1,11 @@
+{
+ "tags": {
+ "allowUnknownTags": true,
+ "dictionaries": ["jsdoc", "closure"]
+ },
+ "source": {
+ "include": ["."],
+ "includePattern": ".(jsx|js|ts|tsx)$"
+ },
+ "sourceType": "module"
+}

jest.config.js

@@ -1,14 +1,13 @@
 module.exports = {
  roots: [
- '<rootDir>/test/unit',
  '<rootDir>/src'
  ],
  coverageDirectory: '<rootDir>/coverage',
  coverageReporters: ['json', 'lcov', 'clover'],
  setupFilesAfterEnv: [
  '<rootDir>/test/bootstrap.js'
  ],
- testRegex: '\\.unit\\.js$',
+ testRegex: '\\.unit\\.(j|t)s$',
  testPathIgnorePatterns: [
  '<rootDir>/node_modules/'
  ],

package.json

@@ -20,8 +20,9 @@
  "in": "node --experimental-json-modules scripts/delegate-command.mjs",
  "all": "node --experimental-json-modules scripts/run-all.mjs",
  "clean:node_modules": "node --experimental-json-modules scripts/clean-node-modules.mjs",
- "clean": "rimraf commonjs es coverage tmp",
- "lint": "npm run eslint && npm run stylelint",
+ "clean": "rimraf commonjs es coverage tmp .bundle",
+ "lint": "npm run lint:ts && npm run eslint && npm run stylelint",
+ "lint:ts": "tsc --project tsconfig.hot.json --noEmit",
  "lint:fix": "npm run eslint:fix && npm run stylelint:fix",
  "stylelint": "stylelint \"src/**/*.css\" \"test/**/*.css\"",
  "stylelint:fix": "stylelint --fix \"src/**/*.css\" \"test/**/*.css\"",
@@ -49,20 +50,21 @@
  "test:types": "tsc -p ./test/types -t es2015",
  "test:ci": "node --experimental-json-modules scripts/run-targeted-tests.mjs",
  "test:all": "npm run in handsontable build && npm run all test",
- "watch": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=watch env-cmd -f ./hot.config.js webpack --hide-modules --watch src/index.js",
- "build": "npm run clean && npm run build:commonjs && npm run build:es && npm run build:umd && npm run build:umd.min && npm run build:languages && npm run build:languages.es && npm run build:languages.min",
- "build:commonjs": "cross-env-shell BABEL_ENV=commonjs_dist env-cmd -f ./hot.config.js babel src --out-dir tmp",
- "build:es": "cross-env-shell BABEL_ENV=es env-cmd -f ./hot.config.js babel src --out-file-extension .mjs --out-dir tmp",
+ "watch": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=watch env-cmd -f ./hot.config.js webpack --hide-modules --watch src/index.ts",
+ "build": "npm run clean && npm run build:commonjs && npm run build:es && npm run generate:dts && npm run build:umd && npm run build:umd.min && npm run build:languages && npm run build:languages.es && npm run build:languages.min",
+ "build:commonjs": "cross-env-shell BABEL_ENV=commonjs_dist env-cmd -f ./hot.config.js babel src --out-dir .bundle --extensions '.js,.ts'",
+ "build:es": "cross-env-shell BABEL_ENV=es env-cmd -f ./hot.config.js babel src --out-file-extension .mjs --out-dir .bundle --extensions '.js,.ts'",
  "build:umd": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=development env-cmd -f ./hot.config.js webpack --hide-modules",
  "build:umd.min": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=production env-cmd -f ./hot.config.js webpack --hide-modules",
- "build:walkontable": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=walkontable env-cmd -f ./hot.config.js webpack --hide-modules ./src/3rdparty/walkontable/src/index.js",
+ "build:walkontable": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=walkontable env-cmd -f ./hot.config.js webpack --hide-modules ./src/3rdparty/walkontable/src/index.ts",
  "build:languages": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=languages-development env-cmd -f ./hot.config.js webpack",
  "build:languages.es": "cross-env-shell BABEL_ENV=es_languages babel src/i18n/languages --out-file-extension .mjs --out-dir languages",
  "build:languages.min": "cross-env-shell BABEL_ENV=commonjs NODE_ENV=languages-production env-cmd -f ./hot.config.js webpack",
+ "generate:dts": "tsc --project tsconfig.hot.json --emitDeclarationOnly",
  "freeze": "node --experimental-json-modules scripts/freeze.mjs",
  "release": "node --experimental-json-modules scripts/release.mjs",
  "changelog": "bin/changelog",
- "publish-package": "cd tmp && npm publish",
+ "publish-package": "cd .bundle && npm publish",
  "publish-all": "npm run all publish-package",
  "prein": "node --experimental-json-modules ./scripts/swap-package-links.mjs",
  "preall": "node --experimental-json-modules ./scripts/swap-package-links.mjs",
@@ -111,6 +113,7 @@
  "@babel/plugin-transform-runtime": "^7.11.0",
  "@babel/polyfill": "^7.8.3",
  "@babel/preset-env": "^7.11.0",
+ "@babel/preset-typescript": "^7.13.0",
  "@babel/register": "^7.8.3",
  "@babel/runtime": "^7.11.2",
  "@babel/types": "^7.12.12",

scripts/prepare-package-for-publish.mjs

@@ -3,7 +3,7 @@ import path from 'path';
 import glob from 'glob';
 import { displayErrorMessage } from './utils/console.mjs';
 
-const TARGET_PATH = './tmp/';
+const TARGET_PATH = './.bundle/';
 const PACKAGE_PATH = path.resolve('package.json');
 const DEV_PACKAGE = fse.readJsonSync(PACKAGE_PATH, { encoding: 'utf-8' });
 const { handsontable } = DEV_PACKAGE;

scripts/swap-package-links.mjs

@@ -11,7 +11,7 @@ import {
 
 const [pkgName] = process.argv.slice(2);
 const PACKAGE_LOCATIONS = new Map([
- ['handsontable', './tmp'],
+ ['handsontable', './.bundle'],
  ['@handsontable/angular', './wrappers/angular/dist/hot-table']
 ]);
 const linkPackage = (packageName, packageLocation) => {

scripts/verify-bundles.mjs

@@ -21,8 +21,8 @@ async function verifyBundles() {
  const packagesInfo = {
  handsontable: {
  className: 'Handsontable',
- umd: 'tmp/dist/handsontable.full.min.js',
- entryFile: 'tmp/index.mjs',
+ umd: '.bundle/dist/handsontable.full.min.js',
+ entryFile: '.bundle/index.mjs',
  defaultExport: true
  },
  '@handsontable/angular': {

src/3rdparty/walkontable/src/border.js → src/3rdparty/walkontable/src/border.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 import {
  addClass,
  hasClass,

src/3rdparty/walkontable/test/unit/calculator/viewportColumns.unit.js → src/3rdparty/walkontable/src/calculator/__tests__/viewportColumns.unit.ts

@@ -3,7 +3,7 @@ import {
  FULLY_VISIBLE_TYPE,
  PARTIALLY_VISIBLE_TYPE,
  ViewportColumnsCalculator,
-} from 'walkontable/calculator';
+} from '../';
 
 describe('ViewportColumnsCalculator', () => {
  function allColumns20() {

src/3rdparty/walkontable/test/unit/calculator/viewportRows.unit.js → src/3rdparty/walkontable/src/calculator/__tests__/viewportRows.unit.ts

@@ -3,7 +3,7 @@ import {
  FULLY_VISIBLE_TYPE,
  PARTIALLY_VISIBLE_TYPE,
  ViewportRowsCalculator,
-} from 'walkontable/calculator';
+} from '../';
 
 describe('ViewportRowsCalculator', () => {
  function allRows20() {