@goodandready/dsh-tts 0.3.2 → 0.3.3

package/lib/client.js

@@ -42,7 +42,20 @@ window.__ModuleLoader__.load({
       '.dts-bad{font-size:12px;color:var(--dsw-alias-state-error-primary)}' +
       '.dts-badge{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--dsw-alias-border-l2);color:var(--dsw-alias-label-secondary);white-space:nowrap}' +
       '.dts-badge-on{color:var(--dsw-alias-state-success-primary);border-color:currentColor}' +
-      '.dts-link{background:none;border:none;color:var(--dsw-alias-label-secondary);cursor:pointer;font-size:12px;padding:0}'
+      '.dts-link{background:none;border:none;color:var(--dsw-alias-label-secondary);cursor:pointer;font-size:12px;padding:0}' +
+      // Карточка во вкладке «Настройки плагинов» — как у соседних
+      // плагинов: li в списке ядра, шапка со сбросом темы, шеврон.
+      '.dts-card{list-style:none;border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-3);border-radius:12px;transition:border-color .16s,background .16s}' +
+      '.dts-card:hover{border-color:var(--dsw-alias-label-dimmed)}' +
+      '.dts-cardOpen{background:var(--dsw-alias-bg-layer-2);border-color:var(--dsw-alias-label-dimmed)}' +
+      '.dts-cardHead{appearance:none;width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:12px;align-items:center;gap:12px;padding:14px 16px;display:flex}' +
+      '.dts-cardHead:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:-2px}' +
+      '.dts-headText{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}' +
+      '.dts-name{color:var(--dsw-alias-label-primary);font-size:15px;font-weight:600;line-height:1.4}' +
+      '.dts-descr{color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.5}' +
+      '.dts-chev{color:var(--dsw-alias-label-tertiary);flex:none;transition:transform .16s}' +
+      '.dts-chevOpen{transform:rotate(180deg)}' +
+      '.dts-cardBody{border-top:1px solid var(--dsw-alias-border-l2);margin:0 16px;padding:16px 0 8px}'
 
     const setCssId = 'dsh-tts/settings.module.css'
     if (typeof document !== 'undefined' && !document.querySelector('style[data-plugin-css="' + setCssId + '"]')) {
@@ -568,28 +581,37 @@ window.__ModuleLoader__.load({
     }
 
 
-    // Карточка настроек во вкладке «Плагины»: заголовок, пояснение и
-    // сворачивание рисуем сами — ядро даёт только рамку списка.
+    // Карточка во вкладке «Настройки плагинов» — та же структура, что у
+    // ядра и соседних плагинов: li в списке, шапка-кнопка со сбросом
+    // темы (иначе браузерный стиль кнопки красит её фирменным акцентом),
+    // шеврон, тело с формой.
     function TtsCard(props) {
       const t = (props && props.t) || ((key) => key)
       const [open, setOpen] = React.useState(false)
-      return React.createElement('div',
-        {
-          className: 'dts-wrap',
-          style: { border: '1px solid var(--dsw-alias-border-l2)', borderRadius: '8px', marginBottom: '10px' },
+      return React.createElement('li', { className: 'dts-card' + (open ? ' dts-cardOpen' : '') },
+        React.createElement('button', {
+          type: 'button',
+          className: 'dts-cardHead',
+          onClick: () => setOpen(!open),
+          'aria-expanded': open,
         },
-        React.createElement('button',
-          {
-            type: 'button',
-            'aria-expanded': open ? 'true' : 'false',
-            onClick: () => setOpen((v) => !v),
-            style: { display: 'flex', width: '100%', gap: '8px', alignItems: 'baseline', background: 'none', border: 'none', padding: '10px 12px', cursor: 'pointer', textAlign: 'left' },
+          React.createElement('div', { className: 'dts-headText' },
+            React.createElement('div', { className: 'dts-name' }, t('title')),
+            React.createElement('div', { className: 'dts-descr' }, t('cardHint')),
+          ),
+          React.createElement('svg', {
+            className: 'dts-chev' + (open ? ' dts-chevOpen' : ''),
+            width: 16, height: 16, viewBox: '0 0 16 16', fill: 'none',
           },
-          React.createElement('strong', null, t('title')),
-          React.createElement('span', { className: 'dts-sub' }, t('cardHint')),
-          React.createElement('span', { style: { marginLeft: 'auto', color: 'var(--dsw-alias-label-secondary)' } }, open ? '\u25be' : '\u25b8'),
+            React.createElement('path', {
+              d: 'M4 6l4 4 4-4', stroke: 'currentColor', 'stroke-width': 1.5,
+              'stroke-linecap': 'round', 'stroke-linejoin': 'round',
+            }),
+          ),
         ),
-        open ? React.createElement(TtsSection, props) : null,
+        open ? React.createElement('div', { className: 'dts-cardBody' },
+          React.createElement(TtsSection, props),
+        ) : null,
       )
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@goodandready/dsh-tts",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "Text-to-speech for DeepSeek Harness: speak agent replies in the Web UI with a provider fallback chain (OpenAI, ElevenLabs, Google, Azure, Groq, Deepgram, OpenRouter, Edge, Piper, eSpeak).",
   "license": "MIT",
   "type": "module",