@silvery/examples 0.17.3 → 0.17.5

package/dist/backends-U3QwStfO.mjs

@@ -0,0 +1,3 @@
+import { s as init_backends, t as backend } from "./backends-Dj-11kZF.mjs";
+init_backends();
+export { backend };

package/dist/{cli.mjs → bin/cli.mjs}

@@ -46,18 +46,21 @@ const CATEGORY_COLOR = {
 	"Kitty Protocol": BLUE
 };
 async function discoverExamples() {
-	const { resolve, dirname } = await import("node:path");
+	const { resolve, dirname, extname } = await import("node:path");
 	const { fileURLToPath } = await import("node:url");
-	const { readdirSync } = await import("node:fs");
-	const examplesDir = resolve(dirname(fileURLToPath(import.meta.url)), "..");
+	const { readdirSync, existsSync } = await import("node:fs");
+	const __dirname = dirname(fileURLToPath(import.meta.url));
+	const examplesDir = resolve(__dirname, "..");
+	const isBuilt = __dirname.endsWith("/dist/bin") || __dirname.endsWith("/dist\\bin");
+	const ext = isBuilt ? ".mjs" : ".tsx";
 	const results = [];
 	for (const dir of CATEGORY_DIRS) {
 		const category = CATEGORY_DISPLAY[dir] ?? dir.charAt(0).toUpperCase() + dir.slice(1);
 		const dirPath = resolve(examplesDir, dir);
 		try {
-			const files = readdirSync(dirPath).filter((f) => f.endsWith(".tsx") && !f.startsWith("_"));
+			const files = readdirSync(dirPath).filter((f) => f.endsWith(ext) && !f.startsWith("_"));
 			for (const file of files) {
-				const name = file.replace(/\.tsx$/, "").replace(/-/g, " ");
+				const name = file.replace(/\.(tsx|mjs)$/, "").replace(/-/g, " ");
 				results.push({
 					name,
 					description: "",
@@ -67,18 +70,13 @@ async function discoverExamples() {
 			}
 		} catch {}
 	}
-	const aichatDir = resolve(examplesDir, "apps/aichat");
-	try {
-		const indexFile = resolve(aichatDir, "index.tsx");
-		const { stat } = await import("node:fs/promises");
-		await stat(indexFile);
-		results.push({
-			name: "aichat",
-			description: "AI Coding Agent demo",
-			file: indexFile,
-			category: "Apps"
-		});
-	} catch {}
+	const aichatPath = isBuilt ? resolve(examplesDir, "apps/aichat/index.mjs") : resolve(examplesDir, "apps/aichat/index.tsx");
+	if (existsSync(aichatPath)) results.push({
+		name: "aichat",
+		description: "AI Coding Agent demo",
+		file: aichatPath,
+		category: "Apps"
+	});
 	results.sort((a, b) => {
 		const catDiff = (CATEGORY_ORDER[a.category] ?? 99) - (CATEGORY_ORDER[b.category] ?? 99);
 		if (catDiff !== 0) return catDiff;
@@ -189,5 +187,3 @@ main().catch((err) => {
 });
 //#endregion
 export {};
-
-//# sourceMappingURL=cli.mjs.map

package/dist/chunk-BSw8zbkd.mjs

@@ -0,0 +1,37 @@
+import { createRequire } from "node:module";
+//#region \0rolldown/runtime.js
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esmMin = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __commonJSMin = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+var __toCommonJS = (mod) => __hasOwnProp.call(mod, "module.exports") ? mod["module.exports"] : __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+//#endregion
+export { __toCommonJS as a, __require as i, __esmMin as n, __toESM as o, __exportAll as r, __commonJSMin as t };

package/dist/components/counter.mjs

@@ -0,0 +1,47 @@
+import { useState } from "react";
+import { Box, Text } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/counter.tsx
+/**
+* Counter — Interactive state with useInput
+*
+* The "Hello World" of interactive TUIs: a counter you
+* increment/decrement with j/k.
+*
+* Usage: bun examples/components/counter.tsx
+*/
+function Counter() {
+	const [count, setCount] = useState(0);
+	useInput$1((input, key) => {
+		if (input === "j" || key.downArrow) setCount((c) => c + 1);
+		if (input === "k" || key.upArrow) setCount((c) => c - 1);
+		if (input === "r") setCount(0);
+		if (input === "q" || key.escape) return "exit";
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		children: [/* @__PURE__ */ jsxs(Box, {
+			gap: 1,
+			children: [/* @__PURE__ */ jsx(Text, { children: "Count:" }), /* @__PURE__ */ jsx(Text, {
+				bold: true,
+				color: count >= 0 ? "$success" : "$error",
+				children: count
+			})]
+		}), /* @__PURE__ */ jsx(Text, {
+			color: "$muted",
+			children: "j/k: +/- r: reset q: quit"
+		})]
+	});
+}
+const meta = {
+	name: "Counter",
+	description: "Interactive counter with useState + useInput"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(Counter, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };

package/dist/components/hello.mjs

@@ -0,0 +1,30 @@
+import "react";
+import { Box, Text } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/hello.tsx
+function Hello() {
+	useInput$1(() => "exit");
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		children: [/* @__PURE__ */ jsx(Text, {
+			bold: true,
+			color: "$primary",
+			children: "Hello, Silvery!"
+		}), /* @__PURE__ */ jsx(Text, {
+			color: "$muted",
+			children: "Press any key to exit."
+		})]
+	});
+}
+const meta = {
+	name: "Hello",
+	description: "The simplest silvery app — styled text, exit on keypress"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(Hello, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };

package/dist/components/progress-bar.mjs

@@ -0,0 +1,58 @@
+import { useState } from "react";
+import { Box, ProgressBar, Text } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/progress-bar.tsx
+/**
+* ProgressBar — Determinate and indeterminate progress
+*
+* Press j/k to adjust progress. Shows determinate bars with
+* percentage labels and an indeterminate animated bar.
+*
+* Usage: bun examples/components/progress-bar.tsx
+*/
+function ProgressBarDemo() {
+	const [progress, setProgress] = useState(.4);
+	useInput$1((input, key) => {
+		if (input === "j" || key.rightArrow) setProgress((p) => Math.min(1, p + .05));
+		if (input === "k" || key.leftArrow) setProgress((p) => Math.max(0, p - .05));
+		if (input === "q" || key.escape) return "exit";
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				children: "Determinate"
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				width: 40,
+				children: /* @__PURE__ */ jsx(ProgressBar, { value: progress })
+			}),
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				children: "Indeterminate"
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				width: 40,
+				children: /* @__PURE__ */ jsx(ProgressBar, {})
+			}),
+			/* @__PURE__ */ jsx(Text, {
+				color: "$muted",
+				children: "j/k: adjust q: quit"
+			})
+		]
+	});
+}
+const meta = {
+	name: "Progress Bar",
+	description: "Determinate and indeterminate progress bars"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(ProgressBarDemo, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };

package/dist/components/select-list.mjs

@@ -0,0 +1,84 @@
+import { useState } from "react";
+import { Box, SelectList, Text } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/select-list.tsx
+/**
+* SelectList — Keyboard-navigable single-select
+*
+* Navigate with j/k or arrows, confirm with Enter.
+* Disabled items are automatically skipped.
+*
+* Usage: bun examples/components/select-list.tsx
+*/
+const languages = [
+	{
+		label: "TypeScript",
+		value: "ts"
+	},
+	{
+		label: "Rust",
+		value: "rs"
+	},
+	{
+		label: "Go",
+		value: "go"
+	},
+	{
+		label: "Python",
+		value: "py"
+	},
+	{
+		label: "COBOL",
+		value: "cob",
+		disabled: true
+	},
+	{
+		label: "Elixir",
+		value: "ex"
+	}
+];
+function SelectListDemo() {
+	const [selected, setSelected] = useState(null);
+	useInput$1((_, key) => {
+		if (key.escape) return "exit";
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				children: "Pick a language:"
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				borderStyle: "round",
+				borderColor: "$border",
+				paddingX: 1,
+				children: /* @__PURE__ */ jsx(SelectList, {
+					items: languages,
+					onSelect: (opt) => setSelected(opt.value)
+				})
+			}),
+			selected && /* @__PURE__ */ jsxs(Text, {
+				color: "$success",
+				children: ["Selected: ", selected]
+			}),
+			/* @__PURE__ */ jsx(Text, {
+				color: "$muted",
+				children: "j/k: navigate Enter: select Esc: quit"
+			})
+		]
+	});
+}
+const meta = {
+	name: "Select List",
+	description: "Keyboard-navigable single-select list"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(SelectListDemo, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };

package/dist/components/spinner.mjs

@@ -0,0 +1,56 @@
+import "react";
+import { Box, Spinner, Text } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/spinner.tsx
+function SpinnerDemo() {
+	useInput$1((input, key) => {
+		if (input === "q" || key.escape) return "exit";
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				children: "Spinner Styles"
+			}),
+			/* @__PURE__ */ jsxs(Box, {
+				flexDirection: "column",
+				children: [
+					/* @__PURE__ */ jsx(Spinner, {
+						type: "dots",
+						label: "Loading packages..."
+					}),
+					/* @__PURE__ */ jsx(Spinner, {
+						type: "line",
+						label: "Compiling..."
+					}),
+					/* @__PURE__ */ jsx(Spinner, {
+						type: "arc",
+						label: "Optimizing..."
+					}),
+					/* @__PURE__ */ jsx(Spinner, {
+						type: "bounce",
+						label: "Connecting..."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx(Text, {
+				color: "$muted",
+				children: "q: quit"
+			})
+		]
+	});
+}
+const meta = {
+	name: "Spinner",
+	description: "Four animated loading spinner styles"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(SpinnerDemo, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };

package/dist/components/text-input.mjs

@@ -0,0 +1,61 @@
+import { useState } from "react";
+import { Box, Text, TextInput } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/text-input.tsx
+/**
+* TextInput — Single-line text entry
+*
+* Shows TextInput with placeholder, prompt, and submit handler.
+* Full readline keybindings (Ctrl+A/E/K/U, Alt+B/F) are built in.
+*
+* Usage: bun examples/components/text-input.tsx
+*/
+function TextInputDemo() {
+	const [value, setValue] = useState("");
+	const [submitted, setSubmitted] = useState([]);
+	useInput$1((_, key) => {
+		if (key.escape) return "exit";
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ jsx(TextInput, {
+				value,
+				onChange: setValue,
+				onSubmit: (val) => {
+					setSubmitted((prev) => [...prev, val]);
+					setValue("");
+				},
+				placeholder: "Type something and press Enter...",
+				prompt: "> "
+			}),
+			submitted.length > 0 && /* @__PURE__ */ jsxs(Box, {
+				flexDirection: "column",
+				children: [/* @__PURE__ */ jsx(Text, {
+					color: "$muted",
+					children: "Submitted:"
+				}), submitted.map((s, i) => /* @__PURE__ */ jsx(Text, {
+					color: "$success",
+					children: s
+				}, i))]
+			}),
+			/* @__PURE__ */ jsx(Text, {
+				color: "$muted",
+				children: "Enter: submit Esc: quit"
+			})
+		]
+	});
+}
+const meta = {
+	name: "Text Input",
+	description: "Single-line text entry with readline keybindings"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(TextInputDemo, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };

package/dist/components/virtual-list.mjs

@@ -0,0 +1,50 @@
+import "react";
+import { Box, ListView, Text } from "silvery";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { run, useInput as useInput$1 } from "silvery/runtime";
+//#region components/virtual-list.tsx
+const items = Array.from({ length: 200 }, (_, i) => ({
+	id: i,
+	name: `Item ${i + 1}`
+}));
+function ListViewDemo() {
+	useInput$1((input, key) => {
+		if (input === "q" || key.escape) return "exit";
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		padding: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				children: "200 items (virtualized)"
+			}),
+			/* @__PURE__ */ jsx(ListView, {
+				items,
+				height: 12,
+				estimateHeight: 1,
+				nav: true,
+				renderItem: (item, _index, meta) => /* @__PURE__ */ jsxs(Text, {
+					color: meta.isCursor ? "$primary" : void 0,
+					bold: meta.isCursor,
+					children: [meta.isCursor ? "> " : "  ", item.name]
+				}, item.id)
+			}),
+			/* @__PURE__ */ jsx(Text, {
+				color: "$muted",
+				children: "j/k: navigate q: quit"
+			})
+		]
+	});
+}
+const meta = {
+	name: "Virtual List",
+	description: "Efficient scrollable list with 200 virtualized items"
+};
+async function main() {
+	await (await run(/* @__PURE__ */ jsx(ListViewDemo, {}))).waitUntilExit();
+}
+if (import.meta.main) await main();
+//#endregion
+export { main, meta };