dsh-prompt-customizer 0.2.7 → 0.3.0

package/src/client/index.ts

@@ -1,115 +1,116 @@
-/**
- * dsh-prompt-customizer — browser half (TypeScript source).
- *
- * Registers a "提示词定制" settings section (sidebar entry) and a plugin
- * settings card. The panel fetches the effective section / tool inventory
- * from the host `/api/prompt-customizer/inventory` and lets the user block,
- * replace, inject prompt sections and hide tools. All writes go through the
- * bound settings scope (`prompt-customizer` namespace) and apply live.
- *
- * Built by tsdown into the __ModuleLoader__ factory bundle at client/client.js;
- * the only external is the loader module table's react entry.
- */
-import { createElement as h, useEffect, useState, type ReactElement } from 'react'
-import { DICT, type Translate } from './locales.ts'
-import { s } from './styles.ts'
-import type { Config, Inventory, SettingsScope } from './types.ts'
-import { SectionsTab } from './SectionsTab.tsx'
-import { ToolsTab } from './ToolsTab.tsx'
-import { PresetsTab } from './PresetsTab.tsx'
-import { PreviewTab } from './PreviewTab.tsx'
-
-const NS = 'prompt-customizer'
-const INVENTORY_URL = '/api/prompt-customizer/inventory'
-
-export const name = 'prompt-customizer'
-export const inject = ['slots', 'locale']
-
-/** The subset of the client cordis context this plugin touches. */
-interface ClientContext {
-  effect(callback: () => unknown, label?: string): void
-  locale: {
-    register(namespace: string, dicts: { zh: Record<string, string>; en: Record<string, string> }): unknown
-    bind(namespace: string): Translate
-  }
-  inject(services: string[], callback: (scoped: SettingsScopeHost) => void): void
-}
-
-/** The host surface the settings card needs (settingsScope transport). */
-interface SettingsScopeHost {
-  settingsScope: {
-    bind(options: { namespace: string }): SettingsScope
-  }
-  slots: {
-    inject(name: string, register: () => unknown): void
-    register(meta: Record<string, unknown>, render: () => unknown): unknown
-  }
-}
-
-export function apply(ctx: ClientContext): void {
-  ctx.effect(() => ctx.locale.register(NS, DICT), 'prompt-customizer: locale')
-  const t = ctx.locale.bind(NS)
-
-  // Register a standalone settings section (sidebar menu entry) so the panel
-  // only appears under "提示词定制", not as a card inside the "插件" settings
-  // list. Goes through a NESTED inject of settingsScope so the panel can
-  // read/write the namespace config; on hosts without the settings transport
-  // it stays hidden instead of unmounting the whole plugin.
-  ctx.inject(['settingsScope'], (scoped) => {
-    const scope = scoped.settingsScope.bind({ namespace: NS })
-
-    scoped.slots.inject('settings.section', () => scoped.slots.register({
-      name: 'settings.section',
-      id: 'prompt-customizer',
-      order: 50,
-      label: () => t('nav'),
-      locale: NS,
-      inject: () => ({ t }),
-    }, () => h(Panel, { scope, t })))
-  })
-}
-
-// ── Root panel ──────────────────────────────────────────────────────────────
-
-function Panel({ scope, t }: { scope: SettingsScope; t: Translate }): ReactElement {
-  const [snap, setSnap] = useState(() => scope.getSnapshot())
-  const [inv, setInv] = useState<Inventory | null>(null)
-  const [tab, setTab] = useState<'sections' | 'tools' | 'presets' | 'preview'>('sections')
-  const [error, setError] = useState<string | null>(null)
-
-  useEffect(() => scope.subscribe(() => setSnap(scope.getSnapshot())), [scope])
-
-  const refresh = (): void => {
-    fetch(INVENTORY_URL)
-      .then((r) => r.json())
-      .then((data: Inventory) => { setInv(data); setError(null) })
-      .catch((e: unknown) => setError(String(e instanceof Error ? e.message : e)))
-  }
-  useEffect(refresh, [])
-
-  if (snap.status !== 'ready' && snap.value === undefined) {
-    return h('div', { style: s.muted }, t('loading'))
-  }
-
-  const cfg: Config = snap.value && typeof snap.value === 'object'
-    ? snap.value as Config
-    : { sections: [], replace: {}, inject: [], tools: { exclude: [], include: [] } }
-
-  return h('div', { style: s.root }, [
-    h('div', { style: s.bar }, [
-      h('button', { style: tab === 'sections' ? s.tabActive : s.tab, onClick: () => setTab('sections') }, t('tabsSections')),
-      h('button', { style: tab === 'tools' ? s.tabActive : s.tab, onClick: () => setTab('tools') }, t('tabsTools')),
-      h('button', { style: tab === 'presets' ? s.tabActive : s.tab, onClick: () => setTab('presets') }, t('tabsPresets')),
-      h('button', { style: tab === 'preview' ? s.tabActive : s.tab, onClick: () => setTab('preview') }, t('tabsPreview')),
-      h('button', { style: s.refresh, onClick: refresh }, t('refresh')),
-    ]),
-    error ? h('div', { style: s.error }, String(error)) : null,
-    tab === 'sections'
-      ? h(SectionsTab, { cfg, inv, scope, t })
-      : tab === 'tools'
-        ? h(ToolsTab, { cfg, inv, scope, t })
-        : tab === 'presets'
-          ? h(PresetsTab, { cfg, inv, scope, t })
-          : h(PreviewTab, { scope, t }),
-  ])
-}
+/**
+ * dsh-prompt-customizer — browser half (TypeScript source).
+ *
+ * Registers a "提示词定制" settings section (sidebar entry) and a plugin
+ * settings card. The panel fetches the effective section / tool inventory
+ * from the host `/api/prompt-customizer/inventory` and lets the user block,
+ * replace, inject prompt sections and hide tools. All writes go through the
+ * bound settings scope (`prompt-customizer` namespace) and apply live.
+ *
+ * Built by tsdown into the __ModuleLoader__ factory bundle at client/client.js;
+ * the only external is the loader module table's react entry.
+ */
+import { createElement as h, useEffect, useState, type ReactElement } from 'react'
+import { DICT, type Translate } from './locales.ts'
+import { s } from './styles.ts'
+import type { Config, Inventory, SettingsScope } from './types.ts'
+import { SectionsTab } from './SectionsTab.tsx'
+import { ToolsTab } from './ToolsTab.tsx'
+import { PresetsTab } from './PresetsTab.tsx'
+import { PreviewTab } from './PreviewTab.tsx'
+
+const NS = 'prompt-customizer'
+const INVENTORY_URL = '/api/prompt-customizer/inventory'
+
+export const name = 'prompt-customizer'
+export const inject = ['slots', 'locale']
+
+/** The subset of the client cordis context this plugin touches. */
+interface ClientContext {
+  effect(callback: () => unknown, label?: string): void
+  locale: {
+    register(namespace: string, dicts: { zh: Record<string, string>; en: Record<string, string> }): unknown
+    bind(namespace: string): Translate
+  }
+  inject(services: string[], callback: (scoped: SettingsScopeHost) => void): void
+}
+
+/** The host surface the settings card needs (settingsScope transport). */
+interface SettingsScopeHost {
+  settingsScope: {
+    bind(options: { namespace: string }): SettingsScope
+  }
+  slots: {
+    inject(name: string, register: () => unknown): void
+    register(meta: Record<string, unknown>, render: () => unknown): unknown
+  }
+}
+
+export function apply(ctx: ClientContext): void {
+  ctx.effect(() => ctx.locale.register(NS, DICT), 'prompt-customizer: locale')
+  const t = ctx.locale.bind(NS)
+
+  // Register a standalone settings section (sidebar menu entry) so the panel
+  // only appears under "提示词定制", not as a card inside the "插件" settings
+  // list. Goes through a NESTED inject of settingsScope so the panel can
+  // read/write the namespace config; on hosts without the settings transport
+  // it stays hidden instead of unmounting the whole plugin.
+  ctx.inject(['settingsScope'], (scoped) => {
+    const scope = scoped.settingsScope.bind({ namespace: NS })
+
+    scoped.slots.inject('settings.section', () => scoped.slots.register({
+      name: 'settings.section',
+      id: 'prompt-customizer',
+      order: 50,
+      label: () => t('nav'),
+      locale: NS,
+      inject: () => ({ t }),
+    }, () => h(Panel, { scope, t })))
+  })
+}
+
+// ── Root panel ──────────────────────────────────────────────────────────────
+
+function Panel({ scope, t }: { scope: SettingsScope; t: Translate }): ReactElement {
+  const [snap, setSnap] = useState(() => scope.getSnapshot())
+  const [inv, setInv] = useState<Inventory | null>(null)
+  const [tab, setTab] = useState<'sections' | 'tools' | 'presets' | 'preview'>('sections')
+  const [error, setError] = useState<string | null>(null)
+  const [refreshId, setRefreshId] = useState(0)
+
+  useEffect(() => scope.subscribe(() => setSnap(scope.getSnapshot())), [scope])
+
+  const refresh = (): void => {
+    fetch(INVENTORY_URL)
+      .then((r) => r.json())
+      .then((data: Inventory) => { setInv(data); setError(null); setRefreshId((n) => n + 1) })
+      .catch((e: unknown) => setError(String(e instanceof Error ? e.message : e)))
+  }
+  useEffect(refresh, [])
+
+  if (snap.status !== 'ready' && snap.value === undefined) {
+    return h('div', { style: s.muted }, t('loading'))
+  }
+
+  const cfg: Config = snap.value && typeof snap.value === 'object'
+    ? snap.value as Config
+    : { sections: [], replace: {}, inject: [], tools: { exclude: [], include: [] } }
+
+  return h('div', { style: s.root }, [
+    h('div', { style: s.bar }, [
+      h('button', { style: tab === 'sections' ? s.tabActive : s.tab, onClick: () => setTab('sections') }, t('tabsSections')),
+      h('button', { style: tab === 'tools' ? s.tabActive : s.tab, onClick: () => setTab('tools') }, t('tabsTools')),
+      h('button', { style: tab === 'presets' ? s.tabActive : s.tab, onClick: () => setTab('presets') }, t('tabsPresets')),
+      h('button', { style: tab === 'preview' ? s.tabActive : s.tab, onClick: () => setTab('preview') }, t('tabsPreview')),
+      h('button', { style: s.refresh, onClick: refresh }, t('refresh')),
+    ]),
+    error ? h('div', { style: s.error }, String(error)) : null,
+    tab === 'sections'
+      ? h(SectionsTab, { cfg, inv, scope, t })
+      : tab === 'tools'
+        ? h(ToolsTab, { cfg, inv, scope, t })
+        : tab === 'presets'
+          ? h(PresetsTab, { cfg, inv, scope, t })
+          : h(PreviewTab, { scope, t, active: tab === 'preview', refreshId }),
+  ])
+}

package/src/client/locales.ts

@@ -1,97 +1,101 @@
-/** Locale dictionaries for the prompt-customizer panel. */
-export const DICT = {
-  zh: {
-    nav: '提示词定制',
-    loading: '加载中…',
-    unavailable: '当前环境未启用本命名空间。',
-    tabsSections: '提示词',
-    tabsTools: '工具',
-    tabsPresets: '预设',
-    tabsPreview: '预览',
-    refresh: '刷新',
-    blockedOff: '未屏蔽',
-    blockedOn: '已屏蔽',
-    replaced: '已替换',
-    manual: '手动',
-    system: '系统',
-    replace: '编辑',
-    clearReplace: '清除',
-    injectNew: '注入新段',
-    name: '名称',
-    order: '顺序',
-    text: '文本',
-    add: '添加',
-    hiddenOff: '可见',
-    hiddenOn: '已隐藏',
-    selectAll: '全选',
-    selectNone: '全不选',
-    empty: '（空）',
-    dynamic: '<动态生成>',
-    drag: '拖动排序',
-    moveUp: '上移',
-    moveDown: '下移',
-    previewHint: '以下为屏蔽/替换/注入后的最终系统提示词：',
-    previewPrompt: '提示词预览',
-    previewSections: '段',
-    previewTools: '工具预览',
-    previewToolCount: '个工具',
-    savePreset: '保存当前为预设',
-    presetName: '预设名称',
-    save: '保存',
-    importPreset: '导入预设',
-    import: '导入',
-    apply: '应用',
-    export: '导出',
-    delete: '删除',
-    active: '使用中',
-    preset: '预设',
-  },
-  en: {
-    nav: 'Prompt Customizer',
-    loading: 'Loading…',
-    unavailable: 'Namespace unavailable in this environment.',
-    tabsSections: 'Sections',
-    tabsTools: 'Tools',
-    tabsPresets: 'Presets',
-    tabsPreview: 'Preview',
-    refresh: 'Refresh',
-    blockedOff: 'Active',
-    blockedOn: 'Blocked',
-    replaced: 'Replaced',
-    manual: 'Manual',
-    system: 'System',
-    replace: 'Replace',
-    clearReplace: 'Clear',
-    injectNew: 'Inject section',
-    name: 'Name',
-    order: 'Order',
-    text: 'Text',
-    add: 'Add',
-    hiddenOff: 'Visible',
-    hiddenOn: 'Hidden',
-    selectAll: 'Select all',
-    selectNone: 'Select none',
-    empty: '(empty)',
-    dynamic: '<dynamic>',
-    drag: 'Drag to reorder',
-    moveUp: 'Move up',
-    moveDown: 'Move down',
-    previewHint: 'Final system prompt after block/replace/inject:',
-    previewPrompt: 'Prompt preview',
-    previewSections: 'sections',
-    previewTools: 'Tools preview',
-    previewToolCount: 'tools',
-    savePreset: 'Save current as preset',
-    presetName: 'Preset name',
-    save: 'Save',
-    importPreset: 'Import preset',
-    import: 'Import',
-    apply: 'Apply',
-    export: 'Export',
-    delete: 'Delete',
-    active: 'Active',
-    preset: 'Preset',
-  },
-} as const
-
-export type Translate = (key: string) => string
+/** Locale dictionaries for the prompt-customizer panel. */
+export const DICT = {
+  zh: {
+    nav: '提示词定制',
+    loading: '加载中…',
+    unavailable: '当前环境未启用本命名空间。',
+    tabsSections: '提示词',
+    tabsTools: '工具',
+    tabsPresets: '预设',
+    tabsPreview: '预览',
+    refresh: '刷新',
+    blockedOff: '未屏蔽',
+    blockedOn: '已屏蔽',
+    replaced: '已替换',
+    manual: '手动',
+    system: '系统',
+    replace: '编辑',
+    clearReplace: '清除',
+    clearInput: '清空',
+    injectNew: '注入新段',
+    name: '名称',
+    order: '顺序',
+    text: '文本',
+    add: '添加',
+    hiddenOff: '可见',
+    hiddenOn: '已隐藏',
+    selectAll: '全选',
+    selectNone: '全不选',
+    empty: '（空）',
+    dynamic: '<动态生成>',
+    drag: '拖动排序',
+    moveUp: '上移',
+    moveDown: '下移',
+    previewHint: '以下为屏蔽/替换/注入后的最终系统提示词：',
+    previewPrompt: '提示词预览',
+    previewSections: '段',
+    previewTools: '工具预览',
+    previewToolCount: '个工具',
+    savePreset: '保存当前为预设',
+    presetName: '预设名称',
+    save: '保存',
+    importPreset: '导入预设',
+    import: '导入',
+    apply: '应用',
+    export: '导出',
+    delete: '删除',
+    restore: '还原',
+    active: '使用中',
+    preset: '预设',
+  },
+  en: {
+    nav: 'Prompt Customizer',
+    loading: 'Loading…',
+    unavailable: 'Namespace unavailable in this environment.',
+    tabsSections: 'Sections',
+    tabsTools: 'Tools',
+    tabsPresets: 'Presets',
+    tabsPreview: 'Preview',
+    refresh: 'Refresh',
+    blockedOff: 'Active',
+    blockedOn: 'Blocked',
+    replaced: 'Replaced',
+    manual: 'Manual',
+    system: 'System',
+    replace: 'Replace',
+    clearReplace: 'Clear',
+    clearInput: 'Clear',
+    injectNew: 'Inject section',
+    name: 'Name',
+    order: 'Order',
+    text: 'Text',
+    add: 'Add',
+    hiddenOff: 'Visible',
+    hiddenOn: 'Hidden',
+    selectAll: 'Select all',
+    selectNone: 'Select none',
+    empty: '(empty)',
+    dynamic: '<dynamic>',
+    drag: 'Drag to reorder',
+    moveUp: 'Move up',
+    moveDown: 'Move down',
+    previewHint: 'Final system prompt after block/replace/inject:',
+    previewPrompt: 'Prompt preview',
+    previewSections: 'sections',
+    previewTools: 'Tools preview',
+    previewToolCount: 'tools',
+    savePreset: 'Save current as preset',
+    presetName: 'Preset name',
+    save: 'Save',
+    importPreset: 'Import preset',
+    import: 'Import',
+    apply: 'Apply',
+    export: 'Export',
+    delete: 'Delete',
+    restore: 'Restore',
+    active: 'Active',
+    preset: 'Preset',
+  },
+} as const
+
+export type Translate = (key: string) => string