edytor 0.1.0-next.29 → 0.1.0-next.31

package/README.md

@@ -15,7 +15,7 @@
 
 Edytor aims to be for Svelte what Slate.js is for React: a heavily customizable editor with an API to build any kind of collaborative rich text editor.
 
-> **Work in progress.** Edytor is a pre-release (`0.1.0-next.29`, `edytor@next` on npm) and not ready for production; the API changes between releases without a compatibility layer. The untagged `edytor@0.0.11` on npm predates the current API. Issues and PRs are welcome: when you report a bug, include the document's JSON value.
+> **Work in progress.** Edytor is a pre-release (`0.1.0-next.31`, `edytor@next` on npm) and not ready for production; the API changes between releases without a compatibility layer. The untagged `edytor@0.0.11` on npm predates the current API. Issues and PRs are welcome: when you report a bug, include the document's JSON value.
 
 ## Features
 

package/dist/plugins/blockHandles/BlockHandleController.svelte.js

@@ -120,27 +120,6 @@ const backdrop = (document) => {
     node.setAttribute('aria-hidden', 'true');
     return node;
 };
-/** How many blocks move: the badge beside the drop indicator. */
-const countBadge = (document, count) => {
-    const badge = document.createElement('span');
-    badge.dataset.edytorDragCount = 'true';
-    badge.textContent = String(count);
-    Object.assign(badge.style, {
-        position: 'absolute',
-        top: '-8px',
-        right: '-8px',
-        minWidth: '18px',
-        height: '18px',
-        padding: '0 5px',
-        boxSizing: 'border-box',
-        borderRadius: '9px',
-        background: 'rgb(35, 131, 226)',
-        color: 'white',
-        font: '600 11px/18px system-ui, sans-serif',
-        textAlign: 'center'
-    });
-    return badge;
-};
 export class BlockHandleController {
     edytor;
     options;
@@ -1045,13 +1024,9 @@ export class BlockHandleController {
             overlay.dataset.blocked = 'true';
         overlay.setAttribute('aria-hidden', 'true');
         const count = this.group.length;
-        if (count > 1) {
-            // The count sits in the gutter at the bar's start, where the handles are.
+        // How many blocks move, as data only: the bar shows no badge.
+        if (count > 1)
             overlay.dataset.count = String(count);
-            const badge = countBadge(document, count);
-            Object.assign(badge.style, { top: `${BAR / 2 - 9}px`, right: 'auto', left: '-26px' });
-            overlay.append(badge);
-        }
         const color = document.defaultView
             ?.getComputedStyle(placement.node)
             .getPropertyValue('--edytor-drop-indicator-color')

package/dist/plugins/richtext/RichTextPlugin.svelte

@@ -4,6 +4,7 @@
 	import type { SerializableContent } from '../../utils/json.js';
 	import type { HotKey } from '../../session/keymap.js';
 	import {
+		pastedLink,
 		richTextOperations,
 		sanitizeLinkHref,
 		sanitizeCssColorValue,
@@ -141,6 +142,19 @@
 					])
 				)
 			},
+			// Pasting a link over selected text links it (Notion), where the toolbar
+			// offers a link: a text range outside code blocks and voids.
+			onPaste: ({ e, prevent }) => {
+				const { selection } = edytor;
+				const { value, projection } = selection;
+				if (value.kind !== 'text' || selection.state.isCollapsed) return;
+				if (projection.islandRoot !== null || projection.voidRoot !== null) return;
+				const href = pastedLink(e.clipboardData?.getData('text/plain'));
+				if (href)
+					prevent(() =>
+						edytor.dispatcher.run('insertFromPaste', () => operations.setLinkAtRange({ href }))
+					);
+			},
 			onBeforeInput: ({ e, prevent }) => {
 				const { inputType, data } = e;
 				if (isNativeFormatInputType(inputType)) {

package/dist/plugins/richtext/richTextOperations.d.ts

@@ -24,6 +24,13 @@ export declare const sanitizeCssColorValue: (value: unknown) => string | null;
  * pass through.
  */
 export declare const sanitizeLinkHref: (href: unknown) => string | null;
+/**
+ * The URL a paste carries when its plain text is one link and nothing else
+ * (surrounding whitespace aside): `http:`/`https:` with a host, or
+ * `mailto:`. `null` for anything else — words, several URLs, a bare
+ * domain, a scriptable scheme.
+ */
+export declare const pastedLink: (plain: string | undefined | null) => string | null;
 export declare const richTextOperations: (edytor: Edytor) => {
     /**
      * Insert a `divider` void block at the caret — the native

package/dist/plugins/richtext/richTextOperations.js

@@ -52,6 +52,25 @@ export const sanitizeLinkHref = (href) => {
         return null;
     }
 };
+/**
+ * The URL a paste carries when its plain text is one link and nothing else
+ * (surrounding whitespace aside): `http:`/`https:` with a host, or
+ * `mailto:`. `null` for anything else — words, several URLs, a bare
+ * domain, a scriptable scheme.
+ */
+export const pastedLink = (plain) => {
+    const text = plain?.trim();
+    if (!text || /\s/.test(text))
+        return null;
+    try {
+        const url = new URL(text);
+        const web = (url.protocol === 'http:' || url.protocol === 'https:') && url.host;
+        return web || (url.protocol === 'mailto:' && url.pathname) ? sanitizeLinkHref(text) : null;
+    }
+    catch {
+        return null;
+    }
+};
 const formatSelectedTextRange = (edytor, mark, value, toggle) => {
     const { yStart, yEnd, startText, endText, isCollapsed, isReversed } = edytor.selection.state;
     if (isCollapsed || !startText || !endText)

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "edytor",
-	"version": "0.1.0-next.29",
+	"version": "0.1.0-next.31",
 	"repository": {
 		"type": "git",
 		"url": "git+https://github.com/beynar/edytor.git"