dsh-live-voice 0.2.1 → 0.2.3

package/lib/server.js

@@ -460,7 +460,9 @@ var defaultSettings = Object.freeze({
   recognitionProcessLocally: true,
   recognitionAutoInstall: true,
   voiceDetectionPreset: "natural",
+  recognitionMaxUtteranceSeconds: 60,
   microphoneEnabled: true,
+  holdToTalkEnabled: true,
   announceAssistantMessages: true,
   interruptSpeechOnUserMessage: false,
   sendingMode: "manual",

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "dsh-live-voice",
-  "version": "0.2.1",
+  "version": "0.2.3",
+  "dshTestedVersion": "0.1.6-alpha.2",
   "type": "module",
   "scripts": {
     "typecheck": "tsc --noEmit",
@@ -13,7 +14,7 @@
     "setup:hooks": "git config core.hooksPath .githooks",
     "prepack": "npm run build"
   },
-  "description": "Local-first voice conversations for DSH, with local speech recognition and synthesis and optional external providers.",
+  "description": "Local-first hands-free AI voice assistant plugin for DeepSeek Harness (DSH), with speech-to-text, text-to-speech, voice commands, and local speech engines.",
   "keywords": [
     "dsh",
     "dsh-plugin",

package/scripts/build.ts

@@ -1,6 +1,12 @@
 // @ts-nocheck
 import { build, context, type BuildOptions } from 'esbuild';
-import { rm, mkdir } from 'node:fs/promises';
+import { rm, mkdir, readFile } from 'node:fs/promises';
+
+const packageMetadata = JSON.parse(await readFile('package.json', 'utf8'));
+const versionDefine = {
+  __DLV_VERSION__: JSON.stringify(packageMetadata.version),
+  __DLV_TESTED_DSH_VERSION__: JSON.stringify(packageMetadata.dshTestedVersion),
+};
 
 const client: BuildOptions = {
   entryPoints: ['src/client/index.ts'],
@@ -10,6 +16,7 @@ const client: BuildOptions = {
   platform: 'browser',
   target: ['es2022'],
   external: ['react', 'react-dom'],
+  define: versionDefine,
   banner: {
     js: 'window.__ModuleLoader__.load({id:"dsh-live-voice",factory:(require)=>{var module={exports:{}};var exports=module.exports;',
   },
@@ -35,6 +42,7 @@ const tests: BuildOptions = {
   platform: 'node',
   target: ['node22'],
   packages: 'external',
+  define: versionDefine,
   logLevel: 'silent',
 };
 const watch = process.argv.includes('--watch');

package/src/client/components.ts

@@ -2,6 +2,17 @@
 import { createWhisperSettings } from './whisper-settings.ts';
 import { createQwenSettings } from './qwen-settings.ts';
 import { qwenVoices, usesPluginVoiceDetection, voiceDetectionPresets } from '../core/settings.ts';
+import {
+  checkLatestRelease,
+  CURRENT_VERSION,
+  DSH_BADGE_URL,
+  hasNewerRelease,
+  LIVE_VOICE_BADGE_URL,
+  RELEASES_URL,
+  REPOSITORY_URL,
+  TESTED_DSH_RELEASE_URL,
+  TESTED_DSH_VERSION,
+} from './releases.ts';
 
 // UI only: the controller owns capture, recognition, playback and policy.
 export function createComponents(React) {
@@ -216,25 +227,26 @@ export function createComponents(React) {
     const remaining = state.autoSendAt
       ? Math.max(1, Math.ceil((state.autoSendAt - now) / 1000))
       : null;
-    const status = state.answeringQuestion && state.recognizing
-      ? 'Recognizing answer…'
-      : state.answeringQuestion && state.listening
-        ? 'Listening for your answer…'
-        : remaining
-          ? `Sending in ${remaining}…`
-          : state.starting
-        ? 'Starting microphone…'
-        : state.paused
-          ? 'Speech paused'
-          : state.speaking
-            ? 'Speaking'
-            : state.recognizing
-              ? 'Recognizing speech…'
-              : state.listening
-                ? 'Listening — waiting for speech'
-                : state.conversation
-                  ? 'Conversation idle'
-                  : 'Voice ready';
+    const status =
+      state.answeringQuestion && state.recognizing
+        ? 'Recognizing answer…'
+        : state.answeringQuestion && state.listening
+          ? 'Listening for your answer…'
+          : remaining
+            ? `Sending in ${remaining}…`
+            : state.starting
+              ? 'Starting microphone…'
+              : state.paused
+                ? 'Speech paused'
+                : state.speaking
+                  ? 'Speaking'
+                  : state.recognizing
+                    ? 'Recognizing speech…'
+                    : state.listening
+                      ? 'Listening — waiting for speech'
+                      : state.conversation
+                        ? 'Conversation idle'
+                        : 'Voice ready';
     return h(
       'div',
       {
@@ -382,6 +394,17 @@ export function createComponents(React) {
     const settings = state.settings || {};
     const capabilities = state.capabilities || {};
     const tabsId = React.useId();
+    const [latestRelease, setLatestRelease] = React.useState(null);
+    React.useEffect(() => {
+      let active = true;
+      void checkLatestRelease().then((result) => {
+        if (active) setLatestRelease(result.release);
+      });
+      return () => {
+        active = false;
+      };
+    }, []);
+    const updateAvailable = hasNewerRelease(latestRelease);
     const tabs = [
       { id: 'conversation', label: 'Conversation' },
       { id: 'speech', label: 'Speech' },
@@ -482,7 +505,73 @@ export function createComponents(React) {
     return h(
       'section',
       { className: 'dlv-settings', 'aria-label': 'Live Voice settings' },
-      h('h3', null, 'Live Voice'),
+      h(
+        'div',
+        { className: 'dlv-settings-heading' },
+        h('h3', null, 'Live Voice'),
+        h(
+          'div',
+          { className: 'dlv-version-badges', 'aria-label': 'Version information' },
+          h(
+            'a',
+            {
+              className: 'dlv-shields-badge',
+              href: RELEASES_URL,
+              target: '_blank',
+              rel: 'noreferrer',
+              'aria-label': `DSH Live Voice v${CURRENT_VERSION}. Open releases`,
+              title: `DSH Live Voice v${CURRENT_VERSION}`,
+            },
+            h('img', { src: LIVE_VOICE_BADGE_URL, alt: '' }),
+            h('span', null, `v${CURRENT_VERSION}`),
+          ),
+          h(
+            'a',
+            {
+              className: 'dlv-shields-badge',
+              href: TESTED_DSH_RELEASE_URL,
+              target: '_blank',
+              rel: 'noreferrer',
+              'aria-label': `Compatible with DSH v${TESTED_DSH_VERSION}. Open release`,
+              title: `Compatible with DSH v${TESTED_DSH_VERSION}`,
+            },
+            h('img', { src: DSH_BADGE_URL, alt: '' }),
+            h('span', null, `v${TESTED_DSH_VERSION}`),
+          ),
+        ),
+        h('span', { className: 'dlv-heading-divider', 'aria-hidden': true }),
+        updateAvailable
+          ? h(
+              'a',
+              {
+                className: 'dlv-version-badge dlv-update-badge',
+                href: latestRelease.url,
+                target: '_blank',
+                rel: 'noreferrer',
+                'aria-label': `Update available: ${latestRelease.tag}. Open release`,
+                title: `Update available: ${latestRelease.tag}`,
+              },
+              h('span', { className: 'dlv-update-icon', 'aria-hidden': true }, '↑'),
+              'Update available',
+            )
+          : null,
+        updateAvailable
+          ? h('span', { className: 'dlv-heading-divider', 'aria-hidden': true })
+          : null,
+        h(
+          'a',
+          {
+            className: 'dlv-version-badge dlv-star-badge',
+            href: REPOSITORY_URL,
+            target: '_blank',
+            rel: 'noreferrer',
+            'aria-label': 'Star DSH Live Voice on GitHub',
+            title: 'Star DSH Live Voice on GitHub',
+          },
+          h('span', { className: 'dlv-star-icon', 'aria-hidden': true }, '★'),
+          'Star Us on GitHub',
+        ),
+      ),
       onClose
         ? h(Button, { label: 'Close voice settings', icon: 'close', onClick: onClose })
         : null,
@@ -709,11 +798,32 @@ export function createComponents(React) {
                       : { recognitionEngine: event.target.value },
                   ),
               },
-              h('option', { value: 'qwen-http' }, 'Qwen3 ASR — local MLX server'),
-              h('option', { value: 'browser' }, 'Browser SpeechRecognition'),
-              h('option', { value: 'whisper-http' }, 'Whisper HTTP — DSH host'),
+              h('option', { value: 'browser' }, 'Browser SpeechRecognition — Default option'),
+              h('option', { value: 'qwen-http' }, 'Qwen3 ASR — HTTP API'),
+              h('option', { value: 'whisper-http' }, 'Whisper — HTTP API'),
+              h(
+                'optgroup',
+                { label: 'Coming Soon — vote on repo issues' },
+                h('option', { value: 'webgpu', disabled: true }, 'Browser WebGPU Inference — Soon'),
+                h(
+                  'option',
+                  { value: 'sherpa-onnx', disabled: true },
+                  'sherpa-onnx Streaming — Soon',
+                ),
+                h('option', { value: 'parakeet', disabled: true }, 'NVIDIA Parakeet — Soon'),
+                h('option', { value: 'voxtral', disabled: true }, 'Voxtral Realtime — Soon'),
+              ),
             ),
           ),
+          h(
+            'small',
+            { className: 'dlv-recognition-engine-description' },
+            settings.recognitionEngine === 'qwen-http'
+              ? 'HTTP API at the configured base URL (default: http://127.0.0.1:8080/). Compatible with POST /v1/audio/transcriptions.'
+              : settings.recognitionEngine === 'whisper-http'
+                ? 'HTTP API at the configured DSH host URL (default: http://127.0.0.1:8080/inference). Audio uses the authenticated DSH host transcription route.'
+                : 'Uses the browser SpeechRecognition API. This is the default option.',
+          ),
           field('Input device', 'inputDeviceId', deviceOptions('audioinput', 'Microphone')),
           settings.recognitionEngine === 'browser'
             ? h(
@@ -884,6 +994,28 @@ export function createComponents(React) {
                     null,
                     'Controls how long a pause must last before captured speech is sent for recognition.',
                   ),
+                  h(
+                    'label',
+                    { className: 'dlv-setting-field' },
+                    'Maximum continuous speech (seconds)',
+                    h('input', {
+                      type: 'number',
+                      min: 10,
+                      max: 300,
+                      step: 1,
+                      value: settings.recognitionMaxUtteranceSeconds ?? 60,
+                      onChange: (event) => {
+                        const value = Number(event.target.value);
+                        if (Number.isInteger(value) && value >= 10 && value <= 300)
+                          invoke('updateSettings', { recognitionMaxUtteranceSeconds: value });
+                      },
+                    }),
+                    h(
+                      'small',
+                      null,
+                      'If speech never pauses, start a new transcription chunk after this duration. Default: 60 seconds.',
+                    ),
+                  ),
                   h(
                     'div',
                     {
@@ -959,6 +1091,22 @@ export function createComponents(React) {
             ? 'Sending or steering a new user message stops current or paused assistant speech.'
             : 'Sending another message does not stop the assistant audio you are already hearing.',
         ),
+        h(
+          'label',
+          { key: 'hold-to-talk', className: 'dlv-check' },
+          h('input', {
+            type: 'checkbox',
+            checked: settings.holdToTalkEnabled !== false,
+            onChange: (event) =>
+              invoke('updateSettings', { holdToTalkEnabled: event.target.checked }),
+          }),
+          ' Hold Control to talk',
+        ),
+        h(
+          'p',
+          { key: 'hold-to-talk-description', className: 'dlv-setting-description' },
+          'While a composer is open, hold Control anywhere on the page to capture speech. Release it to flush queued transcription, wait the configured send delay, queue the message, and close voice capture. Press Escape while holding to cancel.',
+        ),
         field('Listening mode', 'mode', [
           { value: 'speaker', label: 'Speakers — gated listening' },
           { value: 'headphones', label: 'Headphones — open microphone' },

package/src/client/index.ts

@@ -13,7 +13,12 @@ import { QwenHttpRecognitionEngine } from '../engines/recognition/qwen-http.ts';
 import { QwenHttpSpeakingEngine } from '../engines/speaking/qwen-http.ts';
 import { createComponents } from './components.ts';
 import { styles } from './styles.ts';
-import { assistantMessages, addressedTurn, latestUserSequence, pendingQuestionSpeech } from './chat.ts';
+import {
+  assistantMessages,
+  addressedTurn,
+  latestUserSequence,
+  pendingQuestionSpeech,
+} from './chat.ts';
 
 export const inject = ['slots', 'connection', 'uiConversation', 'uiSession'];
 export function apply(ctx) {
@@ -27,16 +32,27 @@ export function apply(ctx) {
   // composer should inherit the user's explicit choice to remain in voice mode.
   let voiceModeActive = false;
   const ownership = new VoiceOwnership();
+  const recognitionSettingKeys = new Set([
+    'recognitionEngine',
+    'recognitionProcessLocally',
+    'recognitionAutoInstall',
+    'voiceDetectionPreset',
+    'recognitionMaxUtteranceSeconds',
+  ]);
+  const changesRecognition = (next) =>
+    Object.keys(next).some((key) => recognitionSettingKeys.has(key));
   const recognitionFor = (settings, meter) =>
     settings.recognitionEngine === 'qwen-http'
       ? new QwenHttpRecognitionEngine({
           meter,
           voiceDetectionPreset: settings.voiceDetectionPreset,
+          maxUtteranceSeconds: settings.recognitionMaxUtteranceSeconds,
         })
       : settings.recognitionEngine === 'whisper-http'
         ? new WhisperHttpRecognitionEngine({
             meter,
             voiceDetectionPreset: settings.voiceDetectionPreset,
+            maxUtteranceSeconds: settings.recognitionMaxUtteranceSeconds,
           })
         : new BrowserRecognitionEngine({
             processLocally: settings.recognitionProcessLocally,
@@ -116,7 +132,8 @@ export function apply(ctx) {
             if (capture.index < capture.interaction.questions.length) {
               capture.answering = false;
               const text = pendingQuestionSpeech(capture.interaction, capture.index);
-              if (text) run(entry.controller, entry.controller.speak(text, capture.interaction.key));
+              if (text)
+                run(entry.controller, entry.controller.speak(text, capture.interaction.key));
             } else {
               entry.questionCapture = null;
               entry.controller.patch({ answeringQuestion: false });
@@ -228,7 +245,7 @@ export function apply(ctx) {
         return original(...args);
       };
     }
-    for (const method of ['startDictation', 'startConversation', 'speak']) {
+    for (const method of ['startDictation', 'startHoldToTalk', 'startConversation', 'speak']) {
       const original = controller[method].bind(controller);
       controller[method] = (...args) => {
         if (disposed || entry.closed || !entry.refs) return Promise.resolve();
@@ -351,13 +368,11 @@ export function apply(ctx) {
       let settingsRevision = 0;
       c.updateSettings = async (next) => {
         const revision = ++settingsRevision;
-        const previousEngine = c.getSnapshot().settings.recognitionEngine;
         update(next);
         browser.lang = c.getSnapshot().settings.lang;
         qwen.lang = c.getSnapshot().settings.lang;
         const settings = c.getSnapshot().settings;
-        if (previousEngine !== settings.recognitionEngine)
-          c.replaceRecognition(recognitionFor(settings, c.meter));
+        if (changesRecognition(next)) c.replaceRecognition(recognitionFor(settings, c.meter));
         localStorage.setItem('dsh-live-voice.settings', JSON.stringify(settings));
         run(c, c.refreshCapabilities());
         const active = [...controllers.values()];
@@ -368,9 +383,7 @@ export function apply(ctx) {
         if (revision !== settingsRevision || disposed || c.disposed) return;
         for (const entry of controllers.values()) {
           if (entry.closed) continue;
-          if (
-            entry.controller.getSnapshot().settings.recognitionEngine !== settings.recognitionEngine
-          )
+          if (changesRecognition(next))
             entry.controller.replaceRecognition(recognitionFor(settings, entry.controller.meter));
           entry.applySettings(settings);
           run(entry.controller, entry.controller.refreshCapabilities());
@@ -488,28 +501,49 @@ export function apply(ctx) {
       for (const entry of controllers.values())
         run(entry.controller, entry.controller.endConversation());
     };
-    const onKey = (event) => {
-      if (
-        disposed ||
-        event.defaultPrevented ||
-        !event.ctrlKey ||
-        !event.shiftKey ||
-        event.code !== 'Space' ||
-        event.repeat
-      )
-        return;
+    let holdToTalk = null;
+    const candidate = () => {
       const candidates = [...controllers.values()].filter(
         (entry) => entry.buttons > 0 && entry.composers.size > 0,
       );
-      if (candidates.length !== 1) return;
-      event.preventDefault();
-      const c = candidates[0].controller;
-      run(
-        c,
-        c.getSnapshot().listening || c.getSnapshot().starting
-          ? c.stopListening()
-          : c.startDictation(),
-      );
+      return candidates.length === 1 ? candidates[0] : null;
+    };
+    const releaseHoldToTalk = () => {
+      const entry = holdToTalk;
+      holdToTalk = null;
+      if (!entry || entry.closed) return;
+      run(entry.controller, entry.controller.releaseHoldToTalk());
+    };
+    const onKeyDown = (event) => {
+      if (disposed || event.defaultPrevented || event.repeat) return;
+      if (event.key === 'Escape' && holdToTalk) {
+        const entry = holdToTalk;
+        holdToTalk = null;
+        event.preventDefault();
+        run(entry.controller, entry.controller.cancelDictation());
+        return;
+      }
+      if (event.ctrlKey && event.shiftKey && event.code === 'Space') {
+        const entry = candidate();
+        if (!entry) return;
+        event.preventDefault();
+        const c = entry.controller;
+        run(
+          c,
+          c.getSnapshot().listening || c.getSnapshot().starting
+            ? c.stopListening()
+            : c.startDictation(),
+        );
+        return;
+      }
+      if (event.key !== 'Control' || event.altKey || event.metaKey || event.shiftKey) return;
+      const entry = candidate();
+      if (!entry || !entry.controller.getSnapshot().settings.holdToTalkEnabled) return;
+      holdToTalk = entry;
+      run(entry.controller, entry.controller.startHoldToTalk());
+    };
+    const onKeyUp = (event) => {
+      if (event.key === 'Control') releaseHoldToTalk();
     };
     const refreshCapabilities = () => {
       for (const entry of controllers.values())
@@ -522,7 +556,9 @@ export function apply(ctx) {
     window.speechSynthesis?.addEventListener?.('voiceschanged', refreshCapabilities);
     navigator.mediaDevices?.addEventListener?.('devicechange', refreshCapabilities);
     document.addEventListener('visibilitychange', visibilityChanged);
-    document.addEventListener('keydown', onKey);
+    document.addEventListener('keydown', onKeyDown);
+    document.addEventListener('keyup', onKeyUp);
+    window.addEventListener('blur', releaseHoldToTalk);
     window.addEventListener('pagehide', stop);
     return () => {
       disposed = true;
@@ -530,7 +566,9 @@ export function apply(ctx) {
       window.speechSynthesis?.removeEventListener?.('voiceschanged', refreshCapabilities);
       navigator.mediaDevices?.removeEventListener?.('devicechange', refreshCapabilities);
       document.removeEventListener('visibilitychange', visibilityChanged);
-      document.removeEventListener('keydown', onKey);
+      document.removeEventListener('keydown', onKeyDown);
+      document.removeEventListener('keyup', onKeyUp);
+      window.removeEventListener('blur', releaseHoldToTalk);
       window.removeEventListener('pagehide', stop);
       for (const entry of controllers.values()) retire(entry);
     };

package/src/client/releases.ts

@@ -0,0 +1,117 @@
+declare const __DLV_VERSION__: string;
+declare const __DLV_TESTED_DSH_VERSION__: string;
+
+// Both values are injected from package.json by scripts/build.ts.
+export const CURRENT_VERSION = __DLV_VERSION__;
+export const TESTED_DSH_VERSION = __DLV_TESTED_DSH_VERSION__;
+export const REPOSITORY_URL = 'https://github.com/victorwads/dsh-live-voice';
+export const RELEASES_URL = `${REPOSITORY_URL}/releases`;
+export const LATEST_RELEASE_API_URL =
+  'https://api.github.com/repos/victorwads/dsh-live-voice/releases/latest';
+export const RELEASE_CHECK_STORAGE_KEY = 'dsh-live-voice.latest-release-check';
+export const RELEASE_CHECK_INTERVAL_MS = 24 * 60 * 60 * 1000;
+
+export const LIVE_VOICE_BADGE_URL = 'https://cdn.simpleicons.org/npm/white';
+export const DSH_BADGE_URL = 'https://cdn.simpleicons.org/deepseek/white';
+export const TESTED_DSH_RELEASE_URL = `https://github.com/deepseek-ai/deepseek-harness/releases/tag/v${TESTED_DSH_VERSION}`;
+
+function versionParts(version) {
+  const normalized = String(version || '')
+    .trim()
+    .replace(/^v/i, '')
+    .split('+', 1)[0];
+  const [core = '', prerelease = ''] = normalized.split('-', 2);
+  const numbers = core.split('.').map((part) => {
+    const match = part.match(/^\d+/);
+    return match ? Number(match[0]) : 0;
+  });
+  while (numbers.length < 3) numbers.push(0);
+  return { numbers, prerelease: prerelease ? prerelease.split('.') : [] };
+}
+
+function compareIdentifier(left, right) {
+  const leftNumber = /^\d+$/.test(left) ? Number(left) : null;
+  const rightNumber = /^\d+$/.test(right) ? Number(right) : null;
+  if (leftNumber !== null && rightNumber !== null) return Math.sign(leftNumber - rightNumber);
+  if (leftNumber !== null) return -1;
+  if (rightNumber !== null) return 1;
+  return left.localeCompare(right);
+}
+
+export function compareVersions(left, right) {
+  const a = versionParts(left);
+  const b = versionParts(right);
+  for (let index = 0; index < Math.max(a.numbers.length, b.numbers.length); index++) {
+    const difference = (a.numbers[index] || 0) - (b.numbers[index] || 0);
+    if (difference) return Math.sign(difference);
+  }
+  if (!a.prerelease.length && !b.prerelease.length) return 0;
+  if (!a.prerelease.length) return 1;
+  if (!b.prerelease.length) return -1;
+  for (let index = 0; index < Math.max(a.prerelease.length, b.prerelease.length); index++) {
+    if (a.prerelease[index] === undefined) return -1;
+    if (b.prerelease[index] === undefined) return 1;
+    const difference = compareIdentifier(a.prerelease[index], b.prerelease[index]);
+    if (difference) return difference;
+  }
+  return 0;
+}
+
+function readCached(storage, now) {
+  try {
+    const cached = JSON.parse(storage?.getItem(RELEASE_CHECK_STORAGE_KEY) || 'null');
+    if (
+      cached &&
+      Number.isFinite(cached.checkedAt) &&
+      now - cached.checkedAt >= 0 &&
+      now - cached.checkedAt < RELEASE_CHECK_INTERVAL_MS
+    )
+      return cached;
+  } catch {}
+  return null;
+}
+
+function writeCached(storage, value) {
+  try {
+    storage?.setItem(RELEASE_CHECK_STORAGE_KEY, JSON.stringify(value));
+  } catch {}
+}
+
+export async function checkLatestRelease({
+  fetchImpl = globalThis.window?.fetch?.bind(globalThis.window),
+  storage = globalThis.window?.localStorage,
+  now = Date.now(),
+} = {}) {
+  const cached = readCached(storage, now);
+  if (cached) return cached;
+
+  // Record the attempt before requesting so a failing public endpoint is not retried on every mount.
+  const attempted = { checkedAt: now, release: null };
+  writeCached(storage, attempted);
+  if (typeof fetchImpl !== 'function') return attempted;
+
+  try {
+    const response = await fetchImpl(LATEST_RELEASE_API_URL, {
+      headers: { Accept: 'application/vnd.github+json' },
+    });
+    if (!response.ok) return attempted;
+    const body = await response.json();
+    if (typeof body?.tag_name !== 'string' || !body.tag_name.trim()) return attempted;
+    const release = {
+      tag: body.tag_name.trim(),
+      url:
+        typeof body.html_url === 'string' && body.html_url.startsWith('https://github.com/')
+          ? body.html_url
+          : RELEASES_URL,
+    };
+    const result = { checkedAt: now, release };
+    writeCached(storage, result);
+    return result;
+  } catch {
+    return attempted;
+  }
+}
+
+export function hasNewerRelease(release, currentVersion = CURRENT_VERSION) {
+  return Boolean(release?.tag && compareVersions(release.tag, currentVersion) > 0);
+}

package/src/client/styles.ts

@@ -29,12 +29,14 @@ export const styles = `
 .dlv-error{color:var(--dsw-alias-state-error-primary);overflow-wrap:anywhere;font-size:13px;max-width:720px;margin:8px auto}
 .dlv-settings{box-sizing:border-box;padding:18px;width:100%;display:grid;gap:16px;max-width:640px;color:var(--dsw-alias-label-primary)}
 .dlv-settings h3,.dlv-settings p{margin:0}
+.dlv-settings-heading{display:flex;align-items:center;gap:8px;min-width:0}.dlv-settings-heading h3{white-space:nowrap}.dlv-heading-divider{height:1px;min-width:12px;flex:1;background:var(--dsw-alias-border-l1)}.dlv-settings-heading .dlv-star-badge{flex:none}
+.dlv-version-badges{display:flex;flex:none;gap:5px;align-items:center}.dlv-shields-badge{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:20px;gap:4px;padding:3px 5px;border:1px solid var(--dsw-alias-border-l1);border-radius:5px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-secondary);font-size:10px;font-weight:650;line-height:12px;text-decoration:none}.dlv-shields-badge img{display:block;width:12px;height:12px;max-width:100%}.dlv-shields-badge:focus-visible{border-radius:4px;outline:2px solid var(--dsw-alias-label-primary);outline-offset:3px}.dlv-version-badge{display:inline-flex;align-items:center;min-height:24px;box-sizing:border-box;padding:3px 8px;border:1px solid var(--dsw-alias-border-l1);border-radius:999px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-secondary);font-size:11px;font-weight:650;line-height:16px;text-decoration:none}.dlv-version-badges a.dlv-version-badge:hover{border-color:var(--dsw-alias-border-l2);color:var(--dsw-alias-label-primary)}.dlv-star-badge{padding:4px 10px;color:var(--dsw-alias-label-primary)}.dlv-update-icon{margin-right:4px;font-size:14px;line-height:1}.dlv-star-icon{margin-right:4px;color:#f59e0b;font-size:14px;line-height:1;text-shadow:0 0 8px rgba(245,158,11,.28)}.dlv-version-badges a.dlv-star-badge:hover{border-color:#f59e0b;background:rgba(245,158,11,.08)}.dlv-update-badge{border-color:var(--dsw-alias-state-business-primary);color:var(--dsw-alias-state-business-primary)}
 .dlv-settings-tabs{border-bottom:.5px solid var(--dsw-alias-border-l2);display:flex;align-items:flex-end;gap:22px;overflow-x:auto}.dlv-settings-tab{position:relative;flex:none;padding:7px 1px 9px;border:0;background:transparent;color:var(--dsw-alias-label-tertiary);font:inherit;font-size:13px;line-height:20px;cursor:pointer}.dlv-settings-tab:hover,.dlv-settings-tab[data-active=true]{color:var(--dsw-alias-label-primary)}.dlv-settings-tab[data-active=true]:after,.dlv-settings-tab:focus-visible:after{content:"";position:absolute;right:0;bottom:-1px;left:0;height:2px;border-radius:2px 2px 0 0;background:var(--dsw-alias-label-primary)}.dlv-settings-tab:focus-visible{border-radius:2px;outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:2px;color:var(--dsw-alias-label-primary)}.dlv-settings-panel{min-width:0;padding-top:2px}.dlv-settings-panel[hidden]{display:none}.dlv-settings-group{margin:0;border:1px solid var(--dsw-alias-border-l1);border-radius:10px;min-width:0;display:grid;gap:14px;padding:16px}.dlv-settings-group legend{padding:0 6px;font-weight:600;color:var(--dsw-alias-label-primary)}.dlv-settings-card-body{display:grid;gap:12px;padding:12px 0}.dlv-settings-subcard{border:1px solid var(--dsw-alias-border-l2);border-radius:8px;min-width:0}.dlv-settings-subcard>summary{cursor:pointer;font-weight:650;list-style:none;display:flex;align-items:center;justify-content:space-between;padding:10px}.dlv-settings-subcard>summary::-webkit-details-marker{display:none}.dlv-settings-subcard>summary:after{content:"›";transform:rotate(90deg);transition:transform .15s}.dlv-settings-subcard:not([open])>summary:after{transform:rotate(0)}.dlv-settings-subcard-body{display:grid;gap:10px;padding:0 10px 10px}
 .dlv-settings label{display:grid;gap:6px;font-size:14px}.dlv-settings label.dlv-check{display:flex;align-items:center;gap:8px}.dlv-settings label.dlv-check input{width:auto}
 .dlv-settings :is(input,select,textarea){box-sizing:border-box;width:100%;padding:8px;border:1px solid var(--dsw-alias-border-l2);border-radius:8px;background:var(--dsw-alias-bg-layer-1);color:inherit;font:inherit}
 .dlv-settings small,.dlv-settings p{font-size:13px;color:var(--dsw-alias-label-secondary);line-height:1.5}
 .dlv-preset-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.dlv-settings label.dlv-preset{display:flex;align-items:flex-start;gap:8px;padding:10px;border:1px solid var(--dsw-alias-border-l1);border-radius:8px;cursor:pointer}.dlv-settings label.dlv-preset:has(input:checked){border-color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-1)}.dlv-settings label.dlv-preset input{width:auto;margin-top:3px}.dlv-preset span{display:grid;gap:3px}.dlv-vad-summary{font-weight:500}
 .dlv-settings-actions{display:flex;flex-wrap:wrap;gap:8px}.dlv-settings-actions button{padding:8px 12px;border:1px solid var(--dsw-alias-border-l2);border-radius:8px;background:var(--dsw-alias-bg-layer-1);color:inherit;cursor:pointer}.dlv-settings-actions button:disabled{opacity:.45;cursor:default}
-@media(max-width:480px){.dlv-preset-group{grid-template-columns:1fr}.dlv-pill{flex-wrap:wrap}.dlv-wave{flex-basis:90px}.dlv-status{flex-basis:100px}}
+@media(max-width:480px){.dlv-settings-heading{gap:6px}.dlv-heading-divider{min-width:4px}.dlv-settings-heading .dlv-star-badge{padding:3px 6px;font-size:10px}.dlv-preset-group{grid-template-columns:1fr}.dlv-pill{flex-wrap:wrap}.dlv-wave{flex-basis:90px}.dlv-status{flex-basis:100px}}
 `;
 export default styles;