1 | import { ValidOptions, GetDynamic, AnyConstructor, GetPartialDynamic, CommandFunction, AnyFunction, EditorStateProps, Transaction, EditorState, GetFixedDynamic, RemoveAnnotations, PrimitiveSelection, GetCustomHandler, Dispose, GetHandler, LiteralUnion, Primitive, EmptyShape, Shape, GetFixed, IfNoRequiredProperties, GetStatic, GetConstructorProps, MakeUndefined, UndefinedFlipPartialAndRequired, StringKey, GetAcceptUndefined, EditorView, MarkType, ApplySchemaAttributes, MarkSpecOverride, MarkExtensionSpec, NodeType, NodeSpecOverride, NodeExtensionSpec, Replace, IfHasRequiredProperties, IfEmpty, StaticKeyList, HandlerKeyList, CustomHandlerKeyList, NonChainableCommandFunction, UnionToIntersection, ConditionalPick, Flavoring, ConditionalReturnPick, ProsemirrorAttributes, KeyBindingCommandFunction, Listable, CommandFunctionProps, MarkTypeProps, AttributesProps, FromToProps, Static, RemirrorContentType, ProsemirrorNode, Fragment, AcceptUndefined, Handler, MakeRequired, StateJSON, RemirrorJSON, ProsemirrorPlugin, CustomHandler, KeyBindingProps, KeyBindings, NodeViewMethod, SchemaAttributes, EditorSchema, UseDefault, GetStaticAndDynamic, ValueOf, Simplify, TransactionTransformer, EditorViewProps, TextProps, TransactionProps } from '@remirror/core-types';
|
2 | export * from '@remirror/core-types';
|
3 | import { ExtensionPriority, __INTERNAL_REMIRROR_IDENTIFIER_KEY__, RemirrorIdentifier, NamedShortcut, ExtensionTagType, ManagerPhase } from '@remirror/core-constants';
|
4 | export * from '@remirror/core-constants';
|
5 | import { PluginSpec, PluginKey, Plugin, EditorState as EditorState$1, Transaction as Transaction$1 } from '@remirror/pm/state';
|
6 | import { I18n } from '@remirror/i18n';
|
7 | import { CoreIcon } from '@remirror/icons';
|
8 | export { CoreIcon } from '@remirror/icons';
|
9 | import { ToggleBlockItemProps, RemoveMarkProps, ReplaceTextProps, ShouldSkipFunction, CustomDocumentProps, InvalidContentHandler, StringHandler, NamedStringHandlers, StringHandlerProps } from '@remirror/core-utils';
|
10 | export * from '@remirror/core-utils';
|
11 | import { Mark, NodeType as NodeType$1 } from '@remirror/pm/model';
|
12 | import { EditorView as EditorView$1, DecorationSet, DirectEditorProps } from '@remirror/pm/view';
|
13 | import { InputRule } from '@remirror/pm/inputrules';
|
14 | import { PasteRule } from '@remirror/pm/paste-rules';
|
15 | import { Suggester, SuggestState } from '@remirror/pm/suggest';
|
16 | import { ProsemirrorPlugin as ProsemirrorPlugin$1 } from '@remirror/pm';
|
17 | import { Unsubscribe } from 'nanoevents';
|
18 | export * from '@remirror/core-helpers';
|
19 |
|
20 | type Changes<Type> = {
|
21 | /**
|
22 | * Whether or not the value has changed.
|
23 | *
|
24 | * - `false` when no change occurred.
|
25 | */
|
26 | changed: false;
|
27 | } | {
|
28 | /**
|
29 | * - `true` when a change occurred.
|
30 | */
|
31 | changed: true;
|
32 | /**
|
33 | * The previous value before the changed. This is only accessible when
|
34 | * `changed` is `true`.
|
35 | */
|
36 | previousValue: Type;
|
37 | /**
|
38 | * The latest value after the change. This is only accessible when
|
39 | * `changed` is `true`.
|
40 | */
|
41 | value: Type;
|
42 | };
|
43 | /**
|
44 | * Highlights all the properties that have changed.
|
45 | */
|
46 | type ChangedOptions<Options extends ValidOptions> = {
|
47 | [Key in keyof GetDynamic<Options>]: Changes<GetDynamic<Options>[Key]>;
|
48 | };
|
49 | /**
|
50 | * Get the static extension settings.
|
51 | */
|
52 | type GetOptions<Type extends {
|
53 | ['~O']: unknown;
|
54 | }> = Type['~O'];
|
55 | /**
|
56 | * Get the commands from a `RemirrorManager`, `Extension` or `Preset`.
|
57 | */
|
58 | type GetCommands<Type extends {
|
59 | ['~C']: unknown;
|
60 | }> = Type['~C'];
|
61 | /**
|
62 | * Get the helpers provided by an from a `RemirrorManager`, `Extension` or
|
63 | * `Preset`.
|
64 | */
|
65 | type GetHelpers<Type extends {
|
66 | ['~H']: unknown;
|
67 | }> = Type['~H'];
|
68 | /**
|
69 | * Get the constructor of an instance.
|
70 | */
|
71 | type GetConstructor<Type extends {
|
72 | constructor: unknown;
|
73 | }> = Type['constructor'];
|
74 | /**
|
75 | * Get the options from any constructor. Can be used for both presets and
|
76 | * extensions.
|
77 | */
|
78 | type OptionsOfConstructor<Constructor extends AnyConstructor> = GetOptions<InstanceType<Constructor>>;
|
79 | /**
|
80 | * Get the options from any constructor. Can be used for both presets and
|
81 | * extensions.
|
82 | */
|
83 | type DynamicOptionsOfConstructor<Constructor extends AnyConstructor> = GetPartialDynamic<GetOptions<InstanceType<Constructor>>>;
|
84 | /**
|
85 | * The extension store which is shared across all extensions. It provides access
|
86 | * to methods and data that can be used throughout the extension lifecycle.
|
87 | */
|
88 | interface ExtensionStore$1 extends Remirror.ExtensionStore {
|
89 | }
|
90 | type ExtensionCommandFunction = (...args: any[]) => CommandFunction;
|
91 | /**
|
92 | * The return signature for an extensions command method.
|
93 | */
|
94 | interface ExtensionCommandReturn {
|
95 | [command: string]: ExtensionCommandFunction;
|
96 | }
|
97 | /**
|
98 | * The return signature for an extensions helper method.
|
99 | */
|
100 | interface ExtensionHelperReturn {
|
101 | [helper: string]: AnyFunction;
|
102 | }
|
103 | /**
|
104 | * The type of a non chainable command. It is a function with an `isEnabled`
|
105 | * method to check whether the command can be run.
|
106 | */
|
107 | interface CommandShape<Parameter extends any[] = []> {
|
108 | /**
|
109 | * Returns true when the command can be run and false when it can't be run. It
|
110 | * basically runs the command without dispatching it to see whether it returns
|
111 | * true or false.
|
112 | *
|
113 | * @remarks
|
114 | *
|
115 | * Some commands can have rules and restrictions. For example, formatting like
|
116 | *`bold` is disabled within a `codeBlock`. In this case
|
117 | *`commands.toggleBold.isEnabled()` returns `false` when within a `codeBlock`
|
118 | *and `true` when outside.
|
119 | *
|
120 | * @param args - The same arguments that are applied to the command function.
|
121 | */
|
122 | enabled: (...args: Parameter) => boolean;
|
123 | /**
|
124 | * @deprecated use `enabled` instead.
|
125 | */
|
126 | isEnabled: (...args: Parameter) => boolean;
|
127 | /**
|
128 | * This function gives you access to the original command defined by the
|
129 | * extension in your editor exactly as it was defined.
|
130 | *
|
131 | * The function returns a function that takes the CommandFunctionProps of
|
132 | * `{ state, dispatch?, tr, view? }` object.
|
133 | *
|
134 | * ```ts
|
135 | * function command(...args: any[]) => CommandFunction;
|
136 | * ```
|
137 | */
|
138 | original: (...args: Parameter) => CommandFunction;
|
139 | /**
|
140 | * Commands which are not attached to a node extension or a mark extension can
|
141 | * optionally define custom `isActive` checker.
|
142 | *
|
143 | * This is used for checking if `centerAlign` is active from the
|
144 | * `@remirror/extension-node-formatting`.
|
145 | */
|
146 | active?: () => boolean;
|
147 | (...args: Parameter): void;
|
148 | }
|
149 | interface ApplyStateLifecycleProps extends EditorStateProps {
|
150 | /**
|
151 | * The original transaction which caused this state update.
|
152 | */
|
153 | tr: Transaction;
|
154 | /**
|
155 | * The previous state.
|
156 | */
|
157 | previousState: EditorState;
|
158 | }
|
159 | interface AppendLifecycleProps extends EditorStateProps {
|
160 | /**
|
161 | * Update this transaction in order to append.
|
162 | */
|
163 | tr: Transaction;
|
164 | /**
|
165 | * The previous state.
|
166 | */
|
167 | previousState: EditorState;
|
168 | /**
|
169 | * The transactions that have already been applied.
|
170 | */
|
171 | transactions: readonly Transaction[];
|
172 | }
|
173 | interface StateUpdateLifecycleProps extends EditorStateProps {
|
174 | /**
|
175 | * The previous state.
|
176 | */
|
177 | previousState: EditorState;
|
178 | /**
|
179 | * When true, this lets you know that it is the first state update to happen.
|
180 | * This can be used to run an action that should only be run when the state is
|
181 | * first available.
|
182 | */
|
183 | firstUpdate: boolean;
|
184 | /**
|
185 | * The original transaction which caused this state update.
|
186 | *
|
187 | * This allows for inspecting the reason behind the state change.
|
188 | * When undefined this means that the state was updated externally.
|
189 | *
|
190 | * If available:
|
191 | * - Metadata on the transaction can be inspected. `tr.getMeta`
|
192 | * - Was the change caused by added / removed content? `tr.docChanged`
|
193 | * - Was ths change caused by an updated selection? `tr.selectionSet`
|
194 | * - `tr.steps` can be inspected for further granularity.
|
195 | */
|
196 | tr?: Transaction;
|
197 | /**
|
198 | * When the state updates are not controlled and it was a transaction that
|
199 | * caused the state to be updated this value captures all the transaction
|
200 | * updates caused by prosemirror plugins hook state methods like
|
201 | * `filterTransactions` and `appendTransactions`.
|
202 | *
|
203 | * This is for advanced users only, and I personally have never needed it.
|
204 | */
|
205 | transactions?: readonly Transaction[];
|
206 | }
|
207 | interface BaseExtensionOptions extends Remirror.BaseExtensionOptions {
|
208 | /**
|
209 | * An object which excludes certain functionality from an extension.
|
210 | */
|
211 | exclude?: ExcludeOptions$1;
|
212 | /**
|
213 | * The priority with which this extension should be loaded by the manager.
|
214 | *
|
215 | * @remarks
|
216 | *
|
217 | * Each priority level corresponds to a higher level of importance for the
|
218 | * extension within the editor.
|
219 | *
|
220 | * When this is set to `null` the `defaultPriority` level for the extension
|
221 | * will be used instead.
|
222 | */
|
223 | priority?: ExtensionPriority;
|
224 | }
|
225 | interface ExcludeOptions$1 extends Partial<Remirror.ExcludeOptions> {
|
226 | }
|
227 | /**
|
228 | * @internal
|
229 | */
|
230 | type UpdateReason = 'set' | 'reset';
|
231 | interface UpdateReasonProps {
|
232 | /**
|
233 | * Describes what triggered an update.
|
234 | *
|
235 | * - `set` - the change was triggered by an update in some properties
|
236 | * - `reset` - the user has specifically requested to reset all properties to
|
237 | * their initial defaults
|
238 | * - `init` - the update is happening when the preset is being It will receive
|
239 | * all the items as changes.
|
240 | */
|
241 | reason: UpdateReason;
|
242 | }
|
243 | interface GetChangeOptionsReturn<Options extends ValidOptions> {
|
244 | /**
|
245 | * The next value of the properties after the update.This also includes values
|
246 | * which have not been changed.
|
247 | */
|
248 | options: GetFixedDynamic<Options>;
|
249 | /**
|
250 | * An object with all the keys showing what's been changed. This should be
|
251 | * used to determine the children extensions which should be updated.
|
252 | *
|
253 | * @remarks
|
254 | *
|
255 | * Using this can prevent unnecessary updates. It's possible for new
|
256 | * properties to be passed that are identical to the previous, by checking if
|
257 | * the object was changed this can be avoided.
|
258 | *
|
259 | * This uses a discriminated union. When the `changed` property is true then
|
260 | * the object has a value as well.
|
261 | *
|
262 | * ```ts
|
263 | * if (changes.myProperty.changed) {
|
264 | * doSomething(changes.myProperty.value);
|
265 | * }
|
266 | * ```
|
267 | */
|
268 | changes: Readonly<Required<ChangedOptions<Options>>>;
|
269 | /**
|
270 | * Pick the changed values by their key. An object populated with only the
|
271 | * changed items will be returned to you.
|
272 | */
|
273 | pickChanged: PickChanged<Options>;
|
274 | }
|
275 | type PickChanged<Options extends ValidOptions> = <Key extends keyof GetFixedDynamic<Options>>(keys: Key[]) => Partial<Pick<GetFixedDynamic<Options>, Key>>;
|
276 | interface OnSetOptionsProps<Options extends ValidOptions> extends Pick<GetChangeOptionsReturn<Options>, 'changes' | 'pickChanged'>, UpdateReasonProps {
|
277 | /**
|
278 | * The initial options for the extension. Falls back to default options.
|
279 | */
|
280 | initialOptions: RemoveAnnotations<GetFixedDynamic<Options>>;
|
281 | /**
|
282 | * The next value of the properties after the update.This also includes values
|
283 | * which have not been changed.
|
284 | */
|
285 | options: RemoveAnnotations<GetFixedDynamic<Options>>;
|
286 | }
|
287 | declare global {
|
288 | namespace Remirror {
|
289 | /**
|
290 | * A global type which allows setting additional options on the exclude.
|
291 | */
|
292 | interface ExcludeOptions {
|
293 | }
|
294 | /**
|
295 | * A global type which allows additional default settings to be added to the
|
296 | * editor.
|
297 | */
|
298 | interface BaseExtensionOptions {
|
299 | }
|
300 | }
|
301 | }
|
302 | /**
|
303 | * An interface for creating custom plugins in your `remirror` editor.
|
304 | */
|
305 | interface CreateExtensionPlugin<PluginState = any> extends Pick<PluginSpec<PluginState>, 'props' | 'state' | 'key' | 'view' | 'filterTransaction' | 'appendTransaction'> {
|
306 | /**
|
307 | Additional properties are allowed on plugin specs, which can be
|
308 | read via [`Plugin.spec`](https://prosemirror.net/docs/ref/#state.Plugin.spec).
|
309 | */
|
310 | [key: string]: any;
|
311 | }
|
312 | /**
|
313 | * A helper interface for creating strongly typed decorators.
|
314 | */
|
315 | interface TypedPropertyDescriptor<Type> {
|
316 | configurable?: boolean;
|
317 | enumerable?: boolean;
|
318 | value?: Type;
|
319 | writable?: boolean;
|
320 | get?: () => Type;
|
321 | set?: (v: Type) => void;
|
322 | }
|
323 | /**
|
324 | * The type of arguments acceptable for the focus parameter.
|
325 | *
|
326 | * - Can be a prosemirror selection
|
327 | * - A range of `{ from: number; to: number }`
|
328 | * - A single position with a `number`
|
329 | * - A string of `'start' | 'end'`
|
330 | * - `true` which sets the focus to the current position or start.
|
331 | */
|
332 | type FocusType = PrimitiveSelection | boolean;
|
333 |
|
334 | declare const IGNORE = "__IGNORE__";
|
335 | declare const GENERAL_OPTIONS: "__ALL__";
|
336 | /**
|
337 | * @internal
|
338 | */
|
339 | type CustomHandlerMethod<Options extends ValidOptions> = <Key extends keyof GetCustomHandler<Options>>(key: Key, value: Required<GetCustomHandler<Options>>[Key]) => Dispose;
|
340 | type AddCustomHandler<Options extends ValidOptions> = (props: Partial<GetCustomHandler<Options>>) => Dispose | undefined;
|
341 | type AddHandler<Options extends ValidOptions> = <Key extends keyof GetHandler<Options>>(key: Key, method: GetHandler<Options>[Key]) => Dispose;
|
342 | interface HandlerKeyOptions<ReturnType = any, Args extends any[] = any[]> {
|
343 | /**
|
344 | * When this value is encountered the handler will exit early.
|
345 | *
|
346 | * Set the value to `'__IGNORE__'` to ignore the early return value.
|
347 | */
|
348 | earlyReturnValue?: LiteralUnion<typeof IGNORE, Primitive> | ((value: unknown) => boolean);
|
349 | /**
|
350 | * Allows combining the values from the handlers together to produce a single
|
351 | * reduced output value.
|
352 | */
|
353 | reducer?: {
|
354 | /**
|
355 | * Combine the value with the the previous value
|
356 | */
|
357 | accumulator: (accumulated: ReturnType, latestValue: ReturnType, ...args: Args) => ReturnType;
|
358 | /**
|
359 | * The a function that returns the default value for combined handler
|
360 | * values. This is required for setting up a default value.
|
361 | */
|
362 | getDefault: (...args: Args) => ReturnType;
|
363 | };
|
364 | }
|
365 | declare abstract class BaseClass<Options extends ValidOptions = EmptyShape, DefaultStaticOptions extends Shape = EmptyShape> {
|
366 | /**
|
367 | * The default options for this extension.
|
368 | *
|
369 | * TODO see if this can be cast to something other than any and allow
|
370 | * composition.
|
371 | */
|
372 | static readonly defaultOptions: any;
|
373 | /**
|
374 | * The static keys for this class.
|
375 | */
|
376 | static readonly staticKeys: string[];
|
377 | /**
|
378 | * The event handler keys.
|
379 | */
|
380 | static readonly handlerKeys: string[];
|
381 | /**
|
382 | * Customize the way the handler should behave.
|
383 | */
|
384 | static handlerKeyOptions: Partial<Record<string, HandlerKeyOptions> & {
|
385 | [GENERAL_OPTIONS]?: HandlerKeyOptions;
|
386 | }>;
|
387 | /**
|
388 | * The custom keys.
|
389 | */
|
390 | static readonly customHandlerKeys: string[];
|
391 | /**
|
392 | * This is not for external use. It is purely here for TypeScript inference of
|
393 | * the generic `Options` type parameter.
|
394 | *
|
395 | * @internal
|
396 | */
|
397 | ['~O']: Options & DefaultStaticOptions;
|
398 | /**
|
399 | * This identifies this as a `Remirror` object. .
|
400 | * @internal
|
401 | */
|
402 | abstract readonly [__INTERNAL_REMIRROR_IDENTIFIER_KEY__]: RemirrorIdentifier;
|
403 | /**
|
404 | * The unique name of this extension.
|
405 | *
|
406 | * @remarks
|
407 | *
|
408 | * Every extension **must** have a name. The name should have a distinct type
|
409 | * to allow for better type inference for end users. By convention the name
|
410 | * should be `camelCased` and unique within your editor instance.
|
411 | *
|
412 | * ```ts
|
413 | * class SimpleExtension extends Extension {
|
414 | * get name() {
|
415 | * return 'simple' as const;
|
416 | * }
|
417 | * }
|
418 | * ```
|
419 | */
|
420 | abstract get name(): string;
|
421 | /**
|
422 | * The options for this extension.
|
423 | *
|
424 | * @remarks
|
425 | *
|
426 | * Options are composed of Static, Dynamic, Handlers and ObjectHandlers.
|
427 | *
|
428 | * - `Static` - set at instantiation by the constructor.
|
429 | * - `Dynamic` - optionally set at instantiation by the constructor and also
|
430 | * set during the runtime.
|
431 | * - `Handlers` - can only be set during the runtime.
|
432 | * - `ObjectHandlers` - Can only be set during the runtime of the extension.
|
433 | */
|
434 | get options(): RemoveAnnotations<GetFixed<Options> & DefaultStaticOptions>;
|
435 | /**
|
436 | * Get the dynamic keys for this extension.
|
437 | */
|
438 | get dynamicKeys(): string[];
|
439 | /**
|
440 | * The options that this instance was created with, merged with all the
|
441 | * default options.
|
442 | */
|
443 | get initialOptions(): RemoveAnnotations<GetFixed<Options> & DefaultStaticOptions>;
|
444 | /**
|
445 | * The initial options at creation (used to reset).
|
446 | */
|
447 | private readonly _initialOptions;
|
448 | /**
|
449 | * All the dynamic keys supported by this extension.
|
450 | */
|
451 | private readonly _dynamicKeys;
|
452 | /**
|
453 | * Private instance of the extension options.
|
454 | */
|
455 | private _options;
|
456 | /**
|
457 | * The mapped function handlers.
|
458 | */
|
459 | private _mappedHandlers;
|
460 | constructor(defaultOptions: DefaultStaticOptions, ...[options]: ConstructorProps<Options, DefaultStaticOptions>);
|
461 | /**
|
462 | * This method is called by the extension constructor. It is not strictly a
|
463 | * lifecycle method since at this point the manager has not yet been
|
464 | * instantiated.
|
465 | *
|
466 | * @remarks
|
467 | *
|
468 | * It should be used instead of overriding the constructor which is strongly
|
469 | * advised against.
|
470 | *
|
471 | * There are some limitations when using this method.
|
472 | *
|
473 | * - Accessing `this.store` will throw an error since the manager hasn't been
|
474 | * created and it hasn't yet been attached to the extensions.
|
475 | * - `this.type` in `NodeExtension` and `MarkExtension` will also throw an
|
476 | * error since the schema hasn't been created yet.
|
477 | *
|
478 | * You should use this to setup any instance properties with the options
|
479 | * provided to the extension.
|
480 | */
|
481 | protected init(): void;
|
482 | /**
|
483 | * Clone the current instance with the provided options. If nothing is
|
484 | * provided it uses the same initial options as the current instance.
|
485 | */
|
486 | abstract clone(...parameters: ConstructorProps<Options, DefaultStaticOptions>): BaseClass<Options, DefaultStaticOptions>;
|
487 | /**
|
488 | * Get the dynamic keys for this extension.
|
489 | */
|
490 | private getDynamicKeys;
|
491 | /**
|
492 | * Throw an error if non dynamic keys are updated.
|
493 | */
|
494 | private ensureAllKeysAreDynamic;
|
495 | /**
|
496 | * Update the properties with the provided partial value when changed.
|
497 | */
|
498 | setOptions(update: GetPartialDynamic<Options>): void;
|
499 | /**
|
500 | * Reset the extension properties to their default values.
|
501 | *
|
502 | * @nonVirtual
|
503 | */
|
504 | resetOptions(): void;
|
505 | /**
|
506 | * Override this to receive updates whenever the options have been updated on
|
507 | * this instance. This method is called after the updates have already been
|
508 | * applied to the instance. If you need more control over exactly how the
|
509 | * option should be applied you should set the option to be `Custom`.
|
510 | *
|
511 | * **Please Note**:
|
512 | *
|
513 | * This must be defined as a instance method and not a property since it is
|
514 | * called in the constructor.
|
515 | *
|
516 | * ```ts
|
517 | * class ThisPreset extends Preset {
|
518 | * // GOOD ✅
|
519 | * onSetOptions(props: OnSetOptionsProps<Options>) {}
|
520 | *
|
521 | * // BAD ❌
|
522 | * onSetOptions = (props: OnSetOptionsProps<Options>) => {}
|
523 | * }
|
524 | * ```
|
525 | *
|
526 | * @abstract
|
527 | */
|
528 | protected onSetOptions?(props: OnSetOptionsProps<Options>): void;
|
529 | /**
|
530 | * Update the private options.
|
531 | */
|
532 | private getDynamicOptions;
|
533 | /**
|
534 | * Update the dynamic options.
|
535 | */
|
536 | private updateDynamicOptions;
|
537 | /**
|
538 | * Set up the mapped handlers object with default values (an empty array);
|
539 | */
|
540 | private populateMappedHandlers;
|
541 | /**
|
542 | * This is currently fudged together, I'm not sure it will work.
|
543 | */
|
544 | private createDefaultHandlerOptions;
|
545 | /**
|
546 | * Add a handler to the event handlers so that it is called along with all the
|
547 | * other handler methods.
|
548 | *
|
549 | * This is helpful for integrating react hooks which can be used in multiple
|
550 | * places. The original problem with fixed properties is that you can only
|
551 | * assign to a method once and it overwrites any other methods. This pattern
|
552 | * for adding handlers allows for multiple usages of the same handler in the
|
553 | * most relevant part of the code.
|
554 | *
|
555 | * More to come on this pattern.
|
556 | *
|
557 | * @nonVirtual
|
558 | */
|
559 | addHandler<Key extends keyof GetHandler<Options>>(key: Key, method: GetHandler<Options>[Key], priority?: ExtensionPriority): Dispose;
|
560 | /**
|
561 | * Determines if handlers exist for the given key.
|
562 | *
|
563 | * Checking the existence of a handler property directly gives wrong results.
|
564 | * `this.options.onHandlerName` is always truthy because it is a reference to
|
565 | * the wrapper function that calls each handler.
|
566 | *
|
567 | * ```ts
|
568 | *
|
569 | * // GOOD ✅
|
570 | * if (!this.hasHandlers('onHandlerName')) {
|
571 | * return;
|
572 | * }
|
573 | *
|
574 | * // BAD ❌
|
575 | * if (!this.options.onHandlerName) {
|
576 | * return;
|
577 | * }
|
578 | * ```
|
579 | *
|
580 | * @param key The handler to test
|
581 | */
|
582 | hasHandlers<Key extends keyof GetHandler<Options>>(key: Key): boolean;
|
583 | private sortHandlers;
|
584 | /**
|
585 | * A method that can be used to add a custom handler. It is up to the
|
586 | * extension creator to manage the handlers and dispose methods.
|
587 | */
|
588 | addCustomHandler<Key extends keyof GetCustomHandler<Options>>(key: Key, value: Required<GetCustomHandler<Options>>[Key]): Dispose;
|
589 | /**
|
590 | * Override this method if you want to set custom handlers on your extension.
|
591 | *
|
592 | * This must return a dispose function.
|
593 | */
|
594 | protected onAddCustomHandler?: AddCustomHandler<Options>;
|
595 | }
|
596 | interface BaseClass<Options extends ValidOptions, DefaultStaticOptions extends Shape = EmptyShape> {
|
597 | constructor: BaseClassConstructor<Options, DefaultStaticOptions>;
|
598 | }
|
599 | interface BaseClassConstructor<Options extends ValidOptions = EmptyShape, DefaultStaticOptions extends Shape = EmptyShape> extends Function {
|
600 | new (...args: ConstructorProps<Options, DefaultStaticOptions>): any;
|
601 | /**
|
602 | * The identifier for the constructor which can determine whether it is a node
|
603 | * constructor, mark constructor or plain constructor.
|
604 | * @internal
|
605 | */
|
606 | readonly [__INTERNAL_REMIRROR_IDENTIFIER_KEY__]: RemirrorIdentifier;
|
607 | /**
|
608 | * Defines the `defaultOptions` for all extension instances.
|
609 | *
|
610 | * @remarks
|
611 | *
|
612 | * Once set it can't be updated during run time. Some of the settings are
|
613 | * optional and some are not. Any non-required settings must be specified in
|
614 | * the `defaultOptions`.
|
615 | *
|
616 | * **Please note**: There is a slight downside when setting up
|
617 | * `defaultOptions`. `undefined` is not supported for partial settings at this
|
618 | * point in time. As a workaround use `null` as the type and pass it as the
|
619 | * value in the default settings.
|
620 | *
|
621 | * @defaultValue {}
|
622 | *
|
623 | * @internal
|
624 | */
|
625 | readonly defaultOptions: DefaultOptions<Options, DefaultStaticOptions>;
|
626 | /**
|
627 | * An array of the keys that are static for this extension.
|
628 | *
|
629 | * This is actually currently unused, but might become useful in the future.
|
630 | * An auto-fix lint rule will be added should that be the case.
|
631 | */
|
632 | readonly staticKeys: string[];
|
633 | /**
|
634 | * An array of all the keys which correspond to the the event handler options.
|
635 | *
|
636 | * This **MUST** be present if you want to use event handlers in your
|
637 | * extension.
|
638 | *
|
639 | * Every key here is automatically removed from the `setOptions` method and is
|
640 | * added to the `addHandler` method for adding new handlers. The
|
641 | * `this.options[key]` is automatically replaced with a method that combines
|
642 | * all the handlers into one method that can be called effortlessly. All this
|
643 | * work is done for you.
|
644 | */
|
645 | readonly handlerKeys: string[];
|
646 | /**
|
647 | * Customize the way the handler should behave.
|
648 | */
|
649 | readonly handlerKeyOptions: Partial<Record<string, HandlerKeyOptions> & {
|
650 | __ALL__?: HandlerKeyOptions;
|
651 | }>;
|
652 | /**
|
653 | * A list of the custom keys in the extension or preset options.
|
654 | */
|
655 | readonly customHandlerKeys: string[];
|
656 | }
|
657 | /**
|
658 | * Auto infers the parameter for the constructor. If there is a required static
|
659 | * option then the TypeScript compiler will error if nothing is passed in.
|
660 | */
|
661 | type ConstructorProps<Options extends ValidOptions, DefaultStaticOptions extends Shape> = IfNoRequiredProperties<GetStatic<Options>, [
|
662 | options?: GetConstructorProps<Options> & DefaultStaticOptions
|
663 | ], [
|
664 | options: GetConstructorProps<Options> & DefaultStaticOptions
|
665 | ]>;
|
666 | /**
|
667 | * Get the expected type signature for the `defaultOptions`. Requires that every
|
668 | * optional setting key (except for keys which are defined on the
|
669 | * `BaseExtensionOptions`) has a value assigned.
|
670 | */
|
671 | type DefaultOptions<Options extends ValidOptions, DefaultStaticOptions extends Shape> = MakeUndefined<UndefinedFlipPartialAndRequired<GetStatic<Options>> & Partial<DefaultStaticOptions> & GetFixedDynamic<Options>, StringKey<GetAcceptUndefined<Options>>>;
|
672 | interface AnyBaseClassOverrides {
|
673 | addCustomHandler: AnyFunction;
|
674 | addHandler: AnyFunction;
|
675 | clone: AnyFunction;
|
676 | }
|
677 |
|
678 | /**
|
679 | * Auto infers the parameter for the constructor. If there is a required static
|
680 | * option then the TypeScript compiler will error if nothing is passed in.
|
681 | */
|
682 | type ExtensionConstructorProps<Options extends ValidOptions> = ConstructorProps<Options, BaseExtensionOptions>;
|
683 | /**
|
684 | * Extensions are fundamental to the way that Remirror works by grouping
|
685 | * together the functionality and handling the management of similar concerns.
|
686 | *
|
687 | * @remarks
|
688 | *
|
689 | * Extension can adjust editor functionality in any way. Here are some
|
690 | * examples.
|
691 | *
|
692 | * - How the editor displays certain content, i.e. **bold**, _italic_,
|
693 | * **underline**.
|
694 | * - Which commands should be made available e.g. `commands.toggleBold()` to
|
695 | * toggle the weight of the selected text.
|
696 | * - Check if a command is currently enabled (i.e a successful dry run) e.g.
|
697 | * `commands.toggleBold.isEnabled()`.
|
698 | * - Register Prosemirror `Plugin`s, `keymap`s, `InputRule`s `PasteRule`s,
|
699 | * `Suggestions`, and custom `nodeViews` which affect the behavior of the
|
700 | * editor.
|
701 | *
|
702 | * There are three types of `Extension`.
|
703 | *
|
704 | * - `NodeExtension` - For creating Prosemirror nodes in the editor. See
|
705 | * {@link NodeExtension}
|
706 | * - `MarkExtension` - For creating Prosemirror marks in the editor. See
|
707 | * {@link MarkExtension}
|
708 | * - `PlainExtension` - For behavior which doesn't map to a `ProsemirrorNode` or
|
709 | * `Mark` and as a result doesn't directly affect the Prosemirror `Schema` or
|
710 | * content. See {@link PlainExtension}.
|
711 | *
|
712 | * This `Extension` is an abstract class that should not be used directly but
|
713 | * rather extended to add the intended functionality.
|
714 | *
|
715 | * ```ts
|
716 | * import { PlainExtension, Static } from 'remirror';
|
717 | *
|
718 | * interface AwesomeExtensionOptions {
|
719 | * isAwesome?: Static<boolean>;
|
720 | * id?: string;
|
721 | * }
|
722 | *
|
723 | * class AwesomeExtension extends PlainExtension<AwesomeExtensionOptions> {
|
724 | * static defaultOptions: DefaultExtensionOptions<AwesomeExtensionOptions> = {
|
725 | * isAwesome: true,
|
726 | * id: '',
|
727 | * }
|
728 | *
|
729 | * get name() {
|
730 | * return 'awesome' as const;
|
731 | * }
|
732 | * }
|
733 | * ```
|
734 | */
|
735 | declare abstract class Extension<Options extends ValidOptions = EmptyShape> extends BaseClass<Options, BaseExtensionOptions> {
|
736 | /**
|
737 | * The default priority for this family of extensions.
|
738 | */
|
739 | static readonly defaultPriority: ExtensionPriority;
|
740 | /**
|
741 | * Allows for the `RemirrorManager` or `Preset`'s to override the priority of
|
742 | * an extension.
|
743 | */
|
744 | private priorityOverride?;
|
745 | /**
|
746 | * The priority level for this instance of the extension. A higher value
|
747 | * corresponds to a higher priority extension
|
748 | */
|
749 | get priority(): ExtensionPriority;
|
750 | /**
|
751 | * The name that the constructor should have, which doesn't get mangled in
|
752 | * production.
|
753 | */
|
754 | get constructorName(): string;
|
755 | /**
|
756 | * The store is a shared object that's internal to each extension. It includes
|
757 | * often used items like the `view` and `schema` that are added by the
|
758 | * extension manager and also the lifecycle extension methods.
|
759 | *
|
760 | * **NOTE** - The store is not available until the manager has been created
|
761 | * and received the extension. As a result trying to access the store during
|
762 | * `init` and `constructor` will result in a runtime error.
|
763 | *
|
764 | * Some properties of the store are available at different phases. You should
|
765 | * check the inline documentation to know when a certain property is useable
|
766 | * in your extension.
|
767 | */
|
768 | protected get store(): Remirror.ExtensionStore;
|
769 | /**
|
770 | * The list of extensions added to the editor by this `Preset`.
|
771 | */
|
772 | get extensions(): Array<this['~E']>;
|
773 | /**
|
774 | * Private list of extension stored within this [[`Preset`]].
|
775 | */
|
776 | private _extensions;
|
777 | /**
|
778 | * An extension mapping of the extensions and their constructors.
|
779 | */
|
780 | private readonly extensionMap;
|
781 | /**
|
782 | * This store is can be modified by the extension manager with and lifecycle
|
783 | * extension methods.
|
784 | *
|
785 | * Different properties are added at different times so it's important to
|
786 | * check the documentation for each property to know what phase is being
|
787 | * added.
|
788 | */
|
789 | private _store?;
|
790 | constructor(...args: ExtensionConstructorProps<Options>);
|
791 | /**
|
792 | * When there are duplicate extensions used within the editor the extension
|
793 | * manager will call this method and make sure all extension holders are using
|
794 | * the same instance of the `ExtensionConstructor`.
|
795 | *
|
796 | * @internal
|
797 | */
|
798 | replaceChildExtension(constructor: AnyExtensionConstructor, extension: this['~E']): void;
|
799 | /**
|
800 | * Not for usage. This is purely for types to make it easier to infer
|
801 | * available sub extension types.
|
802 | *
|
803 | * @internal
|
804 | */
|
805 | ['~E']: ReturnType<this['createExtensions']>[number];
|
806 | /**
|
807 | * Create the extensions which will be consumed by the preset. Override this
|
808 | * if you would like to make your extension a parent to other (holder)
|
809 | * extensions which don't make sense existing outside of the context of this
|
810 | * extension.
|
811 | *
|
812 | * @remarks
|
813 | *
|
814 | * Since this method is called in the constructor it should always be created
|
815 | * as an instance method and not a property. Properties aren't available for
|
816 | * the call to the parent class.
|
817 | *
|
818 | * ```ts
|
819 | * class HolderExtension extends PlainExtension {
|
820 | * get name() {
|
821 | * return 'holder'
|
822 | * }
|
823 | *
|
824 | * // GOOD ✅
|
825 | * createExtensions() {
|
826 | * return [];
|
827 | * }
|
828 | *
|
829 | * // BAD ❌
|
830 | * createExtensions = () => {
|
831 | * return [];
|
832 | * }
|
833 | * }
|
834 | * ```
|
835 | */
|
836 | createExtensions(): AnyExtension[];
|
837 | /**
|
838 | * Get an extension from this holder extension by providing the desired
|
839 | * `Constructor`.
|
840 | *
|
841 | * @param Constructor - the extension constructor to find in the editor.
|
842 | *
|
843 | * @remarks
|
844 | *
|
845 | * This method will throw an error if the constructor doesn't exist within the
|
846 | * extension created by this extension.
|
847 | *
|
848 | * It can be used to forward options and attach handlers to the children
|
849 | * extensions. It is the spiritual replacement of the `Preset` extension.
|
850 | *
|
851 | * ```ts
|
852 | * import { PlainExtension, OnSetOptionsProps } from 'remirror';
|
853 | *
|
854 | * interface ParentOptions { weight?: string }
|
855 | *
|
856 | * class ParentExtension extends PlainExtension<ParentOptions> {
|
857 | * get name() {
|
858 | * return 'parent' as const;
|
859 | * }
|
860 | *
|
861 | * createExtensions() {
|
862 | * return [new BoldExtension()]
|
863 | * }
|
864 | *
|
865 | * onSetOptions(options: OnSetOptionsProps<ParentOptions>): void {
|
866 | * if (options.changes.weight.changed) {
|
867 | * // Update the value of the provided extension.
|
868 | * this.getExtension(BoldExtension).setOption({ weight: options.changes.weight.value });
|
869 | * }
|
870 | * }
|
871 | * }
|
872 | * ```
|
873 | */
|
874 | getExtension<Type extends this['~E']['constructor']>(Constructor: Type): InstanceType<Type>;
|
875 | /**
|
876 | * Check if the type of this extension's constructor matches the type of the
|
877 | * provided constructor.
|
878 | */
|
879 | isOfType<Type extends AnyExtensionConstructor>(Constructor: Type): this is InstanceType<Type>;
|
880 | /**
|
881 | * Pass a reference to the globally shared `ExtensionStore` for this
|
882 | * extension.
|
883 | *
|
884 | * @remarks
|
885 | *
|
886 | * The extension store allows extensions to access important variables without
|
887 | * complicating their creator methods.
|
888 | *
|
889 | * ```ts
|
890 | * import { PlainExtension } from 'remirror';
|
891 | *
|
892 | * class Awesome extends PlainExtension {
|
893 | * customMethod() {
|
894 | * if (this.store.view.hasFocus()) {
|
895 | * log('dance dance dance');
|
896 | * }
|
897 | * }
|
898 | * }
|
899 | * ```
|
900 | *
|
901 | * This should only be called by the `RemirrorManager`.
|
902 | *
|
903 | * @internal
|
904 | * @nonVirtual
|
905 | */
|
906 | setStore(store: Remirror.ExtensionStore): void;
|
907 | /**
|
908 | * Clone an extension.
|
909 | */
|
910 | clone(...args: ExtensionConstructorProps<Options>): Extension<Options>;
|
911 | /**
|
912 | * Set the priority override for this extension. This is used in the
|
913 | * `RemirrorManager` in order to override the priority of an extension.
|
914 | *
|
915 | * If you set the first parameter to `undefined` it will remove the priority
|
916 | * override.
|
917 | *
|
918 | * @internal
|
919 | */
|
920 | setPriority(priority: undefined | ExtensionPriority): void;
|
921 | /**
|
922 | * This handler is called when the `RemirrorManager` is first created.
|
923 | *
|
924 | * @remarks
|
925 | *
|
926 | * Since it is called as soon as the manager is some methods may not be
|
927 | * available in the extension store. When accessing methods on `this.store` be
|
928 | * shore to check when they become available in the lifecycle.
|
929 | *
|
930 | * You can return a `Dispose` function which will automatically be called when
|
931 | * the extension is destroyed.
|
932 | *
|
933 | * This handler is called before the `onView` handler.
|
934 | *
|
935 | * @category Lifecycle Methods
|
936 | */
|
937 | onCreate?(): Dispose | void;
|
938 | /**
|
939 | * This event happens when the view is first received from the view layer
|
940 | * (e.g. React).
|
941 | *
|
942 | * Return a dispose function which will be called when the extension is
|
943 | * destroyed.
|
944 | *
|
945 | * This handler is called after the `onCreate` handler.
|
946 | *
|
947 | * @category Lifecycle Methods
|
948 | */
|
949 | onView?(view: EditorView): Dispose | void;
|
950 | /**
|
951 | * This can be used by the `Extension` to append a transaction to the latest
|
952 | * update.
|
953 | *
|
954 | * This is shorthand for the `ProsemirrorPlugin.spec.appendTransaction`.
|
955 | *
|
956 | * @category Lifecycle Methods
|
957 | */
|
958 | onAppendTransaction?(props: AppendLifecycleProps): void;
|
959 | /**
|
960 | * This is called when the prosemirror editor state is first attached to the
|
961 | * editor. It can be useful for doing some preparation work.
|
962 | *
|
963 | * This is a shorthand for creating a plugin and adding the
|
964 | * [[`Plugin.spec.state.init`]].
|
965 | *
|
966 | * @category Lifecycle Methods
|
967 | */
|
968 | onInitState?(state: EditorState): void;
|
969 | /**
|
970 | * This is called when the state is being applied to the editor. This can be
|
971 | * used as a shorthand for the [[`Plugin.spec.state.apply`]] method.
|
972 | *
|
973 | * For example, when using [[`createDecorations`]] you can respond to editor
|
974 | * updates within this callback.
|
975 | *
|
976 | * @category Lifecycle Methods
|
977 | */
|
978 | onApplyState?(props: ApplyStateLifecycleProps): void;
|
979 | /**
|
980 | * This handler is called after a transaction successfully updates the editor
|
981 | * state. It is called asynchronously after the [[`onApplyState`]] hook has
|
982 | * been run run.
|
983 | *
|
984 | * @category Lifecycle Methods
|
985 | */
|
986 | onStateUpdate?(props: StateUpdateLifecycleProps): void;
|
987 | /**
|
988 | * Called when the extension is being destroyed.
|
989 | *
|
990 | * @category Lifecycle Methods
|
991 | */
|
992 | onDestroy?(): void;
|
993 | }
|
994 | /**
|
995 | * Declaration merging since the constructor property can't be defined on the
|
996 | * actual class.
|
997 | */
|
998 | interface Extension<Options extends ValidOptions = EmptyShape> extends Remirror.BaseExtension {
|
999 | /**
|
1000 | * The type of the constructor for the extension.
|
1001 | */
|
1002 | constructor: ExtensionConstructor<Options>;
|
1003 | /**
|
1004 | * An extension can declare the extensions it requires.
|
1005 | *
|
1006 | * @remarks
|
1007 | *
|
1008 | * When creating the extension manager the extension will be checked for
|
1009 | * required extension as well as a quick check to see if the required
|
1010 | * extension is already included. If not present a descriptive error will be
|
1011 | * thrown.
|
1012 | */
|
1013 | requiredExtensions?: AnyExtensionConstructor[];
|
1014 | }
|
1015 | /**
|
1016 | * Get the expected type signature for the `defaultOptions`. Requires that every
|
1017 | * optional setting key (except for keys which are defined on the
|
1018 | * `BaseExtensionOptions`) has a value assigned.
|
1019 | */
|
1020 | type DefaultExtensionOptions<Options extends ValidOptions> = DefaultOptions<Options, BaseExtensionOptions>;
|
1021 | /**
|
1022 | * Create a plain extension which doesn't directly map to Prosemirror nodes or
|
1023 | * marks.
|
1024 | *
|
1025 | * Plain extensions are a great way to add custom behavior to your editor.
|
1026 | */
|
1027 | declare abstract class PlainExtension<Options extends ValidOptions = EmptyShape> extends Extension<Options> {
|
1028 | /** @internal */
|
1029 | static get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.PlainExtensionConstructor;
|
1030 | /** @internal */
|
1031 | get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.PlainExtension;
|
1032 | }
|
1033 | /**
|
1034 | * A mark extension is based on the `Mark` concept from from within prosemirror
|
1035 | * {@link https://prosemirror.net/docs/guide/#schema.marks}
|
1036 | *
|
1037 | * @remarks
|
1038 | *
|
1039 | * Marks are used to add extra styling or other information to inline content.
|
1040 | * Mark types are objects much like node types, used to tag mark objects and
|
1041 | * provide additional information about them.
|
1042 | */
|
1043 | declare abstract class MarkExtension<Options extends ValidOptions = EmptyShape> extends Extension<Options> {
|
1044 | /** @internal */
|
1045 | static get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.MarkExtensionConstructor;
|
1046 | /**
|
1047 | * Whether to disable extra attributes for this extension.
|
1048 | */
|
1049 | static readonly disableExtraAttributes: boolean;
|
1050 | /** @internal */
|
1051 | get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.MarkExtension;
|
1052 | /**
|
1053 | * Provides access to the mark type from the schema.
|
1054 | *
|
1055 | * @remarks
|
1056 | *
|
1057 | * The type is available as soon as the schema is created by the
|
1058 | * `SchemaExtension` which has the priority `Highest`. It should be safe to
|
1059 | * access in any of the lifecycle methods.
|
1060 | */
|
1061 | get type(): MarkType;
|
1062 | constructor(...args: ExtensionConstructorProps<Options>);
|
1063 | /**
|
1064 | * Provide a method for creating the schema. This is required in order to
|
1065 | * create a `MarkExtension`.
|
1066 | *
|
1067 | * @remarks
|
1068 | *
|
1069 | * The main difference between the return value of this method and Prosemirror
|
1070 | * `MarkSpec` is that that the `toDOM` method doesn't allow dom manipulation.
|
1071 | * You can only return an array or string.
|
1072 | *
|
1073 | * For more advanced requirements, it may be possible to create a `nodeView`
|
1074 | * to manage the dom interactions.
|
1075 | */
|
1076 | abstract createMarkSpec(extra: ApplySchemaAttributes, override: MarkSpecOverride): MarkExtensionSpec;
|
1077 | }
|
1078 | interface MarkExtension<Options extends ValidOptions = EmptyShape> extends Extension<Options>, Remirror.MarkExtension {
|
1079 | }
|
1080 | /**
|
1081 | * Defines the abstract class for extensions which can place nodes into the
|
1082 | * prosemirror state.
|
1083 | *
|
1084 | * @remarks
|
1085 | *
|
1086 | * For more information see {@link https://prosemirror.net/docs/ref/#model.Node}
|
1087 | */
|
1088 | declare abstract class NodeExtension<Options extends ValidOptions = EmptyShape> extends Extension<Options> {
|
1089 | static get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.NodeExtensionConstructor;
|
1090 | /**
|
1091 | * Whether to disable extra attributes for this extension.
|
1092 | */
|
1093 | static readonly disableExtraAttributes: boolean;
|
1094 | /** @internal */
|
1095 | get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.NodeExtension;
|
1096 | /**
|
1097 | * Provides access to the node type from the schema.
|
1098 | */
|
1099 | get type(): NodeType;
|
1100 | constructor(...args: ExtensionConstructorProps<Options>);
|
1101 | /**
|
1102 | * Provide a method for creating the schema. This is required in order to
|
1103 | * create a `NodeExtension`.
|
1104 | *
|
1105 | * @remarks
|
1106 | *
|
1107 | * A node schema defines the behavior of the content within the editor. This
|
1108 | * is very tied to the prosemirror implementation and the best place to learn
|
1109 | * more about it is in the
|
1110 | * {@link https://prosemirror.net/docs/guide/#schema docs}.
|
1111 | *
|
1112 | * @params hole - a method that is meant to indicate where extra attributes
|
1113 | * should be placed (if they exist).
|
1114 | *
|
1115 | * The `hole` is a function that augments the passed object adding a special
|
1116 | * `secret` key which is used to insert the extra attributes setter.
|
1117 | *
|
1118 | * ```ts
|
1119 | * import { NodeExtension, SpecHole } from 'remirror';
|
1120 | *
|
1121 | * class AwesomeExtension extends NodeExtension {
|
1122 | * get name() { return 'awesome' as const'; }
|
1123 | *
|
1124 | * createNodeSpec() {
|
1125 | * return {
|
1126 | * toDOM: (node) => {
|
1127 | * return ['p', hole(), 0]
|
1128 | * }
|
1129 | * }
|
1130 | * }
|
1131 | * }
|
1132 | * ```
|
1133 | *
|
1134 | * The above example will have the `hole()` method call replaced with the
|
1135 | * extra attributes.
|
1136 | */
|
1137 | abstract createNodeSpec(extra: ApplySchemaAttributes, override: NodeSpecOverride): NodeExtensionSpec;
|
1138 | }
|
1139 | interface NodeExtension<Options extends ValidOptions = EmptyShape> extends Extension<Options>, Remirror.NodeExtension {
|
1140 | }
|
1141 | /**
|
1142 | * The type which is applicable to any extension instance.
|
1143 | *
|
1144 | * **NOTE** `& object` forces VSCode to use the name `AnyExtension` rather than
|
1145 | * print out `Replace<Extension<Shape>, Remirror.AnyExtensionOverrides>`
|
1146 | */
|
1147 | type AnyExtension = Replace<Extension<Shape>, Remirror.AnyExtensionOverrides> & object;
|
1148 | /**
|
1149 | * The type which is applicable to any extension instance.
|
1150 | */
|
1151 | type AnyExtensionConstructor = Replace<ExtensionConstructor<any>, {
|
1152 | new (...args: any[]): AnyExtension;
|
1153 | }>;
|
1154 | /**
|
1155 | * The type for any potential PlainExtension.
|
1156 | */
|
1157 | type AnyPlainExtension = Replace<PlainExtension<Shape>, Remirror.AnyExtensionOverrides> & object;
|
1158 | /**
|
1159 | * The type for any potential NodeExtension.
|
1160 | */
|
1161 | type AnyNodeExtension = Replace<NodeExtension<Shape>, Remirror.AnyExtensionOverrides> & object;
|
1162 | /**
|
1163 | * The type for any potential MarkExtension.
|
1164 | */
|
1165 | type AnyMarkExtension = Replace<MarkExtension<Shape>, Remirror.AnyExtensionOverrides> & object;
|
1166 | /**
|
1167 | * Mutate the default extension options.
|
1168 | *
|
1169 | * @remarks
|
1170 | *
|
1171 | * This is a dangerous method since it allows you to mutate the received object.
|
1172 | * Don't use it unless you absolutely have to.
|
1173 | *
|
1174 | * A potential use case is for adding a new default option to all extensions. It
|
1175 | * shows an example of how to accomplish this in a typesafe way.
|
1176 | *
|
1177 | * ```ts
|
1178 | * import { mutateDefaultExtensionOptions } from 'remirror';
|
1179 | *
|
1180 | * mutateDefaultExtensionOptions((settings) => {
|
1181 | * // Set the default value of all extensions to have a property `customSetting` with value `false`.
|
1182 | * settings.customSetting = false;
|
1183 | * })
|
1184 | *
|
1185 | * declare global {
|
1186 | * namespace Remirror {
|
1187 | * interface BaseExtensionOptions {
|
1188 | * customSetting?: boolean;
|
1189 | * }
|
1190 | * }
|
1191 | * }
|
1192 | *```
|
1193 | *
|
1194 | * The mutation must happen before any extension have been instantiated.
|
1195 | */
|
1196 | declare function mutateDefaultExtensionOptions(mutatorMethod: (defaultOptions: BaseExtensionOptions) => void): void;
|
1197 | /**
|
1198 | * Determines if the passed value is an extension.
|
1199 | *
|
1200 | * @param value - the value to test
|
1201 | */
|
1202 | declare function isExtension<Type extends AnyExtension = AnyExtension>(value: unknown): value is Type;
|
1203 | /**
|
1204 | * Determines if the passed value is an extension constructor.
|
1205 | *
|
1206 | * @param value - the value to test
|
1207 | */
|
1208 | declare function isExtensionConstructor<Type extends AnyExtensionConstructor = AnyExtensionConstructor>(value: unknown): value is Type;
|
1209 | /**
|
1210 | * Checks whether the provided value is a plain extension.
|
1211 | *
|
1212 | * @param value - the extension to check
|
1213 | */
|
1214 | declare function isPlainExtension<Type extends AnyPlainExtension = AnyPlainExtension>(value: unknown): value is Type;
|
1215 | /**
|
1216 | * Determines if the passed in extension is a node extension. Useful as a type
|
1217 | * guard where a particular type of extension is needed.
|
1218 | *
|
1219 | * @param value - the extension to check
|
1220 | */
|
1221 | declare function isNodeExtension<Type extends AnyNodeExtension = AnyNodeExtension>(value: unknown): value is Type;
|
1222 | /**
|
1223 | * Determines if the passed in extension is a mark extension. Useful as a type
|
1224 | * guard where a particular type of extension is needed.
|
1225 | *
|
1226 | * @param value - the extension to check
|
1227 | */
|
1228 | declare function isMarkExtension<Type extends AnyMarkExtension = AnyMarkExtension>(value: unknown): value is Type;
|
1229 | interface ExtensionConstructor<Options extends ValidOptions = EmptyShape> extends BaseClassConstructor<Options, BaseExtensionOptions>, Partial<Remirror.StaticExtensionOptions> {
|
1230 | new (...args: ExtensionConstructorProps<Options>): Extension<Options>;
|
1231 | /**
|
1232 | * The default priority level for all instance of this extension.
|
1233 | *
|
1234 | * @defaultValue ExtensionPriority.Default
|
1235 | */
|
1236 | readonly defaultPriority: ExtensionPriority;
|
1237 | }
|
1238 | type AnyManagerStore = Remirror.ManagerStore<any>;
|
1239 | type ManagerStoreKeys = keyof Remirror.ManagerStore<any>;
|
1240 | declare global {
|
1241 | /**
|
1242 | * This namespace is global and you can use declaration merging to extend and
|
1243 | * create new types used by the `remirror` project.
|
1244 | *
|
1245 | * @remarks
|
1246 | *
|
1247 | * The following would add `MyCustomType` to the `Remirror` namespace. Please
|
1248 | * note that this can only be used for types and interfaces.
|
1249 | *
|
1250 | * ```ts
|
1251 | * declare global {
|
1252 | * namespace Remirror {
|
1253 | * type MyCustomType = 'look-at-me';
|
1254 | * }
|
1255 | * }
|
1256 | * ```
|
1257 | */
|
1258 | namespace Remirror {
|
1259 | /**
|
1260 | * This interface stores all the currently installed extensions. As a result
|
1261 | * it can be used to set the default loaded extensions to include all
|
1262 | * available within `node_modules`. By extending this extension in the
|
1263 | * global `Remirror` namespace the key is ignored but the value is used to
|
1264 | * form the union type in the `chain`, `commands`, `helpers` properties on
|
1265 | * the `Remirror.ExtensionStore` interface.
|
1266 | *
|
1267 | * This is useful for extensions being able to reuse the work of other
|
1268 | * extension.
|
1269 | */
|
1270 | interface AllExtensions {
|
1271 | }
|
1272 | /**
|
1273 | * This is the global interface for adding extra methods and properties to
|
1274 | * all [[`Extension`]]s using declaration merging.
|
1275 | *
|
1276 | * @remarks
|
1277 | *
|
1278 | * The following will add `newOption` to the expected options. This is the
|
1279 | * way that extensions which add new functionality to the editor can request
|
1280 | * configuration options.
|
1281 | *
|
1282 | * ```ts
|
1283 | * declare global {
|
1284 | * namespace Remirror {
|
1285 | * interface ExtensionFactoryProps {
|
1286 | * newOption?: string;
|
1287 | * }
|
1288 | * }
|
1289 | * }
|
1290 | * ```
|
1291 | */
|
1292 | interface BaseExtension {
|
1293 | }
|
1294 | interface NodeExtension {
|
1295 | }
|
1296 | interface MarkExtension {
|
1297 | }
|
1298 | /**
|
1299 | * An override to for the `AnyExtension` type. If you're extension adds a
|
1300 | * new property to the `Extension` that is deeply nested or very complex it
|
1301 | * can break the `AnyExtension` implementation from being compatible with
|
1302 | * all valid extensions.
|
1303 | *
|
1304 | * The keys you provide on this override replace the default `AnyExtension`
|
1305 | * types include unsafe properties that need to be simplified.
|
1306 | *
|
1307 | * An example is the `constructor` property which makes it impossible to
|
1308 | * find a common interface between extensions with different settings and
|
1309 | * properties. By setting the `constructor` to a much simpler override all
|
1310 | * `Extension`'s are now assignable to the `AnyExtension type again.`
|
1311 | */
|
1312 | interface AnyExtensionOverrides extends AnyBaseClassOverrides {
|
1313 | constructor: AnyExtensionConstructor;
|
1314 | ['~C']: ExtensionCommandReturn;
|
1315 | ['~H']: ExtensionHelperReturn;
|
1316 | ['~E']: AnyExtension;
|
1317 | }
|
1318 | }
|
1319 | }
|
1320 |
|
1321 | interface DefaultOptionsProps<Options extends Shape = EmptyShape> {
|
1322 | /**
|
1323 | * The default options.
|
1324 | *
|
1325 | * All non required options must have a default value provided.
|
1326 | *
|
1327 | * Please note that as mentioned in this issue
|
1328 | * [#624](https://github.com/remirror/remirror/issues/624), partial options
|
1329 | * can cause trouble when setting a default.
|
1330 | *
|
1331 | * If you need to accept `undefined `as an acceptable default option there are
|
1332 | * two possible ways to resolve this.
|
1333 | *
|
1334 | * #### Use `AcceptUndefined`
|
1335 | *
|
1336 | * This is the preferred solution and should be used instead of the following
|
1337 | * `null` union.
|
1338 | *
|
1339 | * ```ts
|
1340 | * import { AcceptUndefined } from 'remirror';
|
1341 | *
|
1342 | * interface Options {
|
1343 | * optional?: AcceptUndefined<string>;
|
1344 | * }
|
1345 | * ```
|
1346 | *
|
1347 | * Now when the options are consumed by this decorator there should be no
|
1348 | * errors when setting the value to `undefined`.
|
1349 | *
|
1350 | * #### `null` union
|
1351 | *
|
1352 | * If you don't mind using nulls in your code then this might appeal to you.
|
1353 | *
|
1354 | * ```ts
|
1355 | * interface Options {
|
1356 | * optional?: string | null;
|
1357 | * }
|
1358 | * ```
|
1359 | *
|
1360 | * {}
|
1361 | */
|
1362 | defaultOptions: DefaultExtensionOptions<Options>;
|
1363 | }
|
1364 | interface DefaultPriorityProps {
|
1365 | /**
|
1366 | * The default priority for this extension.
|
1367 | *
|
1368 | * @defaultValue {}
|
1369 | */
|
1370 | defaultPriority?: ExtensionPriority;
|
1371 | }
|
1372 | interface StaticKeysProps<Options extends Shape = EmptyShape> {
|
1373 | /**
|
1374 | * The list of all keys which are static and can only be set at the start.
|
1375 | */
|
1376 | staticKeys: StaticKeyList<Options>;
|
1377 | }
|
1378 | /**
|
1379 | * This notifies the extension which options are handlers. Handlers typically
|
1380 | * represent event handlers that are called in response to something happening.
|
1381 | *
|
1382 | * An `onChange` option could be a handler. When designing the API I had to
|
1383 | * consider that often times, you might want to listen to a handler in several
|
1384 | * places.
|
1385 | *
|
1386 | * A limitation of the static and dynamic options is that there is only one
|
1387 | * value per extension. So if there is a `minValue` option and that min value
|
1388 | * option is set in the extension then it becomes the value for all consumers of
|
1389 | * the extension. Handlers don't have the same expected behaviour. It is
|
1390 | * generally expected that you should be able to subscribe to an event in
|
1391 | * multiple places.
|
1392 | *
|
1393 | * In order to make this possible with `remirror` the handlers are automatically
|
1394 | * created based on the handler keys you provide. Each handler is an array and
|
1395 | * when the handler is called with `this.options.onChange`, each item in the
|
1396 | * array is called based on the rules provided.
|
1397 | */
|
1398 | interface HandlerKeysProps<Options extends Shape = EmptyShape> {
|
1399 | /**
|
1400 | * The list of the option names which are event handlers.
|
1401 | */
|
1402 | handlerKeys: HandlerKeyList<Options>;
|
1403 | /**
|
1404 | * Customize how the handler should work.
|
1405 | *
|
1406 | * This allows you to decide how the handlers will be composed together.
|
1407 | * Currently it only support function handlers, but you can tell the extension
|
1408 | * to exit early when a certain return value is received.
|
1409 | *
|
1410 | * ```ts
|
1411 | * const handlerOptions = { onChange: { earlyReturnValue: true }};
|
1412 | * ```
|
1413 | *
|
1414 | * The above setting means that onChange will exit early as soon as one of the
|
1415 | * methods returns true.
|
1416 | */
|
1417 | handlerKeyOptions?: MappedHandlerKeyOptions<Options>;
|
1418 | }
|
1419 | type MappedHandlerKeyOptions<Options extends Shape = EmptyShape> = {
|
1420 | [Key in keyof GetHandler<Options>]?: HandlerKeyOptions<ReturnType<GetHandler<Options>[Key]>, Parameters<GetHandler<Options>[Key]>>;
|
1421 | } & {
|
1422 | __ALL__?: HandlerKeyOptions;
|
1423 | };
|
1424 | interface CustomHandlerKeysProps<Options extends Shape = EmptyShape> {
|
1425 | customHandlerKeys: CustomHandlerKeyList<Options>;
|
1426 | }
|
1427 | type ExtensionDecoratorOptions<Options extends Shape = EmptyShape> = DefaultPriorityProps & IfHasRequiredProperties<DefaultExtensionOptions<Options>, DefaultOptionsProps<Options>, Partial<DefaultOptionsProps<Options>>> & IfEmpty<GetStatic<Options>, Partial<StaticKeysProps<Options>>, StaticKeysProps<Options>> & IfEmpty<GetHandler<Options>, Partial<HandlerKeysProps<Options>>, HandlerKeysProps<Options>> & IfEmpty<GetCustomHandler<Options>, Partial<CustomHandlerKeysProps<Options>>, CustomHandlerKeysProps<Options>> & Partial<Remirror.StaticExtensionOptions>;
|
1428 | /**
|
1429 | * A decorator for the remirror extension.
|
1430 | *
|
1431 | * This adds static properties to the extension constructor.
|
1432 | */
|
1433 | declare function extension<Options extends Shape = EmptyShape>(options: ExtensionDecoratorOptions<Options>): <Type extends AnyExtensionConstructor>(ReadonlyConstructor: Type) => Type;
|
1434 | /**
|
1435 | * @deprecated use `extension` instead.
|
1436 | */
|
1437 | declare const extensionDecorator: typeof extension;
|
1438 |
|
1439 | interface ExtensionListProps<Extension extends AnyExtension = AnyExtension> {
|
1440 | /**
|
1441 | * The extensions property.
|
1442 | */
|
1443 | readonly extensions: readonly Extension[];
|
1444 | }
|
1445 | /**
|
1446 | * A utility type which maps the passed in extension command in an action that
|
1447 | * is store in the `manager.store.actions.commandName()`.
|
1448 | */
|
1449 | type MapToUnchainedCommand<RawCommands extends Record<string, AnyFunction>> = {
|
1450 | [Command in keyof RawCommands]: CommandShape<Parameters<RawCommands[Command]>>;
|
1451 | };
|
1452 | /**
|
1453 | * A utility type which maps the chained commands.
|
1454 | */
|
1455 | type MapToChainedCommand<RawCommands extends Record<string, AnyFunction>> = {
|
1456 | [Command in keyof RawCommands]: ReturnType<RawCommands[Command]> extends NonChainableCommandFunction ? void : (...args: Parameters<RawCommands[Command]>) => any;
|
1457 | };
|
1458 | /**
|
1459 | * Utility type which receives an extension and provides the type of actions it
|
1460 | * makes available.
|
1461 | *
|
1462 | * @typeParam Extension - the extensions being used within the editor
|
1463 | * @typeParam Expanded - auto generated from `Extension`. These are the
|
1464 | * fully expanded extensions with all sub extensions automatically provided. You
|
1465 | * never need to provide this type as it is automatically calculated.
|
1466 | */
|
1467 | type CommandsFromExtensions<Extension extends AnyExtension, Expanded extends AnyExtension = GetExtensions<Extension>> = UnionToIntersection<MapToUnchainedCommand<GetCommands<Expanded> | GetDecoratedCommands<Expanded>>>;
|
1468 | /**
|
1469 | * This uses a hack available via conditional types and `Distributive
|
1470 | * conditional types`. When a conditional is used on a union it distributes the
|
1471 | * types so that the union can avoid the case where:
|
1472 | *
|
1473 | * > access is restricted to members that are common to all types in the union
|
1474 | *
|
1475 | * A better explanation is available here
|
1476 | * https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-8.html#distributive-conditional-types
|
1477 | */
|
1478 | type GetDecoratedCommands<Type> = Type extends AnyExtension ? ConditionalPick<Type, AnyFunction<CommandFunction>> : never;
|
1479 | interface UiAnnotation {
|
1480 | __uiAnnotation?: never;
|
1481 | }
|
1482 | type UiCommandFunction = CommandFunction & UiAnnotation;
|
1483 | type GetDecoratedUiCommands<Type> = Type extends AnyExtension ? ConditionalPick<Type, AnyFunction<UiCommandFunction>> : never;
|
1484 | /**
|
1485 | * Utility type for pulling all the command names from a list.
|
1486 | *
|
1487 | * TODO - why doesn't this work.
|
1488 | */
|
1489 | type UiCommandNames<Extension extends AnyExtension> = StringKey<ConditionalPick<{
|
1490 | [P in keyof UnionToIntersection<GetDecoratedUiCommands<Extension>>]: keyof UnionToIntersection<GetDecoratedUiCommands<Extension>>[P] extends '__uiAnnotation' ? true : false;
|
1491 | }, true>>;
|
1492 | interface ChainedCommandProps {
|
1493 | /**
|
1494 | * Dispatches the chained commands.
|
1495 | *
|
1496 | * ```ts
|
1497 | * chain.insertText('hello').run();
|
1498 | * ```
|
1499 | *
|
1500 | * This will run all commands in the chain regardless of whether a previous
|
1501 | * command was not able to be run.
|
1502 | *
|
1503 | * If `exitEarly` is set to true the commands will stop running at the first
|
1504 | * chainable command which doesn't return true.
|
1505 | */
|
1506 | run: (options?: {
|
1507 | exitEarly?: boolean;
|
1508 | }) => void;
|
1509 | /**
|
1510 | * Applies the updates to the transaction without dispatching the transaction.
|
1511 | *
|
1512 | * This can be used to update a transaction without applying the update.
|
1513 | */
|
1514 | tr: () => Transaction;
|
1515 | /**
|
1516 | * Check to see whether the command chain can be run. Returns true when the
|
1517 | * command can be run.
|
1518 | *
|
1519 | * ```ts
|
1520 | * if (chain.insertText('hello').enabled()) {
|
1521 | * doSomething();
|
1522 | * }
|
1523 | * ```
|
1524 | */
|
1525 | enabled: () => boolean;
|
1526 | }
|
1527 | interface NewChainedCommandProps<Extension extends AnyExtension, Chained extends ChainedIntersection<Extension> = ChainedIntersection<Extension>> {
|
1528 | /**
|
1529 | * Returns a new chain, with an empty command set.
|
1530 | *
|
1531 | * ```ts
|
1532 | * chain.toggleBold();
|
1533 | * chain.new().toggleItalic().run(); // Only toggleItalic would be run
|
1534 | * ```
|
1535 | */
|
1536 | new: (tr?: Transaction) => ChainedFromExtensions<Extension, Chained>;
|
1537 | }
|
1538 | type ChainedIntersection<Extension extends AnyExtension> = UnionToIntersection<MapToChainedCommand<GetCommands<Extension> | GetDecoratedCommands<Extension>>>;
|
1539 | type ChainedFromExtensions<Extension extends AnyExtension, Chained extends ChainedIntersection<Extension> = ChainedIntersection<Extension>> = _ChainedFromExtensions<Extension, Chained> & ((tr: Transaction) => _ChainedFromExtensions<Extension, Chained>);
|
1540 | type _ChainedFromExtensions<Extension extends AnyExtension, Chained extends ChainedIntersection<Extension> = ChainedIntersection<Extension>> = ChainedCommandProps & NewChainedCommandProps<Extension, Chained> & {
|
1541 | [Command in keyof Chained]: Chained[Command] extends (...args: any[]) => any ? (...args: Parameters<Chained[Command]>) => ChainedFromExtensions<Extension> : never;
|
1542 | };
|
1543 | /**
|
1544 | * Utility type for pulling all the command names from a list
|
1545 | */
|
1546 | type CommandNames<Extension extends AnyExtension> = StringKey<CommandsFromExtensions<Extension>>;
|
1547 | /**
|
1548 | * A utility type which maps the passed in extension helpers to a method called
|
1549 | * with `manager.data.helpers.helperName()`.
|
1550 | */
|
1551 | type MapHelpers<RawHelpers extends Record<string, AnyFunction>> = {
|
1552 | [Helper in keyof RawHelpers]: RawHelpers[Helper];
|
1553 | };
|
1554 | /**
|
1555 | * Utility type which receives an extension and provides the type of helpers it
|
1556 | * makes available.
|
1557 | *
|
1558 | * @typeParam Extension - the extensions being used within the editor
|
1559 | * @typeParam Expanded - auto generated from `Extension`. These are the
|
1560 | * fully expanded extensions with all sub extensions automatically provided. You
|
1561 | * never need to provide this type as it is automatically calculated.
|
1562 | */
|
1563 | type HelpersFromExtensions<Extension extends AnyExtension, Expanded extends AnyExtension = GetExtensions<Extension>> = UnionToIntersection<MapHelpers<GetHelpers<Expanded> | GetDecoratedHelpers<Expanded>>>;
|
1564 | type HelperAnnotation = Flavoring<'HelperAnnotation'>;
|
1565 | /**
|
1566 | * An annotation which marks decorated helper methods for an extension.
|
1567 | */
|
1568 | type Helper<Type> = Type extends null | undefined ? Type : Type & HelperAnnotation;
|
1569 | /**
|
1570 | * Remove the helper annotation.
|
1571 | */
|
1572 | type RemoveHelper<Type> = Type extends Helper<infer T> ? T : Type;
|
1573 | type RemoveHelpers<Type extends Record<string, AnyFunction>> = {
|
1574 | [Key in keyof Type]: (...args: Parameters<Type[Key]>) => RemoveHelper<ReturnType<Type[Key]>>;
|
1575 | };
|
1576 | /**
|
1577 | * A function with a return signature annotated as a helper.
|
1578 | */
|
1579 | type HelperFunction<Type extends HelperAnnotation = HelperAnnotation> = AnyFunction<Type>;
|
1580 | type GetDecoratedHelpers<Type> = Type extends object ? RemoveHelpers<ConditionalReturnPick<Type, HelperAnnotation>> : never;
|
1581 | /**
|
1582 | * Utility type for pulling all the action names from a list
|
1583 | */
|
1584 | type HelperNames<Extension extends AnyExtension> = StringKey<HelpersFromExtensions<Extension>>;
|
1585 | /**
|
1586 | * Removes [[`AnyExtension`]] from an extension union. This can be used to make
|
1587 | * typechecking stricter.
|
1588 | *
|
1589 | * @typeParam Extension - The union of extensions to remove [[`AnyExtension`]] from.
|
1590 | */
|
1591 | type RemoveAny<Extension> = Extension extends Extension ? AnyExtension extends Extension ? never : Extension : never;
|
1592 | /**
|
1593 | * Get the extension type and the extension type of all sub extensions.
|
1594 | *
|
1595 | * This uses recursive conditional types which are only available in
|
1596 | * `typescript@4.1` https://github.com/microsoft/TypeScript/pull/40002
|
1597 | *
|
1598 | * @typeParam Extension - The union of extensions.
|
1599 | */
|
1600 | type GetExtensions<Extension> = AnyExtension extends Extension ? AnyExtension : Extension extends AnyExtension ? // Now create the union of the provided extension and it's recursively
|
1601 | Extension | GetExtensions<Extension['~E']> : AnyExtension;
|
1602 | /**
|
1603 | * Extract the function return type if the generic type is a function, otherwise
|
1604 | *
|
1605 | * @internal
|
1606 | *
|
1607 | * @example
|
1608 | *
|
1609 | * ```ts
|
1610 | * type A = () => string
|
1611 | * type B = UnpackedReturnType<A>
|
1612 | * // B = string
|
1613 | *
|
1614 | * type C = string
|
1615 | * type D = UnpackedReturnType<A>
|
1616 | * // D = string
|
1617 | * ```
|
1618 | */
|
1619 | type UnpackedReturnType<MaybeFunction> = MaybeFunction extends (...args: any[]) => infer Returned ? Returned : MaybeFunction;
|
1620 | /**
|
1621 | * Get the union extension type from an array of extensions or from a function that returns an array of extension.
|
1622 | *
|
1623 | * @example
|
1624 | *
|
1625 | * ```ts
|
1626 | * const extensions = [new BoldExtension(), new ItalicExtension()];
|
1627 | * type Extension = UnpackedExtension<typeof extensions>
|
1628 | * // Extension = BoldExtension | ItalicExtension
|
1629 | * ```
|
1630 | *
|
1631 | * @example
|
1632 | *
|
1633 | * ```ts
|
1634 | * const extensions = () => [new BoldExtension(), new ItalicExtension()];
|
1635 | * type Extension = UnpackedExtension<typeof extensions>
|
1636 | * // Extension = BoldExtension | ItalicExtension
|
1637 | * ```
|
1638 | */
|
1639 | type UnpackedExtension<Extension extends AnyExtension[] | (() => AnyExtension[])> = UnpackedReturnType<Extension>[number];
|
1640 | /**
|
1641 | * The type which gets the active methods from the provided extensions.
|
1642 | */
|
1643 | type ActiveFromExtensions<Extension extends AnyExtension> = Record<GetNodeNameUnion<Extension> extends never ? string : GetNodeNameUnion<Extension>, (attrs?: ProsemirrorAttributes) => boolean> & Record<GetMarkNameUnion<Extension> extends never ? string : GetMarkNameUnion<Extension>, (attrs?: ProsemirrorAttributes) => boolean>;
|
1644 | /**
|
1645 | * The type which gets the attributes for the provided node or mark. It returns
|
1646 | * undefined if the node / mark is not active.
|
1647 | */
|
1648 | type AttrsFromExtensions<Extension extends AnyExtension> = Record<GetNodeNameUnion<Extension> extends never ? string : GetNodeNameUnion<Extension>, (attrs?: ProsemirrorAttributes) => ProsemirrorAttributes | undefined> & Record<GetMarkNameUnion<Extension> extends never ? string : GetMarkNameUnion<Extension>, (attrs?: ProsemirrorAttributes) => ProsemirrorAttributes | undefined>;
|
1649 | /**
|
1650 | * Get the names of all available extensions.
|
1651 | */
|
1652 | type GetNameUnion<Extension extends AnyExtension> = GetExtensions<Extension>['name'];
|
1653 | /**
|
1654 | * A utility type for retrieving the name of an extension only when it's a plain
|
1655 | * extension.
|
1656 | *
|
1657 | * @typeParam Extension - the extensions being used within the editor
|
1658 | * @typeParam Expanded - auto generated from `Extension`. These are the
|
1659 | * fully expanded extensions with all sub extensions automatically provided. You
|
1660 | * never need to provide this type as it is automatically calculated.
|
1661 | */
|
1662 | type GetPlainNameUnion<Extension extends AnyExtension, Expanded extends AnyExtension = GetExtensions<Extension>> = Expanded extends AnyPlainExtension ? Expanded['name'] : never;
|
1663 | /**
|
1664 | * A utility type for retrieving the name of an extension only when it's a mark
|
1665 | * extension.
|
1666 | *
|
1667 | * @typeParam Extension - the extensions being used within the editor
|
1668 | * @typeParam Expanded - auto generated from `Extension`. These are the
|
1669 | * fully expanded extensions with all sub extensions automatically provided. You
|
1670 | * never need to provide this type as it is automatically calculated.
|
1671 | */
|
1672 | type GetMarkNameUnion<Extension extends AnyExtension, Expanded extends AnyExtension = GetExtensions<Extension>> = Expanded extends AnyMarkExtension ? Expanded['name'] : never;
|
1673 | /**
|
1674 | * A utility type for retrieving the name of an extension only when it's a node
|
1675 | * extension.
|
1676 | *
|
1677 | * @typeParam Extension - the extensions being used within the editor
|
1678 | * @typeParam Expanded - auto generated from `Extension`. These are the
|
1679 | * fully expanded extensions with all sub extensions automatically provided. You
|
1680 | * never need to provide this type as it is automatically calculated.
|
1681 | */
|
1682 | type GetNodeNameUnion<Extension extends AnyExtension, Expanded extends AnyExtension = GetExtensions<Extension>> = Expanded extends AnyNodeExtension ? Expanded['name'] : never;
|
1683 | declare global {
|
1684 | namespace Remirror {
|
1685 | /**
|
1686 | * A utility type for all the globally available extension names. This is
|
1687 | * mainly used to provide autocompletion.
|
1688 | */
|
1689 | type NameUnion = LiteralUnion<GetNameUnion<Extensions>, string>;
|
1690 | /**
|
1691 | * A utility type for all the globally available plain extension names. This
|
1692 | * is mainly used to provide autocompletion.
|
1693 | */
|
1694 | type PlainNameUnion = LiteralUnion<GetPlainNameUnion<Extensions>, string>;
|
1695 | /**
|
1696 | * A utility type for all the globally available node extension names. This
|
1697 | * is mainly used to provide autocompletion.
|
1698 | */
|
1699 | type NodeNameUnion = LiteralUnion<GetNodeNameUnion<Extensions>, string>;
|
1700 | /**
|
1701 | * A utility type for all the globally available mark extension names. This
|
1702 | * is mainly used to provide autocompletion.
|
1703 | */
|
1704 | type MarkNameUnion = LiteralUnion<GetMarkNameUnion<Extensions>, string>;
|
1705 | }
|
1706 | }
|
1707 |
|
1708 | type ClassName<T = string> = T | false | void | null | 0 | '';
|
1709 | declare function cx(...classes: ClassName[]): string;
|
1710 |
|
1711 | /**
|
1712 | * This extension allows others extension to add the `createAttributes` method
|
1713 | * for adding attributes to the prosemirror dom element.
|
1714 | *
|
1715 | * @remarks
|
1716 | *
|
1717 | * Use this to include all the dynamically generated attributes provided by each
|
1718 | * extension. High priority extensions have preference over the lower priority
|
1719 | * extensions.
|
1720 | *
|
1721 | * @category Builtin Extension
|
1722 | */
|
1723 | declare class AttributesExtension extends PlainExtension {
|
1724 | get name(): "attributes";
|
1725 | private attributeList;
|
1726 | private attributeObject;
|
1727 | /**
|
1728 | * Create the attributes object on initialization.
|
1729 | *
|
1730 | * @internal
|
1731 | */
|
1732 | onCreate(): void;
|
1733 | private readonly updateAttributes;
|
1734 | private transformAttributes;
|
1735 | }
|
1736 | declare global {
|
1737 | namespace Remirror {
|
1738 | interface ManagerStore<Extension extends AnyExtension> {
|
1739 | /**
|
1740 | * The attributes to be added to the prosemirror editor.
|
1741 | */
|
1742 | attributes: ProsemirrorAttributes;
|
1743 | }
|
1744 | interface ExtensionStore {
|
1745 | /**
|
1746 | * Triggers a recalculation of the `view.dom` attributes for each
|
1747 | * extension and notifies the parent UI once done.
|
1748 | *
|
1749 | * This will also dispatch an update to the state automatically. However
|
1750 | * you can disable this by setting `triggerUpdate` to `false`.
|
1751 | *
|
1752 | * By not triggering an update the new value may not be capture by the view layer, e.g. `React`.
|
1753 | *
|
1754 | * @param triggerUpdate - defaults to true
|
1755 | */
|
1756 | updateAttributes: (triggerUpdate?: boolean) => void;
|
1757 | }
|
1758 | interface ExcludeOptions {
|
1759 | /**
|
1760 | * Whether to use the attributes provided by this extension
|
1761 | *
|
1762 | * @defaultValue undefined
|
1763 | */
|
1764 | attributes?: boolean;
|
1765 | }
|
1766 | interface BaseExtension {
|
1767 | /**
|
1768 | * A list of class names to add to the main editor element.
|
1769 | */
|
1770 | classNames?: ClassName[];
|
1771 | /**
|
1772 | * Allows the extension to modify the attributes for the Prosemirror editor
|
1773 | * dom element.
|
1774 | *
|
1775 | * @remarks
|
1776 | *
|
1777 | * Sometimes an extension will need to make a change to the attributes of the
|
1778 | * editor itself. For example a placeholder may need to do some work to make
|
1779 | * the editor more accessible by setting the `aria-placeholder` value to match
|
1780 | * the value of the placeholder.
|
1781 | *
|
1782 | * @alpha
|
1783 | */
|
1784 | createAttributes?(): ProsemirrorAttributes;
|
1785 | }
|
1786 | interface AllExtensions {
|
1787 | attributes: AttributesExtension;
|
1788 | }
|
1789 | }
|
1790 | }
|
1791 |
|
1792 | /**
|
1793 | * A decorator which can be applied to top level methods on an extension to
|
1794 | * identify them as helpers. This can be used as a replacement for the
|
1795 | * `createHelpers` method.
|
1796 | *
|
1797 | * To allow the TypeScript compiler to automatically infer types, please create
|
1798 | * your methods with the following type signature.
|
1799 | *
|
1800 | * ```ts
|
1801 | * import { CommandFunction } from '@remirror/core';
|
1802 | *
|
1803 | * type Signature = (...args: any[]) => CommandFunction;
|
1804 | * ```
|
1805 | *
|
1806 | * The following is an example of how this can be used within your extension.
|
1807 | *
|
1808 | * ```ts
|
1809 | * import { helper, Helper } from '@remirror/core';
|
1810 | *
|
1811 | * class MyExtension {
|
1812 | * get name() {
|
1813 | * return 'my';
|
1814 | * }
|
1815 | *
|
1816 | * @helper()
|
1817 | * alwaysTrue(): Helper<boolean> {
|
1818 | * return true;
|
1819 | * }
|
1820 | * }
|
1821 | * ```
|
1822 | *
|
1823 | * The above helper can now be used within your editor instance.
|
1824 | *
|
1825 | * ```tsx
|
1826 | * import { useRemirrorContext } from '@remirror/react';
|
1827 | *
|
1828 | * const MyEditorButton = () => {
|
1829 | * const { helpers } = useRemirrorContext();
|
1830 | *
|
1831 | * return helpers.alwaysTrue() ? <button>My Button</button> : null
|
1832 | * }
|
1833 | * ```
|
1834 | *
|
1835 | * @category Method Decorator
|
1836 | */
|
1837 | declare function helper(options?: HelperDecoratorOptions): <Extension extends AnyExtension, Type>(target: Extension, propertyKey: string, _descriptor: TypedPropertyDescriptor<AnyFunction<NonNullable<Type> extends HelperAnnotation ? Type : never>>) => void;
|
1838 | /**
|
1839 | * A decorator which can be applied to top level methods on an extension to
|
1840 | * identify them as commands. This can be used as a replacement for the
|
1841 | * `createCommands` method.
|
1842 | *
|
1843 | * If you prefer not to use decorators, then you can continue using
|
1844 | * `createCommands`. Internally the decorators are being used as they are better
|
1845 | * for documentation purposes.
|
1846 | *
|
1847 | * For automated type inference methods that use this decorator must implement
|
1848 | * the following type signature.
|
1849 | *
|
1850 | * ```ts
|
1851 | * import { CommandFunction } from '@remirror/core';
|
1852 | *
|
1853 | * type Signature = (...args: any[]) => CommandFunction;
|
1854 | * ```
|
1855 | *
|
1856 | * The following is an example of how this can be used within your extension.
|
1857 | *
|
1858 | * ```ts
|
1859 | * import { command, CommandFunction } from '@remirror/core';
|
1860 | *
|
1861 | * class MyExtension {
|
1862 | * get name() {
|
1863 | * return 'my';
|
1864 | * }
|
1865 | *
|
1866 | * @command()
|
1867 | * myCommand(text: string): CommandFunction {
|
1868 | * return ({ tr, dispatch }) => {
|
1869 | * dispatch?.(tr.insertText('my command ' + text));
|
1870 | * return true;
|
1871 | * }
|
1872 | * }
|
1873 | * }
|
1874 | * ```
|
1875 | *
|
1876 | * The above command can now be used within your editor instance.
|
1877 | *
|
1878 | * ```tsx
|
1879 | * import { useRemirrorContext } from '@remirror/react';
|
1880 | *
|
1881 | * const MyEditorButton = () => {
|
1882 | * const { commands } = useRemirrorContext();
|
1883 | *
|
1884 | * return <button onClick={() => commands.myCommand('hello')}>My Button</button>
|
1885 | * }
|
1886 | * ```
|
1887 | *
|
1888 | * @category Method Decorator
|
1889 | */
|
1890 | declare function command<Extension extends AnyExtension>(options?: ChainableCommandDecoratorOptions<Required<GetOptions<Extension>>>): ExtensionDecorator<Extension, CommandFunction, void>;
|
1891 | declare function command<Extension extends AnyExtension>(options: NonChainableCommandDecoratorOptions<Required<GetOptions<Extension>>>): ExtensionDecorator<Extension, NonChainableCommandFunction, void>;
|
1892 | /**
|
1893 | * A decorator which can be applied to an extension method to
|
1894 | * identify as a key binding method. This can be used as a replacement for
|
1895 | * the `createKeymap` method depending on your preference.
|
1896 | *
|
1897 | * If you prefer not to use decorators, then you can continue using
|
1898 | * `createKeymap`.
|
1899 | *
|
1900 | * @category Method Decorator
|
1901 | */
|
1902 | declare function keyBinding<Extension extends AnyExtension>(options: KeybindingDecoratorOptions<Required<GetOptions<Extension>>>): (target: Extension, propertyKey: string, _descriptor: TypedPropertyDescriptor<KeyBindingCommandFunction>) => void;
|
1903 | interface HelperDecoratorOptions {
|
1904 | }
|
1905 | type KeyboardShortcutFunction<Options extends Shape = Shape> = (options: Options, store: Remirror.ExtensionStore) => KeyboardShortcut;
|
1906 | type KeyboardShortcutValue = Listable<LiteralUnion<'Enter' | 'ArrowDown' | 'ArrowUp' | 'ArrowLeft' | 'ArrowRight' | 'Escape' | 'Delete' | 'Backspace', string>>;
|
1907 | type KeyboardShortcut = KeyboardShortcutValue | KeyboardShortcutFunction;
|
1908 | interface KeybindingDecoratorOptions<Options extends Shape = Shape> {
|
1909 | /**
|
1910 | * The keypress sequence to intercept.
|
1911 | *
|
1912 | * - `Enter`
|
1913 | * - `Shift-Enter`
|
1914 | */
|
1915 | shortcut: KeyboardShortcut;
|
1916 | /**
|
1917 | * This can be used to set a keybinding as inactive based on the provided
|
1918 | * options.
|
1919 | */
|
1920 | isActive?: (options: Options, store: Remirror.ExtensionStore) => boolean;
|
1921 | /**
|
1922 | * The priority for this keybinding.
|
1923 | */
|
1924 | priority?: ExtensionPriority | ((options: Options, store: Remirror.ExtensionStore) => ExtensionPriority);
|
1925 | /**
|
1926 | * The name of the command that the keybinding should be attached to.
|
1927 | */
|
1928 | command?: Remirror.AllUiCommandNames;
|
1929 | }
|
1930 | type ExtensionDecorator<Extension extends AnyExtension, Fn, Return> = (target: Extension, propertyKey: string, _descriptor: TypedPropertyDescriptor<AnyFunction<Fn>>) => Return;
|
1931 | interface CommandUiIcon {
|
1932 | /**
|
1933 | * The icon name.
|
1934 | */
|
1935 | name: CoreIcon;
|
1936 | /**
|
1937 | * Text placed in a superscript position. For `ltr` this is in the top right
|
1938 | * hand corner of the icon.
|
1939 | */
|
1940 | sup?: string;
|
1941 | /**
|
1942 | * Text placed in a subscript position. For `ltr` this is in the bottom right
|
1943 | * hand corner.
|
1944 | */
|
1945 | sub?: string;
|
1946 | }
|
1947 | type CommandDecoratorShortcut = string | {
|
1948 | shortcut: string;
|
1949 | attrs: ProsemirrorAttributes;
|
1950 | } | string[] | Array<{
|
1951 | shortcut: string;
|
1952 | attrs: ProsemirrorAttributes;
|
1953 | }>;
|
1954 | interface CommandUiDecoratorOptions {
|
1955 | /**
|
1956 | * The default command icon to use if this has a UI representation.
|
1957 | */
|
1958 | icon?: CommandDecoratorValue<CoreIcon | CommandUiIcon>;
|
1959 | /**
|
1960 | * A label for the command with support for i18n. This makes use of
|
1961 | * `babel-plugin-macros` to generate the message.
|
1962 | */
|
1963 | label?: CommandDecoratorMessage;
|
1964 | /**
|
1965 | * An i18n compatible description which can be used to provide extra context
|
1966 | * for the command.
|
1967 | */
|
1968 | description?: CommandDecoratorMessage;
|
1969 | /**
|
1970 | * A keyboard shortcut which can be used to run the specified command.
|
1971 | *
|
1972 | * Rather than defining this here, you should create a decorated `keyBinding`
|
1973 | * and set the `command` name option. This way the shortcut will dynamically
|
1974 | * be added at runtime.
|
1975 | */
|
1976 | shortcut?: CommandDecoratorShortcut;
|
1977 | }
|
1978 | interface CommandDecoratorMessageProps {
|
1979 | /**
|
1980 | * True when the command is enabled.
|
1981 | */
|
1982 | enabled: boolean;
|
1983 | /**
|
1984 | * True when the extension is active.
|
1985 | */
|
1986 | active: boolean;
|
1987 | /**
|
1988 | * Predefined attributes which can influence the returned value.
|
1989 | */
|
1990 | attrs: ProsemirrorAttributes | undefined;
|
1991 | /**
|
1992 | * A translation utility for translating a predefined string / or message
|
1993 | * descriptor.
|
1994 | */
|
1995 | t: I18n['_'];
|
1996 | }
|
1997 | /**
|
1998 | * @typeParam Value - the value which should be returned from the function or
|
1999 | * used directly.
|
2000 | */
|
2001 | type CommandDecoratorValue<Value> = ((props: CommandDecoratorMessageProps) => Value) | Value;
|
2002 | type CommandDecoratorMessage = CommandDecoratorValue<string>;
|
2003 | interface ChainableCommandDecoratorOptions<Options extends Shape> extends Remirror.CommandDecoratorOptions<Options> {
|
2004 | /**
|
2005 | * Set this to `true` to disable chaining of this command. This means it will
|
2006 | * no longer be available when running `
|
2007 | *
|
2008 | * @defaultValue false
|
2009 | */
|
2010 | disableChaining?: false;
|
2011 | }
|
2012 | interface NonChainableCommandDecoratorOptions<Options extends Shape> extends Remirror.CommandDecoratorOptions<Options> {
|
2013 | /**
|
2014 | * Set this to `true` to disable chaining of this command. This means it will
|
2015 | * no longer be available when running `
|
2016 | *
|
2017 | * @defaultValue false
|
2018 | */
|
2019 | disableChaining: true;
|
2020 | }
|
2021 | type CommandDecoratorOptions<Options extends Shape = Shape> = ChainableCommandDecoratorOptions<Options> | NonChainableCommandDecoratorOptions<Options>;
|
2022 | declare global {
|
2023 | namespace Remirror {
|
2024 | /**
|
2025 | * UX options for the command which can be extended.
|
2026 | */
|
2027 | interface CommandDecoratorOptions<Options extends Shape = Shape> extends CommandUiDecoratorOptions {
|
2028 | /**
|
2029 | * A function which can be used to override whether a command is already
|
2030 | * active for the current selection.
|
2031 | */
|
2032 | active?: (options: Options, store: ExtensionStore) => boolean;
|
2033 | }
|
2034 | }
|
2035 | }
|
2036 |
|
2037 | /**
|
2038 | * The parameter that is passed into `DelayedCommand`s.
|
2039 | */
|
2040 | interface DelayedCommandProps<Value> {
|
2041 | /**
|
2042 | * Runs as soon as the command is triggered. For most delayed commands within
|
2043 | * the `remirror` codebase this is used to add a position tracker to the
|
2044 | * document.
|
2045 | */
|
2046 | immediate?: CommandFunction;
|
2047 | /**
|
2048 | * The promise that provides the value that the `onDone` callback uses to
|
2049 | * complete the delayed command.
|
2050 | */
|
2051 | promise: DelayedValue<Value>;
|
2052 | /**
|
2053 | * Called when the provided promise resolves.
|
2054 | */
|
2055 | onDone: CommandFunction<{
|
2056 | value: Value;
|
2057 | }>;
|
2058 | /**
|
2059 | * Called when the promise fails. This could be used to cleanup the active
|
2060 | * position trackers when the delayed command fails.
|
2061 | */
|
2062 | onFail?: CommandFunction;
|
2063 | }
|
2064 | type DelayedValue<Type> = Promise<Type> | (() => Promise<Type>);
|
2065 | /**
|
2066 | * Returns `true` when the provided value is a delayed value.
|
2067 | */
|
2068 | declare function isDelayedValue<Type>(value: unknown): value is DelayedValue<Type>;
|
2069 | /**
|
2070 | * Add tentative support for delayed commands in the editor.
|
2071 | *
|
2072 | * Delayed commands are commands that run an immediate action, like adding a
|
2073 | * tracker to a position in the document. Once the promise that is provided is
|
2074 | * returned the `onDone` parameter is run with the document in the current
|
2075 | * state. The tracker that was added can now be used to insert content, delete
|
2076 | * content or replace content.
|
2077 | *
|
2078 | * @experimental This is still being worked on and the API is subject to changes
|
2079 | * in structure going forward.
|
2080 | *
|
2081 | * @deprecated use [[`DelayedCommand`]] instead.
|
2082 | *
|
2083 | */
|
2084 | declare function delayedCommand<Value>({ immediate, promise, onDone, onFail, }: DelayedCommandProps<Value>): CommandFunction;
|
2085 | type DelayedPromiseCreator<Value> = (props: CommandFunctionProps) => Promise<Value>;
|
2086 | declare class DelayedCommand<Value> {
|
2087 | private readonly promiseCreator;
|
2088 | private readonly failureHandlers;
|
2089 | private readonly successHandlers;
|
2090 | private readonly validateHandlers;
|
2091 | constructor(promiseCreator: DelayedPromiseCreator<Value>);
|
2092 | /**
|
2093 | * The commands that will immediately be run and used to evaluate whether to
|
2094 | * proceed.
|
2095 | */
|
2096 | validate(handler: CommandFunction, method?: 'push' | 'unshift'): this;
|
2097 | /**
|
2098 | * Add a success callback to the handler.
|
2099 | */
|
2100 | success(handler: CommandFunction<{
|
2101 | value: Value;
|
2102 | }>, method?: 'push' | 'unshift'): this;
|
2103 | /**
|
2104 | * Add a failure callback to the handler.
|
2105 | */
|
2106 | failure(handler: CommandFunction<{
|
2107 | error: any;
|
2108 | }>, method?: 'push' | 'unshift'): this;
|
2109 | private runHandlers;
|
2110 | /**
|
2111 | * Generate the `remirror` command.
|
2112 | */
|
2113 | readonly generateCommand: () => CommandFunction;
|
2114 | }
|
2115 | interface ToggleMarkProps extends MarkTypeProps, Partial<AttributesProps> {
|
2116 | /**
|
2117 | * @deprecated use `selection` property instead.
|
2118 | */
|
2119 | range?: FromToProps;
|
2120 | /**
|
2121 | * The selection point for toggling the chosen mark.
|
2122 | */
|
2123 | selection?: PrimitiveSelection;
|
2124 | }
|
2125 | /**
|
2126 | * A custom `toggleMark` function that works for the `remirror` codebase.
|
2127 | *
|
2128 | * Create a command function that toggles the given mark with the given
|
2129 | * attributes. Will return `false` when the current selection doesn't support
|
2130 | * that mark. This will remove the mark if any marks of that type exist in the
|
2131 | * selection, or add it otherwise. If the selection is empty, this applies to
|
2132 | * the [stored marks](#state.EditorState.storedMarks) instead of a range of the
|
2133 | * document.
|
2134 | *
|
2135 | * The differences from the `prosemirror-commands` version.
|
2136 | * - Acts on the transaction rather than the state to allow for commands to be
|
2137 | * chained together.
|
2138 | * - Uses the ONE parameter function signature for compatibility with remirror.
|
2139 | * - Supports passing a custom range.
|
2140 | */
|
2141 | declare function toggleMark(props: ToggleMarkProps): CommandFunction;
|
2142 | interface InsertTextOptions extends Partial<FromToProps> {
|
2143 | /**
|
2144 | * Marks can be added to the inserted text.
|
2145 | */
|
2146 | marks?: Record<string, ProsemirrorAttributes>;
|
2147 | }
|
2148 | /**
|
2149 | * Insert text into the dom at the current location by default. If a promise is
|
2150 | * provided then the text will be inserted at the tracked position when the
|
2151 | * promise is resolved.
|
2152 | */
|
2153 | declare function insertText(text: string, options?: InsertTextOptions): CommandFunction;
|
2154 |
|
2155 | interface CommandOptions {
|
2156 | /**
|
2157 | * The className that is added to all tracker positions
|
2158 | *
|
2159 | * '@defaultValue 'remirror-tracker-position'
|
2160 | */
|
2161 | trackerClassName?: Static<string>;
|
2162 | /**
|
2163 | * The default element that is used for all trackers.
|
2164 | *
|
2165 | * @defaultValue 'span'
|
2166 | */
|
2167 | trackerNodeName?: Static<string>;
|
2168 | }
|
2169 | /**
|
2170 | * Generate chained and unchained commands for making changes to the editor.
|
2171 | *
|
2172 | * @remarks
|
2173 | *
|
2174 | * Typically actions are used to create interactive menus. For example a menu
|
2175 | * can use a command to toggle bold formatting or to undo the last action.
|
2176 | *
|
2177 | * @category Builtin Extension
|
2178 | */
|
2179 | declare class CommandsExtension extends PlainExtension<CommandOptions> {
|
2180 | get name(): "commands";
|
2181 | /**
|
2182 | * The current transaction which allows for making commands chainable.
|
2183 | *
|
2184 | * It is shared by all the commands helpers and can even be used in the
|
2185 | * [[`KeymapExtension`]].
|
2186 | *
|
2187 | * @internal
|
2188 | */
|
2189 | get transaction(): Transaction;
|
2190 | /**
|
2191 | * This is the holder for the shared transaction which is shared by commands
|
2192 | * in order to support chaining.
|
2193 | *
|
2194 | * @internal
|
2195 | */
|
2196 | private _transaction?;
|
2197 | /**
|
2198 | * Track the decorated command data.
|
2199 | */
|
2200 | private readonly decorated;
|
2201 | onCreate(): void;
|
2202 | /**
|
2203 | * Attach commands once the view is attached.
|
2204 | */
|
2205 | onView(view: EditorView$1): void;
|
2206 | /**
|
2207 | * Update the cached transaction whenever the state is updated.
|
2208 | */
|
2209 | onStateUpdate({ state }: StateUpdateLifecycleProps): void;
|
2210 | /**
|
2211 | * Create a plugin that solely exists to track forced updates via the
|
2212 | * generated plugin key.
|
2213 | */
|
2214 | createPlugin(): CreateExtensionPlugin;
|
2215 | /**
|
2216 | * Enable custom commands to be used within the editor by users.
|
2217 | *
|
2218 | * This is preferred to the initial idea of setting commands on the
|
2219 | * manager or even as a prop. The problem is that there's no typechecking
|
2220 | * and it should be just fine to add your custom commands here to see the
|
2221 | * dispatched immediately.
|
2222 | *
|
2223 | * To use it, firstly define the command.
|
2224 | *
|
2225 | * ```ts
|
2226 | * import { CommandFunction } from 'remirror';
|
2227 | *
|
2228 | * const myCustomCommand: CommandFunction = ({ tr, dispatch }) => {
|
2229 | * dispatch?.(tr.insertText('My Custom Command'));
|
2230 | *
|
2231 | * return true;
|
2232 | * }
|
2233 | * ```
|
2234 | *
|
2235 | * And then use it within the component.
|
2236 | *
|
2237 | * ```ts
|
2238 | * import React, { useCallback } from 'react';
|
2239 | * import { useRemirror } from '@remirror/react';
|
2240 | *
|
2241 | * const MyEditorButton = () => {
|
2242 | * const { commands } = useRemirror();
|
2243 | * const onClick = useCallback(() => {
|
2244 | * commands.customDispatch(myCustomCommand);
|
2245 | * }, [commands])
|
2246 | *
|
2247 | * return <button onClick={onClick}>Custom Command</button>
|
2248 | * }
|
2249 | * ```
|
2250 | *
|
2251 | * An alternative is to use a custom command directly from a
|
2252 | * `prosemirror-*` library. This can be accomplished in the following way.
|
2253 | *
|
2254 | *
|
2255 | * ```ts
|
2256 | * import { joinDown } from 'prosemirror-commands';
|
2257 | * import { convertCommand } from 'remirror';
|
2258 | *
|
2259 | * const MyEditorButton = () => {
|
2260 | * const { commands } = useRemirror();
|
2261 | * const onClick = useCallback(() => {
|
2262 | * commands.customDispatch(convertCommand(joinDown));
|
2263 | * }, [commands]);
|
2264 | *
|
2265 | * return <button onClick={onClick}>Custom Command</button>;
|
2266 | * };
|
2267 | * ```
|
2268 | */
|
2269 | customDispatch(command: CommandFunction): CommandFunction;
|
2270 | /**
|
2271 | * Insert text into the dom at the current location by default. If a
|
2272 | * promise is provided instead of text the resolved value will be inserted
|
2273 | * at the tracked position.
|
2274 | */
|
2275 | insertText(text: string | (() => Promise<string>), options?: InsertTextOptions): CommandFunction;
|
2276 | /**
|
2277 | * Select the text within the provided range.
|
2278 | *
|
2279 | * Here are some ways it can be used.
|
2280 | *
|
2281 | * ```ts
|
2282 | * // Set to the end of the document.
|
2283 | * commands.selectText('end');
|
2284 | *
|
2285 | * // Set the selection to the start of the document.
|
2286 | * commands.selectText('start');
|
2287 | *
|
2288 | * // Select all the text in the document.
|
2289 | * commands.selectText('all')
|
2290 | *
|
2291 | * // Select a range of text. It's up to you to make sure the selected
|
2292 | * // range is valid.
|
2293 | * commands.selectText({ from: 10, to: 15 });
|
2294 | *
|
2295 | * // Specify the anchor and range in the selection.
|
2296 | * commands.selectText({ anchor: 10, head: 15 });
|
2297 | *
|
2298 | * // Set to a specific position.
|
2299 | * commands.selectText(10);
|
2300 | *
|
2301 | * // Use a ProseMirror selection
|
2302 | * commands.selectText(TextSelection.near(state.doc.resolve(10)))
|
2303 | * ```
|
2304 | *
|
2305 | * Although this is called `selectText` you can provide your own selection
|
2306 | * option which can be any type of selection.
|
2307 | */
|
2308 | selectText(selection: PrimitiveSelection, options?: {
|
2309 | forceUpdate?: boolean;
|
2310 | }): CommandFunction;
|
2311 | /**
|
2312 | * Select the link at the current location.
|
2313 | */
|
2314 | selectMark(type: string | MarkType): CommandFunction;
|
2315 | /**
|
2316 | * Delete the provided range or current selection.
|
2317 | */
|
2318 | delete(range?: FromToProps): CommandFunction;
|
2319 | /**
|
2320 | * Fire an empty update to trigger an update to all decorations, and state
|
2321 | * that may not yet have run.
|
2322 | *
|
2323 | * This can be used in extensions to trigger updates when certain options that
|
2324 | * affect the editor state have changed.
|
2325 | *
|
2326 | * @param action - provide an action which is called just before the empty
|
2327 | * update is dispatched (only when dispatch is available). This can be used in
|
2328 | * chainable editor scenarios when you want to lazily invoke an action at the
|
2329 | * point the update is about to be applied.
|
2330 | */
|
2331 | emptyUpdate(action?: () => void): CommandFunction;
|
2332 | /**
|
2333 | * Force an update of the specific updatable ProseMirror props.
|
2334 | *
|
2335 | * This command is always available as a builtin command.
|
2336 | *
|
2337 | * @category Builtin Command
|
2338 | */
|
2339 | forceUpdate(...keys: UpdatableViewProps[]): CommandFunction;
|
2340 | /**
|
2341 | * Update the attributes for the node at the specified `pos` in the
|
2342 | * editor.
|
2343 | *
|
2344 | * @category Builtin Command
|
2345 | */
|
2346 | updateNodeAttributes<Type extends object>(pos: number, attrs: ProsemirrorAttributes<Type>): CommandFunction;
|
2347 | /**
|
2348 | * Set the content of the editor while preserving history.
|
2349 | *
|
2350 | * Under the hood this is replacing the content in the document with the new
|
2351 | * state.doc of the provided content.
|
2352 | *
|
2353 | * If the content is a string you will need to ensure you have the proper
|
2354 | * string handler set up in the editor.
|
2355 | */
|
2356 | setContent(content: RemirrorContentType, selection?: PrimitiveSelection): CommandFunction;
|
2357 | /**
|
2358 | * Reset the content of the editor while preserving the history.
|
2359 | *
|
2360 | * This means that undo and redo will still be active since the doc is replaced with a new doc.
|
2361 | */
|
2362 | resetContent(): CommandFunction;
|
2363 | /**
|
2364 | * Fire an update to remove the current range selection. The cursor will
|
2365 | * be placed at the anchor of the current range selection.
|
2366 | *
|
2367 | * A range selection is a non-empty text selection.
|
2368 | *
|
2369 | * @category Builtin Command
|
2370 | */
|
2371 | emptySelection(): CommandFunction;
|
2372 | /**
|
2373 | * Insert a new line into the editor.
|
2374 | *
|
2375 | * Depending on editor setup and where the cursor is placed this may have
|
2376 | * differing impacts.
|
2377 | *
|
2378 | * @category Builtin Command
|
2379 | */
|
2380 | insertNewLine(): CommandFunction;
|
2381 | /**
|
2382 | * Insert a node into the editor with the provided content.
|
2383 | *
|
2384 | * @category Builtin Command
|
2385 | */
|
2386 | insertNode(node: string | NodeType | ProsemirrorNode | Fragment, options?: InsertNodeOptions): CommandFunction;
|
2387 | /**
|
2388 | * Set the focus for the editor.
|
2389 | *
|
2390 | * If using this with chaining this should only be placed at the end of
|
2391 | * the chain. It can cause hard to debug issues when used in the middle of
|
2392 | * a chain.
|
2393 | *
|
2394 | * ```tsx
|
2395 | * import { useCallback } from 'react';
|
2396 | * import { useRemirrorContext } from '@remirror/react';
|
2397 | *
|
2398 | * const MenuButton = () => {
|
2399 | * const { chain } = useRemirrorContext();
|
2400 | * const onClick = useCallback(() => {
|
2401 | * chain
|
2402 | * .toggleBold()
|
2403 | * .focus('end')
|
2404 | * .run();
|
2405 | * }, [chain])
|
2406 | *
|
2407 | * return <button onClick={onClick}>Bold</button>
|
2408 | * }
|
2409 | * ```
|
2410 | */
|
2411 | focus(position?: FocusType): CommandFunction;
|
2412 | /**
|
2413 | * Blur focus from the editor and also update the selection at the same
|
2414 | * time.
|
2415 | */
|
2416 | blur(position?: PrimitiveSelection): CommandFunction;
|
2417 | /**
|
2418 | * Set the block type of the current selection or the provided range.
|
2419 | *
|
2420 | * @param nodeType - the node type to create
|
2421 | * @param attrs - the attributes to add to the node type
|
2422 | * @param selection - the position in the document to set the block node
|
2423 | * @param preserveAttrs - when true preserve the attributes at the provided selection
|
2424 | */
|
2425 | setBlockNodeType(nodeType: string | NodeType, attrs?: ProsemirrorAttributes, selection?: PrimitiveSelection, preserveAttrs?: boolean): CommandFunction;
|
2426 | /**
|
2427 | * Toggle between wrapping an inactive node with the provided node type, and
|
2428 | * lifting it up into it's parent.
|
2429 | *
|
2430 | * @param nodeType - the node type to toggle
|
2431 | * @param attrs - the attrs to use for the node
|
2432 | * @param selection - the selection point in the editor to perform the action
|
2433 | */
|
2434 | toggleWrappingNode(nodeType: string | NodeType, attrs?: ProsemirrorAttributes, selection?: PrimitiveSelection): CommandFunction;
|
2435 | /**
|
2436 | * Toggle a block between the provided type and toggleType.
|
2437 | */
|
2438 | toggleBlockNodeItem(toggleProps: ToggleBlockItemProps): CommandFunction;
|
2439 | /**
|
2440 | * Wrap the selection or the provided text in a node of the given type with the
|
2441 | * given attributes.
|
2442 | */
|
2443 | wrapInNode(nodeType: string | NodeType, attrs?: ProsemirrorAttributes, range?: FromToProps | undefined): CommandFunction;
|
2444 | /**
|
2445 | * Removes a mark from the current selection or provided range.
|
2446 | */
|
2447 | applyMark(markType: string | MarkType, attrs?: ProsemirrorAttributes, selection?: PrimitiveSelection): CommandFunction;
|
2448 | /**
|
2449 | * Removes a mark from the current selection or provided range.
|
2450 | */
|
2451 | toggleMark(props: ToggleMarkProps): CommandFunction;
|
2452 | /**
|
2453 | * Removes a mark from the current selection or provided range.
|
2454 | */
|
2455 | removeMark(props: RemoveMarkProps): CommandFunction;
|
2456 | /**
|
2457 | * Set the meta data to attach to the editor on the next update.
|
2458 | */
|
2459 | setMeta(name: string, value: unknown): CommandFunction;
|
2460 | /**
|
2461 | * Select all text in the editor.
|
2462 | */
|
2463 | selectAll(): CommandFunction;
|
2464 | /**
|
2465 | * Copy the selected content for non empty selections.
|
2466 | */
|
2467 | copy(): CommandFunction;
|
2468 | /**
|
2469 | * Select all text in the editor.
|
2470 | */
|
2471 | paste(): CommandFunction;
|
2472 | /**
|
2473 | * Cut the selected content.
|
2474 | */
|
2475 | cut(): CommandFunction;
|
2476 | /**
|
2477 | * Replaces text with an optional appended string at the end. The replacement
|
2478 | * can be text, or a custom node.
|
2479 | *
|
2480 | * @param props - see [[`ReplaceTextProps`]]
|
2481 | */
|
2482 | replaceText(props: ReplaceTextProps): CommandFunction;
|
2483 | /**
|
2484 | * Get the all the decorated commands available on the editor instance.
|
2485 | */
|
2486 | getAllCommandOptions(): Helper<Record<string, WithName<CommandDecoratorOptions>>>;
|
2487 | /**
|
2488 | * Get the options that were passed into the provided command.
|
2489 | */
|
2490 | getCommandOptions(name: string): Helper<WithName<CommandDecoratorOptions> | undefined>;
|
2491 | /**
|
2492 | * A short hand way of getting the `view`, `state`, `tr` and `dispatch`
|
2493 | * methods.
|
2494 | */
|
2495 | getCommandProp(): Helper<Required<CommandFunctionProps>>;
|
2496 | /**
|
2497 | * Update the command options via a shallow merge of the provided options. If
|
2498 | * no options are provided the entry is deleted.
|
2499 | *
|
2500 | * @internal
|
2501 | */
|
2502 | updateDecorated(name: string, options?: Partial<WithName<CommandDecoratorOptions>>): void;
|
2503 | /**
|
2504 | * Needed on iOS since `requestAnimationFrame` doesn't breaks the focus
|
2505 | * implementation.
|
2506 | */
|
2507 | private handleIosFocus;
|
2508 | /**
|
2509 | * Focus the editor after a slight delay.
|
2510 | */
|
2511 | private delayedFocus;
|
2512 | /**
|
2513 | * A helper for forcing through updates in the view layer. The view layer can
|
2514 | * check for the meta data of the transaction with
|
2515 | * `manager.store.getForcedUpdate(tr)`. If that has a value then it should use
|
2516 | * the unique symbol to update the key.
|
2517 | */
|
2518 | private readonly forceUpdateTransaction;
|
2519 | /**
|
2520 | * Check for a forced update in the transaction. This pulls the meta data
|
2521 | * from the transaction and if it is true then it was a forced update.
|
2522 | *
|
2523 | * ```ts
|
2524 | * import { CommandsExtension } from 'remirror/extensions';
|
2525 | *
|
2526 | * const commandsExtension = manager.getExtension(CommandsExtension);
|
2527 | * log(commandsExtension.getForcedUpdates(tr))
|
2528 | * ```
|
2529 | *
|
2530 | * This can be used for updating:
|
2531 | *
|
2532 | * - `nodeViews`
|
2533 | * - `editable` status of the editor
|
2534 | * - `attributes` - for the top level node
|
2535 | *
|
2536 | * @internal
|
2537 | */
|
2538 | private getForcedUpdates;
|
2539 | /**
|
2540 | * Get the command metadata.
|
2541 | */
|
2542 | private getCommandMeta;
|
2543 | private setCommandMeta;
|
2544 | /**
|
2545 | * Add the commands from the provided `commands` property to the `chained`,
|
2546 | * `original` and `unchained` objects.
|
2547 | */
|
2548 | private addCommands;
|
2549 | /**
|
2550 | * Create an unchained command method.
|
2551 | */
|
2552 | private unchainedFactory;
|
2553 | /**
|
2554 | * Create the unchained command.
|
2555 | */
|
2556 | private createUnchainedCommand;
|
2557 | /**
|
2558 | * Create a chained command method.
|
2559 | */
|
2560 | private chainedFactory;
|
2561 | }
|
2562 | interface InsertNodeOptions {
|
2563 | attrs?: ProsemirrorAttributes;
|
2564 | marks?: Array<Mark | string | MarkType>;
|
2565 | /**
|
2566 | * The content to insert.
|
2567 | */
|
2568 | content?: Fragment | ProsemirrorNode | ProsemirrorNode[] | string;
|
2569 | /**
|
2570 | * @deprecated use selection property instead.
|
2571 | */
|
2572 | range?: FromToProps;
|
2573 | /**
|
2574 | * Set the selection where the command should occur.
|
2575 | */
|
2576 | selection?: PrimitiveSelection;
|
2577 | /**
|
2578 | * Set this to true to replace an empty parent block with this content (if the
|
2579 | * content is a block node).
|
2580 | */
|
2581 | replaceEmptyParentBlock?: boolean;
|
2582 | }
|
2583 | /**
|
2584 | * Provides the list of Prosemirror EditorView props that should be updated/
|
2585 | */
|
2586 | type ForcedUpdateMeta = UpdatableViewProps[];
|
2587 | type UpdatableViewProps = 'attributes' | 'editable';
|
2588 | interface CommandExtensionMeta {
|
2589 | forcedUpdates?: UpdatableViewProps[];
|
2590 | }
|
2591 | /**
|
2592 | * A type with a name property.
|
2593 | */
|
2594 | type WithName<Type> = Type & {
|
2595 | name: string;
|
2596 | };
|
2597 | declare global {
|
2598 | namespace Remirror {
|
2599 | interface ManagerStore<Extension extends AnyExtension> {
|
2600 | /**
|
2601 | * Get the forced updates from the provided transaction.
|
2602 | */
|
2603 | getForcedUpdates: (tr: Transaction) => ForcedUpdateMeta;
|
2604 | /**
|
2605 | * Enables the use of custom commands created by extensions which extend
|
2606 | * the functionality of your editor in an expressive way.
|
2607 | *
|
2608 | * @remarks
|
2609 | *
|
2610 | * Commands are synchronous and immediately dispatched. This means that
|
2611 | * they can be used to create menu items when the functionality you need
|
2612 | * is already available by the commands.
|
2613 | *
|
2614 | * ```ts
|
2615 | * if (commands.toggleBold.isEnabled()) {
|
2616 | * commands.toggleBold();
|
2617 | * }
|
2618 | * ```
|
2619 | */
|
2620 | commands: CommandsFromExtensions<Extension>;
|
2621 | /**
|
2622 | * Chainable commands for composing functionality together in quaint and
|
2623 | * beautiful ways
|
2624 | *
|
2625 | * @remarks
|
2626 | *
|
2627 | * You can use this property to create expressive and complex commands
|
2628 | * that build up the transaction until it can be run.
|
2629 | *
|
2630 | * The way chainable commands work is by adding multiple steps to a shared
|
2631 | * transaction which is then dispatched when the `run` command is called.
|
2632 | * This requires making sure that commands within your code use the `tr`
|
2633 | * that is provided rather than the `state.tr` property. `state.tr`
|
2634 | * creates a new transaction which is not shared by the other steps in a
|
2635 | * chainable command.
|
2636 | *
|
2637 | * The aim is to make as many commands as possible chainable as explained
|
2638 | * [here](https://github.com/remirror/remirror/issues/418#issuecomment-666922209).
|
2639 | *
|
2640 | * There are certain commands that can't be made chainable.
|
2641 | *
|
2642 | * - undo
|
2643 | * - redo
|
2644 | *
|
2645 | * ```ts
|
2646 | * chain
|
2647 | * .toggleBold()
|
2648 | * .insertText('Hi')
|
2649 | * .setSelection('all')
|
2650 | * .run();
|
2651 | * ```
|
2652 | *
|
2653 | * The `run()` method ends the chain and dispatches the command.
|
2654 | */
|
2655 | chain: ChainedFromExtensions<Extension>;
|
2656 | }
|
2657 | interface BaseExtension {
|
2658 | /**
|
2659 | * `ExtensionCommands`
|
2660 | *
|
2661 | * This pseudo property makes it easier to infer Generic types of this
|
2662 | * class.
|
2663 | *
|
2664 | * @internal
|
2665 | */
|
2666 | ['~C']: this['createCommands'] extends AnyFunction ? ReturnType<this['createCommands']> : EmptyShape;
|
2667 | /**
|
2668 | * @experimental
|
2669 | *
|
2670 | * Stores all the command names for this decoration that have been added
|
2671 | * as decorators to the extension instance. This is used by the
|
2672 | * `CommandsExtension` to pick the commands and store meta data attached
|
2673 | * to each command.
|
2674 | *
|
2675 | * @internal
|
2676 | */
|
2677 | decoratedCommands?: Record<string, CommandDecoratorOptions>;
|
2678 | /**
|
2679 | * Create and register commands for that can be called within the editor.
|
2680 | *
|
2681 | * These are typically used to create menu's actions and as a direct
|
2682 | * response to user actions.
|
2683 | *
|
2684 | * @remarks
|
2685 | *
|
2686 | * The `createCommands` method should return an object with each key being
|
2687 | * unique within the editor. To ensure that this is the case it is
|
2688 | * recommended that the keys of the command are namespaced with the name
|
2689 | * of the extension.
|
2690 | *
|
2691 | * ```ts
|
2692 | * import { ExtensionFactory } from '@remirror/core';
|
2693 | *
|
2694 | * const MyExtension = ExtensionFactory.plain({
|
2695 | * name: 'myExtension',
|
2696 | * version: '1.0.0',
|
2697 | * createCommands() {
|
2698 | * return {
|
2699 | * haveFun() {
|
2700 | * return ({ state, dispatch }) => {
|
2701 | * if (dispatch) {
|
2702 | * dispatch(tr.insertText('Have fun!'));
|
2703 | * }
|
2704 | *
|
2705 | * return true; // True return signifies that this command is enabled.
|
2706 | * }
|
2707 | * },
|
2708 | * }
|
2709 | * }
|
2710 | * })
|
2711 | * ```
|
2712 | *
|
2713 | * The actions available in this case would be `undoHistory` and
|
2714 | * `redoHistory`. It is unlikely that any other extension would override
|
2715 | * these commands.
|
2716 | *
|
2717 | * Another benefit of commands is that they are picked up by typescript
|
2718 | * and can provide code completion for consumers of the extension.
|
2719 | */
|
2720 | createCommands?(): ExtensionCommandReturn;
|
2721 | }
|
2722 | interface ExtensionStore {
|
2723 | /**
|
2724 | * A property containing all the available commands in the editor.
|
2725 | *
|
2726 | * This should only be accessed after the `onView` lifecycle method
|
2727 | * otherwise it will throw an error. If you want to use it in the
|
2728 | * `createCommands` function then make sure it is used within the returned
|
2729 | * function scope and not in the outer scope.
|
2730 | */
|
2731 | commands: CommandsFromExtensions<Extensions | (AnyExtension & {
|
2732 | _T: false;
|
2733 | })>;
|
2734 | /**
|
2735 | * A method that returns an object with all the chainable commands
|
2736 | * available to be run.
|
2737 | *
|
2738 | * @remarks
|
2739 | *
|
2740 | * Each chainable command mutates the states transaction so after running
|
2741 | * all your commands. you should dispatch the desired transaction.
|
2742 | *
|
2743 | * This should only be called when the view has been initialized (i.e.)
|
2744 | * within the `createCommands` method calls.
|
2745 | *
|
2746 | * ```ts
|
2747 | * import { ExtensionFactory } from '@remirror/core';
|
2748 | *
|
2749 | * const MyExtension = ExtensionFactory.plain({
|
2750 | * name: 'myExtension',
|
2751 | * version: '1.0.0',
|
2752 | * createCommands: () => {
|
2753 | * // This will throw since it can only be called within the returned
|
2754 | * methods.
|
2755 | * const chain = this.store.chain; // ❌
|
2756 | *
|
2757 | * return {
|
2758 | * // This is good 😋
|
2759 | * haveFun() {
|
2760 | * return ({ state, dispatch }) =>
|
2761 | * this.store.chain.insertText('fun!').run(); ✅
|
2762 | * },
|
2763 | * }
|
2764 | * }
|
2765 | * })
|
2766 | * ```
|
2767 | *
|
2768 | * This should only be accessed after the `EditorView` has been fully
|
2769 | * attached to the `RemirrorManager`.
|
2770 | *
|
2771 | * The chain can also be called as a function with a custom `tr`
|
2772 | * parameter. This allows you to provide a custom transaction to use
|
2773 | * within the chainable commands.
|
2774 | *
|
2775 | * Use the command at the beginning of the command chain to override the
|
2776 | * shared transaction.
|
2777 | *
|
2778 | * There are times when you want to be sure of the transaction which is
|
2779 | * being updated.
|
2780 | *
|
2781 | * To restore the previous transaction call the `restore` chained method.
|
2782 | *
|
2783 | * @param tr - the transaction to set
|
2784 | */
|
2785 | chain: ChainedFromExtensions<Extensions | (AnyExtension & {
|
2786 | _T: false;
|
2787 | })>;
|
2788 | }
|
2789 | interface AllExtensions {
|
2790 | commands: CommandsExtension;
|
2791 | }
|
2792 | /**
|
2793 | * The command names for all core extensions.
|
2794 | */
|
2795 | type AllCommandNames = LiteralUnion<CommandNames<Remirror.Extensions>, string>;
|
2796 | /**
|
2797 | * The command names for all core extensions.
|
2798 | */
|
2799 | type AllUiCommandNames = LiteralUnion<UiCommandNames<Remirror.Extensions>, string>;
|
2800 | }
|
2801 | }
|
2802 |
|
2803 | interface DecorationsOptions$1 {
|
2804 | /**
|
2805 | * This setting is for adding a decoration to the selected text and can be
|
2806 | * used to preserve the marker for the selection when the editor loses focus.
|
2807 | *
|
2808 | * You can set it as `'selection'` to match the default styles provided by
|
2809 | * `@remirror/styles`.
|
2810 | *
|
2811 | * @defaultValue undefined
|
2812 | */
|
2813 | persistentSelectionClass?: AcceptUndefined<string | boolean>;
|
2814 | /**
|
2815 | * Add custom decorations to the editor via `extension.addHandler`. This can
|
2816 | * be used via the `useDecorations` hook available from `remirror/react`.
|
2817 | */
|
2818 | decorations: Handler<(state: EditorState) => DecorationSet>;
|
2819 | /**
|
2820 | * The className that is added to all placeholder positions
|
2821 | *
|
2822 | * '@defaultValue 'placeholder'
|
2823 | */
|
2824 | placeholderClassName?: Static<string>;
|
2825 | /**
|
2826 | * The default element that is used for all placeholders.
|
2827 | *
|
2828 | * @defaultValue 'span'
|
2829 | */
|
2830 | placeholderNodeName?: Static<string>;
|
2831 | }
|
2832 | /**
|
2833 | * Simplify the process of adding decorations to the editor. All the decorations
|
2834 | * added to the document this way are automatically tracked which allows for
|
2835 | * custom components to be nested inside decorations.
|
2836 | *
|
2837 | * @category Builtin Extension
|
2838 | */
|
2839 | declare class DecorationsExtension extends PlainExtension<DecorationsOptions$1> {
|
2840 | get name(): "decorations";
|
2841 | /**
|
2842 | * The placeholder decorations.
|
2843 | */
|
2844 | private placeholders;
|
2845 | /**
|
2846 | * A map of the html elements to their decorations.
|
2847 | */
|
2848 | private readonly placeholderWidgets;
|
2849 | onCreate(): void;
|
2850 | /**
|
2851 | * Create the extension plugin for inserting decorations into the editor.
|
2852 | */
|
2853 | createPlugin(): CreateExtensionPlugin;
|
2854 | updateDecorations(): CommandFunction;
|
2855 | /**
|
2856 | * Command to dispatch a transaction adding the placeholder decoration to
|
2857 | * be tracked.
|
2858 | *
|
2859 | * @param id - the value that is used to identify this tracker. This can
|
2860 | * be any value. A promise, a function call, a string.
|
2861 | * @param options - the options to call the tracked position with. You can
|
2862 | * specify the range `{ from: number; to: number }` as well as the class
|
2863 | * name.
|
2864 | */
|
2865 | addPlaceholder(id: unknown, placeholder: DecorationPlaceholder, deleteSelection?: boolean): CommandFunction;
|
2866 | /**
|
2867 | * A command to updated the placeholder decoration.
|
2868 | *
|
2869 | * To update multiple placeholders you can use chained commands.
|
2870 | *
|
2871 | * ```ts
|
2872 | * let idsWithData: Array<{id: unknown, data: number}>;
|
2873 | *
|
2874 | * for (const { id, data } of idsWithData) {
|
2875 | * chain.updatePlaceholder(id, data);
|
2876 | * }
|
2877 | *
|
2878 | * chain.run();
|
2879 | * ```
|
2880 | */
|
2881 | updatePlaceholder<Data = any>(id: unknown, data: Data): CommandFunction;
|
2882 | /**
|
2883 | * A command to remove the specified placeholder decoration.
|
2884 | */
|
2885 | removePlaceholder(id: unknown): CommandFunction;
|
2886 | /**
|
2887 | * A command to remove all active placeholder decorations.
|
2888 | */
|
2889 | clearPlaceholders(): CommandFunction;
|
2890 | /**
|
2891 | * Find the position for the tracker with the ID specified.
|
2892 | *
|
2893 | * @param id - the unique position id which can be any type
|
2894 | */
|
2895 | findPlaceholder(id: unknown): Helper<FromToProps | undefined>;
|
2896 | /**
|
2897 | * Find the positions of all the trackers in document.
|
2898 | */
|
2899 | findAllPlaceholders(): Helper<Map<unknown, FromToProps>>;
|
2900 | /**
|
2901 | * Add some decorations based on the provided settings.
|
2902 | */
|
2903 | createDecorations(state: EditorState): DecorationSet;
|
2904 | /**
|
2905 | * This stores all tracked positions in the editor and maps them via the
|
2906 | * transaction updates.
|
2907 | */
|
2908 | onApplyState(): void;
|
2909 | /**
|
2910 | * Add a widget placeholder and track it as a widget placeholder.
|
2911 | */
|
2912 | private addWidgetPlaceholder;
|
2913 | /**
|
2914 | * Add an inline placeholder.
|
2915 | */
|
2916 | private addInlinePlaceholder;
|
2917 | /**
|
2918 | * Add a placeholder for nodes.
|
2919 | */
|
2920 | private addNodePlaceholder;
|
2921 | /**
|
2922 | * Add the node and class name to the placeholder object.
|
2923 | */
|
2924 | private withRequiredBase;
|
2925 | /**
|
2926 | * Get the command metadata.
|
2927 | */
|
2928 | private getMeta;
|
2929 | /**
|
2930 | * Set the metadata for the command.
|
2931 | */
|
2932 | private setMeta;
|
2933 | /**
|
2934 | * Add a placeholder decoration with the specified params to the transaction
|
2935 | * and return the transaction.
|
2936 | *
|
2937 | * It is up to you to dispatch the transaction or you can just use the
|
2938 | * commands.
|
2939 | */
|
2940 | private addPlaceholderTransaction;
|
2941 | /**
|
2942 | * Update the data stored by a placeholder.
|
2943 | *
|
2944 | * This replaces the whole data value.
|
2945 | */
|
2946 | private updatePlaceholderTransaction;
|
2947 | /**
|
2948 | * Discards a previously defined tracker once not needed.
|
2949 | *
|
2950 | * This should be used to cleanup once the position is no longer needed.
|
2951 | */
|
2952 | private removePlaceholderTransaction;
|
2953 | /**
|
2954 | * This helper returns a transaction that clears all position trackers when
|
2955 | * any exist.
|
2956 | *
|
2957 | * Otherwise it returns undefined.
|
2958 | */
|
2959 | private clearPlaceholdersTransaction;
|
2960 | /**
|
2961 | * Handles delayed commands which rely on the
|
2962 | */
|
2963 | private readonly createPlaceholderCommand;
|
2964 | }
|
2965 | interface DecorationPlaceholderMeta {
|
2966 | /**
|
2967 | * The trackers to add.
|
2968 | */
|
2969 | added?: Array<WithBase<DecorationPlaceholder>>;
|
2970 | /**
|
2971 | * The trackers to update with new data. Data is an object and is used to
|
2972 | * include properties like `progress` for progress indicators. Only `widget`
|
2973 | * decorations can be updated in this way.
|
2974 | */
|
2975 | updated?: Array<{
|
2976 | id: unknown;
|
2977 | data: any;
|
2978 | }>;
|
2979 | /**
|
2980 | * The trackers to remove.
|
2981 | */
|
2982 | removed?: unknown[];
|
2983 | /**
|
2984 | * When set to true will delete all the active trackers.
|
2985 | */
|
2986 | clearTrackers?: boolean;
|
2987 | }
|
2988 | interface BasePlaceholder {
|
2989 | /**
|
2990 | * A custom class name to use for the placeholder decoration. All the trackers
|
2991 | * will automatically be given the class name `remirror-tracker-position`
|
2992 | *
|
2993 | * @defaultValue ''
|
2994 | */
|
2995 | className?: string;
|
2996 | /**
|
2997 | * A custom html element or string for a created element tag name.
|
2998 | *
|
2999 | * @defaultValue 'tracker'
|
3000 | */
|
3001 | nodeName?: string;
|
3002 | }
|
3003 | interface DataProps<Data = any> {
|
3004 | /**
|
3005 | * The data to store for this placeholder.
|
3006 | */
|
3007 | data?: Data;
|
3008 | }
|
3009 | interface InlinePlaceholder<Data = any> extends BasePlaceholder, Partial<FromToProps>, DataProps<Data> {
|
3010 | type: 'inline';
|
3011 | }
|
3012 | interface NodePlaceholder<Data = any> extends BasePlaceholder, DataProps<Data> {
|
3013 | /**
|
3014 | * Set this as a node tracker.
|
3015 | */
|
3016 | type: 'node';
|
3017 | /**
|
3018 | * If provided the The `pos` must be directly before the node in order to be
|
3019 | * valid. If not provided it will select the parent node of the current
|
3020 | * selection.
|
3021 | */
|
3022 | pos: number | null;
|
3023 | }
|
3024 | interface WidgetPlaceholder<Data = any> extends BasePlaceholder, DataProps<Data> {
|
3025 | /**
|
3026 | * Declare this as a widget tracker.
|
3027 | *
|
3028 | * Widget trackers support adding custom components to the created dom
|
3029 | * element.
|
3030 | */
|
3031 | type: 'widget';
|
3032 | /**
|
3033 | * Widget trackers only support fixed positions.
|
3034 | */
|
3035 | pos: number;
|
3036 | /**
|
3037 | * Called the first time this widget decoration is added to the dom.
|
3038 | */
|
3039 | createElement?(view: EditorView, pos: number): HTMLElement;
|
3040 | /**
|
3041 | * Called whenever the position tracker updates with the new position.
|
3042 | */
|
3043 | onUpdate?(view: EditorView, pos: number, element: HTMLElement, data: any): void;
|
3044 | /**
|
3045 | * Called when the widget decoration is removed from the dom.
|
3046 | */
|
3047 | onDestroy?(view: EditorView, element: HTMLElement): void;
|
3048 | }
|
3049 | type WithBase<Type extends BasePlaceholder> = MakeRequired<Type, keyof BasePlaceholder> & {
|
3050 | id: unknown;
|
3051 | };
|
3052 | type DecorationPlaceholder = WidgetPlaceholder | NodePlaceholder | InlinePlaceholder;
|
3053 | interface DelayedPlaceholderCommandProps<Value> {
|
3054 | /**
|
3055 | * A function that returns a promise.
|
3056 | */
|
3057 | promise: DelayedPromiseCreator<Value>;
|
3058 | /**
|
3059 | * The placeholder configuration.
|
3060 | */
|
3061 | placeholder: DecorationPlaceholder;
|
3062 | /**
|
3063 | * Called when the promise succeeds and the placeholder still exists. If no
|
3064 | * placeholder can be found (for example, the user has deleted the entire
|
3065 | * document) then the failure handler is called instead.
|
3066 | */
|
3067 | onSuccess: (value: Value, range: FromToProps, commandProps: CommandFunctionProps) => boolean;
|
3068 | /**
|
3069 | * Called when a failure is encountered.
|
3070 | */
|
3071 | onFailure?: CommandFunction<{
|
3072 | error: any;
|
3073 | }>;
|
3074 | }
|
3075 | declare global {
|
3076 | namespace Remirror {
|
3077 | interface ExtensionStore {
|
3078 | /**
|
3079 | * Create delayed command which automatically adds a placeholder to the
|
3080 | * document while the delayed command is being run and also automatically
|
3081 | * removes it once it has completed.
|
3082 | */
|
3083 | createPlaceholderCommand<Value = any>(props: DelayedPlaceholderCommandProps<Value>): DelayedCommand<Value>;
|
3084 | }
|
3085 | interface BaseExtension {
|
3086 | /**
|
3087 | * Create a decoration set which adds decorations to your editor. The
|
3088 | * first parameter is the `EditorState`.
|
3089 | *
|
3090 | * This can be used in combination with the `onApplyState` handler which
|
3091 | * can map the decoration.
|
3092 | *
|
3093 | * @param state - the editor state which was passed in.
|
3094 | */
|
3095 | createDecorations?(state: EditorState): DecorationSet;
|
3096 | }
|
3097 | interface AllExtensions {
|
3098 | decorations: DecorationsExtension;
|
3099 | }
|
3100 | }
|
3101 | }
|
3102 |
|
3103 | interface DocChangedOptions {
|
3104 | docChanged?: Handler<(props: StateUpdateLifecycleProps) => void>;
|
3105 | }
|
3106 | declare class DocChangedExtension extends PlainExtension<DocChangedOptions> {
|
3107 | get name(): "docChanged";
|
3108 | onStateUpdate(props: StateUpdateLifecycleProps): void;
|
3109 | }
|
3110 |
|
3111 | /**
|
3112 | * Helpers are custom methods that can provide extra functionality to the
|
3113 | * editor.
|
3114 | *
|
3115 | * @remarks
|
3116 | *
|
3117 | * They can be used for pulling information from the editor or performing custom
|
3118 | * async commands.
|
3119 | *
|
3120 | * Also provides the default helpers used within the extension.
|
3121 | *
|
3122 | * @category Builtin Extension
|
3123 | */
|
3124 | declare class HelpersExtension extends PlainExtension {
|
3125 | get name(): "helpers";
|
3126 | /**
|
3127 | * Add the `html` and `text` string handlers to the editor.
|
3128 | */
|
3129 | onCreate(): void;
|
3130 | /**
|
3131 | * Check whether the selection is empty.
|
3132 | */
|
3133 | isSelectionEmpty(state?: EditorState): Helper<boolean>;
|
3134 | isViewEditable(state?: EditorState): Helper<boolean>;
|
3135 | /**
|
3136 | * Get the full JSON output for the ProseMirror editor state object.
|
3137 | */
|
3138 | getStateJSON(state?: EditorState): Helper<StateJSON>;
|
3139 | /**
|
3140 | * Get the JSON output for the main ProseMirror `doc` node.
|
3141 | *
|
3142 | * This can be used to persist data between sessions and can be passed as
|
3143 | * content to the `initialContent` prop.
|
3144 | */
|
3145 | getJSON(state?: EditorState): Helper<RemirrorJSON>;
|
3146 | /**
|
3147 | * @deprecated use `getJSON` instead.
|
3148 | */
|
3149 | getRemirrorJSON(state?: EditorState): Helper<RemirrorJSON>;
|
3150 | /**
|
3151 | * Insert a html string as a ProseMirror Node.
|
3152 | *
|
3153 | * @category Builtin Command
|
3154 | */
|
3155 | insertHtml(html: string, options?: InsertNodeOptions): CommandFunction;
|
3156 | /**
|
3157 | * A method to get all the content in the editor as text. Depending on the
|
3158 | * content in your editor, it is not guaranteed to preserve it 100%, so it's
|
3159 | * best to test that it meets your needs before consuming.
|
3160 | */
|
3161 | getText({ lineBreakDivider, state, }?: GetTextHelperOptions): Helper<string>;
|
3162 | getTextBetween(from: number, to: number, doc?: ProsemirrorNode): Helper<string>;
|
3163 | /**
|
3164 | * Get the html from the current state, or provide a custom state.
|
3165 | */
|
3166 | getHTML(state?: EditorState): Helper<string>;
|
3167 | /**
|
3168 | * Wrap the content in a pre tag to preserve whitespace and see what the
|
3169 | * editor does with it.
|
3170 | */
|
3171 | private textToProsemirrorNode;
|
3172 | }
|
3173 | interface GetTextHelperOptions extends Partial<EditorStateProps> {
|
3174 | /**
|
3175 | * The divider used to separate text blocks.
|
3176 | *
|
3177 | * @defaultValue '\n\n'
|
3178 | */
|
3179 | lineBreakDivider?: string;
|
3180 | }
|
3181 | declare global {
|
3182 | namespace Remirror {
|
3183 | interface ManagerStore<Extension extends AnyExtension> {
|
3184 | /**
|
3185 | * The helpers provided by the extensions used.
|
3186 | */
|
3187 | helpers: HelpersFromExtensions<Extension>;
|
3188 | /**
|
3189 | * Check which nodes and marks are active under the current user
|
3190 | * selection.
|
3191 | *
|
3192 | * ```ts
|
3193 | * const { active } = manager.store;
|
3194 | *
|
3195 | * return active.bold() ? 'bold' : 'regular';
|
3196 | * ```
|
3197 | */
|
3198 | active: ActiveFromExtensions<Extension>;
|
3199 | /**
|
3200 | * Get the attributes for the named node or mark from the current user
|
3201 | * selection.
|
3202 | *
|
3203 | * ```ts
|
3204 | * const { attrs } = manager.store;
|
3205 | *
|
3206 | * attrs.heading(); // => { id: 'i1238ha', level: 1 }
|
3207 | * ```
|
3208 | */
|
3209 | attrs: AttrsFromExtensions<Extension>;
|
3210 | }
|
3211 | interface BaseExtension {
|
3212 | /**
|
3213 | * `ExtensionHelpers`
|
3214 | *
|
3215 | * This pseudo property makes it easier to infer Generic types of this
|
3216 | * class.
|
3217 | *
|
3218 | * @internal
|
3219 | */
|
3220 | ['~H']: this['createHelpers'] extends AnyFunction ? ReturnType<this['createHelpers']> : EmptyShape;
|
3221 | /**
|
3222 | * @experimental
|
3223 | *
|
3224 | * Stores all the helpers that have been added via decorators to the
|
3225 | * extension instance. This is used by the `HelpersExtension` to pick the
|
3226 | * helpers.
|
3227 | *
|
3228 | * @internal
|
3229 | */
|
3230 | decoratedHelpers?: Record<string, HelperDecoratorOptions>;
|
3231 | /**
|
3232 | * A helper method is a function that takes in arguments and returns a
|
3233 | * value depicting the state of the editor specific to this extension.
|
3234 | *
|
3235 | * @remarks
|
3236 | *
|
3237 | * Unlike commands they can return anything and may not effect the
|
3238 | * behavior of the editor.
|
3239 | *
|
3240 | * Below is an example which should provide some idea on how to add
|
3241 | * helpers to the app.
|
3242 | *
|
3243 | * ```tsx
|
3244 | * // extension.ts
|
3245 | * import { ExtensionFactory } from '@remirror/core';
|
3246 | *
|
3247 | * const MyBeautifulExtension = ExtensionFactory.plain({
|
3248 | * name: 'beautiful',
|
3249 | * createHelpers: () => ({
|
3250 | * checkBeautyLevel: () => 100
|
3251 | * }),
|
3252 | * })
|
3253 | * ```
|
3254 | *
|
3255 | * ```
|
3256 | * // app.tsx
|
3257 | * import { useRemirrorContext } from '@remirror/react';
|
3258 | *
|
3259 | * const MyEditor = () => {
|
3260 | * const { helpers } = useRemirrorContext({ autoUpdate: true });
|
3261 | *
|
3262 | * return helpers.beautiful.checkBeautyLevel() > 50
|
3263 | * ? (<span>😍</span>)
|
3264 | * : (<span>😢</span>);
|
3265 | * };
|
3266 | * ```
|
3267 | */
|
3268 | createHelpers?(): ExtensionHelperReturn;
|
3269 | }
|
3270 | interface StringHandlers {
|
3271 | /**
|
3272 | * Register the plain `text` string handler which renders a text string
|
3273 | * inside a `<pre />`.
|
3274 | */
|
3275 | text: HelpersExtension;
|
3276 | /**
|
3277 | * Register the html string handler, which converts a html string to a
|
3278 | * prosemirror node.
|
3279 | */
|
3280 | html: HelpersExtension;
|
3281 | }
|
3282 | interface ExtensionStore {
|
3283 | /**
|
3284 | * Helper method to provide information about the content of the editor.
|
3285 | * Each extension can register its own helpers.
|
3286 | *
|
3287 | * This should only be accessed after the `onView` lifecycle method
|
3288 | * otherwise it will throw an error.
|
3289 | */
|
3290 | helpers: HelpersFromExtensions<Extensions>;
|
3291 | /**
|
3292 | * Check which nodes and marks are active under the current user
|
3293 | * selection.
|
3294 | *
|
3295 | * ```ts
|
3296 | * const { active } = manager.store;
|
3297 | *
|
3298 | * return active.bold() ? 'bold' : 'regular';
|
3299 | * ```
|
3300 | */
|
3301 | active: ActiveFromExtensions<Extensions>;
|
3302 | /**
|
3303 | * Get the attributes for the named node or mark from the current user
|
3304 | * selection.
|
3305 | *
|
3306 | * ```ts
|
3307 | * const { attrs } = manager.store;
|
3308 | *
|
3309 | * attrs.heading(); // => { id: 'i1238ha', level: 1 }
|
3310 | * ```
|
3311 | */
|
3312 | attrs: AttrsFromExtensions<Extensions>;
|
3313 | }
|
3314 | interface ListenerProperties<Extension extends AnyExtension> {
|
3315 | helpers: HelpersFromExtensions<Extension>;
|
3316 | }
|
3317 | interface AllExtensions {
|
3318 | helpers: HelpersExtension;
|
3319 | }
|
3320 | }
|
3321 | /**
|
3322 | * The helpers name for all extension defined in the current project.
|
3323 | */
|
3324 | type AllHelperNames = LiteralUnion<HelperNames<Remirror.Extensions>, string>;
|
3325 | }
|
3326 |
|
3327 | interface InputRulesOptions {
|
3328 | /**
|
3329 | * Handlers which can be registered to check whether an input rule should be
|
3330 | * active at this time.
|
3331 | *
|
3332 | * The handlers are given a parameter with the current `state`, the `fullMatch`
|
3333 | * and the `captureGroup` and can determine whether the input rule should
|
3334 | * still be run.
|
3335 | *
|
3336 | * Return `true` to prevent any active input rules from being triggered.
|
3337 | */
|
3338 | shouldSkipInputRule?: Handler<ShouldSkipFunction>;
|
3339 | }
|
3340 | /**
|
3341 | * This extension allows others extension to add the `createInputRules` method
|
3342 | * for automatically transforming text when a certain regex pattern is typed.
|
3343 | *
|
3344 | * @remarks
|
3345 | *
|
3346 | * This is an example of adding custom functionality to an extension via the
|
3347 | * `ExtensionParameterMethods`.
|
3348 | *
|
3349 | * @category Builtin Extension
|
3350 | */
|
3351 | declare class InputRulesExtension extends PlainExtension<InputRulesOptions> {
|
3352 | get name(): "inputRules";
|
3353 | /**
|
3354 | * Add the extension store method for rebuilding all input rules.
|
3355 | */
|
3356 | onCreate(): void;
|
3357 | /**
|
3358 | * Add the `inputRules` plugin to the editor.
|
3359 | */
|
3360 | createExternalPlugins(): ProsemirrorPlugin[];
|
3361 | private generateInputRulesPlugin;
|
3362 | /**
|
3363 | * The method for rebuilding all the input rules.
|
3364 | *
|
3365 | * 1. Rebuild inputRules.
|
3366 | * 2. Replace the old input rules plugin.
|
3367 | * 3. Update the plugins used in the state (triggers an editor update).
|
3368 | */
|
3369 | private rebuildInputRules;
|
3370 | }
|
3371 | declare global {
|
3372 | namespace Remirror {
|
3373 | interface ExcludeOptions {
|
3374 | /**
|
3375 | * Whether to use the inputRules for this particular extension.
|
3376 | *
|
3377 | * @defaultValue undefined
|
3378 | */
|
3379 | inputRules?: boolean;
|
3380 | }
|
3381 | interface ExtensionStore {
|
3382 | /**
|
3383 | * When called this will run through every `createInputRules` method on every
|
3384 | * extension to recreate input rules.
|
3385 | *
|
3386 | * @remarks
|
3387 | *
|
3388 | * Under the hood it updates the plugin which is used to insert the
|
3389 | * input rules into the editor. This causes the state to be updated and
|
3390 | * will cause a rerender in your ui framework.
|
3391 | */
|
3392 | rebuildInputRules: () => void;
|
3393 | }
|
3394 | interface BaseExtension {
|
3395 | /**
|
3396 | * Register input rules which are activated if the regex matches as a user is
|
3397 | * typing.
|
3398 | *
|
3399 | * @param parameter - schema parameter with type included
|
3400 | */
|
3401 | createInputRules?(): InputRule[];
|
3402 | }
|
3403 | interface AllExtensions {
|
3404 | inputRules: InputRulesExtension;
|
3405 | }
|
3406 | }
|
3407 | }
|
3408 |
|
3409 | interface KeymapOptions {
|
3410 | /**
|
3411 | * The shortcuts to use for named keybindings in the editor.
|
3412 | *
|
3413 | * @defaultValue 'default'
|
3414 | */
|
3415 | shortcuts?: KeyboardShortcuts;
|
3416 | /**
|
3417 | * Determines whether a backspace after an input rule has been applied should
|
3418 | * reverse the effect of the input rule.
|
3419 | *
|
3420 | * @defaultValue true
|
3421 | */
|
3422 | undoInputRuleOnBackspace?: boolean;
|
3423 | /**
|
3424 | * Determines whether the escape key selects the current node.
|
3425 | *
|
3426 | * @defaultValue false
|
3427 | */
|
3428 | selectParentNodeOnEscape?: boolean;
|
3429 | /**
|
3430 | * When true will exclude the default prosemirror keymap.
|
3431 | *
|
3432 | * @remarks
|
3433 | *
|
3434 | * You might want to set this to true if you want to fully customise the
|
3435 | * keyboard mappings for your editor. Otherwise it is advisable to leave it
|
3436 | * unchanged.
|
3437 | *
|
3438 | * @defaultValue false
|
3439 | */
|
3440 | excludeBaseKeymap?: boolean;
|
3441 | /**
|
3442 | * Whether to support exiting marks when the left and right array keys are
|
3443 | * pressed.
|
3444 | *
|
3445 | * Can be set to
|
3446 | *
|
3447 | * - `true` - enables exits from both the entrance and the end of the mark
|
3448 | */
|
3449 | exitMarksOnArrowPress?: boolean;
|
3450 | /**
|
3451 | * The implementation for the extra keybindings added to the settings.
|
3452 | *
|
3453 | * @remarks
|
3454 | *
|
3455 | * This allows for you to add extra key mappings which will be checked before
|
3456 | * the default keymaps, if they return false then the default keymaps are
|
3457 | * still checked.
|
3458 | *
|
3459 | * No key mappings are removed in this process.
|
3460 | *
|
3461 | * ```ts
|
3462 | * const extension = BaseKeymapExtension.create({ keymap: {
|
3463 | * Enter({ state, dispatch }) {
|
3464 | * //... Logic
|
3465 | * return true;
|
3466 | * },
|
3467 | * }});
|
3468 | * ```
|
3469 | */
|
3470 | keymap?: CustomHandler<PrioritizedKeyBindings>;
|
3471 | }
|
3472 | /**
|
3473 | * This extension allows others extension to use the `createKeymaps` method.
|
3474 | *
|
3475 | * @remarks
|
3476 | *
|
3477 | * Keymaps are the way of controlling how the editor responds to a keypress and
|
3478 | * different key combinations.
|
3479 | *
|
3480 | * Without this extension most of the shortcuts and behaviors we have come to
|
3481 | * expect from text editors would not be provided.
|
3482 | *
|
3483 | * @category Builtin Extension
|
3484 | */
|
3485 | declare class KeymapExtension extends PlainExtension<KeymapOptions> {
|
3486 | get name(): "keymap";
|
3487 | /**
|
3488 | * The custom keybindings added by the handlers. In react these can be added
|
3489 | * via `hooks`.
|
3490 | */
|
3491 | private extraKeyBindings;
|
3492 | /**
|
3493 | * Track the backward exits from a mark to allow double tapping the left arrow
|
3494 | * to move to the previous block node.
|
3495 | */
|
3496 | private readonly backwardMarkExitTracker;
|
3497 | /**
|
3498 | * The underlying keydown handler.
|
3499 | */
|
3500 | private keydownHandler;
|
3501 | /**
|
3502 | * Get the shortcut map.
|
3503 | */
|
3504 | private get shortcutMap();
|
3505 | /**
|
3506 | * This adds the `createKeymap` method functionality to all extensions.
|
3507 | */
|
3508 | onCreate(): void;
|
3509 | /** Add the created keymap to the available plugins. */
|
3510 | createExternalPlugins(): ProsemirrorPlugin[];
|
3511 | private setupKeydownHandler;
|
3512 | /**
|
3513 | * Updates the stored keymap bindings on this extension.
|
3514 | */
|
3515 | private generateKeymapBindings;
|
3516 | /**
|
3517 | * Handle exiting the mark forwards.
|
3518 | */
|
3519 | arrowRightShortcut(props: KeyBindingProps): boolean;
|
3520 | /**
|
3521 | * Handle the arrow left key to exit the mark.
|
3522 | */
|
3523 | arrowLeftShortcut(props: KeyBindingProps): boolean;
|
3524 | /**
|
3525 | * Handle exiting the mark forwards.
|
3526 | */
|
3527 | backspace(props: KeyBindingProps): boolean;
|
3528 | /**
|
3529 | * Create the base keymap and give it a low priority so that all other keymaps
|
3530 | * override it.
|
3531 | */
|
3532 | createKeymap(): PrioritizedKeyBindings;
|
3533 | /**
|
3534 | * Get the real shortcut name from the named shortcut.
|
3535 | */
|
3536 | getNamedShortcut(shortcut: string, options?: Shape): Helper<string[]>;
|
3537 | /**
|
3538 | * @internalremarks
|
3539 | *
|
3540 | * Think about the case where bindings are disposed of and then added in a
|
3541 | * different position in the `extraKeyBindings` array. This is especially
|
3542 | * pertinent when using hooks.
|
3543 | */
|
3544 | protected onAddCustomHandler: AddCustomHandler<KeymapOptions>;
|
3545 | /**
|
3546 | * Handle changes in the dynamic properties.
|
3547 | */
|
3548 | protected onSetOptions(props: OnSetOptionsProps<KeymapOptions>): void;
|
3549 | private sortKeymaps;
|
3550 | /**
|
3551 | * The method for rebuilding all the extension keymaps.
|
3552 | *
|
3553 | * 1. Rebuild keymaps.
|
3554 | * 2. Replace `this.keydownHandler` with the new keydown handler.
|
3555 | */
|
3556 | private readonly rebuildKeymap;
|
3557 | /**
|
3558 | * Exits the mark forwards when at the end of a block node.
|
3559 | */
|
3560 | private exitMarkForwards;
|
3561 | private exitNodeBackwards;
|
3562 | /**
|
3563 | * Exit a mark when at the beginning of a block node.
|
3564 | */
|
3565 | private exitMarkBackwards;
|
3566 | }
|
3567 | /**
|
3568 | * A shortcut map which is used by the `KeymapExtension`.
|
3569 | */
|
3570 | type ShortcutMap = Record<NamedShortcut, string>;
|
3571 | /**
|
3572 | * The default named shortcuts used within `remirror`.
|
3573 | */
|
3574 | declare const DEFAULT_SHORTCUTS: ShortcutMap;
|
3575 | /**
|
3576 | * Shortcuts used within google docs.
|
3577 | */
|
3578 | declare const GOOGLE_DOC_SHORTCUTS: ShortcutMap;
|
3579 | declare const keyboardShortcuts: {
|
3580 | default: ShortcutMap;
|
3581 | googleDoc: ShortcutMap;
|
3582 | };
|
3583 | type KeyboardShortcuts = keyof typeof keyboardShortcuts | ShortcutMap;
|
3584 | /**
|
3585 | * KeyBindings as a tuple with priority and the keymap.
|
3586 | */
|
3587 | type KeyBindingsTuple = [priority: ExtensionPriority, bindings: KeyBindings];
|
3588 | /**
|
3589 | * `KeyBindings` as an object or prioritized tuple.
|
3590 | */
|
3591 | type PrioritizedKeyBindings = KeyBindings | KeyBindingsTuple;
|
3592 | declare global {
|
3593 | namespace Remirror {
|
3594 | interface ExcludeOptions {
|
3595 | /**
|
3596 | * Whether to exclude keybindings support. This is not a recommended
|
3597 | * action and can break functionality.
|
3598 | *
|
3599 | * @defaultValue undefined
|
3600 | */
|
3601 | keymap?: boolean;
|
3602 | }
|
3603 | interface ExtensionStore {
|
3604 | /**
|
3605 | * When called this will run through every `createKeymap` method on every
|
3606 | * extension to recreate the keyboard bindings.
|
3607 | *
|
3608 | * @remarks
|
3609 | *
|
3610 | * **NOTE** - This will not update keybinding for extensions that
|
3611 | * implement their own keybinding functionality (e.g. any plugin using
|
3612 | * Suggestions)
|
3613 | */
|
3614 | rebuildKeymap: () => void;
|
3615 | }
|
3616 | interface BaseExtension {
|
3617 | /**
|
3618 | * Stores all the keybinding names and options for this decoration that
|
3619 | * have been added as decorators to the extension instance. This is used
|
3620 | * by the `KeymapExtension` to pick the commands and store metadata
|
3621 | * attached to each command.
|
3622 | *
|
3623 | * @internal
|
3624 | */
|
3625 | decoratedKeybindings?: Record<string, KeybindingDecoratorOptions>;
|
3626 | /**
|
3627 | * Add keymap bindings for this extension.
|
3628 | *
|
3629 | * @param parameter - schema parameter with type included
|
3630 | */
|
3631 | createKeymap?(extractShortcutNames: (shortcut: string) => string[]): PrioritizedKeyBindings;
|
3632 | }
|
3633 | interface AllExtensions {
|
3634 | keymap: KeymapExtension;
|
3635 | }
|
3636 | }
|
3637 | }
|
3638 |
|
3639 | /**
|
3640 | * This extension allows others extension to add the `createNodeView` method
|
3641 | * for creating nodeViews which alter how the dom is rendered for the node.
|
3642 | *
|
3643 | * @remarks
|
3644 | *
|
3645 | * This is an example of adding custom functionality to an extension via the
|
3646 | * `ExtensionParameterMethods`.
|
3647 | *
|
3648 | * @category Builtin Extension
|
3649 | */
|
3650 | declare class NodeViewsExtension extends PlainExtension {
|
3651 | get name(): "nodeViews";
|
3652 | createPlugin(): CreateExtensionPlugin;
|
3653 | }
|
3654 | declare global {
|
3655 | namespace Remirror {
|
3656 | interface ManagerSettings {
|
3657 | /**
|
3658 | * Add custom node views to the manager which will take priority over the
|
3659 | * nodeViews provided by the extensions and plugins.
|
3660 | */
|
3661 | nodeViews?: Record<string, NodeViewMethod>;
|
3662 | }
|
3663 | interface BaseExtension {
|
3664 | /**
|
3665 | * Registers one or multiple nodeViews for the extension.
|
3666 | *
|
3667 | * This is a shorthand way of registering a nodeView without the need to
|
3668 | * create a prosemirror plugin. It allows for the registration of one nodeView
|
3669 | * which has the same name as the extension.
|
3670 | *
|
3671 | * To register more than one you would need to use a custom plugin returned
|
3672 | * from the `plugin` method.
|
3673 | *
|
3674 | * @param parameter - schema parameter with type included
|
3675 | */
|
3676 | createNodeViews?(): NodeViewMethod | Record<string, NodeViewMethod>;
|
3677 | }
|
3678 | interface AllExtensions {
|
3679 | nodeViews: NodeViewsExtension;
|
3680 | }
|
3681 | }
|
3682 | }
|
3683 |
|
3684 | interface PasteRulesOptions {
|
3685 | }
|
3686 | /**
|
3687 | * This extension allows others extension to add the `createPasteRules` method
|
3688 | * for automatically transforming pasted text which matches a certain regex
|
3689 | * pattern in the dom.
|
3690 | *
|
3691 | * @category Builtin Extension
|
3692 | */
|
3693 | declare class PasteRulesExtension extends PlainExtension {
|
3694 | get name(): "pasteRules";
|
3695 | createExternalPlugins(): ProsemirrorPlugin[];
|
3696 | private generatePasteRulesPlugin;
|
3697 | }
|
3698 | declare global {
|
3699 | namespace Remirror {
|
3700 | interface ExcludeOptions {
|
3701 | /**
|
3702 | * Whether to exclude the extension's pasteRules
|
3703 | *
|
3704 | * @defaultValue undefined
|
3705 | */
|
3706 | pasteRules?: boolean;
|
3707 | }
|
3708 | interface BaseExtension {
|
3709 | /**
|
3710 | * Register paste rules for this extension.
|
3711 | *
|
3712 | * Paste rules are activated when text, images, or html is pasted into the
|
3713 | * editor.
|
3714 | */
|
3715 | createPasteRules?(): PasteRule[] | PasteRule;
|
3716 | }
|
3717 | interface AllExtensions {
|
3718 | pasteRules: PasteRulesExtension;
|
3719 | }
|
3720 | }
|
3721 | }
|
3722 |
|
3723 | interface PluginsOptions {
|
3724 | /**
|
3725 | * The event handler which can be used by hooks to listen to state updates
|
3726 | * when they are being applied to the editor.
|
3727 | */
|
3728 | applyState?: Handler<(props: ApplyStateLifecycleProps) => void>;
|
3729 | /**
|
3730 | * The event handler which can be used by hooks to listen to intercept updates
|
3731 | * to the transaction.
|
3732 | */
|
3733 | appendTransaction?: Handler<(props: AppendLifecycleProps) => void>;
|
3734 | }
|
3735 | /**
|
3736 | * This extension allows others extension to add the `createPlugin` method using
|
3737 | * Prosemirror Plugins.
|
3738 | *
|
3739 | * @remarks
|
3740 | *
|
3741 | * This is an example of adding custom functionality to an extension via the
|
3742 | * `ExtensionParameterMethods`.
|
3743 | *
|
3744 | * @category Builtin Extension
|
3745 | */
|
3746 | declare class PluginsExtension extends PlainExtension<PluginsOptions> {
|
3747 | get name(): "plugins";
|
3748 | /**
|
3749 | * All plugins created by other extension as well.
|
3750 | */
|
3751 | private plugins;
|
3752 | /**
|
3753 | * The plugins added via the manager (for reference only).
|
3754 | */
|
3755 | private managerPlugins;
|
3756 | /**
|
3757 | * Called when the state is is being applied after an update.
|
3758 | */
|
3759 | private readonly applyStateHandlers;
|
3760 | /**
|
3761 | * Called when the state is first initialized.
|
3762 | */
|
3763 | private readonly initStateHandlers;
|
3764 | /**
|
3765 | * Handlers for the `onAppendTransaction` lifecycle method.
|
3766 | */
|
3767 | private readonly appendTransactionHandlers;
|
3768 | /**
|
3769 | * Store the plugin keys.
|
3770 | */
|
3771 | private readonly pluginKeys;
|
3772 | /**
|
3773 | * Store state getters for the extension.
|
3774 | */
|
3775 | private readonly stateGetters;
|
3776 | /**
|
3777 | * This extension is responsible for adding state to the editor.
|
3778 | */
|
3779 | onCreate(): void;
|
3780 | /**
|
3781 | * Create a plugin which adds the [[`onInitState`]] and [[`onApplyState`]]
|
3782 | * lifecycle methods.
|
3783 | */
|
3784 | createPlugin(): CreateExtensionPlugin<void>;
|
3785 | /**
|
3786 | * Get all the plugins from the extension.
|
3787 | */
|
3788 | private extractExtensionPlugins;
|
3789 | private readonly getPluginStateCreator;
|
3790 | /**
|
3791 | * Add or replace a plugin.
|
3792 | */
|
3793 | private updatePlugins;
|
3794 | private readonly getStateByName;
|
3795 | /**
|
3796 | * Add the plugin specific properties and methods to the manager and extension
|
3797 | * store.
|
3798 | */
|
3799 | private updateExtensionStore;
|
3800 | /**
|
3801 | * Reruns the `createPlugin` and `createExternalPlugins` methods of the
|
3802 | * provided extension.
|
3803 | *
|
3804 | * ```ts
|
3805 | * // From within an extension
|
3806 | * this.store.updateExtensionPlugins(this);
|
3807 | * ```
|
3808 | */
|
3809 | private updateExtensionPlugins;
|
3810 | /**
|
3811 | * Applies the store plugins to the state. If any have changed then it will be
|
3812 | * updated.
|
3813 | */
|
3814 | private dispatchPluginUpdate;
|
3815 | }
|
3816 | declare global {
|
3817 | namespace Remirror {
|
3818 | interface ManagerSettings {
|
3819 | /**
|
3820 | * Add custom plugins to the manager while creating it.
|
3821 | *
|
3822 | * Plugins created via the manager are given priority over all extension
|
3823 | * based plugins. There's scope for adding a priority based model for
|
3824 | * inserting plugins, but it seems like a sane default until that's
|
3825 | * available.
|
3826 | */
|
3827 | plugins?: ProsemirrorPlugin[];
|
3828 | }
|
3829 | interface ExtensionStore {
|
3830 | /**
|
3831 | * Retrieve the state for any given extension name. This will throw an
|
3832 | * error if the extension identified by that name doesn't implement the
|
3833 | * `createPlugin` method.
|
3834 | *
|
3835 | * @param name - the name of the extension
|
3836 | *
|
3837 | * @remarks
|
3838 | *
|
3839 | * ```ts
|
3840 | * const pluginState = getPluginState(extension.name);
|
3841 | * ```
|
3842 | */
|
3843 | getPluginState<State>(name: string): State;
|
3844 | /**
|
3845 | * Add the new plugins. If previous plugins are provided then also remove
|
3846 | * the previous plugins.
|
3847 | *
|
3848 | * ```ts
|
3849 | * this.store.updatePlugins(this.createExternalPlugins(), this.externalPlugins);
|
3850 | * ```
|
3851 | *
|
3852 | * @param plugins - the plugins to add
|
3853 | * @param previousPlugins - the plugins to remove
|
3854 | */
|
3855 | updatePlugins(plugins: ProsemirrorPlugin[], previousPlugins?: ProsemirrorPlugin[]): void;
|
3856 | /**
|
3857 | * Reruns the `createPlugin` and `createExternalPlugins` methods of the
|
3858 | * provided extension.
|
3859 | *
|
3860 | * This will also automatically update the state with the newly generated
|
3861 | * plugins by dispatching an update.
|
3862 | *
|
3863 | * ```ts
|
3864 | * // From within an extension
|
3865 | * this.store.updateExtensionPlugins(this);
|
3866 | * this.store.dispatchPluginUpdate();
|
3867 | * ```
|
3868 | *
|
3869 | * @param extension - the extension instance, constructor or name.
|
3870 | */
|
3871 | updateExtensionPlugins(extension: AnyExtension | AnyExtensionConstructor | string): void;
|
3872 | /**
|
3873 | * Applies the store plugins to the state. If any have changed then it
|
3874 | * will be updated.
|
3875 | */
|
3876 | dispatchPluginUpdate(): void;
|
3877 | }
|
3878 | interface ManagerStore<Extension extends AnyExtension> {
|
3879 | /**
|
3880 | * All of the plugins combined together from all sources
|
3881 | */
|
3882 | plugins: ProsemirrorPlugin[];
|
3883 | /**
|
3884 | * Retrieve the state for a given extension name. This will throw an error
|
3885 | * if the extension doesn't exist.
|
3886 | *
|
3887 | * @param name - the name of the extension
|
3888 | */
|
3889 | getPluginState: <State>(name: GetNameUnion<Extension>) => State;
|
3890 | /**
|
3891 | * All the plugin keys available to be used by plugins.
|
3892 | */
|
3893 | pluginKeys: Record<string, PluginKey>;
|
3894 | }
|
3895 | interface ExcludeOptions {
|
3896 | /**
|
3897 | * Whether to exclude the extension's plugin
|
3898 | *
|
3899 | * @defaultValue undefined
|
3900 | */
|
3901 | plugins?: boolean;
|
3902 | }
|
3903 | interface BaseExtension {
|
3904 | /**
|
3905 | * The plugin key for custom plugin created by this extension. This only
|
3906 | * exists when there is a valid `createPlugin` method on the extension.
|
3907 | *
|
3908 | * This can be used to set and retrieve metadata.
|
3909 | *
|
3910 | * ```ts
|
3911 | * const meta = tr.getMeta(this.pluginKey);
|
3912 | * ```
|
3913 | */
|
3914 | pluginKey: PluginKey;
|
3915 | /**
|
3916 | * The plugin that was created by the `createPlugin` method. This only
|
3917 | * exists for extension which implement that method.
|
3918 | */
|
3919 | plugin: Plugin;
|
3920 | /**
|
3921 | * The external plugins created by the `createExternalPlugins` method.
|
3922 | */
|
3923 | externalPlugins: Plugin[];
|
3924 | /**
|
3925 | * Retrieve the state of the custom plugin for this extension. This will
|
3926 | * throw an error if the extension doesn't have a valid `createPlugin`
|
3927 | * method.
|
3928 | *
|
3929 | * @remarks
|
3930 | *
|
3931 | * ```ts
|
3932 | * const pluginState = this.getPluginState();
|
3933 | * ```
|
3934 | *
|
3935 | * This is only available after the initialize stage of the editor manager
|
3936 | * lifecycle.
|
3937 | *
|
3938 | * If you would like to use it before that e.g. in the decorations prop of
|
3939 | * the `createPlugin` method, you can call it with a current state which
|
3940 | * will be used to retrieve the plugin state.
|
3941 | *
|
3942 | * Please note that when using this in the decorations callback it is
|
3943 | * advisable to pass in the `state` argument in case the callback is
|
3944 | * called before the framework, or the view have been initialized.
|
3945 | */
|
3946 | getPluginState: <State>(state?: EditorState$1) => State;
|
3947 | /**
|
3948 | * Create a custom plugin directly in the editor.
|
3949 | *
|
3950 | * @remarks
|
3951 | *
|
3952 | * A unique `key` is automatically applied to enable easier retrieval of
|
3953 | * the plugin state.
|
3954 | *
|
3955 | * ```ts
|
3956 | * import { CreateExtensionPlugin } from 'remirror';
|
3957 | *
|
3958 | * class MyExtension extends PlainExtension {
|
3959 | * get name() {
|
3960 | * return 'me' as const;
|
3961 | * }
|
3962 | *
|
3963 | * createPlugin(): CreateExtensionPlugin {
|
3964 | * return {
|
3965 | * props: {
|
3966 | * handleKeyDown: keydownHandler({
|
3967 | * Backspace: handler,
|
3968 | * 'Mod-Backspace': handler,
|
3969 | * Delete: handler,
|
3970 | * 'Mod-Delete': handler,
|
3971 | * 'Ctrl-h': handler,
|
3972 | * 'Alt-Backspace': handler,
|
3973 | * 'Ctrl-d': handler,
|
3974 | * 'Ctrl-Alt-Backspace': handler,
|
3975 | * 'Alt-Delete': handler,
|
3976 | * 'Alt-d': handler,
|
3977 | * }),
|
3978 | * decorations: state => {
|
3979 | * const pluginState = this.getPluginState(state);
|
3980 | * pluginState.setDeleted(false);
|
3981 | * return pluginState.decorationSet;
|
3982 | * },
|
3983 | * },
|
3984 | * }
|
3985 | * }
|
3986 | * }
|
3987 | * ```
|
3988 | */
|
3989 | createPlugin?(): CreateExtensionPlugin;
|
3990 | /**
|
3991 | * Register third party plugins when this extension is placed into the
|
3992 | * editor.
|
3993 | *
|
3994 | * @remarks
|
3995 | *
|
3996 | * Some plugins (like the table plugin) consume several different plugins,
|
3997 | * creator method allows you to return a list of plugins you'd like to
|
3998 | * support.
|
3999 | */
|
4000 | createExternalPlugins?(): ProsemirrorPlugin[];
|
4001 | }
|
4002 | interface AllExtensions {
|
4003 | plugins: PluginsExtension;
|
4004 | }
|
4005 | }
|
4006 | }
|
4007 |
|
4008 | /**
|
4009 | * This is the schema extension which creates the schema and provides extra
|
4010 | * attributes as defined in the manager or the extension settings.
|
4011 | *
|
4012 | * @remarks
|
4013 | *
|
4014 | * The schema is the most important part of the remirror editor. This is the
|
4015 | * extension responsible for creating it, injecting extra attributes and
|
4016 | * managing the plugin which is responsible for making sure dynamically created
|
4017 | * attributes are updated.
|
4018 | *
|
4019 | * In order to add extra attributes the following would work.
|
4020 | *
|
4021 | * ```ts
|
4022 | * import { RemirrorManager } from 'remirror';
|
4023 | * import uuid from 'uuid';
|
4024 | * import hash from 'made-up-hasher';
|
4025 | *
|
4026 | * const manager = RemirrorManager.create([], {
|
4027 | * extraAttributes: [
|
4028 | * {
|
4029 | * identifiers: 'nodes',
|
4030 | * attributes: {
|
4031 | * awesome: {
|
4032 | * default: 'awesome',
|
4033 | * parseDOM: (domNode) => domNode.getAttribute('data-awesome'),
|
4034 | * toDOM: (attrs) => ([ 'data-awesome', attrs.awesome ])
|
4035 | * },
|
4036 | * },
|
4037 | * },
|
4038 | * { identifiers: ['paragraph'], attributes: { id: { default: () => uuid() } } },
|
4039 | * { identifiers: ['bold'], attributes: { hash: (mark) => hash(JSON.stringify(mark.attrs)) } },
|
4040 | * ],
|
4041 | * })
|
4042 | * ```
|
4043 | *
|
4044 | * It is an array of identifiers and attributes. Setting the default to a
|
4045 | * function allows you to set up a dynamic attribute which is updated with the
|
4046 | * synchronous function that you provide to it.
|
4047 | *
|
4048 | * @category Builtin Extension
|
4049 | */
|
4050 | declare class SchemaExtension extends PlainExtension {
|
4051 | get name(): "schema";
|
4052 | /**
|
4053 | * The dynamic attributes for each node and mark extension.
|
4054 | *
|
4055 | * The structure will look like the following.
|
4056 | *
|
4057 | * ```ts
|
4058 | * {
|
4059 | * paragraph: { id: () => uid(), hash: (node) => hash(node) },
|
4060 | * bold: { random: () => Math.random(), created: () => Date.now() },
|
4061 | * };
|
4062 | * ```
|
4063 | *
|
4064 | * This object is used by the created plugin to listen for changes to the doc,
|
4065 | * and check for new nodes and marks which haven't yet applied the dynamic
|
4066 | * attribute and add the attribute.
|
4067 | */
|
4068 | private readonly dynamicAttributes;
|
4069 | /**
|
4070 | * This method is responsible for creating, configuring and adding the
|
4071 | * `schema` to the editor. `Schema` is a special type in ProseMirror editors
|
4072 | * and with `remirror` it's all just handled for you.
|
4073 | */
|
4074 | onCreate(): void;
|
4075 | /**
|
4076 | * This creates the plugin that is used to automatically create the dynamic
|
4077 | * attributes defined in the extra attributes object.
|
4078 | */
|
4079 | createPlugin(): CreateExtensionPlugin;
|
4080 | /**
|
4081 | * Add the schema and nodes to the manager and extension store.
|
4082 | */
|
4083 | private addSchema;
|
4084 | /**
|
4085 | * Check the dynamic nodes to see if the provided node:
|
4086 | *
|
4087 | * - a) is dynamic and therefore can be updated.
|
4088 | * - b) has just been created and does not yet have a value for the dynamic
|
4089 | * node.
|
4090 | *
|
4091 | * @param node - the node
|
4092 | * @param pos - the node's position
|
4093 | * @param tr - the mutable ProseMirror transaction which is applied to create
|
4094 | * the next editor state
|
4095 | */
|
4096 | private checkAndUpdateDynamicNodes;
|
4097 | /**
|
4098 | * Loop through the dynamic marks to see if the provided node:
|
4099 | *
|
4100 | * - a) is wrapped by a matching mark.
|
4101 | * - b) has just been added and doesn't yet have the dynamic attribute
|
4102 | * applied.
|
4103 | *
|
4104 | * @param node - the node
|
4105 | * @param pos - the node's position
|
4106 | * @param tr - the mutable ProseMirror transaction which is applied to create
|
4107 | * the next editor state.
|
4108 | */
|
4109 | private checkAndUpdateDynamicMarks;
|
4110 | /**
|
4111 | * Gather all the extra attributes that have been added by extensions.
|
4112 | */
|
4113 | private gatherExtraAttributes;
|
4114 | }
|
4115 | /**
|
4116 | * With tags, you can select a specific sub selection of marks and nodes. This
|
4117 | * will be the basis for adding advanced formatting to remirror.
|
4118 | *
|
4119 | * ```ts
|
4120 | * import { ExtensionTag } from 'remirror';
|
4121 | * import { createCoreManager, CorePreset } from 'remirror/extensions';
|
4122 | * import { WysiwygPreset } from 'remirror/extensions';
|
4123 | *
|
4124 | * const manager = createCoreManager(() => [new WysiwygPreset(), new CorePreset()], {
|
4125 | * extraAttributes: [
|
4126 | * {
|
4127 | * identifiers: {
|
4128 | * tags: [ExtensionTag.NodeBlock],
|
4129 | * type: 'node',
|
4130 | * },
|
4131 | * attributes: { role: 'presentation' },
|
4132 | * },
|
4133 | * ],
|
4134 | * });
|
4135 | * ```
|
4136 | *
|
4137 | * Each item in the tags array should be read as an `OR` so the following would
|
4138 | * match `Tag1` OR `Tag2` OR `Tag3`.
|
4139 | *
|
4140 | * ```json
|
4141 | * { tags: ["Tag1", "Tag2", "Tag3"] }
|
4142 | * ```
|
4143 | *
|
4144 | * The `type` property (`mark | node`) is exclusive and limits the type of
|
4145 | * extension names that will be matched. When `mark` is set it only matches with
|
4146 | * marks.
|
4147 | */
|
4148 | interface IdentifiersObject {
|
4149 | /**
|
4150 | * Determines how the array of tags are combined:
|
4151 | *
|
4152 | * - `all` - the extension only matches when all tags are present.
|
4153 | * - `any` - the extension will match if it includes any of the specified
|
4154 | * tags.
|
4155 | *
|
4156 | * This only affects the `tags` property.
|
4157 | *
|
4158 | * The saddest part about this property is that, as a UK resident, I've
|
4159 | * succumbed to using the Americanized spelling instead of the Oxford
|
4160 | * Dictionary defined spelling of `behaviour` 😢
|
4161 | *
|
4162 | * @defaultValue 'any'
|
4163 | */
|
4164 | behavior?: 'all' | 'any';
|
4165 | /**
|
4166 | * Will find relevant names based on the defined `behaviour`.
|
4167 | */
|
4168 | tags?: ExtensionTagType[];
|
4169 | /**
|
4170 | * Additional names to include. These will still be added even if the
|
4171 | * extension name matches with `excludeTags` member.
|
4172 | */
|
4173 | names?: string[];
|
4174 | /**
|
4175 | * Whether to restrict by whether this is a [[`ProsemirrorNode`]] or a
|
4176 | * [[`Mark`]]. Leave blank to accept all types.
|
4177 | */
|
4178 | type?: 'node' | 'mark';
|
4179 | /**
|
4180 | * Exclude these names from being matched.
|
4181 | */
|
4182 | excludeNames?: string[];
|
4183 | /**
|
4184 | * Exclude these tags from being matched. Will always exclude if any of the
|
4185 | * tags
|
4186 | */
|
4187 | excludeTags?: string[];
|
4188 | }
|
4189 | /**
|
4190 | * The extra identifiers that can be used.
|
4191 | *
|
4192 | * - `nodes` - match all nodes
|
4193 | * - `marks` - match all marks
|
4194 | * - `all` - match everything in the editor
|
4195 | * - `string[]` - match the selected node and mark names
|
4196 | * - [[`IdentifiersObject`]] - match by `ExtensionTag` and type name.
|
4197 | */
|
4198 | type Identifiers = 'nodes' | 'marks' | 'all' | readonly string[] | IdentifiersObject;
|
4199 | /**
|
4200 | * The interface for adding extra attributes to multiple node and mark
|
4201 | * extensions.
|
4202 | */
|
4203 | interface IdentifierSchemaAttributes {
|
4204 | /**
|
4205 | * The nodes or marks to add extra attributes to.
|
4206 | *
|
4207 | * This can either be an array of the strings or the following specific
|
4208 | * identifiers:
|
4209 | *
|
4210 | * - 'nodes' for all nodes
|
4211 | * - 'marks' for all marks
|
4212 | * - 'all' for all extensions which touch the schema.
|
4213 | */
|
4214 | identifiers: Identifiers;
|
4215 | /**
|
4216 | * The attributes to be added.
|
4217 | */
|
4218 | attributes: SchemaAttributes;
|
4219 | }
|
4220 | declare global {
|
4221 | namespace Remirror {
|
4222 | interface BaseExtension {
|
4223 | /**
|
4224 | * Allows the extension to create an extra attributes array that will be
|
4225 | * added to the extra attributes.
|
4226 | *
|
4227 | * For example the `@remirror/extension-bidi` adds a `dir` attribute to
|
4228 | * all node extensions which allows them to automatically infer whether
|
4229 | * the text direction should be right-to-left, or left-to-right.
|
4230 | */
|
4231 | createSchemaAttributes?(): IdentifierSchemaAttributes[];
|
4232 | }
|
4233 | interface BaseExtensionOptions {
|
4234 | /**
|
4235 | * Inject additional attributes into the defined mark / node schema. This
|
4236 | * can only be used for `NodeExtensions` and `MarkExtensions`.
|
4237 | *
|
4238 | * @remarks
|
4239 | *
|
4240 | * Sometimes you need to add additional attributes to a node or mark. This
|
4241 | * property enables this without needing to create a new extension.
|
4242 | *
|
4243 | * This is only applied to the `MarkExtension` and `NodeExtension`.
|
4244 | *
|
4245 | * @defaultValue {}
|
4246 | */
|
4247 | extraAttributes?: Static<SchemaAttributes>;
|
4248 | /**
|
4249 | * When true will disable extra attributes for this instance of the
|
4250 | * extension.
|
4251 | *
|
4252 | * @remarks
|
4253 | *
|
4254 | * This is only applied to the `MarkExtension` and `NodeExtension`.
|
4255 | *
|
4256 | * @defaultValue undefined
|
4257 | */
|
4258 | disableExtraAttributes?: Static<boolean>;
|
4259 | /**
|
4260 | * An override for the mark spec object. This only applies for
|
4261 | * `MarkExtension`.
|
4262 | */
|
4263 | markOverride?: Static<MarkSpecOverride>;
|
4264 | /**
|
4265 | * An override object for a node spec object. This only applies to the
|
4266 | * `NodeExtension`.
|
4267 | */
|
4268 | nodeOverride?: Static<NodeSpecOverride>;
|
4269 | }
|
4270 | interface ManagerSettings {
|
4271 | /**
|
4272 | * Allows for setting extra attributes on multiple nodes and marks by
|
4273 | * their name or constructor. These attributes are automatically added and
|
4274 | * retrieved from from the dom by prosemirror.
|
4275 | *
|
4276 | * @remarks
|
4277 | *
|
4278 | * An example is shown below.
|
4279 | *
|
4280 | * ```ts
|
4281 | * import { RemirrorManager } from 'remirror';
|
4282 | *
|
4283 | * const managerSettings = {
|
4284 | * extraAttributes: [
|
4285 | * {
|
4286 | * identifiers: ['blockquote', 'heading'],
|
4287 | * attributes: { id: 'id', alignment: '0', },
|
4288 | * }, {
|
4289 | * identifiers: ['mention', 'codeBlock'],
|
4290 | * attributes: { 'userId': { default: null } },
|
4291 | * },
|
4292 | * ]
|
4293 | * };
|
4294 | *
|
4295 | * const manager = RemirrorManager.create([], { extraAttributes })
|
4296 | * ```
|
4297 | */
|
4298 | extraAttributes?: IdentifierSchemaAttributes[];
|
4299 | /**
|
4300 | * Overrides for the mark.
|
4301 | */
|
4302 | markOverride?: Record<string, MarkSpecOverride>;
|
4303 | /**
|
4304 | * Overrides for the nodes.
|
4305 | */
|
4306 | nodeOverride?: Record<string, NodeSpecOverride>;
|
4307 | /**
|
4308 | * Perhaps you don't need extra attributes at all in the editor. This
|
4309 | * allows you to disable extra attributes when set to true.
|
4310 | *
|
4311 | * @defaultValue undefined
|
4312 | */
|
4313 | disableExtraAttributes?: boolean;
|
4314 | /**
|
4315 | * Setting this to a value will override the default behaviour of the
|
4316 | * `RemirrorManager`. It overrides the created schema and ignores the
|
4317 | * specs created by all extensions within your editor.
|
4318 | *
|
4319 | * @remarks
|
4320 | *
|
4321 | * This is an advanced option and should only be used in cases where there
|
4322 | * is a deeper understanding of `Prosemirror`. By setting this, please
|
4323 | * note that a lot of functionality just won't work which is powered by
|
4324 | * the `extraAttributes`.
|
4325 | */
|
4326 | schema?: EditorSchema;
|
4327 | /**
|
4328 | * The name of the default block node. This node will be given a higher
|
4329 | * priority when being added to the schema.
|
4330 | *
|
4331 | * By default this is undefined and the default block node is assigned
|
4332 | * based on the extension priorities.
|
4333 | *
|
4334 | * @defaultValue undefined
|
4335 | */
|
4336 | defaultBlockNode?: string;
|
4337 | }
|
4338 | interface ManagerStore<Extension extends AnyExtension> {
|
4339 | /**
|
4340 | * The nodes to place on the schema.
|
4341 | */
|
4342 | nodes: Record<GetNodeNameUnion<Extension> extends never ? string : GetNodeNameUnion<Extension>, NodeExtensionSpec>;
|
4343 | /**
|
4344 | * The marks to be added to the schema.
|
4345 | */
|
4346 | marks: Record<GetMarkNameUnion<Extension> extends never ? string : GetMarkNameUnion<Extension>, MarkExtensionSpec>;
|
4347 | /**
|
4348 | * The schema created by this extension manager.
|
4349 | */
|
4350 | schema: EditorSchema;
|
4351 | /**
|
4352 | * The name of the default block node. This is used by all internal
|
4353 | * extension when toggling block nodes. It can also be used in other
|
4354 | * cases.
|
4355 | *
|
4356 | * This can be updated via the manager settings when first creating the
|
4357 | * editor.
|
4358 | *
|
4359 | * @defaultValue 'paragraph'
|
4360 | */
|
4361 | defaultBlockNode: string;
|
4362 | }
|
4363 | interface MarkExtension {
|
4364 | /**
|
4365 | * Provides access to the `MarkExtensionSpec`.
|
4366 | */
|
4367 | spec: MarkExtensionSpec;
|
4368 | }
|
4369 | interface NodeExtension {
|
4370 | /**
|
4371 | * Provides access to the `NodeExtensionSpec`.
|
4372 | */
|
4373 | spec: NodeExtensionSpec;
|
4374 | }
|
4375 | interface ExtensionStore {
|
4376 | /**
|
4377 | * The Prosemirror schema being used for the current editor.
|
4378 | *
|
4379 | * @remarks
|
4380 | *
|
4381 | * The value is created when the manager initializes. So it can be used in
|
4382 | * `createCommands`, `createHelpers`, `createKeymap` and most of the
|
4383 | * creator methods.
|
4384 | */
|
4385 | schema: EditorSchema;
|
4386 | }
|
4387 | interface StaticExtensionOptions {
|
4388 | /**
|
4389 | * When true will disable extra attributes for all instances of this
|
4390 | * extension.
|
4391 | *
|
4392 | * @defaultValue false
|
4393 | */
|
4394 | readonly disableExtraAttributes?: boolean;
|
4395 | }
|
4396 | interface AllExtensions {
|
4397 | schema: SchemaExtension;
|
4398 | }
|
4399 | }
|
4400 | }
|
4401 |
|
4402 | interface SuggestOptions {
|
4403 | /**
|
4404 | * The custom handler which enables adding `suggesters`.
|
4405 | */
|
4406 | suggester: CustomHandler<Suggester>;
|
4407 | }
|
4408 | /**
|
4409 | * This extension allows others extension to add the `createSuggesters` method
|
4410 | * for adding the prosemirror-suggest functionality to your editor.
|
4411 | *
|
4412 | * @remarks
|
4413 | *
|
4414 | * This is an example of adding custom functionality to an extension via the
|
4415 | * `ExtensionParameterMethods`.
|
4416 | *
|
4417 | * @category Builtin Extension
|
4418 | */
|
4419 | declare class SuggestExtension extends PlainExtension<SuggestOptions> {
|
4420 | get name(): "suggest";
|
4421 | /**
|
4422 | * Create the `addSuggester` method and `removeSuggester` methods to the
|
4423 | * extension store.
|
4424 | *
|
4425 | * This can be used by extensions to conditionally add suggestion support.
|
4426 | */
|
4427 | onCreate(): void;
|
4428 | /**
|
4429 | * Add the `prosemirror-suggest` plugin to the editor.
|
4430 | */
|
4431 | createExternalPlugins(): ProsemirrorPlugin[];
|
4432 | /**
|
4433 | * Allow additional `Suggesters` to be added to the editor. This can be used
|
4434 | * by `React` to create hooks.
|
4435 | */
|
4436 | onAddCustomHandler: AddCustomHandler<SuggestOptions>;
|
4437 | /**
|
4438 | * Get the suggest plugin state.
|
4439 | *
|
4440 | * This may be removed at a later time.
|
4441 | *
|
4442 | * @experimental
|
4443 | */
|
4444 | getSuggestState(state?: EditorState): Helper<SuggestState>;
|
4445 | /**
|
4446 | * Get some helpful methods from the SuggestPluginState.
|
4447 | */
|
4448 | getSuggestMethods(): Helper<Pick<SuggestState, 'addIgnored' | 'clearIgnored' | 'removeIgnored' | 'ignoreNextExit' | 'setMarkRemoved' | 'findMatchAtPosition' | 'findNextTextSelection' | 'setLastChangeFromAppend'>>;
|
4449 | /**
|
4450 | * Check to see whether the provided name is the currently active
|
4451 | * suggester.
|
4452 | *
|
4453 | * @param name - the name of the suggester to include
|
4454 | */
|
4455 | isSuggesterActive(name: string | string[]): Helper<boolean>;
|
4456 | }
|
4457 | declare global {
|
4458 | namespace Remirror {
|
4459 | interface ExcludeOptions {
|
4460 | /**
|
4461 | * Whether to exclude the suggesters plugin configuration for the
|
4462 | * extension.
|
4463 | *
|
4464 | * @defaultValue undefined
|
4465 | */
|
4466 | suggesters?: boolean;
|
4467 | }
|
4468 | interface BaseExtension {
|
4469 | /**
|
4470 | * Create suggesters which respond to an activation `char` or regex
|
4471 | * pattern within the editor instance. The onChange handler provided is
|
4472 | * called with the data around the matching text.
|
4473 | *
|
4474 | * @remarks
|
4475 | *
|
4476 | * Suggesters are a powerful way of building up the editors
|
4477 | * functionality. They can support `@` mentions, `#` tagging, `/` special
|
4478 | * command keys which trigger action menus and much more.
|
4479 | */
|
4480 | createSuggesters?(): Suggester[] | Suggester;
|
4481 | }
|
4482 | interface AllExtensions {
|
4483 | suggest: SuggestExtension;
|
4484 | }
|
4485 | interface ExtensionStore {
|
4486 | /**
|
4487 | * Add a suggester.
|
4488 | */
|
4489 | addSuggester(suggester: Suggester): void;
|
4490 | /**
|
4491 | * Remove a suggester.
|
4492 | */
|
4493 | removeSuggester(suggester: Suggester | string): void;
|
4494 | }
|
4495 | interface AllExtensions {
|
4496 | suggest: SuggestExtension;
|
4497 | }
|
4498 | }
|
4499 | }
|
4500 |
|
4501 | /**
|
4502 | * Create the extension tags which are passed into each extensions method to
|
4503 | * enable dynamically generated rules and commands.
|
4504 | *
|
4505 | * Tags on nodes and marks are automatically added to the schema as groups.
|
4506 | *
|
4507 | * @category Builtin Extension
|
4508 | */
|
4509 | declare class TagsExtension extends PlainExtension {
|
4510 | get name(): "tags";
|
4511 | /**
|
4512 | * Track the tags which have been applied to the extensions in this editor.
|
4513 | */
|
4514 | private allTags;
|
4515 | /**
|
4516 | * The tags for plain extensions.
|
4517 | */
|
4518 | private plainTags;
|
4519 | /**
|
4520 | * The tags for mark extensions.
|
4521 | */
|
4522 | private markTags;
|
4523 | /**
|
4524 | * The tags for node extensions.
|
4525 | */
|
4526 | private nodeTags;
|
4527 | /**
|
4528 | * Create the tags which are used to identify extension with particular
|
4529 | * behavioral traits.
|
4530 | */
|
4531 | onCreate(): void;
|
4532 | /**
|
4533 | * Reset the tags to the empty object with empty arrays.
|
4534 | */
|
4535 | private resetTags;
|
4536 | /**
|
4537 | * Update the tags object for each extension.
|
4538 | */
|
4539 | private updateTagForExtension;
|
4540 | }
|
4541 | /**
|
4542 | * Check if the provided string is an extension tag.
|
4543 | */
|
4544 | declare function isExtensionTag(value: string): value is ExtensionTagType;
|
4545 | /**
|
4546 | * The shape of the tag data stored by the extension manager.
|
4547 | *
|
4548 | * This data can be used by other extensions to dynamically determine which
|
4549 | * nodes should affected by commands / plugins / keys etc...
|
4550 | */
|
4551 | type CombinedTags<Name extends string = string> = Record<ExtensionTagType, Name[]>;
|
4552 | declare global {
|
4553 | namespace Remirror {
|
4554 | interface ManagerSettings {
|
4555 | /**
|
4556 | * Add extra tags to the extensions by name. This can be used to add
|
4557 | * behavior traits to certain extensions.
|
4558 | *
|
4559 | * Please note this will change the schema since the tags are added to the
|
4560 | * node and mark groups.
|
4561 | *
|
4562 | * ```ts
|
4563 | * RemirrorManager.create(
|
4564 | * [],
|
4565 | * { extraTags: { bold: [ExtensionTag.Awesome] } }
|
4566 | * );
|
4567 | * ```
|
4568 | */
|
4569 | extraTags?: Record<string, ExtensionTagType[]>;
|
4570 | }
|
4571 | interface BaseExtension {
|
4572 | /**
|
4573 | * The generated tags for this extension are added here. Do not add this
|
4574 | * property to your extensions as it will be overridden.
|
4575 | */
|
4576 | tags: ExtensionTagType[];
|
4577 | /**
|
4578 | * Dynamically create tags for the extension.
|
4579 | *
|
4580 | * Tags are a helpful tool for categorizing the behavior of an extension.
|
4581 | * This behavior is later grouped in the `Manager` and passed to the
|
4582 | * `extensionStore`. Tags can be used by commands that need to remove all
|
4583 | * formatting and use the tag to identify which registered extensions are
|
4584 | * formatters.
|
4585 | *
|
4586 | * @remarks
|
4587 | *
|
4588 | * Tags are also automatically added to the node and mark extensions as a
|
4589 | * group when they are found there.
|
4590 | *
|
4591 | * There are internally defined tags but it's also possible to define any
|
4592 | * custom string as a tag. See [[`ExtensionTag`]].
|
4593 | */
|
4594 | createTags?(): ExtensionTagType[];
|
4595 | }
|
4596 | type A = UseDefault<never, string>;
|
4597 | interface ManagerStore<Extension extends AnyExtension> {
|
4598 | /**
|
4599 | * All the tags provided by the configured extensions.
|
4600 | */
|
4601 | tags: Readonly<CombinedTags<GetNameUnion<Extension> extends never ? string : GetNameUnion<Extension>>>;
|
4602 | /**
|
4603 | * All the plain extension tags provided for the editor.
|
4604 | */
|
4605 | plainTags: Readonly<CombinedTags<GetPlainNameUnion<Extension> extends never ? string : GetPlainNameUnion<Extension>>>;
|
4606 | /**
|
4607 | * All the node extension tags provided for the editor.
|
4608 | */
|
4609 | nodeTags: Readonly<CombinedTags<GetNodeNameUnion<Extension> extends never ? string : GetNodeNameUnion<Extension>>>;
|
4610 | /**
|
4611 | * All the mark extension tags provided for the editor.
|
4612 | */
|
4613 | markTags: Readonly<CombinedTags<GetMarkNameUnion<Extension> extends never ? string : GetMarkNameUnion<Extension>>>;
|
4614 | }
|
4615 | interface ExtensionStore {
|
4616 | /**
|
4617 | * All the tags provided by the configured extensions.
|
4618 | */
|
4619 | tags: CombinedTags;
|
4620 | /**
|
4621 | * All the plain extension tags provided for the editor.
|
4622 | */
|
4623 | plainTags: CombinedTags;
|
4624 | /**
|
4625 | * All the node extension tags provided for the editor.
|
4626 | */
|
4627 | nodeTags: CombinedTags;
|
4628 | /**
|
4629 | * All the mark extension tags provided for the editor.
|
4630 | */
|
4631 | markTags: CombinedTags;
|
4632 | }
|
4633 | interface BaseExtensionOptions {
|
4634 | /**
|
4635 | * Add extra tags to the extension.
|
4636 | *
|
4637 | * Tags can be used to unlock certain behavioural traits for nodes and
|
4638 | * marks.
|
4639 | *
|
4640 | * Please note this will change the schema since the tags are added to the
|
4641 | * node and mark groups.
|
4642 | */
|
4643 | extraTags?: ExtensionTagType[];
|
4644 | }
|
4645 | interface AllExtensions {
|
4646 | tags: TagsExtension;
|
4647 | }
|
4648 | }
|
4649 | }
|
4650 |
|
4651 | declare enum ActionType {
|
4652 | ADD_PLACEHOLDER = 0,
|
4653 | REMOVE_PLACEHOLDER = 1
|
4654 | }
|
4655 | interface AddPlaceholderAction {
|
4656 | type: ActionType.ADD_PLACEHOLDER;
|
4657 | id: string;
|
4658 | payload: any;
|
4659 | pos: number;
|
4660 | }
|
4661 | interface RemovePlaceholderAction {
|
4662 | type: ActionType.REMOVE_PLACEHOLDER;
|
4663 | id: string;
|
4664 | }
|
4665 | type PlaceholderPluginAction = AddPlaceholderAction | RemovePlaceholderAction;
|
4666 |
|
4667 | /**
|
4668 | * Try to find the position of the placeholder in the document based on the
|
4669 | * upload placeholder id
|
4670 | *
|
4671 | * @remarks
|
4672 | *
|
4673 | * This function will first try to find the position based on the decoration set.
|
4674 | * However, in some cases (e.g. `ReplaceStep`) the decoration will not be
|
4675 | * available. In that case, it will then try to find every node in the document
|
4676 | * recursively, which is much slower than the decoration set way in a large
|
4677 | * document.
|
4678 | */
|
4679 | declare function findUploadPlaceholderPos(state: EditorState$1, id: string): number | undefined;
|
4680 | declare function findUploadPlaceholderPayload(state: EditorState$1, id: string): any | undefined;
|
4681 | /**
|
4682 | * Determine if there are active file uploads in the given state
|
4683 | *
|
4684 | * @remarks
|
4685 | * This utility is useful to warn users there are still active uploads before
|
4686 | * exiting or saving a document.
|
4687 | *
|
4688 | * @see https://remirror.vercel.app/?path=/story/extensions-file--with-upload-incomplete-warning
|
4689 | *
|
4690 | * @param state - the editor state
|
4691 | */
|
4692 | declare function hasUploadingFile(state: EditorState$1): boolean;
|
4693 | declare function setUploadPlaceholderAction(tr: Transaction$1, action: PlaceholderPluginAction): Transaction$1;
|
4694 |
|
4695 | interface UploadContext {
|
4696 | set: (key: string, value: unknown) => void;
|
4697 | get: (key: string) => unknown;
|
4698 | addListener: (listener: UploadContextListener) => () => void;
|
4699 | }
|
4700 | type UploadContextListener = (values: Record<string, unknown>) => void;
|
4701 |
|
4702 | interface FileUploader<NodeAttributes> {
|
4703 | /**
|
4704 | * Inserts the file (but doesn't start the upload operation) and returns an
|
4705 | * object with this to be uploaded file's attributes.
|
4706 | */
|
4707 | insert: (file: File) => NodeAttributes;
|
4708 | /**
|
4709 | * Starts the upload operation and returns a promise. The promise will be
|
4710 | * resolved by a successful upload with uploaded file's attributes, or rejected
|
4711 | * because of an error.
|
4712 | *
|
4713 | * `upload` can update the object `context` to update information during
|
4714 | * the upload process. `context` will be passed to the render function. The
|
4715 | * render function can add a listener to `context` by using `context.addListener`
|
4716 | * to get the updated values. The default render function will try to find the
|
4717 | * keys `loaded` and `total` in `context`, which are two numbers that
|
4718 | * represent the progress of the upload.
|
4719 | */
|
4720 | upload: (context: UploadContext) => Promise<NodeAttributes>;
|
4721 | /**
|
4722 | * Aborts the upload operation.
|
4723 | */
|
4724 | abort: () => void;
|
4725 | }
|
4726 |
|
4727 | /**
|
4728 | * Any `ProsemirrorNode` can use the `uploadFile` function in this file as long
|
4729 | * as its attributes implement this interface.
|
4730 | */
|
4731 | interface AbstractNodeAttributes {
|
4732 | id?: any;
|
4733 | error?: string | null;
|
4734 | }
|
4735 | type UploadFileHandler<NodeAttributes> = () => FileUploader<NodeAttributes>;
|
4736 | interface UploadPlaceholderPayload<NodeAttributes extends AbstractNodeAttributes> {
|
4737 | context: UploadContext;
|
4738 | fileUploader: FileUploader<NodeAttributes>;
|
4739 | }
|
4740 | interface UploadFileProps<NodeAttributes extends AbstractNodeAttributes = object> {
|
4741 | file: File;
|
4742 | pos: number | undefined;
|
4743 | view: EditorView$1;
|
4744 | fileType: NodeType$1;
|
4745 | uploadHandler: UploadFileHandler<NodeAttributes>;
|
4746 | }
|
4747 | /**
|
4748 | * Insert a file into the editor and upload it.
|
4749 | */
|
4750 | declare function uploadFile<NodeAttributes extends AbstractNodeAttributes>({ file, pos, view, fileType, uploadHandler, }: UploadFileProps<NodeAttributes>): void;
|
4751 |
|
4752 | interface DecorationsOptions {
|
4753 | }
|
4754 | /**
|
4755 | * `UploadExtension` handle the file upload process.
|
4756 | */
|
4757 | declare class UploadExtension extends PlainExtension<DecorationsOptions> {
|
4758 | get name(): "upload";
|
4759 | /**
|
4760 | * Create the extension plugin for inserting decorations into the editor.
|
4761 | */
|
4762 | createExternalPlugins(): ProsemirrorPlugin$1[];
|
4763 | }
|
4764 | declare global {
|
4765 | namespace Remirror {
|
4766 | interface AllExtensions {
|
4767 | upload: UploadExtension;
|
4768 | }
|
4769 | }
|
4770 | }
|
4771 |
|
4772 | interface BuiltinOptions extends SuggestOptions, KeymapOptions, DecorationsOptions$1, InputRulesOptions {
|
4773 | }
|
4774 | /**
|
4775 | * Provides all the builtin extensions to the editor.
|
4776 | *
|
4777 | * @remarks
|
4778 | *
|
4779 | * This is used automatically and (at the time of writing) can't be removed from
|
4780 | * the editor. If you feel that there's a compelling reason to override these
|
4781 | * extensions feel free to create a [discussion
|
4782 | * here](https://github.com/remirror/remirror/discussions/category_choices) and
|
4783 | * it can be addressed.
|
4784 | *
|
4785 | * @category Builtin Extension
|
4786 | *
|
4787 | * The order of these extension are important.
|
4788 | *
|
4789 | * - [[`TagsExtension`]] is places first because it provides tagging which is
|
4790 | * used by the schema extension.
|
4791 | * - [[`SchemeExtension`]] goes next because it's super important to the editor
|
4792 | * functionality and needs to run before everything else which might depend
|
4793 | * on it.
|
4794 | */
|
4795 | declare function builtinPreset(options?: GetStaticAndDynamic<BuiltinOptions>): BuiltinPreset[];
|
4796 | type BuiltinPreset = TagsExtension | SchemaExtension | AttributesExtension | PluginsExtension | InputRulesExtension | PasteRulesExtension | NodeViewsExtension | SuggestExtension | CommandsExtension | HelpersExtension | KeymapExtension | DocChangedExtension | UploadExtension | DecorationsExtension;
|
4797 | declare global {
|
4798 | namespace Remirror {
|
4799 | interface ManagerSettings {
|
4800 | /**
|
4801 | * The options that can be passed into the built in options.
|
4802 | */
|
4803 | builtin?: GetStaticAndDynamic<BuiltinOptions>;
|
4804 | }
|
4805 | /**
|
4806 | * The builtin preset.
|
4807 | */
|
4808 | type Builtin = BuiltinPreset;
|
4809 | /**
|
4810 | * The union of every extension available via the remirror codebase.
|
4811 | */
|
4812 | type Extensions = ValueOf<AllExtensions>;
|
4813 | }
|
4814 | }
|
4815 |
|
4816 | interface MetaOptions {
|
4817 | /**
|
4818 | * Set to true to capture meta data on commands and keybindings. This creates
|
4819 | * a wrapper around every command and keybinding and as a result it may lead
|
4820 | * to a performance penalty.
|
4821 | */
|
4822 | capture?: Static<boolean>;
|
4823 | }
|
4824 | /**
|
4825 | * Support meta data for commands and key bindings.
|
4826 | *
|
4827 | * Metadata is dded to all commands and keybindings and that information is
|
4828 | * provided to the `onChange` handle whenever the state is updated.
|
4829 | *
|
4830 | * @internalremarks
|
4831 | *
|
4832 | * TODO capture keybindings as well. This will be more difficult since
|
4833 | * keybindings can dynamically be added to the editor.
|
4834 | */
|
4835 | declare class MetaExtension extends PlainExtension<MetaOptions> {
|
4836 | get name(): "meta";
|
4837 | onCreate(): void;
|
4838 | /**
|
4839 | * This is here to provide a
|
4840 | */
|
4841 | createPlugin(): CreateExtensionPlugin;
|
4842 | /**
|
4843 | * Intercept command names and attributes.
|
4844 | */
|
4845 | private captureCommands;
|
4846 | /**
|
4847 | * Intercept command name and attributes.
|
4848 | */
|
4849 | private captureKeybindings;
|
4850 | /**
|
4851 | * Get the command metadata.
|
4852 | */
|
4853 | private getCommandMeta;
|
4854 | private setCommandMeta;
|
4855 | }
|
4856 | interface CommandMetadata {
|
4857 | type: 'command';
|
4858 | /**
|
4859 | * Was this called as part of a chain?
|
4860 | */
|
4861 | chain: boolean;
|
4862 | /**
|
4863 | * Is this a decorated command?
|
4864 | */
|
4865 | decorated: boolean;
|
4866 | /**
|
4867 | * The name of the extension.
|
4868 | */
|
4869 | extension: string;
|
4870 | /**
|
4871 | * The name of the command that was called.
|
4872 | */
|
4873 | name: string;
|
4874 | }
|
4875 | interface KeyBindingMetadata {
|
4876 | type: 'keyBinding';
|
4877 | /**
|
4878 | * The name of the extension used.
|
4879 | */
|
4880 | extension: string;
|
4881 | /**
|
4882 | * The shortcut used to invoke this keybinding.
|
4883 | */
|
4884 | shortcut: string;
|
4885 | }
|
4886 | type Metadata = CommandMetadata | KeyBindingMetadata;
|
4887 | declare global {
|
4888 | namespace Remirror {
|
4889 | interface ManagerStore<Extension extends AnyExtension> {
|
4890 | /**
|
4891 | * Get the command metadata for the transaction.
|
4892 | * @internal
|
4893 | */
|
4894 | getCommandMeta(tr: Transaction): Metadata[];
|
4895 | }
|
4896 | interface AllExtensions {
|
4897 | meta: MetaExtension;
|
4898 | }
|
4899 | }
|
4900 | }
|
4901 |
|
4902 | /**
|
4903 | * A function that returns the extension to be used in the RemirrorManager. This
|
4904 | * is similar to a preset function except that it takes no arguments.
|
4905 | *
|
4906 | * ```ts
|
4907 | * import { RemirrorManager } from 'remirror';
|
4908 | * import { BoldExtension, ItalicExtension } from 'remirror/extensions';
|
4909 | *
|
4910 | * const template = () => [new BoldExtension(), new ItalicExtension()]
|
4911 | * const manager = RemirrorManager.create(template);
|
4912 | * ```
|
4913 | *
|
4914 | * If the template is mixed in with other manager creators it will add the
|
4915 | * relevant extension provided.
|
4916 | */
|
4917 | type ExtensionTemplate<Extension extends AnyExtension> = () => Extension[];
|
4918 | interface ManagerEvents {
|
4919 | /**
|
4920 | * Called when the state is updated.
|
4921 | */
|
4922 | stateUpdate: (props: StateUpdateLifecycleProps) => void;
|
4923 | /**
|
4924 | * Called whenever the manager is cloned with the newly created manager
|
4925 | * instance.
|
4926 | *
|
4927 | * This is mainly used for testing so that the RemirrorTester can always
|
4928 | * reference the latest manager.
|
4929 | */
|
4930 | clone: (manager: AnyRemirrorManager) => void;
|
4931 | /**
|
4932 | * Called whenever the manager is recreated with the newly created manager
|
4933 | * instance.
|
4934 | *
|
4935 | * This is mainly used for testing so that the RemirrorTester can always
|
4936 | * reference the latest manager.
|
4937 | */
|
4938 | recreate: (manager: AnyRemirrorManager) => void;
|
4939 | /**
|
4940 | * An event listener which is called whenever the manager is destroyed.
|
4941 | */
|
4942 | destroy: () => void;
|
4943 | }
|
4944 | type AnyRemirrorManager = Simplify<Replace<RemirrorManager<AnyExtension>, {
|
4945 | clone: () => AnyRemirrorManager;
|
4946 | store: Replace<Remirror.ManagerStore<AnyExtension>, {
|
4947 | chain: any;
|
4948 | }>;
|
4949 | output: Replace<FrameworkOutput<AnyExtension>, {
|
4950 | chain: any;
|
4951 | manager: AnyRemirrorManager;
|
4952 | }> | undefined;
|
4953 | view: EditorView;
|
4954 | addView: (view: EditorView) => void;
|
4955 | attachFramework: (framework: any, updateHandler: (props: StateUpdateLifecycleProps) => void) => void;
|
4956 | /** @internal */
|
4957 | ['~E']: AnyExtension;
|
4958 | /** @internal */
|
4959 | ['~AN']: string;
|
4960 | /** @internal */
|
4961 | ['~N']: string;
|
4962 | /** @internal */
|
4963 | ['~M']: string;
|
4964 | /** @internal */
|
4965 | ['~P']: string;
|
4966 | }>>;
|
4967 | /**
|
4968 | * Checks to see whether the provided value is a `RemirrorManager` instance.
|
4969 | *
|
4970 | * An optional parameter `mustIncludeList` is available if you want to check
|
4971 | * that the manager includes all the listed extensions.
|
4972 | *
|
4973 | * @param value - the value to check
|
4974 | * @param mustIncludeList - an array of presets and extension the manager must
|
4975 | * include to pass the test. The identifier can either be the Extension / Preset
|
4976 | * name e.g. `bold`, or the Extension / Preset constructor `BoldExtension`
|
4977 | */
|
4978 | declare function isRemirrorManager<Extension extends AnyExtension = AnyExtension>(value: unknown, mustIncludeList?: Array<AnyExtensionConstructor | string>): value is RemirrorManager<Extension>;
|
4979 | interface CreateEditorStateProps extends Omit<StringHandlerProps, 'stringHandler'> {
|
4980 | /**
|
4981 | * This is where content can be supplied to the Editor.
|
4982 | *
|
4983 | * @remarks
|
4984 | *
|
4985 | * Content can either be
|
4986 | * - a string (which will be parsed by the stringHandler)
|
4987 | * - JSON object matching Prosemirror expected shape
|
4988 | * - A top level ProsemirrorNode
|
4989 | *
|
4990 | * If this is left undefined then the editor will use the default empty `doc`.
|
4991 | */
|
4992 | content?: RemirrorContentType;
|
4993 | /**
|
4994 | * The selection that the user should have in the created node.
|
4995 | *
|
4996 | * @defaultValue 'end'
|
4997 | */
|
4998 | selection?: PrimitiveSelection;
|
4999 | /**
|
5000 | * A function which transforms a string into a prosemirror node.
|
5001 | *
|
5002 | * @remarks
|
5003 | *
|
5004 | * Can be used to transform markdown / html or any other string format into a
|
5005 | * prosemirror node.
|
5006 | *
|
5007 | * See [[`fromHTML`]] for an example of how this could work.
|
5008 | */
|
5009 | stringHandler?: keyof Remirror.StringHandlers | StringHandler;
|
5010 | }
|
5011 | interface RemirrorManagerConstructor extends Function {
|
5012 | create<Extension extends AnyExtension>(extension: Extension[], settings?: Remirror.ManagerSettings): RemirrorManager<Extension | BuiltinPreset>;
|
5013 | }
|
5014 | /**
|
5015 | * The `Manager` has multiple hook phases which are able to hook into the
|
5016 | * extension manager flow and add new functionality to the editor.
|
5017 | *
|
5018 | * The `ExtensionEventMethod`s
|
5019 | *
|
5020 | * - onCreate - when the extension manager is created and after the schema is
|
5021 | * made available.
|
5022 | * - onView - when the view has been received from the dom ref.
|
5023 | */
|
5024 | /**
|
5025 | * A class to manage the extensions and prosemirror interactions within the
|
5026 | * editor.
|
5027 | *
|
5028 | * @remarks
|
5029 | *
|
5030 | * The RemirrorManager enables the lifecycle methods of the extensions by
|
5031 | * calling each method in the distinct phases of the lifecycle.
|
5032 | *
|
5033 | * - `onCreate` - This happens when the manager is constructed. It calls on the
|
5034 | * extension which have an `onCreate` method and allows them to do their work.
|
5035 | *
|
5036 | * For the built in methods, this is when the `SchemaExtension` creates the
|
5037 | * Schema and when the `TagsExtension` combines the tags for the editor
|
5038 | * instance.
|
5039 | *
|
5040 | * ```ts
|
5041 | * const manager = Manager.create(() => [
|
5042 | * new DocExtension(),
|
5043 | * new TextExtension(),
|
5044 | * new ParagraphExtension(),
|
5045 | * ])
|
5046 | * ```
|
5047 | *
|
5048 | * At this point all the `onCreate` methods have been called. Including the
|
5049 | * `onCreate` for the `Schema`.
|
5050 | *
|
5051 | * - `onView` - This is called the framework instance connects the
|
5052 | * `RemirrorManager` to the ProseMirror EditorView.
|
5053 | *
|
5054 | * ```ts
|
5055 | * manager.addView(new EditorView(...))
|
5056 | * manager.store.commands.insertText('Hello world');.
|
5057 | * ```
|
5058 | *
|
5059 | * - [[`onStateUpdate`]] - This is the method called every time the ProseMirror
|
5060 | * state changes. Both the extensions and the `Framework` listen to this event
|
5061 | * and can provide updates in response.
|
5062 | */
|
5063 | declare class RemirrorManager<Extension extends AnyExtension> {
|
5064 | #private;
|
5065 | /**
|
5066 | * Create the manager for your `Remirror` editor.
|
5067 | */
|
5068 | static create<Extension extends AnyExtension>(extensions: Extension[] | ExtensionTemplate<Extension>, settings?: Remirror.ManagerSettings): RemirrorManager<Extension | BuiltinPreset>;
|
5069 | /**
|
5070 | * Identifies this as a `Manager`.
|
5071 | *
|
5072 | * @internal
|
5073 | */
|
5074 | get [__INTERNAL_REMIRROR_IDENTIFIER_KEY__](): RemirrorIdentifier.Manager;
|
5075 | /**
|
5076 | * Returns `true` if the manager has been destroyed.
|
5077 | */
|
5078 | get destroyed(): boolean;
|
5079 | /**
|
5080 | * `true` when the view has been added to the UI layer and the editor is
|
5081 | * running.
|
5082 | */
|
5083 | get mounted(): boolean;
|
5084 | /**
|
5085 | * Retrieve the framework output.
|
5086 | *
|
5087 | * This be undefined if the manager hasn't been provided to a framework yet
|
5088 | * the manager.
|
5089 | *
|
5090 | * With synchronous frameworks this means that it should only be accessed
|
5091 | * after the manager has been applied to the editor creation function.
|
5092 | *
|
5093 | * For frameworks like React it is only available when the manager is provided
|
5094 | * to the `Remirror` component and after the very first render. This means it
|
5095 | * is available within the `onRef` callback.
|
5096 | *
|
5097 | * ```tsx
|
5098 | * import React, { useEffect } from 'react';
|
5099 | * import { useRemirror, Remirror } from '@remirror/react';
|
5100 | *
|
5101 | * const Editor = () => {
|
5102 | * const { manager } = useRemirror();
|
5103 | *
|
5104 | * const callback = () => {
|
5105 | * return manager.output; // ✅ This is fine.
|
5106 | * }
|
5107 | *
|
5108 | * useEffect(() => {
|
5109 | * log(manager.output); // ✅ This is also fine.
|
5110 | * }, []);
|
5111 | *
|
5112 | * log(manager.output); // ❌ This will be undefined on the first render.
|
5113 | *
|
5114 | * return <Remirror manager={manager} />
|
5115 | * }
|
5116 | * ```
|
5117 | */
|
5118 | get output(): FrameworkOutput<Extension> | undefined;
|
5119 | /**
|
5120 | * Returns true when a framework is attached to the manager.
|
5121 | *
|
5122 | * This can be used to check if it is safe to call `manager.output`.
|
5123 | */
|
5124 | get frameworkAttached(): boolean;
|
5125 | /**
|
5126 | * The extensions stored by this manager
|
5127 | */
|
5128 | get extensions(): ReadonlyArray<GetExtensions<Extension>>;
|
5129 | /**
|
5130 | * The registered string handlers provided by the extensions.
|
5131 | *
|
5132 | * By default this includes `html` and `plainText`
|
5133 | */
|
5134 | get stringHandlers(): NamedStringHandlers;
|
5135 | /**
|
5136 | * Get the extension manager store which is accessible at initialization.
|
5137 | */
|
5138 | get store(): Remirror.ManagerStore<Extension>;
|
5139 | /**
|
5140 | * Provides access to the extension store.
|
5141 | */
|
5142 | get extensionStore(): Remirror.ExtensionStore;
|
5143 | /**
|
5144 | * Shorthand access to the active transaction from the manager. This is the
|
5145 | * shared transaction available to all commands and should be used when you
|
5146 | * need to make your commands chainable.
|
5147 | *
|
5148 | * If working with react and setting up your editor as a controlled component
|
5149 | * then this is the preferred way to run custom commands, otherwise your
|
5150 | * commands will end up being non-chainable and be overwritten by anything
|
5151 | * that comes after.
|
5152 | */
|
5153 | get tr(): Transaction;
|
5154 | /**
|
5155 | * Returns the stored nodes
|
5156 | */
|
5157 | get nodes(): Record<this['~N'], NodeExtensionSpec>;
|
5158 | /**
|
5159 | * Returns the store marks.
|
5160 | */
|
5161 | get marks(): Record<this['~M'], MarkExtensionSpec>;
|
5162 | /**
|
5163 | * A shorthand method for retrieving the schema for this extension manager
|
5164 | * from the data.
|
5165 | */
|
5166 | get schema(): EditorSchema;
|
5167 | /**
|
5168 | * A shorthand getter for retrieving the tags from the extension manager.
|
5169 | */
|
5170 | get extensionTags(): Readonly<CombinedTags<GetNameUnion<Extension>>>;
|
5171 | /**
|
5172 | * A shorthand way of retrieving the editor view.
|
5173 | */
|
5174 | get view(): EditorView;
|
5175 | /**
|
5176 | * Retrieve the settings used when creating the manager.
|
5177 | */
|
5178 | get settings(): Remirror.ManagerSettings;
|
5179 | /**
|
5180 | * The document to use for rendering and outputting HTML.
|
5181 | */
|
5182 | get document(): Document;
|
5183 | /**
|
5184 | * Creates the extension manager which is used to simplify the management of
|
5185 | * the prosemirror editor.
|
5186 | *
|
5187 | * This is set to private to encourage using `RemirrorManager.create`
|
5188 | * instead of the `new` keyword.
|
5189 | */
|
5190 | private constructor();
|
5191 | /**
|
5192 | * Loops through all extensions to set up the lifecycle handlers.
|
5193 | */
|
5194 | private setupLifecycleHandlers;
|
5195 | /**
|
5196 | * Set the string handler to use for a given name.
|
5197 | *
|
5198 | * This allows users to set the string handler
|
5199 | */
|
5200 | private setStringHandler;
|
5201 | /**
|
5202 | * Set the manager value for the provided key. This is used by extensions to
|
5203 | * add data to the manager.
|
5204 | */
|
5205 | private setStoreKey;
|
5206 | /**
|
5207 | * Get the manager value for the provided key. This is used by extensions to
|
5208 | * get data from the manager.
|
5209 | */
|
5210 | private getStoreKey;
|
5211 | /**
|
5212 | * A method to set values in the extension store which is made available to
|
5213 | * extension.
|
5214 | *
|
5215 | * **NOTE** This method should only be used in the `onCreate` extension method
|
5216 | * or it will throw an error.
|
5217 | */
|
5218 | private setExtensionStore;
|
5219 | /**
|
5220 | * Create the initial store.
|
5221 | */
|
5222 | private createExtensionStore;
|
5223 | /**
|
5224 | * A state getter method which is passed into the params.
|
5225 | */
|
5226 | private readonly getState;
|
5227 | /**
|
5228 | * Stores the editor view on the manager
|
5229 | *
|
5230 | * @param view - the editor view
|
5231 | */
|
5232 | addView(view: EditorView): this;
|
5233 | /**
|
5234 | * Attach a framework to the manager.
|
5235 | */
|
5236 | attachFramework(framework: BaseFramework<Extension>, updateHandler: (props: StateUpdateLifecycleProps) => void): void;
|
5237 | /**
|
5238 | * Create an empty document for the editor based on the current schema.
|
5239 | *
|
5240 | * This automatically looks at the supported content for the doc and the
|
5241 | * available nodes which fulfil that content in order to create a document
|
5242 | * with only the minimal required content.
|
5243 | *
|
5244 | * This can be used in conjunction with the create state to reset the current
|
5245 | * value of the editor.
|
5246 | */
|
5247 | createEmptyDoc(): ProsemirrorNode;
|
5248 | /**
|
5249 | * Create the editor state from content passed to this extension manager.
|
5250 | */
|
5251 | createState(props?: CreateEditorStateProps): EditorState$1;
|
5252 | /**
|
5253 | * Add a handler to the manager.
|
5254 | *
|
5255 | * Currently the only event that can be listened to is the `destroy` event.
|
5256 | */
|
5257 | addHandler<Key extends keyof ManagerEvents>(event: Key, cb: ManagerEvents[Key]): Unsubscribe;
|
5258 | /**
|
5259 | * Update the state of the view and trigger the `onStateUpdate` lifecycle
|
5260 | * method as well.
|
5261 | */
|
5262 | private readonly updateState;
|
5263 | /**
|
5264 | * This method should be called by the view layer every time the state is
|
5265 | * updated.
|
5266 | *
|
5267 | * An example usage of this is within the collaboration extension.
|
5268 | */
|
5269 | onStateUpdate(props: Omit<StateUpdateLifecycleProps, 'firstUpdate'>): void;
|
5270 | /**
|
5271 | * Get the extension instance matching the provided constructor from the
|
5272 | * manager.
|
5273 | *
|
5274 | * This will throw an error if non existent.
|
5275 | */
|
5276 | getExtension<ExtensionConstructor extends AnyExtensionConstructor>(Constructor: ExtensionConstructor): InstanceType<ExtensionConstructor>;
|
5277 | /**
|
5278 | * Determines in an extension is present by providing the desired
|
5279 | * `Constructor`.
|
5280 | *
|
5281 | * This method can be used as a safer alternative to getExtension which
|
5282 | * will throw an error if the constructor doesn't exist within the
|
5283 | * extension created by this extension.
|
5284 | */
|
5285 | hasExtension<ExtensionConstructor extends AnyExtensionConstructor>(Constructor: ExtensionConstructor): boolean;
|
5286 | /**
|
5287 | * Make a clone of the manager.
|
5288 | *
|
5289 | * @internalremarks What about the state stored in the extensions and presets,
|
5290 | * does this need to be recreated as well?
|
5291 | */
|
5292 | clone(): RemirrorManager<Extension>;
|
5293 | /**
|
5294 | * Recreate the manager with new settings and extensions
|
5295 | */
|
5296 | recreate<ExtraExtension extends AnyExtension>(extensions?: ExtraExtension[], settings?: Remirror.ManagerSettings): RemirrorManager<Extension | ExtraExtension>;
|
5297 | /**
|
5298 | * This method should be called to destroy the manager and remove the view.
|
5299 | */
|
5300 | destroy(): void;
|
5301 | /**
|
5302 | * Check whether the manager includes the names or constructors provided for
|
5303 | * the preset and extensions.
|
5304 | *
|
5305 | * Returns true if all are included, returns false otherwise.
|
5306 | */
|
5307 | includes(mustIncludeList: Array<AnyExtensionConstructor | string>): boolean;
|
5308 | }
|
5309 | interface RemirrorManager<Extension extends AnyExtension> {
|
5310 | /**
|
5311 | * The constructor for the [[`RemirrorManager`]].
|
5312 | */
|
5313 | constructor: RemirrorManagerConstructor;
|
5314 | /**
|
5315 | * Pseudo type property which contains the recursively extracted `Extension`
|
5316 | * stored by this manager.
|
5317 | *
|
5318 | * @internal
|
5319 | */
|
5320 | ['~E']: Extension;
|
5321 | /**
|
5322 | * `AllNames`
|
5323 | *
|
5324 | * Get all the names of the extensions within this editor.
|
5325 | *
|
5326 | * @internal
|
5327 | */
|
5328 | ['~AN']: GetNameUnion<Extension> extends never ? string : GetNameUnion<Extension>;
|
5329 | /**
|
5330 | * `NodeNames`
|
5331 | *
|
5332 | * Type inference hack for node extension names. This is the only way I know
|
5333 | * to store types on a class.
|
5334 | *
|
5335 | * @internal
|
5336 | */
|
5337 | ['~N']: GetNodeNameUnion<Extension> extends never ? string : GetNodeNameUnion<Extension>;
|
5338 | /**
|
5339 | * `MarkNames`
|
5340 | *
|
5341 | * Type inference hack for mark extension names. This is the only way I know
|
5342 | * to store types on a class.
|
5343 | *
|
5344 | * @internal
|
5345 | */
|
5346 | ['~M']: GetMarkNameUnion<Extension> extends never ? string : GetMarkNameUnion<Extension>;
|
5347 | /**
|
5348 | * `PlainNames`
|
5349 | *
|
5350 | * Type inference hack for all the plain extension names. This is the only way
|
5351 | * I know to store types on a class.
|
5352 | *
|
5353 | * @internal
|
5354 | */
|
5355 | ['~P']: GetPlainNameUnion<Extension> extends never ? string : GetPlainNameUnion<Extension>;
|
5356 | }
|
5357 | declare global {
|
5358 | namespace Remirror {
|
5359 | /**
|
5360 | * Settings which can be passed into the manager.
|
5361 | */
|
5362 | interface ManagerSettings extends Partial<CustomDocumentProps> {
|
5363 | /**
|
5364 | * Set the extension priority for extension's by their name.
|
5365 | */
|
5366 | priority?: Record<string, ExtensionPriority>;
|
5367 | /**
|
5368 | * An object which excludes certain functionality from all extensions
|
5369 | * within the manager.
|
5370 | */
|
5371 | exclude?: ExcludeOptions;
|
5372 | /**
|
5373 | * The error handler which is called when the JSON passed is invalid.
|
5374 | *
|
5375 | * @remarks
|
5376 | *
|
5377 | * The following can be used to setup the `onError` handler on the the
|
5378 | * manager.
|
5379 | *
|
5380 | * ```tsx
|
5381 | * import React from 'react';
|
5382 | * import { Remirror, InvalidContentHandler } from 'remirror';
|
5383 | * import { Remirror, useManager } from '@remirror/react';
|
5384 | * import { WysiwygPreset } from 'remirror/extensions';
|
5385 | *
|
5386 | * const Editor = () => {
|
5387 | * const onError: InvalidContentHandler = useCallback(({ json, invalidContent, transformers }) => {
|
5388 | * // Automatically remove all invalid nodes and marks.
|
5389 | * return transformers.remove(json, invalidContent);
|
5390 | * }, []);
|
5391 | *
|
5392 | * const manager = useManager(() => [new WysiwygPreset()], { onError });
|
5393 | *
|
5394 | * return (
|
5395 | * <Remirror manager={manager}>
|
5396 | * <div />
|
5397 | * </Remirror>
|
5398 | * );
|
5399 | * };
|
5400 | * ```
|
5401 | */
|
5402 | onError?: InvalidContentHandler;
|
5403 | /**
|
5404 | * A function which transforms a string into a prosemirror node.
|
5405 | *
|
5406 | * @remarks
|
5407 | *
|
5408 | * Can be used to transform markdown / html or any other string format into a
|
5409 | * prosemirror node.
|
5410 | *
|
5411 | * See [[`fromHTML`]] for an example of how this could work.
|
5412 | */
|
5413 | stringHandler?: keyof Remirror.StringHandlers | StringHandler;
|
5414 | /**
|
5415 | * The default named selection. This is used when `manager.createState` is
|
5416 | * called without providing a selection.
|
5417 | *
|
5418 | * @defaultValue 'end'
|
5419 | */
|
5420 | defaultSelection?: 'start' | 'end' | 'all';
|
5421 | }
|
5422 | /**
|
5423 | * Describes the object where the extension manager stores it's data.
|
5424 | *
|
5425 | * @remarks
|
5426 | *
|
5427 | * Since this is a global namespace, you can extend the store if your
|
5428 | * extension is modifying the shape of the `Manager.store` property.
|
5429 | */
|
5430 | interface ManagerStore<Extension extends AnyExtension> {
|
5431 | /**
|
5432 | * The editor view stored by this instance.
|
5433 | */
|
5434 | view: EditorView;
|
5435 | }
|
5436 | interface ExtensionStore {
|
5437 | /**
|
5438 | * Make the remirror manager available to the editor.
|
5439 | */
|
5440 | manager: AnyRemirrorManager;
|
5441 | /**
|
5442 | * The list of all extensions included in the editor.
|
5443 | */
|
5444 | readonly extensions: AnyExtension[];
|
5445 | /**
|
5446 | * The stage the manager is currently at.
|
5447 | */
|
5448 | readonly phase: ManagerPhase;
|
5449 | /**
|
5450 | * The view available to extensions once `addView` has been called on the
|
5451 | * `RemirrorManager` instance.
|
5452 | */
|
5453 | readonly view: EditorView;
|
5454 | /**
|
5455 | * The latest state.
|
5456 | */
|
5457 | currentState: EditorState$1;
|
5458 | /**
|
5459 | * The previous state. Will be undefined when the view is first created.
|
5460 | */
|
5461 | previousState?: EditorState$1;
|
5462 | /**
|
5463 | * The root document to be used for the editor. This is mainly used for
|
5464 | * non-browser environment.
|
5465 | */
|
5466 | readonly document: Document;
|
5467 | /**
|
5468 | * The settings passed to the manager.
|
5469 | */
|
5470 | readonly managerSettings: ManagerSettings;
|
5471 | /**
|
5472 | * The names of every node extension.
|
5473 | */
|
5474 | nodeNames: readonly string[];
|
5475 | /**
|
5476 | * The names of every mark extension.
|
5477 | */
|
5478 | markNames: readonly string[];
|
5479 | /**
|
5480 | * The names of every plain extension.
|
5481 | */
|
5482 | plainNames: readonly string[];
|
5483 | /**
|
5484 | * The named string handlers which are supported by the current editor
|
5485 | * implementation.
|
5486 | */
|
5487 | readonly stringHandlers: NamedStringHandlers;
|
5488 | /**
|
5489 | * Return true when the editor view has been created.
|
5490 | */
|
5491 | readonly isMounted: () => boolean;
|
5492 | /**
|
5493 | * A helper method for retrieving the state of the editor
|
5494 | */
|
5495 | readonly getState: () => EditorState$1;
|
5496 | /**
|
5497 | * Allow extensions to trigger an update in the prosemirror state. This
|
5498 | * should not be used often. It's here in case you need it in an
|
5499 | * emergency.
|
5500 | *
|
5501 | * Internally it's used by the [[`PluginsExtension`]] to create a new
|
5502 | * state when the plugins are updated at runtime.
|
5503 | */
|
5504 | readonly updateState: (state: EditorState$1) => void;
|
5505 | /**
|
5506 | * Get the extension instance matching the provided constructor from the
|
5507 | * manager.
|
5508 | *
|
5509 | * This will throw an error if not defined.
|
5510 | */
|
5511 | readonly getExtension: <ExtensionConstructor extends AnyExtensionConstructor>(Constructor: ExtensionConstructor) => InstanceType<ExtensionConstructor>;
|
5512 | /**
|
5513 | * Get the value of a key from the manager store.
|
5514 | */
|
5515 | getStoreKey: <Key extends ManagerStoreKeys>(key: Key) => AnyManagerStore[Key];
|
5516 | /**
|
5517 | * Update the store with a specific key.
|
5518 | */
|
5519 | setStoreKey: <Key extends ManagerStoreKeys>(key: Key, value: AnyManagerStore[Key]) => void;
|
5520 | /**
|
5521 | * Set a value on the extension store. One of the design decisions in this `1.0.0`
|
5522 | * version of `remirror` was to move away from passing elaborate arguments to each extension
|
5523 | * method and allow extensions to interact with a store shared by all
|
5524 | * extensions.
|
5525 | *
|
5526 | * The extension store object is immutable and will throw an error if updated directly.
|
5527 | *
|
5528 | * ```ts
|
5529 | * class MyExtension extends PlainExtension {
|
5530 | * get name() {}
|
5531 | * }
|
5532 | * ```
|
5533 | */
|
5534 | setExtensionStore: <Key extends keyof ExtensionStore>(key: Key, value: ExtensionStore[Key]) => void;
|
5535 | /**
|
5536 | * Set the string handler to use for a given name.
|
5537 | *
|
5538 | * This allows users to set the string handler
|
5539 | */
|
5540 | setStringHandler: (name: keyof StringHandlers, handler: StringHandler) => void;
|
5541 | }
|
5542 | }
|
5543 | }
|
5544 |
|
5545 | interface BaseFramework<Extension extends AnyExtension> {
|
5546 | /**
|
5547 | * The name of the framework being used.
|
5548 | */
|
5549 | readonly name: string;
|
5550 | /**
|
5551 | * The state that is initially passed into the editor.
|
5552 | */
|
5553 | initialEditorState: EditorState;
|
5554 | /**
|
5555 | * The minimum required output from the framework.
|
5556 | */
|
5557 | readonly frameworkOutput: FrameworkOutput<Extension>;
|
5558 | /**
|
5559 | * Destroy the framework and cleanup all created listeners.
|
5560 | */
|
5561 | destroy(): void;
|
5562 | }
|
5563 | interface FrameworkOptions<Extension extends AnyExtension, Props extends FrameworkProps<Extension>> {
|
5564 | /**
|
5565 | * The initial editor state
|
5566 | */
|
5567 | initialEditorState: EditorState;
|
5568 | /**
|
5569 | * A method for getting the passed in props.
|
5570 | */
|
5571 | getProps: () => Props;
|
5572 | /**
|
5573 | * When provided the view will immediately be inserted into the dom within
|
5574 | * this element.
|
5575 | */
|
5576 | element?: Element;
|
5577 | }
|
5578 | /**
|
5579 | * The base options for an editor wrapper. This is used within the react and dom
|
5580 | * implementations.
|
5581 | */
|
5582 | interface FrameworkProps<Extension extends AnyExtension> {
|
5583 | /**
|
5584 | * Pass in the extension manager.
|
5585 | *
|
5586 | * The manager is responsible for handling all Prosemirror related
|
5587 | * functionality.
|
5588 | */
|
5589 | manager: RemirrorManager<Extension>;
|
5590 | /**
|
5591 | * Set the starting value for the editor.
|
5592 | *
|
5593 | * Without setting the value prop `onChange` remirror renders as an uncontrolled
|
5594 | * component. Value changes are passed back out of the editor and there is now
|
5595 | * way to set the value via props. As a result this is the only opportunity to
|
5596 | * directly control the rendered text.
|
5597 | *
|
5598 | * @defaultValue `{ type: 'doc', content: [{ type: 'paragraph' }] }`
|
5599 | */
|
5600 | initialContent?: RemirrorContentType | [RemirrorContentType, PrimitiveSelection];
|
5601 | /**
|
5602 | * Adds attributes directly to the prosemirror element.
|
5603 | *
|
5604 | * @defaultValue {}
|
5605 | */
|
5606 | attributes?: Record<string, string> | AttributePropFunction<Extension>;
|
5607 | /**
|
5608 | * Additional classes which can be passed into the the editor wrapper. These
|
5609 | * are placed on root `Prosemirror` element and can be used to effect styling
|
5610 | * within the editor.
|
5611 | */
|
5612 | classNames?: ClassName[];
|
5613 | /**
|
5614 | * Determines whether this editor is editable or not.
|
5615 | *
|
5616 | * @defaultValue true
|
5617 | */
|
5618 | editable?: boolean;
|
5619 | /**
|
5620 | * When set to true focus will be place on the editor as soon as it first
|
5621 | * loads.
|
5622 | *
|
5623 | * @defaultValue false
|
5624 | */
|
5625 | autoFocus?: FocusType;
|
5626 | /**
|
5627 | * An event listener which is called whenever the editor gains focus.
|
5628 | */
|
5629 | onFocus?: (params: RemirrorEventListenerProps<Extension>, event: Event) => void;
|
5630 | /**
|
5631 | * An event listener which is called whenever the editor is blurred.
|
5632 | */
|
5633 | onBlur?: (params: RemirrorEventListenerProps<Extension>, event: Event) => void;
|
5634 | /**
|
5635 | * Called on every change to the Prosemirror state.
|
5636 | */
|
5637 | onChange?: RemirrorEventListener<Extension>;
|
5638 | /**
|
5639 | * A method called when the editor is dispatching the transaction.
|
5640 | *
|
5641 | * @remarks
|
5642 | * Use this to update the transaction which will be used to update the editor
|
5643 | * state.
|
5644 | */
|
5645 | onDispatchTransaction?: TransactionTransformer;
|
5646 | /**
|
5647 | * Sets the accessibility label for the editor instance.
|
5648 | *
|
5649 | * @defaultValue ''
|
5650 | */
|
5651 | label?: string;
|
5652 | }
|
5653 | type AddFrameworkHandler<Extension extends AnyExtension> = <Key extends keyof FrameworkEvents<Extension>>(event: Key, cb: FrameworkEvents<Extension>[Key]) => Unsubscribe;
|
5654 | /**
|
5655 | * This is the base output that is created by a framework.
|
5656 | */
|
5657 | interface FrameworkOutput<Extension extends AnyExtension> extends Remirror.ManagerStore<Extension> {
|
5658 | /**
|
5659 | * The manager which was used to create this editor.
|
5660 | */
|
5661 | manager: RemirrorManager<Extension>;
|
5662 | /**
|
5663 | * Add event handlers to the remirror editor at runtime.
|
5664 | */
|
5665 | addHandler: AddFrameworkHandler<Extension>;
|
5666 | /**
|
5667 | * The unique id for the editor instance.
|
5668 | */
|
5669 | uid: string;
|
5670 | /**
|
5671 | * Clears all editor content.
|
5672 | *
|
5673 | * @param options - includes a `triggerChange` handler which should be
|
5674 | * triggered by the update.
|
5675 | *
|
5676 | * To use this in a controlled editor, you must set `triggerChange` to `true`.
|
5677 | */
|
5678 | clearContent: (options?: TriggerChangeProps) => void;
|
5679 | /**
|
5680 | * Replace all editor content with the new content.
|
5681 | *
|
5682 | * @remarks
|
5683 | *
|
5684 | * Allows for the editor content to be overridden by force.
|
5685 | *
|
5686 | * @param triggerOnChange - whether the `onChange` handler should be triggered
|
5687 | * by the update. Defaults to `false`.
|
5688 | *
|
5689 | * To use this in a controlled editor, you must set `triggerChange` to `true`.
|
5690 | */
|
5691 | setContent: (content: RemirrorContentType, options?: TriggerChangeProps) => void;
|
5692 | /**
|
5693 | * A getter function for the current editor state. It's a wrapper around
|
5694 | * `view.state`.
|
5695 | */
|
5696 | getState: () => EditorState;
|
5697 | /**
|
5698 | * A getter function for the previous prosemirror editor state. It can be used
|
5699 | * to check what's changed between states.
|
5700 | */
|
5701 | getPreviousState: () => EditorState;
|
5702 | /**
|
5703 | * Get an extension by it's constructor.
|
5704 | */
|
5705 | getExtension: <ExtensionConstructor extends AnyExtensionConstructor>(Constructor: ExtensionConstructor) => InstanceType<ExtensionConstructor>;
|
5706 | /**
|
5707 | * Assert if an extension is present by it's constructor.
|
5708 | */
|
5709 | hasExtension: <ExtensionConstructor extends AnyExtensionConstructor>(Constructor: ExtensionConstructor) => boolean;
|
5710 | /**
|
5711 | * Focus the editor at the `start` | `end` a specific position or at a valid
|
5712 | * range between `{ from, to }`.
|
5713 | *
|
5714 | * @deprecated This method may be removed in the future and it is advisable to
|
5715 | * use `commands.focus()`.
|
5716 | */
|
5717 | focus: (position?: FocusType) => void;
|
5718 | /**
|
5719 | * Blur the editor.
|
5720 | *
|
5721 | * @deprecated This method may be removed in the future and it is advisable to
|
5722 | * use `commands.blur()`.
|
5723 | */
|
5724 | blur: (position?: PrimitiveSelection) => void;
|
5725 | }
|
5726 | type CreateStateFromContent = (content: RemirrorContentType, selection?: PrimitiveSelection) => EditorState;
|
5727 | interface RemirrorEventListenerProps<Extension extends AnyExtension> extends EditorStateProps, Remirror.ListenerProperties<Extension>, EditorViewProps {
|
5728 | /**
|
5729 | * The original transaction which caused this state update.
|
5730 | *
|
5731 | * This allows for inspecting the reason behind the state change. When
|
5732 | * undefined this means that the state was updated externally.
|
5733 | *
|
5734 | * If available:
|
5735 | * - Metadata on the transaction can be inspected. `tr.getMeta`
|
5736 | * - Was the change caused by added / removed content? `tr.docChanged`
|
5737 | * - Was ths change caused by an updated selection? `tr.selectionSet`
|
5738 | * - `tr.steps` can be inspected for further granularity.
|
5739 | */
|
5740 | tr?: Transaction;
|
5741 | /**
|
5742 | * When the state updates are not controlled and it was a transaction that
|
5743 | * caused the state to be updated this value captures all the transaction
|
5744 | * updates caused by prosemirror plugins hook state methods like
|
5745 | * `filterTransactions` and `appendTransactions`.
|
5746 | *
|
5747 | * This is for advanced users only.
|
5748 | */
|
5749 | transactions?: readonly Transaction[];
|
5750 | /**
|
5751 | * A shorthand way of checking whether the update was triggered by editor
|
5752 | * usage (internal) or overwriting the state.
|
5753 | *
|
5754 | * - `true` The update was triggered by a change in the prosemirror doc or an
|
5755 | * update to the selection. In these cases `tr` will have a value.
|
5756 | * - `false` The update was caused by a call to `setContent` or `resetContent`
|
5757 | */
|
5758 | internalUpdate: boolean;
|
5759 | /**
|
5760 | * True when this is the first render of the editor. This applies when the
|
5761 | * editor is first attached to the DOM.
|
5762 | */
|
5763 | firstRender: boolean;
|
5764 | /**
|
5765 | * The previous state.
|
5766 | */
|
5767 | previousState: EditorState;
|
5768 | /**
|
5769 | * Manually create a new state object with the desired content.
|
5770 | */
|
5771 | createStateFromContent: CreateStateFromContent;
|
5772 | }
|
5773 | type RemirrorEventListener<Extension extends AnyExtension> = (params: RemirrorEventListenerProps<Extension>) => void;
|
5774 | type AttributePropFunction<Extension extends AnyExtension> = (params: RemirrorEventListenerProps<Extension>) => Record<string, string>;
|
5775 | interface PlaceholderConfig extends TextProps {
|
5776 | className: string;
|
5777 | }
|
5778 | interface UpdateStateProps extends Partial<TransactionProps>, EditorStateProps, TriggerChangeProps {
|
5779 | /**
|
5780 | * When the state updates are not controlled and it was a transaction that
|
5781 | * caused the state to be updated this value captures all the transaction
|
5782 | * updates caused by prosemirror plugins hook state methods like
|
5783 | * `filterTransactions` and `appendTransactions`.
|
5784 | *
|
5785 | * This is for advanced users only.
|
5786 | */
|
5787 | transactions?: readonly Transaction[];
|
5788 | }
|
5789 | interface TriggerChangeProps {
|
5790 | /**
|
5791 | * Whether or not to trigger this as a change and call any handlers.
|
5792 | *
|
5793 | * @defaultValue true
|
5794 | */
|
5795 | triggerChange?: boolean;
|
5796 | }
|
5797 | interface ListenerProps extends Partial<EditorStateProps>, Partial<TransactionProps> {
|
5798 | /**
|
5799 | * When the state updates are not controlled and it was a transaction that
|
5800 | * caused the state to be updated this value captures all the transaction
|
5801 | * updates caused by prosemirror plugins hook state methods like
|
5802 | * `filterTransactions` and `appendTransactions`.
|
5803 | *
|
5804 | * This is for advanced users only.
|
5805 | */
|
5806 | transactions?: readonly Transaction[];
|
5807 | }
|
5808 | interface FrameworkEvents<Extension extends AnyExtension> extends Pick<ManagerEvents, 'destroy'> {
|
5809 | /**
|
5810 | * An event listener which is called whenever the editor gains focus.
|
5811 | */
|
5812 | focus: (params: RemirrorEventListenerProps<Extension>, event: Event) => void;
|
5813 | /**
|
5814 | * An event listener which is called whenever the editor is blurred.
|
5815 | */
|
5816 | blur: (params: RemirrorEventListenerProps<Extension>, event: Event) => void;
|
5817 | /**
|
5818 | * Called on every state update after the state has been applied to the editor.
|
5819 | *
|
5820 | * This should be used to track the current editor state and check if commands
|
5821 | * are enabled.
|
5822 | */
|
5823 | updated: RemirrorEventListener<Extension>;
|
5824 | }
|
5825 | type UpdatableViewPropsObject = {
|
5826 | [Key in UpdatableViewProps]: DirectEditorProps[Key];
|
5827 | };
|
5828 | declare global {
|
5829 | namespace Remirror {
|
5830 | interface ListenerProperties<Extension extends AnyExtension> {
|
5831 | }
|
5832 | }
|
5833 | }
|
5834 |
|
5835 | /**
|
5836 | * This is the `Framework` class which is used to create an abstract class for
|
5837 | * implementing `Remirror` into the framework of your choice.
|
5838 | *
|
5839 | * The best way to learn how to use it is to take a look at the [[`DomFramework`]]
|
5840 | * and [[`ReactFramework`]] implementations.
|
5841 | *
|
5842 | * @remarks
|
5843 | *
|
5844 | * There are two methods and one getter property which must be implemented for this
|
5845 | */
|
5846 | declare abstract class Framework<Extension extends AnyExtension = BuiltinPreset, Props extends FrameworkProps<Extension> = FrameworkProps<Extension>, Output extends FrameworkOutput<Extension> = FrameworkOutput<Extension>> implements BaseFramework<Extension> {
|
5847 | #private;
|
5848 | /**
|
5849 | * A previous state that can be overridden by the framework implementation.
|
5850 | */
|
5851 | protected previousStateOverride?: EditorState;
|
5852 | /**
|
5853 | * The event listener which allows consumers to subscribe to the different
|
5854 | * events taking place in the editor. Events currently supported are:
|
5855 | *
|
5856 | * - `destroy`
|
5857 | * - `focus`
|
5858 | * - `blur`
|
5859 | * - `updated`
|
5860 | */
|
5861 | protected get addHandler(): AddFrameworkHandler<Extension>;
|
5862 | /**
|
5863 | * The updatable view props.
|
5864 | */
|
5865 | protected get updatableViewProps(): UpdatableViewPropsObject;
|
5866 | /**
|
5867 | * True when this is the first render of the editor.
|
5868 | */
|
5869 | protected get firstRender(): boolean;
|
5870 | /**
|
5871 | * Store the name of the framework.
|
5872 | */
|
5873 | abstract get name(): string;
|
5874 | /**
|
5875 | * The props passed in when creating or updating the `Framework` instance.
|
5876 | */
|
5877 | get props(): Props;
|
5878 | /**
|
5879 | * Returns the previous editor state. On the first render it defaults to
|
5880 | * returning the current state. For the first render the previous state and
|
5881 | * current state will always be equal.
|
5882 | */
|
5883 | protected get previousState(): EditorState;
|
5884 | /**
|
5885 | * The instance of the [[`RemirrorManager`]].
|
5886 | */
|
5887 | protected get manager(): RemirrorManager<Extension>;
|
5888 | /**
|
5889 | * The ProseMirror [[`EditorView`]].
|
5890 | */
|
5891 | protected get view(): EditorView;
|
5892 | /**
|
5893 | * A unique id for the editor. Can be used to differentiate between editors.
|
5894 | *
|
5895 | * Please note that this ID is only locally unique, it should not be used as a
|
5896 | * database key.
|
5897 | */
|
5898 | protected get uid(): string;
|
5899 | /**
|
5900 | * The initial editor state from when the editor was first created.
|
5901 | */
|
5902 | get initialEditorState(): EditorState;
|
5903 | constructor(options: FrameworkOptions<Extension, Props>);
|
5904 | /**
|
5905 | * Setup the manager event listeners which are disposed of when the manager is
|
5906 | * destroyed.
|
5907 | */
|
5908 | private updateListener;
|
5909 | /**
|
5910 | * Update the constructor props passed in. Useful for frameworks like react
|
5911 | * where props are constantly changing and when using hooks function closures
|
5912 | * can become stale.
|
5913 | *
|
5914 | * You can call the update method with the new `props` to update the internal
|
5915 | * state of this instance.
|
5916 | */
|
5917 | update(options: FrameworkOptions<Extension, Props>): this;
|
5918 | /**
|
5919 | * Retrieve the editor state.
|
5920 | */
|
5921 | protected readonly getState: () => EditorState;
|
5922 | /**
|
5923 | * Retrieve the previous editor state.
|
5924 | */
|
5925 | protected readonly getPreviousState: () => EditorState;
|
5926 | /**
|
5927 | * This method must be implement by the extending framework class. It returns
|
5928 | * an [[`EditorView`]] which is added to the [[`RemirrorManager`]].
|
5929 | */
|
5930 | protected abstract createView(state: EditorState, element?: Element): EditorView;
|
5931 | /**
|
5932 | * This is used to implement how the state updates are used within your
|
5933 | * application instance.
|
5934 | *
|
5935 | * It must be implemented.
|
5936 | */
|
5937 | protected abstract updateState(props: UpdateStateProps): void;
|
5938 | /**
|
5939 | * Update the view props.
|
5940 | */
|
5941 | protected updateViewProps(...keys: UpdatableViewProps[]): void;
|
5942 | /**
|
5943 | * This sets the attributes for the ProseMirror Dom node.
|
5944 | */
|
5945 | protected getAttributes(ssr?: false): Record<string, string>;
|
5946 | protected getAttributes(ssr: true): Shape;
|
5947 | /**
|
5948 | * Part of the Prosemirror API and is called whenever there is state change in
|
5949 | * the editor.
|
5950 | *
|
5951 | * @internalremarks
|
5952 | * How does it work when transactions are dispatched one after the other.
|
5953 | */
|
5954 | protected readonly dispatchTransaction: (tr: Transaction) => void;
|
5955 | /**
|
5956 | * Adds `onBlur` and `onFocus` listeners.
|
5957 | *
|
5958 | * When extending this class make sure to call this method once
|
5959 | * `ProsemirrorView` has been added to the dom.
|
5960 | */
|
5961 | protected addFocusListeners(): void;
|
5962 | /**
|
5963 | * Remove `onBlur` and `onFocus` listeners.
|
5964 | *
|
5965 | * When extending this class in your framework, make sure to call this just
|
5966 | * before the view is destroyed.
|
5967 | */
|
5968 | protected removeFocusListeners(): void;
|
5969 | /**
|
5970 | * Called when the component unmounts and is responsible for cleanup.
|
5971 | *
|
5972 | * @remarks
|
5973 | *
|
5974 | * - Removes listeners for the editor `blur` and `focus` events
|
5975 | */
|
5976 | destroy(): void;
|
5977 | /**
|
5978 | * Use this method in the `onUpdate` event to run all change handlers.
|
5979 | */
|
5980 | readonly onChange: (props?: ListenerProps) => void;
|
5981 | /**
|
5982 | * Listener for editor 'blur' events
|
5983 | */
|
5984 | private readonly onBlur;
|
5985 | /**
|
5986 | * Listener for editor 'focus' events
|
5987 | */
|
5988 | private readonly onFocus;
|
5989 | /**
|
5990 | * Sets the content of the editor. This bypasses the update function.
|
5991 | *
|
5992 | * @param content
|
5993 | * @param triggerChange
|
5994 | */
|
5995 | private readonly setContent;
|
5996 | /**
|
5997 | * Clear the content of the editor (reset to the default empty node).
|
5998 | *
|
5999 | * @param triggerChange - whether to notify the onChange handler that the
|
6000 | * content has been reset
|
6001 | */
|
6002 | private readonly clearContent;
|
6003 | /**
|
6004 | * Creates the props passed into all event listener handlers. e.g.
|
6005 | * `onChange`
|
6006 | */
|
6007 | protected eventListenerProps(props?: ListenerProps): RemirrorEventListenerProps<Extension>;
|
6008 | protected readonly createStateFromContent: CreateStateFromContent;
|
6009 | /**
|
6010 | * Focus the editor.
|
6011 | */
|
6012 | protected readonly focus: (position?: FocusType) => void;
|
6013 | /**
|
6014 | * Blur the editor.
|
6015 | */
|
6016 | protected readonly blur: (position?: PrimitiveSelection) => void;
|
6017 | /**
|
6018 | * Methods and properties which are made available to all consumers of the
|
6019 | * `Framework` class.
|
6020 | */
|
6021 | protected get baseOutput(): FrameworkOutput<Extension>;
|
6022 | /**
|
6023 | * Every framework implementation must provide it's own custom output.
|
6024 | */
|
6025 | abstract get frameworkOutput(): Output;
|
6026 | }
|
6027 |
|
6028 | export { ActiveFromExtensions, AddCustomHandler, AddHandler, AnyExtension, AnyExtensionConstructor, AnyManagerStore, AnyMarkExtension, AnyNodeExtension, AnyPlainExtension, AnyRemirrorManager, AppendLifecycleProps, ApplyStateLifecycleProps, AttributePropFunction, AttributesExtension, AttrsFromExtensions, BaseExtensionOptions, BaseFramework, BuiltinOptions, BuiltinPreset, ChainedCommandProps, ChainedFromExtensions, ChainedIntersection, ChangedOptions, ClassName, CombinedTags, CommandDecoratorMessage, CommandDecoratorMessageProps, CommandDecoratorOptions, CommandDecoratorShortcut, CommandDecoratorValue, CommandExtensionMeta, CommandNames, CommandOptions, CommandShape, CommandUiDecoratorOptions, CommandUiIcon, CommandsExtension, CommandsFromExtensions, CreateEditorStateProps, CreateExtensionPlugin, CreateStateFromContent, CustomHandlerMethod, DEFAULT_SHORTCUTS, DecorationPlaceholder, DecorationPlaceholderMeta, DecorationsExtension, DecorationsOptions$1 as DecorationsOptions, DefaultExtensionOptions, DelayedCommand, DelayedPlaceholderCommandProps, DelayedPromiseCreator, DelayedValue, DocChangedExtension, DocChangedOptions, DynamicOptionsOfConstructor, ExcludeOptions$1 as ExcludeOptions, Extension, ExtensionCommandFunction, ExtensionCommandReturn, ExtensionConstructor, ExtensionConstructorProps, ExtensionDecoratorOptions, ExtensionHelperReturn, ExtensionListProps, ExtensionStore$1 as ExtensionStore, FileUploader, FocusType, ForcedUpdateMeta, Framework, FrameworkOptions, FrameworkOutput, FrameworkProps, GOOGLE_DOC_SHORTCUTS, GetChangeOptionsReturn, GetCommands, GetConstructor, GetExtensions, GetHelpers, GetMarkNameUnion, GetNameUnion, GetNodeNameUnion, GetOptions, GetPlainNameUnion, HandlerKeyOptions, Helper, HelperAnnotation, HelperDecoratorOptions, HelperFunction, HelperNames, HelpersExtension, HelpersFromExtensions, IdentifierSchemaAttributes, Identifiers, IdentifiersObject, InputRulesExtension, InputRulesOptions, InsertNodeOptions, KeyBindingsTuple, KeybindingDecoratorOptions, KeyboardShortcut, KeyboardShortcutFunction, KeyboardShortcutValue, KeyboardShortcuts, KeymapExtension, KeymapOptions, ListenerProps, ManagerEvents, ManagerStoreKeys, MapHelpers, MapToChainedCommand, MapToUnchainedCommand, MarkExtension, MetaExtension, MetaOptions, Metadata, NewChainedCommandProps, NodeExtension, NodeViewsExtension, OnSetOptionsProps, OptionsOfConstructor, PasteRulesExtension, PasteRulesOptions, PickChanged, PlaceholderConfig, PlainExtension, PluginsExtension, PluginsOptions, PrioritizedKeyBindings, RemirrorEventListener, RemirrorEventListenerProps, RemirrorManager, RemoveAny, SchemaExtension, ShortcutMap, StateUpdateLifecycleProps, SuggestExtension, SuggestOptions, TagsExtension, TriggerChangeProps, TypedPropertyDescriptor, UiCommandFunction, UiCommandNames, UnpackedExtension, UpdatableViewProps, UpdateReason, UpdateReasonProps, UpdateStateProps, UploadContext, UploadExtension, UploadFileHandler, UploadPlaceholderPayload, WidgetPlaceholder, builtinPreset, command, cx, delayedCommand, extension, extensionDecorator, findUploadPlaceholderPayload, findUploadPlaceholderPos, hasUploadingFile, helper, insertText, isDelayedValue, isExtension, isExtensionConstructor, isExtensionTag, isMarkExtension, isNodeExtension, isPlainExtension, isRemirrorManager, keyBinding, keyboardShortcuts, mutateDefaultExtensionOptions, setUploadPlaceholderAction, toggleMark, uploadFile };
|
6029 |
|
\ | No newline at end of file |