@portabletext/toolbar 0.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.
package/dist/index.js ADDED
@@ -0,0 +1,1936 @@
1
+ import { c } from "react/compiler-runtime";
2
+ import { useEditor, useEditorSelector } from "@portabletext/editor";
3
+ import { defineBehavior, raise, effect, forward } from "@portabletext/editor/behaviors";
4
+ import * as selectors from "@portabletext/editor/selectors";
5
+ import { useActor, useActorRef } from "@xstate/react";
6
+ import { fromCallback, setup, assign } from "xstate";
7
+ import * as React from "react";
8
+ import { useEffect } from "react";
9
+ function useToolbarSchema(props) {
10
+ const $ = c(37), editor = useEditor(), schema = useEditorSelector(editor, _temp$1);
11
+ let t0;
12
+ if ($[0] !== props || $[1] !== schema.decorators) {
13
+ let t12;
14
+ $[3] !== props ? (t12 = (decorator) => props.extendDecorator?.(decorator) ?? decorator, $[3] = props, $[4] = t12) : t12 = $[4], t0 = schema.decorators.map(t12), $[0] = props, $[1] = schema.decorators, $[2] = t0;
15
+ } else
16
+ t0 = $[2];
17
+ let t1;
18
+ if ($[5] !== props || $[6] !== schema.annotations) {
19
+ let t22;
20
+ $[8] !== props ? (t22 = (annotation) => props.extendAnnotation?.(annotation) ?? annotation, $[8] = props, $[9] = t22) : t22 = $[9], t1 = schema.annotations.map(t22), $[5] = props, $[6] = schema.annotations, $[7] = t1;
21
+ } else
22
+ t1 = $[7];
23
+ let t2;
24
+ if ($[10] !== props || $[11] !== schema.lists) {
25
+ let t32;
26
+ $[13] !== props ? (t32 = (list) => props.extendList?.(list) ?? list, $[13] = props, $[14] = t32) : t32 = $[14], t2 = schema.lists.map(t32), $[10] = props, $[11] = schema.lists, $[12] = t2;
27
+ } else
28
+ t2 = $[12];
29
+ let t3;
30
+ if ($[15] !== props || $[16] !== schema.blockObjects) {
31
+ let t42;
32
+ $[18] !== props ? (t42 = (blockObject) => props.extendBlockObject?.(blockObject) ?? blockObject, $[18] = props, $[19] = t42) : t42 = $[19], t3 = schema.blockObjects.map(t42), $[15] = props, $[16] = schema.blockObjects, $[17] = t3;
33
+ } else
34
+ t3 = $[17];
35
+ let t4;
36
+ if ($[20] !== props || $[21] !== schema.inlineObjects) {
37
+ let t52;
38
+ $[23] !== props ? (t52 = (inlineObject) => props.extendInlineObject?.(inlineObject) ?? inlineObject, $[23] = props, $[24] = t52) : t52 = $[24], t4 = schema.inlineObjects.map(t52), $[20] = props, $[21] = schema.inlineObjects, $[22] = t4;
39
+ } else
40
+ t4 = $[22];
41
+ let t5;
42
+ if ($[25] !== props || $[26] !== schema.styles) {
43
+ let t62;
44
+ $[28] !== props ? (t62 = (style) => props.extendStyle?.(style) ?? style, $[28] = props, $[29] = t62) : t62 = $[29], t5 = schema.styles.map(t62), $[25] = props, $[26] = schema.styles, $[27] = t5;
45
+ } else
46
+ t5 = $[27];
47
+ let t6;
48
+ return $[30] !== t0 || $[31] !== t1 || $[32] !== t2 || $[33] !== t3 || $[34] !== t4 || $[35] !== t5 ? (t6 = {
49
+ decorators: t0,
50
+ annotations: t1,
51
+ lists: t2,
52
+ blockObjects: t3,
53
+ inlineObjects: t4,
54
+ styles: t5
55
+ }, $[30] = t0, $[31] = t1, $[32] = t2, $[33] = t3, $[34] = t4, $[35] = t5, $[36] = t6) : t6 = $[36], t6;
56
+ }
57
+ function _temp$1(snapshot) {
58
+ return snapshot.context.schema;
59
+ }
60
+ const disableListener = fromCallback(({
61
+ input,
62
+ sendBack
63
+ }) => input.editor.on("*", () => {
64
+ input.editor.getSnapshot().context.readOnly ? sendBack({
65
+ type: "disable"
66
+ }) : sendBack({
67
+ type: "enable"
68
+ });
69
+ }).unsubscribe), activeListener$6 = fromCallback(({
70
+ input,
71
+ sendBack
72
+ }) => input.editor.on("*", () => {
73
+ const snapshot = input.editor.getSnapshot();
74
+ selectors.isActiveAnnotation(input.schemaType.name)(snapshot) ? sendBack({
75
+ type: "set active"
76
+ }) : sendBack({
77
+ type: "set inactive"
78
+ });
79
+ }).unsubscribe), keyboardShortcutRemove = fromCallback(({
80
+ input
81
+ }) => {
82
+ const shortcut = input.schemaType.shortcut;
83
+ if (shortcut)
84
+ return input.editor.registerBehavior({
85
+ behavior: defineBehavior({
86
+ on: "keyboard.keydown",
87
+ guard: ({
88
+ event
89
+ }) => shortcut.guard(event.originEvent),
90
+ actions: [() => [raise({
91
+ type: "annotation.remove",
92
+ annotation: {
93
+ name: input.schemaType.name
94
+ }
95
+ }), effect(() => {
96
+ input.editor.send({
97
+ type: "focus"
98
+ });
99
+ })]]
100
+ })
101
+ });
102
+ }), keyboardShortcutShowInsertDialog = fromCallback(({
103
+ input,
104
+ sendBack
105
+ }) => {
106
+ const shortcut = input.schemaType.shortcut;
107
+ if (shortcut)
108
+ return input.editor.registerBehavior({
109
+ behavior: defineBehavior({
110
+ on: "keyboard.keydown",
111
+ guard: ({
112
+ event
113
+ }) => shortcut.guard(event.originEvent),
114
+ actions: [() => [effect(() => {
115
+ sendBack({
116
+ type: "open dialog"
117
+ });
118
+ })]]
119
+ })
120
+ });
121
+ }), annotationButtonMachine = setup({
122
+ types: {
123
+ context: {},
124
+ input: {},
125
+ events: {}
126
+ },
127
+ actions: {
128
+ "add annotation": ({
129
+ context,
130
+ event
131
+ }) => {
132
+ event.type === "add" && (context.editor.send({
133
+ type: "annotation.add",
134
+ annotation: {
135
+ name: context.schemaType.name,
136
+ value: event.annotation.value
137
+ }
138
+ }), context.editor.send({
139
+ type: "focus"
140
+ }));
141
+ },
142
+ "remove annotation": ({
143
+ context
144
+ }) => {
145
+ context.editor.send({
146
+ type: "annotation.remove",
147
+ annotation: {
148
+ name: context.schemaType.name
149
+ }
150
+ }), context.editor.send({
151
+ type: "focus"
152
+ });
153
+ }
154
+ },
155
+ actors: {
156
+ "active listener": activeListener$6,
157
+ "disable listener": disableListener,
158
+ "keyboard shortcut.remove": keyboardShortcutRemove,
159
+ "keyboard shortcut.show insert dialog": keyboardShortcutShowInsertDialog
160
+ }
161
+ }).createMachine({
162
+ id: "annotation button",
163
+ context: ({
164
+ input
165
+ }) => ({
166
+ editor: input.editor,
167
+ schemaType: input.schemaType
168
+ }),
169
+ invoke: [{
170
+ src: "active listener",
171
+ input: ({
172
+ context
173
+ }) => ({
174
+ editor: context.editor,
175
+ schemaType: context.schemaType
176
+ })
177
+ }, {
178
+ src: "disable listener",
179
+ input: ({
180
+ context
181
+ }) => ({
182
+ editor: context.editor,
183
+ schemaType: context.schemaType
184
+ })
185
+ }],
186
+ initial: "disabled",
187
+ states: {
188
+ disabled: {
189
+ initial: "inactive",
190
+ states: {
191
+ inactive: {
192
+ on: {
193
+ enable: {
194
+ target: "#annotation button.enabled.inactive"
195
+ },
196
+ "set active": {
197
+ target: "active"
198
+ }
199
+ }
200
+ },
201
+ active: {
202
+ on: {
203
+ enable: {
204
+ target: "#annotation button.enabled.active"
205
+ },
206
+ "set inactive": {
207
+ target: "inactive"
208
+ }
209
+ }
210
+ }
211
+ }
212
+ },
213
+ enabled: {
214
+ initial: "inactive",
215
+ states: {
216
+ inactive: {
217
+ initial: "idle",
218
+ on: {
219
+ disable: {
220
+ target: "#annotation button.disabled.inactive"
221
+ },
222
+ "set active": {
223
+ target: "#annotation button.enabled.active"
224
+ },
225
+ add: {
226
+ actions: "add annotation"
227
+ }
228
+ },
229
+ states: {
230
+ idle: {
231
+ invoke: {
232
+ src: "keyboard shortcut.show insert dialog",
233
+ input: ({
234
+ context
235
+ }) => ({
236
+ editor: context.editor,
237
+ schemaType: context.schemaType
238
+ })
239
+ },
240
+ on: {
241
+ "open dialog": {
242
+ target: "showing dialog"
243
+ }
244
+ }
245
+ },
246
+ "showing dialog": {
247
+ on: {
248
+ "close dialog": {
249
+ target: "idle"
250
+ }
251
+ }
252
+ }
253
+ }
254
+ },
255
+ active: {
256
+ invoke: {
257
+ src: "keyboard shortcut.remove",
258
+ input: ({
259
+ context
260
+ }) => ({
261
+ editor: context.editor,
262
+ schemaType: context.schemaType
263
+ })
264
+ },
265
+ on: {
266
+ "set inactive": {
267
+ target: "#annotation button.enabled.inactive"
268
+ },
269
+ disable: {
270
+ target: "#annotation button.disabled.active"
271
+ },
272
+ remove: {
273
+ actions: "remove annotation"
274
+ }
275
+ }
276
+ }
277
+ }
278
+ }
279
+ }
280
+ });
281
+ function useAnnotationButton(props) {
282
+ const $ = c(8), editor = useEditor();
283
+ let t0;
284
+ $[0] !== editor || $[1] !== props.schemaType ? (t0 = {
285
+ input: {
286
+ editor,
287
+ schemaType: props.schemaType
288
+ }
289
+ }, $[0] = editor, $[1] = props.schemaType, $[2] = t0) : t0 = $[2];
290
+ const [snapshot, send] = useActor(annotationButtonMachine, t0);
291
+ let t1;
292
+ $[3] !== snapshot ? (t1 = {
293
+ matches: (state) => snapshot.matches(state)
294
+ }, $[3] = snapshot, $[4] = t1) : t1 = $[4];
295
+ let t2;
296
+ return $[5] !== send || $[6] !== t1 ? (t2 = {
297
+ snapshot: t1,
298
+ send
299
+ }, $[5] = send, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
300
+ }
301
+ const activeListener$5 = fromCallback(({
302
+ input,
303
+ sendBack
304
+ }) => input.editor.on("*", () => {
305
+ const snapshot = input.editor.getSnapshot(), activeAnnotations = selectors.getActiveAnnotations(snapshot), focusBlock = selectors.getFocusBlock(snapshot);
306
+ if (activeAnnotations.length === 0 || !focusBlock) {
307
+ sendBack({
308
+ type: "set inactive"
309
+ });
310
+ return;
311
+ }
312
+ const firstSelectedChild = input.editor.dom.getChildNodes(snapshot).at(0);
313
+ if (!firstSelectedChild || !(firstSelectedChild instanceof Element)) {
314
+ sendBack({
315
+ type: "set inactive"
316
+ });
317
+ return;
318
+ }
319
+ const elementRef = React.createRef();
320
+ elementRef.current = firstSelectedChild, sendBack({
321
+ type: "set active",
322
+ annotations: activeAnnotations.flatMap((annotation) => {
323
+ const schemaType = input.schemaTypes.find((schemaType2) => schemaType2.name === annotation._type);
324
+ return schemaType ? {
325
+ value: annotation,
326
+ schemaType,
327
+ at: [{
328
+ _key: focusBlock.node._key
329
+ }, "markDefs", {
330
+ _key: annotation._key
331
+ }]
332
+ } : [];
333
+ }),
334
+ elementRef
335
+ });
336
+ }).unsubscribe), annotationPopoverMachine = setup({
337
+ types: {
338
+ context: {},
339
+ input: {},
340
+ events: {}
341
+ },
342
+ actions: {
343
+ reset: assign({
344
+ annotations: [],
345
+ elementRef: React.createRef()
346
+ }),
347
+ remove: ({
348
+ context,
349
+ event
350
+ }) => {
351
+ event.type === "remove" && (context.editor.send({
352
+ type: "annotation.remove",
353
+ annotation: {
354
+ name: event.schemaType.name
355
+ }
356
+ }), context.editor.send({
357
+ type: "focus"
358
+ }));
359
+ }
360
+ },
361
+ actors: {
362
+ "disable listener": disableListener,
363
+ "active listener": activeListener$5
364
+ }
365
+ }).createMachine({
366
+ id: "annotation popover",
367
+ context: ({
368
+ input
369
+ }) => ({
370
+ editor: input.editor,
371
+ schemaTypes: input.schemaTypes,
372
+ annotations: [],
373
+ elementRef: React.createRef()
374
+ }),
375
+ invoke: [{
376
+ src: "disable listener",
377
+ input: ({
378
+ context
379
+ }) => ({
380
+ editor: context.editor
381
+ })
382
+ }],
383
+ initial: "disabled",
384
+ states: {
385
+ disabled: {
386
+ initial: "inactive",
387
+ states: {
388
+ inactive: {
389
+ entry: ["reset"],
390
+ on: {
391
+ "set active": {
392
+ actions: assign({
393
+ annotations: ({
394
+ event
395
+ }) => event.annotations,
396
+ elementRef: ({
397
+ event
398
+ }) => event.elementRef
399
+ }),
400
+ target: "active"
401
+ },
402
+ enable: {
403
+ target: "#annotation popover.enabled.inactive"
404
+ }
405
+ }
406
+ },
407
+ active: {
408
+ on: {
409
+ "set inactive": {
410
+ target: "inactive"
411
+ },
412
+ enable: {
413
+ target: "#annotation popover.enabled.active"
414
+ }
415
+ }
416
+ }
417
+ }
418
+ },
419
+ enabled: {
420
+ invoke: [{
421
+ src: "active listener",
422
+ input: ({
423
+ context
424
+ }) => ({
425
+ editor: context.editor,
426
+ schemaTypes: context.schemaTypes
427
+ })
428
+ }],
429
+ initial: "inactive",
430
+ states: {
431
+ inactive: {
432
+ entry: ["reset"],
433
+ on: {
434
+ "set active": {
435
+ target: "active",
436
+ actions: assign({
437
+ annotations: ({
438
+ event
439
+ }) => event.annotations,
440
+ elementRef: ({
441
+ event
442
+ }) => event.elementRef
443
+ })
444
+ },
445
+ disable: {
446
+ target: "#annotation popover.disabled.inactive"
447
+ }
448
+ }
449
+ },
450
+ active: {
451
+ on: {
452
+ "set inactive": {
453
+ target: "inactive"
454
+ },
455
+ disable: {
456
+ target: "#annotation popover.disabled.active"
457
+ },
458
+ "set active": {
459
+ actions: assign({
460
+ annotations: ({
461
+ event
462
+ }) => event.annotations,
463
+ elementRef: ({
464
+ event
465
+ }) => event.elementRef
466
+ })
467
+ },
468
+ edit: {
469
+ actions: ({
470
+ context,
471
+ event
472
+ }) => {
473
+ context.editor.send({
474
+ type: "annotation.set",
475
+ at: event.at,
476
+ props: event.props
477
+ }), context.editor.send({
478
+ type: "focus"
479
+ });
480
+ }
481
+ },
482
+ remove: {
483
+ actions: ({
484
+ context,
485
+ event
486
+ }) => {
487
+ context.editor.send({
488
+ type: "annotation.remove",
489
+ annotation: {
490
+ name: event.schemaType.name
491
+ }
492
+ }), context.editor.send({
493
+ type: "focus"
494
+ });
495
+ }
496
+ },
497
+ close: {
498
+ actions: ({
499
+ context
500
+ }) => {
501
+ context.editor.send({
502
+ type: "focus"
503
+ });
504
+ },
505
+ target: "inactive"
506
+ }
507
+ }
508
+ }
509
+ }
510
+ }
511
+ }
512
+ });
513
+ function useAnnotationPopover(props) {
514
+ const $ = c(14), editor = useEditor();
515
+ let t0;
516
+ $[0] !== editor || $[1] !== props.schemaTypes ? (t0 = {
517
+ input: {
518
+ editor,
519
+ schemaTypes: props.schemaTypes
520
+ }
521
+ }, $[0] = editor, $[1] = props.schemaTypes, $[2] = t0) : t0 = $[2];
522
+ const [actorSnapshot, send] = useActor(annotationPopoverMachine, t0);
523
+ let t1;
524
+ $[3] !== actorSnapshot.context.annotations || $[4] !== actorSnapshot.context.elementRef ? (t1 = {
525
+ annotations: actorSnapshot.context.annotations,
526
+ elementRef: actorSnapshot.context.elementRef
527
+ }, $[3] = actorSnapshot.context.annotations, $[4] = actorSnapshot.context.elementRef, $[5] = t1) : t1 = $[5];
528
+ let t2;
529
+ $[6] !== actorSnapshot ? (t2 = (state) => actorSnapshot.matches(state), $[6] = actorSnapshot, $[7] = t2) : t2 = $[7];
530
+ let t3;
531
+ $[8] !== t1 || $[9] !== t2 ? (t3 = {
532
+ context: t1,
533
+ matches: t2
534
+ }, $[8] = t1, $[9] = t2, $[10] = t3) : t3 = $[10];
535
+ let t4;
536
+ return $[11] !== send || $[12] !== t3 ? (t4 = {
537
+ snapshot: t3,
538
+ send
539
+ }, $[11] = send, $[12] = t3, $[13] = t4) : t4 = $[13], t4;
540
+ }
541
+ const keyboardShortcutListener$2 = fromCallback(({
542
+ input,
543
+ sendBack
544
+ }) => {
545
+ const shortcut = input.schemaType.shortcut;
546
+ if (shortcut)
547
+ return input.editor.registerBehavior({
548
+ behavior: defineBehavior({
549
+ on: "keyboard.keydown",
550
+ guard: ({
551
+ event
552
+ }) => shortcut.guard(event.originEvent),
553
+ actions: [() => [effect(() => {
554
+ sendBack({
555
+ type: "open dialog"
556
+ });
557
+ })]]
558
+ })
559
+ });
560
+ }), blockObjectButtonMachine = setup({
561
+ types: {
562
+ context: {},
563
+ input: {},
564
+ events: {}
565
+ },
566
+ actions: {
567
+ insert: ({
568
+ context,
569
+ event
570
+ }) => {
571
+ event.type === "insert" && (context.editor.send({
572
+ type: "insert.block object",
573
+ blockObject: {
574
+ name: context.schemaType.name,
575
+ value: event.value
576
+ },
577
+ placement: event.placement ?? "auto"
578
+ }), context.editor.send({
579
+ type: "focus"
580
+ }));
581
+ }
582
+ },
583
+ actors: {
584
+ "disable listener": disableListener,
585
+ "keyboard shortcut listener": keyboardShortcutListener$2
586
+ }
587
+ }).createMachine({
588
+ id: "block object button",
589
+ context: ({
590
+ input
591
+ }) => ({
592
+ editor: input.editor,
593
+ schemaType: input.schemaType
594
+ }),
595
+ invoke: [{
596
+ src: "disable listener",
597
+ input: ({
598
+ context
599
+ }) => ({
600
+ editor: context.editor
601
+ })
602
+ }],
603
+ initial: "disabled",
604
+ states: {
605
+ disabled: {
606
+ on: {
607
+ enable: {
608
+ target: "enabled"
609
+ }
610
+ }
611
+ },
612
+ enabled: {
613
+ on: {
614
+ disable: {
615
+ target: "disabled"
616
+ }
617
+ },
618
+ initial: "idle",
619
+ states: {
620
+ idle: {
621
+ invoke: [{
622
+ src: "keyboard shortcut listener",
623
+ input: ({
624
+ context
625
+ }) => ({
626
+ editor: context.editor,
627
+ schemaType: context.schemaType
628
+ })
629
+ }],
630
+ on: {
631
+ "open dialog": {
632
+ target: "showing dialog"
633
+ }
634
+ }
635
+ },
636
+ "showing dialog": {
637
+ on: {
638
+ "close dialog": {
639
+ target: "idle"
640
+ },
641
+ insert: {
642
+ actions: ["insert"],
643
+ target: "idle"
644
+ }
645
+ }
646
+ }
647
+ }
648
+ }
649
+ }
650
+ });
651
+ function useBlockObjectButton(props) {
652
+ const $ = c(8), editor = useEditor();
653
+ let t0;
654
+ $[0] !== editor || $[1] !== props.schemaType ? (t0 = {
655
+ input: {
656
+ editor,
657
+ schemaType: props.schemaType
658
+ }
659
+ }, $[0] = editor, $[1] = props.schemaType, $[2] = t0) : t0 = $[2];
660
+ const [actorSnapshot, send] = useActor(blockObjectButtonMachine, t0);
661
+ let t1;
662
+ $[3] !== actorSnapshot ? (t1 = {
663
+ matches: (state) => actorSnapshot.matches(state)
664
+ }, $[3] = actorSnapshot, $[4] = t1) : t1 = $[4];
665
+ let t2;
666
+ return $[5] !== send || $[6] !== t1 ? (t2 = {
667
+ snapshot: t1,
668
+ send
669
+ }, $[5] = send, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
670
+ }
671
+ const activeListener$4 = fromCallback(({
672
+ input,
673
+ sendBack
674
+ }) => input.editor.on("selection", () => {
675
+ const snapshot = input.editor.getSnapshot();
676
+ if (!selectors.isSelectionCollapsed(snapshot)) {
677
+ sendBack({
678
+ type: "set inactive"
679
+ });
680
+ return;
681
+ }
682
+ const focusBlockObject = selectors.getFocusBlockObject(snapshot);
683
+ if (!focusBlockObject) {
684
+ sendBack({
685
+ type: "set inactive"
686
+ });
687
+ return;
688
+ }
689
+ const schemaType = input.schemaTypes.find((schemaType2) => schemaType2.name === focusBlockObject.node._type);
690
+ if (!schemaType) {
691
+ sendBack({
692
+ type: "set inactive"
693
+ });
694
+ return;
695
+ }
696
+ const firstSelectedNode = input.editor.dom.getBlockNodes(snapshot).at(0);
697
+ if (!firstSelectedNode || !(firstSelectedNode instanceof Element)) {
698
+ sendBack({
699
+ type: "set inactive"
700
+ });
701
+ return;
702
+ }
703
+ const elementRef = React.createRef();
704
+ elementRef.current = firstSelectedNode, sendBack({
705
+ type: "set active",
706
+ blockObjects: [{
707
+ value: focusBlockObject.node,
708
+ schemaType,
709
+ at: focusBlockObject.path
710
+ }],
711
+ elementRef
712
+ });
713
+ }).unsubscribe), blockObjectPopoverMachine = setup({
714
+ types: {
715
+ context: {},
716
+ input: {},
717
+ events: {}
718
+ },
719
+ actions: {
720
+ reset: assign({
721
+ blockObjects: [],
722
+ elementRef: React.createRef()
723
+ })
724
+ },
725
+ actors: {
726
+ "disable listener": disableListener,
727
+ "active listener": activeListener$4
728
+ }
729
+ }).createMachine({
730
+ id: "block object popover",
731
+ context: ({
732
+ input
733
+ }) => ({
734
+ editor: input.editor,
735
+ schemaTypes: input.schemaTypes,
736
+ blockObjects: [],
737
+ elementRef: React.createRef()
738
+ }),
739
+ invoke: [{
740
+ src: "disable listener",
741
+ input: ({
742
+ context
743
+ }) => ({
744
+ editor: context.editor
745
+ })
746
+ }, {
747
+ src: "active listener",
748
+ input: ({
749
+ context
750
+ }) => ({
751
+ editor: context.editor,
752
+ schemaTypes: context.schemaTypes
753
+ })
754
+ }],
755
+ initial: "disabled",
756
+ states: {
757
+ disabled: {
758
+ initial: "inactive",
759
+ states: {
760
+ inactive: {
761
+ entry: ["reset"],
762
+ on: {
763
+ "set active": {
764
+ actions: assign({
765
+ blockObjects: ({
766
+ event
767
+ }) => event.blockObjects,
768
+ elementRef: ({
769
+ event
770
+ }) => event.elementRef
771
+ }),
772
+ target: "active"
773
+ },
774
+ enable: {
775
+ target: "#block object popover.enabled.inactive"
776
+ }
777
+ }
778
+ },
779
+ active: {
780
+ on: {
781
+ "set inactive": {
782
+ target: "inactive"
783
+ },
784
+ enable: {
785
+ target: "#block object popover.enabled.active"
786
+ }
787
+ }
788
+ }
789
+ }
790
+ },
791
+ enabled: {
792
+ initial: "inactive",
793
+ states: {
794
+ inactive: {
795
+ entry: ["reset"],
796
+ on: {
797
+ "set active": {
798
+ target: "active",
799
+ actions: assign({
800
+ blockObjects: ({
801
+ event
802
+ }) => event.blockObjects,
803
+ elementRef: ({
804
+ event
805
+ }) => event.elementRef
806
+ })
807
+ },
808
+ disable: {
809
+ target: "#block object popover.disabled.inactive"
810
+ }
811
+ }
812
+ },
813
+ active: {
814
+ on: {
815
+ "set inactive": {
816
+ target: "inactive"
817
+ },
818
+ disable: {
819
+ target: "#block object popover.disabled.active"
820
+ },
821
+ "set active": {
822
+ actions: assign({
823
+ blockObjects: ({
824
+ event
825
+ }) => event.blockObjects,
826
+ elementRef: ({
827
+ event
828
+ }) => event.elementRef
829
+ })
830
+ },
831
+ edit: {
832
+ actions: ({
833
+ context,
834
+ event
835
+ }) => {
836
+ context.editor.send({
837
+ type: "block.set",
838
+ at: event.at,
839
+ props: event.props
840
+ }), context.editor.send({
841
+ type: "focus"
842
+ });
843
+ }
844
+ },
845
+ remove: {
846
+ actions: ({
847
+ context,
848
+ event
849
+ }) => {
850
+ context.editor.send({
851
+ type: "delete.block",
852
+ at: event.at
853
+ }), context.editor.send({
854
+ type: "focus"
855
+ });
856
+ }
857
+ },
858
+ close: {
859
+ actions: ({
860
+ context
861
+ }) => {
862
+ context.editor.send({
863
+ type: "focus"
864
+ });
865
+ },
866
+ target: "inactive"
867
+ }
868
+ }
869
+ }
870
+ }
871
+ }
872
+ }
873
+ });
874
+ function useBlockObjectPopover(props) {
875
+ const $ = c(14), editor = useEditor();
876
+ let t0;
877
+ $[0] !== editor || $[1] !== props.schemaTypes ? (t0 = {
878
+ input: {
879
+ editor,
880
+ schemaTypes: props.schemaTypes
881
+ }
882
+ }, $[0] = editor, $[1] = props.schemaTypes, $[2] = t0) : t0 = $[2];
883
+ const [actorSnapshot, send] = useActor(blockObjectPopoverMachine, t0);
884
+ let t1;
885
+ $[3] !== actorSnapshot.context.blockObjects || $[4] !== actorSnapshot.context.elementRef ? (t1 = {
886
+ blockObjects: actorSnapshot.context.blockObjects,
887
+ elementRef: actorSnapshot.context.elementRef
888
+ }, $[3] = actorSnapshot.context.blockObjects, $[4] = actorSnapshot.context.elementRef, $[5] = t1) : t1 = $[5];
889
+ let t2;
890
+ $[6] !== actorSnapshot ? (t2 = (state) => actorSnapshot.matches(state), $[6] = actorSnapshot, $[7] = t2) : t2 = $[7];
891
+ let t3;
892
+ $[8] !== t1 || $[9] !== t2 ? (t3 = {
893
+ context: t1,
894
+ matches: t2
895
+ }, $[8] = t1, $[9] = t2, $[10] = t3) : t3 = $[10];
896
+ let t4;
897
+ return $[11] !== send || $[12] !== t3 ? (t4 = {
898
+ snapshot: t3,
899
+ send
900
+ }, $[11] = send, $[12] = t3, $[13] = t4) : t4 = $[13], t4;
901
+ }
902
+ const keyboardShortcutListener$1 = fromCallback(({
903
+ input
904
+ }) => {
905
+ const shortcut = input.schemaType.shortcut;
906
+ if (shortcut)
907
+ return input.editor.registerBehavior({
908
+ behavior: defineBehavior({
909
+ on: "keyboard.keydown",
910
+ guard: ({
911
+ event
912
+ }) => shortcut.guard(event.originEvent),
913
+ actions: [() => [raise({
914
+ type: "decorator.toggle",
915
+ decorator: input.schemaType.name
916
+ })]]
917
+ })
918
+ });
919
+ }), decoratorKeyboardShortcutMachine = setup({
920
+ types: {
921
+ context: {},
922
+ input: {},
923
+ events: {}
924
+ },
925
+ actors: {
926
+ "disable listener": disableListener,
927
+ "keyboard shortcut listener": keyboardShortcutListener$1
928
+ }
929
+ }).createMachine({
930
+ id: "decorator keyboard shortcut",
931
+ context: ({
932
+ input
933
+ }) => ({
934
+ editor: input.editor,
935
+ schemaType: input.schemaType
936
+ }),
937
+ invoke: {
938
+ src: "disable listener",
939
+ input: ({
940
+ context
941
+ }) => ({
942
+ editor: context.editor
943
+ })
944
+ },
945
+ initial: "disabled",
946
+ states: {
947
+ disabled: {
948
+ on: {
949
+ enable: {
950
+ target: "enabled"
951
+ }
952
+ }
953
+ },
954
+ enabled: {
955
+ invoke: {
956
+ src: "keyboard shortcut listener",
957
+ input: ({
958
+ context
959
+ }) => ({
960
+ editor: context.editor,
961
+ schemaType: context.schemaType
962
+ })
963
+ },
964
+ on: {
965
+ disable: {
966
+ target: "disabled"
967
+ }
968
+ }
969
+ }
970
+ }
971
+ });
972
+ function useDecoratorKeyboardShortcut(props) {
973
+ const $ = c(3), editor = useEditor();
974
+ let t0;
975
+ $[0] !== editor || $[1] !== props.schemaType ? (t0 = {
976
+ input: {
977
+ editor,
978
+ schemaType: props.schemaType
979
+ }
980
+ }, $[0] = editor, $[1] = props.schemaType, $[2] = t0) : t0 = $[2], useActorRef(decoratorKeyboardShortcutMachine, t0);
981
+ }
982
+ function useMutuallyExclusiveDecorator(props) {
983
+ const $ = c(5), editor = useEditor();
984
+ let t0, t1;
985
+ $[0] !== editor || $[1] !== props.schemaType.mutuallyExclusive || $[2] !== props.schemaType.name ? (t0 = () => {
986
+ const mutuallyExclusive = props.schemaType.mutuallyExclusive;
987
+ if (mutuallyExclusive)
988
+ return editor.registerBehavior({
989
+ behavior: defineBehavior({
990
+ on: "decorator.add",
991
+ guard: (t2) => {
992
+ const {
993
+ event
994
+ } = t2;
995
+ return event.decorator === props.schemaType.name;
996
+ },
997
+ actions: [(t3) => {
998
+ const {
999
+ event: event_0
1000
+ } = t3;
1001
+ return [forward(event_0), ...mutuallyExclusive.map(_temp)];
1002
+ }]
1003
+ })
1004
+ });
1005
+ }, t1 = [editor, props.schemaType.name, props.schemaType.mutuallyExclusive], $[0] = editor, $[1] = props.schemaType.mutuallyExclusive, $[2] = props.schemaType.name, $[3] = t0, $[4] = t1) : (t0 = $[3], t1 = $[4]), useEffect(t0, t1);
1006
+ }
1007
+ function _temp(decorator) {
1008
+ return raise({
1009
+ type: "decorator.remove",
1010
+ decorator
1011
+ });
1012
+ }
1013
+ const activeListener$3 = fromCallback(({
1014
+ input,
1015
+ sendBack
1016
+ }) => input.editor.on("*", () => {
1017
+ const snapshot = input.editor.getSnapshot();
1018
+ selectors.isActiveDecorator(input.schemaType.name)(snapshot) ? sendBack({
1019
+ type: "set active"
1020
+ }) : sendBack({
1021
+ type: "set inactive"
1022
+ });
1023
+ }).unsubscribe), decoratorButtonMachine = setup({
1024
+ types: {
1025
+ context: {},
1026
+ input: {},
1027
+ events: {}
1028
+ },
1029
+ actions: {
1030
+ toggle: ({
1031
+ context,
1032
+ event
1033
+ }) => {
1034
+ event.type === "toggle" && (context.editor.send({
1035
+ type: "decorator.toggle",
1036
+ decorator: context.schemaType.name
1037
+ }), context.editor.send({
1038
+ type: "focus"
1039
+ }));
1040
+ }
1041
+ },
1042
+ actors: {
1043
+ "disable listener": disableListener,
1044
+ "active listener": activeListener$3
1045
+ }
1046
+ }).createMachine({
1047
+ id: "decorator button",
1048
+ context: ({
1049
+ input
1050
+ }) => ({
1051
+ editor: input.editor,
1052
+ schemaType: input.schemaType
1053
+ }),
1054
+ invoke: [{
1055
+ src: "disable listener",
1056
+ input: ({
1057
+ context
1058
+ }) => ({
1059
+ editor: context.editor
1060
+ })
1061
+ }, {
1062
+ src: "active listener",
1063
+ input: ({
1064
+ context
1065
+ }) => ({
1066
+ editor: context.editor,
1067
+ schemaType: context.schemaType
1068
+ })
1069
+ }],
1070
+ initial: "disabled",
1071
+ states: {
1072
+ disabled: {
1073
+ initial: "inactive",
1074
+ states: {
1075
+ inactive: {
1076
+ on: {
1077
+ enable: {
1078
+ target: "#decorator button.enabled.inactive"
1079
+ },
1080
+ "set active": {
1081
+ target: "active"
1082
+ }
1083
+ }
1084
+ },
1085
+ active: {
1086
+ on: {
1087
+ enable: {
1088
+ target: "#decorator button.enabled.active"
1089
+ },
1090
+ "set inactive": {
1091
+ target: "inactive"
1092
+ }
1093
+ }
1094
+ }
1095
+ }
1096
+ },
1097
+ enabled: {
1098
+ on: {
1099
+ toggle: {
1100
+ actions: ["toggle"]
1101
+ }
1102
+ },
1103
+ initial: "inactive",
1104
+ states: {
1105
+ inactive: {
1106
+ on: {
1107
+ disable: {
1108
+ target: "#decorator button.disabled.inactive"
1109
+ },
1110
+ "set active": {
1111
+ target: "active"
1112
+ }
1113
+ }
1114
+ },
1115
+ active: {
1116
+ on: {
1117
+ disable: {
1118
+ target: "#decorator button.disabled.active"
1119
+ },
1120
+ "set inactive": {
1121
+ target: "inactive"
1122
+ }
1123
+ }
1124
+ }
1125
+ }
1126
+ }
1127
+ }
1128
+ });
1129
+ function useDecoratorButton(props) {
1130
+ const $ = c(8), editor = useEditor();
1131
+ let t0;
1132
+ $[0] !== editor || $[1] !== props.schemaType ? (t0 = {
1133
+ input: {
1134
+ editor,
1135
+ schemaType: props.schemaType
1136
+ }
1137
+ }, $[0] = editor, $[1] = props.schemaType, $[2] = t0) : t0 = $[2];
1138
+ const [actorSnapshot, send] = useActor(decoratorButtonMachine, t0);
1139
+ useDecoratorKeyboardShortcut(props), useMutuallyExclusiveDecorator(props);
1140
+ let t1;
1141
+ $[3] !== actorSnapshot ? (t1 = {
1142
+ matches: (state) => actorSnapshot.matches(state)
1143
+ }, $[3] = actorSnapshot, $[4] = t1) : t1 = $[4];
1144
+ let t2;
1145
+ return $[5] !== send || $[6] !== t1 ? (t2 = {
1146
+ snapshot: t1,
1147
+ send
1148
+ }, $[5] = send, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
1149
+ }
1150
+ const historyButtonsMachine = setup({
1151
+ types: {
1152
+ context: {},
1153
+ input: {},
1154
+ events: {}
1155
+ },
1156
+ actors: {
1157
+ "disable listener": disableListener
1158
+ }
1159
+ }).createMachine({
1160
+ id: "history buttons",
1161
+ context: ({
1162
+ input
1163
+ }) => ({
1164
+ editor: input.editor
1165
+ }),
1166
+ invoke: {
1167
+ src: "disable listener",
1168
+ input: ({
1169
+ context
1170
+ }) => ({
1171
+ editor: context.editor
1172
+ })
1173
+ },
1174
+ initial: "disabled",
1175
+ states: {
1176
+ disabled: {
1177
+ on: {
1178
+ enable: {
1179
+ target: "enabled"
1180
+ }
1181
+ }
1182
+ },
1183
+ enabled: {
1184
+ on: {
1185
+ disable: {
1186
+ target: "disabled"
1187
+ },
1188
+ "history.undo": {
1189
+ actions: ({
1190
+ context
1191
+ }) => {
1192
+ context.editor.send({
1193
+ type: "history.undo"
1194
+ }), context.editor.send({
1195
+ type: "focus"
1196
+ });
1197
+ }
1198
+ },
1199
+ "history.redo": {
1200
+ actions: ({
1201
+ context
1202
+ }) => {
1203
+ context.editor.send({
1204
+ type: "history.redo"
1205
+ }), context.editor.send({
1206
+ type: "focus"
1207
+ });
1208
+ }
1209
+ }
1210
+ }
1211
+ }
1212
+ }
1213
+ });
1214
+ function useHistoryButtons() {
1215
+ const $ = c(7), editor = useEditor();
1216
+ let t0;
1217
+ $[0] !== editor ? (t0 = {
1218
+ input: {
1219
+ editor
1220
+ }
1221
+ }, $[0] = editor, $[1] = t0) : t0 = $[1];
1222
+ const [actorSnapshot, send] = useActor(historyButtonsMachine, t0);
1223
+ let t1;
1224
+ $[2] !== actorSnapshot ? (t1 = {
1225
+ matches: (state) => actorSnapshot.matches(state)
1226
+ }, $[2] = actorSnapshot, $[3] = t1) : t1 = $[3];
1227
+ let t2;
1228
+ return $[4] !== send || $[5] !== t1 ? (t2 = {
1229
+ snapshot: t1,
1230
+ send
1231
+ }, $[4] = send, $[5] = t1, $[6] = t2) : t2 = $[6], t2;
1232
+ }
1233
+ const keyboardShortcutListener = fromCallback(({
1234
+ input,
1235
+ sendBack
1236
+ }) => {
1237
+ const shortcut = input.schemaType.shortcut;
1238
+ if (shortcut)
1239
+ return input.editor.registerBehavior({
1240
+ behavior: defineBehavior({
1241
+ on: "keyboard.keydown",
1242
+ guard: ({
1243
+ event
1244
+ }) => shortcut.guard(event.originEvent),
1245
+ actions: [() => [effect(() => {
1246
+ sendBack({
1247
+ type: "open dialog"
1248
+ });
1249
+ })]]
1250
+ })
1251
+ });
1252
+ }), inlineObjectButtonMachine = setup({
1253
+ types: {
1254
+ context: {},
1255
+ input: {},
1256
+ events: {}
1257
+ },
1258
+ actions: {
1259
+ insert: ({
1260
+ context,
1261
+ event
1262
+ }) => {
1263
+ event.type === "insert" && (context.editor.send({
1264
+ type: "insert.inline object",
1265
+ inlineObject: {
1266
+ name: context.schemaType.name,
1267
+ value: event.value
1268
+ }
1269
+ }), context.editor.send({
1270
+ type: "focus"
1271
+ }));
1272
+ }
1273
+ },
1274
+ actors: {
1275
+ "disable listener": disableListener,
1276
+ "keyboard shortcut listener": keyboardShortcutListener
1277
+ }
1278
+ }).createMachine({
1279
+ id: "inline object button",
1280
+ context: ({
1281
+ input
1282
+ }) => ({
1283
+ editor: input.editor,
1284
+ schemaType: input.schemaType
1285
+ }),
1286
+ invoke: [{
1287
+ src: "disable listener",
1288
+ input: ({
1289
+ context
1290
+ }) => ({
1291
+ editor: context.editor
1292
+ })
1293
+ }],
1294
+ initial: "disabled",
1295
+ states: {
1296
+ disabled: {
1297
+ on: {
1298
+ enable: {
1299
+ target: "enabled"
1300
+ }
1301
+ }
1302
+ },
1303
+ enabled: {
1304
+ on: {
1305
+ disable: {
1306
+ target: "disabled"
1307
+ }
1308
+ },
1309
+ initial: "idle",
1310
+ states: {
1311
+ idle: {
1312
+ invoke: [{
1313
+ src: "keyboard shortcut listener",
1314
+ input: ({
1315
+ context
1316
+ }) => ({
1317
+ editor: context.editor,
1318
+ schemaType: context.schemaType
1319
+ })
1320
+ }],
1321
+ on: {
1322
+ "open dialog": {
1323
+ target: "showing dialog"
1324
+ }
1325
+ }
1326
+ },
1327
+ "showing dialog": {
1328
+ on: {
1329
+ "close dialog": {
1330
+ target: "idle"
1331
+ },
1332
+ insert: {
1333
+ actions: ["insert"],
1334
+ target: "idle"
1335
+ }
1336
+ }
1337
+ }
1338
+ }
1339
+ }
1340
+ }
1341
+ });
1342
+ function useInlineObjectButton(props) {
1343
+ const $ = c(8), editor = useEditor();
1344
+ let t0;
1345
+ $[0] !== editor || $[1] !== props.schemaType ? (t0 = {
1346
+ input: {
1347
+ editor,
1348
+ schemaType: props.schemaType
1349
+ }
1350
+ }, $[0] = editor, $[1] = props.schemaType, $[2] = t0) : t0 = $[2];
1351
+ const [actorSnapshot, send] = useActor(inlineObjectButtonMachine, t0);
1352
+ let t1;
1353
+ $[3] !== actorSnapshot ? (t1 = {
1354
+ matches: (state) => actorSnapshot.matches(state)
1355
+ }, $[3] = actorSnapshot, $[4] = t1) : t1 = $[4];
1356
+ let t2;
1357
+ return $[5] !== send || $[6] !== t1 ? (t2 = {
1358
+ snapshot: t1,
1359
+ send
1360
+ }, $[5] = send, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
1361
+ }
1362
+ const activeListener$2 = fromCallback(({
1363
+ input,
1364
+ sendBack
1365
+ }) => input.editor.on("selection", () => {
1366
+ const snapshot = input.editor.getSnapshot();
1367
+ if (!selectors.isSelectionCollapsed(snapshot)) {
1368
+ sendBack({
1369
+ type: "set inactive"
1370
+ });
1371
+ return;
1372
+ }
1373
+ const focusInlineObject = selectors.getFocusInlineObject(snapshot);
1374
+ if (!focusInlineObject) {
1375
+ sendBack({
1376
+ type: "set inactive"
1377
+ });
1378
+ return;
1379
+ }
1380
+ const schemaType = input.schemaTypes.find((schemaType2) => schemaType2.name === focusInlineObject.node._type);
1381
+ if (!schemaType) {
1382
+ sendBack({
1383
+ type: "set inactive"
1384
+ });
1385
+ return;
1386
+ }
1387
+ const firstSelectedNode = input.editor.dom.getChildNodes(snapshot).at(0);
1388
+ if (!firstSelectedNode || !(firstSelectedNode instanceof Element)) {
1389
+ sendBack({
1390
+ type: "set inactive"
1391
+ });
1392
+ return;
1393
+ }
1394
+ const elementRef = React.createRef();
1395
+ elementRef.current = firstSelectedNode, sendBack({
1396
+ type: "set active",
1397
+ inlineObjects: [{
1398
+ value: focusInlineObject.node,
1399
+ schemaType,
1400
+ at: focusInlineObject.path
1401
+ }],
1402
+ elementRef
1403
+ });
1404
+ }).unsubscribe), inlineObjectPopoverMachine = setup({
1405
+ types: {
1406
+ context: {},
1407
+ input: {},
1408
+ events: {}
1409
+ },
1410
+ actions: {
1411
+ reset: assign({
1412
+ inlineObjects: [],
1413
+ elementRef: React.createRef()
1414
+ })
1415
+ },
1416
+ actors: {
1417
+ "disable listener": disableListener,
1418
+ "active listener": activeListener$2
1419
+ }
1420
+ }).createMachine({
1421
+ id: "inline object popover",
1422
+ context: ({
1423
+ input
1424
+ }) => ({
1425
+ editor: input.editor,
1426
+ schemaTypes: input.schemaTypes,
1427
+ inlineObjects: [],
1428
+ elementRef: React.createRef()
1429
+ }),
1430
+ invoke: [{
1431
+ src: "disable listener",
1432
+ input: ({
1433
+ context
1434
+ }) => ({
1435
+ editor: context.editor
1436
+ })
1437
+ }, {
1438
+ src: "active listener",
1439
+ input: ({
1440
+ context
1441
+ }) => ({
1442
+ editor: context.editor,
1443
+ schemaTypes: context.schemaTypes
1444
+ })
1445
+ }],
1446
+ initial: "disabled",
1447
+ states: {
1448
+ disabled: {
1449
+ initial: "inactive",
1450
+ states: {
1451
+ inactive: {
1452
+ entry: ["reset"],
1453
+ on: {
1454
+ "set active": {
1455
+ actions: assign({
1456
+ inlineObjects: ({
1457
+ event
1458
+ }) => event.inlineObjects,
1459
+ elementRef: ({
1460
+ event
1461
+ }) => event.elementRef
1462
+ }),
1463
+ target: "active"
1464
+ },
1465
+ enable: {
1466
+ target: "#inline object popover.enabled.inactive"
1467
+ }
1468
+ }
1469
+ },
1470
+ active: {
1471
+ on: {
1472
+ "set inactive": {
1473
+ target: "inactive"
1474
+ },
1475
+ enable: {
1476
+ target: "#inline object popover.enabled.active"
1477
+ }
1478
+ }
1479
+ }
1480
+ }
1481
+ },
1482
+ enabled: {
1483
+ initial: "inactive",
1484
+ states: {
1485
+ inactive: {
1486
+ entry: ["reset"],
1487
+ on: {
1488
+ "set active": {
1489
+ target: "active",
1490
+ actions: assign({
1491
+ inlineObjects: ({
1492
+ event
1493
+ }) => event.inlineObjects,
1494
+ elementRef: ({
1495
+ event
1496
+ }) => event.elementRef
1497
+ })
1498
+ },
1499
+ disable: {
1500
+ target: "#inline object popover.disabled.inactive"
1501
+ }
1502
+ }
1503
+ },
1504
+ active: {
1505
+ on: {
1506
+ "set inactive": {
1507
+ target: "inactive"
1508
+ },
1509
+ disable: {
1510
+ target: "#inline object popover.disabled.active"
1511
+ },
1512
+ "set active": {
1513
+ actions: assign({
1514
+ inlineObjects: ({
1515
+ event
1516
+ }) => event.inlineObjects,
1517
+ elementRef: ({
1518
+ event
1519
+ }) => event.elementRef
1520
+ })
1521
+ },
1522
+ edit: {
1523
+ actions: ({
1524
+ context,
1525
+ event
1526
+ }) => {
1527
+ context.editor.send({
1528
+ type: "child.set",
1529
+ at: event.at,
1530
+ props: event.props
1531
+ }), context.editor.send({
1532
+ type: "focus"
1533
+ });
1534
+ }
1535
+ },
1536
+ remove: {
1537
+ actions: ({
1538
+ context,
1539
+ event
1540
+ }) => {
1541
+ context.editor.send({
1542
+ type: "delete.child",
1543
+ at: event.at
1544
+ }), context.editor.send({
1545
+ type: "focus"
1546
+ });
1547
+ }
1548
+ },
1549
+ close: {
1550
+ actions: ({
1551
+ context
1552
+ }) => {
1553
+ context.editor.send({
1554
+ type: "focus"
1555
+ });
1556
+ },
1557
+ target: "inactive"
1558
+ }
1559
+ }
1560
+ }
1561
+ }
1562
+ }
1563
+ }
1564
+ });
1565
+ function useInlineObjectPopover(props) {
1566
+ const $ = c(14), editor = useEditor();
1567
+ let t0;
1568
+ $[0] !== editor || $[1] !== props.schemaTypes ? (t0 = {
1569
+ input: {
1570
+ editor,
1571
+ schemaTypes: props.schemaTypes
1572
+ }
1573
+ }, $[0] = editor, $[1] = props.schemaTypes, $[2] = t0) : t0 = $[2];
1574
+ const [actorSnapshot, send] = useActor(inlineObjectPopoverMachine, t0);
1575
+ let t1;
1576
+ $[3] !== actorSnapshot.context.elementRef || $[4] !== actorSnapshot.context.inlineObjects ? (t1 = {
1577
+ inlineObjects: actorSnapshot.context.inlineObjects,
1578
+ elementRef: actorSnapshot.context.elementRef
1579
+ }, $[3] = actorSnapshot.context.elementRef, $[4] = actorSnapshot.context.inlineObjects, $[5] = t1) : t1 = $[5];
1580
+ let t2;
1581
+ $[6] !== actorSnapshot ? (t2 = (state) => actorSnapshot.matches(state), $[6] = actorSnapshot, $[7] = t2) : t2 = $[7];
1582
+ let t3;
1583
+ $[8] !== t1 || $[9] !== t2 ? (t3 = {
1584
+ context: t1,
1585
+ matches: t2
1586
+ }, $[8] = t1, $[9] = t2, $[10] = t3) : t3 = $[10];
1587
+ let t4;
1588
+ return $[11] !== send || $[12] !== t3 ? (t4 = {
1589
+ snapshot: t3,
1590
+ send
1591
+ }, $[11] = send, $[12] = t3, $[13] = t4) : t4 = $[13], t4;
1592
+ }
1593
+ const activeListener$1 = fromCallback(({
1594
+ input,
1595
+ sendBack
1596
+ }) => input.editor.on("*", () => {
1597
+ const snapshot = input.editor.getSnapshot();
1598
+ selectors.isActiveListItem(input.schemaType.name)(snapshot) ? sendBack({
1599
+ type: "set active"
1600
+ }) : sendBack({
1601
+ type: "set inactive"
1602
+ });
1603
+ }).unsubscribe), listButtonMachine = setup({
1604
+ types: {
1605
+ context: {},
1606
+ input: {},
1607
+ events: {}
1608
+ },
1609
+ actions: {
1610
+ toggle: ({
1611
+ context,
1612
+ event
1613
+ }) => {
1614
+ event.type === "toggle" && (context.editor.send({
1615
+ type: "list item.toggle",
1616
+ listItem: context.schemaType.name
1617
+ }), context.editor.send({
1618
+ type: "focus"
1619
+ }));
1620
+ }
1621
+ },
1622
+ actors: {
1623
+ "disable listener": disableListener,
1624
+ "active listener": activeListener$1
1625
+ }
1626
+ }).createMachine({
1627
+ id: "list button",
1628
+ context: ({
1629
+ input
1630
+ }) => ({
1631
+ editor: input.editor,
1632
+ schemaType: input.schemaType
1633
+ }),
1634
+ invoke: [{
1635
+ src: "disable listener",
1636
+ input: ({
1637
+ context
1638
+ }) => ({
1639
+ editor: context.editor
1640
+ })
1641
+ }, {
1642
+ src: "active listener",
1643
+ input: ({
1644
+ context
1645
+ }) => ({
1646
+ editor: context.editor,
1647
+ schemaType: context.schemaType
1648
+ })
1649
+ }],
1650
+ initial: "disabled",
1651
+ states: {
1652
+ disabled: {
1653
+ initial: "inactive",
1654
+ states: {
1655
+ inactive: {
1656
+ on: {
1657
+ enable: {
1658
+ target: "#list button.enabled.inactive"
1659
+ },
1660
+ "set active": {
1661
+ target: "active"
1662
+ }
1663
+ }
1664
+ },
1665
+ active: {
1666
+ on: {
1667
+ enable: {
1668
+ target: "#list button.enabled.active"
1669
+ },
1670
+ "set inactive": {
1671
+ target: "inactive"
1672
+ }
1673
+ }
1674
+ }
1675
+ }
1676
+ },
1677
+ enabled: {
1678
+ on: {
1679
+ toggle: {
1680
+ actions: ["toggle"]
1681
+ }
1682
+ },
1683
+ initial: "inactive",
1684
+ states: {
1685
+ inactive: {
1686
+ on: {
1687
+ disable: {
1688
+ target: "#list button.disabled.inactive"
1689
+ },
1690
+ "set active": {
1691
+ target: "active"
1692
+ }
1693
+ }
1694
+ },
1695
+ active: {
1696
+ on: {
1697
+ disable: {
1698
+ target: "#list button.disabled.active"
1699
+ },
1700
+ "set inactive": {
1701
+ target: "inactive"
1702
+ }
1703
+ }
1704
+ }
1705
+ }
1706
+ }
1707
+ }
1708
+ });
1709
+ function useListButton(props) {
1710
+ const $ = c(8), editor = useEditor();
1711
+ let t0;
1712
+ $[0] !== editor || $[1] !== props.schemaType ? (t0 = {
1713
+ input: {
1714
+ editor,
1715
+ schemaType: props.schemaType
1716
+ }
1717
+ }, $[0] = editor, $[1] = props.schemaType, $[2] = t0) : t0 = $[2];
1718
+ const [actorSnapshot, send] = useActor(listButtonMachine, t0);
1719
+ let t1;
1720
+ $[3] !== actorSnapshot ? (t1 = {
1721
+ matches: (state) => actorSnapshot.matches(state)
1722
+ }, $[3] = actorSnapshot, $[4] = t1) : t1 = $[4];
1723
+ let t2;
1724
+ return $[5] !== send || $[6] !== t1 ? (t2 = {
1725
+ snapshot: t1,
1726
+ send
1727
+ }, $[5] = send, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
1728
+ }
1729
+ const styleKeyboardShortcutsListener = fromCallback(({
1730
+ input
1731
+ }) => {
1732
+ const unregisterBehaviors = input.schemaTypes.flatMap((schemaType) => {
1733
+ const shortcut = schemaType.shortcut;
1734
+ return shortcut ? [input.editor.registerBehavior({
1735
+ behavior: defineBehavior({
1736
+ on: "keyboard.keydown",
1737
+ guard: ({
1738
+ event
1739
+ }) => shortcut.guard(event.originEvent),
1740
+ actions: [() => [raise({
1741
+ type: "style.toggle",
1742
+ style: schemaType.name
1743
+ })]]
1744
+ })
1745
+ })] : [];
1746
+ });
1747
+ return () => {
1748
+ for (const unregisterBehavior of unregisterBehaviors)
1749
+ unregisterBehavior();
1750
+ };
1751
+ }), styleKeyboardShortcutsMachine = setup({
1752
+ types: {
1753
+ context: {},
1754
+ input: {},
1755
+ events: {}
1756
+ },
1757
+ actors: {
1758
+ "disable listener": disableListener,
1759
+ "style keyboard shortcuts listener": styleKeyboardShortcutsListener
1760
+ }
1761
+ }).createMachine({
1762
+ id: "style keyboard shortcuts",
1763
+ context: ({
1764
+ input
1765
+ }) => ({
1766
+ editor: input.editor,
1767
+ schemaTypes: input.schemaTypes
1768
+ }),
1769
+ invoke: {
1770
+ src: "disable listener",
1771
+ input: ({
1772
+ context
1773
+ }) => ({
1774
+ editor: context.editor
1775
+ })
1776
+ },
1777
+ initial: "disabled",
1778
+ states: {
1779
+ disabled: {
1780
+ on: {
1781
+ enable: {
1782
+ target: "enabled"
1783
+ }
1784
+ }
1785
+ },
1786
+ enabled: {
1787
+ invoke: {
1788
+ src: "style keyboard shortcuts listener",
1789
+ input: ({
1790
+ context
1791
+ }) => ({
1792
+ editor: context.editor,
1793
+ schemaTypes: context.schemaTypes
1794
+ })
1795
+ },
1796
+ on: {
1797
+ disable: {
1798
+ target: "disabled"
1799
+ }
1800
+ }
1801
+ }
1802
+ }
1803
+ });
1804
+ function useStyleKeyboardShortcuts(props) {
1805
+ const $ = c(3), editor = useEditor();
1806
+ let t0;
1807
+ $[0] !== editor || $[1] !== props.schemaTypes ? (t0 = {
1808
+ input: {
1809
+ editor,
1810
+ schemaTypes: props.schemaTypes
1811
+ }
1812
+ }, $[0] = editor, $[1] = props.schemaTypes, $[2] = t0) : t0 = $[2], useActorRef(styleKeyboardShortcutsMachine, t0);
1813
+ }
1814
+ const activeListener = fromCallback(({
1815
+ input,
1816
+ sendBack
1817
+ }) => input.editor.on("*", () => {
1818
+ const snapshot = input.editor.getSnapshot(), activeStyle = selectors.getActiveStyle(snapshot);
1819
+ sendBack({
1820
+ type: "set active style",
1821
+ style: activeStyle
1822
+ });
1823
+ }).unsubscribe), styleSelectorMachine = setup({
1824
+ types: {
1825
+ context: {},
1826
+ input: {},
1827
+ events: {}
1828
+ },
1829
+ actors: {
1830
+ "disable listener": disableListener,
1831
+ "active listener": activeListener
1832
+ }
1833
+ }).createMachine({
1834
+ id: "style selector",
1835
+ context: ({
1836
+ input
1837
+ }) => ({
1838
+ editor: input.editor,
1839
+ activeStyle: void 0
1840
+ }),
1841
+ invoke: [{
1842
+ src: "disable listener",
1843
+ input: ({
1844
+ context
1845
+ }) => ({
1846
+ editor: context.editor
1847
+ })
1848
+ }, {
1849
+ src: "active listener",
1850
+ input: ({
1851
+ context
1852
+ }) => ({
1853
+ editor: context.editor
1854
+ })
1855
+ }],
1856
+ on: {
1857
+ "set active style": {
1858
+ actions: assign({
1859
+ activeStyle: ({
1860
+ event
1861
+ }) => event.style
1862
+ })
1863
+ }
1864
+ },
1865
+ initial: "disabled",
1866
+ states: {
1867
+ disabled: {
1868
+ on: {
1869
+ enable: {
1870
+ target: "enabled"
1871
+ }
1872
+ }
1873
+ },
1874
+ enabled: {
1875
+ on: {
1876
+ disable: {
1877
+ target: "disabled"
1878
+ },
1879
+ toggle: {
1880
+ actions: [({
1881
+ context,
1882
+ event
1883
+ }) => {
1884
+ context.editor.send({
1885
+ type: "style.toggle",
1886
+ style: event.style
1887
+ }), context.editor.send({
1888
+ type: "focus"
1889
+ });
1890
+ }]
1891
+ }
1892
+ }
1893
+ }
1894
+ }
1895
+ });
1896
+ function useStyleSelector(props) {
1897
+ const $ = c(12), editor = useEditor();
1898
+ let t0;
1899
+ $[0] !== editor ? (t0 = {
1900
+ input: {
1901
+ editor
1902
+ }
1903
+ }, $[0] = editor, $[1] = t0) : t0 = $[1];
1904
+ const [actorSnapshot, send] = useActor(styleSelectorMachine, t0);
1905
+ useStyleKeyboardShortcuts(props);
1906
+ let t1;
1907
+ $[2] !== actorSnapshot ? (t1 = (state) => actorSnapshot.matches(state), $[2] = actorSnapshot, $[3] = t1) : t1 = $[3];
1908
+ let t2;
1909
+ $[4] !== actorSnapshot.context.activeStyle ? (t2 = {
1910
+ activeStyle: actorSnapshot.context.activeStyle
1911
+ }, $[4] = actorSnapshot.context.activeStyle, $[5] = t2) : t2 = $[5];
1912
+ let t3;
1913
+ $[6] !== t1 || $[7] !== t2 ? (t3 = {
1914
+ matches: t1,
1915
+ context: t2
1916
+ }, $[6] = t1, $[7] = t2, $[8] = t3) : t3 = $[8];
1917
+ let t4;
1918
+ return $[9] !== send || $[10] !== t3 ? (t4 = {
1919
+ snapshot: t3,
1920
+ send
1921
+ }, $[9] = send, $[10] = t3, $[11] = t4) : t4 = $[11], t4;
1922
+ }
1923
+ export {
1924
+ useAnnotationButton,
1925
+ useAnnotationPopover,
1926
+ useBlockObjectButton,
1927
+ useBlockObjectPopover,
1928
+ useDecoratorButton,
1929
+ useHistoryButtons,
1930
+ useInlineObjectButton,
1931
+ useInlineObjectPopover,
1932
+ useListButton,
1933
+ useStyleSelector,
1934
+ useToolbarSchema
1935
+ };
1936
+ //# sourceMappingURL=index.js.map