fix component registering

.gitignore

@@ -1,5 +1,5 @@
 *.log
 index.html
-lib
+build
 node_modules
 .parcel-cache

package.json

@@ -7,9 +7,9 @@
 	"version": "1.1.1",
 	"description": "A simple MJML component to make static bar charts",
 	"source": "src/index.ts",
-	"main": "lib/index.js",
 	"scripts": {
 		"watch": "tsc --watch",
+		"prebuild": "rm -rf build",
 		"build": "tsc",
 		"postinstall": "npm run build",
 		"test": "jest",
@@ -29,6 +29,7 @@
 		"@types/jest": "^29.5.10",
 		"@types/mjml": "^4.7.4",
 		"@types/mjml-core": "^4.7.4",
+		"@types/mjml-validator": "^4.13.4",
 		"jest": "^29.7.0",
 		"npm-check": "^6.0.1",
 		"prettier": "^3.1.0",
@@ -37,9 +38,25 @@
 	},
 	"dependencies": {
 		"mjml": "^4.14.1",
-		"mjml-core": "^4.14.1"
+		"mjml-core": "^4.14.1",
+		"mjml-validator": "^4.13.0"
 	},
 	"jest": {
-		"testEnvironment": "node"
+		"detectOpenHandles": true,
+		"verbose": true,
+		"coverageDirectory": "<rootDir>/coverage",
+		"coverageReporters": [
+			"text-summary",
+			"cobertura"
+		],
+		"preset": "ts-jest",
+		"testEnvironment": "node",
+		"moduleFileExtensions": [
+			"ts",
+			"js"
+		],
+		"testMatch": [
+			"**/*.spec.ts"
+		]
 	}
 }

src/index.spec.ts

@@ -1,6 +1,6 @@
 import mjml2html from "mjml";
 import { registerComponent } from "mjml-core";
-import MjmlBarChart from "./index";
+import MjBarChart from "./index";
 
 function toHtml(mjml: string): string {
 	const { html, errors } = mjml2html(mjml);
@@ -9,7 +9,7 @@ function toHtml(mjml: string): string {
 
 describe("mjml-bar-chart", () => {
 	beforeAll(() => {
-		registerComponent(MjmlBarChart);
+		registerComponent(MjBarChart);
 	});
 
 	it("should render the bar chart", () => {

src/index.ts

@@ -1,4 +1,5 @@
 import { BodyComponent } from "mjml-core";
+import { registerDependencies } from "mjml-validator";
 
 type dataset = {
 	label: string;
@@ -54,6 +55,8 @@ export default class MjBarChart extends BodyComponent {
 			this.#barWidth * this.#datasets.length * this.#groups.length;
 	}
 
+	static componentName = "mj-bar-chart";
+
 	static endingTag = true;
 
 	static dependencies = {
@@ -342,3 +345,5 @@ export default class MjBarChart extends BodyComponent {
         `;
 	}
 }
+
+registerDependencies(MjBarChart.dependencies);

tsconfig.json

@@ -1,23 +1,15 @@
 {
 	"$schema": "https://json.schemastore.org/tsconfig",
 	"display": "Node 20",
-	"files": ["src/index.ts"],
 	"compilerOptions": {
-		"lib": ["es2022"],
-		"module": "ESNext",
-		"target": "es2022",
-		"sourceMap": true,
-		"outDir": "./lib",
-		"strict": true,
+		"types": ["node", "jest", "mjml"],
+		"outDir": "build",
+		"target": "ES2022",
+		"moduleResolution": "node",
+		"inlineSourceMap": true,
+		"alwaysStrict": true,
 		"esModuleInterop": true,
-		"skipLibCheck": true,
-		"forceConsistentCasingInFileNames": true,
-		"allowUnreachableCode": false,
-		"allowUnusedLabels": false,
-		"noUnusedLocals": true,
-		"noUnusedParameters": true,
-		"strictNullChecks": true,
-		"strictPropertyInitialization": true,
-		"useUnknownInCatchVariables": true
-	}
+		"skipLibCheck": true
+	},
+	"include": ["src/index.ts"]
 }