dsh-design-studio 0.9.0 → 0.11.0

package/lib/core.js

@@ -78,9 +78,28 @@ export function listScreens(root) {
     out.push({ name: d.name, born })
   }
   out.sort((a, b) => a.born - b.born || a.name.localeCompare(b.name))
+  // 有设计清单（design.json，从设计库来的模板 / 分享过的设计）：按清单里的顺序排，清单外的（模型后加的）按创建时间排在后面
+  const order = manifestOrder(root)
+  if (order.length) {
+    const rank = new Map(order.map((f, i) => [f.toLowerCase(), i]))
+    const listed = out.filter((x) => rank.has(x.name.toLowerCase())).sort((a, b) => rank.get(a.name.toLowerCase()) - rank.get(b.name.toLowerCase()))
+    return [...listed, ...out.filter((x) => !rank.has(x.name.toLowerCase()))].slice(0, MAX_SCREENS).map((x) => x.name)
+  }
   return out.slice(0, MAX_SCREENS).map((x) => x.name)
 }
 
+/** design.json 里 screens 的文件名（读不了、写错了都当没有） */
+export function manifestOrder(root) {
+  let m
+  try {
+    const raw = fs.readFileSync(path.join(root, 'design.json'), 'utf8')
+    if (raw.length > 256 * 1024) return []
+    m = JSON.parse(raw)
+  } catch { return [] }
+  if (!m || !Array.isArray(m.screens)) return []
+  return m.screens.map((s) => (s && typeof s.file === 'string' ? s.file : typeof s === 'string' ? s : '')).filter((f) => f && !/[\\/]/.test(f) && HTML_EXT.test(f)).slice(0, MAX_SCREENS)
+}
+
 /** 开发服务器上要并排看的几个路由 */
 function normRoutes(list) {
   if (!Array.isArray(list)) return null
@@ -109,7 +128,10 @@ export function fromBashPath(p, platform = process.platform) {
  * @throws Error 带中文说明
  */
 export function parseTarget(input, cwd = os.homedir()) {
-  const s = String(input || '').trim()
+  let s = String(input || '').trim()
+  // Windows「复制为路径」会带一对引号："C:\a\b.html"
+  const q = /^(["'“])(.*)(["'”])$/.exec(s)
+  if (q && (q[1] === q[3] || (q[1] === '“' && q[3] === '”'))) s = q[2].trim()
   if (!s) throw new Error('地址是空的')
   if (/^\d{2,5}$/.test(s)) return proxyTarget(Number(s), '/')
   const m = LOCAL_URL.exec(s)
@@ -118,21 +140,31 @@ export function parseTarget(input, cwd = os.homedir()) {
   let p = null
   // 标准的 file:// 地址交给 Node 转（Windows 上是 file:///C:/…，直接去掉前缀会变成 /C:/…）
   if (/^file:\/\//i.test(s)) try { p = fileURLToPath(s) } catch { /* file://~/… 之类的写法，按下面的老办法 */ }
+  const full = (x) => {
+    x = fromBashPath(x)
+    if (x === '~' || x.startsWith('~/') || x.startsWith('~\\')) x = path.join(os.homedir(), x.slice(1))
+    return path.resolve(cwd, x)
+  }
   if (p === null) {
-    p = s.replace(/^file:\/\//i, '')
-    if (p.includes('%')) {
-      try { p = decodeURIComponent(p) } catch { /* 原样用 */ }
+    const raw = s.replace(/^file:\/\//i, '')
+    p = raw
+    // %20 之类按网址解开；但文件名里本来就带 %（「浏览…」选的、拖进来的都是原样路径）且原样存在时，别解
+    if (raw.includes('%') && !fs.existsSync(full(raw))) {
+      try { p = decodeURIComponent(raw) } catch { /* 原样用 */ }
     }
   }
-  p = fromBashPath(p)
-  if (p === '~' || p.startsWith('~/') || p.startsWith('~\\')) p = path.join(os.homedir(), p.slice(1))
-  p = path.resolve(cwd, p)
+  p = full(p)
   let st
   try { st = fs.statSync(p) } catch { throw new Error(`找不到：${p}`) }
   if (st.isDirectory()) {
+    // 有 index.html 开它；没有就开最先做的那屏（设计目录一屏一个文件，画布上会把同目录的几屏都排出来）
     const index = path.join(p, 'index.html')
-    if (!fs.existsSync(index)) throw new Error(`这个目录里没有 index.html：${p}`)
-    p = index
+    const first = fs.existsSync(index) ? 'index.html' : listScreens(p)[0]
+    if (!first) {
+      try { fs.readdirSync(p) } catch (e) { throw new Error(`读不了这个文件夹（${e.code === 'EACCES' || e.code === 'EPERM' ? '没有权限' : e.code || e.message}）：${p}`) }
+      throw new Error(`这个文件夹里没有 HTML 文件：${p}`)
+    }
+    p = path.join(p, first)
   } else if (!HTML_EXT.test(p)) {
     throw new Error(`只能预览 .html 文件：${p}`)
   }
@@ -512,7 +544,7 @@ export function askOf(data) {
 /**
  * @param opts.alive (origin) → 这个预览服务器还开着吗（开的太多时旧的会被关掉；发现没了就重开）
  */
-export function createTracker({ open, skipPorts = () => new Set(), now = Date.now, log = () => {}, store = null, history = null, alive = () => true, autoOpen = () => true }) {
+export function createTracker({ open, skipPorts = () => new Set(), now = Date.now, log = () => {}, store = null, history = null, alive = () => true, autoOpen = () => true, beforeRestore = () => {} }) {
   const states = new Map() // sessionId → state
   const cwds = new Map() // sessionId → 最近一次工具的工作目录
   let saved = {}
@@ -896,7 +928,8 @@ export function createTracker({ open, skipPorts = () => new Set(), now = Date.no
   function restoreVersion(id, n) {
     const st = states.get(id)
     if (!history || !st || !st.target || st.target.kind !== 'file') throw new Error('这个预览没有版本记录')
-    const r = history.restore(st.target.root, n)
+    const root = st.target.root
+    const r = history.restore(root, n, { before: (html) => beforeRestore(root, html) })
     st.vrev++
     return r
   }

package/lib/gallery/css.js

@@ -0,0 +1,230 @@
+/**
+ * 设计库用的 CSS 读法：照 CSS 规范分词（转义会还原：\75rl( 就是 url(），找出所有会去拿文件的地方。
+ * Node 和浏览器里都能跑，不依赖别的包。
+ */
+
+const isHex = (c) => /[0-9a-fA-F]/.test(c)
+const isNameStart = (c) => /[a-zA-Z_]/.test(c) || (c && c.charCodeAt(0) >= 0x80)
+const isName = (c) => isNameStart(c) || /[0-9-]/.test(c)
+const isWs = (c) => c === ' ' || c === '\t' || c === '\n' || c === '\r' || c === '\f'
+const validEscape = (a, b) => a === '\\' && b !== '\n' && b !== '\r' && b !== '\f' && b !== undefined
+
+/**
+ * 分词。返回 [{ t, v, s, e }]
+ *   t：ws comment str bad-str url bad-url func ident at hash num delim ( ) [ ] { } , : ; cdo cdc
+ *   v：还原过转义的值（func / ident / at / hash 是名字，str / url 是内容）
+ */
+export function cssTokens(src, { from = 0, stop = null } = {}) {
+  const s = String(src)
+  const n = s.length
+  const out = []
+  let i = from
+
+  function escape() {
+    // 已经越过反斜杠
+    const c = s[i]
+    if (c === undefined) return '�'
+    if (isHex(c)) {
+      let hex = ''
+      while (hex.length < 6 && i < n && isHex(s[i])) hex += s[i++]
+      if (i < n && isWs(s[i])) { if (s[i] === '\r' && s[i + 1] === '\n') i++; i++ }
+      const cp = parseInt(hex, 16)
+      return cp === 0 || cp > 0x10ffff || (cp >= 0xd800 && cp <= 0xdfff) ? '�' : String.fromCodePoint(cp)
+    }
+    i++
+    return c
+  }
+  function name() {
+    let v = ''
+    for (;;) {
+      const c = s[i]
+      if (c !== undefined && isName(c)) { v += c; i++ } else if (validEscape(c, s[i + 1])) { i++; v += escape() } else return v
+    }
+  }
+  const startsIdent = (a, b, c) => a === '-' ? isNameStart(b) || b === '-' || validEscape(b, c) : isNameStart(a) || validEscape(a, b)
+  const startsNumber = (a, b, c) => /[0-9]/.test(a) || (a === '.' && /[0-9]/.test(b)) || ((a === '+' || a === '-') && (/[0-9]/.test(b) || (b === '.' && /[0-9]/.test(c))))
+
+  function str(q, from) {
+    let v = ''
+    for (;;) {
+      const c = s[i]
+      if (c === undefined) return { t: 'str', v, s: from, e: i }
+      if (c === q) { i++; return { t: 'str', v, s: from, e: i } }
+      if (c === '\n' || c === '\r' || c === '\f') return { t: 'bad-str', v, s: from, e: i }
+      if (c === '\\') {
+        const d = s[i + 1]
+        if (d === undefined) { i++; continue }
+        if (d === '\n' || d === '\f') { i += 2; continue }
+        if (d === '\r') { i += s[i + 2] === '\n' ? 3 : 2; continue }
+        i++
+        v += escape()
+        continue
+      }
+      v += c
+      i++
+    }
+  }
+
+  function url(from) {
+    while (i < n && isWs(s[i])) i++
+    let v = ''
+    for (;;) {
+      const c = s[i]
+      if (c === undefined) return { t: 'url', v, s: from, e: i }
+      if (c === ')') { i++; return { t: 'url', v, s: from, e: i } }
+      if (isWs(c)) {
+        while (i < n && isWs(s[i])) i++
+        if (s[i] === ')' || s[i] === undefined) { if (s[i] === ')') i++; return { t: 'url', v, s: from, e: i } }
+        return badUrl(v, from)
+      }
+      if (c === '"' || c === "'" || c === '(' || /[\x00-\x08\x0b\x0e-\x1f\x7f]/.test(c)) return badUrl(v, from)
+      if (c === '\\') {
+        if (validEscape(c, s[i + 1])) { i++; v += escape(); continue }
+        return badUrl(v, from)
+      }
+      v += c
+      i++
+    }
+  }
+  function badUrl(v, from) {
+    for (;;) {
+      const c = s[i]
+      if (c === undefined) return { t: 'bad-url', v, s: from, e: i }
+      if (c === ')') { i++; return { t: 'bad-url', v, s: from, e: i } }
+      if (validEscape(c, s[i + 1])) { i++; escape(); continue }
+      i++
+    }
+  }
+
+  while (i < n) {
+    if (stop && stop(i, out)) break
+    const from = i
+    const c = s[i]
+    if (c === '/' && s[i + 1] === '*') {
+      const e = s.indexOf('*/', i + 2)
+      i = e < 0 ? n : e + 2
+      out.push({ t: 'comment', v: '', s: from, e: i })
+      continue
+    }
+    if (isWs(c)) { while (i < n && isWs(s[i])) i++; out.push({ t: 'ws', v: ' ', s: from, e: i }); continue }
+    if (c === '"' || c === "'") { i++; out.push(str(c, from)); continue }
+    if (c === '#') {
+      if (isName(s[i + 1]) || validEscape(s[i + 1], s[i + 2])) { i++; out.push({ t: 'hash', v: name(), s: from, e: i }); continue }
+      i++; out.push({ t: 'delim', v: '#', s: from, e: i }); continue
+    }
+    if ('()[]{},:;'.includes(c)) { i++; out.push({ t: c, v: c, s: from, e: i }); continue }
+    if (startsNumber(c, s[i + 1], s[i + 2])) {
+      i++
+      while (i < n && /[0-9.eE]/.test(s[i])) i++
+      if (s[i] === '%') i++
+      else if (startsIdent(s[i], s[i + 1], s[i + 2])) name()
+      out.push({ t: 'num', v: s.slice(from, i), s: from, e: i })
+      continue
+    }
+    if (c === '-' && s[i + 1] === '-' && s[i + 2] === '>') { i += 3; out.push({ t: 'cdc', v: '-->', s: from, e: i }); continue }
+    if (c === '<' && s.startsWith('<!--', i)) { i += 4; out.push({ t: 'cdo', v: '<!--', s: from, e: i }); continue }
+    if (c === '@' && startsIdent(s[i + 1], s[i + 2], s[i + 3])) { i++; out.push({ t: 'at', v: name(), s: from, e: i }); continue }
+    if (startsIdent(c, s[i + 1], s[i + 2])) {
+      const v = name()
+      if (s[i] === '(') {
+        i++
+        if (v.toLowerCase() === 'url') {
+          let k = i
+          while (k < n && isWs(s[k])) k++
+          if (s[k] === '"' || s[k] === "'") { out.push({ t: 'func', v, s: from, e: i }); continue }
+          out.push(url(from))
+          continue
+        }
+        out.push({ t: 'func', v, s: from, e: i })
+        continue
+      }
+      out.push({ t: 'ident', v, s: from, e: i })
+      continue
+    }
+    i++
+    out.push({ t: 'delim', v: c, s: from, e: i })
+  }
+  return out
+}
+
+// 参数里的字符串会被当成文件地址去拿的函数
+export const URL_FUNCS = new Set(['url', 'src', 'image-set', '-webkit-image-set', 'image', 'cross-fade', '-webkit-cross-fade'])
+const BAD_FUNCS = new Set(['expression', '-moz-element', 'element'])
+const BAD_PROPS = new Set(['behavior', '-ms-behavior', '-moz-binding', 'binding'])
+
+/**
+ * 查一段 CSS（整份样式表，或 style="" 里的声明）。
+ * 返回 { refs: [{ url, at, kind }], problems: [{ code, at, detail }] }
+ *   refs：所有会去拿的地址（kind：'url' 普通、'font' 在 @font-face 里）；at：在这段 CSS 里的位置
+ *   problems：import（@import）、func（expression() 这类）、prop（behavior / -moz-binding）、bad（写坏的 url / 字符串，可能藏东西）、font-url
+ */
+export function scanCss(src) {
+  const toks = cssTokens(src)
+  const refs = []
+  const problems = []
+  let depth = 0 // 括号层数（URL_FUNCS 里的字符串）
+  const funcStack = []
+  let fontFace = -1 // 在 @font-face 块里：块的层数
+  let block = 0
+  let skipUntilSemi = false // @namespace 的地址不会去拿
+  let pendingAt = ''
+  for (let k = 0; k < toks.length; k++) {
+    const tk = toks[k]
+    const low = typeof tk.v === 'string' ? tk.v.toLowerCase() : ''
+    if (skipUntilSemi) {
+      if (tk.t === ';' || tk.t === '{') skipUntilSemi = false
+      continue
+    }
+    switch (tk.t) {
+      case 'at':
+        if (low === 'import') problems.push({ code: 'import', at: tk.s })
+        else if (low === 'namespace') skipUntilSemi = true
+        pendingAt = low
+        break
+      case '{':
+        block++
+        if (pendingAt === 'font-face' && fontFace < 0) fontFace = block
+        pendingAt = ''
+        break
+      case '}':
+        if (fontFace === block) fontFace = -1
+        block = Math.max(0, block - 1)
+        break
+      case ';':
+        pendingAt = ''
+        break
+      case 'url':
+        refs.push({ url: tk.v, at: tk.s, kind: fontFace > 0 ? 'font' : 'url' })
+        break
+      case 'bad-url':
+      case 'bad-str':
+        problems.push({ code: 'bad', at: tk.s })
+        break
+      case 'func':
+        if (BAD_FUNCS.has(low)) problems.push({ code: 'func', at: tk.s, detail: tk.v })
+        funcStack.push(low)
+        depth++
+        break
+      case '(':
+        funcStack.push('')
+        depth++
+        break
+      case ')':
+        funcStack.pop()
+        depth = Math.max(0, depth - 1)
+        break
+      case 'str':
+        if (funcStack.some((f) => URL_FUNCS.has(f))) refs.push({ url: tk.v, at: tk.s, kind: fontFace > 0 ? 'font' : 'url' })
+        break
+      case 'ident': {
+        // 属性名：后面（跳过空白）是冒号
+        let j = k + 1
+        while (j < toks.length && (toks[j].t === 'ws' || toks[j].t === 'comment')) j++
+        if (toks[j] && toks[j].t === ':' && BAD_PROPS.has(low)) problems.push({ code: 'prop', at: tk.s, detail: tk.v })
+        break
+      }
+      default:
+    }
+  }
+  return { refs, problems }
+}

package/lib/gallery/html.js

@@ -0,0 +1,313 @@
+/**
+ * 设计库用的 HTML 读法（不依赖浏览器，Node 和浏览器里都能跑）。
+ *
+ * 只为「查有没有危险的东西」服务，所以宁可多认：
+ *   tokenize(src)   照 HTML 规范的分词走一遍（<style> / <textarea> 这类里面只当文字），拿样式、文字、注释和它们的位置
+ *   scanTags(src)   每个 「<字母」 都当一个标签读一遍，不管它在注释、样式还是属性值里——
+ *                   浏览器在 <svg> 里、或者遇到拼错的标签时读法会变，逐个都查就不怕读法对不上
+ *   decodeEntities  &#106; &colon; 这类转义还原成字，好查 javascript: 这种藏起来的写法
+ */
+
+const WS = new Set(['\t', '\n', '\f', '\r', ' '])
+const ALPHA = /[a-zA-Z]/
+
+// 这些元素里面是纯文字（不再认标签），直到对应的结束标签
+const RAWTEXT = new Set(['style', 'script', 'xmp', 'iframe', 'noembed', 'noframes', 'noscript', 'textarea', 'title'])
+
+// 常用的命名转义（够查危险写法：字母本身没有命名转义，能拼出 javascript: 的只有数字转义和下面这些标点）
+const NAMED = {
+  amp: '&', AMP: '&', lt: '<', LT: '<', gt: '>', GT: '>', quot: '"', QUOT: '"', apos: "'", nbsp: ' ',
+  colon: ':', Tab: '\t', NewLine: '\n', sol: '/', bsol: '\\', lpar: '(', rpar: ')', period: '.', comma: ',',
+  semi: ';', excl: '!', num: '#', commat: '@', equals: '=', quest: '?', lsqb: '[', rsqb: ']', lbrack: '[', rbrack: ']',
+  lcub: '{', rcub: '}', lbrace: '{', rbrace: '}', verbar: '|', vert: '|', VerticalLine: '|', ast: '*', midast: '*',
+  plus: '+', dollar: '$', percnt: '%', Hat: '^', grave: '`', lowbar: '_', UnderBar: '_', hyphen: '‐', dash: '‐',
+  copy: '©', COPY: '©', reg: '®', REG: '®', trade: '™', middot: '·', centerdot: '·',
+  hellip: '…', mdash: '—', ndash: '–', lsquo: '‘', rsquo: '’', ldquo: '“', rdquo: '”',
+  laquo: '«', raquo: '»', times: '×', divide: '÷', deg: '°', yen: '¥', euro: '€',
+  pound: '£', cent: '¢', bull: '•', rarr: '→', larr: '←', uarr: '↑', darr: '↓',
+  harr: '↔', check: '✓', star: '☆', starf: '★', hearts: '♥', ensp: ' ', emsp: ' ',
+  thinsp: ' ', zwj: '‍', zwnj: '‌', shy: '­', sect: '§', para: '¶', plusmn: '±',
+  frac12: '½', frac14: '¼', frac34: '¾', sup2: '²', sup3: '³', micro: 'µ', infin: '∞',
+  le: '≤', ge: '≥', ne: '≠', minus: '−', prime: '′', Prime: '″', loz: '◊', iexcl: '¡',
+  iquest: '¿', acute: '´', uml: '¨', cedil: '¸', macr: '¯', ordf: 'ª', ordm: 'º',
+}
+// 不带分号也算数的老写法（只列上面有的）
+const LEGACY = new Set(['amp', 'AMP', 'lt', 'LT', 'gt', 'GT', 'quot', 'QUOT', 'nbsp', 'copy', 'COPY', 'reg', 'REG', 'middot', 'laquo', 'raquo', 'times', 'divide', 'deg', 'yen', 'pound', 'cent', 'sect', 'para', 'plusmn', 'frac12', 'frac14', 'frac34', 'sup2', 'sup3', 'micro', 'iexcl', 'iquest', 'acute', 'uml', 'cedil', 'macr', 'ordf', 'ordm', 'shy'])
+
+/**
+ * 还原转义。inAttr：属性值里老写法后面跟着字母、数字或 = 时不还原（和浏览器一样）。
+ * 返回 { text, unknown }：unknown = 认不出的命名转义（查网址时当可疑）
+ */
+export function decodeEntities(s, inAttr = false) {
+  const str = String(s)
+  if (!str.includes('&')) return { text: str, unknown: [] }
+  const unknown = []
+  const text = str.replace(/&(#[xX][0-9a-fA-F]+;?|#[0-9]+;?|[a-zA-Z][a-zA-Z0-9]*;?)/g, (m, body, off) => {
+    if (body[0] === '#') {
+      const hex = body[1] === 'x' || body[1] === 'X'
+      const n = parseInt(body.slice(hex ? 2 : 1).replace(';', ''), hex ? 16 : 10)
+      if (!Number.isFinite(n) || n === 0 || n > 0x10ffff || (n >= 0xd800 && n <= 0xdfff)) return '�'
+      return String.fromCodePoint(n)
+    }
+    const semi = body.endsWith(';')
+    const name = semi ? body.slice(0, -1) : body
+    if (semi && Object.prototype.hasOwnProperty.call(NAMED, name)) return NAMED[name]
+    // 不带分号：最长的老写法前缀
+    for (let k = name.length; k > 1; k--) {
+      const pre = name.slice(0, k)
+      if (!LEGACY.has(pre)) continue
+      const next = k < name.length ? name[k] : str[off + m.length] || ''
+      if (inAttr && (k < name.length || /[=a-zA-Z0-9]/.test(next))) break
+      return NAMED[pre] + name.slice(k) + (semi ? ';' : '')
+    }
+    unknown.push(m)
+    return m
+  })
+  return { text, unknown }
+}
+
+/**
+ * 从 src[i] === '<' 开始读一个标签（开始或结束标签）。读不成标签返回 null。
+ * 返回 { end?, name, attrs: [{ name, value, raw, start, end, vStart, vEnd, quote, dup }], selfClosing, start, close, eof }
+ *   value 已还原转义；raw 是原文；start / end 是整个属性在原文里的位置；vStart / vEnd 是值（不含引号）
+ */
+export function parseTagAt(src, i) {
+  let p = i + 1
+  let isEnd = false
+  if (src[p] === '/') { isEnd = true; p++ }
+  if (!ALPHA.test(src[p] || '')) return null
+  const n = src.length
+  let name = ''
+  while (p < n && !WS.has(src[p]) && src[p] !== '/' && src[p] !== '>') { name += src[p] === '\0' ? '�' : src[p]; p++ }
+  const tag = { end: isEnd, name: name.toLowerCase(), attrs: [], selfClosing: false, start: i, close: n, eof: false }
+  const seen = new Set()
+  const push = (a) => {
+    a.name = a.name.toLowerCase()
+    a.dup = seen.has(a.name)
+    seen.add(a.name)
+    const d = decodeEntities(a.raw, true)
+    a.value = d.text
+    a.unknown = d.unknown
+    tag.attrs.push(a)
+  }
+  for (;;) {
+    while (p < n && (WS.has(src[p]) || src[p] === '/')) {
+      if (src[p] === '/' && src[p + 1] === '>') { tag.selfClosing = true; p++; break }
+      p++
+    }
+    if (p >= n) { tag.eof = true; tag.close = n; return tag }
+    if (src[p] === '>') { tag.close = p + 1; return tag }
+    // 属性名（第一个字可以是 =）
+    const aStart = p
+    let aname = src[p]
+    p++
+    while (p < n && !WS.has(src[p]) && src[p] !== '/' && src[p] !== '>' && src[p] !== '=') { aname += src[p]; p++ }
+    let q = p
+    while (q < n && WS.has(src[q])) q++
+    if (src[q] !== '=') {
+      push({ name: aname, raw: '', start: aStart, end: p, vStart: p, vEnd: p, quote: '' })
+      continue
+    }
+    q++
+    while (q < n && WS.has(src[q])) q++
+    if (q >= n) { push({ name: aname, raw: '', start: aStart, end: n, vStart: n, vEnd: n, quote: '' }); tag.eof = true; tag.close = n; return tag }
+    if (src[q] === '>') { push({ name: aname, raw: '', start: aStart, end: q, vStart: q, vEnd: q, quote: '' }); p = q; continue }
+    if (src[q] === '"' || src[q] === "'") {
+      const quote = src[q]
+      const close = src.indexOf(quote, q + 1)
+      if (close < 0) { push({ name: aname, raw: src.slice(q + 1), start: aStart, end: n, vStart: q + 1, vEnd: n, quote }); tag.eof = true; tag.close = n; return tag }
+      push({ name: aname, raw: src.slice(q + 1, close), start: aStart, end: close + 1, vStart: q + 1, vEnd: close, quote })
+      p = close + 1
+      continue
+    }
+    let e = q
+    while (e < n && !WS.has(src[e]) && src[e] !== '>') e++
+    push({ name: aname, raw: src.slice(q, e), start: aStart, end: e, vStart: q, vEnd: e, quote: '' })
+    p = e
+  }
+}
+
+/** 第几行（1 起） */
+// 最近一份文字的换行位置（同一份文字反复问行号时不用每次从头数）
+let lineCache = { src: null, nl: null }
+export function lineAt(src, i) {
+  if (lineCache.src !== src) {
+    const nl = []
+    for (let k = src.indexOf('\n'); k >= 0; k = src.indexOf('\n', k + 1)) nl.push(k)
+    lineCache = { src, nl }
+  }
+  // 位置 i 之前有几个换行（二分）
+  const nl = lineCache.nl
+  let lo = 0
+  let hi = nl.length
+  const end = Math.min(i, src.length)
+  while (lo < hi) { const mid = (lo + hi) >> 1; if (nl[mid] < end) lo = mid + 1; else hi = mid }
+  return lo + 1
+}
+
+/**
+ * 照规范分词（简化版：只认数据、标签、注释、doctype、纯文字元素）。
+ * 返回 [{ type: 'text' | 'tag' | 'endtag' | 'comment' | 'doctype' | 'bogus' | 'cdata', start, end, ... }]
+ *   tag / endtag 带 parseTagAt 的结果；text 带 raw（在哪个纯文字元素里，没有是 ''）
+ */
+/**
+ * 纯文字元素从 from 起到哪结束：下一个 </名字（后面是空白、/ 或 >）。
+ * cdata：中间的 <![CDATA[ … ]]> 里的 </名字 不算（矢量图里 <style> 的 CDATA 是文字）；没收尾的 CDATA 一直到最后
+ */
+export function rawEnd(src, name, from, cdata = false) {
+  const re = new RegExp(`</${name}(?=[\\t\\n\\f\\r />])|<!\\[CDATA\\[`, 'ig')
+  re.lastIndex = from
+  for (;;) {
+    const m = re.exec(src)
+    if (!m) return src.length
+    if (m[0][1] === '/') return m.index
+    if (!cdata) continue
+    const c = src.indexOf(']]>', m.index + 9)
+    if (c < 0) return src.length
+    re.lastIndex = c + 3
+  }
+}
+
+/**
+ * opts.foreign：认不认 <svg> / <math>（外来内容）。默认认：里面 <![CDATA[ 是文字，只有 <style> 还按纯文字读（CDATA 里的 </style> 不算），
+ *   title / textarea 这些不按纯文字读（和独立的 SVG 文件一样）。false：完全按网页读（<svg> 里的 title / textarea 也按纯文字）。
+ *   网页里浏览器两种都有（<svg><p> 会跳回网页、<svg><title> 里按网页读）：查隐私 / 写法的地方两种都走一遍取并集（见 visibleText）
+ */
+export function tokenize(src, { foreign: useForeign = true } = {}) {
+  const out = []
+  const n = src.length
+  let i = 0
+  let raw = ''
+  let foreign = 0 // 在 <svg> / <math> 里几层（里面的 <![CDATA[ 是文字）
+  const text = (s, e, inRaw = '') => { if (e > s) out.push({ type: 'text', start: s, end: e, raw: inRaw, text: src.slice(s, e) }) }
+  while (i < n) {
+    if (raw) {
+      const e = raw === 'plaintext' ? n : rawEnd(src, raw, i, foreign > 0)
+      text(i, e, raw)
+      i = e
+      raw = ''
+      continue
+    }
+    const lt = src.indexOf('<', i)
+    if (lt < 0) { text(i, n); break }
+    text(i, lt)
+    const c = src[lt + 1] || ''
+    if (src.startsWith('<!--', lt)) {
+      let e
+      if (src.startsWith('<!-->', lt)) e = lt + 5
+      else if (src.startsWith('<!--->', lt)) e = lt + 6
+      else {
+        const a = src.indexOf('-->', lt + 4)
+        const b = src.indexOf('--!>', lt + 4)
+        const cands = [a >= 0 ? a + 3 : Infinity, b >= 0 ? b + 4 : Infinity]
+        e = Math.min(...cands)
+        if (!Number.isFinite(e)) e = n
+      }
+      out.push({ type: 'comment', start: lt, end: e, text: src.slice(lt, e) })
+      i = e
+      continue
+    }
+    if (c === '!') {
+      if (foreign && src.startsWith('<![CDATA[', lt)) {
+        const a = src.indexOf(']]>', lt + 9)
+        const e = a < 0 ? n : a + 3
+        out.push({ type: 'cdata', start: lt, end: e, text: src.slice(lt + 9, a < 0 ? n : a) })
+        i = e
+        continue
+      }
+      const a = src.indexOf('>', lt + 2)
+      const e = a < 0 ? n : a + 1
+      out.push({ type: /^<!doctype/i.test(src.slice(lt, lt + 9)) ? 'doctype' : 'bogus', start: lt, end: e, text: src.slice(lt, e) })
+      i = e
+      continue
+    }
+    if (c === '?') {
+      const a = src.indexOf('>', lt + 2)
+      const e = a < 0 ? n : a + 1
+      out.push({ type: 'bogus', start: lt, end: e, text: src.slice(lt, e) })
+      i = e
+      continue
+    }
+    if (c === '/') {
+      if (src[lt + 2] === '>') { i = lt + 3; continue }
+      if (!ALPHA.test(src[lt + 2] || '')) {
+        const a = src.indexOf('>', lt + 2)
+        const e = a < 0 ? n : a + 1
+        out.push({ type: 'bogus', start: lt, end: e, text: src.slice(lt, e) })
+        i = e
+        continue
+      }
+      const t = parseTagAt(src, lt)
+      out.push({ type: 'endtag', start: lt, end: t.close, tag: t })
+      if ((t.name === 'svg' || t.name === 'math') && foreign && useForeign) foreign--
+      i = t.close
+      continue
+    }
+    if (ALPHA.test(c)) {
+      const t = parseTagAt(src, lt)
+      out.push({ type: 'tag', start: lt, end: t.close, tag: t })
+      i = t.close
+      if (t.eof) break
+      if ((t.name === 'svg' || t.name === 'math') && !t.selfClosing && useForeign) foreign++
+      // <svg> / <math> 里（外来内容）：浏览器不按纯文字读 title / textarea / plaintext 这些（<svg><title> 里还会当网页读，
+      // 里面的 <style> 照样生效），只有 <style> 我们还按纯文字读（CSS 照样查，实体另外还原一遍）
+      if (t.name === 'plaintext' && !foreign) raw = 'plaintext'
+      else if (RAWTEXT.has(t.name) && !(foreign && (t.selfClosing || t.name !== 'style'))) raw = t.name
+      continue
+    }
+    text(lt, lt + 1)
+    i = lt + 1
+  }
+  return out
+}
+
+/** 每个「<字母」都当标签读一遍（包括藏在注释、样式、属性值里的）；返回 parseTagAt 的结果列表 */
+export function scanTags(src) {
+  const out = []
+  const re = /<[a-zA-Z]/g
+  let m
+  while ((m = re.exec(src))) {
+    const t = parseTagAt(src, m.index)
+    if (t) out.push(t)
+  }
+  return out
+}
+
+// 行内标签：前后的字在页面上连成一串（不隔开）；sup / sub 不算（脚注、上标和正文是两回事）
+const INLINE = new Set(['a', 'abbr', 'b', 'bdi', 'bdo', 'cite', 'code', 'data', 'del', 'dfn', 'em', 'font', 'i', 'ins', 'kbd', 'label', 'mark', 'nobr', 'q', 's', 'samp', 'small', 'span', 'strong', 'time', 'tspan', 'tt', 'u', 'var', 'wbr'])
+
+/**
+ * 看得见的文字（和 alt / title / placeholder 这些也会显示出来的属性）：查个人信息、可疑字用。
+ * 按网页读和认外来内容读各走一遍取并集（浏览器在 <svg> / <math> 里会跳回网页读，两种都可能），宁多勿漏；
+ * textarea / title / noscript / xmp / plaintext 里的字也算（会显示出来）。
+ * 页面上连着的一串字（中间只隔着行内标签、注释，那里留一个 \u200b）拼成一段；表格格子、段落、换行这些隔开的各是一段，段和段之间用 \u0001 隔开
+ *（不会被当成号码里的分隔，三个格子里的 139 / 1234 / 7788 不拼成手机号）
+ */
+export function visibleText(src) {
+  const parts = []
+  const seen = new Set()
+  const add = (x) => { if (x && x.trim() && !seen.has(x)) { seen.add(x); parts.push(x) } }
+  const SHOWN = new Set(['alt', 'title', 'placeholder', 'aria-label', 'value', 'content', 'label', 'summary', 'data-title'])
+  const SHOWN_RAW = new Set(['', 'textarea', 'title', 'noscript', 'xmp', 'plaintext'])
+  for (const foreign of [true, false]) {
+    let run = ''
+    // 一段里连续的空白按浏览器的做法并成一个；行内标签、注释那里留一个看不见的分界（\u200b）：
+    // 号码可以跨过它（<b>139</b> 1234 7788），也可以从它后面开始（<span>Tel</span><span>139…</span> 排成两块时）
+    const flush = () => { add(run.replace(/[ \t\n\r\f\u200b]+/g, (m) => (m.includes('\u200b') ? (/[^\u200b]/.test(m) ? ' \u200b' : '\u200b') : ' '))); run = '' }
+    const mark = () => { if (run) run += '\u200b' }
+    for (const t of tokenize(src, { foreign })) {
+      if (t.type === 'text' && SHOWN_RAW.has(t.raw || '')) {
+        if (t.raw) { flush(); add(decodeEntities(t.text).text) } else run += decodeEntities(t.text).text
+        continue
+      }
+      if (t.type === 'cdata') { run += t.text; continue }
+      if (t.type === 'comment') { mark(); continue }
+      const tag = t.type === 'tag' || t.type === 'endtag' ? t.tag : null
+      if (tag && INLINE.has(tag.name)) mark()
+      else flush()
+      if (t.type === 'tag') for (const a of tag.attrs) if (SHOWN.has(a.name)) add(a.value)
+    }
+    flush()
+  }
+  return parts.join('\n\u0001\n')
+}

package/lib/gallery/index.js

@@ -0,0 +1,22 @@
+/**
+ * `dsh-design-studio/gallery`：给设计市场的内容仓库（机器人 / CI）用的出口。
+ * 规则和插件里「用这个开始」「打成 zip」是同一份，机器人按版本钉住插件，两边不会各查各的。
+ *
+ *   checkPack / checkManifest / checkStyle / normalizeHtml / message   检查规则（不依赖 Node）
+ *   readZip / writeZip / readTar                                         zip、npm 包 tgz（不加依赖）
+ *   cssTokens                                                            CSS 分词（转义会还原）
+ *   renderPack                                                           断网开出来跑体检、截图（要 Chrome）
+ */
+
+export {
+  FORMAT, LIMITS, TYPES, LICENSES, KINDS, STYLE_IDS, HEADS,
+  checkPack, checkManifest, checkStyle, normalizeHtml, message, hexRatio, metaKind, titleOf, cleanPath, textFlags, imageMeta, localPathIn,
+} from './policy.js'
+export { stripMeta, stripInline } from './pack.js'
+export { readZip, writeZip, crc32, ZipError, ZIP_LIMITS } from './zip.js'
+export { readTar, TarError, TAR_LIMITS } from './tar.js'
+export { cssTokens } from './css.js'
+export { renderPack, HARD } from './render.js'
+export { decodePng, findQrLike } from './qrfind.js'
+export { KIND_SIZE } from '../look.js'
+export { findBrowser } from '../browser.js'