pi-tokyo-night 1.0.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.
Files changed (4) hide show
  1. package/README.md +67 -0
  2. package/extensions/tokyo-night-header.ts +78 -0
  3. package/package.json +30 -0
  4. package/themes/tokyo-night.json +78 -0
package/README.md ADDED
@@ -0,0 +1,67 @@
1
+ # pi-tokyo-night
2
+
3
+ <p align="center">
4
+ <img src="https://img.shields.io/npm/v/pi-tokyo-night?style=flat-square" alt="npm version">
5
+ <img src="https://img.shields.io/npm/dw/pi-tokyo-night?style=flat-square" alt="downloads">
6
+ <img src="https://img.shields.io/badge/license-MIT-blue?style=flat-square" alt="license">
7
+ <img src="https://img.shields.io/badge/pi--package-%2300aaff?style=flat-square" alt="pi package">
8
+ </p>
9
+
10
+ Tokyo Night theme and custom header for the [Pi coding agent](https://github.com/earendil-works/pi).
11
+
12
+ This package brings the iconic **Tokyo Night** color palette โ€” popularized by [enkia/tokyo-night-vscode-theme](https://github.com/enkia/tokyo-night-vscode-theme) โ€” to Pi's terminal UI, along with a matching custom ASCII art header.
13
+
14
+ ## Install
15
+
16
+ ```bash
17
+ pi install npm:pi-tokyo-night
18
+ ```
19
+
20
+ Or from GitHub:
21
+
22
+ ```bash
23
+ pi install git:github.com/MitoroMisaka/pi-tokyo-night
24
+ ```
25
+
26
+ ## What's included
27
+
28
+ ### ๐ŸŽจ Tokyo Night Theme
29
+
30
+ All 51 color tokens carefully tuned:
31
+
32
+ | Category | Colors |
33
+ |----------|--------|
34
+ | Background | `#1a1b26` deep navy blue |
35
+ | Foreground | `#c0caf5` soft white-blue |
36
+ | Accent | `#7aa2f7` Tokyo blue |
37
+ | Syntax | Purple keywords, blue functions, cyan types, green strings, orange variables |
38
+ | Diffs | Green additions, red deletions, muted context |
39
+ | Thinking | Gradient from blue (minimal) โ†’ red (xhigh) |
40
+
41
+ ### ๐Ÿ–ฅ๏ธ Custom Header
42
+
43
+ Replaces the default header with a Tokyo Night themed ASCII art display showing the Pi logo and useful keybinding hints.
44
+
45
+ **Restore default header:** `/default-header`
46
+
47
+ ## Usage
48
+
49
+ After installing, the theme is applied automatically. If it doesn't switch:
50
+
51
+ 1. Open Pi settings: `/settings` โ†’ select `tokyo-night`
52
+ 2. Or manually set in `~/.pi/agent/settings.json`:
53
+
54
+ ```json
55
+ {
56
+ "theme": "tokyo-night"
57
+ }
58
+ ```
59
+
60
+ ## Credits
61
+
62
+ - Color palette inspired by [Tokyo Night VS Code Theme](https://github.com/enkia/tokyo-night-vscode-theme)
63
+ - Pi coding agent by [@badlogicgames](https://github.com/earendil-works)
64
+
65
+ ## License
66
+
67
+ MIT
package/extensions/tokyo-night-header.ts ADDED
@@ -0,0 +1,78 @@
1
+ /**
2
+ * Tokyo Night Header Extension
3
+ *
4
+ * Replaces the default pi header with a Tokyo Night themed ASCII art display
5
+ * showing session info and keybindings.
6
+ */
7
+
8
+ import type { ExtensionAPI, Theme } from "@earendil-works/pi-coding-agent";
9
+
10
+ function renderTokyoNightHeader(width: number, theme: Theme): string[] {
11
+ const bg = theme.fg("dim", "");
12
+ const accent = theme.fg("accent", "");
13
+ const muted = theme.fg("muted", "");
14
+ const cyan = theme.fg("borderAccent", "");
15
+ const purple = theme.fg("mdHeading", "");
16
+ const green = theme.fg("success", "");
17
+
18
+ // Tokyo Night inspired ASCII art for "PI"
19
+ const logo = [
20
+ `${accent} โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ•—${bg} โ–ˆโ–ˆ${accent}โ•—${bg}`,
21
+ `${accent} โ–ˆโ–ˆ${bg}โ•”โ•โ•${accent}โ–ˆโ–ˆ${bg}โ•—${accent}โ–ˆโ–ˆ${bg}โ•‘${bg}`,
22
+ `${accent} โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆ${bg}โ•”โ•${accent}โ–ˆโ–ˆ${bg}โ•‘${bg}`,
23
+ `${accent} โ–ˆโ–ˆ${bg}โ•”โ•โ•โ•โ• ${accent}โ–ˆโ–ˆ${bg}โ•‘${bg}`,
24
+ `${accent} โ–ˆโ–ˆ${bg}โ•‘ ${accent}โ–ˆโ–ˆ${bg}โ•‘${bg}`,
25
+ `${accent} ${bg}โ•šโ•โ• โ•šโ•โ•`,
26
+ ];
27
+
28
+ // Right side: decorative elements
29
+ const decorations = [
30
+ `${purple}โ•ญโ”€${muted} ${cyan}Tokyo Night${muted} โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ•ฎ`,
31
+ `${purple}โ”‚${muted} ๐ŸŒ™ ${green}Code in the dark ${purple}โ”‚`,
32
+ `${purple}โ•ฐโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ•ฏ`,
33
+ ];
34
+
35
+ // Combine logo left + decorations right when width is enough
36
+ const lines: string[] = [];
37
+
38
+ if (width >= 60) {
39
+ for (let i = 0; i < Math.max(logo.length, decorations.length); i++) {
40
+ const left = logo[i] || "";
41
+ const right = i < decorations.length ? decorations[i] : "";
42
+ const spacer = " ".repeat(Math.max(1, width - 50));
43
+ lines.push(`${left}${spacer}${right}`);
44
+ }
45
+ } else {
46
+ lines.push(...logo);
47
+ }
48
+
49
+ lines.push("");
50
+ lines.push(
51
+ `${muted} @file ยท ${muted}Tab complete ยท ${muted}!bash ยท ${muted}/commands${muted}${bg}`,
52
+ );
53
+ lines.push("");
54
+
55
+ return lines;
56
+ }
57
+
58
+ export default function (pi: ExtensionAPI) {
59
+ pi.on("session_start", async (_event, ctx) => {
60
+ if (ctx.hasUI) {
61
+ ctx.ui.setHeader((_tui, theme) => ({
62
+ render(width: number): string[] {
63
+ return renderTokyoNightHeader(width, theme);
64
+ },
65
+ invalidate() {},
66
+ }));
67
+ }
68
+ });
69
+
70
+ // Command to restore built-in header
71
+ pi.registerCommand("default-header", {
72
+ description: "Restore the default pi header",
73
+ handler: async (_args, ctx) => {
74
+ ctx.ui.setHeader(undefined);
75
+ ctx.ui.notify("Default header restored", "info");
76
+ },
77
+ });
78
+ }
package/package.json ADDED
@@ -0,0 +1,30 @@
1
+ {
2
+ "name": "pi-tokyo-night",
3
+ "version": "1.0.0",
4
+ "description": "Tokyo Night theme and header extension for the Pi coding agent",
5
+ "license": "MIT",
6
+ "keywords": [
7
+ "pi-package",
8
+ "pi-theme",
9
+ "tokyo-night",
10
+ "pi-coding-agent",
11
+ "dark-theme"
12
+ ],
13
+ "pi": {
14
+ "themes": ["./themes/tokyo-night.json"],
15
+ "extensions": ["./extensions/tokyo-night-header.ts"],
16
+ "image": "https://raw.githubusercontent.com/MitoroMisaka/pi-tokyo-night/main/screenshot.png"
17
+ },
18
+ "peerDependencies": {
19
+ "@earendil-works/pi-coding-agent": "*"
20
+ },
21
+ "repository": {
22
+ "type": "git",
23
+ "url": "git+https://github.com/MitoroMisaka/pi-tokyo-night.git"
24
+ },
25
+ "author": "MitoroMisaka",
26
+ "bugs": {
27
+ "url": "https://github.com/MitoroMisaka/pi-tokyo-night/issues"
28
+ },
29
+ "homepage": "https://github.com/MitoroMisaka/pi-tokyo-night#readme"
30
+ }
package/themes/tokyo-night.json ADDED
@@ -0,0 +1,78 @@
1
+ {
2
+ "$schema": "https://raw.githubusercontent.com/earendil-works/pi/main/packages/coding-agent/src/modes/interactive/theme/theme-schema.json",
3
+ "name": "tokyo-night",
4
+ "vars": {
5
+ "bg": "#1a1b26",
6
+ "fg": "#c0caf5",
7
+ "comment": "#565f89",
8
+ "red": "#f7768e",
9
+ "orange": "#ff9e64",
10
+ "yellow": "#e0af68",
11
+ "green": "#9ece6a",
12
+ "cyan": "#7dcfff",
13
+ "blue": "#7aa2f7",
14
+ "purple": "#9d7cd8",
15
+ "magenta": "#ad8ee6",
16
+ "bgHighlight": "#24283b",
17
+ "bgDark": "#16161e",
18
+ "borderColor": "#3b4261"
19
+ },
20
+ "colors": {
21
+ "accent": "blue",
22
+ "border": "borderColor",
23
+ "borderAccent": "cyan",
24
+ "borderMuted": "comment",
25
+ "success": "green",
26
+ "error": "red",
27
+ "warning": "yellow",
28
+ "muted": "comment",
29
+ "dim": "#414868",
30
+ "text": "fg",
31
+ "thinkingText": "purple",
32
+ "selectedBg": "bgHighlight",
33
+ "userMessageBg": "bgHighlight",
34
+ "userMessageText": "fg",
35
+ "customMessageBg": "bgHighlight",
36
+ "customMessageText": "fg",
37
+ "customMessageLabel": "blue",
38
+ "toolPendingBg": "#1d1e2e",
39
+ "toolSuccessBg": "#1e2a1e",
40
+ "toolErrorBg": "#2a1e1e",
41
+ "toolTitle": "cyan",
42
+ "toolOutput": "fg",
43
+ "mdHeading": "purple",
44
+ "mdLink": "blue",
45
+ "mdLinkUrl": "comment",
46
+ "mdCode": "cyan",
47
+ "mdCodeBlock": "fg",
48
+ "mdCodeBlockBorder": "borderColor",
49
+ "mdQuote": "comment",
50
+ "mdQuoteBorder": "purple",
51
+ "mdHr": "borderColor",
52
+ "mdListBullet": "cyan",
53
+ "toolDiffAdded": "green",
54
+ "toolDiffRemoved": "red",
55
+ "toolDiffContext": "comment",
56
+ "syntaxComment": "comment",
57
+ "syntaxKeyword": "purple",
58
+ "syntaxFunction": "blue",
59
+ "syntaxVariable": "orange",
60
+ "syntaxString": "green",
61
+ "syntaxNumber": "orange",
62
+ "syntaxType": "cyan",
63
+ "syntaxOperator": "magenta",
64
+ "syntaxPunctuation": "comment",
65
+ "thinkingOff": "comment",
66
+ "thinkingMinimal": "blue",
67
+ "thinkingLow": "cyan",
68
+ "thinkingMedium": "green",
69
+ "thinkingHigh": "purple",
70
+ "thinkingXhigh": "red",
71
+ "bashMode": "orange"
72
+ },
73
+ "export": {
74
+ "pageBg": "#1a1b26",
75
+ "cardBg": "#24283b",
76
+ "infoBg": "#292e42"
77
+ }
78
+ }