https://github.com/mtmeyer/codemirror-svelte-modules

Svelte wrapper for Codemirror 6
https://github.com/mtmeyer/codemirror-svelte-modules

Last synced: 6 days ago
JSON representation

Svelte wrapper for Codemirror 6

• Host: GitHub
• URL: https://github.com/mtmeyer/codemirror-svelte-modules
• Owner: mtmeyer
• Created: 2022-05-09T12:27:36.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-05-14T06:29:19.000Z (over 2 years ago)
• Last Synced: 2024-10-01T13:09:23.128Z (about 2 months ago)
• Language: Svelte
• Size: 303 KB
• Stars: 3
• Watchers: 1
• Forks: 1
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# CodeMirror Svelte Modules

This is a simple wrapper around Codemirror using their new architecture in v6.

This library was heavily inspired by a similar React library [`@uiw/react-codemirror`](https://uiwjs.github.io/react-codemirror/)

## CodeMirror Documentation

In version 6 CodeMirror only exports modules as described here: [CodeMirror v6 Guide](https://codemirror.net/6/docs/guide/)

For all the v6 documentation go here: [CodeMirror v6 Documentation](https://codemirror.net/6/docs/)

## Example

```html

  import CodeMirror from 'codemirror-svelte-modules';

```

### Props

More details on props and their types coming soon

- extensions: `Extensions[]`

- height: `string`

- minHeight: `string`

- maxHeight: `string`

- width: `string`

- minWidth: `string`

- maxWidth: `string`

- editable: `boolean`

- readOnly: `boolean`

- autoFocus: `boolean`

- theme: `Extension`

- basicSetup: `boolean`

- initialValue: `string`

### Adding extensions

```html

  import CodeMirror from 'codemirror-svelte-modules'; 

  import { syntaxHighlighting, defaultHighlightStyle } from '@codemirror/language';

  import { javascript } from '@codemirror/lang-javascript';

```