@telepath-computer/television 0.1.7 → 0.1.8

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/package.json CHANGED
@@ -1,13 +1,14 @@
1
1
  {
2
2
  "name": "@telepath-computer/television",
3
- "version": "0.1.7",
3
+ "version": "0.1.8",
4
4
  "type": "module",
5
5
  "main": "dist/electron.cjs",
6
6
  "bin": {
7
7
  "tv": "dist/cli.cjs"
8
8
  },
9
9
  "files": [
10
- "dist/**"
10
+ "dist/**",
11
+ "skill/**"
11
12
  ],
12
13
  "scripts": {
13
14
  "dev": "npm run dev:server",
package/skill/SKILL.md ADDED
@@ -0,0 +1,177 @@
1
+ # Television
2
+
3
+ Television is a virtual display for showing persistent artifacts to a user. Use Television whenever you want to visualize something for the user instead of only describing it in text.
4
+
5
+ ## Check whether it is running
6
+
7
+ ```bash
8
+ tv status
9
+ ```
10
+
11
+ This reports whether the server is healthy and whether it's installed as a system service. If the server is not reachable, start it:
12
+
13
+ ```bash
14
+ tv serve
15
+ ```
16
+
17
+ If you need it to keep running while you do other work, start `tv serve` in a background terminal, or install it as a service with `tv serve --persist`.
18
+
19
+ ## Artifact types
20
+
21
+ All artifacts have:
22
+
23
+ - `type`: the type string (`markdown` or `html`; defaults to `markdown`)
24
+ - `title`: user-visible title shown in the workspace
25
+
26
+ ### Markdown (default)
27
+
28
+ Use this for documents, reports, plans, status updates, or any content that benefits from readable prose formatting.
29
+
30
+ Properties:
31
+
32
+ - `type`: `markdown`
33
+ - `content`: a markdown string, rendered as HTML
34
+
35
+ ### HTML
36
+
37
+ Use this for structured layouts, dashboards, data displays, or anything that needs precise visual control.
38
+
39
+ Properties:
40
+
41
+ - `type`: `html`
42
+ - `content`: an HTML fragment — element content only, no `<!doctype>`, `<html>`, `<head>`, or `<body>` tags
43
+
44
+ ```html
45
+ <!-- Bad — rejected -->
46
+ <!doctype html><html><body><p>Hello</p></body></html>
47
+
48
+ <!-- Good -->
49
+ <p>Hello</p>
50
+ ```
51
+
52
+ ## Commands
53
+
54
+ All commands output JSON. If you need to target a non-default server, add `--server "http://host:port"` to any command except `serve` and `stop`.
55
+
56
+ When only one workspace exists, `--workspace` / `--id` can be omitted and it will be selected automatically.
57
+
58
+ ### Start the server
59
+
60
+ ```bash
61
+ tv serve
62
+ tv serve --persist # install as a background system service
63
+ tv serve --port 3000 # custom port
64
+ tv serve --public # no auth (open access)
65
+ ```
66
+
67
+ ### Stop the system service
68
+
69
+ ```bash
70
+ tv stop
71
+ ```
72
+
73
+ ### Check server status
74
+
75
+ ```bash
76
+ tv status
77
+ ```
78
+
79
+ ### List workspaces
80
+
81
+ ```bash
82
+ tv list-workspaces
83
+ ```
84
+
85
+ ### Get a workspace and its artifacts
86
+
87
+ ```bash
88
+ tv get-workspace
89
+ tv get-workspace --id "workspace-id"
90
+ ```
91
+
92
+ ### Create an artifact
93
+
94
+ ```bash
95
+ tv create-artifact --title "Plan" --content "# Heading"
96
+ tv create-artifact --title "Dashboard" --type html --content '<p>Hello</p>'
97
+ tv create-artifact --title "Plan" --content "# Heading" --workspace "workspace-id"
98
+ ```
99
+
100
+ ### Update an artifact
101
+
102
+ ```bash
103
+ tv update-artifact --id "artifact-id" --content "Updated content"
104
+ tv update-artifact --id "artifact-id" --title "New title" --content "New content"
105
+ ```
106
+
107
+ ### Remove an artifact
108
+
109
+ ```bash
110
+ tv remove-artifact --id "artifact-id"
111
+ ```
112
+
113
+ ## HTML artifact styling
114
+
115
+ HTML artifacts are rendered with a full base stylesheet. Only add custom CSS when you need something not covered here — prefer the built-in styles and variables to keep artifacts visually coherent with the rest of the system.
116
+
117
+ ### Elements
118
+
119
+ All standard elements get sensible defaults — you don't need to style from scratch:
120
+
121
+ - Headings (`h1`–`h6`) — sized and weighted
122
+ - `p`, `ul`, `ol` — readable defaults
123
+ - `code` and `pre` — monospace, muted background
124
+ - `blockquote` — left border, muted text
125
+ - `table`, `th`, `td` — bordered, striped headers
126
+ - `button` — styled with border and hover state; use `size="sm"` or `size="md"` attribute
127
+ - `hr` — subtle border
128
+ - `a` — inherits color by default
129
+
130
+ ### `.prose` class
131
+
132
+ Adds document-style vertical spacing between block elements. Wrap long-form content in `<div class="prose">` for comfortable reading.
133
+
134
+ ```html
135
+ <div class="prose">
136
+ <h1>Title</h1>
137
+ <p>Some content with proper spacing between elements.</p>
138
+ <ul>
139
+ <li>Item one</li>
140
+ <li>Item two</li>
141
+ </ul>
142
+ </div>
143
+ ```
144
+
145
+ ### CSS variables
146
+
147
+ Use these to stay consistent with the app theme.
148
+
149
+ Colors:
150
+ - `--color-bg` — page background
151
+ - `--color-bg-muted` — subtle background (used on code, table headers)
152
+ - `--color-surface` — card/panel background
153
+ - `--color-text` — primary text
154
+ - `--color-text-muted` — secondary/label text
155
+ - `--color-border` — border color
156
+
157
+ Spacing:
158
+ - `--space-4`
159
+ - `--space-8`
160
+ - `--space-12`
161
+ - `--space-16`
162
+ - `--space-24`
163
+ - `--space-32`
164
+
165
+ Font:
166
+ - `--font-sans`
167
+ - `--font-mono`
168
+
169
+ Text sizes:
170
+ - `--text-sm`
171
+ - `--text-base`
172
+ - `--text-lg`
173
+ - `--text-xl`
174
+
175
+ Radius:
176
+ - `--radius-sm`
177
+ - `--radius-md`
@@ -1 +0,0 @@
1
- artifact-view{background:var(--color-bg-muted);border:1px solid var(--color-border);border-radius:10px;box-sizing:border-box;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden}.artifact-title-bar{display:flex;align-items:center;height:34px;padding:0 12px;flex-shrink:0;border-bottom:1px solid var(--color-border);-webkit-user-select:none;user-select:none}.artifact-title{flex:1;font-size:13px;font-weight:500;color:var(--color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.artifact-close-btn{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--color-text-muted);cursor:pointer;flex-shrink:0}.artifact-close-btn:hover{background:var(--color-interactive);color:var(--color-text)}.artifact-content{flex:1;min-height:0;overflow:hidden;padding:0}.artifact-html-frame{pointer-events:none}layout-stream{width:100%;flex:1;min-width:0;min-height:0;display:flex;align-items:center;overflow:hidden;outline:none;position:relative;--layout-col-width: 300px;--layout-row-height: 133.33px;--layout-gap: 16px}layout-stream .track{display:flex;align-items:start;gap:var(--layout-gap);flex-shrink:0;width:max-content;will-change:transform;transition:transform .2s ease}layout-stream .band{display:grid;grid-template-rows:repeat(6,var(--layout-row-height));gap:var(--layout-gap);align-self:start}layout-stream .band[layout-band-cols="1"]{grid-template-columns:var(--layout-col-width);width:var(--layout-col-width)}layout-stream .band[layout-band-cols="2"]{grid-template-columns:repeat(2,var(--layout-col-width));width:calc(var(--layout-col-width) * 2 + var(--layout-gap))}layout-stream .card-slot{border-radius:12px;box-sizing:border-box;cursor:pointer;min-width:0;min-height:0}layout-stream .card-slot.placeholder{background:#94a3b829;border:2px dashed rgba(148,163,184,.7);box-shadow:inset 0 0 0 1px #0f172a0d}layout-stream .card-slot.dragging{position:fixed;z-index:100;opacity:.7;transform:rotate(2deg);pointer-events:none;cursor:grabbing}layout-stream .card-slot artifact-view{width:100%;height:100%}layout-stream .card-slot[layout-cols="1"][layout-rows="2"] artifact-view{position:relative}layout-stream .card-slot[layout-cols="1"][layout-rows="2"] .artifact-title-bar{position:absolute;top:0;left:0;right:0;z-index:2;border-radius:10px 10px 0 0;background:var(--color-bg-muted);opacity:0;pointer-events:none;transition:opacity .12s ease}layout-stream .card-slot[layout-cols="1"][layout-rows="2"]:hover .artifact-title-bar,layout-stream .card-slot[layout-cols="1"][layout-rows="2"]:focus-within .artifact-title-bar{opacity:1;pointer-events:auto}workspace-view{width:100%;flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}workspace-view [data-testid=empty-workspace]{margin:0;padding:1rem}television-app{width:100%;height:100%;display:grid;grid-template-rows:auto 1fr;grid-template-areas:"header" "main"}television-app>header{grid-area:header;position:relative;z-index:10}television-app>main{grid-area:main;grid-row:1 / -1}body.electron television-app>header{-webkit-app-region:drag;padding-left:80px;border-bottom:1px solid var(--color-border)}header{display:flex;align-items:center;justify-content:space-between;height:34px;padding:0 12px;flex-shrink:0;-webkit-user-select:none;user-select:none}television-app>header>nav{display:flex;align-items:center;gap:8px;min-width:0}workspace-picker,workspace-picker [trigger],button[variant=toolbar],.settings-server-remove-button,.settings-submit-button,.settings-cancel-button,.settings-connect-button,.settings-field input{-webkit-app-region:no-drag}workspace-picker dropdown-menu::part(panel){min-width:18rem}workspace-picker [trigger],workspace-picker [trigger][data-dropdown-trigger]{min-width:0;padding:0;border:none;background:transparent;font-size:13px;font-weight:600}workspace-picker [trigger] .trigger-label{white-space:nowrap}dropdown-group{display:block;padding:4px 0}dropdown-label{display:block;padding:0 10px 4px;font-size:12px;color:color-mix(in srgb,currentColor 60%,transparent)}dropdown-item{display:block;padding:6px 10px;border-radius:4px;cursor:pointer}dropdown-item[selected]{background:color-mix(in srgb,var(--color-border) 70%,white)}dropdown-item[action]{color:color-mix(in srgb,currentColor 50%,transparent)}dropdown-item[danger]{color:#c74343}television-app>main{min-width:0;min-height:0;overflow:hidden;display:flex;flex-direction:column}television-app>main.auth-gate{display:flex;align-items:center;justify-content:center}.settings-panel{width:min(32rem,100%);display:flex;flex-direction:column;padding:20px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-bg)}.workspace-modal,.auth-modal{width:min(24rem,100%);display:flex;flex-direction:column;padding:20px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-bg)}.auth-form{display:flex;flex-direction:column;gap:12px}.auth-modal-title,.auth-modal-copy{margin:0}.auth-token-input-invalid{border-color:#c74343}.workspace-form{display:flex;flex-direction:column;gap:12px}.workspace-form-actions{display:flex;gap:8px}.workspace-modal-title,.workspace-delete-copy,.workspace-delete-warning,.workspace-delete-error{margin:0}.workspace-delete-warning,.workspace-delete-error{font-size:13px}.workspace-delete-error{color:#c74343}.settings-section-title{margin:0}.settings-section,.settings-server-list,.settings-add-server-form{display:flex;flex-direction:column;gap:12px}.settings-form-actions{display:flex;gap:8px}.settings-card{padding:12px;border:1px solid var(--color-border);border-radius:8px}.settings-server{display:flex;align-items:center;justify-content:space-between;gap:12px}.settings-server-details{min-width:0}.settings-server-name{font-weight:600}.settings-server-url{font-size:13px;word-break:break-word;color:color-mix(in srgb,currentColor 70%,transparent)}.settings-server-remove-button,.settings-submit-button,.settings-cancel-button,.settings-connect-button{padding:8px 12px;border-radius:8px}.settings-field{display:flex;flex-direction:column;gap:6px}.settings-field input{width:100%;padding:8px 10px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg);color:inherit;font:inherit;box-sizing:border-box}.settings-submit-button,.settings-cancel-button,.settings-connect-button{align-self:flex-start}:root{--black: #000000;--white: #ffffff;--neutral-50: oklch(.985 .001 106.423);--neutral-100: oklch(.97 .001 106.424);--neutral-200: oklch(.923 .003 48.717);--neutral-300: oklch(.869 .005 56.366);--neutral-400: oklch(.709 .01 56.259);--neutral-500: oklch(.553 .013 58.071);--neutral-600: oklch(.444 .011 73.639);--neutral-700: oklch(.374 .01 67.558);--neutral-800: oklch(.268 .007 34.298);--neutral-900: oklch(.216 .006 56.043);--neutral-950: oklch(.147 .004 49.25)}dropdown-menu{position:relative;display:inline-block;color:inherit}dropdown-group{display:grid;gap:var(--space-4)}dropdown-label{display:block;padding:var(--space-4) var(--space-8);color:var(--color-text-muted);font:inherit;font-size:var(--text-sm);font-weight:600;letter-spacing:.04em;text-transform:uppercase}dropdown-divider{display:block;height:1px;margin:var(--space-4) 0;background:var(--color-border)}[data-dropdown-trigger],dropdown-item{color:inherit;font:inherit;line-height:1.2}[data-dropdown-trigger],dropdown-menu::part(trigger){display:inline-flex;align-items:center;gap:var(--space-8);margin:0;padding:.375rem .5rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);box-shadow:none;cursor:pointer}[data-dropdown-trigger]:hover,dropdown-menu::part(trigger):hover{background:var(--color-interactive-hover)}dropdown-menu[open] [data-dropdown-trigger],dropdown-menu[open]::part(trigger){background:var(--color-interactive)}[data-dropdown-trigger-label],dropdown-menu::part(trigger-label){min-width:0}[data-dropdown-trigger-icon],dropdown-menu::part(trigger-icon){display:inline-flex;align-items:center;justify-content:center;flex:none}[data-dropdown-trigger]:focus-visible,dropdown-menu::part(trigger):focus-visible,dropdown-item:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}dropdown-menu::part(panel){position:absolute;top:calc(100% + var(--space-4));left:0;z-index:var(--layer-popover);min-width:12rem;padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-popover)}dropdown-item{display:block;margin:0;padding:.375rem .5rem;border-radius:var(--radius-sm);cursor:pointer;-webkit-user-select:none;user-select:none}dropdown-item:hover{background:var(--color-interactive-hover)}dropdown-item[selected]{background:var(--color-interactive)}panel-view{display:block}panel-view::part(panel){display:flex;flex-direction:column;gap:var(--space-16);color:var(--color-text)}panel-view::part(header){display:flex;align-items:center;justify-content:space-between;gap:var(--space-12)}panel-view::part(title-group){display:flex;align-items:center;gap:var(--space-8);min-width:0}panel-view::part(title){margin:0;font:inherit;font-size:var(--text-lg);font-weight:600;color:var(--color-text)}panel-view::part(button){display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;margin:0;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);box-shadow:none;cursor:pointer}panel-view::part(button):hover{background:var(--color-interactive-hover)}panel-view::part(button):focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}panel-view::part(icon){display:inline-flex;align-items:center;justify-content:center;flex:none}panel-view::part(back-icon){transform:rotate(90deg)}modal-overlay{color:inherit}modal-overlay::part(backdrop){position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--layer-modal);display:flex;align-items:center;justify-content:center;padding:var(--space-16);background:var(--color-overlay-backdrop)}*,*:before,*:after{box-sizing:border-box}:root{--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;--font-brand: var(--font-sans);--font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, monospace;--text-sm: 12px;--text-base: 14px;--text-lg: 16px;--leading-base: 1.5;--space-2: 2px;--space-4: 4px;--space-6: 6px;--space-8: 8px;--space-12: 12px;--space-16: 16px;--radius-sm: .375rem;--radius-md: .5rem;--layer-popover: 10;--layer-modal: 1000;--shadow-popover: 0 12px 32px rgb(0 0 0 / .14);--shadow-modal: 0 24px 64px rgb(0 0 0 / .2);--color-bg: var(--neutral-50);--color-bg-muted: var(--neutral-100);--color-surface: var(--white);--color-surface-muted: var(--neutral-100);--color-interactive: var(--neutral-200);--color-interactive-hover: var(--neutral-300);--color-border: var(--neutral-300);--color-border-muted: var(--neutral-200);--color-text: var(--neutral-900);--color-text-muted: var(--neutral-500);--color-link: inherit;--color-focus-ring: var(--neutral-500);--color-overlay-backdrop: rgb(0 0 0 / .5)}html,body{margin:0;padding:0;width:100%;height:100%}html{color-scheme:light}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-base);color:var(--color-text);background:var(--color-bg)}a{text-underline-offset:.15em;text-decoration-thickness:.08em}button,input,textarea,select{font:inherit;color:inherit}a{color:var(--color-link)}code,pre{font-family:var(--font-mono)}h1,h2,h3,h4,h5,h6{color:var(--color-text)}[data-ui-icon]{display:inline-block;vertical-align:middle}button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-6);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);color:inherit;cursor:pointer}button:hover{background:var(--color-interactive)}button[variant=toolbar]{border:none;background:transparent;color:var(--color-text-muted)}button[size=sm]{min-height:26px;padding:var(--space-2) var(--space-6)}button[size=md]{min-height:32px;padding:var(--space-6) var(--space-12)}:root{--color-bg: var(--neutral-200);--color-border: var(--neutral-300)}