@seorii/tiptap 0.2.9 → 0.2.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10,6 +10,7 @@ declare const _default: {
10
10
  cancel: string;
11
11
  insert: string;
12
12
  noResult: string;
13
+ default: string;
13
14
  title: string;
14
15
  paragraph: string;
15
16
  link: string;
@@ -10,6 +10,7 @@ export default {
10
10
  cancel: 'Cancel',
11
11
  insert: 'Insert',
12
12
  noResult: 'No result',
13
+ default: 'default',
13
14
  title: 'Title',
14
15
  paragraph: 'Paragraph',
15
16
  link: 'Link',
@@ -10,6 +10,7 @@ declare const _default: {
10
10
  cancel: string;
11
11
  insert: string;
12
12
  noResult: string;
13
+ default: string;
13
14
  title: string;
14
15
  paragraph: string;
15
16
  link: string;
@@ -10,6 +10,7 @@ export default {
10
10
  cancel: '취소',
11
11
  insert: '삽입',
12
12
  noResult: '결과 없음',
13
+ default: '기본',
13
14
  title: '제목',
14
15
  paragraph: '본문',
15
16
  link: '링크',
@@ -7,6 +7,7 @@ import deleteTable from "../plugin/table/deleteTable";
7
7
  import setMath from "./setMath";
8
8
  import { Button, Icon, IconButton, Input, List, OneLine, Tooltip } from "nunui";
9
9
  import i18n from "../i18n";
10
+ export let colors = [];
10
11
  const tiptap = getContext('editor');
11
12
  let link = false, href = '', sel = '', _sel = '';
12
13
  $: selection = $tiptap?.state?.selection;
@@ -25,7 +26,6 @@ $: if ($tiptap) {
25
26
  }
26
27
  </script>
27
28
 
28
-
29
29
  {#if $tiptap}
30
30
  <BubbleMenu editor={$tiptap} updateDelay={50}
31
31
  tippyOptions={{moveTransition: 'transform 0.2s cubic-bezier(1,.5,0,.85)', animation:'shift-away-subtle', duration: [200, 50]}}>
@@ -93,6 +93,22 @@ $: if ($tiptap) {
93
93
  <ToolbarButton icon="superscript" prop="superscript"/>
94
94
  <ToolbarButton icon="subscript" prop="subscript"/>
95
95
  <ToolbarButton icon="functions" handler={() => setMath($tiptap)}/>
96
+ <Tooltip bottom left xstack>
97
+ <IconButton size="1.2em" icon="palette" slot="target"/>
98
+ <div style="font-size: 0.6em">
99
+ <List>
100
+ <Button small outlined on:click={() => $tiptap.chain().focus().unsetColor().run()}>{i18n('default')}
101
+ </Button>
102
+ {#each colors as color}
103
+ <Button small outlined
104
+ on:click={() => $tiptap.chain().focus().setColor(color).run()}
105
+ style="margin-right:4px">
106
+ <span style="width: 20px; height: 16px; background: {color}; border-radius: 4px;display: inline-block;margin-bottom: -2px"></span>
107
+ </Button>
108
+ {/each}
109
+ </List>
110
+ </div>
111
+ </Tooltip>
96
112
  <ToolbarButton icon="code" prop="code"/>
97
113
  <ToolbarButton icon="link" prop="link" handler={() => link = true}/>
98
114
  {/if}
@@ -1,7 +1,9 @@
1
1
  import { SvelteComponentTyped } from "svelte";
2
2
  import 'tippy.js/animations/shift-away-subtle.css';
3
3
  declare const __propDef: {
4
- props: Record<string, never>;
4
+ props: {
5
+ colors?: any[] | undefined;
6
+ };
5
7
  events: {
6
8
  [evt: string]: CustomEvent<any>;
7
9
  };
@@ -23,9 +23,19 @@ const san = (body) => sanitizeHtml(body, {
23
23
  embed: ['src', 'type', 'frameborder', 'allowfullscreen']
24
24
  },
25
25
  });
26
- export let body = '', editable = false, ref = null, options = {};
26
+ export let body = '', editable = false, ref = null, options = {}, loaded = false;
27
27
  export let imageUpload = fallbackUpload, style = '';
28
28
  export let blocks = [], placeholder = i18n('placeholder');
29
+ export let colors = [
30
+ '#ef5350', //red
31
+ '#ec407a', //pink
32
+ '#ff7043', //orange
33
+ '#daca3b', //yellow
34
+ '#8bc34a', //green
35
+ '#2196f3', //blue
36
+ '#3f51b5', //blue
37
+ '#ab47bc', //purple
38
+ ];
29
39
  const tiptap = setContext('editor', writable(null));
30
40
  let element, fullscreen = false, mounted = false, last = '';
31
41
  $: $tiptap && $tiptap.setEditable(editable);
@@ -50,6 +60,7 @@ if (browser) {
50
60
  content = null;
51
61
  body = last = content;
52
62
  });
63
+ loaded = true;
53
64
  });
54
65
  return () => {
55
66
  mounted = false;
@@ -101,18 +112,22 @@ function selectItem(index) {
101
112
  <div class="wrapper">
102
113
  <div bind:this={element} class="target" on:keydown|capture={handleKeydown}></div>
103
114
  {#if !$tiptap}
104
- {i18n('loading')}
115
+ {#if $$slots.preloader}
116
+ <slot name="preloader"/>
117
+ {:else}
118
+ {i18n('loading')}
119
+ {/if}
105
120
  {/if}
106
121
  </div>
107
122
  {#if editable}
108
123
  <Command {selectedIndex}/>
109
124
  <Floating/>
110
125
  {#if $$slots.bubble}
111
- <Bubble>
126
+ <Bubble {colors}>
112
127
  <slot name="bubble"/>
113
128
  </Bubble>
114
129
  {:else}
115
- <Bubble/>
130
+ <Bubble {colors}/>
116
131
  {/if}
117
132
  {/if}
118
133
  </main>
@@ -7,15 +7,18 @@ declare const __propDef: {
7
7
  editable?: boolean | undefined;
8
8
  ref?: null | undefined;
9
9
  options?: {} | undefined;
10
+ loaded?: boolean | undefined;
10
11
  imageUpload?: UploadFn | undefined;
11
12
  style?: string | undefined;
12
13
  blocks?: any[] | undefined;
13
14
  placeholder?: any;
15
+ colors?: string[] | undefined;
14
16
  };
15
17
  events: {
16
18
  [evt: string]: CustomEvent<any>;
17
19
  };
18
20
  slots: {
21
+ preloader: {};
19
22
  bubble: {};
20
23
  };
21
24
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seorii/tiptap",
3
- "version": "0.2.9",
3
+ "version": "0.2.11",
4
4
  "scripts": {
5
5
  "dev": "vite dev",
6
6
  "build": "svelte-kit sync && svelte-package",
@@ -13,63 +13,63 @@
13
13
  "page": "npm run build-page && node gh-pages.js"
14
14
  },
15
15
  "devDependencies": {
16
- "@sveltejs/adapter-auto": "^2.1.1",
17
- "@sveltejs/adapter-static": "^2.0.3",
18
- "@sveltejs/kit": "^1.27.6",
19
- "@sveltejs/package": "^2.2.3",
16
+ "@sveltejs/adapter-auto": "^3.0.1",
17
+ "@sveltejs/adapter-static": "^3.0.1",
18
+ "@sveltejs/kit": "^2.0.6",
19
+ "@sveltejs/package": "^2.2.4",
20
20
  "@types/sanitize-html": "^2.9.5",
21
- "@typescript-eslint/eslint-plugin": "^6.12.0",
22
- "@typescript-eslint/parser": "^6.12.0",
23
- "eslint": "^8.54.0",
24
- "eslint-config-prettier": "^9.0.0",
21
+ "@typescript-eslint/eslint-plugin": "^6.16.0",
22
+ "@typescript-eslint/parser": "^6.16.0",
23
+ "eslint": "^8.56.0",
24
+ "eslint-config-prettier": "^9.1.0",
25
25
  "eslint-plugin-svelte3": "^4.0.0",
26
- "gh-pages": "^6.1.0",
27
- "prettier": "^3.1.0",
26
+ "gh-pages": "^6.1.1",
27
+ "prettier": "^3.1.1",
28
28
  "prettier-plugin-svelte": "^3.1.2",
29
29
  "sass": "^1.69.5",
30
- "svelte": "^4.2.7",
30
+ "svelte": "^4.2.8",
31
31
  "svelte-check": "^3.6.2",
32
- "svelte-preprocess": "^5.1.1",
32
+ "svelte-preprocess": "^5.1.3",
33
33
  "tslib": "^2.6.2",
34
- "typescript": "^5.3.2",
35
- "vite": "^4.5.0"
34
+ "typescript": "^5.3.3",
35
+ "vite": "^5.0.10"
36
36
  },
37
37
  "type": "module",
38
38
  "dependencies": {
39
39
  "@justinribeiro/lite-youtube": "^1.5.0",
40
40
  "@seorii/prosemirror-math": "^0.4.2",
41
- "@tiptap/core": "^2.1.12",
42
- "@tiptap/extension-code": "^2.1.12",
43
- "@tiptap/extension-code-block-lowlight": "^2.1.12",
44
- "@tiptap/extension-color": "^2.1.12",
45
- "@tiptap/extension-dropcursor": "^2.1.12",
46
- "@tiptap/extension-highlight": "^2.1.12",
47
- "@tiptap/extension-image": "^2.1.12",
48
- "@tiptap/extension-link": "^2.1.12",
49
- "@tiptap/extension-ordered-list": "^2.1.12",
50
- "@tiptap/extension-placeholder": "^2.1.12",
51
- "@tiptap/extension-subscript": "^2.1.12",
52
- "@tiptap/extension-superscript": "^2.1.12",
53
- "@tiptap/extension-table": "^2.1.12",
54
- "@tiptap/extension-table-cell": "^2.1.12",
55
- "@tiptap/extension-table-header": "^2.1.12",
56
- "@tiptap/extension-table-row": "^2.1.12",
57
- "@tiptap/extension-text-align": "^2.1.12",
58
- "@tiptap/extension-text-style": "^2.1.12",
59
- "@tiptap/extension-underline": "^2.1.12",
60
- "@tiptap/pm": "^2.1.12",
61
- "@tiptap/starter-kit": "^2.1.12",
62
- "@tiptap/suggestion": "^2.1.12",
41
+ "@tiptap/core": "^2.1.13",
42
+ "@tiptap/extension-code": "^2.1.13",
43
+ "@tiptap/extension-code-block-lowlight": "^2.1.13",
44
+ "@tiptap/extension-color": "^2.1.13",
45
+ "@tiptap/extension-dropcursor": "^2.1.13",
46
+ "@tiptap/extension-highlight": "^2.1.13",
47
+ "@tiptap/extension-image": "^2.1.13",
48
+ "@tiptap/extension-link": "^2.1.13",
49
+ "@tiptap/extension-ordered-list": "^2.1.13",
50
+ "@tiptap/extension-placeholder": "^2.1.13",
51
+ "@tiptap/extension-subscript": "^2.1.13",
52
+ "@tiptap/extension-superscript": "^2.1.13",
53
+ "@tiptap/extension-table": "^2.1.13",
54
+ "@tiptap/extension-table-cell": "^2.1.13",
55
+ "@tiptap/extension-table-header": "^2.1.13",
56
+ "@tiptap/extension-table-row": "^2.1.13",
57
+ "@tiptap/extension-text-align": "^2.1.13",
58
+ "@tiptap/extension-text-style": "^2.1.13",
59
+ "@tiptap/extension-underline": "^2.1.13",
60
+ "@tiptap/pm": "^2.1.13",
61
+ "@tiptap/starter-kit": "^2.1.13",
62
+ "@tiptap/suggestion": "^2.1.13",
63
63
  "emojis-keywords": "2.0.0",
64
64
  "emojis-list": "3.0.0",
65
65
  "lowlight": "^2.9.0",
66
- "nunui": "^0.0.105",
66
+ "nunui": "^0.0.108",
67
67
  "prosemirror-commands": "^1.5.2",
68
- "prosemirror-model": "^1.19.3",
68
+ "prosemirror-model": "^1.19.4",
69
69
  "prosemirror-state": "^1.4.3",
70
- "prosemirror-tables": "^1.3.4",
70
+ "prosemirror-tables": "^1.3.5",
71
71
  "prosemirror-transform": "^1.8.0",
72
- "prosemirror-view": "^1.32.4",
72
+ "prosemirror-view": "^1.32.7",
73
73
  "sanitize-html": "^2.11.0",
74
74
  "svelte-tiptap": "^1.1.2",
75
75
  "tippy.js": "^6.3.7"