@1outres/dsh-plugin-mobile 0.0.0-stage → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +141 -2
- package/cordis.patch.yml +6 -0
- package/icon.svg +12 -0
- package/lib/client.js +1394 -0
- package/lib/index.js +34 -0
- package/locale/en.json +6 -0
- package/locale/ja.json +6 -0
- package/locale/zh.json +6 -0
- package/package.json +61 -3
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 1outres
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,3 +1,142 @@
|
|
|
1
|
-
#
|
|
1
|
+
# @1outres/dsh-plugin-mobile
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Makes the DeepSeek Harness Web UI usable on a phone. The shipped layout is
|
|
4
|
+
built for desktop windows: below 1024px the sidebar shrinks to a 56px rail and,
|
|
5
|
+
when opened, squeezes the conversation to a sliver; the on-screen keyboard
|
|
6
|
+
pushes the header off screen; Enter sends, so a second line cannot be typed.
|
|
7
|
+
This plugin keeps the desktop layout as it is and changes only the narrow one.
|
|
8
|
+
|
|
9
|
+
Install just this plugin:
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
dsh plugin add @1outres/dsh-plugin-mobile
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
Or install it with every plugin in the repository through the
|
|
16
|
+
[`@1outres/dsh-plugins`](../dsh-plugins) bundle. Enable one or the other: both
|
|
17
|
+
insert the same `mobile` row.
|
|
18
|
+
|
|
19
|
+
## On a phone
|
|
20
|
+
|
|
21
|
+
The phone layout applies while the viewport is narrower than `breakpoint`
|
|
22
|
+
(768px by default, the width below which the right panel already opens
|
|
23
|
+
fullscreen).
|
|
24
|
+
|
|
25
|
+
- **Sidebar drawer.** The rail disappears and the conversation takes the full
|
|
26
|
+
width. A menu button before the session title, or a swipe right from the
|
|
27
|
+
left edge, slides the sidebar in over the conversation with a dimmed scrim.
|
|
28
|
+
Tap the scrim, swipe left, or pick a session, a panel or New Session to close
|
|
29
|
+
it. Global panels such as Plugins have no conversation header, so they get a
|
|
30
|
+
floating menu button in the top-left corner instead.
|
|
31
|
+
- **On-screen keyboard.** The page shrinks to the area the keyboard leaves
|
|
32
|
+
visible, so the header stays at the top and the composer sits right above
|
|
33
|
+
the keyboard. The draft box grows to at most 30% of that area.
|
|
34
|
+
- **Enter adds a line.** On a touch screen Enter in the composer inserts a line
|
|
35
|
+
break and the send button sends. Enter that confirms an IME conversion, and
|
|
36
|
+
Enter in the slash-command or reference menu, keep working as before.
|
|
37
|
+
- **The keyboard opens only when you tap the input.** The Harness focuses the
|
|
38
|
+
composer whenever a session opens and when a composer button such as the
|
|
39
|
+
model picker or Send is pressed, which pops the keyboard over the
|
|
40
|
+
conversation. On a touch screen the composer takes focus only right after a
|
|
41
|
+
tap on the input (or on the empty part of the composer card, or the `+`
|
|
42
|
+
command button) or a hardware key press; other focuses are undone at once.
|
|
43
|
+
- **Notches and the home indicator.** The page asks for the full screen
|
|
44
|
+
(`viewport-fit=cover`) and pads by the safe-area insets; the composer clears
|
|
45
|
+
the home indicator while the keyboard is down.
|
|
46
|
+
- **Compact chrome.** Tighter header and composer padding, no width-drag
|
|
47
|
+
handles, and the Settings dialog becomes a full-screen sheet with its section
|
|
48
|
+
list scrolling sideways above the page.
|
|
49
|
+
- **No accidental reloads.** Pull-to-refresh and overscroll bounce are off, so
|
|
50
|
+
scrolling up through a long conversation does not reload the page.
|
|
51
|
+
|
|
52
|
+
On any touch screen (also a tablet wider than the breakpoint):
|
|
53
|
+
|
|
54
|
+
- Text fields use at least 16px type, so iOS does not zoom in when one gets
|
|
55
|
+
focus.
|
|
56
|
+
- Tooltips, which stick after a tap, are hidden.
|
|
57
|
+
- One tap opens a session. iOS treats a tap that reveals content on `:hover`
|
|
58
|
+
as a hover and drops the click, and the sidebar rows reveal their buttons on
|
|
59
|
+
hover, so a row needed two taps. Rows no longer change on hover: the selected
|
|
60
|
+
session and every workspace keep their "..." menu and buttons visible, with
|
|
61
|
+
28px tap targets, and other sessions keep their time.
|
|
62
|
+
- No tap highlight flash and no double-tap zoom delay on buttons.
|
|
63
|
+
|
|
64
|
+
The plugin also adds the home-screen tags (`apple-mobile-web-app-capable`,
|
|
65
|
+
`mobile-web-app-capable`, `apple-mobile-web-app-title`), so **Add to Home
|
|
66
|
+
Screen** opens the Harness without the browser bar.
|
|
67
|
+
|
|
68
|
+
### With the other plugins in this repository
|
|
69
|
+
|
|
70
|
+
- [`@1outres/dsh-plugin-background`](../dsh-plugin-background) keeps the
|
|
71
|
+
drawer and the fullscreen right panel opaque, so the conversation does not
|
|
72
|
+
show through them.
|
|
73
|
+
- [`@1outres/dsh-plugin-model-picker`](../dsh-plugin-model-picker) does not
|
|
74
|
+
focus its search field on a touch screen, fits above the keyboard, and stays
|
|
75
|
+
open when the keyboard is dismissed, so the Effort row stays reachable.
|
|
76
|
+
|
|
77
|
+
## Settings
|
|
78
|
+
|
|
79
|
+
Edit them in **Settings → Mobile**, or in the profile patch under the
|
|
80
|
+
`mobile` row. Every change applies immediately in every open page. The page
|
|
81
|
+
also says whether the page you are looking at uses the phone layout, and at
|
|
82
|
+
which width, to help pick the breakpoint.
|
|
83
|
+
|
|
84
|
+
| Field | Default | Meaning |
|
|
85
|
+
| -------------------- | --------- | ------------------------------------------------------------------------------------------------- |
|
|
86
|
+
| `mode` | `auto` | `auto` uses the phone layout below `breakpoint`, `always` everywhere, `off` never. |
|
|
87
|
+
| `breakpoint` | `768` | Viewport width in CSS pixels, from 360 to 1024. |
|
|
88
|
+
| `enterKey` | `newline` | Enter in the composer on a touch screen: `newline` adds a line, `send` keeps the Harness default. |
|
|
89
|
+
| `swipe` | `true` | Edge swipe opens the drawer, swipe left closes it. |
|
|
90
|
+
| `fitKeyboard` | `true` | Fit the page to the area the on-screen keyboard leaves visible. |
|
|
91
|
+
| `blockPullToRefresh` | `true` | Stop pull-to-refresh and overscroll bounce. |
|
|
92
|
+
| `autoFocusComposer` | `false` | Let the composer focus itself (and open the keyboard) on a touch screen, as on desktop. |
|
|
93
|
+
|
|
94
|
+
`mode: off` removes every change, the touch ones included.
|
|
95
|
+
|
|
96
|
+
## How it works
|
|
97
|
+
|
|
98
|
+
1. The browser half watches `matchMedia` and sets `data-dsh-mobile` and
|
|
99
|
+
`data-dsh-touch` on `<html>`. One stylesheet, scoped under those
|
|
100
|
+
attributes, does the layout work.
|
|
101
|
+
2. The drawer is the shipped sidebar column. The stylesheet takes it out of the
|
|
102
|
+
AppFrame grid and slides it with a transform; `ctx.layout.toggleSidebar()`
|
|
103
|
+
opens and closes it, and the frame's `data-sidebar-collapsed` attribute says
|
|
104
|
+
which state it is in. The menu button occupies the empty
|
|
105
|
+
`conversation.header.leading` slot; the scrim and the floating button live
|
|
106
|
+
in `shell.overlay`.
|
|
107
|
+
3. The keyboard fit reads `window.visualViewport` and publishes its height as
|
|
108
|
+
`--dsh-mobile-vvh`; the page height follows it. iOS scrolls the whole
|
|
109
|
+
document to reveal a focused field, so that scroll is undone while the
|
|
110
|
+
keyboard is up.
|
|
111
|
+
4. Enter: a capturing `keydown` listener hides a plain Enter in the composer
|
|
112
|
+
from the composer's own handlers. The key's default action still runs, and
|
|
113
|
+
the editor turns the browser's paragraph break into a line break.
|
|
114
|
+
5. Focus: capturing `pointerdown` and `keydown` listeners remember what the
|
|
115
|
+
user last did; a `focusin` on the composer that no recent tap on it or key
|
|
116
|
+
press explains is blurred in the same event.
|
|
117
|
+
6. The Host half only declares the settings and turns off the
|
|
118
|
+
schema-generated form, since the plugin ships its own Settings page.
|
|
119
|
+
|
|
120
|
+
## Limits
|
|
121
|
+
|
|
122
|
+
- **It restyles shipped UI from the outside.** Host elements are found through
|
|
123
|
+
slot anchors (`data-slot`), data attributes (`data-rightbar-col`,
|
|
124
|
+
`data-sidebar-collapsed`, `data-composer-*`, `data-conversation-*`,
|
|
125
|
+
`data-shortcut-modal`) and ARIA roles. Two touch rules match Session row
|
|
126
|
+
parts by CSS-module class name. A Harness update within
|
|
127
|
+
`>=0.2.1-rc.5 <0.3.0` can rename any of them; the matching rule then stops
|
|
128
|
+
applying, and the page falls back to the shipped layout for that part.
|
|
129
|
+
- Enter relies on the composer being a plain-text editor that turns the
|
|
130
|
+
browser's paragraph insertion into a line break.
|
|
131
|
+
- The drawer closes after a session or panel is picked, not after other
|
|
132
|
+
actions in it (Settings opens over it).
|
|
133
|
+
- Between the breakpoint and about 756px a normal right panel overlaps the
|
|
134
|
+
conversation instead of squeezing it; below 768px the Harness already opens
|
|
135
|
+
it fullscreen.
|
|
136
|
+
- iOS shows a screenshot instead of an icon on the home screen: it does not
|
|
137
|
+
use SVG touch icons, and the Harness ships no PNG.
|
|
138
|
+
- An edge swipe in Safari can also trigger the browser's own back gesture; the
|
|
139
|
+
home-screen app has none.
|
|
140
|
+
- Buttons and the Settings page are in English, Chinese and Japanese (the
|
|
141
|
+
Japanese copy shows only with a Japanese language pack); the field
|
|
142
|
+
descriptions in the profile schema are English.
|
package/cordis.patch.yml
ADDED
package/icon.svg
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64" fill="none" role="img" aria-labelledby="title">
|
|
2
|
+
<title id="title">Mobile</title>
|
|
3
|
+
<rect x="2" y="2" width="60" height="60" rx="14" fill="#3D7FC2"/>
|
|
4
|
+
<rect x="19" y="8" width="26" height="48" rx="6" fill="#FFFFFF" fill-opacity="0.95"/>
|
|
5
|
+
<rect x="27.5" y="11.5" width="9" height="2.4" rx="1.2" fill="#A9C9EA"/>
|
|
6
|
+
<rect x="19" y="8" width="9" height="48" rx="6" fill="#DCE9F6"/>
|
|
7
|
+
<rect x="24" y="8" width="4" height="48" fill="#DCE9F6"/>
|
|
8
|
+
<path d="M21.5 20H25.5M21.5 25H25.5M21.5 30H25.5" stroke="#7FAAD6" stroke-width="2" stroke-linecap="round"/>
|
|
9
|
+
<path d="M31.5 21H39.5C40.880 21 42 22.120 42 23.500V27.500C42 28.880 40.880 30 39.500 30H35L32 32.500V30H31.500C30.120 30 29 28.880 29 27.500V23.500C29 22.120 30.120 21 31.500 21Z" fill="#3D7FC2"/>
|
|
10
|
+
<rect x="29.5" y="45.5" width="12.5" height="6" rx="3" fill="#DCE9F6"/>
|
|
11
|
+
<circle cx="39" cy="48.5" r="1.8" fill="#3D7FC2"/>
|
|
12
|
+
</svg>
|