diff --git a/ts_web/elements/dees-editor-ace.ts b/ts_web/elements/dees-editor-ace.ts
new file mode 100644
index 0000000..1a3c572
--- /dev/null
+++ b/ts_web/elements/dees-editor-ace.ts
@@ -0,0 +1,82 @@
+import { DeesElement, property, html, customElement, TemplateResult, css, cssManager } from '@designestate/dees-element';
+import * as domtools from '@designestate/dees-domtools';
+
+const deferred = domtools.plugins.smartpromise.defer();
+let aceDeferred: typeof deferred;
+
+import type * as monaco from 'monaco-editor';
+
+declare global {
+ interface HTMLElementTagNameMap {
+ 'dees-editor-ace': DeesEditorAce;
+ }
+}
+
+@customElement('dees-editor-ace')
+export class DeesEditorAce extends DeesElement {
+ public static demo = () => html`
+
+ `;
+
+ constructor() {
+ super();
+ domtools.DomTools.setupDomTools();
+ }
+
+ public static styles = [
+ domtools.elementBasic.staticStyles,
+ css`
+ :host {
+
+ }
+
+ * {
+ box-sizing: border-box;
+ }
+
+ #container {
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ }
+ `
+ ]
+
+ public render (): TemplateResult {
+ return html`
+
+ `;
+ }
+
+ public async firstUpdated (_changedProperties: Map): Promise {
+ super.firstUpdated(_changedProperties);
+ const container = this.shadowRoot.getElementById('container');
+
+ /* if (!aceDeferred) {
+ aceDeferred = domtools.plugins.smartpromise.defer();
+ const scriptUrl = `https://cdn.jsdelivr.net/npm/monaco-editor/min/vs/loader.js`;
+ const script = document.createElement('script');
+ script.src = scriptUrl;
+ script.onload = () => {
+ aceDeferred.resolve();
+ }
+ document.head.appendChild(script);
+ }
+ await aceDeferred.promise;
+
+ (window as any).require.config({
+ paths: { vs: "https://cdn.jsdelivr.net/npm/monaco-editor/min/vs" }
+ });
+ (window as any).require([ "vs/editor/editor.main" ], function () {
+ const editor: monaco.editor.IStandaloneCodeEditor = (window as any).monaco.editor.create(container, {
+ value: "function hello() {\n\talert('Hello world!');\n}",
+ language: 'javascript',
+ theme: 'vs-dark',
+ useShadowDOM: true
+ });
+ }); */
+
+ }
+}
diff --git a/ts_web/elements/index.ts b/ts_web/elements/index.ts
index 7811175..efcec99 100644
--- a/ts_web/elements/index.ts
+++ b/ts_web/elements/index.ts
@@ -1 +1,2 @@
export * from './dees-editor';
+export * from './dees-editor-ace';
\ No newline at end of file