We need a WYSIWYG copy method

media/editor/dataDisplay.tsx

@@ -11,6 +11,7 @@ import {
 	InspectorLocation,
 	MessageType,
 } from "../../shared/protocol";
+import { binarySearch } from "../../shared/util/binarySearch";
 import { Range } from "../../shared/util/range";
 import { PastePopup } from "./copyPaste";
 import _style from "./dataDisplay.css";
@@ -36,7 +37,6 @@ import {
 	parseHexDigit,
 	throwOnUndefinedAccessInDev,
 } from "./util";
-import { binarySearch } from "../../shared/util/binarySearch";
 
 const style = throwOnUndefinedAccessInDev(_style);
 
@@ -120,6 +120,7 @@ export const DataDisplay: React.FC = () => {
 	const columnWidth = useRecoilValue(select.columnWidth);
 	const dimensions = useRecoilValue(select.dimensions);
 	const fileSize = useRecoilValue(select.fileSize);
+	const copyType = useRecoilValue(select.copyType);
 	const allEditTimeline = useRecoilValue(select.allEditTimeline);
 	const unsavedEditIndex = useRecoilValue(select.unsavedEditIndex);
 	const ctx = useDisplayContext();
@@ -296,7 +297,7 @@ export const DataDisplay: React.FC = () => {
 			select.messageHandler.sendEvent({
 				type: MessageType.DoCopy,
 				selections: ctx.selection.map(r => [r.start, r.end]),
-				format: ctx.focusedElement.char ? CopyFormat.Utf8 : CopyFormat.Base64,
+				format: ctx.focusedElement.char ? CopyFormat.Utf8 : copyType,
 			});
 		}
 	});

media/editor/findWidget.tsx

@@ -13,11 +13,11 @@ import React, { useCallback, useEffect, useRef, useState } from "react";
 import { useRecoilState, useRecoilValue } from "recoil";
 import { HexDocumentEditOp, HexDocumentReplaceEdit } from "../../shared/hexDocumentModel";
 import {
-	LiteralSearchQuery,
-	MessageType,
-	SearchRequestMessage,
-	SearchResult,
-	SearchResultsWithProgress,
+    LiteralSearchQuery,
+    MessageType,
+    SearchRequestMessage,
+    SearchResult,
+    SearchResultsWithProgress,
 } from "../../shared/protocol";
 import { placeholder1 } from "../../shared/strings";
 import { Range } from "../../shared/util/range";
@@ -39,7 +39,7 @@ const resultCountFormat = new Intl.NumberFormat(undefined, { notation: "compact"
 const selectedFormat = new Intl.NumberFormat();
 
 /**
- * Parses a query like "AABB??DD" into a query looking for
+ * Parses a query like "AABB??DD" or "AA BB DD" into a query looking for
  * `[[170, 187], "*", [221]]`.
  */
 const parseHexStringWithPlaceholders = (str: string): LiteralSearchQuery | undefined => {
@@ -88,7 +88,11 @@ const getSearchQueryOrError = (
 	isBinaryMode: boolean,
 	isRegexp: boolean,
 ): SearchRequestMessage["query"] | string => {
+	const hexPattern = /^\s*([0-9a-fA-F?]{2}\s*)+$/;
 	if (isBinaryMode) {
+		if (hexPattern.test(query)) {
+			query = query.replace(/\s/g, "");
+		}
 		return parseHexStringWithPlaceholders(query) || strings.onlyHexCharsAndPlaceholders;
 	}
 

media/editor/state.ts

@@ -190,6 +190,11 @@ export const columnWidth = selector({
 	get: ({ get }) => get(editorSettings).columnWidth,
 });
 
+export const copyType = selector({
+	key: "copyType",
+	get: ({ get }) => get(editorSettings).copyType,
+});
+
 export const showDecodedText = selector({
 	key: "showDecodedText",
 	get: ({ get }) => get(editorSettings).showDecodedText,

package.json

@@ -20,6 +20,7 @@
     "Other"
   ],
   "icon": "icon.png",
+	"activationEvents": [],
   "main": "./dist/extension.js",
   "browser": "./dist/web/extension.js",
   "l10n": "./l10n",
@@ -71,6 +72,22 @@
             "maximum": 512,
             "description": "%hexeditor.columnWidth%"
           },
+          "hexeditor.copyType": {
+            "type": "string",
+            "enum": [
+              "Hex Octets",
+              "Hex",
+              "Literal",
+              "UTF-8",
+              "C",
+              "Go",
+              "Java",
+              "JSON",
+              "Base64"
+            ],
+            "default": "Hex Octets",
+            "description": "%hexeditor.copyType%"
+          },
           "hexeditor.showDecodedText": {
             "type": "boolean",
             "default": true,

package.nls.json

@@ -13,6 +13,7 @@
 	"hexEditor.goToOffset": "Go To Offset",
 	"hexEditor.selectBetweenOffsets": "Select Between Offsets",
 	"hexEditor.copyAs": "Copy As...",
+	"hexeditor.copyType": "Sets the default format in which bytes are copied",
 	"hexEditor.switchEditMode": "Switch Edit Mode",
 	"hexEditor.copyOffsetAsDec": "Copy Offset as Decimal",
 	"hexEditor.copyOffsetAsHex": "Copy Offset as Hex",

shared/protocol.ts

@@ -59,6 +59,7 @@ export const enum InspectorLocation {
 }
 
 export interface IEditorSettings {
+	copyType: CopyFormat;
 	showDecodedText: boolean;
 	columnWidth: number;
 	inspectorType: InspectorLocation;
@@ -179,6 +180,7 @@ export interface DeleteAcceptedMessage {
 }
 
 export const enum CopyFormat {
+	HexOctets = "Hex Octets",
 	Hex = "Hex",
 	Literal = "Literal",
 	Utf8 = "UTF-8",

src/copyAs.ts

@@ -8,6 +8,7 @@ interface QuickPickCopyFormat extends vscode.QuickPickItem {
 
 export const copyAsFormats: { [K in CopyFormat]: (buffer: Uint8Array, filename: string) => void } =
 	{
+		[CopyFormat.HexOctets]: copyAsHexOctets,
 		[CopyFormat.Hex]: copyAsHex,
 		[CopyFormat.Literal]: copyAsLiteral,
 		[CopyFormat.Utf8]: copyAsText,
@@ -20,6 +21,7 @@ export const copyAsFormats: { [K in CopyFormat]: (buffer: Uint8Array, filename:
 
 export const copyAs = async (messaging: ExtensionHostMessageHandler): Promise<void> => {
 	const formats: QuickPickCopyFormat[] = [
+		{ label: CopyFormat.HexOctets },
 		{ label: CopyFormat.Hex },
 		{ label: CopyFormat.Literal },
 		{ label: CopyFormat.Utf8 },
@@ -28,10 +30,14 @@ export const copyAs = async (messaging: ExtensionHostMessageHandler): Promise<vo
 		{ label: CopyFormat.Java },
 		{ label: CopyFormat.JSON },
 		{ label: CopyFormat.Base64 },
+		{ label: "Configure HexEditor: Copy Type" as CopyFormat }
 	];
 
 	vscode.window.showQuickPick(formats).then(format => {
-		if (format) {
+		if (format?.label == formats.at(-1)?.label) {
+			vscode.commands.executeCommand('workbench.action.openSettings2', { query: '@id:hexeditor.copyType' });
+		}
+		else if (format) {
 			messaging.sendEvent({ type: MessageType.TriggerCopyAs, format: format["label"] });
 		}
 	});
@@ -41,6 +47,11 @@ export function copyAsText(buffer: Uint8Array) {
 	vscode.env.clipboard.writeText(new TextDecoder().decode(buffer));
 }
 
+export function copyAsHexOctets(buffer: Uint8Array) {
+	const hexString = Array.from(buffer, (b) => b.toString(16).toUpperCase().padStart(2, "0")).join(" ")
+	vscode.env.clipboard.writeText(hexString)
+}
+
 export function copyAsHex(buffer: Uint8Array) {
 	const hexString = Array.from(buffer, b => b.toString(16).padStart(2, "0")).join("");
 	vscode.env.clipboard.writeText(hexString);

src/hexEditorProvider.ts

@@ -9,6 +9,7 @@ import {
 	HexDocumentEditReference,
 } from "../shared/hexDocumentModel";
 import {
+	CopyFormat,
 	Endianness,
 	ExtensionHostMessageHandler,
 	FromWebviewMessage,
@@ -32,6 +33,7 @@ import { flattenBuffers, getBaseName, getCorrectArrayBuffer, randomString } from
 
 const defaultEditorSettings: Readonly<IEditorSettings> = {
 	columnWidth: 16,
+	copyType: CopyFormat.HexOctets,
 	showDecodedText: true,
 	defaultEndianness: Endianness.Little,
 	inspectorType: InspectorLocation.Aside,