@goodandready/dsh-image-gen 0.11.35 → 0.11.36

package/lib/frontend-assets.js

@@ -1,4 +1,4 @@
-import { resolveInside } from './security.js'
+import { resolveInside, escapeXml, sanitizeSvgColor } from './security.js'
 import sharp from 'sharp'
 // @ts-check
 import path from 'node:path'
@@ -593,9 +593,11 @@ export function buildIcoBuffer(pngFrames) {
 
 async function getDefaultIconBytes(name, themeColor) {
   const initial = (name || 'A').trim().charAt(0).toUpperCase() || 'A'
+  const escapedInitial = escapeXml(initial)
+  const safeThemeColor = sanitizeSvgColor(themeColor || '#0f172a', '#0f172a')
   const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
-    <rect width="512" height="512" rx="100" fill="${themeColor || '#0f172a'}"/>
-    <text x="50%" y="54%" font-family="system-ui, -apple-system, sans-serif" font-size="280" font-weight="bold" fill="#ffffff" dominant-baseline="middle" text-anchor="middle">${initial}</text>
+    <rect width="512" height="512" rx="100" fill="${safeThemeColor}"/>
+    <text x="50%" y="54%" font-family="system-ui, -apple-system, sans-serif" font-size="280" font-weight="bold" fill="#ffffff" dominant-baseline="middle" text-anchor="middle">${escapedInitial}</text>
   </svg>`
   return sharp(Buffer.from(svg)).png().toBuffer()
 }

package/lib/security.js

@@ -294,3 +294,49 @@ export function resolveInside(baseDir, candidatePath) {
 
   return resolved
 }
+
+const SAFE_HEX_COLOR = /^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/
+const SAFE_RGB_COLOR = /^rgba?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}(?:\s*,\s*(?:0|1|0?\.\d+)\s*)?\)$/i
+const SAFE_HSL_COLOR = /^hsla?\(\s*\d{1,3}(?:deg)?\s*,\s*\d{1,3}%\s*,\s*\d{1,3}%(?:\s*,\s*(?:0|1|0?\.\d+)\s*)?\)$/i
+const SAFE_NAMED_COLOR = /^(?:transparent|currentColor|none|[a-zA-Z]{3,20})$/i
+
+/**
+ * Escapes characters for safe inclusion in XML/SVG documents and attributes (#414).
+ * Replaces &, <, >, ", ' with their corresponding XML entities.
+ *
+ * @param {string|unknown} val
+ * @returns {string} XML-safe string
+ */
+export function escapeXml(val) {
+  if (val === null || val === undefined) return ''
+  return String(val)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&apos;')
+}
+
+/**
+ * Sanitizes a color value for safe inclusion in SVG attributes (fill, stroke, stop-color) (#414).
+ * If the input is not a recognized safe color (hex, rgb/rgba, hsl/hsla, or safe named color),
+ * returns the provided fallback color.
+ *
+ * @param {string|unknown} color
+ * @param {string} [fallback='#000000']
+ * @returns {string} Sanitized color string
+ */
+export function sanitizeSvgColor(color, fallback = '#000000') {
+  if (typeof color !== 'string') return fallback
+  const trimmed = color.trim()
+  if (
+    SAFE_HEX_COLOR.test(trimmed) ||
+    SAFE_RGB_COLOR.test(trimmed) ||
+    SAFE_HSL_COLOR.test(trimmed) ||
+    SAFE_NAMED_COLOR.test(trimmed)
+  ) {
+    return trimmed
+  }
+  return fallback
+}
+

package/lib/tools/processing-advanced.js

@@ -10,7 +10,7 @@ import {
   toLosslessJson,
   saveAttachmentSafe,
 } from '../providers.js'
-import { sanitizeErrorAndLogs, resolveInside } from '../security.js'
+import { sanitizeErrorAndLogs, resolveInside, escapeXml, sanitizeSvgColor } from '../security.js'
 import { resolveConversationImage } from '../resolve-image.js'
 
 export function registerProcessingAdvancedTools(ctx, deps) {
@@ -126,6 +126,7 @@ export function registerProcessingAdvancedTools(ctx, deps) {
               const mime = src.mediaType || 'image/png'
               const dataUri = `data:${mime};base64,${b64}`
               const label = labels[idx] || String(idx + 1)
+              const escapedLabel = escapeXml(label)
 
               tilesSvg += `
   <g transform="translate(${x}, ${y})">
@@ -133,14 +134,11 @@ export function registerProcessingAdvancedTools(ctx, deps) {
     <rect width="${tileW}" height="${tileH}" rx="8" fill="#18191c" stroke="#2c2e33" stroke-width="1"/>
     <image href="${dataUri}" width="${tileW}" height="${tileH}" preserveAspectRatio="xMidYMid slice" clip-path="url(#clip-${idx})"/>
     <rect x="12" y="12" width="28" height="24" rx="4" fill="rgba(0,0,0,0.65)"/>
-    <text x="26" y="29" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="13" font-weight="700" text-anchor="middle">${label}</text>
+    <text x="26" y="29" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="13" font-weight="700" text-anchor="middle">${escapedLabel}</text>
   </g>`
             })
 
-            const escapedTitle = title
-              .replace(/&/g, '&amp;')
-              .replace(/</g, '&lt;')
-              .replace(/>/g, '&gt;')
+            const escapedTitle = escapeXml(title || '')
 
             const svgContent = `<?xml version="1.0" encoding="UTF-8"?>
 <svg xmlns="http://www.w3.org/2000/svg" width="${totalW}" height="${totalH}" viewBox="0 0 ${totalW} ${totalH}">
@@ -247,7 +245,7 @@ export function registerProcessingAdvancedTools(ctx, deps) {
             const source = await resolveConversationImage(ctx, exec, args.image)
             const targetRatioKey = args.aspect_ratio || '1:1'
             const mode = args.mode || 'auto_focus'
-            const bgColor = args.background || '#0b0c0e'
+            const bgColor = sanitizeSvgColor(args.background || '#0b0c0e', '#0b0c0e')
 
             const ratioMap = {
               '1:1': 1.0,
@@ -413,8 +411,11 @@ export function registerProcessingAdvancedTools(ctx, deps) {
 
             const projectName = args.project_name || 'Project Brand'
             const tagline = args.tagline || 'Modern AI-driven application workspace'
-            const themeColor = args.theme_color || '#4f46e5'
+            const themeColor = sanitizeSvgColor(args.theme_color || '#4f46e5', '#4f46e5')
             const initial = projectName.charAt(0).toUpperCase()
+            const escapedInitial = escapeXml(initial)
+            const escapedProject = escapeXml(projectName)
+            const escapedTagline = escapeXml(tagline)
 
             let logoDataUri = null
             if (args.logo_image) {
@@ -439,7 +440,7 @@ export function registerProcessingAdvancedTools(ctx, deps) {
             const faviconSvg = `<?xml version="1.0" encoding="UTF-8"?>
 <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
   <rect width="64" height="64" rx="16" fill="${themeColor}"/>
-  ${logoDataUri ? `<image href="${logoDataUri}" x="8" y="8" width="48" height="48" preserveAspectRatio="xMidYMid meet"/>` : `<text x="32" y="44" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="34" font-weight="900" text-anchor="middle">${initial}</text>`}
+  ${logoDataUri ? `<image href="${logoDataUri}" x="8" y="8" width="48" height="48" preserveAspectRatio="xMidYMid meet"/>` : `<text x="32" y="44" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="34" font-weight="900" text-anchor="middle">${escapedInitial}</text>`}
 </svg>`
             const faviconPath = path.join(targetDir, 'favicon.svg')
             await writeFile(faviconPath, faviconSvg, 'utf8')
@@ -459,7 +460,7 @@ export function registerProcessingAdvancedTools(ctx, deps) {
     </linearGradient>
   </defs>
   <rect width="${size}" height="${size}" rx="${rx}" fill="url(#brandGrad-${size})"/>
-  ${logoDataUri ? `<image href="${logoDataUri}" x="${size * 0.15}" y="${size * 0.15}" width="${size * 0.7}" height="${size * 0.7}" preserveAspectRatio="xMidYMid meet"/>` : `<text x="${size / 2}" y="${yOffset}" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="${fontSize}" font-weight="900" text-anchor="middle">${initial}</text>`}
+  ${logoDataUri ? `<image href="${logoDataUri}" x="${size * 0.15}" y="${size * 0.15}" width="${size * 0.7}" height="${size * 0.7}" preserveAspectRatio="xMidYMid meet"/>` : `<text x="${size / 2}" y="${yOffset}" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="${fontSize}" font-weight="900" text-anchor="middle">${escapedInitial}</text>`}
 </svg>`
               const iconPath = path.join(targetDir, `icon-${size}.svg`)
               await writeFile(iconPath, iconSvg, 'utf8')
@@ -486,8 +487,6 @@ export function registerProcessingAdvancedTools(ctx, deps) {
             exportedFiles.push(manifestPath)
 
             // 4. OpenGraph Social Card (1200x630)
-            const escapedProject = projectName.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
-            const escapedTagline = tagline.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
             const ogCardSvg = `<?xml version="1.0" encoding="UTF-8"?>
 <svg xmlns="http://www.w3.org/2000/svg" width="1200" height="630" viewBox="0 0 1200 630">
   <defs>
@@ -511,7 +510,7 @@ export function registerProcessingAdvancedTools(ctx, deps) {
   
   <g transform="translate(860, 200)">
     <rect width="180" height="180" rx="36" fill="${themeColor}" fill-opacity="0.15" stroke="${themeColor}" stroke-width="2"/>
-    ${logoDataUri ? `<image href="${logoDataUri}" x="20" y="20" width="140" height="140" preserveAspectRatio="xMidYMid meet"/>` : `<text x="90" y="125" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="96" font-weight="900" text-anchor="middle">${initial}</text>`}
+    ${logoDataUri ? `<image href="${logoDataUri}" x="20" y="20" width="140" height="140" preserveAspectRatio="xMidYMid meet"/>` : `<text x="90" y="125" fill="#ffffff" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="96" font-weight="900" text-anchor="middle">${escapedInitial}</text>`}
   </g>
   
   <text x="130" y="480" fill="#64748b" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif" font-size="14" font-weight="500">Auto-generated by @goodandready/dsh-image-gen</text>

package/lib/vision-ocr-helpers.js

@@ -1,4 +1,5 @@
 // vision-ocr-helpers.js — OCR text localization and seamless replacement (#180).
+import { escapeXml, sanitizeSvgColor } from './security.js'
 
 /**
  * Parses bounding box representations into normalized [x1, y1, x2, y2] (0-1000 scale).
@@ -87,6 +88,7 @@ export function buildTextInpaintMaskSvg(width, height, bboxes, paddingPx = 8) {
 export function buildTextOverlaySvg(width, height, items, fontFamily = 'sans-serif') {
   const w = Math.max(1, width || 1024)
   const h = Math.max(1, height || 1024)
+  const safeFont = escapeXml(fontFamily)
 
   const textNodes = (items || []).map((item) => {
     const norm = normalizeBbox(item.bbox, w, h)
@@ -98,18 +100,14 @@ export function buildTextOverlaySvg(width, height, items, fontFamily = 'sans-ser
     const boxH = Math.max(1, Math.round(((y2n - y1n) / 1000) * h))
 
     const computedFontSize = item.fontSize || Math.max(12, Math.round(boxH * 0.72))
-    const color = item.color || '#FFFFFF'
+    const color = sanitizeSvgColor(item.color || '#FFFFFF', '#FFFFFF')
     const centerX = pxX1 + Math.round(boxW / 2)
     const baselineY = pxY1 + Math.round(boxH * 0.75)
 
     // Escape XML entities
-    const safeText = String(item.text)
-      .replace(/&/g, '&')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
+    const safeText = escapeXml(item.text)
 
-    return `<text x="${centerX}" y="${baselineY}" text-anchor="middle" font-family="${fontFamily}" font-size="${computedFontSize}" font-weight="700" fill="${color}" filter="drop-shadow(0 2px 4px rgba(0,0,0,0.6))">${safeText}</text>`
+    return `<text x="${centerX}" y="${baselineY}" text-anchor="middle" font-family="${safeFont}" font-size="${computedFontSize}" font-weight="700" fill="${color}" filter="drop-shadow(0 2px 4px rgba(0,0,0,0.6))">${safeText}</text>`
   }).filter(Boolean).join('\n  ')
 
   return `<?xml version="1.0" encoding="UTF-8"?>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@goodandready/dsh-image-gen",
-  "version": "0.11.35",
+  "version": "0.11.36",
   "description": "Image generation for DeepSeek Harness: a generate_image tool with pluggable providers — the FAL queue, any OpenAI-compatible images API, or a ChatGPT/Grok subscription with no API key at all. The picture is shown inline in the conversation; the model receives either a link (works with any chat model) or the image itself (needs dsh-vision-bridge or a vision-capable model).",
   "keywords": [
     "deepseek-harness",