dsh-design-studio 0.4.0 → 0.4.1

package/lib/client.js

@@ -144,6 +144,7 @@ window.__ModuleLoader__.load({
       textAsk: '把页面上的「{before}」改成「{after}」（只改这一处文字，别的不动）。\n{where}\n',
       demoNone: '这一屏还没有跳到别的屏的按钮；可以让模型用 <a href="detail.html"> 把几屏串起来',
       phone: '在手机上看',
+      away: '这里看不到预览：预览跑在电脑本机上，从手机或别的电脑打开 DSH 时连不过去。回到那台电脑上看；想在手机上看，就在电脑上点「在手机上看」扫码（同一个 Wi-Fi）。',
       phoneStarting: '正在打开…',
       phoneHow: '用手机相机扫一扫',
       phoneWifi: '手机和电脑要连同一个 Wi-Fi',
@@ -289,6 +290,7 @@ window.__ModuleLoader__.load({
       textAsk: 'Change the text "{before}" to "{after}" on the page (only this text, nothing else).\n{where}\n',
       demoNone: 'This screen has no links to other screens yet. Ask the model to connect screens with <a href="detail.html">',
       phone: 'View on phone',
+      away: 'The preview runs on the computer itself, so it can\'t load when DSH is opened from a phone or another computer. View it on that computer, or click "View on phone" there and scan the code (same Wi-Fi).',
       phoneStarting: 'Starting…',
       phoneHow: 'Scan with your phone camera',
       phoneWifi: 'Phone and computer must be on the same Wi-Fi',
@@ -385,6 +387,7 @@ window.__ModuleLoader__.load({
 .ddp-stage{position:relative;flex:1;min-height:0;overflow:hidden;background:var(--dsw-alias-bg-layer-2)}
 .ddp-stage.full{background:#fff}
 .ddp-scr{position:absolute;inset:0;overflow:hidden}
+.ddp-away{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;font-size:13px;line-height:1.6;color:var(--dsw-alias-text-secondary,#888);background:var(--dsw-alias-bg-layer-1)}
 .ddp-frame{position:absolute;left:0;top:0;width:100%;height:100%;border:0;background:#fff;opacity:0;z-index:0;pointer-events:none}
 .ddp-frame.old{opacity:1;z-index:1}
 .ddp-frame.cur{opacity:1;z-index:2;pointer-events:auto;transition:opacity .32s ease}
@@ -1468,6 +1471,12 @@ window.__ModuleLoader__.load({
      * 一屏：几帧 iframe 叠在一起。cur 是正在显示的；比它新的在后台载，载好了淡入换上来，旧的随后拆掉（不白屏）。
      * 和页面里 picker.js 的握手：hello → init（上一帧的滚动位置和指纹）→ ready → 换上来 → reveal（闪改动 / 播生成动画）。
      */
+    const LOCAL_HOST = /^(127\.0\.0\.1|localhost|\[::1\]|::1)$/i
+    /** 预览在电脑本机，而 DSH 网页是从别的设备打开的 */
+    function away(src) {
+      try { return !!src && LOCAL_HOST.test(new URL(src).hostname) && /^https?:$/.test(location.protocol) && !LOCAL_HOST.test(location.hostname) } catch { return false }
+    }
+
     function Screen(props) {
       const src = props.src
       const origin = src ? new URL(src).origin : ''
@@ -1678,6 +1687,9 @@ window.__ModuleLoader__.load({
         }, 1600)
       }
 
+      // 预览服务器只听电脑本机（127.0.0.1）。从手机（dsh-mobile）或别的电脑打开 DSH 网页时，这个地址指的是它们自己，
+      // 框里会一直空白：说清楚
+      if (away(src)) return h('div', { className: 'ddp-scr' + (props.dark ? ' dk' : '') }, h('div', { className: 'ddp-away', style: { fontSize: 13 / Math.max(0.25, props.zoom || 1) } }, props.t ? props.t('away') : ZH.away)) // 画布缩小了，字别跟着变小
       return h('div', { className: 'ddp-scr' + (props.dark ? ' dk' : '') },
         ...frames.map((f) => h('iframe', {
           key: f.id,
@@ -2355,7 +2367,7 @@ window.__ModuleLoader__.load({
       }
 
       const renderScreen = (sc, z, fill) => h(Device, { kind, w: size[0], h: size[1], fill, label: labelOf(sc) },
-        h(Screen, {
+        h(Screen, { t,
           src: sc.url,
           label: labelOf(sc),
           busy: busy && !sc.v,
@@ -2622,7 +2634,7 @@ window.__ModuleLoader__.load({
             h('div', { className: 'ddp-single' },
               h('div', { className: 'ddp-fit' + (fill ? ' fill' : ''), style: fill ? undefined : { width: dw, height: dh, transform: `translate(-50%, -50%) scale(${z})` } },
                 h(Device, { kind, w: size[0], h: size[1], fill, label },
-                  h(Screen, {
+                  h(Screen, { t,
                     src: urlOfKey(l.key),
                     label,
                     busy: false,
@@ -2656,7 +2668,7 @@ window.__ModuleLoader__.load({
           sel: '',
           labelOf: (sc) => sc.label,
           render: (sc, z, i) => h(Device, { kind: items[i].kind, w: items[i].size[0], h: items[i].size[1], label: labelOf(base) },
-            h(Screen, {
+            h(Screen, { t,
               src: base.url,
               label: labelOf(base),
               busy,
@@ -2685,7 +2697,7 @@ window.__ModuleLoader__.load({
         const z = fill ? 1 : Math.max(0.05, Math.min(1, (box.w - 32) / dw, (box.h - 32 - (ver ? 46 : 0)) / dh))
         // 两边的小标签不跟着画面缩小（缩了看不清）；手机、平板躲开状态栏
         const tagAt = (side) => ({ top: kind === 'app' || kind === 'tablet' ? 60 : 10, transform: `scale(${1 / z})`, transformOrigin: 'top ' + side })
-        const screenOf = (sc) => h(Screen, { src: sc.url, label: labelOf(sc), busy: false, born: false, picking: false, dark, zoom: z, reloadSeq,
+        const screenOf = (sc) => h(Screen, { t, src: sc.url, label: labelOf(sc), busy: false, born: false, picking: false, dark, zoom: z, reloadSeq,
           apis: apis.current, apiKey: 'cmp|' + ik(sc), onMeta: (m, title, toks, dk) => remember(ik(sc), m, title, toks, dk) })
         body = h('div', { className: 'ddp-single' },
           h('div', { className: 'ddp-fit' + (fill ? ' fill' : ''), style: fill ? undefined : { width: dw, height: dh, transform: `translate(-50%, -50%) scale(${z})` } },

package/lib/preset.js

@@ -1,5 +1,22 @@
 /**
- * dsh-design-studio/preset：设计模式那一行。就是 DSH 自带的 Agent 预设，
- * 换个入口好让 DSH「插件」页里显示成设计模式（名字和说明见 locale/preset/），而不是通用的「Agent 预设定义」
+ * dsh-design-studio/preset：设计模式那一行。和 DSH 自带的 Agent 预设（@deepseek-ai/dsh-agent-preset）一模一样，
+ * 换个入口好让 DSH「插件」页里显示成设计模式（名字和说明见 locale/preset/），而不是通用的「Agent 预设定义」。
+ *
+ * 不直接 re-export 那个包：用 link: 装、插件文件夹在 DSH 目录外面时（本地开发），从这里找不到 @deepseek-ai/* 包，
+ * 这一行就起不来、模式列表里没有设计模式。官方实现只有十几行，照抄；两个键是 cordis 的全局符号（Symbol.for）。
  */
-export { default } from '@deepseek-ai/dsh-agent-preset'
+export default class DesignPreset {
+  static inject = ['agentPresets']
+  // 子插件的配置原样留着，等各自激活时再解析（官方的 EntryGroup.key）
+  static [Symbol.for('cordis.group')] = true
+
+  constructor(ctx, config) {
+    this.ctx = ctx
+    this.config = config
+  }
+
+  // 官方的 Service.init：注册上就算起来了，停用时 yield 出去的反注册会被调用
+  async * [Symbol.for('cordis.init')]() {
+    yield await this.ctx.agentPresets.register(this.config)
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-design-studio",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "type": "module",
   "scripts": {
     "test": "node --test --test-concurrency=1 test/*.mjs"