@nordbyte/nordrelay 0.7.0 → 0.8.1

package/dist/web-dashboard-pages.js

@@ -209,7 +209,7 @@ export function renderDashboardApp() {
 
       <section class="page" id="page-activity">
         <div class="panel">
-          <div class="row"><select id="activitySource"><option value="all">All sources</option><option value="web">Web</option><option value="telegram">Telegram</option><option value="discord">Discord</option><option value="cli">CLI</option></select><select id="activityCategory"><option value="all">All categories</option><option value="prompt">Prompt</option><option value="session">Session</option><option value="queue">Queue</option><option value="agent-update">Agent update</option><option value="artifact">Artifact</option><option value="system">System</option><option value="auth">Auth</option><option value="security">Security</option><option value="tool">Tool</option></select><select id="activityStatus"><option value="all">All statuses</option><option value="queued">Queued</option><option value="running">Running</option><option value="completed">Completed</option><option value="failed">Failed</option><option value="aborted">Aborted</option><option value="info">Info</option></select><input id="activityActor" placeholder="Actor"><input id="activityAgent" placeholder="Agent"><input id="activityThread" placeholder="Thread ID"><input id="activityWorkspace" placeholder="Workspace"><input id="activityType" placeholder="Type"><input id="activitySince" type="datetime-local"><input id="activityLimit" type="number" value="100" min="1" max="500"><button id="loadActivityBtn">Load activity</button><button id="exportActivityBtn" class="secondary">Export</button></div>
+          <div class="row"><select id="activitySource"><option value="all">All sources</option><option value="web">Web</option><option value="telegram">Telegram</option><option value="discord">Discord</option><option value="slack">Slack</option><option value="cli">CLI</option></select><select id="activityCategory"><option value="all">All categories</option><option value="prompt">Prompt</option><option value="session">Session</option><option value="queue">Queue</option><option value="agent-update">Agent update</option><option value="artifact">Artifact</option><option value="system">System</option><option value="auth">Auth</option><option value="security">Security</option><option value="tool">Tool</option></select><select id="activityStatus"><option value="all">All statuses</option><option value="queued">Queued</option><option value="running">Running</option><option value="completed">Completed</option><option value="failed">Failed</option><option value="aborted">Aborted</option><option value="info">Info</option></select><input id="activityActor" placeholder="Actor"><input id="activityAgent" placeholder="Agent"><input id="activityThread" placeholder="Thread ID"><input id="activityWorkspace" placeholder="Workspace"><input id="activityType" placeholder="Type"><input id="activitySince" type="datetime-local"><input id="activityLimit" type="number" value="100" min="1" max="500"><button id="loadActivityBtn">Load activity</button><button id="exportActivityBtn" class="secondary">Export</button></div>
           <div id="activityList" class="list"></div>
         </div>
       </section>
@@ -226,6 +226,8 @@ export function renderDashboardApp() {
         <div class="panel">
           <div class="row"><button id="reloadAdaptersBtn">Reload adapters</button></div>
           <div id="adapterHealth" class="list"></div>
+          <h2 class="task-section-title">Adapter Conformance</h2>
+          <div id="adapterConformance" class="list"></div>
         </div>
       </section>
 
@@ -242,12 +244,13 @@ export function renderDashboardApp() {
 
       <section class="page" id="page-access">
         <div class="panel">
-          <div class="row"><button id="loadAccessBtn">Reload users</button><button id="createUserBtn">Create user</button><button id="createGroupBtn" class="secondary">Create group</button><button id="createChatBtn" class="secondary">Add Telegram chat</button><button id="createDiscordChannelBtn" class="secondary">Add Discord channel</button><button id="lockSessionBtn" class="secondary">Lock web session</button><button id="unlockSessionBtn" class="secondary">Unlock web session</button></div>
+          <div class="row"><button id="loadAccessBtn">Reload users</button><button id="createUserBtn">Create user</button><button id="createGroupBtn" class="secondary">Create group</button><button id="createChatBtn" class="secondary">Add Telegram chat</button><button id="createDiscordChannelBtn" class="secondary">Add Discord channel</button><button id="createSlackChannelBtn" class="secondary">Add Slack channel</button><button id="lockSessionBtn" class="secondary">Lock web session</button><button id="unlockSessionBtn" class="secondary">Unlock web session</button></div>
           <div id="accessTabs" class="tabs access-tabs">
             <button type="button" data-access-tab="users" class="active">Users</button>
             <button type="button" data-access-tab="groups">Groups</button>
             <button type="button" data-access-tab="telegram">Telegram</button>
             <button type="button" data-access-tab="discord">Discord</button>
+            <button type="button" data-access-tab="slack">Slack</button>
             <button type="button" data-access-tab="locks">Locks</button>
             <button type="button" data-access-tab="audit">Audit</button>
           </div>
@@ -269,13 +272,20 @@ export function renderDashboardApp() {
             </div>
             <div id="discordChannelsList" class="list"></div>
           </div>
+          <div class="access-tab" data-access-tab-panel="slack">
+            <div class="access-tab-heading">
+              <h2>Slack channels</h2>
+              <input id="slackChannelSearch" placeholder="Search Slack channels">
+            </div>
+            <div id="slackChannelsList" class="list"></div>
+          </div>
           <div class="access-tab" data-access-tab-panel="locks">
             <h2>Locks</h2>
             <div id="locksList" class="list"></div>
           </div>
           <div class="access-tab" data-access-tab-panel="audit">
             <h2>Audit</h2>
-            <div class="row"><select id="auditChannel"><option value="all">All channels</option><option value="web">Web</option><option value="telegram">Telegram</option><option value="discord">Discord</option></select><select id="auditCategory"><option value="all">All categories</option><option value="prompt">Prompt</option><option value="session">Session</option><option value="queue">Queue</option><option value="agent-update">Agent update</option><option value="artifact">Artifact</option><option value="system">System</option><option value="auth">Auth</option><option value="security">Security</option><option value="tool">Tool</option></select><select id="auditStatus"><option value="all">All statuses</option><option value="ok">OK</option><option value="failed">Failed</option><option value="denied">Denied</option></select><input id="auditActor" placeholder="Actor"><input id="auditAgent" placeholder="Agent"><input id="auditThread" placeholder="Thread ID"><input id="auditWorkspace" placeholder="Workspace"><input id="auditSince" type="datetime-local"><input id="auditLimit" type="number" value="50" min="1" max="500"><button id="loadAuditBtn">Load audit</button><button id="exportAuditBtn" class="secondary">Export</button></div>
+            <div class="row"><select id="auditChannel"><option value="all">All channels</option><option value="web">Web</option><option value="telegram">Telegram</option><option value="discord">Discord</option><option value="slack">Slack</option></select><select id="auditCategory"><option value="all">All categories</option><option value="prompt">Prompt</option><option value="session">Session</option><option value="queue">Queue</option><option value="agent-update">Agent update</option><option value="artifact">Artifact</option><option value="system">System</option><option value="auth">Auth</option><option value="security">Security</option><option value="tool">Tool</option></select><select id="auditStatus"><option value="all">All statuses</option><option value="ok">OK</option><option value="failed">Failed</option><option value="denied">Denied</option></select><input id="auditActor" placeholder="Actor"><input id="auditAgent" placeholder="Agent"><input id="auditThread" placeholder="Thread ID"><input id="auditWorkspace" placeholder="Workspace"><input id="auditSince" type="datetime-local"><input id="auditLimit" type="number" value="50" min="1" max="500"><button id="loadAuditBtn">Load audit</button><button id="exportAuditBtn" class="secondary">Export</button></div>
             <div id="auditList" class="list"></div>
           </div>
         </div>
@@ -292,7 +302,7 @@ export function renderDashboardApp() {
 
       <section class="page" id="page-settings">
         <div class="panel">
-          <div class="row"><button id="saveSettingsBtn">Save settings</button><button id="restartBtn" class="secondary">Restart NordRelay</button><span id="settingsStatus"></span></div>
+          <div class="row"><button id="saveSettingsBtn">Save settings</button><button id="settingsWizardBtn" class="secondary">Setup wizard</button><button id="restartBtn" class="secondary">Restart NordRelay</button><span id="settingsStatus"></span></div>
           <div id="settingsTabs" class="tabs"></div>
           <div id="settingsForm" class="settings-grid"></div>
         </div>

package/dist/web-dashboard-peer-routes.js

@@ -1,7 +1,8 @@
 import { isPermission } from "./access-control.js";
 import { AGENT_IDS, isAgentId } from "./agent.js";
 import { ensurePeerTlsFiles, loadOrCreatePeerIdentity, } from "./peer-identity.js";
-import { pairPeer, RemoteRelayClient } from "./peer-client.js";
+import { checkPeerEndpoint, pairPeer, RemoteRelayClient } from "./peer-client.js";
+import { buildPeerReadiness, peerListenUrl } from "./peer-readiness.js";
 import { PeerStore } from "./peer-store.js";
 import { publicPeer } from "./peer-types.js";
 import { arrayStringField, objectRecord, optionalBooleanField, optionalNumberField, optionalStringField, readJsonBody, sendJson, } from "./web-dashboard-http.js";
@@ -10,15 +11,18 @@ export async function handleDashboardPeerRoute(req, res, url, options) {
     const identity = loadOrCreatePeerIdentity(options.home, options.config.peerName);
     const tls = options.config.peerTlsEnabled ? ensurePeerTlsFiles(options.home, identity.public) : null;
     if (req.method === "GET" && url.pathname === "/api/peers") {
+        const readiness = await buildPeerReadiness(options.config);
         sendJson(res, 200, store.snapshot(identity.public, {
             enabled: options.config.peerEnabled,
-            listenUrl: peerListenUrl(options.config),
+            listenUrl: readiness.listenUrl,
             requireTls: options.config.peerRequireTls,
+            readiness,
         }));
         return true;
     }
     if (req.method === "POST" && url.pathname === "/api/peers/invite") {
         const body = await readJsonBody(req);
+        const readiness = await buildPeerReadiness(options.config);
         const created = store.createInvitation({
             name: optionalStringField(body, "name"),
             expiresInMs: (optionalNumberField(body, "expiresMinutes") ?? 10) * 60 * 1000,
@@ -27,7 +31,7 @@ export async function handleDashboardPeerRoute(req, res, url, options) {
             allowedWorkspaceRoots: arrayStringField(body, "allowedWorkspaceRoots"),
             workspaceAliases: parseWorkspaceAliases(body.workspaceAliases),
         });
-        const listenUrl = peerListenUrl(options.config);
+        const listenUrl = readiness.listenUrl;
         const command = `nordrelay peer add ${listenUrl} --code ${created.code}`;
         sendJson(res, 201, {
             invitation: created.invitation,
@@ -36,10 +40,35 @@ export async function handleDashboardPeerRoute(req, res, url, options) {
             fingerprint: identity.public.fingerprint,
             tlsFingerprint: tls?.fingerprint,
             command,
+            readiness,
+            warnings: readiness.warnings,
         });
         options.auditPeerAction?.("peer_invite_created", created.invitation.name);
         return true;
     }
+    if (req.method === "POST" && url.pathname === "/api/peers/probe") {
+        const body = await readJsonBody(req);
+        const readiness = await buildPeerReadiness(options.config);
+        const peerId = optionalStringField(body, "peerId");
+        if (peerId) {
+            const probe = await new RemoteRelayClient(store).rpc(peerId, "peer.probe", {}, options.activityActor);
+            sendJson(res, 200, { type: "remote", peerId, readiness, probe });
+            return true;
+        }
+        const expectedTlsFingerprint = options.config.peerPublicUrl ? undefined : tls?.fingerprint;
+        const probe = await checkPeerEndpoint(readiness.listenUrl, { expectedTlsFingerprint });
+        sendJson(res, 200, { type: "local", readiness, probe });
+        return true;
+    }
+    const invitationMatch = url.pathname.match(/^\/api\/peers\/invitations\/([^/]+)$/);
+    if (invitationMatch?.[1] && req.method === "DELETE") {
+        const invitation = store.deleteInvitation(decodeURIComponent(invitationMatch[1]));
+        sendJson(res, 200, { removed: Boolean(invitation), invitation });
+        if (invitation) {
+            options.auditPeerAction?.("peer_invite_deleted", `${invitation.name} (${invitation.id})`);
+        }
+        return true;
+    }
     if (req.method === "POST" && (url.pathname === "/api/peers" || url.pathname === "/api/peers/pair")) {
         const body = await readJsonBody(req);
         const result = await pairPeer({
@@ -157,14 +186,6 @@ export async function handleDashboardPeerRoute(req, res, url, options) {
     }
     return false;
 }
-function peerListenUrl(config) {
-    if (config.peerPublicUrl)
-        return config.peerPublicUrl;
-    const scheme = config.peerTlsEnabled ? "https" : "http";
-    const host = config.peerHost === "0.0.0.0" || config.peerHost === "::" ? "127.0.0.1" : config.peerHost;
-    const displayHost = host.includes(":") && !host.startsWith("[") ? `[${host}]` : host;
-    return `${scheme}://${displayHost}:${config.peerPort}`;
-}
 function parseScopes(values) {
     return values.filter(isPermission);
 }

package/dist/web-dashboard.js

@@ -4,6 +4,7 @@ import os from "node:os";
 import path from "node:path";
 import { URL } from "node:url";
 import { enabledAgents } from "./agent-factory.js";
+import { buildAdapterConformanceMatrix } from "./adapter-conformance.js";
 import { listAgentAdapterDescriptors } from "./agent-adapter.js";
 import { isAgentId } from "./agent.js";
 import { AuditLogStore } from "./audit-log.js";
@@ -13,6 +14,7 @@ import { loadConfig } from "./config.js";
 import { friendlyErrorText } from "./error-messages.js";
 import { RelayRuntime } from "./relay-runtime.js";
 import { resolveDashboardEnvPath, SettingsService } from "./settings-service.js";
+import { mergeSettingsWizardTestSettings, runSettingsWizardTest } from "./settings-wizard-test.js";
 import { UserStore, publicUser } from "./user-management.js";
 import { handleDashboardAccessRoute } from "./web-dashboard-access-routes.js";
 import { handleDashboardArtifactRoute } from "./web-dashboard-artifact-routes.js";
@@ -161,6 +163,7 @@ async function handleApi(req, res, url, authUser) {
             auth: currentUserDto(authUser),
             channels: listChannelDescriptors(),
             agentAdapters: listAgentAdapterDescriptors().filter((adapter) => users.canUseAgent(authUser, adapter.id)),
+            adapterConformance: scopedAdapterConformance(authUser),
             enabledAgents: enabledAgents(config).filter((agentId) => users.canUseAgent(authUser, agentId)),
             controls: scopedControlOptions(authUser, await runtime.controlOptions()),
             status: await runtime.bootstrapStatus(),
@@ -173,6 +176,10 @@ async function handleApi(req, res, url, authUser) {
         sendJson(res, 200, scopedControlOptions(authUser, await runtime.controlOptions(agentId)));
         return;
     }
+    if (req.method === "GET" && url.pathname === "/api/adapters/conformance") {
+        sendJson(res, 200, scopedAdapterConformance(authUser));
+        return;
+    }
     if (await handleDashboardAccessRoute(req, res, url, {
         users,
         runtime,
@@ -199,6 +206,11 @@ async function handleApi(req, res, url, authUser) {
         sendJson(res, 200, await settings.update(objectRecord(body?.settings)));
         return;
     }
+    if (req.method === "POST" && url.pathname === "/api/settings/wizard/test") {
+        const body = await readJsonBody(req);
+        sendJson(res, 200, await runSettingsWizardTest(optionalStringField(body, "channel") ?? "", mergeSettingsWizardTestSettings(activeSettingsValues(config), objectRecord(body?.settings))));
+        return;
+    }
     if (await handleDashboardSessionRoute(req, res, url, {
         runtime,
         authUser,
@@ -474,6 +486,13 @@ function scopedControlOptions(authUser, options) {
         workspaces: options.workspaces.filter((workspace) => users.canUseWorkspace(authUser, workspace)),
     };
 }
+function scopedAdapterConformance(authUser) {
+    const matrix = buildAdapterConformanceMatrix();
+    return {
+        ...matrix,
+        agents: matrix.agents.filter((adapter) => users.canUseAgent(authUser, adapter.id)),
+    };
+}
 function scopedSessionPage(authUser, page) {
     return {
         ...page,
@@ -652,6 +671,21 @@ function activeSettingsValues(current) {
         DISCORD_NOTIFY_MODE: current.discordNotifyMode === current.notifyMode ? "" : current.discordNotifyMode,
         DISCORD_QUIET_HOURS: quietOverrideValue(current.discordQuietHours, current.quietHours),
         DISCORD_AUTO_SEND_ARTIFACTS: current.discordAutoSendArtifacts === current.autoSendArtifacts ? "" : boolValue(current.discordAutoSendArtifacts),
+        SLACK_ENABLED: boolValue(current.slackEnabled),
+        SLACK_BOT_TOKEN: current.slackBotToken,
+        SLACK_APP_TOKEN: current.slackAppToken,
+        SLACK_SIGNING_SECRET: current.slackSigningSecret,
+        SLACK_SOCKET_MODE: boolValue(current.slackSocketMode),
+        SLACK_PORT: String(current.slackPort),
+        SLACK_ALLOWED_TEAM_IDS: current.slackAllowedTeamIds.join(","),
+        SLACK_ALLOWED_CHANNEL_IDS: current.slackAllowedChannelIds.join(","),
+        SLACK_MESSAGE_CONTENT_ENABLED: boolValue(current.slackMessageContentEnabled),
+        SLACK_COMMAND: current.slackCommand,
+        SLACK_CLI_MIRROR_MODE: current.slackMirrorMode === current.mirrorMode ? "" : current.slackMirrorMode,
+        SLACK_CLI_MIRROR_MIN_UPDATE_MS: current.slackMirrorMinUpdateMs === current.mirrorMinUpdateMs ? "" : String(current.slackMirrorMinUpdateMs),
+        SLACK_NOTIFY_MODE: current.slackNotifyMode === current.notifyMode ? "" : current.slackNotifyMode,
+        SLACK_QUIET_HOURS: quietOverrideValue(current.slackQuietHours, current.quietHours),
+        SLACK_AUTO_SEND_ARTIFACTS: current.slackAutoSendArtifacts === current.autoSendArtifacts ? "" : boolValue(current.slackAutoSendArtifacts),
         NORDRELAY_CODEX_ENABLED: boolValue(current.codexEnabled),
         NORDRELAY_PI_ENABLED: boolValue(current.piEnabled),
         NORDRELAY_HERMES_ENABLED: boolValue(current.hermesEnabled),

package/dist/web-state.js

@@ -123,7 +123,7 @@ function isWebChatMessage(value) {
         typeof candidate.text === "string" &&
         typeof candidate.timestamp === "string" &&
         ["user", "agent", "system", "tool"].includes(candidate.role) &&
-        ["web", "telegram", "discord", "cli"].includes(candidate.source);
+        ["web", "telegram", "discord", "slack", "cli"].includes(candidate.source);
 }
 function isWebActivityEvent(value) {
     if (!value || typeof value !== "object" || Array.isArray(value)) {
@@ -133,7 +133,7 @@ function isWebActivityEvent(value) {
     return typeof candidate.id === "string" &&
         typeof candidate.timestamp === "string" &&
         typeof candidate.type === "string" &&
-        ["web", "telegram", "discord", "cli"].includes(candidate.source) &&
+        ["web", "telegram", "discord", "slack", "cli"].includes(candidate.source) &&
         ["queued", "running", "completed", "failed", "aborted", "info"].includes(candidate.status);
 }
 function normalizeSince(value) {

package/dist/webui-assets/dashboard.css

@@ -182,6 +182,15 @@
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 16px;
 }
+.conformance-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 12px;
+}
+.conformance-grid h3 {
+  margin: 0 0 8px;
+  font-size: 15px;
+}
 .session-detail-section {
   margin-top: 20px;
 }
@@ -239,6 +248,115 @@
   padding: 10px;
   margin: 0 0 12px;
 }
+.settings-wizard {
+  display: grid;
+  gap: 14px;
+  margin-top: 14px;
+}
+.wizard-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 12px;
+}
+.wizard-header h2 {
+  margin: 0 0 4px;
+}
+.wizard-header p,
+.wizard-step p,
+.wizard-card p {
+  margin: 0;
+  color: var(--muted);
+  line-height: 1.45;
+}
+.wizard-choice-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+  gap: 12px;
+}
+.wizard-card {
+  display: grid;
+  gap: 8px;
+  border: 1px solid var(--border-soft);
+  border-radius: 8px;
+  background: var(--surface-soft);
+  padding: 12px;
+  min-width: 0;
+}
+.wizard-links {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.wizard-links a {
+  font-size: 12px;
+  border: 1px solid var(--border);
+  border-radius: 999px;
+  padding: 4px 8px;
+  color: var(--accent);
+  text-decoration: none;
+  background: var(--surface);
+}
+.wizard-links a:hover {
+  text-decoration: underline;
+}
+.wizard-progress {
+  display: flex;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+.wizard-progress button {
+  background: var(--surface);
+  color: var(--text);
+  border-color: var(--border);
+  min-height: 32px;
+  height: 32px;
+  line-height: 1;
+}
+.wizard-progress button:hover {
+  background: var(--accent-strong);
+  color: white;
+  border-color: var(--accent-strong);
+}
+.wizard-progress button.active {
+  background: var(--accent);
+  color: white;
+  border-color: var(--accent);
+}
+.wizard-step {
+  display: grid;
+  gap: 12px;
+}
+.wizard-step h3 {
+  margin: 0;
+}
+.wizard-actions {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.wizard-errors {
+  display: grid;
+  gap: 6px;
+}
+.wizard-error,
+.wizard-warning {
+  border-radius: 8px;
+  padding: 8px 10px;
+  font-size: 13px;
+}
+.wizard-error {
+  border: 1px solid var(--danger);
+  color: var(--danger);
+  background: color-mix(in srgb, var(--danger) 8%, transparent);
+}
+.wizard-warning {
+  border: 1px solid #d9c27a;
+  color: #8a6a12;
+  background: var(--warn);
+}
 .task-grid,
 .metrics-grid {
   display: grid;
@@ -340,6 +458,69 @@
   gap: 8px;
   margin-top: 8px;
 }
+.peer-invite-details {
+  display: grid;
+  gap: 6px;
+  margin: 10px 0;
+  padding: 10px;
+  border: 1px solid var(--border-soft);
+  border-radius: 8px;
+  background: var(--surface);
+}
+.peer-invite-details small {
+  margin-top: 0;
+  font-weight: 700;
+}
+.peer-invite-copy,
+.peer-invite-command {
+  display: block;
+  width: 100%;
+  text-align: left;
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+.copy-id.peer-invite-command {
+  padding: 8px;
+  border: 1px solid var(--border-soft);
+  border-radius: 6px;
+  background: var(--surface);
+  color: var(--text);
+  text-decoration: none;
+}
+.copy-id.peer-invite-command:hover {
+  background: var(--accent-soft);
+  border-color: var(--accent);
+  color: var(--link);
+  text-decoration: none;
+}
+.peer-warning {
+  display: grid;
+  gap: 4px;
+  margin: 10px 0;
+  padding: 10px;
+  border: 1px solid #d9c27a;
+  border-radius: 8px;
+  background: var(--warn);
+  color: #8a6a12;
+}
+.peer-warning small {
+  color: #8a6a12;
+}
+.peer-probe-result {
+  margin-top: 10px;
+  padding: 10px;
+  border: 1px solid var(--border-soft);
+  border-radius: 8px;
+  background: var(--surface);
+}
+.peer-probe-result.ok {
+  border-color: #8ed0aa;
+  background: color-mix(in srgb, var(--accent-soft) 45%, var(--surface));
+}
+.peer-probe-result.warn {
+  border-color: #d9c27a;
+  background: var(--warn);
+}
 * {
   box-sizing: border-box;
 }
@@ -991,6 +1172,9 @@ dialog::backdrop {
   .overview-adapter-grid {
     grid-template-columns: 1fr;
   }
+  .conformance-grid {
+    grid-template-columns: 1fr;
+  }
   .chat-layout {
     grid-template-columns: 1fr;
   }
@@ -1060,4 +1244,13 @@ dialog::backdrop {
     margin-left: 0;
     justify-content: stretch;
   }
+  .wizard-header,
+  .wizard-actions {
+    align-items: stretch;
+    flex-direction: column;
+  }
+  .wizard-header button,
+  .wizard-actions button {
+    width: 100%;
+  }
 }