use-arcgis-monaco-editor
v0.1.8
Published
React hook for accessing monaco instance and connecting to arcgis item types.
Downloads
21
Maintainers
Readme
ArcGIS Monaco Editor
Custom hook for using Microsofts Monaco Editor in React applications and customized functionality to integrate with ArcGIS items.
Documentation
- Full component docs can be found at: https://arcgis-monaco-editor.netlify.app/
- JSON Schema Docs: https://json-schema.org/understanding-json-schema/reference/index.html
Installation
Import Syntax
Usage
Input
ref options | Name | Type | Default | Description | | :--------------- | :---------------------- | :------ | :------------------------------------------------------------------------------------------------- | | theme | enum: 'light' | 'dark' | 'light' | Default themes of monaco. | | value | string | | The editor value | | language | enum: ... | | All languages that are supported by monaco-editor | | diffEditor | enum: 'true' | 'false' | 'false' | Set if using monaco diffEditor | | modifiedValue | string | | The editor value for modified code pane | | modifiedLanguage | enum: ... | | All languages that are supported by monaco-editor | | schemaType | enum: 'arcgis-item' | | Sets schema of the editor providing code completion, warnings, hover providers for item types, and marking readOnly values based on arcgis item type schemas | | customSchema | object | | JSON Schema Object to set the editor schema | | monacoConstructionOptions | object | {} | IStandaloneEditorConstructionOptions | | monacoOverrideServices | object | {} | IEditorOverrideServices |
Output
| Name | Type | Default | Description | | :------------- | :------ | :------ | :--------------------------------------------------------------- | | isEditorReady | boolean | | Determines if monaco has been initialized and editor created. | | editor | ref | | editor instance | | monaco | ref | | monaco instance | | warningMarkers | array | [] | Array of monaco warning markers. Auto updated. | | errorMarkers | array | [] | Array of monaco error markers. Auto updated. | | modalValue | string | | Value of the contents of the modal in string form. Auto updated. |
Contributing
To get started, go ahead and fork this repo. Once you've done that, there are a few things you should know before getting started.
Before you Start
npm install
NPM tasks
To run Storybook
npm start
Use Storybook as the primary development/test environment.
To build for production
npm run build
Submitting a Pull Request
Once you're ready to submit your changes, submit a pull request into the master
branch. Often it's a good idea to open an issue to discuss your proposed changes before making a PR, but you're welcome to submit a PR without an issue - just be sure to include a good description of your changes.