lightview 1.8.1-b → 2.0.0

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.
Files changed (224) hide show
  1. package/.agent/workflows/daisyui-component-migration.md +155 -0
  2. package/.codacy/cli.sh +149 -0
  3. package/.codacy/codacy.yaml +15 -0
  4. package/.github/instructions/codacy.instructions.md +72 -0
  5. package/.wranglerignore +21 -0
  6. package/README.md +1331 -21
  7. package/_headers +4 -0
  8. package/build.js +70 -0
  9. package/components/actions/button.js +151 -0
  10. package/components/actions/dropdown.js +120 -0
  11. package/components/actions/modal.js +146 -0
  12. package/components/actions/swap.js +118 -0
  13. package/components/daisyui.js +288 -0
  14. package/components/data-display/accordion.js +128 -0
  15. package/components/data-display/alert.js +112 -0
  16. package/components/data-display/avatar.js +170 -0
  17. package/components/data-display/badge.js +82 -0
  18. package/components/data-display/card.js +151 -0
  19. package/components/data-display/carousel.js +94 -0
  20. package/components/data-display/chart.js +220 -0
  21. package/components/data-display/chat.js +128 -0
  22. package/components/data-display/collapse.js +103 -0
  23. package/components/data-display/countdown.js +69 -0
  24. package/components/data-display/diff.js +111 -0
  25. package/components/data-display/kbd.js +65 -0
  26. package/components/data-display/loading.js +75 -0
  27. package/components/data-display/progress.js +79 -0
  28. package/components/data-display/radial-progress.js +88 -0
  29. package/components/data-display/skeleton.js +66 -0
  30. package/components/data-display/stats.js +159 -0
  31. package/components/data-display/table.js +146 -0
  32. package/components/data-display/timeline.js +146 -0
  33. package/components/data-display/toast.js +72 -0
  34. package/components/data-display/tooltip.js +74 -0
  35. package/components/data-input/checkbox.js +253 -0
  36. package/components/data-input/file-input.js +224 -0
  37. package/components/data-input/input.js +264 -0
  38. package/components/data-input/radio.js +338 -0
  39. package/components/data-input/range.js +204 -0
  40. package/components/data-input/rating.js +219 -0
  41. package/components/data-input/select.js +287 -0
  42. package/components/data-input/textarea.js +287 -0
  43. package/components/data-input/toggle.js +201 -0
  44. package/components/index.js +137 -0
  45. package/components/layout/divider.js +72 -0
  46. package/components/layout/drawer.js +142 -0
  47. package/components/layout/footer.js +100 -0
  48. package/components/layout/hero.js +109 -0
  49. package/components/layout/indicator.js +90 -0
  50. package/components/layout/join.js +78 -0
  51. package/components/layout/navbar.js +110 -0
  52. package/components/navigation/breadcrumbs.js +91 -0
  53. package/components/navigation/dock.js +103 -0
  54. package/components/navigation/menu.js +126 -0
  55. package/components/navigation/pagination.js +105 -0
  56. package/components/navigation/steps.js +89 -0
  57. package/components/navigation/tabs.css +177 -0
  58. package/components/navigation/tabs.js +123 -0
  59. package/components/theme/theme-switch.css +65 -0
  60. package/components/theme/theme-switch.js +177 -0
  61. package/docs/about.html +164 -0
  62. package/docs/api/computed.html +184 -0
  63. package/docs/api/effects.html +173 -0
  64. package/docs/api/elements.html +180 -0
  65. package/docs/api/enhance.html +225 -0
  66. package/docs/api/hypermedia.html +165 -0
  67. package/docs/api/index.html +178 -0
  68. package/docs/api/nav.html +18 -0
  69. package/docs/api/signals.html +136 -0
  70. package/docs/api/state.html +217 -0
  71. package/docs/assets/images/logo-favicon.svg +42 -0
  72. package/docs/assets/images/logo-static.svg +40 -0
  73. package/docs/assets/images/logo.svg +66 -0
  74. package/docs/assets/js/examplify.js +395 -0
  75. package/docs/assets/styles/site.css +1102 -0
  76. package/docs/assets/styles/themes.css +236 -0
  77. package/docs/components/accordion.html +439 -0
  78. package/docs/components/alert.html +528 -0
  79. package/docs/components/avatar.html +586 -0
  80. package/docs/components/badge.html +531 -0
  81. package/docs/components/breadcrumbs.html +278 -0
  82. package/docs/components/button.html +579 -0
  83. package/docs/components/card.html +561 -0
  84. package/docs/components/carousel.html +286 -0
  85. package/docs/components/chart-area.html +702 -0
  86. package/docs/components/chart-bar.html +782 -0
  87. package/docs/components/chart-column.html +735 -0
  88. package/docs/components/chart-line.html +794 -0
  89. package/docs/components/chart-pie.html +823 -0
  90. package/docs/components/chart.html +612 -0
  91. package/docs/components/chat.html +547 -0
  92. package/docs/components/checkbox.html +641 -0
  93. package/docs/components/collapse.html +536 -0
  94. package/docs/components/component-nav.html +53 -0
  95. package/docs/components/countdown.html +470 -0
  96. package/docs/components/diff.html +245 -0
  97. package/docs/components/divider.html +240 -0
  98. package/docs/components/dock.html +277 -0
  99. package/docs/components/drawer.html +515 -0
  100. package/docs/components/dropdown.html +479 -0
  101. package/docs/components/file-input.html +591 -0
  102. package/docs/components/footer.html +301 -0
  103. package/docs/components/gallery.html +504 -0
  104. package/docs/components/hero.html +264 -0
  105. package/docs/components/index.css +840 -0
  106. package/docs/components/index.html +735 -0
  107. package/docs/components/indicator.html +342 -0
  108. package/docs/components/input.html +644 -0
  109. package/docs/components/join.html +285 -0
  110. package/docs/components/kbd.html +322 -0
  111. package/docs/components/loading.html +521 -0
  112. package/docs/components/menu.html +461 -0
  113. package/docs/components/modal.html +639 -0
  114. package/docs/components/navbar.html +321 -0
  115. package/docs/components/pagination.html +279 -0
  116. package/docs/components/progress.html +514 -0
  117. package/docs/components/radial-progress.html +434 -0
  118. package/docs/components/radio.html +655 -0
  119. package/docs/components/range.html +611 -0
  120. package/docs/components/rating.html +642 -0
  121. package/docs/components/select.html +696 -0
  122. package/docs/components/sidebar-setup.js +93 -0
  123. package/docs/components/skeleton.html +447 -0
  124. package/docs/components/spinner.html +68 -0
  125. package/docs/components/stats.html +486 -0
  126. package/docs/components/steps.html +356 -0
  127. package/docs/components/swap.html +517 -0
  128. package/docs/components/switch.html +68 -0
  129. package/docs/components/table.html +668 -0
  130. package/docs/components/tabs.html +506 -0
  131. package/docs/components/text-input.html +68 -0
  132. package/docs/components/textarea.html +603 -0
  133. package/docs/components/timeline.html +487 -0
  134. package/docs/components/toast.html +474 -0
  135. package/docs/components/toggle.html +564 -0
  136. package/docs/components/tooltip.html +423 -0
  137. package/docs/examples/getting-started-example.html +40 -0
  138. package/docs/examples/index.html +93 -0
  139. package/docs/getting-started/index.html +739 -0
  140. package/docs/getting-started/reviews.html +23 -0
  141. package/docs/getting-started/reviews.odom +108 -0
  142. package/docs/getting-started/reviews.vdom +84 -0
  143. package/docs/index.html +134 -0
  144. package/docs/playground.html +416 -0
  145. package/docs/router.html +285 -0
  146. package/docs/styles/index.html +190 -0
  147. package/functions/_middleware.js +32 -0
  148. package/index.html +309 -0
  149. package/lightview-router.js +364 -0
  150. package/lightview-x.js +1577 -0
  151. package/lightview.js +658 -1109
  152. package/lightview.js.backup +793 -0
  153. package/middleware/locale.js +25 -0
  154. package/middleware/markdown.js +44 -0
  155. package/middleware/notFound.js +37 -0
  156. package/package.json +27 -41
  157. package/watch.js +92 -0
  158. package/wrangler.toml +12 -0
  159. package/.idea/lightview.iml +0 -12
  160. package/.idea/modules.xml +0 -8
  161. package/.idea/vcs.xml +0 -6
  162. package/LICENSE +0 -21
  163. package/codepen-no-tabs-embed.css +0 -2
  164. package/components/chart/chart.html +0 -17
  165. package/components/chart/example.html +0 -32
  166. package/components/chart.html +0 -83
  167. package/components/components.js +0 -113
  168. package/components/gantt/example.html +0 -22
  169. package/components/gantt/gantt.html +0 -42
  170. package/components/gauge/example.html +0 -28
  171. package/components/gauge/gauge.html +0 -20
  172. package/components/gauge.html +0 -60
  173. package/components/orgchart/example.html +0 -25
  174. package/components/orgchart/orgchart.html +0 -41
  175. package/components/repl/code-editor.html +0 -64
  176. package/components/repl/editor.html +0 -37
  177. package/components/repl/editorjs-inline-tool/index.js +0 -3
  178. package/components/repl/editorjs-inline-tool/inline-tools.js +0 -28
  179. package/components/repl/editorjs-inline-tool/tool.js +0 -175
  180. package/components/repl/repl-with-wysiwyg.html +0 -355
  181. package/components/repl/repl.html +0 -345
  182. package/components/repl/sup.js +0 -44
  183. package/components/repl/wysiwyg-repl.html +0 -258
  184. package/components/timeline/example.html +0 -33
  185. package/components/timeline/timeline.html +0 -44
  186. package/components/timeline.html +0 -81
  187. package/examples/anchor.html +0 -11
  188. package/examples/chart.html +0 -34
  189. package/examples/counter.html +0 -26
  190. package/examples/counter.test.mjs +0 -47
  191. package/examples/counter2.html +0 -26
  192. package/examples/directives.html +0 -79
  193. package/examples/foreign.html +0 -50
  194. package/examples/forgeinform.html +0 -98
  195. package/examples/form.html +0 -61
  196. package/examples/gauge.html +0 -18
  197. package/examples/invalid-template-literals.html +0 -44
  198. package/examples/medium/remote.html +0 -60
  199. package/examples/message.html +0 -18
  200. package/examples/nested.html +0 -11
  201. package/examples/object-bound-form.html +0 -34
  202. package/examples/remote-server.js +0 -51
  203. package/examples/remote.html +0 -34
  204. package/examples/remote.json +0 -1
  205. package/examples/scratch.html +0 -69
  206. package/examples/sensors/index.html +0 -30
  207. package/examples/sensors/sensor-server.js +0 -30
  208. package/examples/shared.html +0 -41
  209. package/examples/template.html +0 -33
  210. package/examples/timeline.html +0 -21
  211. package/examples/todo.html +0 -38
  212. package/examples/top.html +0 -10
  213. package/examples/types.html +0 -94
  214. package/examples/xor.html +0 -62
  215. package/jest-puppeteer.config.js +0 -5
  216. package/jest.config.json +0 -12
  217. package/sites/client.html +0 -48
  218. package/sites/index.html +0 -247
  219. package/test/basic.html +0 -93
  220. package/test/basic.test.mjs +0 -315
  221. package/test/extended.html +0 -29
  222. package/test/extended.test.mjs +0 -448
  223. package/types.js +0 -534
  224. package/unsplash.key +0 -1
package/components/repl/repl-with-wysiwyg.html DELETED
@@ -1,355 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <title>Lightview:Sites</title>
6
- <script src="https://unpkg.com/@isomorphic-git/lightning-fs"></script>
7
- <script src="https://unpkg.com/isomorphic-git"></script>
8
- <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
9
- <script src="https://unpkg.com/turndown/dist/turndown.js"></script>
10
- <script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script>
11
- <script src="https://cdn.jsdelivr.net/npm/@editorjs/header@latest"></script>
12
- <script src="https://cdn.jsdelivr.net/npm/@editorjs/list@latest"></script>
13
- <script src="https://cdn.jsdelivr.net/npm/@editorjs/table@latest"></script>
14
- <script src="https://cdn.jsdelivr.net/npm/@editorjs/embed@latest"></script>
15
- <script src="https://cdn.jsdelivr.net/npm/editorjs-tooltip@1.1.3/dist/bundle.min.js"></script>
16
- <script src="https://cdn.jsdelivr.net/npm/editorjs-inline-image@1.1.0/dist/bundle.min.js"></script>
17
- <script src="https://cdn.jsdelivr.net/npm/@rodrigoodhin/editorjs-image-gallery@0.1.0/dist/bundle.min.js"></script>
18
- <script src="https://cdn.jsdelivr.net/npm/editorjs-header-with-anchor@2.6.0/dist/bundle.min.js"></script>
19
- <script src="https://cdn.jsdelivr.net/npm/@editorjs/link@latest"></script>
20
- <script src="https://cdn.jsdelivr.net/npm/@calumk/editorjs-codeflask@1.0.9/dist/editorjs-codeflask.bundle.min.js"></script>
21
- <script src="https://cdn.jsdelivr.net/npm/editorjs-github-gist-plugin@1.1.0/dist/main.min.js"></script>
22
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
23
- <template id="repl">
24
-
25
- <div id="content" style="flex:auto;min-height:100%;width:750px;max-width:750px;height:100%;border:1px solid;padding:10px;margin:0 auto">
26
- <div style="display:flex;flex-direction:column;">
27
- <div id="tabs" style="flex-grow:0;width:100%;border:1px;padding-bottom:5px;text-align:center">
28
- <span style="padding-right:10px"><label for="headhtml" l-on:click="${onTabClick}">HTML Head</label><input for="headhtml" value="${headhtmlPinned}" type="checkbox" l-on:click="${onPinClick}"></span>
29
- <span style="padding-right:10px"><label for="wysiwyg" l-on:click="${onTabClick}">WYSIWYG</label><input for="wysiwyg" value="${wysiwygPinned}" type="checkbox" checked l-on:click="${onPinClick}"></span>
30
- <span style="padding-right:10px"><label for="bodyhtml" l-on:click="${onTabClick}">HTML Body</label><input for="bodyhtml" value="${bodyhtmlPinned}" type="checkbox" l-on:click="${onPinClick}"></span>
31
- <span style="padding-right:10px"><label for="markdown" l-on:click="${onTabClick}">Markdown (Body)</label><input for="markdown" value="${markdownPinned}" type="checkbox" l-on:click="${onPinClick}"></span>
32
- <span style="padding-right:10px"><label for="css" l-on:click="${onTabClick}">Style</label><input for="css" value="${cssPinned}" type="checkbox" l-on:click="${onPinClick}"></span>
33
- <span style="padding-right:10px"><label for="script" l-on:click="${onTabClick}">Script</label><input for="script" value="${scriptPinned}" type="checkbox" l-on:click="${onPinClick}"></span>
34
- <span style="padding-right:10px"><label for="preview" l-on:click="${onTabClick}">Preview</label><input for="preview" value="${previewPinned}" type="checkbox" l-on:click="${onPinClick}"></span>
35
- </div>
36
- </div>
37
- <div id="wysiwyg" style="max-width:100%;"><slot name="editor"></slot></div>
38
- <textarea id="headhtml" style="height:200px;max-width:99%;width:99%;margin-right:2px;display:none">${headhtml}</textarea>
39
- <textarea id="bodyhtml" style="height:200px;max-width:99%;width:99%;margin-right:2px;display:none">${bodyhtml}</textarea>
40
- <textarea id="markdown" style="height:200px;max-width:99%;width:99%;margin-right:2px;display:none">${markdown}</textarea>
41
- <textarea id="css" style="height:200px;max-width:99%;width:99%;margin-right:2px;display:none">${cssText}</textarea>
42
- <textarea id="script" style="height:200px;max-width:99%;width:99%;margin-right:2px;display:none">${scriptText}</textarea>
43
- <div id="preview" style="max-width:99%;width:99%;margin-right:2px;display:none"></div>
44
- </div>
45
- <div style="width:100%;text-align:center">
46
- <div style="padding:5px">${source}</div>
47
- <button l-on:click="${doSave}">Save</button>&nbsp;&nbsp;
48
- <button l-if="${!source.trim().startsWith('http')}" l-on:click="${doReset}">Reset</button>
49
- </div>
50
- <style id="style">
51
- label:hover {
52
- text-decoration: underline
53
- }
54
- </style>
55
- <script type="lightview/module">
56
- const turndownService = new TurndownService({headingStyle:"atx",codeBlockStyle:"fenced",emDelimiter:"*"});
57
- turndownService.keep(() => true);
58
-
59
- const {html,css,script} = await import("../../types.js");
60
- self.variables({
61
- onTabClick:"function",
62
- onPinClick:"function",
63
- doSave: "function",
64
- doReset:"function"
65
- });
66
- self.variables({
67
- wysiwygPinned:"boolean",
68
- bodyhtmlPinned:"boolean",
69
- bodyhtml:html,
70
- markdownPinned:"boolean",
71
- markdown:html,
72
- cssPinned:"boolean",
73
- cssText:css,
74
- scriptPinned:"boolean",
75
- scriptText:script,
76
- headhtmlPinned:"boolean",
77
- headhtml:html,
78
- previewPinned:"boolean",
79
- source:"string",
80
- },{reactive});
81
- self.variables({
82
- src:"string",
83
- },{imported});
84
-
85
- bodyhtmlPinned = true;
86
-
87
- const loadFromFile = async () => {
88
- const html = await fs.readFile(url.pathname,{encoding:"utf8"});
89
- source = `IndexedDB://${url.hostname+"_repl"}${url.pathname}`;
90
- return html;
91
- };
92
-
93
- const loadFromServer = async () => {
94
- const response = await fetch(url.href);
95
- const html = await response.text();
96
- source = url.href;
97
- return html;
98
- };
99
-
100
- const parseFullHTML = (fullHTML) => {
101
- const parser = new DOMParser(),
102
- fragment = parser.parseFromString(fullHTML,"text/html"),
103
- body_el = fragment?.querySelector("body"),
104
- style_el = fragment?.querySelector("style"),
105
- script_el = body_el?.querySelector("script");
106
- if(style_el) {
107
- cssText = style_el?.innerHTML;
108
- style_el.remove();
109
- } else {
110
- cssText = "";
111
- }
112
- if(script_el) {
113
- scriptText = script_el?.innerHTML,
114
- script_el.remove();
115
- } else {
116
- scriptText = "";
117
- }
118
- headhtml = fragment?.head.innerHTML || "";
119
- bodyhtml = body_el?.innerHTML;
120
- };
121
-
122
- let fs,
123
- url;
124
- if(src) {
125
- url = new URL(src,window.location.href);
126
- fs = new LightningFS(url.hostname+"_repl").promises;
127
- try {
128
- parseFullHTML(await loadFromFile());
129
- } catch(e) {
130
- try {
131
- parseFullHTML(await loadFromServer());
132
- } catch(e) {
133
- fullHTML = e.message;
134
- }
135
- }
136
- } else {
137
- url = new URL(window.location.href);
138
- fs = new LightningFS(url.hostname+"_repl").promises;
139
- bodyhtml = "";
140
- headhtml = "";
141
- scriptText = "";
142
- cssText = "";
143
- };
144
-
145
- // initialize variables
146
- markdown = "";
147
-
148
- const tabs = [...self.querySelectorAll("label[for]")]
149
- .map((label) => {
150
- const id = label.getAttribute("for");
151
- return [id,self.getElementById(id),label];
152
- });
153
-
154
- const showTab = (targetid) => {
155
- tabs.forEach(([id,el,label]) => {
156
- if(id===targetid || self.varsProxy[`${id}Pinned`]) {
157
- el.style.display = "unset";
158
- } else if(!self.varsProxy[`${id}Pinned`]) {
159
- el.style.display = "none";
160
- }
161
- });
162
- };
163
-
164
- const hideTab = (targetid) => {
165
- tabs.forEach(([id,el,label]) => {
166
- if(id===targetid) el.style.display = "none";
167
- });
168
- };
169
-
170
- onTabClick = (event) => {
171
- showTab(event.target.getAttribute("for"));
172
- };
173
-
174
- onPinClick = (event) => {
175
- const id = event.target.getAttribute("for"),
176
- checked = self.varsProxy[`${id}Pinned`] = event.target.checked;
177
- if(checked) onTabClick(event);
178
- else hideTab(id);
179
- };
180
-
181
- doSave = async () => {
182
- const parts = url.pathname.split("/");
183
- let dir = "";
184
- parts.shift();parts.pop();
185
- for(const part of parts) {
186
- dir = dir + "/" + part;
187
- try {
188
- await fs.mkdir(dir);
189
- } catch(e) {
190
- if(e.message==="EEXIST") break;
191
- throw e;
192
- }
193
- }
194
- fs.writeFile(url.pathname,doPreview(),{encoding:"utf8"},()=>{});
195
- source = `IndexedDB://${url.hostname+"_repl"}${url.pathname}`;
196
- };
197
-
198
- doReset = async () => {
199
- try {
200
- await fs.unlink(url.pathname);
201
- } catch(e) {
202
-
203
- }
204
- if(src) {
205
- try {
206
- parseFullHTML(await loadFromServer());
207
- doPreview();
208
- } catch(e) {
209
- previewEl.innerHTML = fullHTML = e.message;
210
- }
211
- } else {
212
- bodyhtml = "";
213
- headhtml = "";
214
- scriptText = "";
215
- cssText = "";
216
- previewEl.innerHTML = "";
217
- }
218
- };
219
-
220
- const doPreview = () => {
221
- // not quite write, createComponent needs to be reworked to handle a head and import its links
222
- const template = document.createElement("template");
223
- template.innerHTML = bodyhtmlEl.value + "<style>" + cssText + "</style>" + '<script type="lightview/module">' + scriptText + "<" + "/script>";
224
- const component = window.customElements.get("x-preview");
225
- if(component) { component.setTemplateNode(template); }
226
- else { Lightview.createComponent("x-preview",template); }
227
- previewEl.innerHTML = "<x-preview></x-preview>";
228
- return "<html><head>"+headhtml+"</head><body>"+template.innerHTML+"<body></html>"
229
- };
230
-
231
- const wysywigEl = self.getElementById("wysiwyg"),
232
- markdownEl = self.getElementById("markdown"),
233
- bodyhtmlEl = self.getElementById("bodyhtml"),
234
- headhtmlEl = self.getElementById("headhtml"),
235
- tabsEl = self.getElementById("tabs"),
236
- styleEl = self.getElementById("style"),
237
- previewEl = self.getElementById("preview");
238
-
239
- let prevmarkdown; // prevents indirect recursion
240
- observe(() => {
241
- const text = turndownService.turndown(bodyhtml).trim();
242
- if(text && text!==prevtext) {
243
- markdown = markdownEl.innerHTML = prevmarkdown = text;
244
- }
245
- });
246
-
247
- let prevbodyhtml; // prevents indirect recursion
248
- observe(() => {
249
- const html = marked.parse(markdown).trim();
250
- if(html && html!==prevbodyhtml) {
251
- bodyhtml = bodyhtmlEl.innerText = prevbodyhtml = html;
252
- }
253
- });
254
-
255
- const initEditor = () => {
256
-
257
- };
258
-
259
- self.addEventListener("connected",() => {
260
- initEditor();
261
- doPreview();
262
- });
263
- </script>
264
- </template>
265
- <script src="../../lightview.js"></script>
266
- </head>
267
- <body style="min-height:95vh;">
268
- <script>Lightview.createComponent("l-repl", document.getElementById("repl"));</script>
269
- <l-repl style="min-height:95vh" src="../../examples/counter.html"><div id="editor" slot="editor" style="border:solid 1px;max-height:85vh;max-width:740px;overflow:auto;margin-bottom:5px;padding-left:10px;resize:both"></div></l-repl>
270
- <script type="module">
271
- //import {Sup} from "./sup.js";
272
- import createGenericInlineTool,{ItalicInlineTool, UnderlineInlineTool, StrongInlineTool} from "./editorjs-inline-tool/index.js";
273
-
274
- const LinkToolToolbox = LinkTool.toolbox;
275
- Object.defineProperty(LinkTool,"toolbox",{get() { return {...LinkToolToolbox,title:"Link With Preview"}}});
276
- const InlineImageToolbox = InlineImage.toolbox;
277
- Object.defineProperty(InlineImage,"toolbox",{get() { return {...InlineImageToolbox,title:"Inline Image"}}});
278
- const editorjsCodeflaskToolbox = editorjsCodeflask.toolbox;
279
- Object.defineProperty(editorjsCodeflask,"toolbox",{get() { return {...editorjsCodeflaskToolbox,title:"Code"}}});
280
-
281
- const editor = new EditorJS({
282
- /**
283
- * Id of Element that should contain the Editor
284
- */
285
- holder: "editor",
286
-
287
- /**
288
- * Available Tools list.
289
- * Pass Tool's class or Settings object for each Tool you want to use
290
- */
291
- tools: {
292
- header: Header,
293
- list: List,
294
- table: Table,
295
- embed: Embed,
296
- linkWithPreview: LinkTool,
297
- image: {
298
- class: InlineImage,
299
- inlineToolbar: true,
300
- config: {
301
- embed: {
302
- display: true,
303
- },
304
- unsplash: {
305
- appName: 'Lightview',
306
- clientId: 'nRe-dHABvjv2shxyvDFQd3Y9MPni77qBG9ImAVH0wig'
307
- }
308
- }
309
- },
310
- imageGallery: ImageGallery,
311
- sup: {
312
- class: createGenericInlineTool({
313
- sanitize: { sup: {} },
314
- shortcut: "CMD+^",
315
- tagName:"SUP",
316
- toolboxIcon: '<i class="fa fa-superscript"></i>'
317
- })
318
- },
319
- sub: {
320
- class: createGenericInlineTool({
321
- sanitize: { sub: {} },
322
- shortcut: "CMD+SHIFT+^",
323
- tagName:"SUB",
324
- toolboxIcon: '<i class="fa fa-subscript"></i>'
325
- })
326
- },
327
- code: {
328
- class: createGenericInlineTool({
329
- sanitize: { code: {} },
330
- tagName:"CODE",
331
- toolboxIcon: '<i class="fa fa-code"></i>'
332
- })
333
- },
334
- gist: Gist,
335
- precode: editorjsCodeflask,
336
- i: ItalicInlineTool,
337
- u: UnderlineInlineTool,
338
- tooltip: {
339
- class: Tooltip,
340
- config: {
341
- location: 'left',
342
- highlightColor: '#FFEFD5',
343
- underline: true,
344
- backgroundColor: '#154360',
345
- textColor: '#FDFEFE',
346
- holder: 'editor',
347
- }
348
- }
349
- //strong: StrongInlineTool, redundant with bold, which really needs to be replaced
350
- // https://github.com/hata6502/editorjs-style use as a base for input fields editor
351
- },
352
- })
353
- </script>
354
- </body>
355
- </html>