feat: add delete button to remove embed blocks, fix #72

- Add delete button with trash icon to embed card buttons
- Implement addDeleteButtonHandler to remove entire embed block from file
- Reorder buttons: delete, refresh, copy (left to right)
- Update CSS to include delete button styling
- Refactor build process to output directly to build/ directory
  - Modify esbuild.config.mjs to output to build/main.js
  - Auto-copy manifest.json and styles.css to build/
  - Remove copyBuild command and update publish scripts
- Bump version to 2.9.3

Closes #72

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: Seraphli

esbuild.config.mjs

@@ -1,6 +1,7 @@
 import esbuild from "esbuild";
 import process from "process";
-import builtins from 'builtin-modules'
+import builtins from 'builtin-modules';
+import { copyFileSync, mkdirSync } from 'fs';
 
 const banner =
 `/*
@@ -47,11 +48,19 @@ const buildOptions = {
 	logLevel: "info",
 	sourcemap: prod ? false : 'inline',
 	treeShaking: true,
-	outfile: 'main.js',
+	outfile: 'build/main.js',
 };
 
 if (prod) {
-	esbuild.build(buildOptions).catch(() => process.exit(1));
+	// Create build directory if it doesn't exist
+	mkdirSync('build', { recursive: true });
+
+	esbuild.build(buildOptions).then(() => {
+		// Copy additional files to build directory
+		copyFileSync('manifest.json', 'build/manifest.json');
+		copyFileSync('styles.css', 'build/styles.css');
+		console.log('✓ Build complete - files copied to build/');
+	}).catch(() => process.exit(1));
 } else {
 	esbuild.context(buildOptions).then(ctx => ctx.watch()).catch(() => process.exit(1));
 }

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "obsidian-link-embed",
 	"name": "Link Embed",
-	"version": "2.9.2",
+	"version": "2.9.3",
 	"minAppVersion": "0.12.0",
 	"description": "This plugin auto-fetches page metadata to embed Notion-style link preview cards.",
 	"author": "SErAphLi",

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "obsidian-link-embed",
-	"version": "2.9.2",
+	"version": "2.9.3",
 	"description": "This plugin auto-fetches page metadata to embed Notion-style link preview cards.",
 	"main": "main.js",
 	"scripts": {
@@ -10,9 +10,7 @@
 		"lint:fix": "eslint --fix \"src/**/*.{ts,js}\" \"*.{ts,js}\"",
 		"build": "npm run format && tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
 		"version": "node version-bump.mjs && git add manifest.json versions.json",
-		"copyBuild": "make-dir build && rimraf build/main.js build/manifest.json build/styles.css && cpy main.js manifest.json styles.css build/",
-		"prepublish": "npm run build && npm run copyBuild",
-		"publish": "npm run build && npm run version && npm run copyBuild",
+		"publish": "npm run build && npm run version",
 		"prepare": "husky"
 	},
 	"keywords": [],

src/constants.ts

@@ -11,6 +11,14 @@ aspectRatio: "{{aspectRatio}}"{{/aspectRatio}}{{#metadata}}
 export const HTMLTemplate = `<div class="embed">
   <div class="w _lc _sm _od _lh14 _ts">
     <div class="embed-buttons">
+      <div class="delete-button">
+        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <polyline points="3 6 5 6 21 6"></polyline>
+          <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
+          <line x1="10" y1="11" x2="10" y2="17"></line>
+          <line x1="14" y1="11" x2="14" y2="17"></line>
+        </svg>
+      </div>
       <div class="refresh-button">
         <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
           <path d="M21.5 2v6h-6M2.5 22v-6h6M2 11.5a10 10 0 0 1 18.8-4.3M22 12.5a10 10 0 0 1-18.8 4.2"/>

src/embedUtils.ts

@@ -484,6 +484,85 @@ export function addCopyButtonHandler(
 	}
 }
 
+/**
+ * Add a click handler for the delete button that removes the entire embed block from the file.
+ *
+ * @param element The HTML element containing the embed
+ * @param embedInfo Embed information (not used but kept for consistency)
+ * @param ctx Markdown post processor context
+ * @param vault The vault instance (needed to modify file content)
+ * @param settings Plugin settings
+ */
+export function addDeleteButtonHandler(
+	element: HTMLElement,
+	embedInfo: EmbedInfo,
+	ctx?: MarkdownPostProcessorContext,
+	vault?: any,
+	settings?: ObsidianLinkEmbedPluginSettings,
+): void {
+	const deleteButton = element.querySelector('.delete-button');
+	if (deleteButton) {
+		deleteButton.addEventListener('click', async () => {
+			try {
+				// Get the current file
+				const file = vault.getAbstractFileByPath(ctx.sourcePath);
+				if (!file) {
+					showNotice(`File not found: ${ctx.sourcePath}`, {
+						debug: settings.debug,
+						context: 'Link Embed - Delete',
+						type: 'error',
+					});
+					return;
+				}
+
+				// Get section info to locate the code block
+				const sectionInfo = ctx.getSectionInfo(element);
+				if (!sectionInfo) {
+					showNotice('Could not get section info', {
+						debug: settings.debug,
+						context: 'Link Embed - Delete',
+						type: 'error',
+					});
+					return;
+				}
+
+				// Get file content and remove the embed block
+				const content = await vault.read(file);
+				const lines = content.split('\n');
+				const startLine = sectionInfo.lineStart;
+				const endLine = sectionInfo.lineEnd + 1;
+
+				// Remove the embed block lines
+				const newLines = [
+					...lines.slice(0, startLine),
+					...lines.slice(endLine),
+				];
+				const newContent = newLines.join('\n');
+
+				// Write the modified content back to the file
+				await vault.modify(file, newContent);
+
+				showNotice('Embed block deleted', {
+					debug: settings?.debug || false,
+					context: 'Link Embed - Delete',
+					type: 'success',
+				});
+			} catch (error) {
+				showNotice(
+					error instanceof Error
+						? error
+						: `Error deleting embed block: ${String(error)}`,
+					{
+						debug: settings?.debug || false,
+						context: 'Link Embed - Delete',
+						type: 'error',
+					},
+				);
+			}
+		});
+	}
+}
+
 /**
  * Embed a URL into the editor.
  *

src/eventHandlers.ts

@@ -9,6 +9,7 @@ import {
 	renderEmbed,
 	addRefreshButtonHandler,
 	addCopyButtonHandler,
+	addDeleteButtonHandler,
 } from './embedUtils';
 import { showNotice } from './errorUtils';
 import { getImageDimensions } from './parsers';
@@ -277,6 +278,7 @@ export async function handleEmbedCodeBlock(
 	// Add handlers to the initial render
 	addRefreshButtonHandler(newEl, info, ctx, settings, vault);
 	addCopyButtonHandler(newEl, info, ctx, vault, settings);
+	addDeleteButtonHandler(newEl, info, ctx, vault, settings);
 
 	// If we have any promises, wait for all to complete then do final render
 	if (promises.length > 0) {
@@ -306,6 +308,13 @@ export async function handleEmbedCodeBlock(
 					vault,
 					settings,
 				);
+				addDeleteButtonHandler(
+					finalEl,
+					originalInfo,
+					ctx,
+					vault,
+					settings,
+				);
 
 				if (settings.debug) {
 					console.log(

styles.css

@@ -21,8 +21,9 @@
 }
 .w {
 	line-height: 1.4;
-	font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI',
-		Roboto, 'Helvetica Neue', Arial, sans-serif;
+	font-family:
+		-apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto,
+		'Helvetica Neue', Arial, sans-serif;
 	font-weight: 400;
 	font-size: 15px;
 	color: inherit;
@@ -213,8 +214,9 @@
 	}
 }
 ._ffsa {
-	font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI',
-		Roboto, 'Helvetica Neue', Arial, sans-serif;
+	font-family:
+		-apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto,
+		'Helvetica Neue', Arial, sans-serif;
 }
 ._fwn {
 	font-weight: 400;
@@ -347,7 +349,8 @@
 
 /* Button styling */
 .refresh-button,
-.copy-button {
+.copy-button,
+.delete-button {
 	cursor: pointer;
 }
 
@@ -358,6 +361,7 @@
 
 /* Full opacity when hovering over the buttons */
 .refresh-button:hover,
-.copy-button:hover {
+.copy-button:hover,
+.delete-button:hover {
 	opacity: 1 !important;
 }

versions.json

@@ -54,5 +54,6 @@
 	"2.8.6": "0.12.0",
 	"2.9.0": "0.12.0",
 	"2.9.1": "0.12.0",
-	"2.9.2": "0.12.0"
+	"2.9.2": "0.12.0",
+	"2.9.3": "0.12.0"
 }