@quillmark/svelte 0.14.0 → 0.16.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.
- package/dist/core/codec/field.d.ts +0 -10
- package/dist/core/codec/field.js +11 -25
- package/dist/core/codec/prose.css +4 -10
- package/dist/core/index.d.ts +0 -1
- package/dist/core/index.js +4 -7
- package/dist/core/theme.css +6 -6
- package/dist/preset/index.css +1 -1
- package/dist/preview/index.js +2 -4
- package/dist/visual/Field.svelte +1 -6
- package/dist/visual/ObjectField.svelte +0 -6
- package/dist/visual/ProseField.svelte +0 -9
- package/dist/visual/ProseField.svelte.d.ts +0 -4
- package/dist/visual/ProseValue.svelte +3 -8
- package/dist/visual/ProseValue.svelte.d.ts +2 -5
- package/dist/visual/TextField.svelte +2 -11
- package/dist/visual/TextField.svelte.d.ts +0 -3
- package/dist/visual/VisualEditorInner.svelte +0 -2
- package/dist/visual/controls.css +1 -1
- package/dist/visual/index.js +2 -4
- package/dist/visual/structure.d.ts +7 -23
- package/dist/visual/structure.js +8 -37
- package/package.json +2 -2
|
@@ -75,11 +75,6 @@ export interface CreateFieldOpts {
|
|
|
75
75
|
* emptied it holds an empty answer, which prints empty. Absent, the placeholder
|
|
76
76
|
* returns whenever the leaf is empty. */
|
|
77
77
|
placeholderUntilEdit?: boolean;
|
|
78
|
-
/** Ghost text shown on the empty leaf until its first edit: an unset field's
|
|
79
|
-
* `example:`, at rest where there is no placeholder and in the placeholder's stead
|
|
80
|
-
* while the leaf holds the focus. The initial value; {@link FieldController.setExample}
|
|
81
|
-
* moves it after mount. */
|
|
82
|
-
example?: string;
|
|
83
78
|
onFocus?(addr: Addr): void;
|
|
84
79
|
/** Fired with the new USV caret after an edit or a selection move. */
|
|
85
80
|
onCaretMove?(addr: Addr, pos: number): void;
|
|
@@ -117,9 +112,6 @@ export interface FieldController {
|
|
|
117
112
|
* a transaction would fire `onCaretMove` at a moment the caret did not move.
|
|
118
113
|
*/
|
|
119
114
|
setPlaceholder(text: string | undefined): void;
|
|
120
|
-
/** Move the example ghost after mount, the way {@link setPlaceholder} moves the
|
|
121
|
-
* other one. */
|
|
122
|
-
setExample(text: string | undefined): void;
|
|
123
115
|
/** Move the default an unset leaf holds after mount: a retype or a quill swap
|
|
124
116
|
* re-seats an unset leaf on the new kind's default, and leaves a written one be. */
|
|
125
117
|
setFallback(content: Content | undefined): void;
|
|
@@ -219,7 +211,5 @@ export declare function proseLeafPlugins(schema: Schema, opts: {
|
|
|
219
211
|
placeholder?: () => string | undefined;
|
|
220
212
|
/** {@link CreateFieldOpts.placeholderUntilEdit}. */
|
|
221
213
|
placeholderUntilEdit?: boolean;
|
|
222
|
-
/** The focused leaf's ghost, read live for the same reason. */
|
|
223
|
-
example?: () => string | undefined;
|
|
224
214
|
afterHistory?: Plugin[];
|
|
225
215
|
}): Plugin[];
|
package/dist/core/codec/field.js
CHANGED
|
@@ -146,10 +146,9 @@ export function createField(opts) {
|
|
|
146
146
|
const reconciler = createReconciler(shown());
|
|
147
147
|
let index; // rebuilt on every structural change
|
|
148
148
|
let view;
|
|
149
|
-
// The
|
|
150
|
-
//
|
|
149
|
+
// The ghost's live cell: the ghost plugin reads it per pass, so moving it is an
|
|
150
|
+
// assignment plus a re-render rather than a rebuilt plugin stack.
|
|
151
151
|
let placeholderText = opts.placeholder;
|
|
152
|
-
let exampleText = opts.example;
|
|
153
152
|
// The views nested inside this leaf: one per table cell (`table-view.ts`). The
|
|
154
153
|
// leaf holds the set because chrome asks the leaf, not the island, which view
|
|
155
154
|
// holds the caret: the format popover raises over a cell exactly as over the
|
|
@@ -269,7 +268,6 @@ export function createField(opts) {
|
|
|
269
268
|
// given one later; the plugin draws nothing while the text is empty.
|
|
270
269
|
placeholder: () => placeholderText,
|
|
271
270
|
placeholderUntilEdit: opts.placeholderUntilEdit,
|
|
272
|
-
example: () => exampleText,
|
|
273
271
|
afterHistory: [anchorPlugin(seededAnchors)]
|
|
274
272
|
})
|
|
275
273
|
});
|
|
@@ -418,12 +416,6 @@ export function createField(opts) {
|
|
|
418
416
|
// transaction, so nothing commits and no caret is reported.
|
|
419
417
|
view.setProps({});
|
|
420
418
|
},
|
|
421
|
-
setExample(text) {
|
|
422
|
-
if (text === exampleText)
|
|
423
|
-
return;
|
|
424
|
-
exampleText = text;
|
|
425
|
-
view.setProps({});
|
|
426
|
-
},
|
|
427
419
|
setFallback(content) {
|
|
428
420
|
if (content === fallback || (content && fallback && contentEqual(content, fallback)))
|
|
429
421
|
return;
|
|
@@ -533,7 +525,7 @@ export function proseLeafPlugins(schema, opts) {
|
|
|
533
525
|
list.push(gapCursor(), pastAtomPlugin(), islandPastePlugin());
|
|
534
526
|
if (schema === plainSchema)
|
|
535
527
|
list.push(plainClipboardPlugin());
|
|
536
|
-
if (opts.placeholder
|
|
528
|
+
if (opts.placeholder)
|
|
537
529
|
list.push(ghostPlugin(opts));
|
|
538
530
|
return list;
|
|
539
531
|
}
|
|
@@ -590,18 +582,16 @@ function pastAtomPlugin() {
|
|
|
590
582
|
});
|
|
591
583
|
}
|
|
592
584
|
/**
|
|
593
|
-
* The empty leaf's
|
|
594
|
-
* class and the ghost text, which `prose.css` draws from the
|
|
585
|
+
* The empty leaf's ghost. A node decoration stamps the sole empty textblock with a
|
|
586
|
+
* class and the ghost text, which `prose.css` draws from the attribute: so the text
|
|
595
587
|
* never enters the document, the caret path, or a `pmToContent` export, and it
|
|
596
588
|
* vanishes the instant the leaf holds any content (the emptiness test fails).
|
|
597
589
|
*
|
|
598
|
-
* `
|
|
599
|
-
*
|
|
600
|
-
*
|
|
601
|
-
* under `placeholderUntilEdit`. An inline leaf's
|
|
602
|
-
* ghost keeps to the one line the leaf is (`qm-prose-placeholder-line`).
|
|
590
|
+
* Under `placeholderUntilEdit` it is stamped only until the state's first edit, after
|
|
591
|
+
* which the leaf has been answered. An inline leaf's ghost keeps to the one line the
|
|
592
|
+
* leaf is (`qm-prose-placeholder-line`).
|
|
603
593
|
*
|
|
604
|
-
* The
|
|
594
|
+
* The text is read per decoration pass rather than closed over, so moving the ghost is
|
|
605
595
|
* a re-render and never a document edit.
|
|
606
596
|
*/
|
|
607
597
|
function ghostPlugin(opts) {
|
|
@@ -616,8 +606,7 @@ function ghostPlugin(opts) {
|
|
|
616
606
|
decorations(state) {
|
|
617
607
|
const edited = key.getState(state);
|
|
618
608
|
const text = edited && opts.placeholderUntilEdit ? undefined : opts.placeholder?.();
|
|
619
|
-
|
|
620
|
-
if (!text && !example)
|
|
609
|
+
if (!text)
|
|
621
610
|
return null;
|
|
622
611
|
const { doc } = state;
|
|
623
612
|
const first = doc.firstChild;
|
|
@@ -629,10 +618,7 @@ function ghostPlugin(opts) {
|
|
|
629
618
|
? 'qm-prose-placeholder qm-prose-placeholder-line'
|
|
630
619
|
: 'qm-prose-placeholder'
|
|
631
620
|
};
|
|
632
|
-
|
|
633
|
-
attrs['data-placeholder'] = text;
|
|
634
|
-
if (example)
|
|
635
|
-
attrs['data-example'] = example;
|
|
621
|
+
attrs['data-placeholder'] = text;
|
|
636
622
|
return DecorationSet.create(doc, [Decoration.node(0, first.nodeSize, attrs)]);
|
|
637
623
|
}
|
|
638
624
|
}
|
|
@@ -196,21 +196,19 @@ li.ProseMirror-selectednode::after {
|
|
|
196
196
|
}
|
|
197
197
|
|
|
198
198
|
/* The empty leaf's ghost (`field.ts`, `ghostPlugin`): a node decoration's data
|
|
199
|
-
|
|
199
|
+
attribute, so the text stays out of the document. At the rung every control's
|
|
200
200
|
placeholder takes; the italic is what a leaf with no written neighbour has instead
|
|
201
201
|
of the step to `ink`.
|
|
202
202
|
|
|
203
203
|
After the empty line rather than before it, and pulled up one line box onto it: the
|
|
204
204
|
caret keeps the start of that line, and a ghost's lines past the first grow the
|
|
205
205
|
leaf rather than hang over what follows it. A block leaf's ghost wraps and keeps the
|
|
206
|
-
breaks it was written with, a
|
|
207
|
-
leaf's keeps to the one line the leaf is.
|
|
208
|
-
is no placeholder, and stands in for the placeholder while the leaf holds the focus.
|
|
206
|
+
breaks it was written with, a body `default:` being a document's worth; an inline
|
|
207
|
+
leaf's keeps to the one line the leaf is.
|
|
209
208
|
|
|
210
209
|
Drawn only where there is text to draw: an empty box pulled up a line would take
|
|
211
210
|
the empty line with it. */
|
|
212
|
-
.ProseMirror .qm-prose-placeholder[data-placeholder]::after
|
|
213
|
-
.ProseMirror .qm-prose-placeholder[data-example]::after {
|
|
211
|
+
.ProseMirror .qm-prose-placeholder[data-placeholder]::after {
|
|
214
212
|
content: attr(data-placeholder);
|
|
215
213
|
display: block;
|
|
216
214
|
margin-top: -1lh;
|
|
@@ -219,10 +217,6 @@ li.ProseMirror-selectednode::after {
|
|
|
219
217
|
font-style: italic;
|
|
220
218
|
pointer-events: none;
|
|
221
219
|
}
|
|
222
|
-
.ProseMirror .qm-prose-placeholder[data-example]:not([data-placeholder])::after,
|
|
223
|
-
.ProseMirror-focused .qm-prose-placeholder[data-example]::after {
|
|
224
|
-
content: attr(data-example);
|
|
225
|
-
}
|
|
226
220
|
.ProseMirror .qm-prose-placeholder.qm-prose-placeholder-line::after {
|
|
227
221
|
white-space: nowrap;
|
|
228
222
|
overflow: hidden;
|
package/dist/core/index.d.ts
CHANGED
package/dist/core/index.js
CHANGED
|
@@ -1,10 +1,3 @@
|
|
|
1
|
-
// The theme derivation: the public dials → the private `--_qm-*` scale, applied
|
|
2
|
-
// to every `data-qm-root` element (THEMING.md). Imported at every barrel a
|
|
3
|
-
// consumer can enter through — here, `/visual`, `/preview` — because a subpath is
|
|
4
|
-
// what a consumer gets, and a surface reaching a module inside `core/` reaches
|
|
5
|
-
// nothing this file imports. One sheet however many barrels name it: the
|
|
6
|
-
// derivation is minted once rather than re-declared per detached root.
|
|
7
|
-
import './theme.css';
|
|
8
1
|
// `@quillmark/svelte/core`: what this package owns at the substrate seam.
|
|
9
2
|
//
|
|
10
3
|
// The `@quillmark/wasm` API is not re-exported: import it straight from the peer
|
|
@@ -14,6 +7,10 @@ import './theme.css';
|
|
|
14
7
|
// here. What earns a line is what more than one surface speaks and no other
|
|
15
8
|
// package declares: the address vocabulary and the error channel, plus the WASM
|
|
16
9
|
// init gate.
|
|
10
|
+
//
|
|
11
|
+
// No stylesheet: a host reaches this entry where there is no document (a worker,
|
|
12
|
+
// a server), and a dev server serves a side-effect sheet as a module that writes a
|
|
13
|
+
// `<style>` into one. The surface barrels carry the theme; `check:deps` holds it.
|
|
17
14
|
export { init } from './lifecycle.js';
|
|
18
15
|
// The hop between that vocabulary and the `Addr` the document verbs take, both
|
|
19
16
|
// directions: a host handed a path by a hook and holding a mutator needs it.
|
package/dist/core/theme.css
CHANGED
|
@@ -4,8 +4,8 @@
|
|
|
4
4
|
geometry, type and motion are all derived here, so each is minted in one place
|
|
5
5
|
instead of once per detached root.
|
|
6
6
|
|
|
7
|
-
Transport: a stylesheet, side-effect imported by
|
|
8
|
-
every element marked `data-qm-root`. The package imports it itself, so there is
|
|
7
|
+
Transport: a stylesheet, side-effect imported by each surface barrel and applied
|
|
8
|
+
to every element marked `data-qm-root`. The package imports it itself, so there is
|
|
9
9
|
no `import './theme.css'` for a consumer to forget. A stylesheet rather than an
|
|
10
10
|
inline `style` attribute is what buys the three things an attribute cannot
|
|
11
11
|
carry: a selector consumer CSS outranks without `!important`, real properties
|
|
@@ -164,12 +164,12 @@
|
|
|
164
164
|
stacked on one. */
|
|
165
165
|
--_qm-border-faint: color-mix(in oklab, var(--_qm-bg), var(--_qm-border) 50%);
|
|
166
166
|
/* Three rungs, and nothing under the last: a step below `label` lands under 3:1 on
|
|
167
|
-
the well a field draws it against, and what would take it — an
|
|
168
|
-
|
|
167
|
+
the well a field draws it against, and what would take it — an unset value's word,
|
|
168
|
+
an invitation — is content a reader has to read (WCAG 1.4.3), not decoration.
|
|
169
169
|
`ink` is written. `default` is the resolved `default:` drawn as the value it
|
|
170
170
|
prints: near enough to `ink` to read as an answer, a step off it so it never
|
|
171
|
-
reads as a written one. `label` is words about a value rather than the value —
|
|
172
|
-
`
|
|
171
|
+
reads as a written one. `label` is words about a value rather than the value —
|
|
172
|
+
`None`, a format hint, an invitation — and the chrome that names fields; in italic
|
|
173
173
|
where it is a leaf's ghost, which has no written neighbour to be read against. */
|
|
174
174
|
--_qm-ink: var(--_qm-fg);
|
|
175
175
|
--_qm-ink-default: color-mix(in oklab, var(--_qm-fg), var(--_qm-bg) 20%);
|
package/dist/preset/index.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* `@quillmark/svelte/preset`, the package's one CSS entry point: the endorsed look for
|
|
2
2
|
the page a surface is mounted on. Opt-in and side-effect free until imported:
|
|
3
|
-
|
|
3
|
+
the surface barrels pull `core/theme.css` and never this, because this
|
|
4
4
|
styles the document and nothing may put that in a consumer's page uninvited.
|
|
5
5
|
|
|
6
6
|
Two files because one of them is exempt: `scale.css` is where the literals are
|
package/dist/preview/index.js
CHANGED
|
@@ -8,10 +8,8 @@
|
|
|
8
8
|
// module directly in `core/` is what pulls the codec, and all of ProseMirror with it.
|
|
9
9
|
// The theme derivation, which the page slots read through `var()`.
|
|
10
10
|
// Imported at the barrel because a subpath is what a consumer gets: this surface
|
|
11
|
-
// reaches modules inside `core/` and never its entry,
|
|
12
|
-
//
|
|
13
|
-
// sheet rather than the entry, because the barrel needs the derivation and not
|
|
14
|
-
// `init`. `check:deps` holds the reach.
|
|
11
|
+
// reaches modules inside `core/` and never its entry, which carries no sheet.
|
|
12
|
+
// `check:deps` holds the reach.
|
|
15
13
|
import '../core/theme.css';
|
|
16
14
|
export { createPreview } from './controller.js';
|
|
17
15
|
export { default as Preview } from './Preview.svelte';
|
package/dist/visual/Field.svelte
CHANGED
|
@@ -33,7 +33,6 @@
|
|
|
33
33
|
VARIANT_DISCRIMINANT,
|
|
34
34
|
arrayLayout,
|
|
35
35
|
baseType,
|
|
36
|
-
exampleGhost,
|
|
37
36
|
ghostDefault,
|
|
38
37
|
isContainer,
|
|
39
38
|
optionalCell,
|
|
@@ -120,8 +119,7 @@
|
|
|
120
119
|
// which is what a take writes (`ArrayField`).
|
|
121
120
|
// A default that prints stands in the control as the value it is, at the default
|
|
122
121
|
// rung, and the first edit takes it (VISUAL_EDITOR §"The commitment ladder"). Where
|
|
123
|
-
// nothing prints, a control draws words: the `none` an optional cell prints
|
|
124
|
-
// a free-text field's `example:`.
|
|
122
|
+
// nothing prints, a control draws words: the `none` an optional cell prints.
|
|
125
123
|
const ghost = $derived(ghostDefault(provenance));
|
|
126
124
|
const defaultStr = $derived(
|
|
127
125
|
field.control === 'prose' ? titleText(ghost) || undefined : stringifyGhost(ghost)
|
|
@@ -134,7 +132,6 @@
|
|
|
134
132
|
const declared = $derived(printedText(field.schema.default));
|
|
135
133
|
const optional = $derived(optionalCell(field.schema));
|
|
136
134
|
const none = $derived(optional && value == null ? t.strings.optionalGhost : undefined);
|
|
137
|
-
const example = $derived(value == null ? exampleGhost(field.schema) : undefined);
|
|
138
135
|
// A variant resolves as one rung whose value is the whole container, so the
|
|
139
136
|
// discriminant's ghost is that container's own discriminant cell.
|
|
140
137
|
const ghostMember = $derived(
|
|
@@ -288,7 +285,6 @@
|
|
|
288
285
|
fallback={printed ? (ghost as Content) : undefined}
|
|
289
286
|
placeholder={none}
|
|
290
287
|
placeholderUntilEdit
|
|
291
|
-
{example}
|
|
292
288
|
labelledBy={domIds.label}
|
|
293
289
|
{describedBy}
|
|
294
290
|
{leafKey}
|
|
@@ -407,7 +403,6 @@
|
|
|
407
403
|
value={value as string | undefined}
|
|
408
404
|
fallback={declared}
|
|
409
405
|
placeholder={none}
|
|
410
|
-
{example}
|
|
411
406
|
id={domIds.control}
|
|
412
407
|
{describedBy}
|
|
413
408
|
onCommit={onCommitScalar}
|
|
@@ -39,7 +39,6 @@
|
|
|
39
39
|
baseType,
|
|
40
40
|
controlKind,
|
|
41
41
|
declaredContent,
|
|
42
|
-
exampleGhost,
|
|
43
42
|
humanize,
|
|
44
43
|
isContainer,
|
|
45
44
|
mountKey,
|
|
@@ -134,9 +133,6 @@
|
|
|
134
133
|
* cell ghosts nothing, an empty answer printing empty. */
|
|
135
134
|
const noneOf = (key: string, sub: QuillFieldSchema): string | undefined =>
|
|
136
135
|
obj[key] == null && optionalCell(sub) ? t.strings.optionalGhost : undefined;
|
|
137
|
-
/** What an unset free-text cell ghosts where nothing prints ({@link exampleGhost}). */
|
|
138
|
-
const exampleOf = (key: string, sub: QuillFieldSchema): string | undefined =>
|
|
139
|
-
obj[key] == null ? exampleGhost(sub) : undefined;
|
|
140
136
|
/** A scalar cell's `default:` as the text an unset cell holds, where it prints. */
|
|
141
137
|
const textDefault = (sub: QuillFieldSchema): string | undefined => printedText(sub.default);
|
|
142
138
|
/** A content cell's `default:` as the content an unset leaf holds, where it prints. */
|
|
@@ -349,7 +345,6 @@
|
|
|
349
345
|
value={obj[key] as string | undefined}
|
|
350
346
|
fallback={textDefault(sub)}
|
|
351
347
|
placeholder={noneOf(key, sub)}
|
|
352
|
-
example={exampleOf(key, sub)}
|
|
353
348
|
onCommit={(v) => commitProp(key, v)}
|
|
354
349
|
onKey={onCellKey ? (e) => onCellKey(e, key) : undefined}
|
|
355
350
|
/>
|
|
@@ -362,7 +357,6 @@
|
|
|
362
357
|
fallback={contentDefault(sub)}
|
|
363
358
|
plaintext={baseType(sub) === 'plaintext'}
|
|
364
359
|
placeholder={noneOf(key, sub)}
|
|
365
|
-
example={exampleOf(key, sub)}
|
|
366
360
|
{block}
|
|
367
361
|
label={named}
|
|
368
362
|
labelledBy={ids?.label}
|
|
@@ -45,10 +45,6 @@
|
|
|
45
45
|
placeholder?: string;
|
|
46
46
|
/** The placeholder goes at the leaf's first edit (`createField`). */
|
|
47
47
|
placeholderUntilEdit?: boolean;
|
|
48
|
-
/** Ghost shown on the empty leaf until its first edit, and in the placeholder's
|
|
49
|
-
* stead while the leaf holds the focus: an unset field's `example:`
|
|
50
|
-
* (`exampleGhost`). */
|
|
51
|
-
example?: string;
|
|
52
48
|
/** Registry identity, stamped on the DOM node so a remount is visible as one. */
|
|
53
49
|
leafKey: string;
|
|
54
50
|
onFocus?: (addr: Addr) => void;
|
|
@@ -77,7 +73,6 @@
|
|
|
77
73
|
fallback,
|
|
78
74
|
placeholder,
|
|
79
75
|
placeholderUntilEdit,
|
|
80
|
-
example,
|
|
81
76
|
leafKey,
|
|
82
77
|
onFocus,
|
|
83
78
|
onCaretMove,
|
|
@@ -128,7 +123,6 @@
|
|
|
128
123
|
fallback,
|
|
129
124
|
placeholder,
|
|
130
125
|
placeholderUntilEdit,
|
|
131
|
-
example,
|
|
132
126
|
tableStrings: () => t.strings,
|
|
133
127
|
onSlash: (next) => {
|
|
134
128
|
slash = next;
|
|
@@ -156,9 +150,6 @@
|
|
|
156
150
|
$effect(() => {
|
|
157
151
|
controller?.setPlaceholder(placeholder);
|
|
158
152
|
});
|
|
159
|
-
$effect(() => {
|
|
160
|
-
controller?.setExample(example);
|
|
161
|
-
});
|
|
162
153
|
$effect(() => {
|
|
163
154
|
controller?.setFallback(fallback);
|
|
164
155
|
});
|
|
@@ -33,10 +33,6 @@ interface Props {
|
|
|
33
33
|
placeholder?: string;
|
|
34
34
|
/** The placeholder goes at the leaf's first edit (`createField`). */
|
|
35
35
|
placeholderUntilEdit?: boolean;
|
|
36
|
-
/** Ghost shown on the empty leaf until its first edit, and in the placeholder's
|
|
37
|
-
* stead while the leaf holds the focus: an unset field's `example:`
|
|
38
|
-
* (`exampleGhost`). */
|
|
39
|
-
example?: string;
|
|
40
36
|
/** Registry identity, stamped on the DOM node so a remount is visible as one. */
|
|
41
37
|
leafKey: string;
|
|
42
38
|
onFocus?: (addr: Addr) => void;
|
|
@@ -76,12 +76,9 @@
|
|
|
76
76
|
labelledBy?: string;
|
|
77
77
|
/** The parked `description` (FieldLabel) → `aria-describedby`. */
|
|
78
78
|
describedBy?: string;
|
|
79
|
-
/** The empty leaf's
|
|
80
|
-
* `none` an optional cell prints unset
|
|
81
|
-
* placeholder and in its stead while the leaf holds the focus (`createField`'s
|
|
82
|
-
* pair). Read per decoration pass. */
|
|
79
|
+
/** The empty leaf's ghost, a subform cell's, until the leaf's first edit: the
|
|
80
|
+
* `none` an optional cell prints unset. Read per decoration pass. */
|
|
83
81
|
placeholder?: string;
|
|
84
|
-
example?: string;
|
|
85
82
|
onChange: (rt: Content) => void;
|
|
86
83
|
/** Raw keydown, for a container whose own keys run through this leaf: the
|
|
87
84
|
* array repeater's Enter/Backspace (`ArrayField`). Fires before the view's own
|
|
@@ -97,7 +94,6 @@
|
|
|
97
94
|
labelledBy,
|
|
98
95
|
describedBy,
|
|
99
96
|
placeholder,
|
|
100
|
-
example,
|
|
101
97
|
onChange,
|
|
102
98
|
onKey
|
|
103
99
|
}: Props = $props();
|
|
@@ -160,8 +156,7 @@
|
|
|
160
156
|
: proseLeafPlugins(schema, {
|
|
161
157
|
inline,
|
|
162
158
|
placeholder: () => placeholder,
|
|
163
|
-
placeholderUntilEdit: true
|
|
164
|
-
example: () => example
|
|
159
|
+
placeholderUntilEdit: true
|
|
165
160
|
})
|
|
166
161
|
});
|
|
167
162
|
const mounted = new EditorView(
|
|
@@ -25,12 +25,9 @@ interface Props {
|
|
|
25
25
|
labelledBy?: string;
|
|
26
26
|
/** The parked `description` (FieldLabel) → `aria-describedby`. */
|
|
27
27
|
describedBy?: string;
|
|
28
|
-
/** The empty leaf's
|
|
29
|
-
* `none` an optional cell prints unset
|
|
30
|
-
* placeholder and in its stead while the leaf holds the focus (`createField`'s
|
|
31
|
-
* pair). Read per decoration pass. */
|
|
28
|
+
/** The empty leaf's ghost, a subform cell's, until the leaf's first edit: the
|
|
29
|
+
* `none` an optional cell prints unset. Read per decoration pass. */
|
|
32
30
|
placeholder?: string;
|
|
33
|
-
example?: string;
|
|
34
31
|
onChange: (rt: Content) => void;
|
|
35
32
|
/** Raw keydown, for a container whose own keys run through this leaf: the
|
|
36
33
|
* array repeater's Enter/Backspace (`ArrayField`). Fires before the view's own
|
|
@@ -24,9 +24,6 @@
|
|
|
24
24
|
/** Words at rest about an unset field that holds no text: the `None` an optional
|
|
25
25
|
* cell prints. */
|
|
26
26
|
placeholder?: string;
|
|
27
|
-
/** An unset field's `example:` (`exampleGhost`): drawn wherever the field holds no
|
|
28
|
-
* text, and in `placeholder`'s stead while the input holds the focus. */
|
|
29
|
-
example?: string;
|
|
30
27
|
/** Accessible name for an input nothing else names: an array element, whose
|
|
31
28
|
* name is the field label plus its 1-based index. A field's own input takes
|
|
32
29
|
* `id` instead and is named by the `<label for>` beside it. */
|
|
@@ -41,8 +38,7 @@
|
|
|
41
38
|
* array repeater's Enter/Backspace (`ArrayField`). */
|
|
42
39
|
onKey?: (e: KeyboardEvent) => void;
|
|
43
40
|
}
|
|
44
|
-
let { value, fallback, placeholder,
|
|
45
|
-
$props();
|
|
41
|
+
let { value, fallback, placeholder, label, id, describedBy, onCommit, onKey }: Props = $props();
|
|
46
42
|
|
|
47
43
|
// Local input state synced to `value`, or to the default an unset field holds:
|
|
48
44
|
// own-typing stays local, only an external change reconciles back in (see
|
|
@@ -50,9 +46,6 @@
|
|
|
50
46
|
const local = syncedLocal(() => value ?? fallback ?? '');
|
|
51
47
|
const defaulted = $derived(value == null && !!fallback && local.value === fallback);
|
|
52
48
|
|
|
53
|
-
let focused = $state(false);
|
|
54
|
-
const ghost = $derived(focused ? (example ?? placeholder) : (placeholder ?? example));
|
|
55
|
-
|
|
56
49
|
let inputEl: HTMLInputElement | undefined = $state();
|
|
57
50
|
/** Take the caret: what a parent placing focus on this control calls. */
|
|
58
51
|
export function focus(): void {
|
|
@@ -66,13 +59,11 @@
|
|
|
66
59
|
type="text"
|
|
67
60
|
value={local.value}
|
|
68
61
|
{id}
|
|
69
|
-
placeholder
|
|
62
|
+
{placeholder}
|
|
70
63
|
data-default={defaulted ? '' : undefined}
|
|
71
64
|
aria-label={id ? undefined : label}
|
|
72
65
|
aria-describedby={describedBy}
|
|
73
66
|
onkeydown={onKey}
|
|
74
|
-
onfocus={() => (focused = true)}
|
|
75
|
-
onblur={() => (focused = false)}
|
|
76
67
|
oninput={(e) => {
|
|
77
68
|
local.value = (e.currentTarget as HTMLInputElement).value;
|
|
78
69
|
onCommit(local.value !== '' ? local.value : fallback ? '' : undefined);
|
|
@@ -6,9 +6,6 @@ interface Props {
|
|
|
6
6
|
/** Words at rest about an unset field that holds no text: the `None` an optional
|
|
7
7
|
* cell prints. */
|
|
8
8
|
placeholder?: string;
|
|
9
|
-
/** An unset field's `example:` (`exampleGhost`): drawn wherever the field holds no
|
|
10
|
-
* text, and in `placeholder`'s stead while the input holds the focus. */
|
|
11
|
-
example?: string;
|
|
12
9
|
/** Accessible name for an input nothing else names: an array element, whose
|
|
13
10
|
* name is the field label plus its 1-based index. A field's own input takes
|
|
14
11
|
* `id` instead and is named by the `<label for>` beside it. */
|
|
@@ -63,7 +63,6 @@
|
|
|
63
63
|
provenanceMap,
|
|
64
64
|
resolvedByCardIndex,
|
|
65
65
|
ghostDefault,
|
|
66
|
-
declaredGhost,
|
|
67
66
|
titleText,
|
|
68
67
|
resolveBodyGhost,
|
|
69
68
|
NO_RESOLVED_ROWS,
|
|
@@ -612,7 +611,6 @@
|
|
|
612
611
|
bodyGhost: hasBody
|
|
613
612
|
? resolveBodyGhost(
|
|
614
613
|
titleText(ghostDefault(rows.body ?? undefined)) || undefined,
|
|
615
|
-
declaredGhost(cardSchema?.body?.example, true),
|
|
616
614
|
merged.bodyPlaceholder?.({ cardId: id, kind, isMain }),
|
|
617
615
|
merged.bodyGhost
|
|
618
616
|
)
|
package/dist/visual/controls.css
CHANGED
|
@@ -112,7 +112,7 @@
|
|
|
112
112
|
color: var(--_qm-ink-default);
|
|
113
113
|
}
|
|
114
114
|
/* The native placeholder is the label rung, not the UA's own grey: what an input
|
|
115
|
-
ghosts is words about a value it does not hold —
|
|
115
|
+
ghosts is words about a value it does not hold — `None` — which is
|
|
116
116
|
content and reads at a content's contrast, the same step the prose leaf's ghost
|
|
117
117
|
reads (`prose.css`). */
|
|
118
118
|
:where(.qm-input)::placeholder {
|
package/dist/visual/index.js
CHANGED
|
@@ -10,10 +10,8 @@
|
|
|
10
10
|
// that caller arrives, not before.
|
|
11
11
|
// The theme derivation, which every control on this surface reads through `var()`.
|
|
12
12
|
// Imported at the barrel because a subpath is what a consumer gets: this surface
|
|
13
|
-
// reaches modules inside `core/` and never its entry,
|
|
14
|
-
//
|
|
15
|
-
// sheet rather than the entry, because the barrel needs the derivation and not
|
|
16
|
-
// `init`. `check:deps` holds the reach.
|
|
13
|
+
// reaches modules inside `core/` and never its entry, which carries no sheet.
|
|
14
|
+
// `check:deps` holds the reach.
|
|
17
15
|
import '../core/theme.css';
|
|
18
16
|
export { default as VisualEditor } from './VisualEditor.svelte';
|
|
19
17
|
// The prose leaf: the vanilla mount API a non-Svelte consumer (or a custom
|
|
@@ -138,32 +138,23 @@ export interface BodyPlaceholderContext {
|
|
|
138
138
|
*/
|
|
139
139
|
export type BodyPlaceholder = (ctx: BodyPlaceholderContext) => string | undefined;
|
|
140
140
|
/**
|
|
141
|
-
* The empty body's ghost: the resolved body `default:`, else the
|
|
142
|
-
*
|
|
143
|
-
*
|
|
144
|
-
*
|
|
145
|
-
*
|
|
146
|
-
* there is no promise; the quill's own comes first, being the one an agent working
|
|
147
|
-
* from the blueprint sees too.
|
|
141
|
+
* The empty body's ghost: the resolved body `default:`, else the consumer's wording,
|
|
142
|
+
* else the flat built-in. The `default:` wins because it is the only one that
|
|
143
|
+
* describes the render: it promises what prints if nothing is written, and wording
|
|
144
|
+
* placed over it would make that promise unreadable. The rest are invitations, and an
|
|
145
|
+
* invitation belongs only where there is no promise.
|
|
148
146
|
*/
|
|
149
|
-
export declare function resolveBodyGhost(resolvedDefault: string | undefined,
|
|
147
|
+
export declare function resolveBodyGhost(resolvedDefault: string | undefined, custom: string | undefined, builtIn: string): string;
|
|
150
148
|
/** Whether a cell is optional: a `t?` type, which renders `none` unanswered and so
|
|
151
149
|
* never declares a `default:` (canon `SCHEMAS.md` §"Optional cells"). */
|
|
152
150
|
export declare function optionalCell(f: QuillFieldSchema): boolean;
|
|
153
151
|
/** The type a cell's control reads: the declared one, an optional cell's `?` stripped.
|
|
154
152
|
* The `?` moves the render floor and nothing else, so every read of a type is this. */
|
|
155
153
|
export declare function baseType(f: QuillFieldSchema): QuillFieldType;
|
|
156
|
-
/**
|
|
157
|
-
* A value the schema declares, as ghost text: a `default:`, an `example:` or a
|
|
158
|
-
* `body.example`. Markdown — a `richtext` value — ghosts as the text it renders, one
|
|
159
|
-
* block to a line, as a resolved default does ({@link titleText}); anything else as
|
|
160
|
-
* itself. `undefined` for a blank or a non-scalar.
|
|
161
|
-
*/
|
|
162
|
-
export declare function declaredGhost(v: unknown, markdown: boolean): string | undefined;
|
|
163
154
|
/**
|
|
164
155
|
* A scalar `default:` as the text an unset control holds, where it prints: as
|
|
165
156
|
* declared, `undefined` for none, a blank or a non-scalar. A default of spaces prints
|
|
166
|
-
* nothing a reader sees, so a control holds none
|
|
157
|
+
* nothing a reader sees, so a control holds none.
|
|
167
158
|
*/
|
|
168
159
|
export declare function printedText(v: unknown): string | undefined;
|
|
169
160
|
/**
|
|
@@ -174,13 +165,6 @@ export declare function printedText(v: unknown): string | undefined;
|
|
|
174
165
|
* a blank or a non-scalar.
|
|
175
166
|
*/
|
|
176
167
|
export declare function declaredContent(v: unknown, markdown: boolean): Content | undefined;
|
|
177
|
-
/**
|
|
178
|
-
* The `example:` an unset free-text cell ghosts: a `string`, `plaintext` or `richtext`
|
|
179
|
-
* whose `default:` prints nothing. Every other type takes none. A default that prints
|
|
180
|
-
* dominates, standing in the control as the value it is; a type-empty one, the
|
|
181
|
-
* skippable marker, prints nothing and leaves the example the only thing to draw.
|
|
182
|
-
*/
|
|
183
|
-
export declare function exampleGhost(f: QuillFieldSchema): string | undefined;
|
|
184
168
|
/** A field's `{#each}` key: its name and what a mounted leaf reads once, its type and
|
|
185
169
|
* `inline` and its elements'. A retype or a quill swap that changes any of them under a
|
|
186
170
|
* name remounts the field, where a kept leaf would commit on the old schema. */
|
package/dist/visual/structure.js
CHANGED
|
@@ -48,16 +48,14 @@ export function stringifyGhost(ghost) {
|
|
|
48
48
|
return ghost != null && typeof ghost !== 'object' ? String(ghost) : undefined;
|
|
49
49
|
}
|
|
50
50
|
/**
|
|
51
|
-
* The empty body's ghost: the resolved body `default:`, else the
|
|
52
|
-
*
|
|
53
|
-
*
|
|
54
|
-
*
|
|
55
|
-
*
|
|
56
|
-
* there is no promise; the quill's own comes first, being the one an agent working
|
|
57
|
-
* from the blueprint sees too.
|
|
51
|
+
* The empty body's ghost: the resolved body `default:`, else the consumer's wording,
|
|
52
|
+
* else the flat built-in. The `default:` wins because it is the only one that
|
|
53
|
+
* describes the render: it promises what prints if nothing is written, and wording
|
|
54
|
+
* placed over it would make that promise unreadable. The rest are invitations, and an
|
|
55
|
+
* invitation belongs only where there is no promise.
|
|
58
56
|
*/
|
|
59
|
-
export function resolveBodyGhost(resolvedDefault,
|
|
60
|
-
return resolvedDefault ||
|
|
57
|
+
export function resolveBodyGhost(resolvedDefault, custom, builtIn) {
|
|
58
|
+
return resolvedDefault || custom || builtIn;
|
|
61
59
|
}
|
|
62
60
|
/** Whether a cell is optional: a `t?` type, which renders `none` unanswered and so
|
|
63
61
|
* never declares a `default:` (canon `SCHEMAS.md` §"Optional cells"). */
|
|
@@ -69,22 +67,10 @@ export function optionalCell(f) {
|
|
|
69
67
|
export function baseType(f) {
|
|
70
68
|
return (optionalCell(f) ? f.type.slice(0, -1) : f.type);
|
|
71
69
|
}
|
|
72
|
-
/**
|
|
73
|
-
* A value the schema declares, as ghost text: a `default:`, an `example:` or a
|
|
74
|
-
* `body.example`. Markdown — a `richtext` value — ghosts as the text it renders, one
|
|
75
|
-
* block to a line, as a resolved default does ({@link titleText}); anything else as
|
|
76
|
-
* itself. `undefined` for a blank or a non-scalar.
|
|
77
|
-
*/
|
|
78
|
-
export function declaredGhost(v, markdown) {
|
|
79
|
-
const text = stringifyGhost(v)?.trim();
|
|
80
|
-
if (!text)
|
|
81
|
-
return undefined;
|
|
82
|
-
return (markdown ? core().importMarkdown(text).text.trim() : text) || undefined;
|
|
83
|
-
}
|
|
84
70
|
/**
|
|
85
71
|
* A scalar `default:` as the text an unset control holds, where it prints: as
|
|
86
72
|
* declared, `undefined` for none, a blank or a non-scalar. A default of spaces prints
|
|
87
|
-
* nothing a reader sees, so a control holds none
|
|
73
|
+
* nothing a reader sees, so a control holds none.
|
|
88
74
|
*/
|
|
89
75
|
export function printedText(v) {
|
|
90
76
|
const text = stringifyGhost(v);
|
|
@@ -114,21 +100,6 @@ export function declaredContent(v, markdown) {
|
|
|
114
100
|
islands: []
|
|
115
101
|
};
|
|
116
102
|
}
|
|
117
|
-
/**
|
|
118
|
-
* The `example:` an unset free-text cell ghosts: a `string`, `plaintext` or `richtext`
|
|
119
|
-
* whose `default:` prints nothing. Every other type takes none. A default that prints
|
|
120
|
-
* dominates, standing in the control as the value it is; a type-empty one, the
|
|
121
|
-
* skippable marker, prints nothing and leaves the example the only thing to draw.
|
|
122
|
-
*/
|
|
123
|
-
export function exampleGhost(f) {
|
|
124
|
-
const kind = controlKind(f);
|
|
125
|
-
if (kind !== 'text' && kind !== 'prose')
|
|
126
|
-
return undefined;
|
|
127
|
-
const markdown = baseType(f) === 'richtext';
|
|
128
|
-
if (declaredGhost(f.default, markdown) !== undefined)
|
|
129
|
-
return undefined;
|
|
130
|
-
return declaredGhost(f.example, markdown);
|
|
131
|
-
}
|
|
132
103
|
/** A field's `{#each}` key: its name and what a mounted leaf reads once, its type and
|
|
133
104
|
* `inline` and its elements'. A retype or a quill swap that changes any of them under a
|
|
134
105
|
* name remounts the field, where a kept leaf would commit on the old schema. */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@quillmark/svelte",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.16.0",
|
|
4
4
|
"description": "Editor, live-preview and source surfaces over a Quillmark WASM session.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -66,7 +66,7 @@
|
|
|
66
66
|
"check": "svelte-check --tsconfig ./tsconfig.json"
|
|
67
67
|
},
|
|
68
68
|
"peerDependencies": {
|
|
69
|
-
"@quillmark/wasm": ">=0.
|
|
69
|
+
"@quillmark/wasm": ">=0.118.0-0",
|
|
70
70
|
"svelte": "^5.0.0"
|
|
71
71
|
},
|
|
72
72
|
"dependencies": {
|