autumnnote 1.8.1 → 1.8.3

package/README.md

@@ -16,7 +16,7 @@ A **zero-dependency WYSIWYG rich-text editor** built with vanilla JavaScript (ES
 
 > **Fast. Lightweight. Reliable. Efficient.**
 
-[Live Demo](https://cmm-cmm.github.io/Autumn-Note/) · [Docs](https://cmm-cmm.github.io/Autumn-Note/docs.html) · [Playground](https://cmm-cmm.github.io/Autumn-Note/playground.html)
+[Live Demo](https://autumn.konexforge.com/) · [Docs](https://autumn.konexforge.com/docs.html) · [Playground](https://autumn.konexforge.com/playground.html)
 
 <p align="center"><img src="examples/Screenshot.png" alt="AutumnNote Screenshot"/></p>
 
@@ -177,6 +177,9 @@ Official React and Vue 3 wrappers are available as separate packages in this mon
 
 ```bash
 npm install autumnnote autumnnote-react
+```
+
+```js
 import 'autumnnote/dist/autumnnote.css';
 ```
 
@@ -206,6 +209,9 @@ The `ref` is forwarded to the underlying `Context` instance via `useImperativeHa
 
 ```bash
 npm install autumnnote autumnnote-vue
+```
+
+```js
 import 'autumnnote/dist/autumnnote.css';
 ```
 
@@ -260,7 +266,6 @@ const editor = AutumnNote.create('#my-editor', {
 ```js
 const editor = AutumnNote.create('#my-editor', {
   useBootstrap: true,
-  bootstrapVersion: 5,
   toolbarButtonClass: 'btn btn-sm btn-light',
 });
 ```
@@ -296,7 +301,7 @@ const editor = AutumnNote.create('#my-editor', {
     fd.append('file', files[0]);
     fetch('/api/upload', { method: 'POST', body: fd })
       .then(r => r.json())
-      .then(({ url }) => editor.insertImage(url, files[0].name));
+      .then(({ url }) => editor.invoke('editor.insertImage', url, files[0].name));
   },
 });
 ```
@@ -384,7 +389,7 @@ editor.invoke('toolbar.rebuild'); // re-render toolbar with new buttons
 | `context.use(plugin, opts?)` | Install on this instance only. |
 | `context.getPlugin<T>(name)` | Returns the public API from `plugin.install()`. |
 
-See the [full Plugin API docs →](https://cmm-cmm.github.io/Autumn-Note/docs.html#plugin-api)
+See the [full Plugin API docs →](https://autumn.konexforge.com/docs.html#plugin-api)
 
 ---
 
@@ -462,7 +467,6 @@ See the [full Plugin API docs →](https://cmm-cmm.github.io/Autumn-Note/docs.ht
 | `toolbar` | `Array[]` | all buttons | Toolbar layout. See [Toolbar Customisation](#toolbar-customisation). |
 | `toolbarOverflow` | `string` | `'wrap'` | Toolbar overflow strategy: `'wrap'` or `'scroll'`. |
 | `useBootstrap` | `boolean` | `false` | Apply Bootstrap CSS classes to toolbar buttons. |
-| `bootstrapVersion` | `number` | `5` | Bootstrap major version (`4` or `5`). |
 | `toolbarButtonClass` | `string` | `'btn btn-sm btn-light'` | CSS classes for toolbar buttons when `useBootstrap` is `true`. |
 | `useFontAwesome` | `boolean` | `true` | Use FA icons when FontAwesome is detected on the page. |
 | `fontAwesomeClass` | `string` | `'fas'` | FA prefix: `'fas'` for FA 5, `'fa-solid'` for FA 6. |
@@ -479,7 +483,7 @@ See the [full Plugin API docs →](https://cmm-cmm.github.io/Autumn-Note/docs.ht
 | `fontFamilies` | `string[]` | 10 fonts | Font families available in the font-family dropdown. |
 | `stickyToolbar` | `boolean` | `false` | Pin the toolbar to the viewport top when the page is scrolled. |
 | `stickyToolbarOffset` | `number` | `0` | Top offset in pixels for the sticky toolbar (e.g. height of a fixed nav bar). |
-| `theme` | `string` | `'light'` | Colour theme: `'light'` or `'dark'`. |
+| `theme` | `string` | `'light'` | Colour theme: `'light'`, `'dark'`, or `'auto'` (follows system preference). |
 | `readOnly` | `boolean` | `false` | Start the editor in non-editable (read-only) mode with toolbar hidden. |
 | `spellcheck` | `boolean` | `true` | Enable browser spellcheck in the editable area. |
 | `direction` | `string` | `'ltr'` | Text direction: `'ltr'` or `'rtl'`. |
@@ -495,10 +499,12 @@ See the [full Plugin API docs →](https://cmm-cmm.github.io/Autumn-Note/docs.ht
 | `lang` | `string \| object` | `'en'` | UI display language. Built-in codes: `'en'`, `'vi'`, `'ja'`, `'zh'`, `'fr'`, `'de'`, `'es'`, `'ko'`. Pass a partial locale object for custom overrides. |
 | `markdownShortcuts` | `boolean` | `true` | Convert Markdown-style syntax typed in the editor to HTML in real time (block and inline rules). |
 | `bubbleToolbar` | `boolean` | `false` | Show a mini floating toolbar above the text selection for quick formatting. |
-| `bubbleToolbarItems` | `string[]` | `['bold','italic','underline','link','foreColor','removeFormat']` | Buttons shown in the bubble toolbar. Available names: `'bold'`, `'italic'`, `'underline'`, `'strikethrough'`, `'link'`, `'foreColor'`, `'removeFormat'`, `'inlineCode'`. |
+| `bubbleToolbarItems` | `string[]` | `['bold','italic','underline','link','foreColor','hiliteColor','removeFormat']` | Buttons shown in the bubble toolbar. Available names: `'bold'`, `'italic'`, `'underline'`, `'strikethrough'`, `'link'`, `'foreColor'`, `'hiliteColor'`, `'removeFormat'`, `'inlineCode'`. |
 | `autoSaveRestore` | `boolean` | `false` | When `autoSave` is also `true`, show a restore banner on load if a draft exists. |
 | `autoSaveRestoreTimeout` | `number` | `7` | Max draft age in days before it is auto-discarded. `0` = no expiry. |
 | `onAutoSaveRestore` | `Function` | `null` | `(html, context) => void` — called after the user restores a draft. |
+| `maxPasteSize` | `number` | `5242880` | Maximum paste payload size in bytes (default 5 MB). Pastes larger than this are silently dropped. |
+| `minImageSize` | `number` | `20` | Minimum image dimension in px during resize (width and height). |
 | `mention` | `object` | `null` | @mention configuration object. Set `mention.onSearch` to activate. See [Mentions](#mentions). |
 | `onChange` | `Function` | `null` | `(html: string) => void` — called on every content change. |
 | `onFocus` | `Function` | `null` | `(context) => void` — called when the editor gains focus. |

package/dist/autumnnote.css

@@ -356,12 +356,6 @@
   padding: 12px 14px;
   min-height: 0;
   outline: none;
-}
-.an-editable:focus-visible {
-  outline: 2px solid var(--an-focus-color, #3b82f6);
-  outline-offset: -2px;
-}
-.an-editable {
   line-height: 1.6;
   color: #111827;
   overflow-y: auto;

package/dist/autumnnote.es.js

@@ -1724,6 +1724,8 @@ var defaultOptions = {
 	autoSaveRestoreTimeout: 7,
 	onAutoSaveRestore: null,
 	markdownShortcuts: true,
+	maxPasteSize: 5 * 1024 * 1024,
+	minImageSize: 20,
 	bubbleToolbar: false,
 	bubbleToolbarItems: [
 		"bold",
@@ -7427,7 +7429,7 @@ var Clipboard = class {
 	_compressImage(file) {
 		const MAX_DIM = 1920;
 		const QUALITY = .85;
-		return new Promise((resolve) => {
+		return new Promise((resolve, reject) => {
 			const objectUrl = URL.createObjectURL(file);
 			const img = new Image();
 			img.onload = () => {
@@ -7447,6 +7449,7 @@ var Clipboard = class {
 				if (!ctx) {
 					const reader = new FileReader();
 					reader.onload = (e) => resolve(e.target.result);
+					reader.onerror = () => reject(/* @__PURE__ */ new Error("FileReader failed"));
 					reader.readAsDataURL(file);
 					return;
 				}
@@ -7458,6 +7461,7 @@ var Clipboard = class {
 				URL.revokeObjectURL(objectUrl);
 				const reader = new FileReader();
 				reader.onload = (e) => resolve(e.target.result);
+				reader.onerror = () => reject(/* @__PURE__ */ new Error("FileReader failed"));
 				reader.readAsDataURL(file);
 			};
 			img.src = objectUrl;
@@ -14179,7 +14183,7 @@ var defaultItems = [
 			};
 			if (typeof navigator.clipboard.read === "function") navigator.clipboard.read().then((items) => {
 				for (const item of items) if (item.types.includes("text/html")) {
-					item.getType("text/html").then((blob) => blob.text()).then((html) => doInsert(html, null));
+					item.getType("text/html").then((blob) => blob.text()).then((html) => doInsert(html, null)).catch(() => {});
 					return;
 				}
 				navigator.clipboard.readText().then((text) => doInsert(null, text)).catch(() => {});
@@ -15304,6 +15308,10 @@ function drawCropToCanvas(img, naturalRect, renderW, renderH) {
 			canvas.width = Math.round(renderW);
 			canvas.height = Math.round(renderH);
 			const ctx = canvas.getContext("2d");
+			if (!ctx) {
+				resolve(null);
+				return;
+			}
 			try {
 				ctx.drawImage(source, naturalRect.x, naturalRect.y, naturalRect.width, naturalRect.height, 0, 0, canvas.width, canvas.height);
 				ctx.getImageData(0, 0, 1, 1);
@@ -16563,6 +16571,7 @@ var Mention = class {
 			debounce: cfg.debounce ?? 200,
 			onSearch: cfg.onSearch,
 			onInsert: cfg.onInsert || null,
+			onError: cfg.onError || null,
 			mentionClass: cfg.mentionClass || "an-mention",
 			allowSpaces: cfg.allowSpaces || false
 		};
@@ -17491,7 +17500,7 @@ var AutumnNote = {
 	/** All pre-built button definitions — accessible in every module format including UMD/CJS. */
 	buttons,
 	/** Library version */
-	version: "1.8.0"
+	version: "1.8.3"
 };
 /**
 * @param {string|Element|NodeList|Element[]} selector