feat(YfmTable): rework table controls – add drag-n-drop, rows and columns insertion

demo/stories/examples/yfm-table-dnd/YfmTableDnD.stories.tsx

@@ -0,0 +1,15 @@
+import type {StoryObj} from '@storybook/react';
+
+import {YfmTableDnDDemo as component} from './YfmTableDnD';
+
+export const Story: StoryObj<typeof component> = {
+    args: {
+        mobile: false,
+    },
+};
+Story.storyName = "YFM Table D'n'D";
+
+export default {
+    title: "Examples / YFM Table D'n'D",
+    component,
+};

demo/stories/examples/yfm-table-dnd/YfmTableDnD.tsx

@@ -0,0 +1,39 @@
+import {memo} from 'react';
+
+import {MarkdownEditorView, useMarkdownEditor} from 'src/index';
+
+import {PlaygroundLayout} from '../../../components/PlaygroundLayout';
+
+import {markup} from './markup';
+
+export type YfmTableDnDDemoProps = {
+    mobile: boolean;
+};
+
+export const YfmTableDnDDemo = memo<YfmTableDnDDemoProps>(function YfmTableDnDDemo({mobile}) {
+    const editor = useMarkdownEditor(
+        {
+            mobile,
+            initial: {
+                mode: 'wysiwyg',
+                markup,
+            },
+        },
+        [mobile],
+    );
+
+    return (
+        <PlaygroundLayout
+            editor={editor}
+            view={({className}) => (
+                <MarkdownEditorView
+                    autofocus
+                    stickyToolbar
+                    settingsVisible
+                    editor={editor}
+                    className={className}
+                />
+            )}
+        />
+    );
+});