wysimark-lite 0.24.0 → 0.25.1

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.ts DELETED
@@ -1,1091 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as slate from 'slate';
3
- import { Descendant, Editor, Element as Element$1, BaseEditor, NodeEntry, BaseRange, Location, Path, Text, BaseText } from 'slate';
4
- import { HistoryEditor } from 'slate-history';
5
- import { ReactEditor, Editable as Editable$1 } from 'slate-react';
6
- import { SetReturnType, SetOptional, UnionToIntersection, Simplify } from 'type-fest';
7
- import react from 'react';
8
- import { RenderElementProps, RenderLeafProps, RenderPlaceholderProps, EditableProps as EditableProps$1 } from 'slate-react/dist/components/editable';
9
-
10
- type OnImageChangeHandler$1 = (file: File) => Promise<string>;
11
- type ImageDialogState = {
12
- url: string;
13
- alt: string;
14
- title: string;
15
- imageSource: "url" | "file";
16
- uploadedUrl: string;
17
- };
18
- type WysimarkEditor = {
19
- /**
20
- * Private state for the wysimark editor.
21
- */
22
- wysimark: {
23
- prevValue?: {
24
- markdown: string;
25
- children: Descendant[];
26
- };
27
- /**
28
- * Whether the editor is in Raw mode
29
- */
30
- isRawMode?: boolean;
31
- /**
32
- * Function to toggle Raw mode
33
- */
34
- toggleRawMode?: () => void;
35
- /**
36
- * Handler for image file upload
37
- */
38
- onImageChange?: OnImageChangeHandler$1;
39
- /**
40
- * Persisted state for the image dialog
41
- */
42
- imageDialogState?: ImageDialogState;
43
- /**
44
- * Whether raw mode is disabled
45
- */
46
- disableRawMode?: boolean;
47
- /**
48
- * Whether task list is disabled
49
- */
50
- disableTaskList?: boolean;
51
- /**
52
- * Whether code block is disabled
53
- */
54
- disableCodeBlock?: boolean;
55
- /**
56
- * Whether highlight mark is disabled
57
- */
58
- disableHighlight?: boolean;
59
- };
60
- /**
61
- * Public methods for the wysimark editor.
62
- */
63
- getMarkdown: () => string;
64
- setMarkdown: (markdown: string) => void;
65
- };
66
-
67
- type UseEditorOptions = {
68
- authToken?: string;
69
- height?: string | number;
70
- minHeight?: string | number;
71
- maxHeight?: string | number;
72
- /**
73
- * Disable raw Markdown editing mode.
74
- * When true, the raw mode toggle button will be hidden from the toolbar.
75
- * Defaults to true (raw mode is disabled by default).
76
- *
77
- * @example
78
- * ```tsx
79
- * const editor = useEditor({
80
- * disableRawMode: false // Enable raw mode
81
- * })
82
- * ```
83
- */
84
- disableRawMode?: boolean;
85
- /**
86
- * Disable task list (checklist) functionality.
87
- * When true, the task list button will be hidden from the toolbar
88
- * and task list creation will be disabled.
89
- *
90
- * @example
91
- * ```tsx
92
- * const editor = useEditor({
93
- * disableTaskList: true
94
- * })
95
- * ```
96
- */
97
- disableTaskList?: boolean;
98
- /**
99
- * Disable code block functionality.
100
- * When true, the code block button will be hidden from the toolbar.
101
- *
102
- * @example
103
- * ```tsx
104
- * const editor = useEditor({
105
- * disableCodeBlock: true
106
- * })
107
- * ```
108
- */
109
- disableCodeBlock?: boolean;
110
- /**
111
- * Disable highlight mark functionality.
112
- * When true, the highlight button will be hidden from the toolbar.
113
- * Highlight is serialized as <mark>text</mark> in markdown.
114
- * Defaults to true (highlight is disabled by default).
115
- *
116
- * @example
117
- * ```tsx
118
- * const editor = useEditor({
119
- * disableHighlight: false // Enable highlight
120
- * })
121
- * ```
122
- */
123
- disableHighlight?: boolean;
124
- };
125
- declare function useEditor({ authToken, height, minHeight, maxHeight, disableRawMode, disableTaskList, disableCodeBlock, disableHighlight, }?: UseEditorOptions): Editor & ReactEditor & WysimarkEditor;
126
-
127
- /**
128
- * SinkEditor just adds a `sink` object where we drop all of our sink
129
- * related data on.
130
- */
131
- type SinkEditor = {
132
- /**
133
- * a master Element is one that has one or more elements that are depedant
134
- * on it. For example, a `table` Element. For clarity, a `table-row` Element
135
- * is not considered a master Element. Only the top-most element is.
136
- *
137
- * One use for identify a master is for adding a block quote. We want the
138
- * block quote to always surround the master Element. A block-quote that
139
- * surrounded a table-row, for example, would not make sense.
140
- */
141
- isMaster: (node: Element$1) => boolean;
142
- /**
143
- * a slave Element is one that is dependant on another Element. For example,
144
- * `table-row`, `table-cell` and `table-cotent` elements are all considered
145
- * slave elements.
146
- *
147
- * At the time of writing, I haven't figured out a use case for a slave
148
- * element actually...
149
- */
150
- isSlave: (node: Element$1) => boolean;
151
- isStandalone: (node: Element$1) => boolean;
152
- sink: {
153
- plugins: BasePluginPolicy[];
154
- };
155
- };
156
- type FullSinkEditor = SinkEditor & BaseEditor & ReactEditor & HistoryEditor;
157
-
158
- /**
159
- * On the editor, there are several methods that return void that are used to
160
- * override default editor behaviors.
161
- *
162
- * These are referred to as Overrideable core actions in the docs.
163
- *
164
- * - deleteBackward
165
- * - deleteForward
166
- * - deleteFragment
167
- * - insertBreak
168
- * - insertFragment
169
- * - insertNode
170
- * - insertText
171
- * - normalizeNode
172
- *
173
- * When there are plugins, Sink tries to find a plugin to handle the event and
174
- * if it cannot, uses the previously defined handler. For example, the user may
175
- * have specified `editor.insertBreak` on the `editor` earlier and that will
176
- * be called after all the plugins have been searched.
177
- *
178
- * We search through the plugins from the first to the last plugin.
179
- *
180
- * In a plugin, we specify the functions like we don on the editor but the
181
- * return value informs us how the plugin should proceed after. The return
182
- * value generally indicates whether the plugin has handled the event with one
183
- * special case:
184
- *
185
- * - `true`: If the return type is `true` then the plugin has indicated it has
186
- * handled the event and no further processing is required. The handlers in
187
- * all remaining plugins are skipped.
188
- *
189
- * - `false`: If the return type is `false` then the plugin has indicated it has
190
- * not handled the event and will continue through the rest of the plugins
191
- * looking for a plugin to handle the event.
192
- *
193
- * - `() => void`: If the return tyep is a function, the plugin has indicated
194
- * it has not handled the event, but that it would like to register another
195
- * function that should execute after the actual event handler has been
196
- * executed. In particular, this is used when in certain situations we may
197
- * want a normalizer to execute after the event handler has triggered. This
198
- * is used in the `normalize-after-delete-plugin` for example.
199
- *
200
- * NOTE:
201
- *
202
- * This seems like an unusual specification at first glance and a purist might
203
- * argue, this could be handled more succinctly with a `next` function passed
204
- * in as the final argument.
205
- *
206
- * Here's why I elected to go this route but it boils down to the fact that
207
- * `next` functions make the function difficult to reason about.
208
- *
209
- * - 99% of the true, we want to indicate whether we handled the function or
210
- * not and for that use case, true/false is simple to understand and natural.
211
- * In the case where we need something to happen after, returning a function
212
- * is unusual, but still easy to reason about. Also, the exclusivity of
213
- * the function return is nice in that it assumes that the event wasn't
214
- * handled, and of course, the function return would only ever be used if the
215
- * function indeed wasn't handled. For if it was handled, there would be no
216
- * need to have the after function because that could just be in the original
217
- * function handler.
218
- *
219
- * - To use this, you have to build nested contexts that are always hard to
220
- * reason about because you are passing a set of contexts from inner child
221
- * to outer parent. This created difficult to comprehend complexity in the
222
- * old Slate plugins architecture and is probably why it was abandoned.
223
- *
224
- * - It's also harder to type properly and to reason about it. The argument
225
- * list changes in length depending on the function; furthermore, in some
226
- * cases it is natural to ignore the arguments but we'd have to accept blank
227
- * arguments that are unused to access the `next` function.
228
- *
229
- * - It's hard to debug. The plugin system as it currently is designed to
230
- * execute linearly, instead of in a nested fashion. This makes it easy to
231
- * add debug code, and know what happens before and after each step.
232
- */
233
- type VoidActionReturn = boolean | (() => void);
234
-
235
- type RenderEditableProps = {
236
- attributes: EditableProps$1;
237
- Editable: typeof Editable$1;
238
- };
239
- type RenderEditable = (props: RenderEditableProps) => react.ReactElement;
240
- /**
241
- * The return type of the BasePluginFn which specifies how the Plugin is
242
- * supposed to behave.
243
- */
244
- type BasePluginPolicy = {
245
- name: string;
246
- editor?: {
247
- isInline?: (element: Element) => boolean | void;
248
- isVoid?: (element: Element) => boolean | void;
249
- isMaster?: (element: Element) => boolean | void;
250
- isSlave?: (element: Element) => boolean | void;
251
- isStandalone?: (element: Element) => boolean | void;
252
- deleteBackward?: (unit: "character" | "word" | "line" | "block") => VoidActionReturn;
253
- deleteForward?: (unit: "character" | "word" | "line" | "block") => VoidActionReturn;
254
- deleteFragment?: () => VoidActionReturn;
255
- insertBreak?: () => VoidActionReturn;
256
- insertFragment?: (fragment: Node[]) => VoidActionReturn;
257
- insertNode?: (node: Node) => VoidActionReturn;
258
- insertText?: (text: string) => VoidActionReturn;
259
- normalizeNode?: (entry: NodeEntry) => VoidActionReturn;
260
- };
261
- renderEditable?: RenderEditable;
262
- editableProps?: {
263
- decorate?: ((entry: NodeEntry) => BaseRange[]) | undefined;
264
- renderElement?: (props: RenderElementProps) => react.ReactElement | undefined;
265
- renderLeaf?: (props: RenderLeafProps) => react.ReactElement | undefined;
266
- renderPlaceholder?: (props: RenderPlaceholderProps) => react.ReactElement;
267
- onKeyDown?: EditableVoidToBooleanHandlerType<"onKeyDown">;
268
- onKeyUp?: EditableVoidToBooleanHandlerType<"onKeyDown">;
269
- onPaste?: EditableVoidToBooleanHandlerType<"onPaste">;
270
- onDrop?: EditableVoidToBooleanHandlerType<"onDrop">;
271
- };
272
- };
273
- type EditableVoidToBooleanHandlerType<K extends keyof EditableProps$1> = SetReturnType<NonNullable<EditableProps$1[K]>, boolean>;
274
-
275
- /**
276
- * IMPORTANT!
277
- *
278
- * NEVER!
279
- *
280
- * refer to a type that is defined in the `slate` package. This is because
281
- * any reference to a Slate type will cause a circular reference type error that
282
- * is very hard to track down.
283
- *
284
- * NOTE: This kind of happens in that `Element` will often have a reference to
285
- * `Descendant` but it looks like this is okay; however, let's not tempt fate
286
- * by only using it where the definition is absolutely necessary.
287
- *
288
- * ALWAYS!
289
- *
290
- * Be explicity about return types. If they are inferred through the return
291
- * type, because we need to provide `Editor` as an argument in certain cases,
292
- * we don't want to accidentally have `Editor` be provided as a return type
293
- * or this will create the circular reference.
294
- */
295
- type BasePluginSchema = {
296
- Name: string;
297
- Options: Record<string, unknown>;
298
- Editor: Record<string, unknown>;
299
- Element: {
300
- type: string;
301
- };
302
- Text: Record<string, unknown>;
303
- };
304
- /**
305
- * These are the PluginTypes that are accepted as inputs into `createPlugin`
306
- * which has the same basic signature as `BasePluginTypes` but some of the
307
- * types are optional.
308
- *
309
- * These `InputPluginTypes` need to have their optional types filled in with
310
- * defaults before they can be used.
311
- *
312
- * See `NormalizeInputPluginTypes`
313
- */
314
- type InputPluginSchema = SetOptional<BasePluginSchema, "Options" | "Editor" | "Element" | "Text">;
315
- /**
316
- * Takes an `InputPluginSchema` (that has some optional types) and turns them
317
- * into a regular PluginTypes with any missing types filled in with defaults.
318
- */
319
- type NormalizeInputPluginSchema<T extends InputPluginSchema> = {
320
- Name: T["Name"];
321
- Options: T["Options"] extends object ? T["Options"] : {};
322
- Editor: T["Editor"] extends object ? T["Editor"] : {};
323
- Element: T["Element"] extends object ? T["Element"] : never;
324
- Text: T["Text"] extends object ? T["Text"] : {};
325
- };
326
-
327
- /**
328
- * Shape of a PluginFn (Plugin Function).
329
- */
330
- type BasePluginFn = (editor: FullSinkEditor, options: {}, helpers: {
331
- createPolicy: (value: unknown) => unknown;
332
- }) => BasePluginPolicy;
333
-
334
- /**
335
- * IMPORTANT!
336
- *
337
- * NEVER!
338
- *
339
- * refer to a type that is defined in the `slate` package. This is because
340
- * any reference to a Slate type will cause a circular reference type error that
341
- * is very hard to track down.
342
- *
343
- * NOTE: This kind of happens in that `Element` will often have a reference to
344
- * `Descendant` but it looks like this is okay; however, let's not tempt fate
345
- * by only using it where the definition is absolutely necessary.
346
- *
347
- * ALWAYS!
348
- *
349
- * Be explicity about return types. If they are inferred through the return
350
- * type, because we need to provide `Editor` as an argument in certain cases,
351
- * we don't want to accidentally have `Editor` be provided as a return type
352
- * or this will create the circular reference.
353
- */
354
-
355
- /**
356
- * When a Plugin is created using the `createPlugin` method, it returns a
357
- * Plugin.
358
- */
359
- type BasePlugin = {
360
- fn: BasePluginFn;
361
- __types__: BasePluginSchema;
362
- };
363
- /**
364
- * When a Plugin is created using `createPlugin` we must
365
- */
366
- type TypedPlugin<T extends InputPluginSchema> = {
367
- fn: BasePluginFn;
368
- __types__: NormalizeInputPluginSchema<T>;
369
- };
370
-
371
- type ExtractCustomTypes<TA extends Array<BasePlugin>> =
372
- /**
373
- * This code takes an array of types and merges them together into a union.
374
- */
375
- TA extends Array<{
376
- __types__: infer U;
377
- }> ? {
378
- Editor: SinkEditor & BaseEditor & ReactEditor & HistoryEditor & UnionToIntersection<U extends {
379
- Editor: infer E;
380
- } ? E : never>;
381
- Element: U extends {
382
- Element: infer E;
383
- } ? E : never;
384
- Text: Simplify<UnionToIntersection<U extends {
385
- Text: infer T;
386
- } ? T : never>>;
387
- Options: Simplify<UnionToIntersection<U extends {
388
- Options: infer T;
389
- } ? T : never>>;
390
- } : never;
391
-
392
- /**
393
- * Defines a value you'd find in a function's parameters as a replacement for
394
- * `at`. The benefit of using `BetterAt` is that it allows you to search
395
- * using an `Element`.
396
- */
397
- type BetterAt = Location | Element$1 | null;
398
-
399
- /**
400
- * The TargetElement can be specified either as the actual value or as a
401
- * function that takes a srcElement and returns the targetElement.
402
- */
403
- type TargetElement<T extends Element$1 = Element$1> = Omit<T, "children"> | ((srcElement: Element$1) => Omit<T, "children">);
404
-
405
- type PlaceholderEditor = {
406
- placeholder: {};
407
- };
408
- type PlaceholderPluginCustomTypes = {
409
- Name: "placeholder";
410
- Editor: PlaceholderEditor;
411
- };
412
-
413
- declare function createImageMethods(editor: Editor): {
414
- noop: () => void;
415
- insertImageFromUrl: (url: string, alt?: string | undefined, title?: string | undefined) => void;
416
- };
417
-
418
- type ImageSize = {
419
- width: number;
420
- height: number;
421
- };
422
- type ImageMethods = ReturnType<typeof createImageMethods>;
423
- type ImagePluginConfig = {
424
- /**
425
- * When an image is uploaded, the plugin needs to decide whether the image
426
- * should be an inline image (like an icon that displays within a line of
427
- * text) or a block image (like a photo that appears as its own block).
428
- *
429
- * This setting is the maximum size of an image for it to be defaulted to an
430
- * inline image.
431
- *
432
- * NOTE:
433
- *
434
- * The user can convert an image from one image type to the other manually.
435
- */
436
- maxInitialInlineImageSize: ImageSize;
437
- /**
438
- * When an image is first uploaded, it may come in at a large size but for
439
- * some applications, you don't want the image to overwhelm the page,
440
- * like when the editor is visually a small size.
441
- *
442
- * This specifies the maximum initial size when an image is first uploaded
443
- * to the page. The user can resize to a larger size.
444
- *
445
- * If the value is null, the image will be displayed at full size.
446
- *
447
- * NOTE:
448
- *
449
- * This is the displayed image width. On retina displays, the actualy image
450
- * file delivered to the browser may be a multiple of the provided value.
451
- */
452
- maxInitialImageSize: ImageSize | null;
453
- /**
454
- * When an image is displayed at full size, you may still want to limit the
455
- * size of the image file.
456
- *
457
- * NOTE:
458
- *
459
- * This is the maximum visual image
460
- */
461
- maxImageSize: ImageSize;
462
- imageBlockPresets: ImageSizePreset[];
463
- imageInlinePresets: ImageSizePreset[];
464
- };
465
- type ImagePluginOptions = {
466
- image: Partial<ImagePluginConfig>;
467
- };
468
- type ImageEditor = {
469
- image: ImageMethods & ImagePluginConfig;
470
- };
471
- type ImageSharedElement = {
472
- /**
473
- * The `url` represents either
474
- *
475
- * - a `hashUrl` that begins with a `#` during the upload process which
476
- * represents a unique id reference to a Zustand store where the actual
477
- * information about the upload is kept.
478
- * - The actual `url` of the uploaded file. When the file is saved, the
479
- * `hashUrl` will be converted to the actual `url` of the file.
480
- */
481
- url: string;
482
- title?: string;
483
- alt?: string;
484
- bytes?: number;
485
- /**
486
- * If the `maxWidth` and `maxHeight` are present, it indicates that the image
487
- * is resizable.
488
- *
489
- * If they are not present, it indicates that the `width` and `height` should
490
- * be used, but they cannot be resized.
491
- *
492
- * If the `width` and `height` are also not present, it indicates we are not
493
- * aware of the current size of the image, so just display it.
494
- */
495
- srcWidth?: number;
496
- srcHeight?: number;
497
- width?: number;
498
- height?: number;
499
- children: Descendant[];
500
- };
501
- /**
502
- * Default for larger images, over 48px
503
- *
504
- * Larger images can be converted to inline images though.
505
- */
506
- type ImageBlockElement = {
507
- type: "image-block";
508
- } & ImageSharedElement;
509
- /**
510
- * Default for smaller images, 48px and less
511
- *
512
- * Smaller images can be converted to block images though.
513
- */
514
- type ImagePluginCustomTypes = {
515
- Name: "image";
516
- Editor: ImageEditor;
517
- Element: ImageBlockElement;
518
- Options: ImagePluginOptions;
519
- };
520
- /**
521
- * A preset is defined either as a bound or as a scale:
522
- *
523
- * - bounds: The image will be placed within the bounds.
524
- * - scale: The image will be scaled to the given `scale` value. The max
525
- * value should be `1`.
526
- */
527
- type ImageSizePreset = {
528
- name: string;
529
- title: string;
530
- type: "bounds";
531
- width: number;
532
- height: number;
533
- } | {
534
- name: string;
535
- title: string;
536
- type: "scale";
537
- scale: number;
538
- };
539
-
540
- type ToolbarEditor = {
541
- toolbar: {
542
- height?: string | number;
543
- minHeight?: string | number;
544
- maxHeight?: string | number;
545
- showUploadButtons?: boolean;
546
- };
547
- };
548
- type ToolbarOptions = {
549
- toolbar: {
550
- height?: string | number;
551
- minHeight?: string | number;
552
- maxHeight?: string | number;
553
- showUploadButtons?: boolean;
554
- };
555
- };
556
- type ToolbarPluginCustomTypes = {
557
- Name: "toolbar";
558
- Editor: ToolbarEditor;
559
- Options: ToolbarOptions;
560
- };
561
-
562
- type ThemeEditor = {
563
- theme: true;
564
- };
565
- type ThemePluginCustomTypes = {
566
- Name: "theme";
567
- Editor: ThemeEditor;
568
- };
569
-
570
- type CollapsibleParagraphEditor = {
571
- collapsibleParagraph: {
572
- convertParagraph: () => void;
573
- };
574
- };
575
- type ParagraphElement = {
576
- type: "paragraph";
577
- __collapsible?: true;
578
- children: Descendant[];
579
- };
580
- type CollapsibleParagraphPluginCustomTypes = {
581
- Name: "collapsible-paragraph";
582
- Editor: CollapsibleParagraphEditor;
583
- Element: ParagraphElement;
584
- };
585
-
586
- type NormalizeAfterDeleteEditor = {
587
- normalizeAfterDelete: true;
588
- };
589
- type NormalizeAfterDeletePluginCustomTypes = {
590
- Name: "normalize-after-delete";
591
- Editor: NormalizeAfterDeleteEditor;
592
- };
593
-
594
- type AtomicDeleteEditor = {
595
- atomicDelete: true;
596
- };
597
- type AtomicDeletePluginCustomTypes = {
598
- Name: "atomic-delete";
599
- Editor: AtomicDeleteEditor;
600
- };
601
-
602
- declare function createListMethods(editor: Editor): {
603
- indent: () => boolean;
604
- outdent: () => boolean;
605
- convertUnorderedList: (allowToggle: boolean) => void;
606
- convertOrderedList: (allowToggle: boolean) => void;
607
- convertTaskList: (allowToggle: boolean) => void;
608
- insertBreak: () => boolean;
609
- toggleTaskListItem: (args_0?: {
610
- at?: BetterAt | undefined;
611
- } | undefined) => false | undefined;
612
- getListDepth: () => number;
613
- canIncreaseDepth: () => boolean;
614
- canDecreaseDepth: () => boolean;
615
- increaseDepth: () => void;
616
- decreaseDepth: () => void;
617
- };
618
-
619
- /**
620
- * List Editor
621
- */
622
- type ListEditor = {
623
- list: ReturnType<typeof createListMethods>;
624
- };
625
- /**
626
- * Ordered List Item Element
627
- */
628
- type OrderedListItemElement = {
629
- type: "ordered-list-item";
630
- depth: number;
631
- __firstAtDepth?: boolean;
632
- children: Descendant[];
633
- };
634
- /**
635
- * Unordered List Item Element
636
- */
637
- type UnorderedListItemElement = {
638
- type: "unordered-list-item";
639
- depth: number;
640
- __firstAtDepth?: boolean;
641
- children: Descendant[];
642
- };
643
- /**
644
- * Checkable Task List Item Element
645
- */
646
- type TaskListItemElement = {
647
- type: "task-list-item";
648
- depth: number;
649
- __firstAtDepth?: boolean;
650
- checked: boolean;
651
- children: Descendant[];
652
- };
653
- /**
654
- * List Plugins Custom Types
655
- */
656
- type ListPluginCustomTypes = {
657
- Name: "list";
658
- Editor: ListEditor;
659
- Element: OrderedListItemElement | UnorderedListItemElement | TaskListItemElement;
660
- };
661
-
662
- declare function createHorizontalRuleMethods(editor: Editor): {
663
- insertHorizontalRule: () => boolean;
664
- };
665
-
666
- type HorizontalRuleMethods = ReturnType<typeof createHorizontalRuleMethods>;
667
- type HorizontalRuleEditor = {
668
- horizontalRule: HorizontalRuleMethods;
669
- };
670
- type HorizontalRuleElement = {
671
- type: "horizontal-rule";
672
- children: [{
673
- text: "";
674
- }];
675
- };
676
- type HorizontalRulePluginCustomTypes = {
677
- Name: "horizontal-rule";
678
- Editor: HorizontalRuleEditor;
679
- Element: HorizontalRuleElement;
680
- };
681
-
682
- /**
683
- * Alignment of Table Columns
684
- */
685
- type TableColumnAlign = "left" | "center" | "right";
686
- /**
687
- * Table Column values
688
- */
689
- type TableColumn = {
690
- align: TableColumnAlign;
691
- };
692
- /**
693
- * Table Element
694
- */
695
- type TableElement = {
696
- type: "table";
697
- columns: TableColumn[];
698
- children: TableRowElement[];
699
- };
700
- /**
701
- * Table Row Element
702
- */
703
- type TableRowElement = {
704
- type: "table-row";
705
- children: TableCellElement[];
706
- };
707
- /**
708
- * Table Cell Element
709
- *
710
- * The children of a `TdElement` is exactly one `ParagraphElement`.
711
- *
712
- * This is a good choice for Slate because copying and pasting a range of
713
- * elements will split the lowest child element by default. If the child of
714
- * a `TdElement` is a leaf, then we split the `TdElement` which is never what
715
- * we want.
716
- *
717
- * Instead, by having a lower level element, the `ParagraphElement`, we allow
718
- * that to be split.
719
- *
720
- * But of course, insertion means we have many child elements in the `TdElement`
721
- * but these are easier to fix using normalization. We can keep iterating
722
- * through normalizations until we end up with a single Paragraph.
723
- */
724
- type TableCellElement = {
725
- type: "table-cell";
726
- x?: number;
727
- y?: number;
728
- children: TableContentElement[];
729
- };
730
- type TableContentElement = {
731
- type: "table-content";
732
- children: Descendant[];
733
- };
734
-
735
- /**
736
- * The TableInfo object that includes quick access information starting from a
737
- * cell in a table including information about the row and the table.
738
- *
739
- * NOTE:
740
- *
741
- * This is flat and not nested because it makes destructuring easier, for
742
- * example, in the table methods.
743
- */
744
- type TableInfo = {
745
- tableElement: TableElement;
746
- tablePath: Path;
747
- tableColumns: TableColumn[];
748
- rowElement: TableRowElement;
749
- rowPath: Path;
750
- rowIndex: number;
751
- rowCount: number;
752
- cellElement: TableCellElement;
753
- cellPath: Path;
754
- cellIndex: number;
755
- cellCount: number;
756
- };
757
-
758
- declare function createAnchorMethods(editor: Editor): {
759
- insertLink: (args_0: string, args_1?: string | undefined, args_2?: {
760
- select?: boolean | undefined;
761
- title?: string | undefined;
762
- } | undefined) => void;
763
- removeLink: (args_0: {
764
- at?: BetterAt | undefined;
765
- }) => boolean;
766
- editLink: (args_0: {
767
- href: string;
768
- title?: string | undefined;
769
- text?: string | undefined;
770
- }, args_1: {
771
- at?: BetterAt | undefined;
772
- }) => boolean;
773
- };
774
-
775
- type AnchorMethods = ReturnType<typeof createAnchorMethods>;
776
- type AnchorEditor = {
777
- anchor: AnchorMethods;
778
- };
779
- type AnchorElement = {
780
- type: "anchor";
781
- href: string;
782
- target?: string;
783
- title?: string;
784
- children: Descendant[];
785
- };
786
- type AnchorPluginCustomTypes = {
787
- Name: "anchor";
788
- Editor: AnchorEditor;
789
- Element: AnchorElement;
790
- };
791
-
792
- declare function createHeadingMethods(editor: Editor): {
793
- convertHeading: (level: 1 | 2 | 3 | 4 | 5 | 6, allowToggle: boolean) => void;
794
- isHeadingActive: (level: 1 | 2 | 3 | 4 | 5 | 6) => boolean;
795
- };
796
-
797
- type HeadingEditor = {
798
- heading: ReturnType<typeof createHeadingMethods>;
799
- };
800
- type HeadingElement = {
801
- type: "heading";
802
- /**
803
- * NOTE:
804
- *
805
- * Don't extract these into a new type. It's easier to just repeat this and
806
- * there's less indirection.
807
- */
808
- level: 1 | 2 | 3 | 4 | 5 | 6;
809
- children: Descendant[];
810
- };
811
- type HeadingPluginCustomTypes = {
812
- Name: "heading";
813
- Editor: HeadingEditor;
814
- Element: HeadingElement;
815
- };
816
-
817
- type BlockQuoteEditor = {
818
- supportsBlockQuote: true;
819
- blockQuotePlugin: {
820
- indent: () => void;
821
- outdent: () => void;
822
- isActive: () => boolean;
823
- increaseDepth: () => void;
824
- decreaseDepth: () => void;
825
- canIncreaseDepth: () => boolean;
826
- canDecreaseDepth: () => boolean;
827
- };
828
- };
829
- type BlockQuoteElement = {
830
- type: "block-quote";
831
- children: Descendant[];
832
- };
833
- type BlockQuotePluginCustomTypes = {
834
- Name: "block-quote";
835
- Editor: BlockQuoteEditor;
836
- Element: BlockQuoteElement;
837
- };
838
-
839
- declare function createCodeBlockMethods(editor: Editor): {
840
- createCodeBlock: (args_0: {
841
- language: BuiltInLanguage;
842
- }) => void;
843
- setCodeBlockLanguage: (language: BuiltInLanguage, options?: {
844
- at?: BetterAt | undefined;
845
- } | undefined) => boolean;
846
- };
847
-
848
- type CodeBlockMethods = ReturnType<typeof createCodeBlockMethods>;
849
- type BuiltInLanguage = "text" | "html" | "svg" | "markup" | "css" | "javascript" | "js" | "java" | "c" | "clike";
850
- type CodeBlockEditor = {
851
- codeBlock: CodeBlockMethods;
852
- };
853
- /**
854
- * The code block element is the root element of a code block.
855
- */
856
- type CodeBlockElement = {
857
- type: "code-block";
858
- /**
859
- * The language of the code block. Can accept any string because Markdown can
860
- * accept any string; however, the built-in Prism languages are defined in:
861
- * `BuiltInLanguage`
862
- */
863
- language: string;
864
- children: CodeBlockLineElement[];
865
- };
866
- type CodeBlockLineElement = {
867
- type: "code-block-line";
868
- children: Text[];
869
- };
870
- type CodeBlockPluginCustomTypes = {
871
- Name: "code-block";
872
- Editor: CodeBlockEditor;
873
- Element: CodeBlockElement | CodeBlockLineElement;
874
- Text: {
875
- text: string;
876
- prismToken?: string;
877
- };
878
- };
879
-
880
- /**
881
- * HTML block element for preserving raw HTML content
882
- */
883
- type HtmlBlockElement = {
884
- type: "html-block";
885
- /**
886
- * The raw HTML content
887
- */
888
- html: string;
889
- children: Text[];
890
- };
891
- type HtmlBlockPluginCustomTypes = {
892
- Name: "html-block";
893
- Editor: Record<string, never>;
894
- Element: HtmlBlockElement;
895
- };
896
-
897
- declare function createTableMethods(editor: Editor): {
898
- getTableInfo: (args_0?: {
899
- at?: ImageBlockElement | ParagraphElement | OrderedListItemElement | UnorderedListItemElement | TaskListItemElement | HorizontalRuleElement | TableElement | TableRowElement | TableCellElement | TableContentElement | HtmlBlockElement | CodeBlockElement | CodeBlockLineElement | BlockQuoteElement | HeadingElement | AnchorElement | slate.Location | null | undefined;
900
- } | undefined) => TableInfo | undefined;
901
- insertTable: (args_0: number, args_1: number, args_2?: {
902
- at?: slate.Location | null | undefined;
903
- } | undefined) => boolean;
904
- insertColumn: (args_0?: {
905
- offset?: 0 | 1 | undefined;
906
- at?: BetterAt | undefined;
907
- } | undefined) => boolean;
908
- insertRow: (args_0?: {
909
- at?: BetterAt | undefined;
910
- offset?: 0 | 1 | undefined;
911
- } | undefined) => boolean;
912
- removeTable: () => boolean;
913
- removeColumn: (args_0?: {
914
- at?: BetterAt | undefined;
915
- } | undefined) => boolean | undefined;
916
- removeRow: (args_0?: {
917
- at?: BetterAt | undefined;
918
- } | undefined) => boolean;
919
- tabForward: () => boolean;
920
- tabBackward: () => boolean | undefined;
921
- shiftEnterForward: () => boolean;
922
- selectCell: (args_0?: {
923
- at?: BetterAt | undefined;
924
- } | undefined) => boolean;
925
- down: () => boolean;
926
- up: () => boolean;
927
- setTableColumnAlign: (options: {
928
- align: "center" | "left" | "right";
929
- }) => boolean;
930
- };
931
-
932
- type TableEditor = {
933
- supportsTable: true;
934
- tablePlugin: ReturnType<typeof createTableMethods>;
935
- };
936
- type TablePluginCustomTypes = {
937
- Name: "table";
938
- Editor: TableEditor;
939
- Element: TableElement | TableRowElement | TableCellElement | TableContentElement;
940
- };
941
-
942
- type InlineCodeEditor = {
943
- inlineCode: {
944
- toggleInlineCode: () => void;
945
- };
946
- };
947
- type InlineCodeText = {
948
- text: string;
949
- code?: true;
950
- };
951
- type InlineCodePluginCustomTypes = {
952
- Name: "inline-code";
953
- Editor: InlineCodeEditor;
954
- Text: InlineCodeText;
955
- };
956
-
957
- declare function createMarksMethods(editor: Editor): {
958
- removeMarks: (args_0?: {
959
- at?: slate.Location | null | undefined;
960
- } | undefined) => void;
961
- toggleMark: (args_0: "bold" | "strike" | "text" | "prismToken" | "code" | "italic" | "underline" | "highlight", args_1?: "bold" | "strike" | "text" | "prismToken" | "code" | "italic" | "underline" | "highlight" | undefined, args_2?: {
962
- at?: slate.Location | null | undefined;
963
- } | undefined) => void;
964
- toggleBold: () => void;
965
- toggleItalic: () => void;
966
- toggleUnderline: () => void;
967
- toggleStrike: () => void;
968
- toggleHighlight: () => void;
969
- };
970
-
971
- type MarksEditor = {
972
- /**
973
- * IMPORTANT:
974
- *
975
- * This cannot be named `marks` because it conflicts with the `editor.marks`
976
- * built into the BaseEditor.j
977
- */
978
- marksPlugin: ReturnType<typeof createMarksMethods>;
979
- activeMarks?: {
980
- bold?: boolean;
981
- italic?: boolean;
982
- underline?: boolean;
983
- strike?: boolean;
984
- };
985
- };
986
- type MarksText = {
987
- text: string;
988
- bold?: true;
989
- italic?: true;
990
- underline?: true;
991
- strike?: true;
992
- highlight?: true;
993
- };
994
- type MarksPluginCustomTypes = {
995
- Name: "marks";
996
- Editor: MarksEditor;
997
- Text: MarksText;
998
- };
999
-
1000
- /**
1001
- * A type with generic for `convertElements` (below) to be used with the curry
1002
- * method. TypeScript, unfortunately, cannot automatically curry generics for
1003
- * us so we have to do it manually.
1004
- */
1005
- type CurriedConvertElements = <T extends Element$1 = Element$1>(matchForToggle: (element: Element$1) => boolean, targetElement: TargetElement<T>, allowToggle: boolean) => void;
1006
-
1007
- declare function createConvertElementMethods(editor: Editor): {
1008
- convertElementTypes: string[];
1009
- addConvertElementType: (type: "anchor" | "heading" | "block-quote" | "html-block" | "table" | "horizontal-rule" | "code-block" | "paragraph" | "image-block" | "ordered-list-item" | "unordered-list-item" | "task-list-item" | "table-row" | "table-cell" | "table-content" | "code-block-line" | ("anchor" | "heading" | "block-quote" | "html-block" | "table" | "horizontal-rule" | "code-block" | "paragraph" | "image-block" | "ordered-list-item" | "unordered-list-item" | "task-list-item" | "table-row" | "table-cell" | "table-content" | "code-block-line")[]) => void;
1010
- isConvertibleElement: (element: ImageBlockElement | ParagraphElement | OrderedListItemElement | UnorderedListItemElement | TaskListItemElement | HorizontalRuleElement | TableElement | TableRowElement | TableCellElement | TableContentElement | HtmlBlockElement | CodeBlockElement | CodeBlockLineElement | BlockQuoteElement | HeadingElement | AnchorElement) => boolean;
1011
- convertElements: CurriedConvertElements;
1012
- };
1013
-
1014
- type ConvertElementEditor = {
1015
- convertElement: ReturnType<typeof createConvertElementMethods>;
1016
- };
1017
- type ConvertElementPluginCustomTypes = {
1018
- Name: "convert-element";
1019
- Editor: ConvertElementEditor;
1020
- };
1021
-
1022
- declare function createPasteMarkdownMethods(editor: Editor): {
1023
- pasteMarkdown: (markdown: string) => void;
1024
- };
1025
-
1026
- type PasteMarkdownMethods = ReturnType<typeof createPasteMarkdownMethods>;
1027
- type PasteMarkdownEditor = {
1028
- pasteMarkdown: PasteMarkdownMethods;
1029
- };
1030
- type PasteMarkdownPluginCustomTypes = {
1031
- Name: "paste-markdown";
1032
- Editor: PasteMarkdownEditor;
1033
- };
1034
-
1035
- /**
1036
- * @deprecated Use defaultPlugins instead
1037
- */
1038
- declare const plugins: (TypedPlugin<PasteMarkdownPluginCustomTypes> | TypedPlugin<ConvertElementPluginCustomTypes> | TypedPlugin<AnchorPluginCustomTypes> | TypedPlugin<HeadingPluginCustomTypes> | TypedPlugin<MarksPluginCustomTypes> | TypedPlugin<InlineCodePluginCustomTypes> | TypedPlugin<BlockQuotePluginCustomTypes> | TypedPlugin<CodeBlockPluginCustomTypes> | TypedPlugin<HtmlBlockPluginCustomTypes> | TypedPlugin<TablePluginCustomTypes> | TypedPlugin<HorizontalRulePluginCustomTypes> | TypedPlugin<{
1039
- Name: "trailing-block";
1040
- Editor: {
1041
- allowTrailingBlock: true;
1042
- };
1043
- }> | TypedPlugin<ListPluginCustomTypes> | TypedPlugin<AtomicDeletePluginCustomTypes> | TypedPlugin<NormalizeAfterDeletePluginCustomTypes> | TypedPlugin<CollapsibleParagraphPluginCustomTypes> | TypedPlugin<ThemePluginCustomTypes> | TypedPlugin<ToolbarPluginCustomTypes> | TypedPlugin<ImagePluginCustomTypes> | TypedPlugin<PlaceholderPluginCustomTypes>)[];
1044
- type PluginTypes = ExtractCustomTypes<typeof plugins>;
1045
- type CustomEditor = PluginTypes["Editor"];
1046
- type CustomElement = PluginTypes["Element"];
1047
- type CustomText = PluginTypes["Text"];
1048
- declare module "slate" {
1049
- interface CustomTypes {
1050
- Editor: BaseEditor & ReactEditor & HistoryEditor & CustomEditor & WysimarkEditor;
1051
- Element: CustomElement;
1052
- Text: BaseText & CustomText;
1053
- }
1054
- }
1055
-
1056
- type OnImageChangeHandler = (file: File) => Promise<string>;
1057
- type EditableProps = {
1058
- editor: Editor;
1059
- value: string;
1060
- onChange: (markdown: string) => void;
1061
- throttleInMs?: number;
1062
- placeholder?: string;
1063
- className?: string;
1064
- style?: React.CSSProperties;
1065
- onImageChange?: OnImageChangeHandler;
1066
- };
1067
- declare function Editable({ editor, value, onChange, throttleInMs, placeholder, className, style, onImageChange, }: EditableProps): react_jsx_runtime.JSX.Element;
1068
-
1069
- /**
1070
- * The options passed into the standalone version of Wysimark.
1071
- */
1072
- type StandaloneOptions = Parameters<typeof useEditor>[0] & {
1073
- onChange?: (markdown: string) => void;
1074
- placeholder?: string;
1075
- initialMarkdown?: string;
1076
- className?: string;
1077
- };
1078
- /**
1079
- * The object returned by `createWysimark`
1080
- */
1081
- type Wysimark = {
1082
- unmount: () => void;
1083
- getMarkdown: () => string;
1084
- setMarkdown: (markdown: string) => void;
1085
- };
1086
- /**
1087
- * The primary entry point for the standalone version of Wysimark.
1088
- */
1089
- declare function createWysimark(containerElement: HTMLElement, options: StandaloneOptions): Wysimark;
1090
-
1091
- export { Editable, OnImageChangeHandler, Wysimark, createWysimark, useEditor };