@goodandready/dsh-cost-meter 0.8.29 → 0.8.30

package/lib/client.js

@@ -42,6 +42,8 @@ window.__ModuleLoader__.load({
       'badge.deepseek': 'DeepSeek tariff: active',
       'section.general': 'General Parameters',
       'section.general_desc': 'Display currency, conversion rate, budget threshold and time zone configuration',
+      'section.visibility': 'Widget Visibility & Privacy',
+      'section.visibility_desc': 'Configure widget visibility in the conversation header and messages, or enable privacy mode',
       'section.openrouter': 'OpenRouter Pricing Catalog',
       'section.openrouter_desc': 'Public catalog for dynamic model pricing and discount windows',
       'section.diagnostics': 'Diagnostics & Status',
@@ -179,6 +181,8 @@ window.__ModuleLoader__.load({
       'badge.deepseek': 'DeepSeek 费率：生效中',
       'section.general': '基础参数',
       'section.general_desc': '显示货币、汇率转换、预算阈值与时区设置',
+      'section.visibility': '组件显示与隐私设置',
+      'section.visibility_desc': '配置对话顶部与消息栏组件的显示状态，或开启隐私保护模式',
       'section.openrouter': 'OpenRouter 定价目录',
       'section.openrouter_desc': '用于自动获取模型价格与折扣窗口的公开价格目录',
       'section.diagnostics': '诊断与状态',
@@ -741,24 +745,30 @@ window.__ModuleLoader__.load({
       const status = (snapshot && snapshot.status) || 'loading'
       const stored = (snapshot && snapshot.value) || {}
 
+      const initDraft = React.useCallback((s) => {
+        const val = s || {}
+        return {
+          currency: val.currency !== undefined ? String(val.currency) : '$',
+          usdRate: val.usdRate !== undefined ? String(val.usdRate) : '1',
+          budgetThreshold: val.budgetThreshold !== undefined ? String(val.budgetThreshold) : '0',
+          displayTimeZone: val.displayTimeZone !== undefined ? String(val.displayTimeZone) : 'Europe/Moscow',
+          displayMode: val.displayMode !== undefined ? String(val.displayMode) : 'auto',
+          alertBeforeSwitch: val.alertBeforeSwitch !== undefined ? Boolean(val.alertBeforeSwitch) : true,
+          alertLeadMinutes: val.alertLeadMinutes !== undefined ? String(val.alertLeadMinutes) : '5',
+          browserNotifications: val.browserNotifications !== undefined ? Boolean(val.browserNotifications) : false,
+          privacyMode: val.privacyMode !== undefined ? Boolean(val.privacyMode) : false,
+          showHeaderChip: val.showHeaderChip !== undefined ? Boolean(val.showHeaderChip) : true,
+          showMessageAction: val.showMessageAction !== undefined ? Boolean(val.showMessageAction) : true,
+          useOpenRouter: val.useOpenRouter !== undefined ? Boolean(val.useOpenRouter) : true,
+          refreshHours: val.refreshHours !== undefined ? String(val.refreshHours) : '24',
+        }
+      }, [])
+
       React.useEffect(() => {
         if (status === 'ready' && draft === null) {
-          setDraft({
-            currency: stored.currency !== undefined ? String(stored.currency) : '$',
-            usdRate: stored.usdRate !== undefined ? String(stored.usdRate) : '1',
-            budgetThreshold: stored.budgetThreshold !== undefined ? String(stored.budgetThreshold) : '0',
-            displayTimeZone: stored.displayTimeZone !== undefined ? String(stored.displayTimeZone) : 'Europe/Moscow',
-            alertBeforeSwitch: stored.alertBeforeSwitch !== undefined ? Boolean(stored.alertBeforeSwitch) : true,
-            alertLeadMinutes: stored.alertLeadMinutes !== undefined ? String(stored.alertLeadMinutes) : '5',
-            browserNotifications: stored.browserNotifications !== undefined ? Boolean(stored.browserNotifications) : false,
-            privacyMode: stored.privacyMode !== undefined ? Boolean(stored.privacyMode) : false,
-            showHeaderChip: stored.showHeaderChip !== undefined ? Boolean(stored.showHeaderChip) : true,
-            showMessageAction: stored.showMessageAction !== undefined ? Boolean(stored.showMessageAction) : true,
-            useOpenRouter: stored.useOpenRouter !== undefined ? Boolean(stored.useOpenRouter) : true,
-            refreshHours: stored.refreshHours !== undefined ? String(stored.refreshHours) : '24',
-          })
+          setDraft(initDraft(stored))
         }
-      }, [status, stored, draft])
+      }, [status, stored, draft, initDraft])
 
       const tzValid = draft ? isValidTimeZone(draft.displayTimeZone) : true
       const rateValid = draft ? (!isNaN(Number(draft.usdRate)) && Number(draft.usdRate) > 0) : true
@@ -829,6 +839,30 @@ window.__ModuleLoader__.load({
           } catch (e) { broken.push('displayTimeZone: ' + (e && e.message || String(e))) }
         }
 
+        try {
+          await scope.set('alertBeforeSwitch', Boolean(draft.alertBeforeSwitch))
+        } catch (e) { broken.push('alertBeforeSwitch: ' + (e && e.message || String(e))) }
+
+        try {
+          await scope.set('alertLeadMinutes', String(draft.alertLeadMinutes || '5'))
+        } catch (e) { broken.push('alertLeadMinutes: ' + (e && e.message || String(e))) }
+
+        try {
+          await scope.set('browserNotifications', Boolean(draft.browserNotifications))
+        } catch (e) { broken.push('browserNotifications: ' + (e && e.message || String(e))) }
+
+        try {
+          await scope.set('privacyMode', Boolean(draft.privacyMode))
+        } catch (e) { broken.push('privacyMode: ' + (e && e.message || String(e))) }
+
+        try {
+          await scope.set('showHeaderChip', Boolean(draft.showHeaderChip))
+        } catch (e) { broken.push('showHeaderChip: ' + (e && e.message || String(e))) }
+
+        try {
+          await scope.set('showMessageAction', Boolean(draft.showMessageAction))
+        } catch (e) { broken.push('showMessageAction: ' + (e && e.message || String(e))) }
+
         try {
           await scope.set('useOpenRouter', Boolean(draft.useOpenRouter))
         } catch (e) { broken.push('useOpenRouter: ' + (e && e.message || String(e))) }
@@ -889,7 +923,7 @@ window.__ModuleLoader__.load({
           React.createElement(Chevron, { open }),
         ),
         (page || open) ? React.createElement('div', { className: 'dcm-body' },
-          status === 'loading'
+          (status === 'loading' || !draft)
             ? React.createElement('div', { className: 'dcm-hint', style: { padding: '12px 0' } }, t('settings.loading'))
             : status !== 'ready'
               ? React.createElement('div', { className: 'dcm-alert dcm-alert-err' }, t('settings.unavailable'))
@@ -935,8 +969,8 @@ window.__ModuleLoader__.load({
                         React.createElement('label', { className: 'dcm-label' }, t('field.currency')),
                         React.createElement('input', {
                           className: 'dcm-input',
-                          value: (draft && draft.currency) !== undefined ? draft.currency : '',
-                          onChange: (e) => setDraft({ ...draft, currency: e.target.value }),
+                          value: draft?.currency ?? '',
+                          onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), currency: v })) },
                         }),
                         React.createElement('span', { className: 'dcm-hint' }, t('hint.currency')),
                       ),
@@ -946,8 +980,8 @@ window.__ModuleLoader__.load({
                           className: 'dcm-input' + (rateValid ? '' : ' dcm-input-err'),
                           type: 'number',
                           step: 'any',
-                          value: (draft && draft.usdRate) !== undefined ? draft.usdRate : '',
-                          onChange: (e) => setDraft({ ...draft, usdRate: e.target.value }),
+                          value: draft?.usdRate ?? '',
+                          onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), usdRate: v })) },
                         }),
                         React.createElement('span', { className: 'dcm-hint' }, t('hint.usdRate')),
                       ),
@@ -960,8 +994,8 @@ window.__ModuleLoader__.load({
                           type: 'number',
                           step: 'any',
                           min: 0,
-                          value: (draft && draft.budgetThreshold) !== undefined ? draft.budgetThreshold : '',
-                          onChange: (e) => setDraft({ ...draft, budgetThreshold: e.target.value }),
+                          value: draft?.budgetThreshold ?? '',
+                          onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), budgetThreshold: v })) },
                         }),
                         React.createElement('span', { className: 'dcm-hint' }, t('hint.budgetThreshold')),
                       ),
@@ -969,8 +1003,8 @@ window.__ModuleLoader__.load({
                         React.createElement('label', { className: 'dcm-label' }, t('field.displayTimeZone')),
                         React.createElement('input', {
                           className: 'dcm-input' + (tzValid ? '' : ' dcm-input-err'),
-                          value: (draft && draft.displayTimeZone) !== undefined ? draft.displayTimeZone : '',
-                          onChange: (e) => setDraft({ ...draft, displayTimeZone: e.target.value }),
+                          value: draft?.displayTimeZone ?? '',
+                          onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), displayTimeZone: v })) },
                         }),
                         React.createElement('span', { className: 'dcm-hint' },
                           tzValid ? t('hint.displayTimeZone') : t('tz.invalid')
@@ -981,8 +1015,8 @@ window.__ModuleLoader__.load({
                       React.createElement('label', { className: 'dcm-label' }, t('field.displayMode')),
                       React.createElement('select', {
                         className: 'dcm-input',
-                        value: (draft && draft.displayMode) || 'auto',
-                        onChange: (e) => setDraft({ ...draft, displayMode: e.target.value }),
+                        value: draft?.displayMode || 'auto',
+                        onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), displayMode: v })) },
                       }, [
                         React.createElement('option', { key: 'auto', value: 'auto' }, t('mode.auto')),
                         React.createElement('option', { key: 'full', value: 'full' }, t('mode.full')),
@@ -1001,8 +1035,8 @@ window.__ModuleLoader__.load({
                         id: 'dcm-alert-switch',
                         type: 'checkbox',
                         className: 'dcm-check',
-                        checked: draft ? Boolean(draft.alertBeforeSwitch) : true,
-                        onChange: (e) => setDraft({ ...draft, alertBeforeSwitch: e.target.checked }),
+                        checked: Boolean(draft?.alertBeforeSwitch ?? true),
+                        onChange: (e) => { const c = e.target.checked; setDraft((d) => ({ ...(d || {}), alertBeforeSwitch: c })) },
                       }),
                       React.createElement('label', { htmlFor: 'dcm-alert-switch', className: 'dcm-label', style: { cursor: 'pointer' } }, t('field.alertBeforeSwitch')),
                     ),
@@ -1012,8 +1046,8 @@ window.__ModuleLoader__.load({
                         React.createElement('label', { className: 'dcm-label' }, t('field.alertLeadMinutes')),
                         React.createElement('select', {
                           className: 'dcm-input',
-                          value: (draft && draft.alertLeadMinutes) || '5',
-                          onChange: (e) => setDraft({ ...draft, alertLeadMinutes: e.target.value }),
+                          value: draft?.alertLeadMinutes || '5',
+                          onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), alertLeadMinutes: v })) },
                         }, [
                           React.createElement('option', { key: '1', value: '1' }, '1 min'),
                           React.createElement('option', { key: '2', value: '2' }, '2 min'),
@@ -1029,10 +1063,10 @@ window.__ModuleLoader__.load({
                             id: 'dcm-browser-notif',
                             type: 'checkbox',
                             className: 'dcm-check',
-                            checked: draft ? Boolean(draft.browserNotifications) : false,
+                            checked: Boolean(draft?.browserNotifications ?? false),
                             onChange: (e) => {
                               const checked = e.target.checked
-                              setDraft({ ...draft, browserNotifications: checked })
+                              setDraft((d) => ({ ...(d || {}), browserNotifications: checked }))
                               if (checked && typeof Notification !== 'undefined' && Notification.permission !== 'granted') {
                                 Notification.requestPermission()
                               }
@@ -1058,6 +1092,51 @@ window.__ModuleLoader__.load({
                     ),
                   ),
 
+                  // Section: Widget Visibility & Privacy Mode (Issues #121, #165, #168)
+                  React.createElement('div', { className: 'dcm-section-card' },
+                    React.createElement('div', { className: 'dcm-section-title' }, t('section.visibility')),
+                    React.createElement('div', { className: 'dcm-section-desc' }, t('section.visibility_desc')),
+                    React.createElement('div', { className: 'dcm-row-check' },
+                      React.createElement('input', {
+                        id: 'dcm-show-header-chip',
+                        type: 'checkbox',
+                        className: 'dcm-check',
+                        checked: Boolean(draft?.showHeaderChip ?? true),
+                        onChange: (e) => { const c = e.target.checked; setDraft((d) => ({ ...(d || {}), showHeaderChip: c })) },
+                      }),
+                      React.createElement('label', { htmlFor: 'dcm-show-header-chip', className: 'dcm-label', style: { cursor: 'pointer' } }, t('field.showHeaderChip')),
+                    ),
+                    React.createElement('span', { className: 'dcm-hint', style: { marginTop: -6 } }, t('hint.showHeaderChip')),
+
+                    React.createElement('div', { className: 'dcm-row-check', style: { marginTop: 10 } },
+                      React.createElement('input', {
+                        id: 'dcm-show-msg-action',
+                        type: 'checkbox',
+                        className: 'dcm-check',
+                        checked: Boolean(draft?.showMessageAction ?? true),
+                        onChange: (e) => { const c = e.target.checked; setDraft((d) => ({ ...(d || {}), showMessageAction: c })) },
+                      }),
+                      React.createElement('label', { htmlFor: 'dcm-show-msg-action', className: 'dcm-label', style: { cursor: 'pointer' } }, t('field.showMessageAction')),
+                    ),
+                    React.createElement('span', { className: 'dcm-hint', style: { marginTop: -6 } }, t('hint.showMessageAction')),
+
+                    React.createElement('div', { className: 'dcm-row-check', style: { marginTop: 10 } },
+                      React.createElement('input', {
+                        id: 'dcm-privacy-mode',
+                        type: 'checkbox',
+                        className: 'dcm-check',
+                        checked: Boolean(draft?.privacyMode ?? false),
+                        onChange: (e) => { const c = e.target.checked; setDraft((d) => ({ ...(d || {}), privacyMode: c })) },
+                      }),
+                      React.createElement('label', { htmlFor: 'dcm-privacy-mode', className: 'dcm-label', style: { cursor: 'pointer' } }, t('field.privacyMode')),
+                    ),
+                    React.createElement('span', { className: 'dcm-hint', style: { marginTop: -6 } }, t('hint.privacyMode')),
+
+                    (!draft?.showHeaderChip || !draft?.showMessageAction)
+                      ? React.createElement('div', { className: 'dcm-alert dcm-alert-warn', style: { marginTop: 10, fontSize: 12 } }, t('notice.hidden_access'))
+                      : null,
+                  ),
+
                   // Section 2: OpenRouter Pricing Catalog
                   React.createElement('div', { className: 'dcm-section-card' },
                     React.createElement('div', { className: 'dcm-section-title' },
@@ -1078,8 +1157,8 @@ window.__ModuleLoader__.load({
                         id: 'dcm-use-openrouter',
                         type: 'checkbox',
                         className: 'dcm-check',
-                        checked: draft ? Boolean(draft.useOpenRouter) : true,
-                        onChange: (e) => setDraft({ ...draft, useOpenRouter: e.target.checked }),
+                        checked: Boolean(draft?.useOpenRouter ?? true),
+                        onChange: (e) => { const c = e.target.checked; setDraft((d) => ({ ...(d || {}), useOpenRouter: c })) },
                       }),
                       React.createElement('label', { htmlFor: 'dcm-use-openrouter', className: 'dcm-label', style: { cursor: 'pointer' } }, t('field.useOpenRouter')),
                     ),
@@ -1091,8 +1170,8 @@ window.__ModuleLoader__.load({
                         type: 'number',
                         min: 1,
                         max: 168,
-                        value: (draft && draft.refreshHours) !== undefined ? draft.refreshHours : '',
-                        onChange: (e) => setDraft({ ...draft, refreshHours: e.target.value }),
+                        value: draft?.refreshHours ?? '',
+                        onChange: (e) => { const v = e.target.value; setDraft((d) => ({ ...(d || {}), refreshHours: v })) },
                       }),
                       React.createElement('span', { className: 'dcm-hint' }, t('hint.refreshHours')),
                     ),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@goodandready/dsh-cost-meter",
-  "version": "0.8.29",
+  "version": "0.8.30",
   "description": "DeepSeek Harness plugin: a session cost chip in the conversation header - live token usage by bucket, peak/off-peak tariff, and a countdown to the next tariff switch.",
   "type": "module",
   "main": "lib/index.js",