@portabletext/toolbar 2.0.9 → 2.0.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.
- package/dist/index.d.cts +509 -361
- package/dist/index.d.ts +509 -361
- package/package.json +4 -3
package/dist/index.d.cts
CHANGED
|
@@ -1,227 +1,522 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import {
|
|
2
|
+
AnnotationPath,
|
|
3
|
+
AnnotationSchemaType,
|
|
4
|
+
BlockObjectSchemaType,
|
|
5
|
+
BlockPath,
|
|
6
|
+
ChildPath,
|
|
7
|
+
DecoratorDefinition,
|
|
8
|
+
DecoratorSchemaType,
|
|
9
|
+
InlineObjectSchemaType,
|
|
10
|
+
ListSchemaType,
|
|
11
|
+
PortableTextObject,
|
|
12
|
+
StyleSchemaType,
|
|
13
|
+
} from '@portabletext/editor'
|
|
14
|
+
import {InsertPlacement} from '@portabletext/editor/behaviors'
|
|
15
|
+
import type {KeyboardShortcut} from '@portabletext/keyboard-shortcuts'
|
|
16
|
+
import type {RefObject} from 'react'
|
|
17
|
+
|
|
18
|
+
declare type ActiveContext = {
|
|
19
|
+
annotations: Array<{
|
|
20
|
+
value: PortableTextObject
|
|
21
|
+
schemaType: ToolbarAnnotationSchemaType
|
|
22
|
+
at: AnnotationPath
|
|
23
|
+
}>
|
|
24
|
+
elementRef: RefObject<Element | null>
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
declare type ActiveContext_2 = {
|
|
28
|
+
blockObjects: Array<{
|
|
29
|
+
value: PortableTextObject
|
|
30
|
+
schemaType: ToolbarBlockObjectSchemaType
|
|
31
|
+
at: BlockPath
|
|
32
|
+
}>
|
|
33
|
+
elementRef: RefObject<Element | null>
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
declare type ActiveContext_3 = {
|
|
37
|
+
inlineObjects: Array<{
|
|
38
|
+
value: PortableTextObject
|
|
39
|
+
schemaType: ToolbarInlineObjectSchemaType
|
|
40
|
+
at: ChildPath
|
|
41
|
+
}>
|
|
42
|
+
elementRef: RefObject<Element | null>
|
|
43
|
+
}
|
|
44
|
+
|
|
12
45
|
/**
|
|
13
46
|
* @beta
|
|
14
47
|
*/
|
|
15
|
-
type
|
|
48
|
+
export declare type AnnotationButton = {
|
|
49
|
+
snapshot: {
|
|
50
|
+
matches: (
|
|
51
|
+
state:
|
|
52
|
+
| 'disabled'
|
|
53
|
+
| 'enabled'
|
|
54
|
+
| {
|
|
55
|
+
disabled: 'inactive'
|
|
56
|
+
}
|
|
57
|
+
| {
|
|
58
|
+
disabled: 'active'
|
|
59
|
+
}
|
|
60
|
+
| {
|
|
61
|
+
enabled: 'inactive'
|
|
62
|
+
}
|
|
63
|
+
| {
|
|
64
|
+
enabled: {
|
|
65
|
+
inactive: 'idle'
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
| {
|
|
69
|
+
enabled: {
|
|
70
|
+
inactive: 'showing dialog'
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
| {
|
|
74
|
+
enabled: 'active'
|
|
75
|
+
},
|
|
76
|
+
) => boolean
|
|
77
|
+
}
|
|
78
|
+
send: (event: AnnotationButtonEvent) => void
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
/**
|
|
82
|
+
* @beta
|
|
83
|
+
*/
|
|
84
|
+
export declare type AnnotationButtonEvent =
|
|
85
|
+
| {
|
|
86
|
+
type: 'close dialog'
|
|
87
|
+
}
|
|
88
|
+
| {
|
|
89
|
+
type: 'open dialog'
|
|
90
|
+
}
|
|
91
|
+
| {
|
|
92
|
+
type: 'add'
|
|
93
|
+
annotation: {
|
|
94
|
+
value: Record<string, unknown>
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
| {
|
|
98
|
+
type: 'remove'
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* @beta
|
|
103
|
+
*/
|
|
104
|
+
export declare type AnnotationPopover = {
|
|
105
|
+
snapshot: {
|
|
106
|
+
context: ActiveContext
|
|
107
|
+
matches: (
|
|
108
|
+
state:
|
|
109
|
+
| 'disabled'
|
|
110
|
+
| 'enabled'
|
|
111
|
+
| {
|
|
112
|
+
enabled: 'inactive' | 'active'
|
|
113
|
+
},
|
|
114
|
+
) => boolean
|
|
115
|
+
}
|
|
116
|
+
send: (event: AnnotationPopoverEvent) => void
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
/**
|
|
120
|
+
* @beta
|
|
121
|
+
*/
|
|
122
|
+
export declare type AnnotationPopoverEvent =
|
|
123
|
+
| {
|
|
124
|
+
type: 'remove'
|
|
125
|
+
schemaType: AnnotationSchemaType
|
|
126
|
+
}
|
|
127
|
+
| {
|
|
128
|
+
type: 'edit'
|
|
129
|
+
at: AnnotationPath
|
|
130
|
+
props: {
|
|
131
|
+
[key: string]: unknown
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
| {
|
|
135
|
+
type: 'close'
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
/**
|
|
139
|
+
* @beta
|
|
140
|
+
*/
|
|
141
|
+
export declare type BlockObjectButton = {
|
|
142
|
+
snapshot: {
|
|
143
|
+
matches: (
|
|
144
|
+
state:
|
|
145
|
+
| 'disabled'
|
|
146
|
+
| 'enabled'
|
|
147
|
+
| {
|
|
148
|
+
enabled: 'idle'
|
|
149
|
+
}
|
|
150
|
+
| {
|
|
151
|
+
enabled: 'showing dialog'
|
|
152
|
+
},
|
|
153
|
+
) => boolean
|
|
154
|
+
}
|
|
155
|
+
send: (event: BlockObjectButtonEvent) => void
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
/**
|
|
159
|
+
* @beta
|
|
160
|
+
*/
|
|
161
|
+
export declare type BlockObjectButtonEvent =
|
|
162
|
+
| {
|
|
163
|
+
type: 'close dialog'
|
|
164
|
+
}
|
|
165
|
+
| {
|
|
166
|
+
type: 'open dialog'
|
|
167
|
+
}
|
|
168
|
+
| {
|
|
169
|
+
type: 'insert'
|
|
170
|
+
value: {
|
|
171
|
+
[key: string]: unknown
|
|
172
|
+
}
|
|
173
|
+
placement: InsertPlacement | undefined
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
/**
|
|
177
|
+
* @beta
|
|
178
|
+
*/
|
|
179
|
+
export declare type BlockObjectPopover = {
|
|
180
|
+
snapshot: {
|
|
181
|
+
context: ActiveContext_2
|
|
182
|
+
matches: (
|
|
183
|
+
state:
|
|
184
|
+
| 'disabled'
|
|
185
|
+
| 'enabled'
|
|
186
|
+
| {
|
|
187
|
+
enabled: 'inactive' | 'active'
|
|
188
|
+
},
|
|
189
|
+
) => boolean
|
|
190
|
+
}
|
|
191
|
+
send: (event: BlockObjectPopoverEvent) => void
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
/**
|
|
195
|
+
* @beta
|
|
196
|
+
*/
|
|
197
|
+
export declare type BlockObjectPopoverEvent =
|
|
198
|
+
| {
|
|
199
|
+
type: 'remove'
|
|
200
|
+
at: BlockPath
|
|
201
|
+
}
|
|
202
|
+
| {
|
|
203
|
+
type: 'edit'
|
|
204
|
+
at: BlockPath
|
|
205
|
+
props: {
|
|
206
|
+
[key: string]: unknown
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
| {
|
|
210
|
+
type: 'close'
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
/**
|
|
214
|
+
* @beta
|
|
215
|
+
*/
|
|
216
|
+
export declare type DecoratorButton = {
|
|
217
|
+
snapshot: {
|
|
218
|
+
matches: (
|
|
219
|
+
state:
|
|
220
|
+
| 'disabled'
|
|
221
|
+
| 'enabled'
|
|
222
|
+
| {
|
|
223
|
+
disabled: 'inactive'
|
|
224
|
+
}
|
|
225
|
+
| {
|
|
226
|
+
disabled: 'active'
|
|
227
|
+
}
|
|
228
|
+
| {
|
|
229
|
+
enabled: 'inactive'
|
|
230
|
+
}
|
|
231
|
+
| {
|
|
232
|
+
enabled: 'active'
|
|
233
|
+
},
|
|
234
|
+
) => boolean
|
|
235
|
+
}
|
|
236
|
+
send: (event: DecoratorButtonEvent) => void
|
|
237
|
+
}
|
|
238
|
+
|
|
16
239
|
/**
|
|
17
240
|
* @beta
|
|
18
241
|
*/
|
|
19
|
-
type
|
|
242
|
+
export declare type DecoratorButtonEvent = {
|
|
243
|
+
type: 'toggle'
|
|
244
|
+
}
|
|
245
|
+
|
|
20
246
|
/**
|
|
21
247
|
* @beta
|
|
22
248
|
*/
|
|
23
|
-
type
|
|
249
|
+
export declare type ExtendAnnotationSchemaType = (
|
|
250
|
+
annotation: AnnotationSchemaType,
|
|
251
|
+
) => ToolbarAnnotationSchemaType
|
|
252
|
+
|
|
24
253
|
/**
|
|
25
254
|
* @beta
|
|
26
255
|
*/
|
|
27
|
-
type
|
|
256
|
+
export declare type ExtendBlockObjectSchemaType = (
|
|
257
|
+
blockObject: BlockObjectSchemaType,
|
|
258
|
+
) => ToolbarBlockObjectSchemaType
|
|
259
|
+
|
|
28
260
|
/**
|
|
29
261
|
* @beta
|
|
30
|
-
* Extend the editor's schema with default values, icons, shortcuts and more.
|
|
31
|
-
* This makes it easier to use the schema to render toolbars, forms and other
|
|
32
|
-
* UI components.
|
|
33
262
|
*/
|
|
34
|
-
declare
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
extendBlockObject?: (blockObject: BlockObjectSchemaType) => ToolbarBlockObjectSchemaType;
|
|
39
|
-
extendInlineObject?: (inlineObject: InlineObjectSchemaType) => ToolbarInlineObjectSchemaType;
|
|
40
|
-
extendStyle?: (style: StyleSchemaType) => ToolbarStyleSchemaType;
|
|
41
|
-
}): ToolbarSchema;
|
|
263
|
+
export declare type ExtendDecoratorSchemaType = (
|
|
264
|
+
decorator: DecoratorSchemaType,
|
|
265
|
+
) => ToolbarDecoratorSchemaType
|
|
266
|
+
|
|
42
267
|
/**
|
|
43
268
|
* @beta
|
|
44
269
|
*/
|
|
45
|
-
type
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
blockObjects?: ReadonlyArray<ToolbarBlockObjectSchemaType>;
|
|
50
|
-
inlineObjects?: ReadonlyArray<ToolbarInlineObjectSchemaType>;
|
|
51
|
-
styles?: ReadonlyArray<ToolbarStyleSchemaType>;
|
|
52
|
-
};
|
|
270
|
+
export declare type ExtendInlineObjectSchemaType = (
|
|
271
|
+
inlineObject: InlineObjectSchemaType,
|
|
272
|
+
) => ToolbarInlineObjectSchemaType
|
|
273
|
+
|
|
53
274
|
/**
|
|
54
275
|
* @beta
|
|
55
276
|
*/
|
|
56
|
-
type
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
};
|
|
277
|
+
export declare type ExtendListSchemaType = (
|
|
278
|
+
list: ListSchemaType,
|
|
279
|
+
) => ToolbarListSchemaType
|
|
280
|
+
|
|
61
281
|
/**
|
|
62
282
|
* @beta
|
|
63
283
|
*/
|
|
64
|
-
type
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
};
|
|
284
|
+
export declare type ExtendStyleSchemaType = (
|
|
285
|
+
style: StyleSchemaType,
|
|
286
|
+
) => ToolbarStyleSchemaType
|
|
287
|
+
|
|
69
288
|
/**
|
|
70
289
|
* @beta
|
|
71
290
|
*/
|
|
72
|
-
type
|
|
73
|
-
|
|
74
|
-
|
|
291
|
+
export declare type HistoryButtons = {
|
|
292
|
+
snapshot: {
|
|
293
|
+
matches: (state: 'disabled' | 'enabled') => boolean
|
|
294
|
+
}
|
|
295
|
+
send: (event: HistoryButtonsEvent) => void
|
|
296
|
+
}
|
|
297
|
+
|
|
75
298
|
/**
|
|
76
299
|
* @beta
|
|
77
300
|
*/
|
|
78
|
-
type
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
301
|
+
export declare type HistoryButtonsEvent =
|
|
302
|
+
| {
|
|
303
|
+
type: 'history.undo'
|
|
304
|
+
}
|
|
305
|
+
| {
|
|
306
|
+
type: 'history.redo'
|
|
307
|
+
}
|
|
308
|
+
|
|
83
309
|
/**
|
|
84
310
|
* @beta
|
|
85
311
|
*/
|
|
86
|
-
type
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
312
|
+
export declare type InlineObjectButton = {
|
|
313
|
+
snapshot: {
|
|
314
|
+
matches: (
|
|
315
|
+
state:
|
|
316
|
+
| 'disabled'
|
|
317
|
+
| 'enabled'
|
|
318
|
+
| {
|
|
319
|
+
enabled: 'idle'
|
|
320
|
+
}
|
|
321
|
+
| {
|
|
322
|
+
enabled: 'showing dialog'
|
|
323
|
+
},
|
|
324
|
+
) => boolean
|
|
325
|
+
}
|
|
326
|
+
send: (event: InlineObjectButtonEvent) => void
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
/**
|
|
330
|
+
* @beta
|
|
331
|
+
*/
|
|
332
|
+
export declare type InlineObjectButtonEvent =
|
|
333
|
+
| {
|
|
334
|
+
type: 'close dialog'
|
|
335
|
+
}
|
|
336
|
+
| {
|
|
337
|
+
type: 'open dialog'
|
|
338
|
+
}
|
|
339
|
+
| {
|
|
340
|
+
type: 'insert'
|
|
341
|
+
value: {
|
|
342
|
+
[key: string]: unknown
|
|
343
|
+
}
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
/**
|
|
347
|
+
* @beta
|
|
348
|
+
*/
|
|
349
|
+
export declare type InlineObjectPopover = {
|
|
350
|
+
snapshot: {
|
|
351
|
+
context: ActiveContext_3
|
|
352
|
+
matches: (
|
|
353
|
+
state:
|
|
354
|
+
| 'disabled'
|
|
355
|
+
| 'enabled'
|
|
356
|
+
| {
|
|
357
|
+
enabled: 'inactive' | 'active'
|
|
358
|
+
},
|
|
359
|
+
) => boolean
|
|
360
|
+
}
|
|
361
|
+
send: (event: InlineObjectPopoverEvent) => void
|
|
362
|
+
}
|
|
363
|
+
|
|
364
|
+
/**
|
|
365
|
+
* @beta
|
|
366
|
+
*/
|
|
367
|
+
export declare type InlineObjectPopoverEvent =
|
|
368
|
+
| {
|
|
369
|
+
type: 'remove'
|
|
370
|
+
at: ChildPath
|
|
371
|
+
}
|
|
372
|
+
| {
|
|
373
|
+
type: 'edit'
|
|
374
|
+
at: ChildPath
|
|
375
|
+
props: {
|
|
376
|
+
[key: string]: unknown
|
|
377
|
+
}
|
|
378
|
+
}
|
|
379
|
+
| {
|
|
380
|
+
type: 'close'
|
|
381
|
+
}
|
|
382
|
+
|
|
383
|
+
/**
|
|
384
|
+
* @beta
|
|
385
|
+
*/
|
|
386
|
+
export declare type ListButton = {
|
|
387
|
+
snapshot: {
|
|
388
|
+
matches: (
|
|
389
|
+
state:
|
|
390
|
+
| 'disabled'
|
|
391
|
+
| 'enabled'
|
|
392
|
+
| {
|
|
393
|
+
disabled: 'inactive'
|
|
394
|
+
}
|
|
395
|
+
| {
|
|
396
|
+
disabled: 'active'
|
|
397
|
+
}
|
|
398
|
+
| {
|
|
399
|
+
enabled: 'inactive'
|
|
400
|
+
}
|
|
401
|
+
| {
|
|
402
|
+
enabled: 'active'
|
|
403
|
+
},
|
|
404
|
+
) => boolean
|
|
405
|
+
}
|
|
406
|
+
send: (event: ListButtonEvent) => void
|
|
407
|
+
}
|
|
408
|
+
|
|
409
|
+
/**
|
|
410
|
+
* @beta
|
|
411
|
+
*/
|
|
412
|
+
export declare type ListButtonEvent = {
|
|
413
|
+
type: 'toggle'
|
|
414
|
+
}
|
|
415
|
+
|
|
416
|
+
/**
|
|
417
|
+
* @beta
|
|
418
|
+
*/
|
|
419
|
+
export declare type StyleSelector = {
|
|
420
|
+
snapshot: {
|
|
421
|
+
matches: (state: 'disabled' | 'enabled') => boolean
|
|
422
|
+
context: {
|
|
423
|
+
activeStyle: StyleSchemaType['name'] | undefined
|
|
424
|
+
}
|
|
425
|
+
}
|
|
426
|
+
send: (event: StyleSelectorEvent) => void
|
|
427
|
+
}
|
|
428
|
+
|
|
91
429
|
/**
|
|
92
430
|
* @beta
|
|
93
431
|
*/
|
|
94
|
-
type
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
}
|
|
432
|
+
export declare type StyleSelectorEvent = {
|
|
433
|
+
type: 'toggle'
|
|
434
|
+
style: StyleSchemaType['name']
|
|
435
|
+
}
|
|
436
|
+
|
|
98
437
|
/**
|
|
99
438
|
* @beta
|
|
100
439
|
*/
|
|
101
|
-
type
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
annotation: {
|
|
108
|
-
value: Record<string, unknown>;
|
|
109
|
-
};
|
|
110
|
-
} | {
|
|
111
|
-
type: 'remove';
|
|
112
|
-
};
|
|
440
|
+
export declare type ToolbarAnnotationSchemaType = AnnotationSchemaType & {
|
|
441
|
+
icon?: React.ComponentType
|
|
442
|
+
defaultValues?: Record<string, unknown>
|
|
443
|
+
shortcut?: KeyboardShortcut
|
|
444
|
+
}
|
|
445
|
+
|
|
113
446
|
/**
|
|
114
447
|
* @beta
|
|
115
448
|
*/
|
|
116
|
-
type
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
} | {
|
|
123
|
-
enabled: 'inactive';
|
|
124
|
-
} | {
|
|
125
|
-
enabled: {
|
|
126
|
-
inactive: 'idle';
|
|
127
|
-
};
|
|
128
|
-
} | {
|
|
129
|
-
enabled: {
|
|
130
|
-
inactive: 'showing dialog';
|
|
131
|
-
};
|
|
132
|
-
} | {
|
|
133
|
-
enabled: 'active';
|
|
134
|
-
}) => boolean;
|
|
135
|
-
};
|
|
136
|
-
send: (event: AnnotationButtonEvent) => void;
|
|
137
|
-
};
|
|
449
|
+
export declare type ToolbarBlockObjectSchemaType = BlockObjectSchemaType & {
|
|
450
|
+
icon?: React.ComponentType
|
|
451
|
+
defaultValues?: Record<string, unknown>
|
|
452
|
+
shortcut?: KeyboardShortcut
|
|
453
|
+
}
|
|
454
|
+
|
|
138
455
|
/**
|
|
139
456
|
* @beta
|
|
140
|
-
* Manages the state, keyboard shortcut and available events for an annotation
|
|
141
|
-
* button.
|
|
142
|
-
*
|
|
143
|
-
* Note: This hook assumes that the button triggers a dialog for inputting
|
|
144
|
-
* the annotation value.
|
|
145
457
|
*/
|
|
146
|
-
declare
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
schemaType: ToolbarAnnotationSchemaType;
|
|
153
|
-
at: AnnotationPath;
|
|
154
|
-
}>;
|
|
155
|
-
elementRef: RefObject<Element | null>;
|
|
156
|
-
};
|
|
458
|
+
export declare type ToolbarDecoratorSchemaType = DecoratorSchemaType & {
|
|
459
|
+
icon?: React.ComponentType
|
|
460
|
+
shortcut?: KeyboardShortcut
|
|
461
|
+
mutuallyExclusive?: ReadonlyArray<DecoratorDefinition['name']>
|
|
462
|
+
}
|
|
463
|
+
|
|
157
464
|
/**
|
|
158
465
|
* @beta
|
|
159
466
|
*/
|
|
160
|
-
type
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
props: {
|
|
167
|
-
[key: string]: unknown;
|
|
168
|
-
};
|
|
169
|
-
} | {
|
|
170
|
-
type: 'close';
|
|
171
|
-
};
|
|
467
|
+
export declare type ToolbarInlineObjectSchemaType = InlineObjectSchemaType & {
|
|
468
|
+
icon?: React.ComponentType
|
|
469
|
+
defaultValues?: Record<string, unknown>
|
|
470
|
+
shortcut?: KeyboardShortcut
|
|
471
|
+
}
|
|
472
|
+
|
|
172
473
|
/**
|
|
173
474
|
* @beta
|
|
174
475
|
*/
|
|
175
|
-
type
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
enabled: 'inactive' | 'active';
|
|
180
|
-
}) => boolean;
|
|
181
|
-
};
|
|
182
|
-
send: (event: AnnotationPopoverEvent) => void;
|
|
183
|
-
};
|
|
476
|
+
export declare type ToolbarListSchemaType = ListSchemaType & {
|
|
477
|
+
icon?: React.ComponentType
|
|
478
|
+
}
|
|
479
|
+
|
|
184
480
|
/**
|
|
185
481
|
* @beta
|
|
186
|
-
* Manages the state and available events for an annotation popover.
|
|
187
482
|
*/
|
|
188
|
-
declare
|
|
189
|
-
|
|
190
|
-
|
|
483
|
+
export declare type ToolbarSchema = {
|
|
484
|
+
decorators?: ReadonlyArray<ToolbarDecoratorSchemaType>
|
|
485
|
+
annotations?: ReadonlyArray<ToolbarAnnotationSchemaType>
|
|
486
|
+
lists?: ReadonlyArray<ToolbarListSchemaType>
|
|
487
|
+
blockObjects?: ReadonlyArray<ToolbarBlockObjectSchemaType>
|
|
488
|
+
inlineObjects?: ReadonlyArray<ToolbarInlineObjectSchemaType>
|
|
489
|
+
styles?: ReadonlyArray<ToolbarStyleSchemaType>
|
|
490
|
+
}
|
|
491
|
+
|
|
191
492
|
/**
|
|
192
493
|
* @beta
|
|
193
494
|
*/
|
|
194
|
-
type
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
495
|
+
export declare type ToolbarStyleSchemaType = StyleSchemaType & {
|
|
496
|
+
icon?: React.ComponentType
|
|
497
|
+
shortcut?: KeyboardShortcut
|
|
498
|
+
}
|
|
499
|
+
|
|
198
500
|
/**
|
|
199
501
|
* @beta
|
|
502
|
+
* Manages the state, keyboard shortcut and available events for an annotation
|
|
503
|
+
* button.
|
|
504
|
+
*
|
|
505
|
+
* Note: This hook assumes that the button triggers a dialog for inputting
|
|
506
|
+
* the annotation value.
|
|
200
507
|
*/
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
} | {
|
|
206
|
-
type: 'insert';
|
|
207
|
-
value: {
|
|
208
|
-
[key: string]: unknown;
|
|
209
|
-
};
|
|
210
|
-
placement: InsertPlacement | undefined;
|
|
211
|
-
};
|
|
508
|
+
export declare function useAnnotationButton(props: {
|
|
509
|
+
schemaType: ToolbarAnnotationSchemaType
|
|
510
|
+
}): AnnotationButton
|
|
511
|
+
|
|
212
512
|
/**
|
|
213
513
|
* @beta
|
|
514
|
+
* Manages the state and available events for an annotation popover.
|
|
214
515
|
*/
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
} | {
|
|
220
|
-
enabled: 'showing dialog';
|
|
221
|
-
}) => boolean;
|
|
222
|
-
};
|
|
223
|
-
send: (event: BlockObjectButtonEvent) => void;
|
|
224
|
-
};
|
|
516
|
+
export declare function useAnnotationPopover(props: {
|
|
517
|
+
schemaTypes: ReadonlyArray<ToolbarAnnotationSchemaType>
|
|
518
|
+
}): AnnotationPopover
|
|
519
|
+
|
|
225
520
|
/**
|
|
226
521
|
* @beta
|
|
227
522
|
* Manages the state, keyboard shortcut and available events for a block
|
|
@@ -230,129 +525,32 @@ type BlockObjectButton = {
|
|
|
230
525
|
* Note: This hook assumes that the button triggers a dialog for inputting
|
|
231
526
|
* the block object value.
|
|
232
527
|
*/
|
|
233
|
-
declare function useBlockObjectButton(props: {
|
|
234
|
-
schemaType: ToolbarBlockObjectSchemaType
|
|
235
|
-
}): BlockObjectButton
|
|
236
|
-
|
|
237
|
-
blockObjects: Array<{
|
|
238
|
-
value: PortableTextObject;
|
|
239
|
-
schemaType: ToolbarBlockObjectSchemaType;
|
|
240
|
-
at: BlockPath;
|
|
241
|
-
}>;
|
|
242
|
-
elementRef: RefObject<Element | null>;
|
|
243
|
-
};
|
|
244
|
-
/**
|
|
245
|
-
* @beta
|
|
246
|
-
*/
|
|
247
|
-
type BlockObjectPopoverEvent = {
|
|
248
|
-
type: 'remove';
|
|
249
|
-
at: BlockPath;
|
|
250
|
-
} | {
|
|
251
|
-
type: 'edit';
|
|
252
|
-
at: BlockPath;
|
|
253
|
-
props: {
|
|
254
|
-
[key: string]: unknown;
|
|
255
|
-
};
|
|
256
|
-
} | {
|
|
257
|
-
type: 'close';
|
|
258
|
-
};
|
|
259
|
-
/**
|
|
260
|
-
* @beta
|
|
261
|
-
*/
|
|
262
|
-
type BlockObjectPopover = {
|
|
263
|
-
snapshot: {
|
|
264
|
-
context: ActiveContext$1;
|
|
265
|
-
matches: (state: 'disabled' | 'enabled' | {
|
|
266
|
-
enabled: 'inactive' | 'active';
|
|
267
|
-
}) => boolean;
|
|
268
|
-
};
|
|
269
|
-
send: (event: BlockObjectPopoverEvent) => void;
|
|
270
|
-
};
|
|
528
|
+
export declare function useBlockObjectButton(props: {
|
|
529
|
+
schemaType: ToolbarBlockObjectSchemaType
|
|
530
|
+
}): BlockObjectButton
|
|
531
|
+
|
|
271
532
|
/**
|
|
272
533
|
* @beta
|
|
273
534
|
* Manages the state and available events for a block object popover.
|
|
274
535
|
*/
|
|
275
|
-
declare function useBlockObjectPopover(props: {
|
|
276
|
-
schemaTypes: ReadonlyArray<ToolbarBlockObjectSchemaType
|
|
277
|
-
}): BlockObjectPopover
|
|
278
|
-
|
|
279
|
-
* @beta
|
|
280
|
-
*/
|
|
281
|
-
type DecoratorButtonEvent = {
|
|
282
|
-
type: 'toggle';
|
|
283
|
-
};
|
|
284
|
-
/**
|
|
285
|
-
* @beta
|
|
286
|
-
*/
|
|
287
|
-
type DecoratorButton = {
|
|
288
|
-
snapshot: {
|
|
289
|
-
matches: (state: 'disabled' | 'enabled' | {
|
|
290
|
-
disabled: 'inactive';
|
|
291
|
-
} | {
|
|
292
|
-
disabled: 'active';
|
|
293
|
-
} | {
|
|
294
|
-
enabled: 'inactive';
|
|
295
|
-
} | {
|
|
296
|
-
enabled: 'active';
|
|
297
|
-
}) => boolean;
|
|
298
|
-
};
|
|
299
|
-
send: (event: DecoratorButtonEvent) => void;
|
|
300
|
-
};
|
|
536
|
+
export declare function useBlockObjectPopover(props: {
|
|
537
|
+
schemaTypes: ReadonlyArray<ToolbarBlockObjectSchemaType>
|
|
538
|
+
}): BlockObjectPopover
|
|
539
|
+
|
|
301
540
|
/**
|
|
302
541
|
* @beta
|
|
303
542
|
* Manages the state, keyboard shortcuts and available events for a decorator
|
|
304
543
|
* button and sets up mutually exclusive decorator behaviors.
|
|
305
544
|
*/
|
|
306
|
-
declare function useDecoratorButton(props: {
|
|
307
|
-
schemaType: ToolbarDecoratorSchemaType
|
|
308
|
-
}): DecoratorButton
|
|
309
|
-
|
|
310
|
-
* @beta
|
|
311
|
-
*/
|
|
312
|
-
type HistoryButtonsEvent = {
|
|
313
|
-
type: 'history.undo';
|
|
314
|
-
} | {
|
|
315
|
-
type: 'history.redo';
|
|
316
|
-
};
|
|
317
|
-
/**
|
|
318
|
-
* @beta
|
|
319
|
-
*/
|
|
320
|
-
type HistoryButtons = {
|
|
321
|
-
snapshot: {
|
|
322
|
-
matches: (state: 'disabled' | 'enabled') => boolean;
|
|
323
|
-
};
|
|
324
|
-
send: (event: HistoryButtonsEvent) => void;
|
|
325
|
-
};
|
|
326
|
-
/**
|
|
327
|
-
* @beta
|
|
328
|
-
*/
|
|
329
|
-
declare function useHistoryButtons(): HistoryButtons;
|
|
330
|
-
/**
|
|
331
|
-
* @beta
|
|
332
|
-
*/
|
|
333
|
-
type InlineObjectButtonEvent = {
|
|
334
|
-
type: 'close dialog';
|
|
335
|
-
} | {
|
|
336
|
-
type: 'open dialog';
|
|
337
|
-
} | {
|
|
338
|
-
type: 'insert';
|
|
339
|
-
value: {
|
|
340
|
-
[key: string]: unknown;
|
|
341
|
-
};
|
|
342
|
-
};
|
|
545
|
+
export declare function useDecoratorButton(props: {
|
|
546
|
+
schemaType: ToolbarDecoratorSchemaType
|
|
547
|
+
}): DecoratorButton
|
|
548
|
+
|
|
343
549
|
/**
|
|
344
550
|
* @beta
|
|
345
551
|
*/
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
matches: (state: 'disabled' | 'enabled' | {
|
|
349
|
-
enabled: 'idle';
|
|
350
|
-
} | {
|
|
351
|
-
enabled: 'showing dialog';
|
|
352
|
-
}) => boolean;
|
|
353
|
-
};
|
|
354
|
-
send: (event: InlineObjectButtonEvent) => void;
|
|
355
|
-
};
|
|
552
|
+
export declare function useHistoryButtons(): HistoryButtons
|
|
553
|
+
|
|
356
554
|
/**
|
|
357
555
|
* @beta
|
|
358
556
|
* Manages the state, keyboard shortcut and available events for an inline
|
|
@@ -361,106 +559,56 @@ type InlineObjectButton = {
|
|
|
361
559
|
* Note: This hook assumes that the button triggers a dialog for inputting
|
|
362
560
|
* the inline object value.
|
|
363
561
|
*/
|
|
364
|
-
declare function useInlineObjectButton(props: {
|
|
365
|
-
schemaType: ToolbarInlineObjectSchemaType
|
|
366
|
-
}): InlineObjectButton
|
|
367
|
-
|
|
368
|
-
inlineObjects: Array<{
|
|
369
|
-
value: PortableTextObject;
|
|
370
|
-
schemaType: ToolbarInlineObjectSchemaType;
|
|
371
|
-
at: ChildPath;
|
|
372
|
-
}>;
|
|
373
|
-
elementRef: RefObject<Element | null>;
|
|
374
|
-
};
|
|
375
|
-
/**
|
|
376
|
-
* @beta
|
|
377
|
-
*/
|
|
378
|
-
type InlineObjectPopoverEvent = {
|
|
379
|
-
type: 'remove';
|
|
380
|
-
at: ChildPath;
|
|
381
|
-
} | {
|
|
382
|
-
type: 'edit';
|
|
383
|
-
at: ChildPath;
|
|
384
|
-
props: {
|
|
385
|
-
[key: string]: unknown;
|
|
386
|
-
};
|
|
387
|
-
} | {
|
|
388
|
-
type: 'close';
|
|
389
|
-
};
|
|
390
|
-
/**
|
|
391
|
-
* @beta
|
|
392
|
-
*/
|
|
393
|
-
type InlineObjectPopover = {
|
|
394
|
-
snapshot: {
|
|
395
|
-
context: ActiveContext;
|
|
396
|
-
matches: (state: 'disabled' | 'enabled' | {
|
|
397
|
-
enabled: 'inactive' | 'active';
|
|
398
|
-
}) => boolean;
|
|
399
|
-
};
|
|
400
|
-
send: (event: InlineObjectPopoverEvent) => void;
|
|
401
|
-
};
|
|
562
|
+
export declare function useInlineObjectButton(props: {
|
|
563
|
+
schemaType: ToolbarInlineObjectSchemaType
|
|
564
|
+
}): InlineObjectButton
|
|
565
|
+
|
|
402
566
|
/**
|
|
403
567
|
* @beta
|
|
404
568
|
* Manages the state and available events for an inline object popover.
|
|
405
569
|
*/
|
|
406
|
-
declare function useInlineObjectPopover(props: {
|
|
407
|
-
schemaTypes: ReadonlyArray<ToolbarInlineObjectSchemaType
|
|
408
|
-
}): InlineObjectPopover
|
|
409
|
-
|
|
410
|
-
* @beta
|
|
411
|
-
*/
|
|
412
|
-
type ListButtonEvent = {
|
|
413
|
-
type: 'toggle';
|
|
414
|
-
};
|
|
415
|
-
/**
|
|
416
|
-
* @beta
|
|
417
|
-
*/
|
|
418
|
-
type ListButton = {
|
|
419
|
-
snapshot: {
|
|
420
|
-
matches: (state: 'disabled' | 'enabled' | {
|
|
421
|
-
disabled: 'inactive';
|
|
422
|
-
} | {
|
|
423
|
-
disabled: 'active';
|
|
424
|
-
} | {
|
|
425
|
-
enabled: 'inactive';
|
|
426
|
-
} | {
|
|
427
|
-
enabled: 'active';
|
|
428
|
-
}) => boolean;
|
|
429
|
-
};
|
|
430
|
-
send: (event: ListButtonEvent) => void;
|
|
431
|
-
};
|
|
570
|
+
export declare function useInlineObjectPopover(props: {
|
|
571
|
+
schemaTypes: ReadonlyArray<ToolbarInlineObjectSchemaType>
|
|
572
|
+
}): InlineObjectPopover
|
|
573
|
+
|
|
432
574
|
/**
|
|
433
575
|
* @beta
|
|
434
576
|
* Manages the state, keyboard shortcuts and available events for a list button.
|
|
435
577
|
*/
|
|
436
|
-
declare function useListButton(props: {
|
|
437
|
-
schemaType: ToolbarListSchemaType
|
|
438
|
-
}): ListButton
|
|
439
|
-
|
|
440
|
-
* @beta
|
|
441
|
-
*/
|
|
442
|
-
type StyleSelectorEvent = {
|
|
443
|
-
type: 'toggle';
|
|
444
|
-
style: StyleSchemaType['name'];
|
|
445
|
-
};
|
|
578
|
+
export declare function useListButton(props: {
|
|
579
|
+
schemaType: ToolbarListSchemaType
|
|
580
|
+
}): ListButton
|
|
581
|
+
|
|
446
582
|
/**
|
|
447
583
|
* @beta
|
|
584
|
+
* Manages the state, keyboard shortcuts and available events for a style
|
|
585
|
+
* selector.
|
|
448
586
|
*/
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
activeStyle: StyleSchemaType['name'] | undefined;
|
|
454
|
-
};
|
|
455
|
-
};
|
|
456
|
-
send: (event: StyleSelectorEvent) => void;
|
|
457
|
-
};
|
|
587
|
+
export declare function useStyleSelector(props: {
|
|
588
|
+
schemaTypes: ReadonlyArray<ToolbarStyleSchemaType>
|
|
589
|
+
}): StyleSelector
|
|
590
|
+
|
|
458
591
|
/**
|
|
459
592
|
* @beta
|
|
460
|
-
*
|
|
461
|
-
*
|
|
593
|
+
* Extend the editor's schema with default values, icons, shortcuts and more.
|
|
594
|
+
* This makes it easier to use the schema to render toolbars, forms and other
|
|
595
|
+
* UI components.
|
|
462
596
|
*/
|
|
463
|
-
declare function
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
597
|
+
export declare function useToolbarSchema(props: {
|
|
598
|
+
extendDecorator?: (
|
|
599
|
+
decorator: DecoratorSchemaType,
|
|
600
|
+
) => ToolbarDecoratorSchemaType
|
|
601
|
+
extendAnnotation?: (
|
|
602
|
+
annotation: AnnotationSchemaType,
|
|
603
|
+
) => ToolbarAnnotationSchemaType
|
|
604
|
+
extendList?: (list: ListSchemaType) => ToolbarListSchemaType
|
|
605
|
+
extendBlockObject?: (
|
|
606
|
+
blockObject: BlockObjectSchemaType,
|
|
607
|
+
) => ToolbarBlockObjectSchemaType
|
|
608
|
+
extendInlineObject?: (
|
|
609
|
+
inlineObject: InlineObjectSchemaType,
|
|
610
|
+
) => ToolbarInlineObjectSchemaType
|
|
611
|
+
extendStyle?: (style: StyleSchemaType) => ToolbarStyleSchemaType
|
|
612
|
+
}): ToolbarSchema
|
|
613
|
+
|
|
614
|
+
export {}
|