dsh-piggy 0.25.0

package/src/client/dom.js

@@ -0,0 +1,33 @@
+// @ts-check
+/**
+ * 极小的 DOM 构造助手。
+ *
+ * @module dsh-piggy/client/dom
+ */
+
+import { num } from './values.js'
+export function el(tag, className, text) {
+  var node = document.createElement(tag)
+  if (className) node.className = className
+  if (text !== undefined) node.textContent = text
+  return node
+}
+
+export function button(className, attrs, onClick) {
+  var node = el('button', className)
+  node.type = 'button'
+  for (var key in attrs) node.setAttribute(key, attrs[key])
+  node.addEventListener('click', function (event) {
+    event.stopPropagation()
+    onClick()
+  })
+  return node
+}
+
+export function meter(value, variant) {
+  var wrap = el('div', 'dp-meter' + (variant ? ' ' + variant : ''))
+  var fill = document.createElement('i')
+  fill.style.width = Math.max(0, Math.min(100, num(value, 0))) + '%'
+  wrap.appendChild(fill)
+  return wrap
+}

package/src/client/effects.js

@@ -0,0 +1,159 @@
+// @ts-check
+/**
+ * 猪的即时反馈：动作动画、粒子、气泡台词与 toast。
+ *
+ * 只碰交给它的几个元素，不读全局状态 —— 「猪还在不在」通过 isStopped()
+ * 回调问外壳（见 docs/CONVENTIONS.md）。
+ * @module dsh-piggy/client/effects
+ */
+import { syncPigArt } from './art.js'
+import { PET_LINES } from './constants.js'
+import { el } from './dom.js'
+
+/**
+ * @param {{ scene: object, pig: object, pigArt: object, card: object, bubble: object, isStopped: () => boolean }} deps
+ * @returns {{ react: Function, burst: Function, flash: Function, showBubble: Function, showLine: Function, toast: Function, dispose: Function }}
+ */
+export function createEffects(deps) {
+  var scene = deps.scene
+  var pig = deps.pig
+  var card = deps.card
+  var bubble = deps.bubble
+  var isStopped = deps.isStopped
+
+  var reactTimer = null
+  var bubbleTimer = null
+
+// ---- animation ----
+function react(kind, ms) {
+  if (reactTimer !== null) window.clearTimeout(reactTimer)
+  // Re-assigning the same value does NOT restart a CSS animation, so
+  // clicking three times quickly only played it once. Dropping the
+  // attribute and forcing a reflow makes every click start from zero.
+  pig.removeAttribute('data-react')
+  void pig.offsetWidth
+  pig.setAttribute('data-react', kind)
+  syncPigArt(pig, deps.pigArt)
+  reactTimer = window.setTimeout(function () {
+    pig.removeAttribute('data-react')
+    syncPigArt(pig, deps.pigArt)
+    reactTimer = null
+  }, ms || 900)
+}
+
+function burst(emojis, count) {
+  for (var i = 0; i < (count || 1); i += 1) {
+    (function (index) {
+      window.setTimeout(function () {
+        if (isStopped()) return
+        var node = el('span', 'dp-fx', emojis[index % emojis.length])
+        node.style.setProperty('--dx', Math.round((Math.random() - 0.5) * 46) + 'px')
+        // Anchor to the pig, not the scene. The scene is panel-wide when
+        // open, so fixed coordinates put every particle off to one side.
+        var spot = headSpot()
+        node.style.left = (spot.x + Math.round((Math.random() - 0.5) * 22)) + 'px'
+        node.style.top = spot.y + 'px'
+        scene.appendChild(node)
+        window.setTimeout(function () { node.remove() }, 1200)
+      }, index * 110)
+    })(i)
+  }
+}
+
+/** Just above the pig's head, in scene coordinates. */
+function headSpot() {
+  var fallback = { x: 24, y: 8 }
+  if (typeof pig.getBoundingClientRect !== 'function' || typeof scene.getBoundingClientRect !== 'function') return fallback
+  var p = pig.getBoundingClientRect()
+  var s = scene.getBoundingClientRect()
+  if (p.width === 0 && p.height === 0) return fallback
+  return { x: p.left - s.left + p.width / 2, y: p.top - s.top - 20 }
+}
+
+var REACTIONS = {
+  hatch: { kind: 'levelup', ms: 980, fx: ['🥚', '✨', '🐖', '🎉'], count: 4, say: '孵出来啦！' },
+  feed: { kind: 'feed', ms: 900, fx: ['🍎', '😋', '✨'], count: 3, say: '吃掉了！' },
+  bathe: { kind: 'bathe', ms: 1050, fx: ['🫧', '🫧', '💧', '✨'], count: 4, say: '洗干净啦～' },
+  play: { kind: 'play', ms: 900, fx: ['🎾', '⭐', '💨'], count: 3, say: '好开心！' },
+  pet: { kind: 'pet', ms: 420, fx: ['❤️'], count: 1, say: '好舒服…' },
+  work: { kind: 'away', ms: 900, fx: ['💼', '🧱', '🪙'], count: 3, say: '出门打工！' },
+  study: { kind: 'away', ms: 900, fx: ['📚', '✏️', '🧠'], count: 3, say: '上学去！' },
+  trip: { kind: 'away', ms: 900, fx: ['🧳', '🗺', '✨'], count: 3, say: '出发旅行！' },
+  calloff: { kind: 'refuse', ms: 520, fx: ['💨'], count: 1, say: '提前回来了…' },
+  buy: { kind: 'pet', ms: 620, fx: ['🪙', '🛒'], count: 2, say: '买到了！' },
+  use: { kind: 'pet', ms: 620, fx: ['✨'], count: 2, say: '用掉了。' },
+}
+
+function flash(action) {
+  var spec = REACTIONS[action]
+  if (spec === undefined) return
+  react(spec.kind, spec.ms)
+  burst(spec.fx, spec.count)
+  // Patting is the one thing you do over and over, so it gets a pool of
+  // lines rather than the same four characters every time.
+  var lines = action === 'pet' ? PET_LINES : null
+  showBubble(lines === null ? spec.say : lines[Math.floor(Math.random() * lines.length)], 1600)
+}
+
+var bubbleTimer = null
+function showBubble(text, ms) {
+  if (bubbleTimer !== null) window.clearTimeout(bubbleTimer)
+  bubble.textContent = text
+  bubble.hidden = false
+  bubbleTimer = window.setTimeout(function () {
+    bubble.hidden = true
+    bubbleTimer = null
+  }, ms || 2600)
+}
+
+/**
+ * A line the pig says, with optional reply buttons. Replying closes the bubble;
+ * a line with buttons stays up longer so there is time to answer it.
+ * @param {string} text
+ * @param {string[]} replies
+ * @param {(index: number) => void} onReply
+ */
+function showLine(text, replies, onReply) {
+  if (replies.length === 0) {
+    showBubble(text, 2600)
+    return
+  }
+  if (bubbleTimer !== null) window.clearTimeout(bubbleTimer)
+  bubble.textContent = text
+  var row = el('div', 'dp-bubble-replies', '')
+  replies.forEach(function (label, index) {
+    var answer = el('button', 'dp-reply', label)
+    answer.type = 'button'
+    answer.addEventListener('click', function (event) {
+      // The bubble sits over the pig; a reply must not also count as a pat.
+      event.stopPropagation()
+      bubble.hidden = true
+      if (bubbleTimer !== null) window.clearTimeout(bubbleTimer)
+      bubbleTimer = null
+      onReply(index)
+    })
+    row.appendChild(answer)
+  })
+  bubble.appendChild(row)
+  bubble.hidden = false
+  bubbleTimer = window.setTimeout(function () {
+    bubble.hidden = true
+    bubbleTimer = null
+  }, 6000)
+}
+
+function toast(text) {
+  var node = el('div', 'dp-toast', text)
+  card.insertBefore(node, card.firstChild)
+  window.setTimeout(function () { node.remove() }, 4800)
+}
+  /** Drop the pending timers — the panel is going away, nothing should fire. */
+  function dispose() {
+    if (reactTimer !== null) window.clearTimeout(reactTimer)
+    if (bubbleTimer !== null) window.clearTimeout(bubbleTimer)
+    reactTimer = null
+    bubbleTimer = null
+  }
+
+  return { react: react, burst: burst, flash: flash, showBubble: showBubble, showLine: showLine, toast: toast, dispose: dispose }
+}

package/src/client/format.js

@@ -0,0 +1,27 @@
+// @ts-check
+/**
+ * 客户端小格式化：天数、分钟数、物品类别名。
+ *
+ * 纯函数，输入输出都是字符串（见 docs/CONVENTIONS.md）。
+ * @module dsh-piggy/client/format
+ */
+
+export function formatDays(days) {
+  if (days >= 1) return Math.round(days) + ' 天'
+  const hours = days * 24
+  return hours >= 1 ? Math.round(hours) + ' 小时' : Math.max(1, Math.round(hours * 60)) + ' 分钟'
+}
+
+export function formatMinutes(minutes) {
+  if (minutes < 60) return minutes + ' 分钟'
+  const hours = Math.floor(minutes / 60)
+  const rest = minutes % 60
+  return rest === 0 ? hours + ' 小时' : hours + ' 小时' + rest + ' 分'
+}
+
+export function kindLabel(item) {
+  if (item.kind === 'medicine') return item.needed ? '对症！' : '药'
+  if (item.kind === 'revive') return '复活用'
+  if (item.kind === 'bath') return '洗浴'
+  return '食物'
+}

package/src/client/index.js

@@ -0,0 +1,393 @@
+/**
+ * dsh-piggy · client — the floating pig.
+ *
+ * Hand-written browser bundle: DSH loads it through `window.__ModuleLoader__`,
+ * bundled by esbuild from the modules beside it: raw DOM and `fetch` only, no framework.
+ *
+ * Layout follows the original QQ 宠物: the pet sits at the top, and a cream icon
+ * bar sits directly beneath it. Six icons — 状态 · 学习 · 打工 · 商店 · 旅行 ·
+ * 背包 — switch what the area below the bar shows, so nothing ever needs typing.
+ *
+ * Every value the host sends goes through `normalize()` first. A host/client
+ * version mismatch must degrade to sane defaults and an explanation, never to a
+ * screen full of `undefined`.
+ */
+
+import { renderBagTab } from './tabs/bag.js'
+import { renderDevTab } from './tabs/dev.js'
+import { renderShopTab } from './tabs/shop.js'
+import { renderStatusTab } from './tabs/status.js'
+import { renderStudyTab } from './tabs/study.js'
+import { renderTravelTab } from './tabs/travel.js'
+import { renderWorkTab } from './tabs/work.js'
+import { createEffects } from './effects.js'
+import { createIo } from './io.js'
+import { createLayout } from './layout.js'
+import { createPanel } from './panel.js'
+import { createScene } from './scene.js'
+import { CSS } from './styles.js'
+import { ACT_URL, ART_URL, BOX_POKES_TO_OPEN, BOX_POKE_LINES, CARE_LABEL, DEV_KEY, DEV_TAB, KIND_ORDER, KIND_TITLE, MOUNTED, MODES, NO_ITEM_LINE, OPEN_KEY, PANEL_GAP, PANEL_MARGIN, PANEL_MIN_HEIGHT, PANEL_WIDTH, PET_LINES, PIG_PADDING_X, GREET_DELAY_MS, IDLE_CHAT_MINUTES, POLL_MS, POSITION_KEY, SCENE_RESERVE, STAGES, STATE_URL, TABS } from './constants.js'
+import { button, el, meter } from './dom.js'
+import { normalize } from './normalize.js'
+import { readStore, writeStore } from './storage.js'
+import { arr, num, obj, str } from './values.js'
+
+/** @type {any} */ (window).__ModuleLoader__.load({
+  id: 'dsh-piggy',
+  factory: (require) => {
+    var module = { exports: {} }
+    var exports = module.exports
+
+    var devMode = false
+
+    function apply(ctx) {
+      // A client plugin that throws while activating can take the whole web boot
+      // down with it, so the pig never lets an exception escape.
+      try {
+        return mount()
+      } catch (error) {
+        console.warn('[dsh-piggy] 挂载失败，猪先退到一边', error)
+        return () => {}
+      }
+    }
+
+    function mount() {
+      if (document.querySelector('[' + MOUNTED + ']') !== null) {
+        console.warn('[dsh-piggy] 已存在实例，跳过重复挂载')
+        return () => {}
+      }
+
+      // Nunito + Noto Sans SC, per the design system's standalone recipe. The
+      // request is non-blocking (`display=swap`) and the token font stack falls
+      // back to system faces, so an offline or blocked load degrades quietly
+      // instead of breaking the panel.
+      var parts = createScene()
+      var { font, style, host, card, scene, hud, hudName, hudCoins, hudHealth, bubble, work, prop,
+        progressWrap, progressFill, pokeHint, dailyHint, soul, pigArt, pigEmoji, pig, dressSlots, bar, content } = parts
+
+      var savedPos = readStore(POSITION_KEY)
+      // The pig's position as the user set it, before any on-screen clamp.
+      var userRight = 18
+      var userBottom = 18
+      if (savedPos !== null) {
+        try {
+          var parsed = JSON.parse(savedPos)
+          if (parsed && typeof parsed.right === 'number') userRight = parsed.right
+          if (parsed && typeof parsed.bottom === 'number') userBottom = parsed.bottom
+        } catch (error) { /* ignore */ }
+      }
+      host.style.right = userRight + 'px'
+      host.style.bottom = userBottom + 'px'
+
+      // Keep the pig itself on screen — and nothing more. There used to be a
+      // composer-avoidance floor here that forced the widget above the input box:
+      // it existed because the wrapper swallowed clicks aimed at the send button.
+      // `pointer-events:none` solves that properly now, so the clamp only ever
+      // stopped the user from parking their pet where they wanted it.
+
+      /**
+       * Place the panel so it is fully on screen, wherever the pig has been
+       * parked. The pig itself is never moved by this: the panel is absolutely
+       * positioned, so it takes no space in the wrapper's box.
+       */
+
+      var icons = {}
+
+      /** The tabs on show right now: the normal six, plus 调试 when dev mode is on. */
+
+      /** Rebuild the icon bar. Called whenever dev mode flips. */
+
+      // ---- state ----
+      var view = normalize(null)
+      // B9: the panel opens on the home screen of app tiles.
+      var tab = 'home'
+      var stage = 'primary'
+      // 用户自己点过学段之后，轮询就不许再替他改（B1 的「默认学段」只在没选过时生效）。
+      var stagePicked = false
+      // B8: which category each tile tab is opened into (null = the top layer), and a picked tile inside it.
+      var drill = { study: null, shop: null, bag: null, work: null, pick: null }
+      // Which souvenir's story card is open in the travel tab, if any.
+      var souvenirPick = null
+      // Which care action's item picker is open, if any.
+      var picker = null
+      // The owner-name draft while it is being edited on the status tab (null = not editing).
+      var ownerEdit = null
+      // 猪的名字草稿（同上：编辑期间轮询不许重绘，否则输入框会丢焦点）。
+      var pigNameEdit = null
+      // 居民卡: { field: 'catchphrase'|'motto', draft } while one is being edited.
+      var cardEdit = null
+
+      /** The tabs get an explicit context instead of closing over the shell locals. */
+      var isOpen = readStore(OPEN_KEY) === 'true'
+      var lastStage = null
+      var lastPendingAt = 0
+      var lastPendingId = 0
+      var pollTimer = null
+      var fx = createEffects({
+        scene: scene, pig: pig, pigArt: pigArt, card: card, bubble: bubble,
+        isStopped: function () { return stopped },
+      })
+      var react = fx.react, burst = fx.burst, flash = fx.flash
+      var showBubble = fx.showBubble, showLine = fx.showLine, toast = fx.toast
+      var stopped = false
+      var busy = false
+
+      /** The shell hands the modules an explicit context instead of sharing a scope. */
+      var ctx = {
+        host: host,
+        card: card,
+        content: content,
+        scene: scene,
+        hud: hud,
+        hudName: hudName,
+        hudCoins: hudCoins,
+        hudHealth: hudHealth,
+        bubble: bubble,
+        work: work,
+        prop: prop,
+        progressWrap: progressWrap,
+        progressFill: progressFill,
+        pokeHint: pokeHint,
+        dailyHint: dailyHint,
+        soul: soul,
+        pigArt: pigArt,
+        pigEmoji: pigEmoji,
+        pig: pig,
+        dressSlots: dressSlots,
+        bar: bar,
+        icons: icons,
+        flash: flash,
+        react: react,
+        burst: burst,
+        showBubble: showBubble,
+        showLine: showLine,
+        toast: toast,
+        get view() { return view }, set view(next) { view = next },
+        get tab() { return tab }, set tab(next) { tab = next },
+        get stage() { return stage }, set stage(next) { stage = next },
+        get stagePicked() { return stagePicked }, set stagePicked(next) { stagePicked = next },
+        get drill() { return drill },
+        get picker() { return picker }, set picker(next) { picker = next },
+        get souvenirPick() { return souvenirPick }, set souvenirPick(next) { souvenirPick = next },
+        get ownerEdit() { return ownerEdit }, set ownerEdit(next) { ownerEdit = next },
+        get pigNameEdit() { return pigNameEdit }, set pigNameEdit(next) { pigNameEdit = next },
+        get cardEdit() { return cardEdit }, set cardEdit(next) { cardEdit = next },
+        get isOpen() { return isOpen }, set isOpen(next) { isOpen = next },
+        get lastStage() { return lastStage }, set lastStage(next) { lastStage = next },
+        get lastPendingAt() { return lastPendingAt }, set lastPendingAt(next) { lastPendingAt = next },
+        get lastPendingId() { return lastPendingId }, set lastPendingId(next) { lastPendingId = next },
+        get userRight() { return userRight }, set userRight(next) { userRight = next },
+        get userBottom() { return userBottom }, set userBottom(next) { userBottom = next },
+        get busy() { return busy }, set busy(next) { busy = next },
+        get stopped() { return stopped }, set stopped(next) { stopped = next },
+        get devMode() { return devMode },
+      }
+      var layout = createLayout(ctx)
+      var panel = createPanel(ctx)
+      ctx.select = panel.select
+      ctx.setOpen = panel.setOpen
+      ctx.fitPanel = layout.fitPanel
+      ctx.paintBar = layout.paintBar
+      ctx.buildIcon = layout.buildIcon
+      ctx.clampPig = layout.clampPig
+      var render = panel.render, renderContent = panel.renderContent
+      var setOpen = panel.setOpen, select = panel.select
+      var fitPanel = layout.fitPanel, clampPig = layout.clampPig
+      var paintBar = layout.paintBar, buildIcon = layout.buildIcon
+      for (var t = 0; t < TABS.length; t += 1) buildIcon(TABS[t])
+      // `ui` was built before these existed; point it at the real ones now.
+      var io = createIo(ctx)
+      var send = io.send, refresh = io.refresh
+      ctx.send = send
+      ctx.render = render
+      ctx.renderContent = renderContent
+      ctx.send = send
+      ctx.renderContent = renderContent
+      ctx.setOpen = setOpen
+      ctx.fitPanel = fitPanel
+      ctx.flash = flash
+
+      // 日常气泡（签到/礼包）的点击只在这里绑一次；它压在猪上面，事件不能冒泡给
+      // 拖动和摸摸。
+      dailyHint.addEventListener('pointerdown', function (event) { event.stopPropagation() })
+      dailyHint.addEventListener('click', function (event) {
+        event.stopPropagation()
+        var action = dailyHint.getAttribute('data-action')
+        if (action !== null && action !== '') send(action)
+      })
+
+      // ---- open / close ----
+
+      /**
+       * Developer tab. Drives the pig into any state so a change can be looked at
+       * immediately instead of waiting days for it — and so the states that are
+       * hard to reach by playing (dying, the last illness stage, an elder pig)
+       * can be checked at all.
+       */
+
+      // ---- drag the pig; right-click it for the menu ----
+      var drag = null
+      scene.addEventListener('pointerdown', function (event) {
+        if (event.button !== 0) return
+        drag = {
+          x: event.clientX, y: event.clientY,
+          right: parseFloat(getComputedStyle(host).right) || 18,
+          bottom: parseFloat(getComputedStyle(host).bottom) || 18,
+          moved: false,
+        }
+        scene.setAttribute('data-dragging', 'true')
+        scene.setPointerCapture?.(event.pointerId)
+      })
+      scene.addEventListener('pointermove', function (event) {
+        if (drag === null) return
+        var dx = event.clientX - drag.x
+        var dy = event.clientY - drag.y
+        if (Math.abs(dx) > 3 || Math.abs(dy) > 3) drag.moved = true
+        userRight = drag.right - dx
+        userBottom = drag.bottom - dy
+        clampPig()
+        // The panel rides along so it is never left behind off screen.
+        fitPanel()
+      })
+      function endDrag() {
+        if (drag === null) return false
+        var moved = drag.moved
+        drag = null
+        scene.removeAttribute('data-dragging')
+        clampPig()
+        writeStore(POSITION_KEY, JSON.stringify({ right: userRight, bottom: userBottom }))
+        fitPanel()
+        return moved
+      }
+      var boxPokes = 0
+
+      /**
+       * Poke the box. Three pokes and the piglet comes out — the count is what
+       * makes it feel like something is in there rather than a button that
+       * happens to be cardboard-shaped.
+       */
+      function pokeBox() {
+        boxPokes += 1
+        react('poke', 560)
+        if (boxPokes >= BOX_POKES_TO_OPEN) {
+          boxPokes = 0
+          host.removeAttribute('data-poke')
+          showBubble('哇——！', 1200)
+          burst(['✨', '🎉', '💨'], 6)
+          send('hatch')
+          return
+        }
+        host.setAttribute('data-poke', String(boxPokes))
+        burst(['💨'], 2)
+        showBubble(BOX_POKE_LINES[boxPokes - 1], 2200)
+      }
+
+      // Left click is a pat on the head. The menu is on the context menu, so a
+      // stray click can no longer open or close the panel by accident.
+      scene.addEventListener('pointerup', function () {
+        if (endDrag()) return
+        // An unhatched save is a box, whether or not one exists yet.
+        if (view.hatched !== true) {
+          pokeBox()
+          return
+        }
+        if (!view.dead) flash('pet')
+      })
+      scene.addEventListener('pointercancel', function () { endDrag() })
+      scene.addEventListener('contextmenu', function (event) {
+        event.preventDefault()
+        setOpen(!isOpen)
+        if (isOpen && view.pig !== null) flash('pet')
+      })
+
+      // ---- life ----
+      clampPig()
+      setOpen(isOpen)
+      render(view)
+      refresh()
+      pollTimer = window.setInterval(refresh, POLL_MS)
+
+      // B6: the pig greets the owner once per page load (the host decides
+      // whether it has been away long enough), then speaks up now and then.
+      var chatTimer = null
+      function scheduleChat() {
+        var minutes = IDLE_CHAT_MINUTES.min + Math.random() * (IDLE_CHAT_MINUTES.max - IDLE_CHAT_MINUTES.min)
+        chatTimer = window.setTimeout(function () {
+          if (!stopped && !busy && view.pig !== null) send('chat', { reason: 'idle' })
+          scheduleChat()
+        }, minutes * 60000)
+      }
+      var greetTimer = window.setTimeout(function () {
+        if (!stopped && view.pig !== null) send('chat', { reason: 'enter' })
+      }, GREET_DELAY_MS)
+      scheduleChat()
+      // Optional call: minimal test environments stub a window without listeners.
+      // Optional call: minimal test environments stub a window without listeners.
+      function onResize() {
+        clampPig()
+        fitPanel()
+      }
+      window.addEventListener?.('resize', onResize)
+
+      // ---- developer mode: Ctrl+Shift+D ----
+      function setDevMode(on) {
+        devMode = on === true
+        writeStore(DEV_KEY, devMode ? '1' : '0')
+        host.setAttribute('data-dev', devMode ? 'true' : 'false')
+        paintBar()
+        if (devMode) {
+          setOpen(true)
+          select('dev')
+          showBubble('🔧 开发者模式已开', 2000)
+        } else {
+          if (tab === 'dev') select('status')
+          showBubble('开发者模式已关', 1600)
+        }
+      }
+
+      devMode = readStore(DEV_KEY) === '1'
+      host.setAttribute('data-dev', devMode ? 'true' : 'false')
+      if (devMode) paintBar()
+
+      function onKeyDown(event) {
+        if (event.ctrlKey && event.shiftKey && (event.key === 'D' || event.key === 'd')) {
+          event.preventDefault()
+          setDevMode(!devMode)
+        }
+      }
+      window.addEventListener?.('keydown', onKeyDown)
+
+      // Also reachable from the console, for when the panel is off screen.
+      try {
+        /** @type {any} */ (window).dshPigDev = {
+          on: function () { setDevMode(true) },
+          off: function () { setDevMode(false) },
+          toggle: function () { setDevMode(!devMode) },
+        }
+      } catch (error) { /* frozen window */ }
+
+      function dispose() {
+        stopped = true
+        window.removeEventListener?.('resize', onResize)
+        // #11: the dev shortcut and the console handle outlived the pig, so a
+        // reload could toggle a panel that had already been disposed.
+        window.removeEventListener?.('keydown', onKeyDown)
+        try { delete (/** @type {any} */ (window)).dshPigDev } catch (error) { /* frozen window */ }
+        if (pollTimer !== null) window.clearInterval(pollTimer)
+        if (chatTimer !== null) window.clearTimeout(chatTimer)
+        window.clearTimeout(greetTimer)
+        fx.dispose()
+        pollTimer = null
+        host.remove()
+        style.remove()
+        font.remove()
+      }
+
+      return dispose
+    }
+
+    exports.name = 'dsh-piggy'
+    exports.apply = apply
+    return module.exports
+  },
+})