diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 8cf357cf..0a299c5c 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -7,7 +7,7 @@ module.exports = {
 		// 'plugin:@typescript-eslint/recommended-requiring-type-checking',
 		'prettier'
 	],
-	plugins: ['svelte3', 'tailwindcss', '@typescript-eslint'],
+	plugins: ['svelte3', 'tailwindcss', '@typescript-eslint', 'es'],
 	ignorePatterns: [
 		'docs/*',
 		'*.cjs',
@@ -42,6 +42,7 @@ module.exports = {
 			}
 		],
 		'@typescript-eslint/no-unsafe-member-access': 'off',
-		'@typescript-eslint/no-unsafe-assignment': 'off'
+		'@typescript-eslint/no-unsafe-assignment': 'off',
+		'es/no-regexp-lookbehind-assertions': 'error'
 	}
 };
diff --git a/package.json b/package.json
index da069628..1fd7d44c 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
 		"eslint": "^7.32.0",
 		"eslint-config-prettier": "^8.1.0",
 		"eslint-plugin-cypress": "^2.11.3",
+		"eslint-plugin-es": "^4.1.0",
 		"eslint-plugin-mocha": "^9.0.0",
 		"eslint-plugin-postcss-modules": "^1.2.1",
 		"eslint-plugin-svelte3": "^3.2.1",
diff --git a/src/lib/components/editor/util.ts b/src/lib/components/editor/util.ts
index eb5776df..a6455200 100644
--- a/src/lib/components/editor/util.ts
+++ b/src/lib/components/editor/util.ts
@@ -155,8 +155,8 @@ export const initEditor = (monacoEditor): void => {
 				[/^\s*gantt/, 'typeKeyword', 'gantt'],
 				[/^\s*stateDiagram(-v2)?/, 'typeKeyword', 'stateDiagram'],
 				[/^\s*erDiagram/, 'typeKeyword', 'erDiagram'],
-				[/^\s*requirement(Diagram)?/, 'typeKeyword', 'requirementDiagram']
-				// [/%%.*(?<!%%)$/, 'comment']
+				[/^\s*requirement(Diagram)?/, 'typeKeyword', 'requirementDiagram'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment']
 			],
 			gitGraph: [
 				[/option(?=s)/, { token: 'typeKeyword', next: 'optionsGitGraph' }],
@@ -170,7 +170,7 @@ export const initEditor = (monacoEditor): void => {
 						}
 					}
 				],
-				// [/%%.*(?<!%%)$/, 'comment'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
 				[/".*?"/, 'string'],
 				[/\^/, 'delimiter.bracket']
 			],
@@ -202,8 +202,8 @@ export const initEditor = (monacoEditor): void => {
 				],
 				[/".*?"/, 'string'],
 				[/\s*\d+/, 'number'],
-				[/:/, 'delimiter.bracket']
-				// [/%%.*(?<!%%)$/, 'comment']
+				[/:/, 'delimiter.bracket'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment']
 			],
 			flowchart: [
 				[/[ox]?(--+|==+)[ox]/, 'transition'],
@@ -228,8 +228,8 @@ export const initEditor = (monacoEditor): void => {
 				[/<?(--+|==+)>|===+|---+/, 'transition'],
 				[/:::/, 'transition'],
 				[/[;&]/, 'delimiter.bracket'],
-				[/".*?"/, 'string']
-				// [/%%.*(?<!%%)$/, 'comment']
+				[/".*?"/, 'string'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment']
 			],
 			sequenceDiagram: [
 				[
@@ -243,8 +243,8 @@ export const initEditor = (monacoEditor): void => {
 					}
 				],
 				[/(--?>?>|--?[)x])[+-]?/, 'transition'],
-				[/(:)([^:\n]*?$)/, ['delimiter.bracket', 'string']]
-				// [/%%.*(?<!%%)$/, 'comment']
+				[/(:)([^:\n]*?$)/, ['delimiter.bracket', 'string']],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment']
 			],
 			classDiagram: [
 				[/(?!class\s)([a-zA-Z]+)(\s+[a-zA-Z]+)/, ['type', 'variable']],
@@ -260,7 +260,7 @@ export const initEditor = (monacoEditor): void => {
 						}
 					}
 				],
-				// [/%%.*(?<!%%)$/, 'comment'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
 				[/(<<)(.+?)(>>)/, ['delimiter.bracket', 'annotation', 'delimiter.bracket']],
 				[/".*?"/, 'string'],
 				[/:::/, 'transition'],
@@ -291,8 +291,8 @@ export const initEditor = (monacoEditor): void => {
 					]
 				],
 				[/,/, 'delimiter.bracket'],
-				[/(^\s*.+?)(:)([^:]*?)$/, ['string', 'delimiter.bracket', 'variable']]
-				// [/%%.*(?<!%%)$/, 'comment']
+				[/(^\s*.+?)(:)([^:]*?)$/, ['string', 'delimiter.bracket', 'variable']],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment']
 			],
 			gantt: [
 				[/(title)(.*)/, ['keyword', 'string']],
@@ -307,7 +307,7 @@ export const initEditor = (monacoEditor): void => {
 					}
 				],
 				[/(^\s*.*?)(:)/, ['string', 'delimiter.bracket']],
-				// [/%%.*(?<!%%)$/, 'comment'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
 				[/:/, 'delimiter.bracket']
 			],
 			stateDiagram: [
@@ -329,7 +329,7 @@ export const initEditor = (monacoEditor): void => {
 				[/".*?"/, 'string'],
 				[/(:)([^:\n]*?$)/, ['delimiter.bracket', 'string']],
 				[/{|}/, 'delimiter.bracket'],
-				// [/%%.*(?<!%%)$/, 'comment'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
 				[/-->/, 'transition'],
 				[/\[.*?]/, 'string']
 			],
@@ -343,7 +343,7 @@ export const initEditor = (monacoEditor): void => {
 				[/(:)(.*?$)/, ['delimiter.bracket', 'string']],
 				[/:|{|}/, 'delimiter.bracket'],
 				[/([a-zA-Z]+)(\s+[a-zA-Z]+)/, ['type', 'variable']],
-				// [/%%.*(?<!%%)$/, 'comment'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
 				[/[a-zA-Z_-][\w$]*/, 'variable']
 			],
 			requirementDiagram: [
@@ -359,7 +359,7 @@ export const initEditor = (monacoEditor): void => {
 					}
 				],
 				[/:|{|}|\//, 'delimiter.bracket'],
-				// [/%%.*(?<!%%)$/, 'comment'],
+				[/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
 				[/".*?"/, 'string']
 			]
 		}