Skip to content

Commit c592463

Browse files
committed
chore: initial commit
0 parents  commit c592463

15 files changed

+4501
-0
lines changed

.eslintignore

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example
9+
10+
# Ignore files for PNPM, NPM and YARN
11+
pnpm-lock.yaml
12+
package-lock.json
13+
yarn.lock

.eslintrc.cjs

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
module.exports = {
2+
root: true,
3+
parser: '@typescript-eslint/parser',
4+
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
5+
plugins: ['svelte3', '@typescript-eslint'],
6+
ignorePatterns: ['*.cjs'],
7+
overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
8+
settings: {
9+
'svelte3/typescript': () => require('typescript')
10+
},
11+
parserOptions: {
12+
sourceType: 'module',
13+
ecmaVersion: 2020
14+
},
15+
env: {
16+
browser: true,
17+
es2017: true,
18+
node: true
19+
}
20+
};

.gitignore

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example

.npmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
engine-strict=true

.prettierignore

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example
9+
10+
# Ignore files for PNPM, NPM and YARN
11+
pnpm-lock.yaml
12+
package-lock.json
13+
yarn.lock

.prettierrc

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"tabWidth": 4,
3+
"trailingComma": "es5",
4+
"printWidth": 120
5+
}

README.md

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
# svelte-codemirror-editor
2+
3+
A svelte component to create a [CodeMirror 6](https://codemirror.net/6/) editor.
4+
5+
## Installation
6+
7+
```bash
8+
# create a new project in the current directory
9+
npm install svelte-codemirror-editor
10+
```
11+
12+
## Usage
13+
14+
To use `svelte-codemirror-editor`, you need to import the package and use it as any `Svelte` component.
15+
16+
```tsx
17+
<script lang="ts">
18+
import CodeMirror from "svelte-codemirror-editor";
19+
import { javascript } from "@codemirror/lang-javascript";
20+
21+
let value = "";
22+
</script>
23+
24+
<CodeMirror bind:value lang={javascript} class="editor" />
25+
26+
<style>
27+
:global(.editor .cm-editor) {
28+
height: 40rem;
29+
}
30+
</style>
31+
32+
```
33+
34+
### Properties
35+
36+
| Property | Type | Description | Default value |
37+
| --------- | ---------- | ------------------------------------------------------------------------------------------- | ------------- |
38+
| `value` | `string` | The value that will be displayed and edited in the CodeMirror editor | `""` |
39+
| `lang` | `"string"` | The language of the code. Can be one of `javascript`, `typescript`, `html`, `css`, `custom` | `"custom"` |
40+
| `useTab` | `boolean` | Whether to use the `Tab` shortcut to handle indentation | `true` |
41+
| `tabSize` | `number` | The number of space of an indentation level. | `2` |
42+
43+
### Events
44+
45+
| Event | Type | Description |
46+
| -------- | -------- | ----------------------------- |
47+
| `change` | `string` | Trigger when the code changes |

0 commit comments

Comments
 (0)