@matdata/yasgui 5.13.0 → 5.15.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@matdata/yasgui",
   "description": "Yet Another SPARQL GUI",
-  "version": "5.13.0",
+  "version": "5.15.0",
   "main": "build/yasgui.min.js",
   "types": "build/ts/src/index.d.ts",
   "license": "MIT",

package/src/Tab.ts

@@ -17,6 +17,7 @@ import { saveManagedQuery } from "./queryManagement/saveManagedQuery";
 import { getWorkspaceBackend } from "./queryManagement/backends/getWorkspaceBackend";
 import { asWorkspaceBackendError } from "./queryManagement/backends/errors";
 import { normalizeQueryFilename } from "./queryManagement/normalizeQueryFilename";
+import { resolveEndpointUrl } from "./urlUtils";
 
 export interface PersistedJsonYasr extends YasrPersistentConfig {
   responseSummary: Parser.ResponseSummary;
@@ -304,7 +305,7 @@ export class Tab extends EventEmitter {
         name: result.name,
         filename: result.filename,
         queryText: this.getQueryTextForSave(),
-        associatedEndpoint: workspace.type === "sparql" ? this.getEndpoint() : undefined,
+        associatedEndpoint: workspace.type === "sparql" ? resolveEndpointUrl(this.getEndpoint()) : undefined,
         message: result.message,
         expectedVersionTag,
       });
@@ -1445,14 +1446,38 @@ export class Tab extends EventEmitter {
 
     // Check if token is a URI (not a variable)
     // URIs typically have token.type of 'string-2' or might be in angle brackets
-    const tokenString = token.string.trim();
+    let tokenString = token.string.trim();
 
     // Skip if it's a variable (starts with ? or $)
     if (tokenString.startsWith("?") || tokenString.startsWith("$")) return;
 
+    // Handle prefixed names that may be split into multiple tokens by the tokenizer
+    // The tokenizer splits "prefix:localname" into two tokens:
+    // - PNAME_LN_PREFIX (e.g., "bnd:") with type "string-2"
+    // - PNAME_LN_LOCAL (e.g., "_subnetwork_bane_KVGB") with type "string"
+    // We need to combine them to get the full prefixed name
+    if (token.type === "string-2" && tokenString.endsWith(":")) {
+      // This is a prefix token, get the next token for the local name
+      const nextToken = this.yasqe.getTokenAt({ line: pos.line, ch: token.end + 1 });
+      if (nextToken && nextToken.type === "string" && nextToken.start === token.end) {
+        tokenString = `${tokenString}${nextToken.string.trim()}`;
+      }
+    } else if (token.type === "string" && token.start > 0) {
+      // This might be a local name token, check if previous token is a prefix
+      const prevToken = this.yasqe.getTokenAt({ line: pos.line, ch: token.start - 1 });
+      if (
+        prevToken &&
+        prevToken.type === "string-2" &&
+        prevToken.string.trim().endsWith(":") &&
+        prevToken.end === token.start
+      ) {
+        tokenString = `${prevToken.string.trim()}${tokenString}`;
+      }
+    }
+
     // Check if it's a URI - either in angle brackets or a prefixed name
     const isFullUri = tokenString.startsWith("<") && tokenString.endsWith(">");
-    const isPrefixedName = /^[\w-]+:[\w-]+/.test(tokenString);
+    const isPrefixedName = /^[\w-]+:/.test(tokenString);
 
     if (!isFullUri && !isPrefixedName) return;
 
@@ -1467,7 +1492,8 @@ export class Tab extends EventEmitter {
     } else if (isPrefixedName) {
       // Expand prefixed name to full URI
       const prefixes = this.yasqe.getPrefixesFromQuery();
-      const [prefix, localName] = tokenString.split(":");
+      const [prefix, ...localParts] = tokenString.split(":");
+      const localName = localParts.join(":");
       const prefixUri = prefixes[prefix];
       if (prefixUri) {
         uri = prefixUri + localName;

package/src/TabSettingsModal.scss

@@ -290,6 +290,63 @@
   }
 }
 
+.keyValueContainer {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.keyValueRow {
+  display: grid;
+  grid-template-columns: 1fr 1fr auto;
+  gap: 8px;
+  align-items: center;
+
+  .keyInput,
+  .valueInput {
+    padding: 8px;
+    border: 1px solid var(--yasgui-input-border, #ccc);
+    border-radius: 4px;
+    font-size: 14px;
+    background-color: var(--yasgui-bg-secondary, white);
+    color: var(--yasgui-text-primary, #000);
+
+    &:focus {
+      outline: none;
+      border-color: var(--yasgui-input-focus, #337ab7);
+      box-shadow: 0 0 0 2px rgba(51, 122, 183, 0.1);
+    }
+
+    &::placeholder {
+      color: var(--yasgui-text-secondary, #999);
+    }
+  }
+
+  .removeButton {
+    padding: 6px 10px;
+    background-color: var(--yasgui-danger-color, #d9534f);
+    color: white;
+    border: none;
+    border-radius: 4px;
+    cursor: pointer;
+    font-size: 14px;
+    transition: background-color 0.2s;
+
+    &:hover {
+      background-color: var(--yasgui-danger-hover, #c9302c);
+    }
+
+    &:focus {
+      outline: none;
+      box-shadow: 0 0 0 2px rgba(217, 83, 79, 0.3);
+    }
+
+    i {
+      pointer-events: none;
+    }
+  }
+}
+
 .prefixTextarea {
   width: 100%;
   padding: 10px;

package/src/TabSettingsModal.ts

@@ -24,6 +24,9 @@ const AcceptHeaderGraphMap: { key: string; value: string }[] = [
   { key: "TSV", value: "text/tab-separated-values,*/*;q=0.9" },
 ];
 
+// Type for key-value pairs (headers, args, etc.)
+type KeyValuePair = { name: string; value: string };
+
 // Default API Key header name
 const DEFAULT_API_KEY_HEADER = "X-API-Key";
 
@@ -36,6 +39,7 @@ export default class TabSettingsModal {
   private prefixButton!: HTMLButtonElement;
   private prefixTextarea!: HTMLTextAreaElement;
   private autoCaptureCheckbox!: HTMLInputElement;
+  private mouseDownOnOverlay = false;
   private handleKeyDown = (e: KeyboardEvent) => {
     if (e.key !== "Escape") return;
     if (!this.modalOverlay.classList.contains("open")) return;
@@ -88,8 +92,21 @@ export default class TabSettingsModal {
     // Modal overlay
     this.modalOverlay = document.createElement("div");
     addClass(this.modalOverlay, "tabSettingsModalOverlay");
-    // Removed: this.modalOverlay.onclick = () => this.close();
-    // Users must explicitly click 'Save' or 'Cancel' to close the modal
+
+    // Track mousedown on overlay to distinguish from text selection that moves outside
+    this.modalOverlay.addEventListener("mousedown", (e) => {
+      if (e.target === this.modalOverlay) {
+        this.mouseDownOnOverlay = true;
+      }
+    });
+
+    // Only close if mousedown also happened on overlay (not during text selection)
+    this.modalOverlay.addEventListener("mouseup", (e) => {
+      if (e.target === this.modalOverlay && this.mouseDownOnOverlay) {
+        this.close();
+      }
+      this.mouseDownOnOverlay = false;
+    });
 
     // Modal content
     this.modalContent = document.createElement("div");
@@ -909,10 +926,27 @@ export default class TabSettingsModal {
     const config = this.tab.yasgui.persistentConfig.getEndpointConfig(endpoint);
     const existingAuth = config?.authentication;
 
+    // Track mousedown for proper modal close behavior
+    let mouseDownOnOverlay = false;
+
     // Create modal overlay
     const authModalOverlay = document.createElement("div");
     addClass(authModalOverlay, "authModalOverlay");
-    authModalOverlay.onclick = () => authModalOverlay.remove();
+
+    // Track mousedown on overlay to distinguish from text selection that moves outside
+    authModalOverlay.addEventListener("mousedown", (e) => {
+      if (e.target === authModalOverlay) {
+        mouseDownOnOverlay = true;
+      }
+    });
+
+    // Only close if mousedown also happened on overlay (not during text selection)
+    authModalOverlay.addEventListener("mouseup", (e) => {
+      if (e.target === authModalOverlay && mouseDownOnOverlay) {
+        authModalOverlay.remove();
+      }
+      mouseDownOnOverlay = false;
+    });
 
     // Create modal content
     const authModal = document.createElement("div");
@@ -1380,6 +1414,81 @@ export default class TabSettingsModal {
     acceptGraphSelect.setAttribute("data-config", "acceptHeaderGraph");
     acceptGraphSection.appendChild(acceptGraphSelect);
     container.appendChild(acceptGraphSection);
+
+    // Custom Headers section
+    const headersSection = this.createSection("Custom HTTP Headers");
+    const headersContainer = document.createElement("div");
+    addClass(headersContainer, "keyValueContainer");
+    headersContainer.setAttribute("data-config", "headers");
+
+    // Get existing headers
+    const existingHeaders = typeof reqConfig.headers === "function" ? {} : reqConfig.headers || {};
+    const headerPairs: KeyValuePair[] = Object.entries(existingHeaders).map(([name, value]) => ({
+      name,
+      value,
+    }));
+
+    // Draw existing headers
+    headerPairs.forEach((pair, index) => {
+      this.createKeyValueRow(headersContainer, pair, index);
+    });
+
+    // Add empty row for adding new headers
+    this.createKeyValueRow(headersContainer, { name: "", value: "" }, headerPairs.length);
+
+    headersSection.appendChild(headersContainer);
+    container.appendChild(headersSection);
+  }
+
+  private createKeyValueRow(container: HTMLElement, pair: KeyValuePair, index: number) {
+    const row = document.createElement("div");
+    addClass(row, "keyValueRow");
+
+    const nameInput = document.createElement("input");
+    nameInput.type = "text";
+    nameInput.placeholder = "Header Name";
+    nameInput.value = pair.name;
+    addClass(nameInput, "keyInput");
+
+    const valueInput = document.createElement("input");
+    valueInput.type = "text";
+    valueInput.placeholder = "Header Value";
+    valueInput.value = pair.value;
+    addClass(valueInput, "valueInput");
+
+    const removeButton = document.createElement("button");
+    removeButton.type = "button";
+    removeButton.innerHTML = '<i class="fas fa-times"></i>';
+    removeButton.title = "Remove header";
+    addClass(removeButton, "removeButton");
+
+    // Auto-add new empty row when typing in the last row
+    const onInput = () => {
+      const allRows = container.querySelectorAll(".keyValueRow");
+      const isLastRow = row === allRows[allRows.length - 1];
+
+      if (isLastRow && (nameInput.value.trim() || valueInput.value.trim())) {
+        // Add a new empty row
+        this.createKeyValueRow(container, { name: "", value: "" }, allRows.length);
+      }
+    };
+
+    nameInput.addEventListener("input", onInput);
+    valueInput.addEventListener("input", onInput);
+
+    removeButton.onclick = () => {
+      row.remove();
+      // Ensure there's always at least one empty row
+      const remainingRows = container.querySelectorAll(".keyValueRow");
+      if (remainingRows.length === 0) {
+        this.createKeyValueRow(container, { name: "", value: "" }, 0);
+      }
+    };
+
+    row.appendChild(nameInput);
+    row.appendChild(valueInput);
+    row.appendChild(removeButton);
+    container.appendChild(row);
   }
 
   private createSection(title: string): HTMLElement {
@@ -1438,6 +1547,7 @@ export default class TabSettingsModal {
   }
 
   public close() {
+    this.mouseDownOnOverlay = false;
     removeClass(this.modalOverlay, "open");
     document.removeEventListener("keydown", this.handleKeyDown);
   }
@@ -1546,6 +1656,22 @@ export default class TabSettingsModal {
           updates[config] = (select as HTMLSelectElement).value;
         }
       });
+
+      // Save custom headers
+      const headersContainer = requestContent.querySelector(".keyValueContainer[data-config='headers']");
+      if (headersContainer) {
+        const headers: { [key: string]: string } = {};
+        const rows = headersContainer.querySelectorAll(".keyValueRow");
+        rows.forEach((row) => {
+          const nameInput = row.querySelector(".keyInput") as HTMLInputElement;
+          const valueInput = row.querySelector(".valueInput") as HTMLInputElement;
+          if (nameInput && valueInput && nameInput.value.trim()) {
+            headers[nameInput.value.trim()] = valueInput.value;
+          }
+        });
+        updates.headers = headers;
+      }
+
       this.tab.setRequestConfig(updates);
     }
 

package/src/queryManagement/SaveManagedQueryModal.ts

@@ -45,6 +45,7 @@ export default class SaveManagedQueryModal {
   private filenameTouched = false;
   private folderPickerOpen = false;
   private folderBrowsePath = "";
+  private mouseDownOnOverlay = false;
 
   private resolve?: (value: SaveManagedQueryModalResult) => void;
   private reject?: (reason?: unknown) => void;
@@ -247,7 +248,22 @@ export default class SaveManagedQueryModal {
 
     this.overlayEl.appendChild(this.modalEl);
 
-    this.overlayEl.addEventListener("click", () => this.cancel());
+    // Track mousedown on overlay to distinguish from text selection that moves outside
+    this.overlayEl.addEventListener("mousedown", (e) => {
+      // Only mark as overlay mousedown if the target is the overlay itself (not modal content)
+      if (e.target === this.overlayEl) {
+        this.mouseDownOnOverlay = true;
+      }
+    });
+
+    // Only close if mousedown also happened on overlay (not during text selection)
+    this.overlayEl.addEventListener("mouseup", (e) => {
+      if (e.target === this.overlayEl && this.mouseDownOnOverlay) {
+        this.cancel();
+      }
+      this.mouseDownOnOverlay = false;
+    });
+
     document.addEventListener("keydown", (e) => {
       if (!this.isOpen()) return;
       if (e.key === "Escape") {
@@ -324,6 +340,7 @@ export default class SaveManagedQueryModal {
   }
 
   private cancel() {
+    this.mouseDownOnOverlay = false;
     this.close();
     this.overlayEl.remove();
     this.reject?.(new Error("cancelled"));
@@ -399,6 +416,7 @@ export default class SaveManagedQueryModal {
       }
     }
 
+    this.mouseDownOnOverlay = false;
     this.close();
     this.overlayEl.remove();
 
@@ -454,6 +472,7 @@ export default class SaveManagedQueryModal {
     this.folderBrowsePath = this.folderPathEl.value.trim();
     this.folderPickerErrorEl.textContent = "";
     this.folderPickerListEl.innerHTML = "";
+    this.mouseDownOnOverlay = false;
 
     document.body.appendChild(this.overlayEl);
     this.open();

package/src/queryManagement/WorkspaceSettingsForm.ts

@@ -27,6 +27,67 @@ export class WorkspaceSettingsForm {
     this.options = options;
   }
 
+  private async fetchExistingWorkspaces(endpoint: string): Promise<string[]> {
+    try {
+      const query = `
+PREFIX yasgui: <https://matdata.eu/ns/yasgui#>
+
+SELECT DISTINCT ?workspace WHERE {
+  ?workspace a yasgui:Workspace .
+}
+ORDER BY ?workspace`;
+
+      // Get authentication for this endpoint
+      const endpointConfig = this.options.persistentConfig.getEndpointConfig(endpoint);
+      const headers: Record<string, string> = {
+        "Content-Type": "application/x-www-form-urlencoded",
+        Accept: "application/sparql-results+json",
+      };
+
+      // Add authentication headers if configured
+      if (endpointConfig?.authentication) {
+        const auth = endpointConfig.authentication;
+        if (auth.type === "basic") {
+          const credentials = btoa(`${auth.username}:${auth.password}`);
+          headers["Authorization"] = `Basic ${credentials}`;
+        } else if (auth.type === "bearer") {
+          headers["Authorization"] = `Bearer ${auth.token}`;
+        } else if (auth.type === "apiKey") {
+          headers[auth.headerName] = auth.apiKey;
+        } else if (auth.type === "oauth2" && auth.accessToken) {
+          headers["Authorization"] = `Bearer ${auth.accessToken}`;
+        }
+      }
+
+      const response = await fetch(endpoint, {
+        method: "POST",
+        headers,
+        body: new URLSearchParams({ query }),
+      });
+
+      if (!response.ok) {
+        throw new Error(`HTTP ${response.status}`);
+      }
+
+      const data = await response.json();
+      const workspaces: string[] = [];
+
+      if (data.results?.bindings) {
+        for (const binding of data.results.bindings) {
+          const workspace = binding.workspace?.value;
+          if (workspace) {
+            workspaces.push(workspace);
+          }
+        }
+      }
+
+      return workspaces;
+    } catch (error) {
+      console.error("Failed to fetch existing workspaces:", error);
+      return [];
+    }
+  }
+
   public render() {
     this.container.innerHTML = "";
 
@@ -234,6 +295,9 @@ export class WorkspaceSettingsForm {
   }
 
   private openWorkspaceConfigModal(input: { mode: "add" } | { mode: "edit"; workspace: WorkspaceConfig }) {
+    // Track mousedown for proper modal close behavior
+    let mouseDownOnOverlay = false;
+
     const overlay = document.createElement("div");
     addClass(overlay, "tabSettingsModalOverlay", "workspaceConfigModalOverlay", "open");
 
@@ -242,6 +306,7 @@ export class WorkspaceSettingsForm {
     modal.onclick = (e) => e.stopPropagation();
 
     const close = () => {
+      mouseDownOnOverlay = false;
       overlay.remove();
       document.removeEventListener("keydown", onKeyDown);
     };
@@ -253,7 +318,20 @@ export class WorkspaceSettingsForm {
     };
     document.addEventListener("keydown", onKeyDown);
 
-    overlay.onclick = () => close();
+    // Track mousedown on overlay to distinguish from text selection that moves outside
+    overlay.addEventListener("mousedown", (e) => {
+      if (e.target === overlay) {
+        mouseDownOnOverlay = true;
+      }
+    });
+
+    // Only close if mousedown also happened on overlay (not during text selection)
+    overlay.addEventListener("mouseup", (e) => {
+      if (e.target === overlay && mouseDownOnOverlay) {
+        close();
+      }
+      mouseDownOnOverlay = false;
+    });
 
     const header = document.createElement("div");
     addClass(header, "modalHeader");
@@ -440,11 +518,133 @@ export class WorkspaceSettingsForm {
       sparqlHelp.textContent =
         "Tip: you can reuse an existing Workspace IRI to point to an already-populated workspace, or choose a new IRI to start a fresh workspace.";
 
-      const workspaceIriInput = document.createElement("input");
-      workspaceIriInput.type = "url";
-      workspaceIriInput.placeholder = "Workspace IRI";
-      workspaceIriInput.value = existing && existing.type === "sparql" ? existing.workspaceIri : "";
-      addClass(workspaceIriInput, "settingsInput");
+      // Workspace IRI selection (dropdown + custom input)
+      const workspaceIriSelect = document.createElement("select");
+      workspaceIriSelect.setAttribute("aria-label", "Workspace IRI");
+      addClass(workspaceIriSelect, "settingsSelect");
+
+      const loadingOption = document.createElement("option");
+      loadingOption.value = "";
+      loadingOption.textContent = "Select endpoint first";
+      workspaceIriSelect.appendChild(loadingOption);
+
+      const workspaceIriCustomInput = document.createElement("input");
+      workspaceIriCustomInput.type = "url";
+      workspaceIriCustomInput.placeholder =
+        "Enter new workspace IRI (e.g., https://example.org/workspace/my-workspace)";
+      workspaceIriCustomInput.style.display = "none";
+      workspaceIriCustomInput.style.marginTop = "5px";
+      addClass(workspaceIriCustomInput, "settingsInput");
+
+      if (existing && existing.type === "sparql") {
+        workspaceIriCustomInput.value = existing.workspaceIri;
+      }
+
+      // Function to populate workspace options
+      const populateWorkspaceOptions = async (endpoint: string) => {
+        // Clear existing options
+        workspaceIriSelect.innerHTML = "";
+
+        // Add loading option
+        const loading = document.createElement("option");
+        loading.value = "";
+        loading.textContent = "Loading workspaces...";
+        workspaceIriSelect.appendChild(loading);
+        workspaceIriSelect.disabled = true;
+
+        try {
+          const workspaces = await this.fetchExistingWorkspaces(endpoint);
+
+          workspaceIriSelect.innerHTML = "";
+          workspaceIriSelect.disabled = false;
+
+          if (workspaces.length > 0) {
+            const selectPlaceholder = document.createElement("option");
+            selectPlaceholder.value = "";
+            selectPlaceholder.textContent = "Select existing workspace";
+            workspaceIriSelect.appendChild(selectPlaceholder);
+
+            for (const workspace of workspaces) {
+              const option = document.createElement("option");
+              option.value = workspace;
+              option.textContent = workspace;
+              workspaceIriSelect.appendChild(option);
+            }
+          } else {
+            const noWorkspaces = document.createElement("option");
+            noWorkspaces.value = "";
+            noWorkspaces.textContent = "No existing workspaces found";
+            workspaceIriSelect.appendChild(noWorkspaces);
+          }
+
+          // Add custom option
+          const customOption = document.createElement("option");
+          customOption.value = "__custom__";
+          customOption.textContent = "➕ Enter new workspace IRI";
+          workspaceIriSelect.appendChild(customOption);
+
+          // Set current value if editing existing
+          if (existing && existing.type === "sparql") {
+            const existingIri = existing.workspaceIri;
+            const matchingOption = workspaces.find((w) => w === existingIri);
+            if (matchingOption) {
+              workspaceIriSelect.value = existingIri;
+            } else {
+              workspaceIriSelect.value = "__custom__";
+              workspaceIriCustomInput.style.display = "";
+              workspaceIriCustomInput.value = existingIri;
+            }
+          }
+        } catch (error) {
+          workspaceIriSelect.innerHTML = "";
+          workspaceIriSelect.disabled = false;
+
+          const errorOption = document.createElement("option");
+          errorOption.value = "";
+          errorOption.textContent = "Failed to load workspaces";
+          workspaceIriSelect.appendChild(errorOption);
+
+          const customOption = document.createElement("option");
+          customOption.value = "__custom__";
+          customOption.textContent = "➕ Enter new workspace IRI";
+          workspaceIriSelect.appendChild(customOption);
+        }
+      };
+
+      // Handle workspace selection change
+      workspaceIriSelect.onchange = () => {
+        if (workspaceIriSelect.value === "__custom__") {
+          workspaceIriCustomInput.style.display = "";
+          workspaceIriCustomInput.focus();
+        } else {
+          workspaceIriCustomInput.style.display = "none";
+        }
+      };
+
+      // Handle endpoint change
+      endpointSelect.onchange = () => {
+        const selectedEndpoint = endpointSelect.value.trim();
+        if (selectedEndpoint) {
+          void populateWorkspaceOptions(selectedEndpoint);
+        } else {
+          workspaceIriSelect.innerHTML = "";
+          const placeholder = document.createElement("option");
+          placeholder.value = "";
+          placeholder.textContent = "Select endpoint first";
+          workspaceIriSelect.appendChild(placeholder);
+        }
+      };
+
+      // Initial load if endpoint is already selected
+      const initialEndpoint = endpointSelect.value.trim();
+      if (initialEndpoint) {
+        void populateWorkspaceOptions(initialEndpoint);
+      }
+
+      // Wrapper for workspace IRI selection
+      const workspaceIriWrapper = document.createElement("div");
+      workspaceIriWrapper.appendChild(workspaceIriSelect);
+      workspaceIriWrapper.appendChild(workspaceIriCustomInput);
 
       const defaultGraphInput = document.createElement("input");
       defaultGraphInput.type = "url";
@@ -454,17 +654,24 @@ export class WorkspaceSettingsForm {
 
       dynamic.appendChild(this.wrapField("SPARQL endpoint", endpointSelect));
       dynamic.appendChild(sparqlHelp);
-      dynamic.appendChild(this.wrapField("Workspace IRI", workspaceIriInput));
+      dynamic.appendChild(this.wrapField("Workspace IRI", workspaceIriWrapper));
       dynamic.appendChild(this.wrapField("Default graph", defaultGraphInput));
 
       (dynamic as any).__getConfig = (): WorkspaceConfig => {
+        let workspaceIri = "";
+        if (workspaceIriSelect.value === "__custom__") {
+          workspaceIri = workspaceIriCustomInput.value.trim();
+        } else {
+          workspaceIri = workspaceIriSelect.value.trim();
+        }
+
         return {
           id: existing?.id || newWorkspaceId(),
           type: "sparql",
           label: labelInput.value.trim(),
           description: descriptionInput.value.trim() || undefined,
           endpoint: endpointSelect.value.trim(),
-          workspaceIri: workspaceIriInput.value.trim(),
+          workspaceIri,
           defaultGraph: defaultGraphInput.value.trim() || undefined,
         };
       };