Merge branch 'main' into flatten-output-paths

.eslintrc.yaml

@@ -8,6 +8,7 @@ rules:
   '@typescript-eslint/no-shadow': off
   '@typescript-eslint/no-unnecessary-condition': off
 
+  import/extensions: off
   import/no-extraneous-dependencies: off
   import/no-unresolved: off
 

CONTRIBUTING.md

@@ -1,5 +1,15 @@
 # Contributing
 
+## Prerequisites
+
+The following are required to start working on this project:
+
+- [Git](https://git-scm.com)
+- [NodeJS](https://nodejs.org) 16 or higher
+- [npm](https://github.com/npm/cli) 8.1.2 or higher
+
+## Getting started
+
 To get started with contributing, clone the repository and install its dependencies.
 
 ```sh
@@ -8,16 +18,19 @@ cd monaco-yaml
 npm ci
 ```
 
+## Building
+
 To build the repository, run:
 
 ```sh
-npm prepack
+npm run prepack
 ```
 
+## Running
+
 To test it, run one of the
 [examples](https://github.com/remcohaszing/monaco-yaml/tree/main/examples).
 
 ```sh
-cd examples/webpack-worker-loader
-npm start
+npm --workspace demo start
 ```

build.js

@@ -3,7 +3,7 @@ const { build } = require('esbuild');
 const { dependencies, peerDependencies } = require('./package.json');
 
 build({
-  entryPoints: ['src/index.ts', 'src/yaml.worker.ts'],
+  entryPoints: ['src/monaco.contribution.ts', 'src/yaml.worker.ts'],
   bundle: true,
   external: Object.keys({ ...dependencies, ...peerDependencies }),
   logLevel: 'info',
@@ -17,20 +17,8 @@ build({
       setup({ onResolve }) {
         // The yaml language service only imports re-exports of vscode-languageserver-types from
         // vscode-languageserver.
-        onResolve({ filter: /^vscode-languageserver-textdocument$/ }, () => ({
-          path: 'vscode-languageserver-textdocument/lib/esm/main.js',
-          external: true,
-        }));
-        // The yaml language service only imports re-exports of vscode-languageserver-types from
-        // vscode-languageserver.
-        onResolve({ filter: /^vscode-languageserver(\/node)?$/ }, () => ({
-          path: 'vscode-languageserver-types/lib/esm/main.js',
-          external: true,
-        }));
-        // The yaml language service only imports re-exports of vscode-languageserver-types from
-        // vscode-languageserver.
-        onResolve({ filter: /^vscode-languageserver-(protocol|types)$/ }, () => ({
-          path: 'vscode-languageserver-types/lib/esm/main.js',
+        onResolve({ filter: /^vscode-languageserver(\/node|-protocol)?$/ }, () => ({
+          path: 'vscode-languageserver-types',
           external: true,
         }));
         // The yaml language service uses path. We can stub it using path-browserify.
@@ -40,8 +28,8 @@ build({
         }));
         // The main prettier entry point contains all of Prettier.
         // The standalone bundle is smaller and works fine for us.
-        onResolve({ filter: /^prettier$/ }, () => ({
-          path: 'prettier/standalone',
+        onResolve({ filter: /^prettier/ }, ({ path }) => ({
+          path: path === 'prettier' ? 'prettier/standalone.js' : `${path}.js`,
           external: true,
         }));
         // This tiny filler implementation serves all our needs.

examples/demo/README.md

@@ -2,10 +2,30 @@
 
 This demo is deployed to [monaco-yaml.js.org](https://monaco-yaml.js.org). It shows how
 `monaco-editor` and `monaco-yaml` can be used with
-[Webpack 5](https://webpack.js.org/concepts/entry-points). To start it, simply run:
+[Webpack 5](https://webpack.js.org/concepts/entry-points).
+
+## Prerequisites
+
+- [NodeJS](https://nodejs.org) 16 or higher
+- [npm](https://github.com/npm/cli) 8.1.2 or higher
+
+## Setup
+
+To run the project locally, clone the repository and set it up:
 
 ```sh
-npm start
+git clone https://github.com/remcohaszing/monaco-yaml
+cd monaco-yaml
+npm ci
+npm run prepack
+```
+
+## Running
+
+To start it, simply run:
+
+```sh
+npm --workspace demo start
 ```
 
 The demo will open in your browser.

examples/demo/src/index.ts

@@ -184,6 +184,7 @@ ed.onDidChangeCursorPosition(async (event) => {
     breadcrumb.setAttribute('role', 'button');
     breadcrumb.classList.add('breadcrumb');
     breadcrumb.textContent = symbol.name;
+    breadcrumb.title = symbol.detail;
     if (symbol.kind === languages.SymbolKind.Array) {
       breadcrumb.classList.add('array');
     } else if (symbol.kind === languages.SymbolKind.Module) {

examples/demo/src/types.d.ts

@@ -15,7 +15,7 @@ declare module 'monaco-editor/esm/vs/editor/contrib/documentSymbols/documentSymb
   ): Promise<languages.DocumentSymbol[]>;
 }
 
-declare module 'monaco-editor/esm/vs/editor/editor.worker' {
+declare module 'monaco-editor/esm/vs/editor/editor.worker.js' {
   import { worker } from 'monaco-editor/esm/vs/editor/editor.api';
 
   export function initialize(

examples/minimal-vite/README.md

@@ -1,3 +0,0 @@
-# Minimal Vite Example
-
-This minimal example shows how `monaco-yaml` can be used with [Vite](https://vitejs.dev).

examples/monaco-editor-webpack-plugin/README.md

@@ -7,8 +7,28 @@ Example is based on
 [link](https://github.com/microsoft/monaco-editor-samples/tree/main/browser-esm-webpack-monaco-plugin).
 To start it, simply run:
 
+## Prerequisites
+
+- [NodeJS](https://nodejs.org) 16 or higher
+- [npm](https://github.com/npm/cli) 8.1.2 or higher
+
+## Setup
+
+To run the project locally, clone the repository and set it up:
+
 ```sh
-npm start
+git clone https://github.com/remcohaszing/monaco-yaml
+cd monaco-yaml
+npm ci
+npm run prepack
+```
+
+## Running
+
+To start it, simply run:
+
+```sh
+npm --workspace monaco-editor-webpack-plugin-example start
 ```
 
 The demo will open in your browser.

examples/monaco-editor-webpack-plugin/editor.js

@@ -1,7 +1,5 @@
-// eslint-disable-next-line import/extensions
 import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js';
 
-// eslint-disable-next-line import/extensions
 export { editor } from 'monaco-editor/esm/vs/editor/editor.api.js';
 export { setDiagnosticsOptions } from 'monaco-yaml';
 export default monaco;

examples/monaco-editor-webpack-plugin/index.js

@@ -4,7 +4,6 @@ boolean: true
 `;
 
 async function create() {
-  // eslint-disable-next-line import/extensions
   const monaco = await import('./main.js');
 
   monaco.editor.create(document.querySelector('.editor'), {

examples/vite-example/README.md

@@ -0,0 +1,29 @@
+# Vite Example
+
+This minimal example shows how `monaco-yaml` can be used with [Vite](https://vitejs.dev).
+
+## Prerequisites
+
+- [NodeJS](https://nodejs.org) 16 or higher
+- [npm](https://github.com/npm/cli) 8.1.2 or higher
+
+## Setup
+
+To run the project locally, clone the repository and set it up:
+
+```sh
+git clone https://github.com/remcohaszing/monaco-yaml
+cd monaco-yaml
+npm ci
+npm run prepack
+```
+
+## Running
+
+To start it, simply run:
+
+```sh
+npm --workspace vite-example start
+```
+
+The demo will be available on http://localhost:3000.

examples/vite-example/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "minimal-vite",
+  "name": "vite-example",
   "version": "1.0.0",
   "private": true,
   "scripts": {

index.d.ts

@@ -70,14 +70,6 @@ declare module 'monaco-editor/esm/vs/editor/editor.api' {
        */
       readonly isKubernetes?: boolean;
 
-      /**
-       * If specified, this prefix will be added to all on demand schema requests
-       *
-       * @default undefined
-       * @deprecated
-       */
-      readonly prefix?: string;
-
       /**
        * A list of known schemas and/or associations of schemas to file names.
        *

src/index.ts

@@ -1,4 +1,4 @@
-import { Emitter, languages } from 'monaco-editor/esm/vs/editor/editor.api';
+import { Emitter, languages } from 'monaco-editor/esm/vs/editor/editor.api.js';
 
 import { languageId } from './constants';
 import { setupMode } from './yamlMode';

src/languageFeatures.ts

@@ -6,9 +6,9 @@ import {
   Position,
   Range,
   Uri,
-} from 'monaco-editor/esm/vs/editor/editor.api';
+} from 'monaco-editor/esm/vs/editor/editor.api.js';
 import * as ls from 'vscode-languageserver-types';
-import { CustomFormatterOptions } from 'yaml-language-server/lib/esm/languageservice/yamlLanguageService';
+import { CustomFormatterOptions } from 'yaml-language-server/lib/esm/languageservice/yamlLanguageService.js';
 
 import { languageId } from './constants';
 import { YAMLWorker } from './yamlWorker';
@@ -140,7 +140,7 @@ function toRange(range: ls.Range): Range {
   );
 }
 
-function toCompletionItemKind(kind: languages.CompletionItemKind): languages.CompletionItemKind {
+function toCompletionItemKind(kind: ls.CompletionItemKind): languages.CompletionItemKind {
   const mItemKind = languages.CompletionItemKind;
 
   switch (kind) {
@@ -341,7 +341,7 @@ function toSymbolKind(kind: ls.SymbolKind): languages.SymbolKind {
 
 function toDocumentSymbol(item: ls.DocumentSymbol): languages.DocumentSymbol {
   return {
-    detail: '',
+    detail: item.detail || '',
     range: toRange(item.range),
     name: item.name,
     kind: toSymbolKind(item.kind),

src/workerManager.ts

@@ -1,4 +1,4 @@
-import { editor, languages } from 'monaco-editor/esm/vs/editor/editor.api';
+import { editor, languages } from 'monaco-editor/esm/vs/editor/editor.api.js';
 
 import { WorkerAccessor } from './languageFeatures';
 import { YAMLWorker } from './yamlWorker';
@@ -48,7 +48,6 @@ export function createWorkerManager(
         createData: {
           languageSettings: defaults.diagnosticsOptions,
           enableSchemaRequest: defaults.diagnosticsOptions.enableSchemaRequest,
-          prefix: defaults.diagnosticsOptions.prefix,
           isKubernetes: defaults.diagnosticsOptions.isKubernetes,
           customTags: defaults.diagnosticsOptions.customTags,
         },

src/yaml.worker.ts

@@ -1,4 +1,4 @@
-import { initialize } from 'monaco-editor/esm/vs/editor/editor.worker';
+import { initialize } from 'monaco-editor/esm/vs/editor/editor.worker.js';
 
 import { createYAMLWorker, ICreateData } from './yamlWorker';
 

src/yamlMode.ts

@@ -1,4 +1,4 @@
-import { languages } from 'monaco-editor/esm/vs/editor/editor.api';
+import { languages } from 'monaco-editor/esm/vs/editor/editor.api.js';
 
 import { languageId } from './constants';
 import {

src/yamlWorker.ts

@@ -1,4 +1,4 @@
-import { worker } from 'monaco-editor/esm/vs/editor/editor.api';
+import { worker } from 'monaco-editor/esm/vs/editor/editor.api.js';
 import { Promisable } from 'type-fest';
 import { TextDocument } from 'vscode-languageserver-textdocument';
 import * as ls from 'vscode-languageserver-types';
@@ -6,14 +6,16 @@ import {
   CustomFormatterOptions,
   getLanguageService,
   LanguageSettings,
-} from 'yaml-language-server/lib/esm/languageservice/yamlLanguageService';
+} from 'yaml-language-server/lib/esm/languageservice/yamlLanguageService.js';
 
 import { languageId } from './constants';
 
-let defaultSchemaRequestService: (url: string) => Promise<string>;
-
-if (typeof fetch !== 'undefined') {
-  defaultSchemaRequestService = (url) => fetch(url).then((response) => response.text());
+async function schemaRequestService(uri: string): Promise<string> {
+  const response = await fetch(uri);
+  if (response.ok) {
+    return response.text();
+  }
+  throw new Error(`Schema request failed for ${uri}`);
 }
 
 export interface YAMLWorker {
@@ -36,10 +38,14 @@ export interface YAMLWorker {
 
 export function createYAMLWorker(
   ctx: worker.IWorkerContext,
-  { enableSchemaRequest, languageSettings, prefix = '' }: ICreateData,
+  { enableSchemaRequest, languageSettings }: ICreateData,
 ): YAMLWorker {
-  const service = (url: string): Promise<string> => defaultSchemaRequestService(`${prefix}${url}`);
-  const languageService = getLanguageService(enableSchemaRequest && service, null, null, null);
+  const languageService = getLanguageService(
+    enableSchemaRequest ? schemaRequestService : null,
+    null,
+    null,
+    null,
+  );
   languageService.configure(languageSettings);
 
   const getTextDocument = (uri: string): TextDocument => {
@@ -100,6 +106,5 @@ export function createYAMLWorker(
 export interface ICreateData {
   languageSettings: LanguageSettings;
   enableSchemaRequest: boolean;
-  prefix?: string;
   isKubernetes?: boolean;
 }