feat: integrate svgmoji within EmojiExtension

.changeset/config.json

@@ -64,7 +64,6 @@
       "@remirror/extension-embed",
       "@remirror/extension-list",
       "@remirror/preset-react",
-      "@remirror/preset-social",
       "@remirror/extension-tables",
       "@remirror/preset-wysiwyg",
       "@remirror/react-hooks",

.changeset/giant-worms-argue.md

@@ -0,0 +1,5 @@
+---
+'@remirror/extension-emoji': minor
+---
+
+Improve the `EmojiExtension` API with `svgmoji`. Now emojis can be rendered as nodes or plain text and when rendered as nodes, the images are sourced via an SVG sprite from the `svgmoji` CDN.

packages/@remirror/core-types/src/core-types.ts

@@ -50,7 +50,10 @@ export interface StateJSON {
   selection: FromToProps;
 }
 
-type GetAttributesFunction = (p: string[]) => ProsemirrorAttributes | undefined;
+/**
+ * The matches array. `matches[0]` is the full match.
+ */
+type GetAttributesFunction = (matches: string[]) => ProsemirrorAttributes | undefined;
 
 /**
  * A function which takes a regex match array (strings) or a single string match
@@ -132,7 +135,14 @@ export type KeyBindingCommandFunction<Schema extends EditorSchema = EditorSchema
  */
 export type KeyBindings<Schema extends EditorSchema = EditorSchema> = Partial<
   Record<
-    'Enter' | 'ArrowDown' | 'ArrowUp' | 'ArrowLeft' | 'ArrowRight' | 'Esc' | 'Delete' | 'Backspace',
+    | 'Enter'
+    | 'ArrowDown'
+    | 'ArrowUp'
+    | 'ArrowLeft'
+    | 'ArrowRight'
+    | 'Escape'
+    | 'Delete'
+    | 'Backspace',
     KeyBindingCommandFunction<Schema>
   >
 > &

packages/@remirror/core-utils/src/command-utils.ts

@@ -258,7 +258,7 @@ export function toggleBlockItem(toggleProps: ToggleBlockItemProps): CommandFunct
   };
 }
 
-export interface ReplaceTextProps extends Partial<RangeProps>, Partial<AttributesProps> {
+export interface ReplaceTextProps extends Partial<AttributesProps> {
   /**
    * The text to append.
    *
@@ -280,6 +280,16 @@ export interface ReplaceTextProps extends Partial<RangeProps>, Partial<Attribute
    * Whether to keep the original selection after the replacement.
    */
   keepSelection?: boolean;
+
+  /**
+   * @deprecated - use `selection` instead.
+   */
+  range?: FromToProps;
+
+  /**
+   * The selected part of the document to replace.
+   */
+  selection?: PrimitiveSelection;
 }
 
 /**
@@ -327,13 +337,13 @@ export function preserveSelection(selection: Selection, tr: Transaction): void {
  * @param props - see [[`ReplaceTextProps`]]
  */
 export function replaceText(props: ReplaceTextProps): CommandFunction {
-  const { range, attrs = {}, appendText = '', content = '', keepSelection = false } = props;
+  const { attrs = {}, appendText = '', content = '', keepSelection = false } = props;
 
   return ({ state, tr, dispatch }) => {
     const schema = state.schema;
-    const selection = tr.selection;
+    const selection = getTextSelection(props.selection ?? props.range ?? tr.selection, tr.doc);
     const index = selection.$from.index();
-    const { from, to } = range ?? selection;
+    const { from, to } = selection;
 
     const type = isString(props.type)
       ? schema.nodes[props.type] ?? schema.marks[props.type]