feat: setup typescript configuration

.gitignore

@@ -3,6 +3,7 @@
 # compiled output
 dist/
 .pnpm-store/
+declarations/
 
 # dependencies
 node_modules/

ember-phone-input/.eslintignore

@@ -3,6 +3,7 @@
 
 # compiled output
 /dist/
+/declarations/
 
 # misc
 /coverage/

ember-phone-input/.eslintrc.cjs

@@ -2,28 +2,28 @@
 
 module.exports = {
   root: true,
-  parser: '@babel/eslint-parser',
+  parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaVersion: 2018,
     sourceType: 'module',
     ecmaFeatures: {
-      legacyDecorators: true,
+      legacyDecorators: true
     },
     babelOptions: {
-      root: __dirname,
-    },
+      root: __dirname
+    }
   },
   plugins: ['ember'],
   extends: [
     'eslint:recommended',
     'plugin:ember/recommended',
-    'plugin:prettier/recommended',
+    'plugin:prettier/recommended'
   ],
   env: {
-    browser: true,
+    browser: true
   },
   globals: {
-    intlTelInputUtils: true,
+    intlTelInputUtils: true
   },
   rules: {},
   overrides: [
@@ -33,17 +33,95 @@ module.exports = {
         './.eslintrc.js',
         './.prettierrc.js',
         './.template-lintrc.js',
-        './addon-main.js',
+        './addon-main.js'
       ],
       parserOptions: {
-        sourceType: 'script',
+        sourceType: 'script'
       },
       env: {
         browser: false,
-        node: true,
+        node: true
       },
       plugins: ['node'],
-      extends: ['plugin:node/recommended'],
+      extends: ['plugin:node/recommended']
     },
-  ],
+    // ts files
+    {
+      files: ['**/*.ts'],
+      extends: [
+        'plugin:@typescript-eslint/eslint-recommended',
+        'plugin:@typescript-eslint/recommended'
+      ],
+      rules: {
+        // https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/recommended.ts
+        '@typescript-eslint/no-explicit-any': 'error',
+        '@typescript-eslint/no-non-null-assertion': 'error',
+        '@typescript-eslint/no-unused-vars': 'error',
+        // https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/strict.ts
+        '@typescript-eslint/array-type': [
+          'error',
+          {
+            default: 'array',
+            readonly: 'array'
+          }
+        ],
+        '@typescript-eslint/ban-tslint-comment': 'error',
+        '@typescript-eslint/class-literal-property-style': 'error',
+        '@typescript-eslint/consistent-generic-constructors': 'error',
+        '@typescript-eslint/consistent-indexed-object-style': 'error',
+        '@typescript-eslint/consistent-type-assertions': 'error',
+        '@typescript-eslint/consistent-type-definitions': 'error',
+        '@typescript-eslint/consistent-type-imports': 'error',
+        '@typescript-eslint/explicit-function-return-type': 'error',
+        '@typescript-eslint/explicit-member-accessibility': [
+          'error',
+          {
+            accessibility: 'no-public'
+          }
+        ],
+        'no-restricted-syntax': [
+          'error',
+          {
+            selector:
+              ':matches(PropertyDefinition, MethodDefinition)[accessibility="private"]',
+            message: 'Use #private instead'
+          },
+          {
+            selector:
+              ':matches(PropertyDefinition, MethodDefinition)[accessibility="protected"]',
+            message: 'Use #private instead'
+          }
+        ],
+        '@typescript-eslint/explicit-module-boundary-types': 'error',
+        '@typescript-eslint/member-delimiter-style': 'error',
+        '@typescript-eslint/member-ordering': 'error',
+        '@typescript-eslint/method-signature-style': 'error',
+        '@typescript-eslint/no-confusing-non-null-assertion': 'error',
+        '@typescript-eslint/no-duplicate-enum-values': 'error',
+        '@typescript-eslint/no-dynamic-delete': 'error',
+        '@typescript-eslint/no-extraneous-class': 'error',
+        '@typescript-eslint/no-import-type-side-effects': 'error',
+        '@typescript-eslint/no-invalid-void-type': 'error',
+        '@typescript-eslint/no-non-null-asserted-nullish-coalescing': 'error',
+        '@typescript-eslint/no-require-imports': 'error',
+        '@typescript-eslint/no-type-alias': [
+          'error',
+          {
+            allowGenerics: 'always'
+          }
+        ],
+        '@typescript-eslint/no-unsafe-declaration-merging': 'error',
+        '@typescript-eslint/parameter-properties': 'error',
+        '@typescript-eslint/prefer-enum-initializers': 'error',
+        '@typescript-eslint/prefer-for-of': 'error',
+        '@typescript-eslint/prefer-function-type': 'error',
+        '@typescript-eslint/prefer-literal-enum-member': 'error',
+        '@typescript-eslint/prefer-ts-expect-error': 'error',
+        '@typescript-eslint/sort-type-constituents': 'error',
+        '@typescript-eslint/type-annotation-spacing': 'error',
+        '@typescript-eslint/typedef': 'error',
+        '@typescript-eslint/unified-signatures': 'error'
+      }
+    }
+  ]
 };

ember-phone-input/.prettierignore

@@ -5,6 +5,7 @@
 # compiled output
 /dist/
 /tmp/
+/declarations/
 
 # dependencies
 /node_modules/

ember-phone-input/babel.config.json

@@ -1,4 +1,5 @@
 {
+  "presets": [["@babel/preset-typescript"]],
   "plugins": [
     "@embroider/addon-dev/template-colocation-plugin",
     ["@babel/plugin-proposal-decorators", { "legacy": true }],

ember-phone-input/package.json

@@ -24,17 +24,23 @@
   "author": "",
   "files": [
     "addon-main.cjs",
+    "declarations",
     "dist"
   ],
   "scripts": {
-    "build": "rollup --config",
+    "build": "concurrently 'pnpm:build:*'",
+    "build:js": "rollup --config",
+    "build:types": "glint --declaration",
     "lint": "concurrently 'pnpm:lint:*(!fix)' --names 'lint:'",
     "lint:fix": "concurrently 'pnpm:lint:*:fix' --names 'fix:'",
     "lint:hbs": "ember-template-lint . --no-error-on-unmatched-pattern",
     "lint:js": "eslint . --cache",
+    "lint:types": "glint",
     "lint:hbs:fix": "ember-template-lint . --fix --no-error-on-unmatched-pattern",
     "lint:js:fix": "eslint . --fix",
-    "start": "rollup --config --watch",
+    "start": "concurrently 'pnpm:start:*'",
+    "start:js": "rollup --config --watch --no-watch.clearScreen",
+    "start:types": "glint -d --watch",
     "test": "echo 'A v2 addon does not have tests, run tests in test-app'",
     "prepack": "rollup --config",
     "prepare": "rollup --config"
@@ -51,9 +57,18 @@
     "@babel/plugin-proposal-class-properties": "7.18.6",
     "@babel/plugin-proposal-decorators": "7.23.0",
     "@babel/plugin-syntax-decorators": "7.22.10",
+    "@babel/preset-typescript": "^7.23.0",
     "@embroider/addon-dev": "4.1.0",
+    "@glint/core": "^1.2.0",
+    "@glint/environment-ember-loose": "^1.2.0",
+    "@glint/template": "^1.2.0",
+    "@glimmer/component": "1.1.2",
     "@rollup/plugin-babel": "6.0.3",
+    "@tsconfig/ember": "^3.0.1",
+    "@typescript-eslint/eslint-plugin": "^6.5.0",
+    "@typescript-eslint/parser": "^6.5.0",
     "concurrently": "8.2.1",
+    "ember-source": "5.3.0",
     "ember-template-lint": "5.11.2",
     "eslint": "7.32.0",
     "eslint-config-prettier": "9.0.0",
@@ -62,7 +77,8 @@
     "eslint-plugin-prettier": "5.0.0",
     "prettier": "3.0.3",
     "rollup": "3.29.4",
-    "rollup-plugin-copy": "3.5.0"
+    "rollup-plugin-copy": "3.5.0",
+    "typescript": "^5.2.2"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
@@ -82,10 +98,23 @@
     "demoURL": "http://qonto.github.io/ember-phone-input/"
   },
   "exports": {
-    ".": "./dist/index.js",
-    "./*": "./dist/*.js",
+    ".": {
+      "types": "./declarations/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./*": {
+      "types": "./declarations/*.d.ts",
+      "default": "./dist/*.js"
+    },
     "./addon-main.js": "./addon-main.cjs"
   },
+  "typesVersions": {
+    "*": {
+      "*": [
+        "declarations/*"
+      ]
+    }
+  },
   "volta": {
     "extends": "../package.json"
   }

ember-phone-input/rollup.config.mjs

@@ -4,9 +4,12 @@ import { Addon } from '@embroider/addon-dev/rollup';
 
 const addon = new Addon({
   srcDir: 'src',
-  destDir: 'dist',
+  destDir: 'dist'
 });
 
+// Add extensions here, such as ts, gjs, etc that you may import
+const extensions = ['.js', '.ts'];
+
 export default {
   // This provides defaults that work well alongside `publicEntrypoints` below.
   // You can augment this if you need to.
@@ -15,12 +18,20 @@ export default {
   plugins: [
     // These are the modules that users should be able to import from your
     // addon. Anything not listed here may get optimized away.
-    addon.publicEntrypoints(["index.js", "**/*.js"]),
+    addon.publicEntrypoints([
+      'components/**/*.js',
+      'services/**/*.js',
+      'instance-initializers/**/*.js'
+    ]),
 
     // These are the modules that should get reexported into the traditional
     // "app" tree. Things in here should also be in publicEntrypoints above, but
     // not everything in publicEntrypoints necessarily needs to go here.
-    addon.appReexports(['components/**/*.js', 'services/**/*.js', 'instance-initializers/**/*.js']),
+    addon.appReexports([
+      'components/**/*.js',
+      'services/**/*.js',
+      'instance-initializers/**/*.js'
+    ]),
 
     // Follow the V2 Addon rules about dependencies. Your code can import from
     // `dependencies` and `peerDependencies` as well as standard Ember-provided
@@ -34,7 +45,8 @@ export default {
     // By default, this will load the actual babel config from the file
     // babel.config.json.
     babel({
-      babelHelpers: 'bundled',
+      extensions,
+      babelHelpers: 'bundled'
     }),
 
     // Ensure that standalone .hbs files are properly integrated as Javascript.
@@ -51,8 +63,8 @@ export default {
     copy({
       targets: [
         { src: '../README.md', dest: '.' },
-        { src: '../LICENSE.md', dest: '.' },
-      ],
-    }),
-  ],
+        { src: '../LICENSE.md', dest: '.' }
+      ]
+    })
+  ]
 };

ember-phone-input/src/unpublished-developer-types/index.d.ts

@@ -0,0 +1,11 @@
+import '@glint/environment-ember-loose';
+import 'ember-source/types';
+import 'ember-source/types/preview';
+import type RenderModifiersRegistry from '@ember/render-modifiers/template-registry';
+
+declare module '@glint/environment-ember-loose/registry' {
+  export default interface Registry extends RenderModifiersRegistry {
+    // Add any registry entries from other addons here that your addon itself uses (in non-strict mode templates)
+    // See https://typed-ember.gitbook.io/glint/using-glint/ember/using-addons
+  }
+}

ember-phone-input/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "extends": "@tsconfig/ember/tsconfig.json",
+  "include": ["src/**/*", "unpublished-development-types/**/*"],
+  "glint": {
+    "environment": "ember-loose"
+  },
+  "compilerOptions": {
+    "allowJs": true,
+    "declarationDir": "declarations",
+    "skipLibCheck": true
+  }
+}