@harmoniclabs/monaco-editor 0.52.0

package/samples/browser-amd-diff-editor/modified.txt

@@ -0,0 +1,74 @@
+
+/// <reference path="../../references.js" />
+(function () {
+	"use strict";
+	
+	var deltaDecorations = function (oldDecorations, newDecorations) {
+		/// <summary>
+		///   Update oldDecorations to match newDecorations.
+		///   It will remove old decorations which are not found in new decorations
+		///   and add only the really new decorations.
+		/// </summary>
+		/// <param name="oldDecorations" type="Array">
+		///   An array containing ids of existing decorations
+		/// </param>
+		/// <param name="newDecorations" type="Array">
+		///   An array containing literal objects describing new decorations. A
+		///   literal contains the following two fields:
+		///      range
+		///      options
+		/// </param>
+		/// <returns type="Array">
+		///   Returns an array of decorations ids
+		/// </returns>
+		var hashFunc = function (range, options) {
+			return range.startLineNumber + "," + range.startColumn + "-" + range.endLineNumber + "," + range.endColumn +
+				"-" + options.hoverMessage + "-" + options.className + "-" + options.isOverlay + "-" + options.showInOverviewRuler;
+		};
+		return this.changeDecorations(function (changeAccessor) {
+			var i, len, oldDecorationsMap = {}, hash;
+			
+			// Record old decorations in a map
+			// Two decorations can have the same hash
+			for (i = 0, len = oldDecorations.length; i < len; i++) {
+				hash = hashFunc(this.getDecorationRange(oldDecorations[i]), this.getDecorationOptions(oldDecorations[i]));
+				oldDecorationsMap[hash] = oldDecorationsMap[hash] || [];
+				oldDecorationsMap[hash].push(oldDecorations[i]);
+			}
+			
+			// Add only new decorations & mark reused ones
+			var j, lenJ, result = [], usedOldDecorations = {}, oldDecorationsCandidates, reusedOldDecoration;
+			for (i = 0, len = newDecorations.length; i < len; i++) {
+				hash = hashFunc(newDecorations[i].range, newDecorations[i].options);
+				reusedOldDecoration = false;
+				if (oldDecorationsMap.hasOwnProperty(hash)) {
+					oldDecorationsCandidates = oldDecorationsMap[hash];
+					// We can try reusing an old decoration (if it hasn't been reused before)
+					for (j = 0, lenJ = oldDecorationsCandidates.length; j < lenJ; j++) {
+						if (!usedOldDecorations.hasOwnProperty(oldDecorationsCandidates[j])) {
+							// Found an old decoration which can be reused & it hasn't been reused before
+							reusedOldDecoration = true;
+							usedOldDecorations[oldDecorationsCandidates[j]] = true;
+							result.push(oldDecorationsCandidates[j]);
+							break;
+						}
+					}
+				}
+				
+				if (!reusedOldDecoration) {
+					result.push(changeAccessor.addDecoration(newDecorations[i].range, newDecorations[i].options));
+				}
+			}
+			
+			// Remove unused old decorations
+			for (i = 0, len = oldDecorations.length; i < len; i++) {
+				if (!usedOldDecorations.hasOwnProperty(oldDecorations[i])) {
+					changeAccessor.removeDecoration(oldDecorations[i]);
+				}
+			}
+			
+			return result;
+		}.bind(this));
+	};
+
+})();

package/samples/browser-amd-diff-editor/original.txt

@@ -0,0 +1,61 @@
+/// <reference path="../../references.js" />
+(function () {
+	"use strict";
+	
+	// Some useless comment
+	
+	var deltaDecorations = function (oldDecorations, newDecorations) {
+		/// <summary>
+		///   Update oldDecorations to match newDecorations.
+		///   It will remove old decorations which are not found in new decorations
+		///   and add only the really new decorations.
+		/// </summary>
+		/// <param name="oldDecorations" type="Array">
+		///   An array containing ids of existing decorations
+		/// </param>
+		/// <param name="newDecorations" type="Array">
+		///   An array containing literal objects describing new decorations. A
+		///   literal contains the following two fields:
+		///      range
+		///      options
+		/// </param>
+		/// <returns type="Array">
+		///   Returns an array of decorations ids
+		/// </returns>
+		var hashFunc = function (range, options) {
+			return range.startLineNumber + "," + range.startColumn + "-" + range.endLineNumber + "," + range.endColumn +
+				"-" + options.hoverMessage + "-" + options.className + "-" + options.isOverlay + "-" + options.showInOverviewRuler;
+		};
+		return this.changeDecorations(function (changeAccessor) {
+			var i, len, oldDecorationsMap = {}, hash;
+				
+			// Record old decorations in a map
+			for (i = 0, len = oldDecorations.length; i < len; i++) {
+				hash = hashFunc(this.getDecorationRange(oldDecorations[i]), this.getDecorationOptions(oldDecorations[i]));
+				oldDecorationsMap[hash] = i;
+			}
+			
+			// Add only new decorations & mark reused ones
+			var result = [], usedOldDecorationsMap = {};
+			for (i = 0, len = newDecorations.length; i < len; i++) {
+				hash = hashFunc(newDecorations[i].range, newDecorations[i].options);
+				if (oldDecorationsMap.hasOwnProperty(hash)) {
+					usedOldDecorationsMap[oldDecorationsMap[hash]] = true;
+					result.push(oldDecorations[oldDecorationsMap[hash]]);
+				} else {
+					result.push(changeAccessor.addDecoration(newDecorations[i].range, newDecorations[i].options));
+				}
+			}
+			
+			// Remove unused old decorations
+			for (i = 0, len = oldDecorations.length; i < len; i++) {
+				if (!usedOldDecorationsMap.hasOwnProperty(i)) {
+					changeAccessor.removeDecoration(oldDecorations[i]);
+				}
+			}
+			
+			return result;
+		}.bind(this));
+	};
+
+})();

package/samples/browser-amd-editor/index.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>browser-amd-editor</title>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+	</head>
+	<body>
+		<h2>Monaco Editor Sample</h2>
+		<div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
+
+		<!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js -->
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
+
+			require(['vs/editor/editor.main'], function () {
+				var editor = monaco.editor.create(document.getElementById('container'), {
+					value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					language: 'javascript'
+				});
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-amd-iframe/index.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Editor in tiny iframe</title>
+
+		<style>
+			#myIframe1 {
+				border: 1px solid blue;
+				width: 0;
+				height: 0;
+			}
+			#myIframe2 {
+				border: 1px solid red;
+				display: none;
+			}
+			#myIframe3 {
+				border: 1px solid green;
+				visibility: hidden;
+			}
+			#programmaticIframe {
+				border: 1px solid yellow;
+			}
+		</style>
+	</head>
+
+	<body>
+		<h2>Monaco Editor inside iframes sample</h2>
+
+		<br />
+		<br />
+		0x0:
+		<br />
+		<iframe id="myIframe1" src="inner.html"></iframe>
+		display:none:
+		<br />
+		<iframe id="myIframe2" src="inner.html"></iframe>
+		visibility:hidden:
+		<br />
+		<iframe id="myIframe3" src="inner.html"></iframe>
+		taken off-dom while loading:
+		<br />
+
+		<script>
+			var myIframe1 = document.getElementById('myIframe1');
+			var myIframe2 = document.getElementById('myIframe2');
+			var myIframe3 = document.getElementById('myIframe3');
+			var programmaticIframe = document.createElement('iframe');
+			programmaticIframe.id = 'programmaticIframe';
+			programmaticIframe.src = 'inner.html';
+			// trigger its loading & take it off dom
+			document.body.appendChild(programmaticIframe);
+
+			setTimeout(function () {
+				document.body.removeChild(programmaticIframe);
+			}, 10);
+
+			setTimeout(function () {
+				document.body.appendChild(programmaticIframe);
+				[myIframe1, myIframe2, myIframe3, programmaticIframe].forEach(reveal);
+			}, 3000);
+
+			function reveal(iframe) {
+				iframe.style.width = '400px';
+				iframe.style.height = '100px';
+				iframe.style.display = 'block';
+				iframe.style.visibility = 'visible';
+			}
+		</script>
+	</body>
+</html>

package/samples/browser-amd-iframe/inner.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+		<style type="text/css">
+			html,
+			body {
+				width: 100%;
+				height: 100%;
+				margin: 0;
+				padding: 0;
+				overflow: hidden;
+			}
+		</style>
+	</head>
+	<body>
+		<div id="container" style="width: 100%; height: 100%"></div>
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
+
+			require(['vs/editor/editor.main'], function () {
+				var editor = monaco.editor.create(document.getElementById('container'), {
+					value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					language: 'javascript'
+				});
+
+				window.onresize = function () {
+					editor.layout();
+				};
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-amd-localized/index.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+	</head>
+	<body>
+		<h2>Monaco Editor Localization Sample</h2>
+		<div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
+
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
+
+			require.config({
+				'vs/nls': {
+					availableLanguages: {
+						'*': 'de'
+					}
+				}
+			});
+
+			require(['vs/editor/editor.main'], function () {
+				var editor = monaco.editor.create(document.getElementById('container'), {
+					value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					language: 'javascript'
+				});
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-amd-monarch/index.html

@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+	</head>
+	<body>
+		<h2>Monarch Tokenizer Sample</h2>
+		<div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
+
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
+
+			require(['vs/editor/editor.main'], function () {
+				monaco.languages.register({
+					id: 'myCustomLanguage'
+				});
+				monaco.languages.setMonarchTokensProvider('myCustomLanguage', {
+					tokenizer: {
+						root: [
+							[/\[error.*/, 'custom-error'],
+							[/\[notice.*/, 'custom-notice'],
+							[/\[info.*/, 'custom-info'],
+							[/\[[a-zA-Z 0-9:]+\]/, 'custom-date']
+						]
+					}
+				});
+
+				// Define a new theme that constains only rules that match this language
+				monaco.editor.defineTheme('myCoolTheme', {
+					colors: {},
+					base: 'vs',
+					inherit: false,
+					rules: [
+						{ token: 'custom-info', foreground: '808080' },
+						{ token: 'custom-error', foreground: 'ff0000', fontStyle: 'bold' },
+						{ token: 'custom-notice', foreground: 'FFA500' },
+						{ token: 'custom-date', foreground: '008800' }
+					]
+				});
+
+				var editor = monaco.editor.create(document.getElementById('container'), {
+					theme: 'myCoolTheme',
+					value: getCode(),
+					language: 'myCustomLanguage'
+				});
+			});
+
+			function getCode() {
+				return [
+					'[Sun Mar 7 16:02:00 2004] [notice] Apache/1.3.29 (Unix) configured -- resuming normal operations',
+					'[Sun Mar 7 16:02:00 2004] [info] Server built: Feb 27 2004 13:56:37',
+					'[Sun Mar 7 16:02:00 2004] [notice] Accept mutex: sysvsem (Default: sysvsem)',
+					'[Sun Mar 7 16:05:49 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 16:45:56 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 17:13:50 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 17:21:44 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 17:23:53 2004] statistics: Use of uninitialized value in concatenation (.) or string at /home/httpd/twiki/lib/TWiki.pm line 528.',
+					"[Sun Mar 7 17:23:53 2004] statistics: Can't create file /home/httpd/twiki/data/Main/WebStatistics.txt - Permission denied",
+					'[Sun Mar 7 17:27:37 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 17:31:39 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 17:58:00 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 18:00:09 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 18:10:09 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 18:19:01 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 18:42:29 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 18:52:30 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 18:58:52 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 19:03:58 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 19:08:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 20:04:35 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 20:11:33 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 20:12:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 20:25:31 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 20:44:48 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 20:58:27 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 21:16:17 2004] [error] [client xx.xx.xx.xx] File does not exist: /home/httpd/twiki/view/Main/WebHome',
+					'[Sun Mar 7 21:20:14 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 21:31:12 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 21:39:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Sun Mar 7 21:44:10 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 01:35:13 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 01:47:06 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 01:59:13 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 02:12:24 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 02:54:54 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 03:46:27 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 03:48:18 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 03:52:17 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 03:55:09 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 04:22:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 04:24:47 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 04:40:32 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 04:55:40 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 04:59:13 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 05:22:57 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 05:24:29 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'[Mon Mar 8 05:31:47 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
+					'<11>httpd[31628]: [error] [client xx.xx.xx.xx] File does not exist: /usr/local/installed/apache/htdocs/squirrelmail/_vti_inf.html in 29-Mar 15:18:20.50 from xx.xx.xx.xx',
+					'<11>httpd[25859]: [error] [client xx.xx.xx.xx] File does not exist: /usr/local/installed/apache/htdocs/squirrelmail/_vti_bin/shtml.exe/_vti_rpc in 29-Mar 15:18:20.54 from xx.xx.xx.xx'
+				].join('\n');
+			}
+		</script>
+	</body>
+</html>

package/samples/browser-amd-requirejs/index.html

@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+	</head>
+	<body>
+		<h2>Monaco Editor Sample - Loading with requirejs</h2>
+		<div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
+
+		<script
+			src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.min.js"
+			integrity="sha256-0SGl1PJNDyJwcV5T+weg2zpEMrh7xvlwO4oXgvZCeZk="
+			crossorigin="anonymous"
+		></script>
+		<script>
+			require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
+
+			require(['vs/editor/editor.main'], function () {
+				var editor = monaco.editor.create(document.getElementById('container'), {
+					value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					language: 'javascript'
+				});
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-amd-shadow-dom/index.html

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>browser-amd-editor</title>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+		<style>
+			/* We must define the font face outside the shadowroot */
+			@font-face {
+				font-family: 'codicon';
+				src: url('../node_modules/monaco-editor/min/vs/base/browser/ui/codicons/codicon/codicon.ttf')
+					format('truetype');
+			}
+		</style>
+	</head>
+	<body>
+		<h2>Monaco Editor Sample</h2>
+		<div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
+
+		<!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js -->
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			require.config({
+				paths: { vs: '../node_modules/monaco-editor/min/vs' },
+				'vs/css': { disabled: true }
+			});
+
+			const container = document.getElementById('container');
+			const shadowRoot = container.attachShadow({
+				mode: 'closed'
+			});
+
+			const innerContainer = document.createElement('div');
+			shadowRoot.appendChild(innerContainer);
+			innerContainer.style.width = '800px';
+			innerContainer.style.height = '600px';
+
+			const innerStyle = document.createElement('style');
+			innerStyle.innerText =
+				'@import "../node_modules/monaco-editor/min/vs/editor/editor.main.css";';
+			shadowRoot.appendChild(innerStyle);
+
+			require(['vs/editor/editor.main'], function () {
+				const editor = monaco.editor.create(innerContainer, {
+					value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					language: 'javascript'
+				});
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-amd-shared-model/index.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+	</head>
+	<body>
+		<h2>Monaco Editor Shared Models Sample</h2>
+		<div id="container1" style="width: 400px; height: 200px; border: 1px solid grey"></div>
+		<div id="container2" style="width: 400px; height: 200px; border: 1px solid grey"></div>
+
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
+
+			require(['vs/editor/editor.main'], function () {
+				var model = monaco.editor.createModel(
+					['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					'javascript'
+				);
+				var editor1 = monaco.editor.create(document.getElementById('container1'), {
+					model: model
+				});
+				var editor2 = monaco.editor.create(document.getElementById('container2'), {
+					model: model
+				});
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-amd-trusted-types/index.html

@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>browser-amd-editor</title>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+		<meta http-equiv="Content-Security-Policy" content="require-trusted-types-for 'script'" />
+	</head>
+	<body>
+		<h2>Monaco Editor with Trusted Types Sample</h2>
+		<div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
+
+		<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
+		<script>
+			// Allow monaco-editor to load scripts from its own paths only
+			var scriptLoadingPolicy = {
+				createScriptURL: function allowOnlyMonacoPaths(url) {
+					if (
+						url.indexOf('../node_modules/monaco-editor/min/vs/') === 0 &&
+						url.lastIndexOf('..') == 0
+					) {
+						return url;
+					}
+				}
+			};
+			// If browser supports Trusted Types, use them.
+			if (typeof trustedTypes !== 'undefined') {
+				scriptLoadingPolicy = trustedTypes.createPolicy('monaco-editor', scriptLoadingPolicy);
+			}
+			require.config({
+				paths: { vs: '../node_modules/monaco-editor/min/vs' },
+				trustedTypesPolicy: scriptLoadingPolicy
+			});
+
+			require(['vs/editor/editor.main'], function () {
+				var editor = monaco.editor.create(document.getElementById('container'), {
+					value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+					language: 'javascript'
+				});
+			});
+		</script>
+	</body>
+</html>

package/samples/browser-esm-esbuild/build.js

@@ -0,0 +1,96 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+//@ts-check
+
+const esbuild = require('esbuild');
+const path = require('path');
+const fs = require('fs');
+
+removeDir('dist', (entry) => /index.html$/.test(entry));
+
+const workerEntryPoints = [
+	'vs/language/json/json.worker.js',
+	'vs/language/css/css.worker.js',
+	'vs/language/html/html.worker.js',
+	'vs/language/typescript/ts.worker.js',
+	'vs/editor/editor.worker.js'
+];
+
+build({
+	entryPoints: workerEntryPoints.map((entry) => `../node_modules/monaco-editor/esm/${entry}`),
+	bundle: true,
+	format: 'iife',
+	outbase: '../node_modules/monaco-editor/esm/',
+	outdir: path.join(__dirname, 'dist')
+});
+
+build({
+	entryPoints: ['index.js'],
+	bundle: true,
+	format: 'iife',
+	outdir: path.join(__dirname, 'dist'),
+	loader: {
+		'.ttf': 'file'
+	}
+});
+
+/**
+ * @param {import ('esbuild').BuildOptions} opts
+ */
+function build(opts) {
+	esbuild.build(opts).then((result) => {
+		if (result.errors.length > 0) {
+			console.error(result.errors);
+		}
+		if (result.warnings.length > 0) {
+			console.error(result.warnings);
+		}
+	});
+}
+
+/**
+ * Remove a directory and all its contents.
+ * @param {string} _dirPath
+ * @param {(filename: string) => boolean} [keep]
+ */
+function removeDir(_dirPath, keep) {
+	if (typeof keep === 'undefined') {
+		keep = () => false;
+	}
+	const dirPath = path.join(__dirname, _dirPath);
+	if (!fs.existsSync(dirPath)) {
+		return;
+	}
+	rmDir(dirPath, _dirPath);
+	console.log(`Deleted ${_dirPath}`);
+
+	/**
+	 * @param {string} dirPath
+	 * @param {string} relativeDirPath
+	 * @returns {boolean}
+	 */
+	function rmDir(dirPath, relativeDirPath) {
+		let keepsFiles = false;
+		const entries = fs.readdirSync(dirPath);
+		for (const entry of entries) {
+			const filePath = path.join(dirPath, entry);
+			const relativeFilePath = path.join(relativeDirPath, entry);
+			if (keep(relativeFilePath)) {
+				keepsFiles = true;
+				continue;
+			}
+			if (fs.statSync(filePath).isFile()) {
+				fs.unlinkSync(filePath);
+			} else {
+				keepsFiles = rmDir(filePath, relativeFilePath) || keepsFiles;
+			}
+		}
+		if (!keepsFiles) {
+			fs.rmdirSync(dirPath);
+		}
+		return keepsFiles;
+	}
+}

package/samples/browser-esm-esbuild/index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+	</head>
+	<body>
+		<h2>Monaco Editor esbuild Bundler Sample</h2>
+
+		To run this sample, you need to:
+
+		<pre>
+$/browser-esm-esbuild> npm run build
+</pre
+		>
+
+		Then, <a href="./dist">open the ./dist folder</a>.
+	</body>
+</html>