@sciflow/editor-start 0.0.1-beta → 0.0.2
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.
- package/README.md +83 -2
- package/THIRD_PARTY_LICENSES +9 -0
- package/bin/extract-translations.mjs +54 -0
- package/dist/bundle/sciflow-editor.css +1 -1
- package/dist/bundle/sciflow-editor.js +10590 -15324
- package/dist/index.d.ts +7 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +6 -3
- package/dist/lib/citation-source-adapter.d.ts +22 -2
- package/dist/lib/citation-source-adapter.d.ts.map +1 -1
- package/dist/lib/citation-source-adapter.js +104 -48
- package/dist/lib/drag-preview.d.ts +13 -0
- package/dist/lib/drag-preview.d.ts.map +1 -0
- package/dist/lib/drag-preview.js +43 -0
- package/dist/lib/editor-element.d.ts +30 -4
- package/dist/lib/editor-element.d.ts.map +1 -1
- package/dist/lib/editor-element.js +131 -30
- package/dist/lib/format-bar.d.ts +26 -2
- package/dist/lib/format-bar.d.ts.map +1 -1
- package/dist/lib/format-bar.js +369 -56
- package/dist/lib/ghost-cursor.d.ts +10 -0
- package/dist/lib/ghost-cursor.d.ts.map +1 -0
- package/dist/lib/ghost-cursor.js +59 -0
- package/dist/lib/icons-generated.d.ts +14 -0
- package/dist/lib/icons-generated.d.ts.map +1 -0
- package/dist/lib/icons-generated.js +60 -0
- package/dist/lib/outline.d.ts +18 -10
- package/dist/lib/outline.d.ts.map +1 -1
- package/dist/lib/outline.js +184 -28
- package/dist/lib/reference-list.d.ts +10 -2
- package/dist/lib/reference-list.d.ts.map +1 -1
- package/dist/lib/reference-list.js +47 -9
- package/dist/lib/selection-editor.d.ts +83 -5
- package/dist/lib/selection-editor.d.ts.map +1 -1
- package/dist/lib/selection-editor.js +1225 -147
- package/dist/lib/selection-transform-registry.d.ts +16 -0
- package/dist/lib/selection-transform-registry.d.ts.map +1 -0
- package/dist/lib/selection-transform-registry.js +24 -0
- package/dist/lib/selection-ui-renderer.d.ts +22 -0
- package/dist/lib/selection-ui-renderer.d.ts.map +1 -0
- package/dist/lib/selection-ui-renderer.js +244 -0
- package/dist/lib/selection-widget-host.d.ts +67 -0
- package/dist/lib/selection-widget-host.d.ts.map +1 -0
- package/dist/lib/selection-widget-host.js +151 -0
- package/dist/lib/selection-widget-registry.d.ts +16 -0
- package/dist/lib/selection-widget-registry.d.ts.map +1 -0
- package/dist/lib/selection-widget-registry.js +30 -0
- package/dist/lib/test-fixtures/soak-documents.d.ts +13 -0
- package/dist/lib/test-fixtures/soak-documents.d.ts.map +1 -0
- package/dist/lib/test-fixtures/soak-documents.js +69 -0
- package/dist/tsconfig.lib.tsbuildinfo +1 -1
- package/package.json +22 -13
- package/dist/demo/demo.js +0 -56
- package/dist/demo/index.html +0 -169
- package/dist/lib/citation-drop.d.ts +0 -25
- package/dist/lib/citation-drop.d.ts.map +0 -1
- package/dist/lib/citation-drop.js +0 -53
package/dist/demo/index.html
DELETED
|
@@ -1,169 +0,0 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8" />
|
|
5
|
-
<title>SciFlow Editor – Minimal Demo</title>
|
|
6
|
-
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
7
|
-
<link
|
|
8
|
-
rel="stylesheet"
|
|
9
|
-
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,400,0..1,0"
|
|
10
|
-
/>
|
|
11
|
-
<style>
|
|
12
|
-
:root {
|
|
13
|
-
font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
14
|
-
color: #0f172a;
|
|
15
|
-
background: #f8fafc;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
* {
|
|
19
|
-
box-sizing: border-box;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
body {
|
|
23
|
-
margin: 0;
|
|
24
|
-
min-height: 100vh;
|
|
25
|
-
background: radial-gradient(circle at top, #e0f2fe 0%, #f8fafc 40%, #f8fafc 100%);
|
|
26
|
-
color: inherit;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
main {
|
|
30
|
-
max-width: 1200px;
|
|
31
|
-
margin: 0 auto;
|
|
32
|
-
padding: 32px 24px 64px;
|
|
33
|
-
display: flex;
|
|
34
|
-
flex-direction: column;
|
|
35
|
-
gap: 24px;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
header h1 {
|
|
39
|
-
margin: 0 0 8px;
|
|
40
|
-
font-size: clamp(1.75rem, 3vw, 2.5rem);
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
header p {
|
|
44
|
-
margin: 0;
|
|
45
|
-
max-width: 720px;
|
|
46
|
-
line-height: 1.5;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
code {
|
|
50
|
-
padding: 2px 6px;
|
|
51
|
-
border-radius: 4px;
|
|
52
|
-
background: rgba(15, 23, 42, 0.05);
|
|
53
|
-
font-size: 0.9em;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
.demo-layout {
|
|
57
|
-
display: grid;
|
|
58
|
-
gap: 20px;
|
|
59
|
-
grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr);
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.panel {
|
|
63
|
-
background: white;
|
|
64
|
-
border-radius: 16px;
|
|
65
|
-
padding: 20px;
|
|
66
|
-
box-shadow: 0 10px 30px rgba(15, 23, 42, 0.1);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.editor-panel {
|
|
70
|
-
display: flex;
|
|
71
|
-
flex-direction: column;
|
|
72
|
-
gap: 16px;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
sciflow-editor {
|
|
76
|
-
display: block;
|
|
77
|
-
min-height: 420px;
|
|
78
|
-
border: 1px solid rgba(15, 23, 42, 0.08);
|
|
79
|
-
border-radius: 16px;
|
|
80
|
-
overflow: hidden;
|
|
81
|
-
background: white;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
.toolbar-row {
|
|
85
|
-
display: flex;
|
|
86
|
-
align-items: center;
|
|
87
|
-
gap: 12px;
|
|
88
|
-
flex-wrap: wrap;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.status-pill {
|
|
92
|
-
font-size: 0.9rem;
|
|
93
|
-
padding: 6px 12px;
|
|
94
|
-
border-radius: 999px;
|
|
95
|
-
background: rgba(37, 99, 235, 0.12);
|
|
96
|
-
color: #1d4ed8;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
aside h2 {
|
|
100
|
-
margin-top: 0;
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
pre {
|
|
104
|
-
margin: 12px 0 0;
|
|
105
|
-
padding: 12px;
|
|
106
|
-
background: #0f172a;
|
|
107
|
-
color: #e2e8f0;
|
|
108
|
-
border-radius: 12px;
|
|
109
|
-
min-height: 200px;
|
|
110
|
-
overflow: auto;
|
|
111
|
-
font-size: 0.85rem;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
footer {
|
|
115
|
-
font-size: 0.95rem;
|
|
116
|
-
color: rgba(15, 23, 42, 0.75);
|
|
117
|
-
line-height: 1.6;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
@media (max-width: 960px) {
|
|
121
|
-
.demo-layout {
|
|
122
|
-
grid-template-columns: 1fr;
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
aside {
|
|
126
|
-
order: -1;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
</style>
|
|
130
|
-
</head>
|
|
131
|
-
<body>
|
|
132
|
-
<main>
|
|
133
|
-
<header>
|
|
134
|
-
<h1>SciFlow Editor quick start</h1>
|
|
135
|
-
<p>
|
|
136
|
-
This file ships with the <code>@sciflow/editor-start</code> package so you can validate the bundled custom
|
|
137
|
-
elements without wiring a framework. Run <code>npx nx bundle @sciflow/editor-start</code> (or use the published
|
|
138
|
-
tarball), open this HTML page from <code>dist/demo</code>, and start typing.
|
|
139
|
-
</p>
|
|
140
|
-
</header>
|
|
141
|
-
|
|
142
|
-
<section class="demo-layout">
|
|
143
|
-
<div class="panel editor-panel">
|
|
144
|
-
<div class="toolbar-row">
|
|
145
|
-
<sciflow-formatbar for="demo-editor"></sciflow-formatbar>
|
|
146
|
-
<span class="status-pill" id="demo-status">Loading editor bundle…</span>
|
|
147
|
-
</div>
|
|
148
|
-
<sciflow-editor id="demo-editor" aria-label="SciFlow editor demo"></sciflow-editor>
|
|
149
|
-
</div>
|
|
150
|
-
|
|
151
|
-
<aside class="panel">
|
|
152
|
-
<h2>Live document JSON</h2>
|
|
153
|
-
<p>
|
|
154
|
-
The script mirrors the payload from <code>editor-change</code> so you can inspect the serialized document and
|
|
155
|
-
reuse the event contract in your integration.
|
|
156
|
-
</p>
|
|
157
|
-
<pre id="doc-json" aria-live="polite">Waiting for the first editor-change event…</pre>
|
|
158
|
-
</aside>
|
|
159
|
-
</section>
|
|
160
|
-
|
|
161
|
-
<footer>
|
|
162
|
-
<strong>Tip:</strong> Inspect the <code>demo.js</code> module next to this file to see how features are configured
|
|
163
|
-
and how to listen for <code>editor-ready</code> / <code>editor-change</code> events using plain web components.
|
|
164
|
-
</footer>
|
|
165
|
-
</main>
|
|
166
|
-
|
|
167
|
-
<script type="module" src="./demo.js"></script>
|
|
168
|
-
</body>
|
|
169
|
-
</html>
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import type { EditorView } from 'prosemirror-view';
|
|
2
|
-
type CitationNode = {
|
|
3
|
-
node: any;
|
|
4
|
-
pos: number;
|
|
5
|
-
};
|
|
6
|
-
/**
|
|
7
|
-
* Find the citation node at or above a document position.
|
|
8
|
-
*/
|
|
9
|
-
export declare const findCitationAtPosition: (view: EditorView, pos: number) => CitationNode | null;
|
|
10
|
-
/**
|
|
11
|
-
* Merge a new citation id into an existing citation node.
|
|
12
|
-
* Replaces the node with updated attrs/content, avoiding nested citations.
|
|
13
|
-
*/
|
|
14
|
-
export declare const mergeCitationWithId: (view: EditorView, target: CitationNode, newId: string) => boolean;
|
|
15
|
-
/**
|
|
16
|
-
* Append a citation id to an encoded source field string, returning the encoded value and items.
|
|
17
|
-
*/
|
|
18
|
-
export declare const appendCitationItem: (encoded: string | null, newId: string) => {
|
|
19
|
-
encoded: string | null;
|
|
20
|
-
items: Array<{
|
|
21
|
-
id: string;
|
|
22
|
-
}>;
|
|
23
|
-
} | null;
|
|
24
|
-
export {};
|
|
25
|
-
//# sourceMappingURL=citation-drop.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"citation-drop.d.ts","sourceRoot":"","sources":["../../src/lib/citation-drop.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAGnD,KAAK,YAAY,GAAG;IAAE,IAAI,EAAE,GAAG,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAE/C;;GAEG;AACH,eAAO,MAAM,sBAAsB,GAAI,MAAM,UAAU,EAAE,KAAK,MAAM,KAAG,YAAY,GAAG,IAYrF,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAC9B,MAAM,UAAU,EAChB,QAAQ,YAAY,EACpB,OAAO,MAAM,KACZ,OA0BF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,kBAAkB,GAC7B,SAAS,MAAM,GAAG,IAAI,EACtB,OAAO,MAAM,KACZ;IAAE,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAAE,GAAG,IAS7D,CAAC"}
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { SourceField } from '@sciflow/editor-core';
|
|
2
|
-
/**
|
|
3
|
-
* Find the citation node at or above a document position.
|
|
4
|
-
*/
|
|
5
|
-
export const findCitationAtPosition = (view, pos) => {
|
|
6
|
-
if (!view || typeof pos !== 'number') {
|
|
7
|
-
return null;
|
|
8
|
-
}
|
|
9
|
-
const $pos = view.state.doc.resolve(pos);
|
|
10
|
-
for (let depth = $pos.depth; depth >= 0; depth--) {
|
|
11
|
-
const node = $pos.node(depth);
|
|
12
|
-
if (node.type.name === 'citation') {
|
|
13
|
-
return { node, pos: $pos.before(depth) };
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
return null;
|
|
17
|
-
};
|
|
18
|
-
/**
|
|
19
|
-
* Merge a new citation id into an existing citation node.
|
|
20
|
-
* Replaces the node with updated attrs/content, avoiding nested citations.
|
|
21
|
-
*/
|
|
22
|
-
export const mergeCitationWithId = (view, target, newId) => {
|
|
23
|
-
if (!view || !target || !newId) {
|
|
24
|
-
return false;
|
|
25
|
-
}
|
|
26
|
-
const result = appendCitationItem(target.node.attrs?.source ?? null, newId);
|
|
27
|
-
if (!result?.encoded) {
|
|
28
|
-
return false;
|
|
29
|
-
}
|
|
30
|
-
const citationType = view.state.schema.nodes.citation;
|
|
31
|
-
if (!citationType) {
|
|
32
|
-
return false;
|
|
33
|
-
}
|
|
34
|
-
const displayText = `[${result.items.map((item) => item?.id).filter(Boolean).join('; ')}]`;
|
|
35
|
-
const textNode = view.state.schema.text(displayText);
|
|
36
|
-
const newNode = citationType.create({ ...target.node.attrs, source: result.encoded }, textNode ? [textNode] : undefined, target.node.marks);
|
|
37
|
-
const tr = view.state.tr.replaceWith(target.pos, target.pos + target.node.nodeSize, newNode);
|
|
38
|
-
view.dispatch(tr);
|
|
39
|
-
return true;
|
|
40
|
-
};
|
|
41
|
-
/**
|
|
42
|
-
* Append a citation id to an encoded source field string, returning the encoded value and items.
|
|
43
|
-
*/
|
|
44
|
-
export const appendCitationItem = (encoded, newId) => {
|
|
45
|
-
if (!newId) {
|
|
46
|
-
return null;
|
|
47
|
-
}
|
|
48
|
-
const items = SourceField.fromString(encoded ?? null) ?? [];
|
|
49
|
-
if (!items.find((item) => item?.id === newId)) {
|
|
50
|
-
items.push({ id: newId });
|
|
51
|
-
}
|
|
52
|
-
return { encoded: SourceField.toString(items), items };
|
|
53
|
-
};
|