shadow-claw 1.26.0 → 1.27.0

package/dist/lib/{shadow-claw-mcp-remote-CYmhpg7a.js.map → shadow-claw-mcp-remote-CT5Q-54E.js.map}

@@ -1 +1 @@
-{"version":3,"file":"shadow-claw-mcp-remote-CYmhpg7a.js","names":["shadowClawMcpRemoteStyles","shadowClawMcpRemoteTemplate"],"sources":["../../src/components/settings/shadow-claw-mcp-remote/shadow-claw-mcp-remote.ts"],"sourcesContent":["import { CONFIG_KEYS } from \"../../../config/config.js\";\nimport { getDb, type ShadowClawDatabase } from \"../../../db/db.js\";\nimport { getConfig } from \"../../../db/getConfig.js\";\nimport { encryptValue } from \"../../../security/crypto.js\";\n\nimport { reconnectMcpOAuth } from \"../../../subsystems/mcp/mcp-reconnect.js\";\nimport { testRemoteMcpConnection } from \"../../../subsystems/mcp/remote-mcp-client.js\";\n\nimport {\n  bindRemoteMcpCredentialRef,\n  deleteRemoteMcpConnection,\n  listRemoteMcpConnections,\n  upsertRemoteMcpConnection,\n} from \"../../../subsystems/mcp/mcp-connections.js\";\n\nimport { setSanitizedHtml } from \"../../../security/trusted-types.js\";\nimport { showError, showSuccess } from \"../../../ui/toast.js\";\nimport { escapeHtml } from \"../../../utils/utils.js\";\n\nimport { GitAccount } from \"../../../subsystems/git/types.js\";\n\nimport type { ServiceAccount } from \"../../../subsystems/accounts/service-accounts.js\";\nimport type { McpConnectionTestResult } from \"../../../subsystems/mcp/remote-mcp-client.js\";\n\nimport type {\n  RemoteMcpConnectionRecord,\n  RemoteMcpCredentialRef,\n  RemoteMcpTransport,\n} from \"../../../subsystems/mcp/mcp-connections.js\";\n\nimport ShadowClawElement from \"../../shadow-claw-element.js\";\n\nimport \"../../common/shadow-claw-actions/shadow-claw-actions.js\";\nimport \"../../common/shadow-claw-card/shadow-claw-card.js\";\nimport \"../../common/shadow-claw-empty-state/shadow-claw-empty-state.js\";\nimport shadowClawMcpRemoteStyles from \"./shadow-claw-mcp-remote.css\" with { type: \"css\" };\nimport shadowClawMcpRemoteTemplate from \"./shadow-claw-mcp-remote.html\" with { type: \"html\" };\n\nconst elementName = \"shadow-claw-mcp-remote\";\n\ntype AuthSelection =\n  | \"none\"\n  | \"service_pat\"\n  | \"service_oauth\"\n  | \"git_pat\"\n  | \"git_oauth\"\n  | \"custom_header\";\n\nexport class ShadowClawMcpRemote extends ShadowClawElement {\n  static styles = shadowClawMcpRemoteStyles;\n  static template = shadowClawMcpRemoteTemplate;\n\n  connections: RemoteMcpConnectionRecord[] = [];\n  db: ShadowClawDatabase | null = null;\n  editingConnectionId: string | null = null;\n  gitAccounts: GitAccount[] = [];\n  serviceAccounts: ServiceAccount[] = [];\n\n  constructor() {\n    super();\n  }\n\n  async connectedCallback() {\n    const root = this.shadowRoot;\n    if (!root) {\n      throw new Error(\"shadowRoot not found\");\n    }\n\n    this.db = await getDb();\n    await this.render();\n    this.bindEventListeners();\n  }\n\n  bindEventListeners() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    root\n      .querySelector('[data-action=\"add-connection\"]')\n      ?.addEventListener(\"click\", () => this.showConnectionForm(\"new\"));\n\n    root\n      .querySelector('[data-region=\"connection-list\"]')\n      ?.addEventListener(\"settings-action\", (event) => {\n        const detail = (event as CustomEvent<{ action: string; id: string }>)\n          .detail;\n        const { action, id } = detail || { action: \"\", id: \"\" };\n\n        if (!id) {\n          return;\n        }\n\n        if (action === \"edit-connection\") {\n          this.showConnectionForm(id);\n        } else if (action === \"delete-connection\") {\n          void this.deleteConnection(id);\n        } else if (action === \"test-connection\") {\n          void this.testConnection(id);\n        }\n      });\n\n    root\n      .querySelector('[data-region=\"connection-list\"]')\n      ?.addEventListener(\"click\", (event) => {\n        const target = event.target;\n        if (!(target instanceof HTMLButtonElement)) {\n          return;\n        }\n\n        const connectionId = target.dataset.reconnectConnection;\n        if (connectionId) {\n          void this.reconnectOAuth(connectionId);\n        }\n      });\n  }\n\n  describeCredentialRef(ref: RemoteMcpCredentialRef | null): string {\n    if (!ref || ref.authType === \"none\") {\n      return \"No auth\";\n    }\n\n    if (ref.authType === \"custom_header\") {\n      return `Custom header${ref.headerName ? ` (${ref.headerName})` : \"\"}`;\n    }\n\n    if (ref.accountId) {\n      return `Service account (${ref.authType.toUpperCase()})`;\n    }\n\n    if (ref.gitAccountId) {\n      return `Git account (${ref.authType.toUpperCase()})`;\n    }\n\n    return ref.authType.toUpperCase();\n  }\n\n  getAuthSelectionFromCredentialRef(\n    ref: RemoteMcpCredentialRef | null,\n  ): AuthSelection {\n    if (!ref || ref.authType === \"none\") {\n      return \"none\";\n    }\n\n    if (ref.authType === \"custom_header\") {\n      return \"custom_header\";\n    }\n\n    if (ref.accountId) {\n      return ref.authType === \"oauth\" ? \"service_oauth\" : \"service_pat\";\n    }\n\n    if (ref.gitAccountId) {\n      return ref.authType === \"oauth\" ? \"git_oauth\" : \"git_pat\";\n    }\n\n    return \"none\";\n  }\n\n  hideConnectionForm() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const slot = root.querySelector('[data-region=\"connection-form-slot\"]');\n    if (slot) {\n      slot.replaceChildren();\n    }\n\n    this.editingConnectionId = null;\n  }\n\n  isOAuthConnection(connection: RemoteMcpConnectionRecord): boolean {\n    const ref = connection.credentialRef;\n    if (!ref) {\n      return false;\n    }\n\n    return ref.authType === \"oauth\" && !!(ref.accountId || ref.gitAccountId);\n  }\n\n  renderConnectionList() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const listEl = root.querySelector('[data-region=\"connection-list\"]');\n    if (!listEl) {\n      return;\n    }\n\n    listEl.replaceChildren();\n\n    if (this.connections.length === 0) {\n      const emptyState = document.createElement(\"shadow-claw-empty-state\");\n      emptyState.setAttribute(\n        \"message\",\n        \"No remote MCP connections configured.\",\n      );\n      emptyState.setAttribute(\n        \"hint\",\n        \"Click '+ Add Remote MCP Connection' to get started.\",\n      );\n      listEl.append(emptyState);\n\n      return;\n    }\n\n    const fragment = document.createDocumentFragment();\n\n    this.connections.forEach((connection) => {\n      const authLabel = this.describeCredentialRef(connection.credentialRef);\n      const enabledLabel = connection.enabled ? \"Enabled\" : \"Disabled\";\n      const cardMeta = `${connection.serverUrl} · ${connection.transport} · ${authLabel}`;\n\n      const card = document.createElement(\"shadow-claw-card\");\n      card.setAttribute(\"data-connection-id\", connection.id);\n      card.setAttribute(\"label\", connection.label);\n      card.setAttribute(\"meta\", cardMeta);\n      card.setAttribute(\"badge\", enabledLabel);\n      if (!connection.enabled) {\n        card.setAttribute(\"muted\", \"\");\n      }\n\n      const actions = document.createElement(\"shadow-claw-actions\");\n      actions.setAttribute(\"slot\", \"actions\");\n      actions.setAttribute(\"kind\", \"connection\");\n      actions.setAttribute(\"item-id\", connection.id);\n\n      card.append(actions);\n\n      const isOAuth = this.isOAuthConnection(connection);\n      if (isOAuth) {\n        const reconnectBtn = document.createElement(\"button\");\n        reconnectBtn.className = \"reconnect-btn\";\n        reconnectBtn.textContent = \"🔑 Reconnect OAuth\";\n        reconnectBtn.setAttribute(\"data-reconnect-connection\", connection.id);\n        card.append(reconnectBtn);\n      }\n\n      fragment.append(card);\n    });\n\n    listEl.append(fragment);\n  }\n\n  renderDiagnostic(container: HTMLElement, result: McpConnectionTestResult) {\n    const stepsHtml = result.steps\n      .map((step) => {\n        const icon =\n          step.status === \"ok\"\n            ? \"\\u2713\"\n            : step.status === \"error\"\n              ? \"\\u2717\"\n              : \"\\u2014\";\n        const cls = `diagnostic-step diagnostic-${step.status}`;\n\n        return `\n          <div class=\"${cls}\">\n            <span class=\"diagnostic-icon\">${icon}</span>\n            <span class=\"diagnostic-label\">${escapeHtml(step.step)}</span>\n            ${step.detail ? `<span class=\"diagnostic-detail\">${escapeHtml(step.detail)}</span>` : \"\"}\n          </div>`;\n      })\n      .join(\"\");\n\n    const toolsHtml =\n      result.success && result.toolNames.length > 0\n        ? `<details class=\"diagnostic-tools\"><summary>${result.toolCount} tool${result.toolCount === 1 ? \"\" : \"s\"} available</summary><ul>${result.toolNames.map((n) => `<li>${escapeHtml(n)}</li>`).join(\"\")}</ul></details>`\n        : \"\";\n\n    setSanitizedHtml(\n      container,\n      `\n      <div class=\"diagnostic-header diagnostic-${result.success ? \"ok\" : \"error\"}\">\n        ${result.success ? \"\\u2713 Connection OK\" : \"\\u2717 Connection Failed\"}\n        <button class=\"diagnostic-close\" data-action=\"close-diagnostic\" title=\"Dismiss\">\\u00d7</button>\n      </div>\n      <div class=\"diagnostic-steps\">${stepsHtml}</div>\n      ${toolsHtml}\n      `,\n    );\n\n    container\n      .querySelector('[data-action=\"close-diagnostic\"]')\n      ?.addEventListener(\"click\", () => container.remove());\n  }\n\n  renderGitAccountOptions(selectedId?: string): string {\n    if (this.gitAccounts.length === 0) {\n      return '<option value=\"\">No git accounts configured</option>';\n    }\n\n    return this.gitAccounts\n      .map((account) => {\n        const selected = account.id === selectedId ? \" selected\" : \"\";\n\n        return `<option value=\"${account.id}\"${selected}>${escapeHtml(account.label)} · ${escapeHtml(account.hostPattern)}</option>`;\n      })\n      .join(\"\");\n  }\n\n  renderServiceAccountOptions(selectedId?: string): string {\n    if (this.serviceAccounts.length === 0) {\n      return '<option value=\"\">No service accounts configured</option>';\n    }\n\n    return this.serviceAccounts\n      .map((account) => {\n        const selected = account.id === selectedId ? \" selected\" : \"\";\n\n        return `<option value=\"${account.id}\"${selected}>${escapeHtml(account.label)} · ${escapeHtml(account.hostPattern)}</option>`;\n      })\n      .join(\"\");\n  }\n\n  showConnectionForm(connectionId: string) {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    this.editingConnectionId = connectionId;\n    const isNew = connectionId === \"new\";\n    const existing = isNew\n      ? null\n      : this.connections.find((item) => item.id === connectionId) || null;\n\n    const transport = existing?.transport || \"streamable_http\";\n    const authSelection = this.getAuthSelectionFromCredentialRef(\n      existing?.credentialRef || null,\n    );\n\n    const slot = root.querySelector('[data-region=\"connection-form-slot\"]');\n    if (!slot) {\n      return;\n    }\n\n    setSanitizedHtml(\n      slot,\n      `\n      <div class=\"connection-form\">\n        <h4>${isNew ? \"Add Remote MCP Connection\" : \"Edit Remote MCP Connection\"}</h4>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Connection Label</label>\n          <input\n            type=\"text\"\n            class=\"form-input\"\n            data-field=\"connection-label\"\n            placeholder=\"e.g. Figma MCP, Jira MCP\"\n            value=\"${escapeHtml(existing?.label || \"\")}\"\n          />\n        </div>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Server URL</label>\n          <input\n            type=\"text\"\n            class=\"form-input\"\n            data-field=\"connection-url\"\n            placeholder=\"https://mcp.example.com/rpc\"\n            value=\"${escapeHtml(existing?.serverUrl || \"\")}\"\n          />\n          <div class=\"form-helper\">Must be an absolute http(s) URL.</div>\n        </div>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Transport</label>\n          <select class=\"form-input\" data-field=\"connection-transport\">\n            <option value=\"streamable_http\"${transport === \"streamable_http\" ? \" selected\" : \"\"}>streamable_http</option>\n            <option value=\"sse\"${transport === \"sse\" ? \" selected\" : \"\"}>sse</option>\n            <option value=\"websocket\"${transport === \"websocket\" ? \" selected\" : \"\"}>websocket</option>\n          </select>\n          <div class=\"form-helper\">\n            Current runtime support is streamable_http. Other transports can be saved for future support.\n          </div>\n        </div>\n\n        <div class=\"form-group connection-form-row\">\n          <input type=\"checkbox\" data-field=\"connection-enabled\"${existing?.enabled === false ? \"\" : \" checked\"} />\n          <label class=\"form-label\">Enabled</label>\n        </div>\n\n        <div class=\"form-group connection-form-row\" data-region=\"auto-reconnect-region\">\n          <input type=\"checkbox\" data-field=\"connection-auto-reconnect\"${existing?.autoReconnectOAuth ? \" checked\" : \"\"} />\n          <label class=\"form-label\">Auto-reconnect OAuth on 401</label>\n          <div class=\"form-helper\" style=\"margin-left: 0.25rem;\">When enabled, a 401 error will automatically open the OAuth popup to re-authenticate.</div>\n        </div>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Authentication</label>\n          <select class=\"form-input\" data-field=\"auth-selection\">\n            <option value=\"none\"${authSelection === \"none\" ? \" selected\" : \"\"}>None</option>\n            <option value=\"service_pat\"${authSelection === \"service_pat\" ? \" selected\" : \"\"}>Service Account (PAT)</option>\n            <option value=\"service_oauth\"${authSelection === \"service_oauth\" ? \" selected\" : \"\"}>Service Account (OAuth)</option>\n            <option value=\"git_pat\"${authSelection === \"git_pat\" ? \" selected\" : \"\"}>Git Account (PAT)</option>\n            <option value=\"git_oauth\"${authSelection === \"git_oauth\" ? \" selected\" : \"\"}>Git Account (OAuth)</option>\n            <option value=\"custom_header\"${authSelection === \"custom_header\" ? \" selected\" : \"\"}>Custom Header</option>\n          </select>\n        </div>\n\n        <div class=\"form-group\" data-region=\"service-account-region\">\n          <label class=\"form-label\">Service Account</label>\n          <select class=\"form-input\" data-field=\"service-account-id\">\n            ${this.renderServiceAccountOptions(existing?.credentialRef?.accountId)}\n          </select>\n        </div>\n\n        <div class=\"form-group\" data-region=\"git-account-region\">\n          <label class=\"form-label\">Git Account</label>\n          <select class=\"form-input\" data-field=\"git-account-id\">\n            ${this.renderGitAccountOptions(existing?.credentialRef?.gitAccountId)}\n          </select>\n        </div>\n\n        <div data-region=\"custom-header-region\">\n          <div class=\"form-group\">\n            <label class=\"form-label\">Header Name</label>\n            <input\n              type=\"text\"\n              class=\"form-input\"\n              data-field=\"custom-header-name\"\n              placeholder=\"e.g. Authorization or X-API-Key\"\n              value=\"${escapeHtml(existing?.credentialRef?.headerName || \"\")}\"\n            />\n          </div>\n\n          <div class=\"form-group\">\n            <label class=\"form-label\">Header Value</label>\n            <input\n              type=\"password\"\n              class=\"form-input\"\n              data-field=\"custom-header-value\"\n              placeholder=\"${existing?.credentialRef?.authType === \"custom_header\" ? \"•••••••••••• (Saved)\" : \"Enter secret value\"}\"\n            />\n            <div class=\"auth-note\">Stored encrypted locally. Leave blank to keep existing value.</div>\n          </div>\n        </div>\n\n        <div class=\"connection-form-actions\">\n          <button class=\"confirm-btn\" data-action=\"save-connection\">\n            ${isNew ? \"Add Connection\" : \"Update Connection\"}\n          </button>\n          <button class=\"cancel-btn\" data-action=\"cancel-connection-form\">Cancel</button>\n        </div>\n      </div>\n    `,\n    );\n\n    slot\n      .querySelector('[data-action=\"save-connection\"]')\n      ?.addEventListener(\"click\", () => void this.saveConnectionForm());\n    slot\n      .querySelector('[data-action=\"cancel-connection-form\"]')\n      ?.addEventListener(\"click\", () => this.hideConnectionForm());\n    slot\n      .querySelector('[data-field=\"auth-selection\"]')\n      ?.addEventListener(\"change\", () => this.updateAuthFieldsVisibility(slot));\n\n    this.updateAuthFieldsVisibility(slot);\n  }\n\n  updateAuthFieldsVisibility(slot: Element) {\n    const authSelection = (\n      slot.querySelector('[data-field=\"auth-selection\"]') as HTMLSelectElement\n    )?.value as AuthSelection;\n\n    const serviceRegion = slot.querySelector(\n      '[data-region=\"service-account-region\"]',\n    );\n\n    const gitRegion = slot.querySelector('[data-region=\"git-account-region\"]');\n    const customHeaderRegion = slot.querySelector(\n      '[data-region=\"custom-header-region\"]',\n    );\n\n    const autoReconnectRegion = slot.querySelector(\n      '[data-region=\"auto-reconnect-region\"]',\n    );\n\n    const showService =\n      authSelection === \"service_pat\" || authSelection === \"service_oauth\";\n    const showGit =\n      authSelection === \"git_pat\" || authSelection === \"git_oauth\";\n    const showCustom = authSelection === \"custom_header\";\n    const showAutoReconnect =\n      authSelection === \"service_oauth\" || authSelection === \"git_oauth\";\n\n    if (serviceRegion instanceof HTMLElement) {\n      serviceRegion.style.display = showService ? \"block\" : \"none\";\n    }\n\n    if (gitRegion instanceof HTMLElement) {\n      gitRegion.style.display = showGit ? \"block\" : \"none\";\n    }\n\n    if (customHeaderRegion instanceof HTMLElement) {\n      customHeaderRegion.style.display = showCustom ? \"block\" : \"none\";\n    }\n\n    if (autoReconnectRegion instanceof HTMLElement) {\n      autoReconnectRegion.style.display = showAutoReconnect ? \"flex\" : \"none\";\n    }\n  }\n\n  async buildCredentialRef(\n    slot: Element,\n    authSelection: AuthSelection,\n    existing: RemoteMcpConnectionRecord | null,\n  ): Promise<RemoteMcpCredentialRef | null> {\n    if (authSelection === \"none\") {\n      return null;\n    }\n\n    if (authSelection === \"service_pat\" || authSelection === \"service_oauth\") {\n      const accountId = (\n        slot.querySelector(\n          '[data-field=\"service-account-id\"]',\n        ) as HTMLSelectElement\n      )?.value;\n      if (!accountId) {\n        throw new Error(\n          \"Select a service account for this authentication mode.\",\n        );\n      }\n\n      return {\n        serviceType: \"mcp_remote\",\n        authType: authSelection === \"service_oauth\" ? \"oauth\" : \"token\",\n        providerId: \"custom_mcp\",\n        accountId,\n      };\n    }\n\n    if (authSelection === \"git_pat\" || authSelection === \"git_oauth\") {\n      const gitAccountId = (\n        slot.querySelector('[data-field=\"git-account-id\"]') as HTMLSelectElement\n      )?.value;\n      if (!gitAccountId) {\n        throw new Error(\"Select a git account for this authentication mode.\");\n      }\n\n      return {\n        serviceType: \"mcp_remote\",\n        authType: authSelection === \"git_oauth\" ? \"oauth\" : \"token\",\n        providerId: \"custom_mcp\",\n        gitAccountId,\n      };\n    }\n\n    const headerName = (\n      slot.querySelector(\n        '[data-field=\"custom-header-name\"]',\n      ) as HTMLInputElement\n    )?.value.trim();\n    const headerValueRaw = (\n      slot.querySelector(\n        '[data-field=\"custom-header-value\"]',\n      ) as HTMLInputElement\n    )?.value.trim();\n\n    if (!headerName) {\n      throw new Error(\n        \"Header name is required for custom header authentication.\",\n      );\n    }\n\n    let encryptedValue: string | undefined;\n    if (headerValueRaw) {\n      encryptedValue = (await encryptValue(headerValueRaw)) || undefined;\n    }\n\n    if (!encryptedValue) {\n      if (\n        existing?.credentialRef?.authType === \"custom_header\" &&\n        existing.credentialRef.encryptedValue\n      ) {\n        encryptedValue = existing.credentialRef.encryptedValue;\n      } else {\n        throw new Error(\n          \"Header value is required for custom header authentication.\",\n        );\n      }\n    }\n\n    return {\n      serviceType: \"mcp_remote\",\n      authType: \"custom_header\",\n      providerId: \"custom_mcp\",\n      headerName,\n      encryptedValue,\n    };\n  }\n\n  async deleteConnection(connectionId: string) {\n    if (!this.db) {\n      return;\n    }\n\n    try {\n      const deleted = await deleteRemoteMcpConnection(this.db, connectionId);\n      if (!deleted) {\n        showError(\"Remote MCP connection not found.\", 4000);\n\n        return;\n      }\n\n      await this.render();\n      if (this.editingConnectionId === connectionId) {\n        this.hideConnectionForm();\n      }\n\n      showSuccess(\"Remote MCP connection deleted\", 3000);\n    } catch (err) {\n      const message = err instanceof Error ? err.message : String(err);\n      showError(`Failed to delete remote MCP connection: ${message}`, 6000);\n    }\n  }\n\n  async reconnectOAuth(connectionId: string) {\n    if (!this.db) {\n      return;\n    }\n\n    const connection = this.connections.find(\n      (item) => item.id === connectionId,\n    );\n\n    const label = connection?.label || connectionId;\n\n    const result = await reconnectMcpOAuth(this.db, connectionId);\n\n    if (result.success) {\n      showSuccess(`OAuth reconnected for \"${label}\"`, 4000);\n    } else {\n      showError(`OAuth reconnect failed: ${result.error}`, 6000);\n    }\n  }\n\n  async render() {\n    const root = this.shadowRoot;\n    if (!root || !this.db) {\n      return;\n    }\n\n    try {\n      this.connections = await listRemoteMcpConnections(this.db);\n      const serviceRaw = await getConfig(this.db, CONFIG_KEYS.SERVICE_ACCOUNTS);\n      this.serviceAccounts = Array.isArray(serviceRaw) ? serviceRaw : [];\n      const gitRaw = await getConfig(this.db, CONFIG_KEYS.GIT_ACCOUNTS);\n      this.gitAccounts = Array.isArray(gitRaw) ? gitRaw : [];\n\n      this.renderConnectionList();\n    } catch (err) {\n      console.warn(\"Could not load remote MCP connections:\", err);\n    }\n  }\n\n  async saveConnectionForm() {\n    if (!this.db) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const slot = root.querySelector('[data-region=\"connection-form-slot\"]');\n    if (!slot) {\n      return;\n    }\n\n    const label = (\n      slot.querySelector('[data-field=\"connection-label\"]') as HTMLInputElement\n    )?.value.trim();\n    const serverUrl = (\n      slot.querySelector('[data-field=\"connection-url\"]') as HTMLInputElement\n    )?.value.trim();\n    const transport = (\n      slot.querySelector(\n        '[data-field=\"connection-transport\"]',\n      ) as HTMLSelectElement\n    )?.value as RemoteMcpTransport;\n    const enabled = (\n      slot.querySelector(\n        '[data-field=\"connection-enabled\"]',\n      ) as HTMLInputElement\n    )?.checked;\n    const autoReconnectOAuth = (\n      slot.querySelector(\n        '[data-field=\"connection-auto-reconnect\"]',\n      ) as HTMLInputElement\n    )?.checked;\n    const authSelection = (\n      slot.querySelector('[data-field=\"auth-selection\"]') as HTMLSelectElement\n    )?.value as AuthSelection;\n\n    if (!label || !serverUrl) {\n      showError(\"Connection label and server URL are required.\", 4000);\n\n      return;\n    }\n\n    const isNew = this.editingConnectionId === \"new\";\n    const existing = isNew\n      ? null\n      : this.connections.find((item) => item.id === this.editingConnectionId) ||\n        null;\n\n    try {\n      const connection = await upsertRemoteMcpConnection(this.db, {\n        id: isNew ? undefined : existing?.id,\n        label,\n        serviceType: \"mcp_remote\",\n        serverUrl,\n        transport,\n        enabled,\n        autoReconnectOAuth,\n      });\n\n      const credentialRef = await this.buildCredentialRef(\n        slot,\n        authSelection,\n        existing,\n      );\n\n      await bindRemoteMcpCredentialRef(this.db, connection.id, credentialRef);\n      await this.render();\n      this.hideConnectionForm();\n\n      showSuccess(\n        isNew ? \"Remote MCP connection added\" : \"Remote MCP connection updated\",\n        3000,\n      );\n    } catch (err) {\n      const message = err instanceof Error ? err.message : String(err);\n      showError(`Failed to save remote MCP connection: ${message}`, 6000);\n    }\n  }\n\n  async testConnection(connectionId: string) {\n    if (!this.db) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    // Show loading state in the card\n    const card = root.querySelector(\n      `.connection-card[data-connection-id=\"${connectionId}\"]`,\n    );\n\n    const existingDiag = card?.querySelector(\".connection-diagnostic\");\n    if (existingDiag) {\n      existingDiag.remove();\n    }\n\n    const diagEl = document.createElement(\"div\");\n    diagEl.className = \"connection-diagnostic\";\n    const loadingEl = document.createElement(\"div\");\n    loadingEl.className = \"diagnostic-loading\";\n    loadingEl.textContent = \"Testing connection…\";\n    diagEl.appendChild(loadingEl);\n    card?.appendChild(diagEl);\n\n    const result = await testRemoteMcpConnection(this.db, connectionId);\n    this.renderDiagnostic(diagEl, result);\n  }\n}\n\nif (!customElements.get(elementName)) {\n  customElements.define(elementName, ShadowClawMcpRemote);\n}\n"],"mappings":"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"}
+{"version":3,"file":"shadow-claw-mcp-remote-CT5Q-54E.js","names":["shadowClawMcpRemoteStyles","shadowClawMcpRemoteTemplate"],"sources":["../../src/components/settings/shadow-claw-mcp-remote/shadow-claw-mcp-remote.ts"],"sourcesContent":["import { CONFIG_KEYS } from \"../../../config/config.js\";\nimport { getDb, type ShadowClawDatabase } from \"../../../db/db.js\";\nimport { getConfig } from \"../../../db/getConfig.js\";\nimport { encryptValue } from \"../../../security/crypto.js\";\n\nimport { reconnectMcpOAuth } from \"../../../subsystems/mcp/mcp-reconnect.js\";\nimport { testRemoteMcpConnection } from \"../../../subsystems/mcp/remote-mcp-client.js\";\n\nimport {\n  bindRemoteMcpCredentialRef,\n  deleteRemoteMcpConnection,\n  listRemoteMcpConnections,\n  upsertRemoteMcpConnection,\n} from \"../../../subsystems/mcp/mcp-connections.js\";\n\nimport { setSanitizedHtml } from \"../../../security/trusted-types.js\";\nimport { showError, showSuccess } from \"../../../ui/toast.js\";\nimport { escapeHtml } from \"../../../utils/utils.js\";\n\nimport { GitAccount } from \"../../../subsystems/git/types.js\";\n\nimport type { ServiceAccount } from \"../../../subsystems/accounts/service-accounts.js\";\nimport type { McpConnectionTestResult } from \"../../../subsystems/mcp/remote-mcp-client.js\";\n\nimport type {\n  RemoteMcpConnectionRecord,\n  RemoteMcpCredentialRef,\n  RemoteMcpTransport,\n} from \"../../../subsystems/mcp/mcp-connections.js\";\n\nimport ShadowClawElement from \"../../shadow-claw-element.js\";\n\nimport \"../../common/shadow-claw-actions/shadow-claw-actions.js\";\nimport \"../../common/shadow-claw-card/shadow-claw-card.js\";\nimport \"../../common/shadow-claw-empty-state/shadow-claw-empty-state.js\";\nimport shadowClawMcpRemoteStyles from \"./shadow-claw-mcp-remote.css\" with { type: \"css\" };\nimport shadowClawMcpRemoteTemplate from \"./shadow-claw-mcp-remote.html\" with { type: \"html\" };\n\nconst elementName = \"shadow-claw-mcp-remote\";\n\ntype AuthSelection =\n  | \"none\"\n  | \"service_pat\"\n  | \"service_oauth\"\n  | \"git_pat\"\n  | \"git_oauth\"\n  | \"custom_header\";\n\nexport class ShadowClawMcpRemote extends ShadowClawElement {\n  static styles = shadowClawMcpRemoteStyles;\n  static template = shadowClawMcpRemoteTemplate;\n\n  connections: RemoteMcpConnectionRecord[] = [];\n  db: ShadowClawDatabase | null = null;\n  editingConnectionId: string | null = null;\n  gitAccounts: GitAccount[] = [];\n  serviceAccounts: ServiceAccount[] = [];\n\n  constructor() {\n    super();\n  }\n\n  async connectedCallback() {\n    const root = this.shadowRoot;\n    if (!root) {\n      throw new Error(\"shadowRoot not found\");\n    }\n\n    this.db = await getDb();\n    await this.render();\n    this.bindEventListeners();\n  }\n\n  bindEventListeners() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    root\n      .querySelector('[data-action=\"add-connection\"]')\n      ?.addEventListener(\"click\", () => this.showConnectionForm(\"new\"));\n\n    root\n      .querySelector('[data-region=\"connection-list\"]')\n      ?.addEventListener(\"settings-action\", (event) => {\n        const detail = (event as CustomEvent<{ action: string; id: string }>)\n          .detail;\n        const { action, id } = detail || { action: \"\", id: \"\" };\n\n        if (!id) {\n          return;\n        }\n\n        if (action === \"edit-connection\") {\n          this.showConnectionForm(id);\n        } else if (action === \"delete-connection\") {\n          void this.deleteConnection(id);\n        } else if (action === \"test-connection\") {\n          void this.testConnection(id);\n        }\n      });\n\n    root\n      .querySelector('[data-region=\"connection-list\"]')\n      ?.addEventListener(\"click\", (event) => {\n        const target = event.target;\n        if (!(target instanceof HTMLButtonElement)) {\n          return;\n        }\n\n        const connectionId = target.dataset.reconnectConnection;\n        if (connectionId) {\n          void this.reconnectOAuth(connectionId);\n        }\n      });\n  }\n\n  describeCredentialRef(ref: RemoteMcpCredentialRef | null): string {\n    if (!ref || ref.authType === \"none\") {\n      return \"No auth\";\n    }\n\n    if (ref.authType === \"custom_header\") {\n      return `Custom header${ref.headerName ? ` (${ref.headerName})` : \"\"}`;\n    }\n\n    if (ref.accountId) {\n      return `Service account (${ref.authType.toUpperCase()})`;\n    }\n\n    if (ref.gitAccountId) {\n      return `Git account (${ref.authType.toUpperCase()})`;\n    }\n\n    return ref.authType.toUpperCase();\n  }\n\n  getAuthSelectionFromCredentialRef(\n    ref: RemoteMcpCredentialRef | null,\n  ): AuthSelection {\n    if (!ref || ref.authType === \"none\") {\n      return \"none\";\n    }\n\n    if (ref.authType === \"custom_header\") {\n      return \"custom_header\";\n    }\n\n    if (ref.accountId) {\n      return ref.authType === \"oauth\" ? \"service_oauth\" : \"service_pat\";\n    }\n\n    if (ref.gitAccountId) {\n      return ref.authType === \"oauth\" ? \"git_oauth\" : \"git_pat\";\n    }\n\n    return \"none\";\n  }\n\n  hideConnectionForm() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const slot = root.querySelector('[data-region=\"connection-form-slot\"]');\n    if (slot) {\n      slot.replaceChildren();\n    }\n\n    this.editingConnectionId = null;\n  }\n\n  isOAuthConnection(connection: RemoteMcpConnectionRecord): boolean {\n    const ref = connection.credentialRef;\n    if (!ref) {\n      return false;\n    }\n\n    return ref.authType === \"oauth\" && !!(ref.accountId || ref.gitAccountId);\n  }\n\n  renderConnectionList() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const listEl = root.querySelector('[data-region=\"connection-list\"]');\n    if (!listEl) {\n      return;\n    }\n\n    listEl.replaceChildren();\n\n    if (this.connections.length === 0) {\n      const emptyState = document.createElement(\"shadow-claw-empty-state\");\n      emptyState.setAttribute(\n        \"message\",\n        \"No remote MCP connections configured.\",\n      );\n      emptyState.setAttribute(\n        \"hint\",\n        \"Click '+ Add Remote MCP Connection' to get started.\",\n      );\n      listEl.append(emptyState);\n\n      return;\n    }\n\n    const fragment = document.createDocumentFragment();\n\n    this.connections.forEach((connection) => {\n      const authLabel = this.describeCredentialRef(connection.credentialRef);\n      const enabledLabel = connection.enabled ? \"Enabled\" : \"Disabled\";\n      const cardMeta = `${connection.serverUrl} · ${connection.transport} · ${authLabel}`;\n\n      const card = document.createElement(\"shadow-claw-card\");\n      card.setAttribute(\"data-connection-id\", connection.id);\n      card.setAttribute(\"label\", connection.label);\n      card.setAttribute(\"meta\", cardMeta);\n      card.setAttribute(\"badge\", enabledLabel);\n      if (!connection.enabled) {\n        card.setAttribute(\"muted\", \"\");\n      }\n\n      const actions = document.createElement(\"shadow-claw-actions\");\n      actions.setAttribute(\"slot\", \"actions\");\n      actions.setAttribute(\"kind\", \"connection\");\n      actions.setAttribute(\"item-id\", connection.id);\n\n      card.append(actions);\n\n      const isOAuth = this.isOAuthConnection(connection);\n      if (isOAuth) {\n        const reconnectBtn = document.createElement(\"button\");\n        reconnectBtn.className = \"reconnect-btn\";\n        reconnectBtn.textContent = \"🔑 Reconnect OAuth\";\n        reconnectBtn.setAttribute(\"data-reconnect-connection\", connection.id);\n        card.append(reconnectBtn);\n      }\n\n      fragment.append(card);\n    });\n\n    listEl.append(fragment);\n  }\n\n  renderDiagnostic(container: HTMLElement, result: McpConnectionTestResult) {\n    const stepsHtml = result.steps\n      .map((step) => {\n        const icon =\n          step.status === \"ok\"\n            ? \"\\u2713\"\n            : step.status === \"error\"\n              ? \"\\u2717\"\n              : \"\\u2014\";\n        const cls = `diagnostic-step diagnostic-${step.status}`;\n\n        return `\n          <div class=\"${cls}\">\n            <span class=\"diagnostic-icon\">${icon}</span>\n            <span class=\"diagnostic-label\">${escapeHtml(step.step)}</span>\n            ${step.detail ? `<span class=\"diagnostic-detail\">${escapeHtml(step.detail)}</span>` : \"\"}\n          </div>`;\n      })\n      .join(\"\");\n\n    const toolsHtml =\n      result.success && result.toolNames.length > 0\n        ? `<details class=\"diagnostic-tools\"><summary>${result.toolCount} tool${result.toolCount === 1 ? \"\" : \"s\"} available</summary><ul>${result.toolNames.map((n) => `<li>${escapeHtml(n)}</li>`).join(\"\")}</ul></details>`\n        : \"\";\n\n    setSanitizedHtml(\n      container,\n      `\n      <div class=\"diagnostic-header diagnostic-${result.success ? \"ok\" : \"error\"}\">\n        ${result.success ? \"\\u2713 Connection OK\" : \"\\u2717 Connection Failed\"}\n        <button class=\"diagnostic-close\" data-action=\"close-diagnostic\" title=\"Dismiss\">\\u00d7</button>\n      </div>\n      <div class=\"diagnostic-steps\">${stepsHtml}</div>\n      ${toolsHtml}\n      `,\n    );\n\n    container\n      .querySelector('[data-action=\"close-diagnostic\"]')\n      ?.addEventListener(\"click\", () => container.remove());\n  }\n\n  renderGitAccountOptions(selectedId?: string): string {\n    if (this.gitAccounts.length === 0) {\n      return '<option value=\"\">No git accounts configured</option>';\n    }\n\n    return this.gitAccounts\n      .map((account) => {\n        const selected = account.id === selectedId ? \" selected\" : \"\";\n\n        return `<option value=\"${account.id}\"${selected}>${escapeHtml(account.label)} · ${escapeHtml(account.hostPattern)}</option>`;\n      })\n      .join(\"\");\n  }\n\n  renderServiceAccountOptions(selectedId?: string): string {\n    if (this.serviceAccounts.length === 0) {\n      return '<option value=\"\">No service accounts configured</option>';\n    }\n\n    return this.serviceAccounts\n      .map((account) => {\n        const selected = account.id === selectedId ? \" selected\" : \"\";\n\n        return `<option value=\"${account.id}\"${selected}>${escapeHtml(account.label)} · ${escapeHtml(account.hostPattern)}</option>`;\n      })\n      .join(\"\");\n  }\n\n  showConnectionForm(connectionId: string) {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    this.editingConnectionId = connectionId;\n    const isNew = connectionId === \"new\";\n    const existing = isNew\n      ? null\n      : this.connections.find((item) => item.id === connectionId) || null;\n\n    const transport = existing?.transport || \"streamable_http\";\n    const authSelection = this.getAuthSelectionFromCredentialRef(\n      existing?.credentialRef || null,\n    );\n\n    const slot = root.querySelector('[data-region=\"connection-form-slot\"]');\n    if (!slot) {\n      return;\n    }\n\n    setSanitizedHtml(\n      slot,\n      `\n      <div class=\"connection-form\">\n        <h4>${isNew ? \"Add Remote MCP Connection\" : \"Edit Remote MCP Connection\"}</h4>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Connection Label</label>\n          <input\n            type=\"text\"\n            class=\"form-input\"\n            data-field=\"connection-label\"\n            placeholder=\"e.g. Figma MCP, Jira MCP\"\n            value=\"${escapeHtml(existing?.label || \"\")}\"\n          />\n        </div>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Server URL</label>\n          <input\n            type=\"text\"\n            class=\"form-input\"\n            data-field=\"connection-url\"\n            placeholder=\"https://mcp.example.com/rpc\"\n            value=\"${escapeHtml(existing?.serverUrl || \"\")}\"\n          />\n          <div class=\"form-helper\">Must be an absolute http(s) URL.</div>\n        </div>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Transport</label>\n          <select class=\"form-input\" data-field=\"connection-transport\">\n            <option value=\"streamable_http\"${transport === \"streamable_http\" ? \" selected\" : \"\"}>streamable_http</option>\n            <option value=\"sse\"${transport === \"sse\" ? \" selected\" : \"\"}>sse</option>\n            <option value=\"websocket\"${transport === \"websocket\" ? \" selected\" : \"\"}>websocket</option>\n          </select>\n          <div class=\"form-helper\">\n            Current runtime support is streamable_http. Other transports can be saved for future support.\n          </div>\n        </div>\n\n        <div class=\"form-group connection-form-row\">\n          <input type=\"checkbox\" data-field=\"connection-enabled\"${existing?.enabled === false ? \"\" : \" checked\"} />\n          <label class=\"form-label\">Enabled</label>\n        </div>\n\n        <div class=\"form-group connection-form-row\" data-region=\"auto-reconnect-region\">\n          <input type=\"checkbox\" data-field=\"connection-auto-reconnect\"${existing?.autoReconnectOAuth ? \" checked\" : \"\"} />\n          <label class=\"form-label\">Auto-reconnect OAuth on 401</label>\n          <div class=\"form-helper\" style=\"margin-left: 0.25rem;\">When enabled, a 401 error will automatically open the OAuth popup to re-authenticate.</div>\n        </div>\n\n        <div class=\"form-group\">\n          <label class=\"form-label\">Authentication</label>\n          <select class=\"form-input\" data-field=\"auth-selection\">\n            <option value=\"none\"${authSelection === \"none\" ? \" selected\" : \"\"}>None</option>\n            <option value=\"service_pat\"${authSelection === \"service_pat\" ? \" selected\" : \"\"}>Service Account (PAT)</option>\n            <option value=\"service_oauth\"${authSelection === \"service_oauth\" ? \" selected\" : \"\"}>Service Account (OAuth)</option>\n            <option value=\"git_pat\"${authSelection === \"git_pat\" ? \" selected\" : \"\"}>Git Account (PAT)</option>\n            <option value=\"git_oauth\"${authSelection === \"git_oauth\" ? \" selected\" : \"\"}>Git Account (OAuth)</option>\n            <option value=\"custom_header\"${authSelection === \"custom_header\" ? \" selected\" : \"\"}>Custom Header</option>\n          </select>\n        </div>\n\n        <div class=\"form-group\" data-region=\"service-account-region\">\n          <label class=\"form-label\">Service Account</label>\n          <select class=\"form-input\" data-field=\"service-account-id\">\n            ${this.renderServiceAccountOptions(existing?.credentialRef?.accountId)}\n          </select>\n        </div>\n\n        <div class=\"form-group\" data-region=\"git-account-region\">\n          <label class=\"form-label\">Git Account</label>\n          <select class=\"form-input\" data-field=\"git-account-id\">\n            ${this.renderGitAccountOptions(existing?.credentialRef?.gitAccountId)}\n          </select>\n        </div>\n\n        <div data-region=\"custom-header-region\">\n          <div class=\"form-group\">\n            <label class=\"form-label\">Header Name</label>\n            <input\n              type=\"text\"\n              class=\"form-input\"\n              data-field=\"custom-header-name\"\n              placeholder=\"e.g. Authorization or X-API-Key\"\n              value=\"${escapeHtml(existing?.credentialRef?.headerName || \"\")}\"\n            />\n          </div>\n\n          <div class=\"form-group\">\n            <label class=\"form-label\">Header Value</label>\n            <input\n              type=\"password\"\n              class=\"form-input\"\n              data-field=\"custom-header-value\"\n              placeholder=\"${existing?.credentialRef?.authType === \"custom_header\" ? \"•••••••••••• (Saved)\" : \"Enter secret value\"}\"\n            />\n            <div class=\"auth-note\">Stored encrypted locally. Leave blank to keep existing value.</div>\n          </div>\n        </div>\n\n        <div class=\"connection-form-actions\">\n          <button class=\"confirm-btn\" data-action=\"save-connection\">\n            ${isNew ? \"Add Connection\" : \"Update Connection\"}\n          </button>\n          <button class=\"cancel-btn\" data-action=\"cancel-connection-form\">Cancel</button>\n        </div>\n      </div>\n    `,\n    );\n\n    slot\n      .querySelector('[data-action=\"save-connection\"]')\n      ?.addEventListener(\"click\", () => void this.saveConnectionForm());\n    slot\n      .querySelector('[data-action=\"cancel-connection-form\"]')\n      ?.addEventListener(\"click\", () => this.hideConnectionForm());\n    slot\n      .querySelector('[data-field=\"auth-selection\"]')\n      ?.addEventListener(\"change\", () => this.updateAuthFieldsVisibility(slot));\n\n    this.updateAuthFieldsVisibility(slot);\n  }\n\n  updateAuthFieldsVisibility(slot: Element) {\n    const authSelection = (\n      slot.querySelector('[data-field=\"auth-selection\"]') as HTMLSelectElement\n    )?.value as AuthSelection;\n\n    const serviceRegion = slot.querySelector(\n      '[data-region=\"service-account-region\"]',\n    );\n\n    const gitRegion = slot.querySelector('[data-region=\"git-account-region\"]');\n    const customHeaderRegion = slot.querySelector(\n      '[data-region=\"custom-header-region\"]',\n    );\n\n    const autoReconnectRegion = slot.querySelector(\n      '[data-region=\"auto-reconnect-region\"]',\n    );\n\n    const showService =\n      authSelection === \"service_pat\" || authSelection === \"service_oauth\";\n    const showGit =\n      authSelection === \"git_pat\" || authSelection === \"git_oauth\";\n    const showCustom = authSelection === \"custom_header\";\n    const showAutoReconnect =\n      authSelection === \"service_oauth\" || authSelection === \"git_oauth\";\n\n    if (serviceRegion instanceof HTMLElement) {\n      serviceRegion.style.display = showService ? \"block\" : \"none\";\n    }\n\n    if (gitRegion instanceof HTMLElement) {\n      gitRegion.style.display = showGit ? \"block\" : \"none\";\n    }\n\n    if (customHeaderRegion instanceof HTMLElement) {\n      customHeaderRegion.style.display = showCustom ? \"block\" : \"none\";\n    }\n\n    if (autoReconnectRegion instanceof HTMLElement) {\n      autoReconnectRegion.style.display = showAutoReconnect ? \"flex\" : \"none\";\n    }\n  }\n\n  async buildCredentialRef(\n    slot: Element,\n    authSelection: AuthSelection,\n    existing: RemoteMcpConnectionRecord | null,\n  ): Promise<RemoteMcpCredentialRef | null> {\n    if (authSelection === \"none\") {\n      return null;\n    }\n\n    if (authSelection === \"service_pat\" || authSelection === \"service_oauth\") {\n      const accountId = (\n        slot.querySelector(\n          '[data-field=\"service-account-id\"]',\n        ) as HTMLSelectElement\n      )?.value;\n      if (!accountId) {\n        throw new Error(\n          \"Select a service account for this authentication mode.\",\n        );\n      }\n\n      return {\n        serviceType: \"mcp_remote\",\n        authType: authSelection === \"service_oauth\" ? \"oauth\" : \"token\",\n        providerId: \"custom_mcp\",\n        accountId,\n      };\n    }\n\n    if (authSelection === \"git_pat\" || authSelection === \"git_oauth\") {\n      const gitAccountId = (\n        slot.querySelector('[data-field=\"git-account-id\"]') as HTMLSelectElement\n      )?.value;\n      if (!gitAccountId) {\n        throw new Error(\"Select a git account for this authentication mode.\");\n      }\n\n      return {\n        serviceType: \"mcp_remote\",\n        authType: authSelection === \"git_oauth\" ? \"oauth\" : \"token\",\n        providerId: \"custom_mcp\",\n        gitAccountId,\n      };\n    }\n\n    const headerName = (\n      slot.querySelector(\n        '[data-field=\"custom-header-name\"]',\n      ) as HTMLInputElement\n    )?.value.trim();\n    const headerValueRaw = (\n      slot.querySelector(\n        '[data-field=\"custom-header-value\"]',\n      ) as HTMLInputElement\n    )?.value.trim();\n\n    if (!headerName) {\n      throw new Error(\n        \"Header name is required for custom header authentication.\",\n      );\n    }\n\n    let encryptedValue: string | undefined;\n    if (headerValueRaw) {\n      encryptedValue = (await encryptValue(headerValueRaw)) || undefined;\n    }\n\n    if (!encryptedValue) {\n      if (\n        existing?.credentialRef?.authType === \"custom_header\" &&\n        existing.credentialRef.encryptedValue\n      ) {\n        encryptedValue = existing.credentialRef.encryptedValue;\n      } else {\n        throw new Error(\n          \"Header value is required for custom header authentication.\",\n        );\n      }\n    }\n\n    return {\n      serviceType: \"mcp_remote\",\n      authType: \"custom_header\",\n      providerId: \"custom_mcp\",\n      headerName,\n      encryptedValue,\n    };\n  }\n\n  async deleteConnection(connectionId: string) {\n    if (!this.db) {\n      return;\n    }\n\n    try {\n      const deleted = await deleteRemoteMcpConnection(this.db, connectionId);\n      if (!deleted) {\n        showError(\"Remote MCP connection not found.\", 4000);\n\n        return;\n      }\n\n      await this.render();\n      if (this.editingConnectionId === connectionId) {\n        this.hideConnectionForm();\n      }\n\n      showSuccess(\"Remote MCP connection deleted\", 3000);\n    } catch (err) {\n      const message = err instanceof Error ? err.message : String(err);\n      showError(`Failed to delete remote MCP connection: ${message}`, 6000);\n    }\n  }\n\n  async reconnectOAuth(connectionId: string) {\n    if (!this.db) {\n      return;\n    }\n\n    const connection = this.connections.find(\n      (item) => item.id === connectionId,\n    );\n\n    const label = connection?.label || connectionId;\n\n    const result = await reconnectMcpOAuth(this.db, connectionId);\n\n    if (result.success) {\n      showSuccess(`OAuth reconnected for \"${label}\"`, 4000);\n    } else {\n      showError(`OAuth reconnect failed: ${result.error}`, 6000);\n    }\n  }\n\n  async render() {\n    const root = this.shadowRoot;\n    if (!root || !this.db) {\n      return;\n    }\n\n    try {\n      this.connections = await listRemoteMcpConnections(this.db);\n      const serviceRaw = await getConfig(this.db, CONFIG_KEYS.SERVICE_ACCOUNTS);\n      this.serviceAccounts = Array.isArray(serviceRaw) ? serviceRaw : [];\n      const gitRaw = await getConfig(this.db, CONFIG_KEYS.GIT_ACCOUNTS);\n      this.gitAccounts = Array.isArray(gitRaw) ? gitRaw : [];\n\n      this.renderConnectionList();\n    } catch (err) {\n      console.warn(\"Could not load remote MCP connections:\", err);\n    }\n  }\n\n  async saveConnectionForm() {\n    if (!this.db) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const slot = root.querySelector('[data-region=\"connection-form-slot\"]');\n    if (!slot) {\n      return;\n    }\n\n    const label = (\n      slot.querySelector('[data-field=\"connection-label\"]') as HTMLInputElement\n    )?.value.trim();\n    const serverUrl = (\n      slot.querySelector('[data-field=\"connection-url\"]') as HTMLInputElement\n    )?.value.trim();\n    const transport = (\n      slot.querySelector(\n        '[data-field=\"connection-transport\"]',\n      ) as HTMLSelectElement\n    )?.value as RemoteMcpTransport;\n    const enabled = (\n      slot.querySelector(\n        '[data-field=\"connection-enabled\"]',\n      ) as HTMLInputElement\n    )?.checked;\n    const autoReconnectOAuth = (\n      slot.querySelector(\n        '[data-field=\"connection-auto-reconnect\"]',\n      ) as HTMLInputElement\n    )?.checked;\n    const authSelection = (\n      slot.querySelector('[data-field=\"auth-selection\"]') as HTMLSelectElement\n    )?.value as AuthSelection;\n\n    if (!label || !serverUrl) {\n      showError(\"Connection label and server URL are required.\", 4000);\n\n      return;\n    }\n\n    const isNew = this.editingConnectionId === \"new\";\n    const existing = isNew\n      ? null\n      : this.connections.find((item) => item.id === this.editingConnectionId) ||\n        null;\n\n    try {\n      const connection = await upsertRemoteMcpConnection(this.db, {\n        id: isNew ? undefined : existing?.id,\n        label,\n        serviceType: \"mcp_remote\",\n        serverUrl,\n        transport,\n        enabled,\n        autoReconnectOAuth,\n      });\n\n      const credentialRef = await this.buildCredentialRef(\n        slot,\n        authSelection,\n        existing,\n      );\n\n      await bindRemoteMcpCredentialRef(this.db, connection.id, credentialRef);\n      await this.render();\n      this.hideConnectionForm();\n\n      showSuccess(\n        isNew ? \"Remote MCP connection added\" : \"Remote MCP connection updated\",\n        3000,\n      );\n    } catch (err) {\n      const message = err instanceof Error ? err.message : String(err);\n      showError(`Failed to save remote MCP connection: ${message}`, 6000);\n    }\n  }\n\n  async testConnection(connectionId: string) {\n    if (!this.db) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    // Show loading state in the card\n    const card = root.querySelector(\n      `.connection-card[data-connection-id=\"${connectionId}\"]`,\n    );\n\n    const existingDiag = card?.querySelector(\".connection-diagnostic\");\n    if (existingDiag) {\n      existingDiag.remove();\n    }\n\n    const diagEl = document.createElement(\"div\");\n    diagEl.className = \"connection-diagnostic\";\n    const loadingEl = document.createElement(\"div\");\n    loadingEl.className = \"diagnostic-loading\";\n    loadingEl.textContent = \"Testing connection…\";\n    diagEl.appendChild(loadingEl);\n    card?.appendChild(diagEl);\n\n    const result = await testRemoteMcpConnection(this.db, connectionId);\n    this.renderDiagnostic(diagEl, result);\n  }\n}\n\nif (!customElements.get(elementName)) {\n  customElements.define(elementName, ShadowClawMcpRemote);\n}\n"],"mappings":"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"}

package/dist/lib/{shadow-claw-networking-DImPxe0H.js → shadow-claw-networking-Df85tCbO.js}

@@ -1,6 +1,6 @@
 import ShadowClawElement from "./components/shadow-claw-element.js";
 import { n as getDb } from "./txPromise-CuGh-TGK.js";
-import { _ as setUseProxy, t as orchestratorStore, u as setProxyUrl } from "./orchestrator-DCfomsn9.js";
+import { _ as setUseProxy, t as orchestratorStore, u as setProxyUrl } from "./orchestrator-KRjx0eba.js";
 import { a as showSuccess, r as showError, s as showWarning } from "./toast-DZ6r7_YI.js";
 import { t as effect } from "./effect-DL6j9HJp.js";
 
@@ -233,4 +233,4 @@ if (!customElements.get(elementName)) customElements.define(elementName, ShadowC
 
 //#endregion
 export { ShadowClawNetworking as t };
-//# sourceMappingURL=shadow-claw-networking-DImPxe0H.js.map
+//# sourceMappingURL=shadow-claw-networking-Df85tCbO.js.map

package/dist/lib/{shadow-claw-networking-DImPxe0H.js.map → shadow-claw-networking-Df85tCbO.js.map}

@@ -1 +1 @@
-{"version":3,"file":"shadow-claw-networking-DImPxe0H.js","names":["shadowClawNetworkingStyles","shadowClawNetworkingTemplate"],"sources":["../../src/components/settings/shadow-claw-networking/shadow-claw-networking.ts"],"sourcesContent":["import { effect } from \"../../../core/effect.js\";\n\nimport {\n  setProxyUrl,\n  setUseProxy,\n} from \"../../../core/orchestrator/utils/settings.js\";\n\nimport { getDb } from \"../../../db/db.js\";\nimport { orchestratorStore } from \"../../../stores/orchestrator.js\";\nimport { showError, showSuccess, showWarning } from \"../../../ui/toast.js\";\n\nimport type { Orchestrator } from \"../../../core/orchestrator/orchestrator.js\";\nimport type { ShadowClawDatabase } from \"../../../db/types.js\";\n\nimport ShadowClawElement from \"../../shadow-claw-element.js\";\nimport shadowClawNetworkingStyles from \"./shadow-claw-networking.css\" with { type: \"css\" };\nimport shadowClawNetworkingTemplate from \"./shadow-claw-networking.html\" with { type: \"html\" };\n\nconst elementName = \"shadow-claw-networking\";\n\n/**\n * Settings sub-component for network proxy configuration.\n */\nexport class ShadowClawNetworking extends ShadowClawElement {\n  static styles = shadowClawNetworkingStyles;\n  static template = shadowClawNetworkingTemplate;\n\n  db: ShadowClawDatabase | null;\n  orchestrator: Orchestrator | null;\n\n  constructor() {\n    super();\n\n    this.db = null;\n    this.orchestrator = null;\n  }\n\n  async connectedCallback() {\n    const root = this.shadowRoot;\n    if (!root) {\n      throw new Error(\"shadowRoot not found\");\n    }\n\n    this.db = await getDb();\n    this.orchestrator = orchestratorStore.orchestrator;\n\n    this.bindEventListeners();\n    this.setupEffects();\n    await this.render();\n  }\n\n  bindEventListeners() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    root\n      .querySelector('[data-setting=\"proxy-toggle\"]')\n      ?.addEventListener(\"change\", (e) => {\n        if (e.target instanceof HTMLInputElement) {\n          void this.onProxyToggle(e.target.checked);\n        }\n      });\n\n    root\n      .querySelector('[data-action=\"save-proxy-url\"]')\n      ?.addEventListener(\"click\", () => {\n        void this.saveProxyUrl();\n      });\n  }\n\n  setupEffects() {\n    effect(() => {\n      if (orchestratorStore.ready) {\n        this.orchestrator = orchestratorStore.orchestrator;\n        this.render();\n      }\n    });\n  }\n\n  async onProxyToggle(enabled: boolean) {\n    if (!this.orchestrator || !this.db) {\n      return;\n    }\n\n    try {\n      await setUseProxy(this.orchestrator, this.db, enabled);\n      showSuccess(enabled ? \"CORS Proxy enabled\" : \"CORS Proxy disabled\", 2500);\n    } catch (err) {\n      const errorMsg = err instanceof Error ? err.message : String(err);\n      showError(\"Error saving proxy setting: \" + errorMsg, 6000);\n    }\n  }\n\n  async render() {\n    if (!this.orchestrator) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const proxyToggle = root.querySelector(\n      '[data-setting=\"proxy-toggle\"]',\n    ) as HTMLInputElement | null;\n    if (proxyToggle) {\n      proxyToggle.checked = this.orchestrator.useProxy;\n    }\n\n    const proxyUrlInput = root.querySelector(\n      '[data-setting=\"proxy-url-input\"]',\n    ) as HTMLInputElement | null;\n    if (proxyUrlInput) {\n      proxyUrlInput.value = this.orchestrator.proxyUrl;\n    }\n  }\n\n  async saveProxyUrl() {\n    if (!this.orchestrator || !this.db) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const input = root.querySelector(\n      '[data-setting=\"proxy-url-input\"]',\n    ) as HTMLInputElement | null;\n    if (!input) {\n      return;\n    }\n\n    const url = input.value.trim();\n    if (!url) {\n      showWarning(\"Please enter a proxy URL (e.g. /proxy)\", 3000);\n\n      return;\n    }\n\n    try {\n      await setProxyUrl(this.orchestrator, this.db, url);\n      showSuccess(\"Proxy URL saved\", 3000);\n    } catch (err) {\n      const errorMsg = err instanceof Error ? err.message : String(err);\n      showError(\"Error saving proxy URL: \" + errorMsg, 6000);\n    }\n  }\n}\n\nif (!customElements.get(elementName)) {\n  customElements.define(elementName, ShadowClawNetworking);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,cAAc;;;;AAKpB,IAAa,uBAAb,cAA0C,kBAAkB;CAC1D,OAAO,SAASA;CAChB,OAAO,WAAWC;CAElB;CACA;CAEA,cAAc;EACZ,MAAM;EAEN,KAAK,KAAK;EACV,KAAK,eAAe;CACtB;CAEA,MAAM,oBAAoB;EAExB,IAAI,CADS,KAAK,YAEhB,MAAM,IAAI,MAAM,sBAAsB;EAGxC,KAAK,KAAK,MAAM,MAAM;EACtB,KAAK,eAAe,kBAAkB;EAEtC,KAAK,mBAAmB;EACxB,KAAK,aAAa;EAClB,MAAM,KAAK,OAAO;CACpB;CAEA,qBAAqB;EACnB,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,MACH;EAGF,KACG,cAAc,iCAA+B,CAAC,EAC7C,iBAAiB,WAAW,MAAM;GAClC,IAAI,EAAE,kBAAkB,kBACtB,AAAK,KAAK,cAAc,EAAE,OAAO,OAAO;EAE5C,CAAC;EAEH,KACG,cAAc,kCAAgC,CAAC,EAC9C,iBAAiB,eAAe;GAChC,AAAK,KAAK,aAAa;EACzB,CAAC;CACL;CAEA,eAAe;EACb,aAAa;GACX,IAAI,kBAAkB,OAAO;IAC3B,KAAK,eAAe,kBAAkB;IACtC,KAAK,OAAO;GACd;EACF,CAAC;CACH;CAEA,MAAM,cAAc,SAAkB;EACpC,IAAI,CAAC,KAAK,gBAAgB,CAAC,KAAK,IAC9B;EAGF,IAAI;GACF,MAAM,YAAY,KAAK,cAAc,KAAK,IAAI,OAAO;GACrD,YAAY,UAAU,uBAAuB,uBAAuB,IAAI;EAC1E,SAAS,KAAK;GAEZ,UAAU,kCADO,eAAe,QAAQ,IAAI,UAAU,OAAO,GAAG,IACX,GAAI;EAC3D;CACF;CAEA,MAAM,SAAS;EACb,IAAI,CAAC,KAAK,cACR;EAGF,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,MACH;EAGF,MAAM,cAAc,KAAK,cACvB,iCACF;EACA,IAAI,aACF,YAAY,UAAU,KAAK,aAAa;EAG1C,MAAM,gBAAgB,KAAK,cACzB,oCACF;EACA,IAAI,eACF,cAAc,QAAQ,KAAK,aAAa;CAE5C;CAEA,MAAM,eAAe;EACnB,IAAI,CAAC,KAAK,gBAAgB,CAAC,KAAK,IAC9B;EAGF,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,MACH;EAGF,MAAM,QAAQ,KAAK,cACjB,oCACF;EACA,IAAI,CAAC,OACH;EAGF,MAAM,MAAM,MAAM,MAAM,KAAK;EAC7B,IAAI,CAAC,KAAK;GACR,YAAY,0CAA0C,GAAI;GAE1D;EACF;EAEA,IAAI;GACF,MAAM,YAAY,KAAK,cAAc,KAAK,IAAI,GAAG;GACjD,YAAY,mBAAmB,GAAI;EACrC,SAAS,KAAK;GAEZ,UAAU,8BADO,eAAe,QAAQ,IAAI,UAAU,OAAO,GAAG,IACf,GAAI;EACvD;CACF;AACF;AAEA,IAAI,CAAC,eAAe,IAAI,WAAW,GACjC,eAAe,OAAO,aAAa,oBAAoB"}
+{"version":3,"file":"shadow-claw-networking-Df85tCbO.js","names":["shadowClawNetworkingStyles","shadowClawNetworkingTemplate"],"sources":["../../src/components/settings/shadow-claw-networking/shadow-claw-networking.ts"],"sourcesContent":["import { effect } from \"../../../core/effect.js\";\n\nimport {\n  setProxyUrl,\n  setUseProxy,\n} from \"../../../core/orchestrator/utils/settings.js\";\n\nimport { getDb } from \"../../../db/db.js\";\nimport { orchestratorStore } from \"../../../stores/orchestrator.js\";\nimport { showError, showSuccess, showWarning } from \"../../../ui/toast.js\";\n\nimport type { Orchestrator } from \"../../../core/orchestrator/orchestrator.js\";\nimport type { ShadowClawDatabase } from \"../../../db/types.js\";\n\nimport ShadowClawElement from \"../../shadow-claw-element.js\";\nimport shadowClawNetworkingStyles from \"./shadow-claw-networking.css\" with { type: \"css\" };\nimport shadowClawNetworkingTemplate from \"./shadow-claw-networking.html\" with { type: \"html\" };\n\nconst elementName = \"shadow-claw-networking\";\n\n/**\n * Settings sub-component for network proxy configuration.\n */\nexport class ShadowClawNetworking extends ShadowClawElement {\n  static styles = shadowClawNetworkingStyles;\n  static template = shadowClawNetworkingTemplate;\n\n  db: ShadowClawDatabase | null;\n  orchestrator: Orchestrator | null;\n\n  constructor() {\n    super();\n\n    this.db = null;\n    this.orchestrator = null;\n  }\n\n  async connectedCallback() {\n    const root = this.shadowRoot;\n    if (!root) {\n      throw new Error(\"shadowRoot not found\");\n    }\n\n    this.db = await getDb();\n    this.orchestrator = orchestratorStore.orchestrator;\n\n    this.bindEventListeners();\n    this.setupEffects();\n    await this.render();\n  }\n\n  bindEventListeners() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    root\n      .querySelector('[data-setting=\"proxy-toggle\"]')\n      ?.addEventListener(\"change\", (e) => {\n        if (e.target instanceof HTMLInputElement) {\n          void this.onProxyToggle(e.target.checked);\n        }\n      });\n\n    root\n      .querySelector('[data-action=\"save-proxy-url\"]')\n      ?.addEventListener(\"click\", () => {\n        void this.saveProxyUrl();\n      });\n  }\n\n  setupEffects() {\n    effect(() => {\n      if (orchestratorStore.ready) {\n        this.orchestrator = orchestratorStore.orchestrator;\n        this.render();\n      }\n    });\n  }\n\n  async onProxyToggle(enabled: boolean) {\n    if (!this.orchestrator || !this.db) {\n      return;\n    }\n\n    try {\n      await setUseProxy(this.orchestrator, this.db, enabled);\n      showSuccess(enabled ? \"CORS Proxy enabled\" : \"CORS Proxy disabled\", 2500);\n    } catch (err) {\n      const errorMsg = err instanceof Error ? err.message : String(err);\n      showError(\"Error saving proxy setting: \" + errorMsg, 6000);\n    }\n  }\n\n  async render() {\n    if (!this.orchestrator) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const proxyToggle = root.querySelector(\n      '[data-setting=\"proxy-toggle\"]',\n    ) as HTMLInputElement | null;\n    if (proxyToggle) {\n      proxyToggle.checked = this.orchestrator.useProxy;\n    }\n\n    const proxyUrlInput = root.querySelector(\n      '[data-setting=\"proxy-url-input\"]',\n    ) as HTMLInputElement | null;\n    if (proxyUrlInput) {\n      proxyUrlInput.value = this.orchestrator.proxyUrl;\n    }\n  }\n\n  async saveProxyUrl() {\n    if (!this.orchestrator || !this.db) {\n      return;\n    }\n\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    const input = root.querySelector(\n      '[data-setting=\"proxy-url-input\"]',\n    ) as HTMLInputElement | null;\n    if (!input) {\n      return;\n    }\n\n    const url = input.value.trim();\n    if (!url) {\n      showWarning(\"Please enter a proxy URL (e.g. /proxy)\", 3000);\n\n      return;\n    }\n\n    try {\n      await setProxyUrl(this.orchestrator, this.db, url);\n      showSuccess(\"Proxy URL saved\", 3000);\n    } catch (err) {\n      const errorMsg = err instanceof Error ? err.message : String(err);\n      showError(\"Error saving proxy URL: \" + errorMsg, 6000);\n    }\n  }\n}\n\nif (!customElements.get(elementName)) {\n  customElements.define(elementName, ShadowClawNetworking);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,cAAc;;;;AAKpB,IAAa,uBAAb,cAA0C,kBAAkB;CAC1D,OAAO,SAASA;CAChB,OAAO,WAAWC;CAElB;CACA;CAEA,cAAc;EACZ,MAAM;EAEN,KAAK,KAAK;EACV,KAAK,eAAe;CACtB;CAEA,MAAM,oBAAoB;EAExB,IAAI,CADS,KAAK,YAEhB,MAAM,IAAI,MAAM,sBAAsB;EAGxC,KAAK,KAAK,MAAM,MAAM;EACtB,KAAK,eAAe,kBAAkB;EAEtC,KAAK,mBAAmB;EACxB,KAAK,aAAa;EAClB,MAAM,KAAK,OAAO;CACpB;CAEA,qBAAqB;EACnB,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,MACH;EAGF,KACG,cAAc,iCAA+B,CAAC,EAC7C,iBAAiB,WAAW,MAAM;GAClC,IAAI,EAAE,kBAAkB,kBACtB,AAAK,KAAK,cAAc,EAAE,OAAO,OAAO;EAE5C,CAAC;EAEH,KACG,cAAc,kCAAgC,CAAC,EAC9C,iBAAiB,eAAe;GAChC,AAAK,KAAK,aAAa;EACzB,CAAC;CACL;CAEA,eAAe;EACb,aAAa;GACX,IAAI,kBAAkB,OAAO;IAC3B,KAAK,eAAe,kBAAkB;IACtC,KAAK,OAAO;GACd;EACF,CAAC;CACH;CAEA,MAAM,cAAc,SAAkB;EACpC,IAAI,CAAC,KAAK,gBAAgB,CAAC,KAAK,IAC9B;EAGF,IAAI;GACF,MAAM,YAAY,KAAK,cAAc,KAAK,IAAI,OAAO;GACrD,YAAY,UAAU,uBAAuB,uBAAuB,IAAI;EAC1E,SAAS,KAAK;GAEZ,UAAU,kCADO,eAAe,QAAQ,IAAI,UAAU,OAAO,GAAG,IACX,GAAI;EAC3D;CACF;CAEA,MAAM,SAAS;EACb,IAAI,CAAC,KAAK,cACR;EAGF,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,MACH;EAGF,MAAM,cAAc,KAAK,cACvB,iCACF;EACA,IAAI,aACF,YAAY,UAAU,KAAK,aAAa;EAG1C,MAAM,gBAAgB,KAAK,cACzB,oCACF;EACA,IAAI,eACF,cAAc,QAAQ,KAAK,aAAa;CAE5C;CAEA,MAAM,eAAe;EACnB,IAAI,CAAC,KAAK,gBAAgB,CAAC,KAAK,IAC9B;EAGF,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,MACH;EAGF,MAAM,QAAQ,KAAK,cACjB,oCACF;EACA,IAAI,CAAC,OACH;EAGF,MAAM,MAAM,MAAM,MAAM,KAAK;EAC7B,IAAI,CAAC,KAAK;GACR,YAAY,0CAA0C,GAAI;GAE1D;EACF;EAEA,IAAI;GACF,MAAM,YAAY,KAAK,cAAc,KAAK,IAAI,GAAG;GACjD,YAAY,mBAAmB,GAAI;EACrC,SAAS,KAAK;GAEZ,UAAU,8BADO,eAAe,QAAQ,IAAI,UAAU,OAAO,GAAG,IACf,GAAI;EACvD;CACF;AACF;AAEA,IAAI,CAAC,eAAe,IAAI,WAAW,GACjC,eAAe,OAAO,aAAa,oBAAoB"}

package/dist/lib/{shadow-claw-page-header-CcHUfFUx.js → shadow-claw-page-header-Cti2fzf-.js}

@@ -1,5 +1,5 @@
 import ShadowClawElement from "./components/shadow-claw-element.js";
-import { n as setSanitizedHtml } from "./trusted-types-CkLDpLiZ.js";
+import { n as setSanitizedHtml } from "./trusted-types-Dx0RZlrd.js";
 
 //#region src/components/shadow-claw-page-header/shadow-claw-page-header.css
 const sheet = new CSSStyleSheet();
@@ -361,4 +361,4 @@ if (!customElements.get(elementName)) customElements.define(elementName, ShadowC
 
 //#endregion
 export { ShadowClawPageHeader as t };
-//# sourceMappingURL=shadow-claw-page-header-CcHUfFUx.js.map
+//# sourceMappingURL=shadow-claw-page-header-Cti2fzf-.js.map

package/dist/lib/{shadow-claw-page-header-CcHUfFUx.js.map → shadow-claw-page-header-Cti2fzf-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"shadow-claw-page-header-CcHUfFUx.js","names":["shadowClawPageHeaderStyles","shadowClawPageHeaderTemplate"],"sources":["../../src/components/shadow-claw-page-header/shadow-claw-page-header.ts"],"sourcesContent":["import ShadowClawElement from \"../shadow-claw-element.js\";\nimport { setSanitizedHtml } from \"../../security/trusted-types.js\";\nimport shadowClawPageHeaderStyles from \"./shadow-claw-page-header.css\" with { type: \"css\" };\nimport shadowClawPageHeaderTemplate from \"./shadow-claw-page-header.html\" with { type: \"html\" };\n\nconst elementName = \"shadow-claw-page-header\";\n\n/**\n * Reusable page header component with mobile-first responsive design.\n * Supports title, actions, and optional breadcrumbs.\n */\nexport class ShadowClawPageHeader extends ShadowClawElement {\n  static styles = shadowClawPageHeaderStyles;\n  static template = shadowClawPageHeaderTemplate;\n\n  static get observedAttributes() {\n    return [\"title\", \"page-title\", \"icon\"];\n  }\n\n  mainCollapsed: boolean = false;\n  mainVisibilityMediaQuery: MediaQueryList | null = null;\n  manualMainCollapsedOverride: boolean | null = null;\n\n  constructor() {\n    super();\n  }\n\n  attributeChangedCallback(_name, oldValue, newValue) {\n    if (oldValue !== newValue) {\n      this.render();\n    }\n  }\n\n  async connectedCallback() {\n    const root = this.shadowRoot;\n    if (!root) {\n      throw new Error(\"shadowRoot not found\");\n    }\n\n    await this.render();\n  }\n\n  disconnectedCallback() {\n    this.actionsLayoutCleanup();\n    this.mainVisibilityCleanup();\n  }\n\n  actionsLayoutCleanup: () => void = () => {};\n\n  applyMainVisibility(root?: ShadowRoot) {\n    const targetRoot = root || this.shadowRoot;\n    if (!targetRoot) {\n      return;\n    }\n\n    const headerMain = targetRoot.querySelector(\".header__main\");\n    if (!(headerMain instanceof HTMLElement)) {\n      return;\n    }\n\n    const collapsed = this.getEffectiveMainCollapsed();\n    this.mainCollapsed = collapsed;\n    headerMain.hidden = collapsed;\n  }\n\n  getAutoMainCollapsed() {\n    return false;\n  }\n\n  getEffectiveMainCollapsed() {\n    if (typeof this.manualMainCollapsedOverride === \"boolean\") {\n      return this.manualMainCollapsedOverride;\n    }\n\n    return this.getAutoMainCollapsed();\n  }\n\n  isMainCollapsed() {\n    return this.mainCollapsed;\n  }\n\n  mainVisibilityCleanup: () => void = () => {};\n\n  setMainCollapsedOverride(collapsed: boolean | null) {\n    this.manualMainCollapsedOverride =\n      typeof collapsed === \"boolean\" ? collapsed : null;\n    this.applyMainVisibility();\n  }\n\n  /**\n   * Hide the actions container when no action buttons are slotted.\n   */\n  setupActionsContainer(root: ShadowRoot) {\n    const actionSlot = root.querySelector('slot[name=\"actions\"]');\n    const actions = root.querySelector(\".header__actions\");\n    const disclosure = root.querySelector(\".header__actions-disclosure\");\n\n    if (\n      !(actionSlot instanceof HTMLSlotElement) ||\n      !(actions instanceof HTMLElement) ||\n      !(disclosure instanceof HTMLElement)\n    ) {\n      return;\n    }\n\n    const updateVisibility = () => {\n      const hasActions = actionSlot.assignedElements().length > 0;\n      actions.hidden = !hasActions;\n      disclosure.hidden = !hasActions;\n    };\n\n    actionSlot.addEventListener(\"slotchange\", updateVisibility);\n    updateVisibility();\n  }\n\n  setupMainVisibility(root: ShadowRoot) {\n    this.mainVisibilityCleanup();\n    this.mainVisibilityMediaQuery = null;\n    this.mainVisibilityCleanup = () => {};\n    this.applyMainVisibility(root);\n  }\n\n  /**\n   * Keep actions collapsed by default on stacked/mobile layout and expanded on wider screens.\n   */\n  setupResponsiveActionsDisclosure(root: ShadowRoot) {\n    this.actionsLayoutCleanup();\n\n    const disclosure = root.querySelector(\".header__actions-disclosure\");\n    if (!(disclosure instanceof HTMLDetailsElement)) {\n      return;\n    }\n\n    if (typeof globalThis.matchMedia !== \"function\") {\n      disclosure.open = false;\n      this.actionsLayoutCleanup = () => {};\n\n      return;\n    }\n\n    const mediaQuery = globalThis.matchMedia(\"(min-width: 40.625rem)\");\n\n    const applyLayoutMode = () => {\n      if (mediaQuery.matches) {\n        disclosure.open = true;\n      } else {\n        disclosure.open = false;\n      }\n    };\n\n    applyLayoutMode();\n\n    const onChange = () => {\n      applyLayoutMode();\n    };\n\n    mediaQuery.addEventListener(\"change\", onChange);\n\n    this.actionsLayoutCleanup = () => {\n      mediaQuery.removeEventListener(\"change\", onChange);\n    };\n  }\n\n  toggleMainCollapsedOverride() {\n    this.setMainCollapsedOverride(!this.isMainCollapsed());\n\n    return this.isMainCollapsed();\n  }\n\n  async render() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    // Set title\n    const titleEl = root.querySelector(\".header__title\");\n    if (titleEl) {\n      const icon = this.getAttribute(\"icon\") || \"\";\n      const title = this.hasAttribute(\"page-title\")\n        ? this.getAttribute(\"page-title\") || \"\"\n        : this.getAttribute(\"title\") || \"\";\n      setSanitizedHtml(titleEl, icon ? `${icon} ${title}` : title);\n    }\n\n    this.setupActionsContainer(root);\n    this.setupResponsiveActionsDisclosure(root);\n    this.setupMainVisibility(root);\n  }\n}\n\nif (!customElements.get(elementName)) {\n  customElements.define(elementName, ShadowClawPageHeader);\n}\n"],"mappings":"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"}
+{"version":3,"file":"shadow-claw-page-header-Cti2fzf-.js","names":["shadowClawPageHeaderStyles","shadowClawPageHeaderTemplate"],"sources":["../../src/components/shadow-claw-page-header/shadow-claw-page-header.ts"],"sourcesContent":["import ShadowClawElement from \"../shadow-claw-element.js\";\nimport { setSanitizedHtml } from \"../../security/trusted-types.js\";\nimport shadowClawPageHeaderStyles from \"./shadow-claw-page-header.css\" with { type: \"css\" };\nimport shadowClawPageHeaderTemplate from \"./shadow-claw-page-header.html\" with { type: \"html\" };\n\nconst elementName = \"shadow-claw-page-header\";\n\n/**\n * Reusable page header component with mobile-first responsive design.\n * Supports title, actions, and optional breadcrumbs.\n */\nexport class ShadowClawPageHeader extends ShadowClawElement {\n  static styles = shadowClawPageHeaderStyles;\n  static template = shadowClawPageHeaderTemplate;\n\n  static get observedAttributes() {\n    return [\"title\", \"page-title\", \"icon\"];\n  }\n\n  mainCollapsed: boolean = false;\n  mainVisibilityMediaQuery: MediaQueryList | null = null;\n  manualMainCollapsedOverride: boolean | null = null;\n\n  constructor() {\n    super();\n  }\n\n  attributeChangedCallback(_name, oldValue, newValue) {\n    if (oldValue !== newValue) {\n      this.render();\n    }\n  }\n\n  async connectedCallback() {\n    const root = this.shadowRoot;\n    if (!root) {\n      throw new Error(\"shadowRoot not found\");\n    }\n\n    await this.render();\n  }\n\n  disconnectedCallback() {\n    this.actionsLayoutCleanup();\n    this.mainVisibilityCleanup();\n  }\n\n  actionsLayoutCleanup: () => void = () => {};\n\n  applyMainVisibility(root?: ShadowRoot) {\n    const targetRoot = root || this.shadowRoot;\n    if (!targetRoot) {\n      return;\n    }\n\n    const headerMain = targetRoot.querySelector(\".header__main\");\n    if (!(headerMain instanceof HTMLElement)) {\n      return;\n    }\n\n    const collapsed = this.getEffectiveMainCollapsed();\n    this.mainCollapsed = collapsed;\n    headerMain.hidden = collapsed;\n  }\n\n  getAutoMainCollapsed() {\n    return false;\n  }\n\n  getEffectiveMainCollapsed() {\n    if (typeof this.manualMainCollapsedOverride === \"boolean\") {\n      return this.manualMainCollapsedOverride;\n    }\n\n    return this.getAutoMainCollapsed();\n  }\n\n  isMainCollapsed() {\n    return this.mainCollapsed;\n  }\n\n  mainVisibilityCleanup: () => void = () => {};\n\n  setMainCollapsedOverride(collapsed: boolean | null) {\n    this.manualMainCollapsedOverride =\n      typeof collapsed === \"boolean\" ? collapsed : null;\n    this.applyMainVisibility();\n  }\n\n  /**\n   * Hide the actions container when no action buttons are slotted.\n   */\n  setupActionsContainer(root: ShadowRoot) {\n    const actionSlot = root.querySelector('slot[name=\"actions\"]');\n    const actions = root.querySelector(\".header__actions\");\n    const disclosure = root.querySelector(\".header__actions-disclosure\");\n\n    if (\n      !(actionSlot instanceof HTMLSlotElement) ||\n      !(actions instanceof HTMLElement) ||\n      !(disclosure instanceof HTMLElement)\n    ) {\n      return;\n    }\n\n    const updateVisibility = () => {\n      const hasActions = actionSlot.assignedElements().length > 0;\n      actions.hidden = !hasActions;\n      disclosure.hidden = !hasActions;\n    };\n\n    actionSlot.addEventListener(\"slotchange\", updateVisibility);\n    updateVisibility();\n  }\n\n  setupMainVisibility(root: ShadowRoot) {\n    this.mainVisibilityCleanup();\n    this.mainVisibilityMediaQuery = null;\n    this.mainVisibilityCleanup = () => {};\n    this.applyMainVisibility(root);\n  }\n\n  /**\n   * Keep actions collapsed by default on stacked/mobile layout and expanded on wider screens.\n   */\n  setupResponsiveActionsDisclosure(root: ShadowRoot) {\n    this.actionsLayoutCleanup();\n\n    const disclosure = root.querySelector(\".header__actions-disclosure\");\n    if (!(disclosure instanceof HTMLDetailsElement)) {\n      return;\n    }\n\n    if (typeof globalThis.matchMedia !== \"function\") {\n      disclosure.open = false;\n      this.actionsLayoutCleanup = () => {};\n\n      return;\n    }\n\n    const mediaQuery = globalThis.matchMedia(\"(min-width: 40.625rem)\");\n\n    const applyLayoutMode = () => {\n      if (mediaQuery.matches) {\n        disclosure.open = true;\n      } else {\n        disclosure.open = false;\n      }\n    };\n\n    applyLayoutMode();\n\n    const onChange = () => {\n      applyLayoutMode();\n    };\n\n    mediaQuery.addEventListener(\"change\", onChange);\n\n    this.actionsLayoutCleanup = () => {\n      mediaQuery.removeEventListener(\"change\", onChange);\n    };\n  }\n\n  toggleMainCollapsedOverride() {\n    this.setMainCollapsedOverride(!this.isMainCollapsed());\n\n    return this.isMainCollapsed();\n  }\n\n  async render() {\n    const root = this.shadowRoot;\n    if (!root) {\n      return;\n    }\n\n    // Set title\n    const titleEl = root.querySelector(\".header__title\");\n    if (titleEl) {\n      const icon = this.getAttribute(\"icon\") || \"\";\n      const title = this.hasAttribute(\"page-title\")\n        ? this.getAttribute(\"page-title\") || \"\"\n        : this.getAttribute(\"title\") || \"\";\n      setSanitizedHtml(titleEl, icon ? `${icon} ${title}` : title);\n    }\n\n    this.setupActionsContainer(root);\n    this.setupResponsiveActionsDisclosure(root);\n    this.setupMainVisibility(root);\n  }\n}\n\nif (!customElements.get(elementName)) {\n  customElements.define(elementName, ShadowClawPageHeader);\n}\n"],"mappings":"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"}

package/dist/lib/{shadow-claw-pages-D54jF1Qq.js → shadow-claw-pages-BgPyIEZO.js}

@@ -4,18 +4,19 @@ import { t as Signal } from "./dist-Bxg3C_zy.js";
 import { r as CONFIG_KEYS } from "./config--CFrw3J3.js";
 import { a as getFileRouteDirPath, n as applyBasePath, o as getWorkspaceRouteRequestPath, r as buildRoutePath, s as isPossibleAppRoute, u as resolveHrefAgainstRoute } from "./app-routes-CqBOeA5q.js";
 import { t as getConfig } from "./getConfig-BxxXMyuM.js";
-import { t as readGroupFileBytes } from "./readGroupFileBytes-Bve-e5e_.js";
-import { bn as readGroupFile, ln as toolsStore, nn as writeGroupFile, r as getStaticPageContent, t as orchestratorStore } from "./orchestrator-DCfomsn9.js";
-import { t as fileViewerStore } from "./file-viewer-BrK2Wxgh.js";
-import { _ as getIframeSandboxPolicy, b as isAllowedCustomElement, g as getIframeCsp, h as getApprovedCustomElementScripts, n as setSanitizedHtml, r as setTrustedSrcdoc, t as sanitizeSrcdocHtml } from "./trusted-types-CkLDpLiZ.js";
+import { o as readGroupFile, t as toolsStore } from "./tools-DwwB9RBa.js";
+import { t as readGroupFileBytes } from "./readGroupFileBytes-C8oOe8Iu.js";
+import { t as fileViewerStore } from "./file-viewer-C3YKnq_-.js";
+import { nn as writeGroupFile, r as getStaticPageContent, t as orchestratorStore } from "./orchestrator-KRjx0eba.js";
+import { _ as getIframeSandboxPolicy, b as isAllowedCustomElement, g as getIframeCsp, h as getApprovedCustomElementScriptDescriptors, n as setSanitizedHtml, r as setTrustedSrcdoc, t as sanitizeSrcdocHtml } from "./trusted-types-Dx0RZlrd.js";
 import { t as require_buffer } from "./buffer-BEXn271X.js";
 import { a as showSuccess, r as showError, s as showWarning } from "./toast-DZ6r7_YI.js";
 import { getNamespacedItem, removeNamespacedItem, setNamespacedItem } from "./utils/namespacedStorage.js";
 import { t as effect } from "./effect-DL6j9HJp.js";
-import { n as splitFrontmatter, t as renderMarkdown } from "./markdown-eeSTFnMA.js";
+import { n as splitFrontmatter, t as renderMarkdown } from "./markdown-C6EHl9zs.js";
 import { t as isTruthyConfigValue } from "./config-value-Cxggje2K.js";
 import "./shadow-claw-page-header-action-button-BXXm5b5N.js";
-import "./shadow-claw-page-header-CcHUfFUx.js";
+import "./shadow-claw-page-header-Cti2fzf-.js";
 import { a as iframeStorageSet, c as getIframeThemeStyleHtml, i as iframeStorageGetAll, n as iframeStorageDelete, o as IframeBroadcastProxy, r as iframeStorageGet, s as getIframeHtmlClass, t as iframeStorageClear } from "./iframe-storage-proxy-Bx5GWTs0.js";
 
 //#region src/components/shadow-claw-pages/utils/announcePageChange.ts
@@ -133,13 +134,16 @@ async function buildHtmlPageSrcdoc({ content, filePath, searchParams = "", group
 	const nonce = crypto.randomUUID().replace(/-/g, "");
 	const bridgeScriptUrl = applyBasePath("/assets/file-viewer-preview-bridge.js");
 	const storageBridgeScriptUrl = applyBasePath("/assets/iframe-storage-bridge.js");
-	const approvedScripts = getApprovedCustomElementScripts();
+	const approvedScripts = getApprovedCustomElementScriptDescriptors();
 	const cspContent = getIframeCsp(nonce);
 	const configScript = typeof document !== "undefined" ? document.getElementById("shadow-claw-site-config") : null;
 	const siteConfigHtml = configScript && configScript.textContent ? `<script id="shadow-claw-site-config" type="application/json">${configScript.textContent}<\/script>` : "";
-	const searchScriptHtml = searchParams ? `<script nonce="${nonce}">(function(){try{Object.defineProperty(window.location,"search",{get:function(){return ${JSON.stringify(searchParams)};},configurable:true});}catch(e){}})();<\/script>` : "";
-	const customElementScriptsHtml = approvedScripts.map((src) => {
-		return `<script type="module" src="${src.startsWith("http://") || src.startsWith("https://") || src.startsWith("//") ? src : applyBasePath(src.startsWith("/") ? src : `/${src.replace(/^pages\/main\//, "")}`)}" nonce="${nonce}"><\/script>`;
+	const searchScriptHtml = searchParams ? `<script nonce="${nonce}">(function(){try{Object.defineProperty(globalThis.location,"search",{get:function(){return ${JSON.stringify(searchParams)};},configurable:true});}catch(e){}})();<\/script>` : "";
+	const customElementScriptsHtml = approvedScripts.map(({ src, hasInit }) => {
+		const resolvedSrc = src.startsWith("http://") || src.startsWith("https://") || src.startsWith("//") ? src : applyBasePath(src.startsWith("/") ? src : `/${src.replace(/^pages\/main\//, "")}`);
+		const tags = [`<script type="module" src="${resolvedSrc}" nonce="${nonce}"><\/script>`];
+		if (hasInit) tags.push(`<script type="module" nonce="${nonce}">import("${resolvedSrc}").then((m) => { try { if (typeof m?.init === "function") m.init(); } catch (e) { console.error("[ShadowClaw] Error executing init for " + ${JSON.stringify(resolvedSrc)}, e); } }).catch(() => {});<\/script>`);
+		return tags.join("\n");
 	}).join("\n");
 	const themeStylesheetLink = `<link rel="stylesheet" href="${applyBasePath("/theme.css")}">`;
 	return [
@@ -2303,4 +2307,4 @@ if (!customElements.get(elementName)) customElements.define(elementName, ShadowC
 
 //#endregion
 export { ShadowClawPages as t };
-//# sourceMappingURL=shadow-claw-pages-D54jF1Qq.js.map
+//# sourceMappingURL=shadow-claw-pages-BgPyIEZO.js.map