@dickpy/dsh-imagegen 1.0.7 → 1.0.9

package/src/client/templates.module.css

@@ -0,0 +1,453 @@
+/**
+ * Prompt-template library styles. Same conventions as panel.module.css:
+ * scoped box-sizing, dsh --dsw-* tokens, no leakage outside the overlay
+ * subtree.
+ */
+
+.overlay,
+.overlay *,
+.overlay *::before,
+.overlay *::after {
+  box-sizing: border-box;
+}
+
+.overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 130;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 28px;
+  background: var(--dsw-alias-bg-mask-1);
+  color: var(--dsw-alias-label-primary);
+  font-family: var(--dsw-font-family);
+}
+
+.shell {
+  display: flex;
+  flex-direction: column;
+  width: min(1180px, 100%);
+  height: 100%;
+  max-height: 100%;
+  overflow: hidden;
+  border: 1px solid var(--dsw-alias-border-l1);
+  border-radius: 14px;
+  background: var(--dsw-alias-bg-base);
+  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28);
+}
+
+/* --- header ------------------------------------------------------------ */
+
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 14px 18px 10px;
+  flex: none;
+}
+
+.heading {
+  display: flex;
+  align-items: baseline;
+  gap: 10px;
+  min-width: 0;
+}
+
+.title {
+  margin: 0;
+  font-size: 15px;
+  font-weight: 650;
+}
+
+.meta {
+  font-size: 12px;
+  color: var(--dsw-alias-label-tertiary);
+  white-space: nowrap;
+}
+
+.headerActions {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  flex: none;
+}
+
+.close {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border: none;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--dsw-alias-label-secondary);
+  cursor: pointer;
+}
+
+.close:hover {
+  background: var(--dsw-alias-interactive-bg-hover);
+  color: var(--dsw-alias-label-primary);
+}
+
+/* --- toolbar ----------------------------------------------------------- */
+
+.toolbar {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 0 18px 12px;
+  flex: none;
+}
+
+.search {
+  width: 100%;
+  height: 34px;
+  padding: 0 12px;
+  border: 1px solid var(--dsw-alias-border-l1);
+  border-radius: 9px;
+  background: var(--dsw-alias-bg-layer-1);
+  color: var(--dsw-alias-label-primary);
+  font-size: 13px;
+  font-family: inherit;
+  outline: none;
+}
+
+.search:focus {
+  border-color: var(--dsw-alias-brand-primary);
+}
+
+.search::placeholder {
+  color: var(--dsw-alias-label-dimmed);
+}
+
+.categoryRow {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  max-height: 64px;
+  overflow-y: auto;
+}
+
+.categoryPill {
+  height: 26px;
+  padding: 0 11px;
+  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: 12px;
+  font-family: inherit;
+  cursor: pointer;
+  white-space: nowrap;
+}
+
+.categoryPill:hover {
+  color: var(--dsw-alias-label-primary);
+  background: var(--dsw-alias-interactive-bg-hover);
+}
+
+.categoryPill[data-active] {
+  border-color: var(--dsw-alias-brand-primary);
+  background: var(--dsw-alias-brand-primary);
+  color: var(--dsw-alias-bg-base);
+}
+
+.notice {
+  margin: 0 18px 10px;
+  padding: 8px 12px;
+  border: 1px solid var(--dsw-alias-border-l1);
+  border-radius: 9px;
+  background: var(--dsw-alias-bg-layer-1);
+  color: var(--dsw-alias-label-secondary);
+  font-size: 12px;
+  flex: none;
+}
+
+/* --- body / grid -------------------------------------------------------- */
+
+.body {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 2px 18px 14px;
+}
+
+.state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  height: 100%;
+  min-height: 220px;
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 13px;
+}
+
+.spinner {
+  width: 26px;
+  height: 26px;
+  border: 2px solid var(--dsw-alias-border-l2);
+  border-top-color: var(--dsw-alias-brand-primary);
+  border-radius: 50%;
+  animation: dsh-imagegen-templates-spin 0.9s linear infinite;
+}
+
+@keyframes dsh-imagegen-templates-spin {
+  to { transform: rotate(360deg); }
+}
+
+.grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+  gap: 12px;
+}
+
+.card {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+  padding: 0;
+  overflow: hidden;
+  border: 1px solid var(--dsw-alias-border-l1);
+  border-radius: 11px;
+  background: var(--dsw-alias-bg-layer-1);
+  cursor: pointer;
+  text-align: left;
+  font-family: inherit;
+  color: var(--dsw-alias-label-primary);
+  transition: border-color 0.15s ease, transform 0.15s ease;
+}
+
+.card:hover {
+  border-color: var(--dsw-alias-brand-primary);
+  transform: translateY(-1px);
+}
+
+.thumbWrap {
+  position: relative;
+  display: block;
+  width: 100%;
+  aspect-ratio: 1 / 1;
+  background: var(--dsw-alias-bg-layer-2);
+}
+
+.thumb {
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.thumbPlaceholder {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  color: var(--dsw-alias-label-dimmed);
+}
+
+.featuredBadge {
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  padding: 2px 8px;
+  border-radius: 999px;
+  background: var(--dsw-alias-brand-primary);
+  color: var(--dsw-alias-bg-base);
+  font-size: 11px;
+  font-weight: 600;
+}
+
+.cardBody {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 9px 11px 10px;
+  min-width: 0;
+}
+
+.cardTitle {
+  font-size: 12.5px;
+  font-weight: 600;
+  line-height: 1.35;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.cardMeta {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+  font-size: 11px;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.cardCategory {
+  flex: none;
+  padding: 1px 7px;
+  border-radius: 999px;
+  background: var(--dsw-alias-bg-layer-2);
+  color: var(--dsw-alias-label-secondary);
+}
+
+.cardSource {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* --- footer ------------------------------------------------------------- */
+
+.footer {
+  flex: none;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  padding: 9px 18px;
+  border-top: 1px solid var(--dsw-alias-border-l1);
+}
+
+.attribution {
+  font-size: 11.5px;
+  color: var(--dsw-alias-label-dimmed);
+  min-width: 0;
+}
+
+.sourceLink {
+  flex: none;
+  font-size: 11.5px;
+  font-weight: 600;
+  color: var(--dsw-alias-brand-primary);
+  text-decoration: none;
+  white-space: nowrap;
+}
+
+.sourceLink:hover {
+  text-decoration: underline;
+}
+
+/* --- detail overlay ----------------------------------------------------- */
+
+.detailOverlay {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 34px;
+  background: var(--dsw-alias-bg-mask-1);
+}
+
+.detail {
+  display: grid;
+  grid-template-columns: minmax(0, 5fr) minmax(0, 4fr);
+  grid-template-rows: minmax(0, 1fr);
+  gap: 0;
+  width: min(980px, 100%);
+  max-height: 100%;
+  overflow: hidden;
+  border: 1px solid var(--dsw-alias-border-l1);
+  border-radius: 14px;
+  background: var(--dsw-alias-bg-base);
+  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.32);
+}
+
+.detailMedia {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--dsw-alias-bg-layer-2);
+}
+
+.detailImage {
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+}
+
+.detailInfo {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 18px;
+}
+
+.detailTitle {
+  margin: 0;
+  font-size: 15px;
+  font-weight: 650;
+  line-height: 1.4;
+}
+
+.detailMeta {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 8px;
+  font-size: 12px;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.detailLink {
+  color: var(--dsw-alias-brand-primary);
+  text-decoration: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.detailLink:hover {
+  text-decoration: underline;
+}
+
+.detailPrompt {
+  flex: 1;
+  min-height: 0;
+  margin: 0;
+  padding: 12px;
+  overflow-y: auto;
+  border: 1px solid var(--dsw-alias-border-l1);
+  border-radius: 10px;
+  background: var(--dsw-alias-bg-layer-1);
+  color: var(--dsw-alias-label-primary);
+  font-size: 12.5px;
+  line-height: 1.6;
+  font-family: inherit;
+  white-space: pre-wrap;
+  word-break: break-word;
+  user-select: text;
+}
+
+.detailActions {
+  display: flex;
+  gap: 8px;
+  flex: none;
+  position: sticky;
+  bottom: 0;
+  margin: 0 -18px -18px;
+  padding: 12px 18px;
+  background: var(--dsw-alias-bg-base);
+  border-top: 1px solid var(--dsw-alias-border-l1);
+}
+
+/* Narrow shells: stack the detail pane. */
+@media (max-width: 760px) {
+  .detail {
+    grid-template-columns: 1fr;
+    grid-template-rows: minmax(0, 3fr) minmax(0, 4fr);
+  }
+}

package/src/index.ts

@@ -26,6 +26,7 @@ export const inject = ['webServer', 'systemPrompt']
 // contract only requires name / inject / Config / apply.
 export { makeRoutes } from './routes.ts'
 export { generateImage, ImageGenError } from './engine.ts'
+export { listTemplates, readTemplateImage, refreshTemplates, clearTemplateMemo } from './templates-store.ts'
 export { checkForUpdate, clearUpdateCache, compareVersions, CURRENT_VERSION, installUpdate, profileFromProcess } from './updater.ts'
 
 /** The branded settings namespace of this plugin (the card edits it). */
@@ -58,7 +59,7 @@ const DEFAULT_ANNOUNCE = true
 const SECTION_ORDER = 150
 
 /** Model-facing announcement: plugin presence, capabilities, and limits. */
-export const IMAGEGEN_GUIDANCE = '本机已安装 dsh-imagegen 插件（DSH AI 生图）：侧边栏「AI 生图」入口。能力：对接 OpenAI 兼容图像生成 API（模型 gpt-image-2），支持文生图（/images/generations）与图生图（/images/edits，上传参考图）；API 地址与密钥在 GUI「设置 → 插件 → 可配置」中配置，密钥仅存于本机设置文档；生成请求由本地宿主代理转发，结果以 base64 返回面板，可预览与下载。限制：生成消耗上游 API 额度；图片内容由上游模型生成，可能不符合预期或包含不适宜内容；api_key 以明文存储在设置文档中；参考图会发送至所配置的 API 服务。用户提到「生图 / 绘画 / 生成图片 / gpt-image-2 / 文生图 / 图生图」时即指本插件，请据此协作。'
+export const IMAGEGEN_GUIDANCE = '本机已安装 dsh-imagegen 插件（DSH AI 生图）：侧边栏「AI 生图」入口。能力：对接 OpenAI 兼容图像生成 API（模型 gpt-image-2），支持文生图（/images/generations）与图生图（/images/edits，上传参考图）；API 地址与密钥在 GUI「设置 → 插件 → 可配置」中配置，密钥仅存于本机设置文档；生成请求由本地宿主代理转发，结果以 base64 返回面板，可预览与下载。内置「提示词模板库」（面板提示词框左下角「模板库」按钮）：打包 awesome-gpt-image-2 的数百条 gpt-image-2 提示词案例（含中文标题、分类、参考图，可搜索/按分类筛选），参考图经宿主代理按需缓存到本地；用户可一键把模板提示词填入提示词框再生成。限制：生成消耗上游 API 额度；图片内容由上游模型生成，可能不符合预期或包含不适宜内容；api_key 以明文存储在设置文档中；参考图会发送至所配置的 API 服务；模板库在线刷新与参考图首次加载需要访问 vibeui.top。用户提到「生图 / 绘画 / 生成图片 / gpt-image-2 / 文生图 / 图生图 / 提示词模板」时即指本插件，请据此协作。'
 
 /** Effective config (schema defaults applied). */
 interface EffectiveConfig {

package/src/protocol.ts

@@ -8,7 +8,7 @@
 export const IMAGEGEN_SETTINGS_NAMESPACE = 'dsh-imagegen'
 
 /** Published package version shared by the host updater and the client UI. */
-export const PLUGIN_VERSION = '1.0.7'
+export const PLUGIN_VERSION = '1.0.9'
 
 /** Same-origin route family (loopback-only, mirroring the dsh-ssh fence). */
 export const SETTINGS_API = {
@@ -42,6 +42,64 @@ export const HISTORY_API = {
 /** Maximum number of history entries retained host-side (oldest evicted). */
 export const HISTORY_MAX = 50
 
+/**
+ * Same-origin route family for the bundled prompt-template library
+ * (awesome-gpt-image-2 mirror). The case list ships inside the package and is
+ * served by the host; reference images are proxied through the `image` prefix
+ * route and cached on disk so repeated views never hit the network again.
+ */
+export const TEMPLATES_API = {
+  list: '/api/dsh-imagegen/templates/list',
+  refresh: '/api/dsh-imagegen/templates/refresh',
+  image: '/api/dsh-imagegen/templates/image',
+} as const
+
+/** One prompt-library case as the browser consumes it. */
+export interface TemplateCase {
+  /** Upstream case number (stable across refreshes). */
+  id: number
+  /** Short case title. */
+  title: string
+  /** Full reusable prompt text. */
+  prompt: string
+  /** English category name (grouping key). */
+  category: string
+  /** Chinese category display name. */
+  categoryZh: string
+  /** Style tags. */
+  styles: string[]
+  /** Scene tags. */
+  scenes: string[]
+  /** Original author handle, e.g. @vista8. */
+  sourceLabel: string
+  /** Original author link. */
+  sourceUrl: string
+  /** awesome-gpt-image-2 repo anchor link. */
+  githubUrl: string
+  /** Reference-image file name served through the image route ('' when none). */
+  image: string
+  /** Whether the source gallery featured the case. */
+  featured: boolean
+}
+
+/** Template-library list payload. */
+export interface TemplateListResult {
+  cases: TemplateCase[]
+  total: number
+  /** Where the served list came from. */
+  origin: 'bundled' | 'refreshed'
+  /** Upstream repository the library mirrors. */
+  repository: string
+  /** ISO time of the last successful refresh / bundle snapshot. */
+  fetchedAt: string
+}
+
+/** Template-library refresh outcome. */
+export interface TemplateRefreshResult {
+  total: number
+  fetchedAt: string
+}
+
 /** Generation modes. */
 export type GenerateMode = 'text' | 'edit'
 

package/src/routes.ts

@@ -11,8 +11,9 @@ import type { WebRoute } from '@deepseek-ai/dsh-host-webserver'
 import { SettingsConflictError, settingsNamespace, type SettingsDescriptor } from '@deepseek-ai/dsh-settings'
 import { generateImage, type UpstreamConfig } from './engine.ts'
 import { appendHistory, clearHistory, listHistory, readHistoryImage, removeHistory } from './history-store.ts'
+import { listTemplates, readTemplateImage, refreshTemplates } from './templates-store.ts'
 import { checkForUpdate, CURRENT_VERSION, installUpdate } from './updater.ts'
-import { GENERATE_API, HISTORY_API, IMAGEGEN_SETTINGS_NAMESPACE, SETTINGS_API, UPDATE_API, type GeneratedImage, type GenerateRequest, type HistoryEntry, type HistoryEntryInput } from './protocol.ts'
+import { GENERATE_API, HISTORY_API, IMAGEGEN_SETTINGS_NAMESPACE, SETTINGS_API, TEMPLATES_API, UPDATE_API, type GeneratedImage, type GenerateRequest, type HistoryEntry, type HistoryEntryInput, type TemplateListResult, type TemplateRefreshResult } from './protocol.ts'
 
 /** Cap on JSON request bodies (settings ops and generate payloads are small). */
 const MAX_JSON_BODY_BYTES = 24 * 1024 * 1024
@@ -41,6 +42,12 @@ export interface ImageGenRoutesDeps {
     clear: () => Promise<HistoryEntry[]>
     readImage: (file: string) => Promise<{ data: Buffer; mime: string } | undefined>
   }
+  /** Overrideable template-library backend, primarily for host integration tests. */
+  templates?: {
+    list: () => Promise<TemplateListResult>
+    refresh: () => Promise<TemplateRefreshResult>
+    readImage: (file: string) => Promise<{ data: Buffer; mime: string } | undefined>
+  }
 }
 
 /** Loopback literal check plus browser same-origin markers (mirrors dsh-ssh). */
@@ -183,6 +190,11 @@ export function makeRoutes(deps: ImageGenRoutesDeps): WebRoute[] {
     clear: clearHistory,
     readImage: readHistoryImage,
   }
+  const templates = deps.templates ?? {
+    list: listTemplates,
+    refresh: refreshTemplates,
+    readImage: readTemplateImage,
+  }
   const guard = (req: IncomingMessage, res: ServerResponse, method: string): boolean => {
     if (!isLoopbackRequest(req)) {
       writeJson(res, 403, { error: 'forbidden: loopback-only' })
@@ -442,5 +454,65 @@ export function makeRoutes(deps: ImageGenRoutesDeps): WebRoute[] {
         res.end(found.data)
       },
     },
+    // --------------------------------------------------- templates list
+    {
+      kind: 'exact',
+      path: TEMPLATES_API.list,
+      handler: async (req, res) => {
+        if (!guard(req, res, 'POST')) return
+        try {
+          const result = await templates.list()
+          writeJson(res, 200, { ok: true, ...result })
+        } catch (error) {
+          writeJson(res, 200, { ok: false, code: 'templates-failed', message: messageOf(error) })
+        }
+      },
+    },
+    // ------------------------------------------------- templates refresh
+    {
+      kind: 'exact',
+      path: TEMPLATES_API.refresh,
+      handler: async (req, res) => {
+        if (!guard(req, res, 'POST')) return
+        try {
+          const result = await templates.refresh()
+          writeJson(res, 200, { ok: true, ...result })
+        } catch (error) {
+          writeJson(res, 200, { ok: false, code: 'templates-refresh-failed', message: messageOf(error) })
+        }
+      },
+    },
+    // -------------------------------------- templates image (prefix, proxied)
+    {
+      kind: 'prefix',
+      path: TEMPLATES_API.image,
+      handler: async (req, res) => {
+        if (!isLoopbackRequest(req)) {
+          writeJson(res, 403, { error: 'forbidden: loopback-only' })
+          return
+        }
+        if (req.method !== 'GET') {
+          writeJson(res, 405, { error: `method not allowed: ${req.method}` })
+          return
+        }
+        const file = imageFileFrom(req.url, TEMPLATES_API.image)
+        if (file === undefined) {
+          writeJson(res, 404, { error: 'not found' })
+          return
+        }
+        const found = await templates.readImage(file)
+        if (found === undefined) {
+          writeJson(res, 404, { error: 'not found' })
+          return
+        }
+        res.writeHead(200, {
+          'content-type': found.mime,
+          'content-length': found.data.length,
+          // Cached on disk by the host; reference images are immutable per name.
+          'cache-control': 'private, max-age=86400',
+        })
+        res.end(found.data)
+      },
+    },
   ]
 }