@zaly/tui 0.0.4

package/dist/widgets/completions/github.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"github.d.mts","names":[],"sources":["../../../src/widgets/completions/github.ts"],"mappings":";;;;;;KAWY,aAAa;EACvB;EACA;;;EAGA;EACA;EACA;EACA;IAAW;;;KAGD;KAEA,iBAAiB,aAAa,OAAO,gBAAgB,QAAQ;UAExD;;;EAGf;;;EAGA,UAAU;;;EAGV;;EAEA,QAAQ;;EAER;;;;EAIA,UAAU;;;;;;;;;;;;;;;;;;;;;;;iBAwBI,aAAa,OAAM,sBAA2B,iBAAiB"}

package/dist/widgets/completions/github.mjs

@@ -0,0 +1,137 @@
+import { stringWidth } from "@zaly/shared/ansi";
+import { spawn } from "node:child_process";
+//#region src/widgets/completions/github.ts
+/**
+* Completion source for GitHub issues and pull requests from the repo
+* at `cwd`. Shells out to the `gh` CLI on first use, caches the result,
+* and fuzzy-filters locally on subsequent calls so typing stays snappy.
+*
+* Accepts insert `#123 ` into the input — ready for a markdown-style
+* reference in a chat message or commit subject.
+*
+* ```ts
+* autocomplete({
+*   input: "chat-input",
+*   sources: {
+*     gh: githubSource(),
+*   },
+* })
+* ```
+*
+* Silently returns no items when `gh` isn't installed, the user isn't
+* authenticated, or the directory isn't a GitHub repo — so it's safe
+* to wire up unconditionally.
+*/
+function githubSource(opts = {}) {
+	const cwd = opts.cwd ?? process.cwd();
+	const trigger = opts.trigger ?? /(?<=^|\s)#/;
+	const prefix = opts.prefix ?? "#";
+	const state = opts.state ?? "open";
+	const limit = opts.limit ?? 50;
+	const fetcher = opts.fetcher ?? defaultFetcher(limit);
+	let cache;
+	return {
+		accept: (item) => `${prefix}${item.number} `,
+		async complete(_query, match) {
+			cache ??= fetcher(cwd, state).catch(() => []);
+			const items = await cache;
+			const out = [];
+			for (const item of items) {
+				const score = match(`#${item.number} ${item.title}`);
+				if (!score) continue;
+				out.push({
+					...item,
+					score
+				});
+			}
+			return out;
+		},
+		render: defaultRender,
+		triggers: [trigger]
+	};
+}
+const defaultRender = (item, ctx) => {
+	const { style } = ctx;
+	const num = `#${item.number}`;
+	const stateSlot = stateStyleSlot(item.state);
+	const typeLabel = item.type === "pr" ? "pr" : "issue";
+	const author = item.author?.login ? `@${item.author.login}` : "";
+	const lead = `${style.add("optionName")(num)} ${style.add(stateSlot)(`${item.state}·${typeLabel}`)} ${item.title}`;
+	if (author === "") return lead;
+	const gap = 2;
+	const leadW = stringWidth(lead);
+	const hintW = stringWidth(author);
+	const padded = ctx.width - leadW - hintW - gap;
+	if (padded < 1) return lead;
+	return lead + " ".repeat(padded + gap) + style.add("optionDesc")(author);
+};
+function stateStyleSlot(state) {
+	if (state === "open") return "success";
+	if (state === "merged") return "accent";
+	return "muted";
+}
+/** Default fetcher — shells out to `gh issue list` + `gh pr list` in
+*  parallel. Either failing is swallowed so a repo with only issues
+*  (or only PRs) still works. */
+function defaultFetcher(limit) {
+	const fields = "number,title,state,author,url";
+	return async (cwd, state) => {
+		const [issues, prs] = await Promise.all([runGh(cwd, [
+			"issue",
+			"list",
+			"--state",
+			state,
+			"--json",
+			fields,
+			"--limit",
+			String(limit)
+		]), runGh(cwd, [
+			"pr",
+			"list",
+			"--state",
+			state,
+			"--json",
+			fields,
+			"--limit",
+			String(limit)
+		])]);
+		return [...parse(issues).map((x) => Object.assign(x, { type: "issue" })), ...parse(prs).map((x) => Object.assign(x, { type: "pr" }))].map((item) => Object.assign(item, { text: `#${item.number} ${item.title}` }));
+	};
+}
+function parse(out) {
+	try {
+		return JSON.parse(out);
+	} catch {
+		return [];
+	}
+}
+function runGh(cwd, args) {
+	return new Promise((resolve) => {
+		try {
+			const child = spawn("gh", args, {
+				cwd,
+				stdio: [
+					"ignore",
+					"pipe",
+					"ignore"
+				]
+			});
+			let stdout = "";
+			child.stdout.on("data", (chunk) => {
+				stdout += chunk.toString("utf8");
+			});
+			child.on("close", (code) => {
+				resolve(code === 0 ? stdout : "");
+			});
+			child.on("error", () => {
+				resolve("");
+			});
+		} catch {
+			resolve("");
+		}
+	});
+}
+//#endregion
+export { githubSource };
+
+//# sourceMappingURL=github.mjs.map

package/dist/widgets/completions/github.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"github.mjs","names":[],"sources":["../../../src/widgets/completions/github.ts"],"sourcesContent":["import type { ScoredItem } from \"../../search/matcher.ts\"\nimport type { CompletionSource } from \"../autocomplete.ts\"\nimport type { PickerItem } from \"../picker.ts\"\nimport type { OptionRender } from \"../select.ts\"\n\nimport { stringWidth } from \"@zaly/shared/ansi\"\nimport { spawn } from \"node:child_process\"\n\n/** A GitHub issue or pull request returned by `githubSource`. Shape\n *  mirrors the `gh` CLI's `--json number,title,state,author,url`\n *  output, with `type` added to distinguish issues from PRs. */\nexport type GithubItem = PickerItem & {\n  number: number\n  title: string\n  /** `\"open\"` / `\"closed\"` for issues; `\"open\"` / `\"closed\"` / `\"merged\"`\n   *  for PRs. Kept as a string so we don't trip if gh evolves. */\n  state: string\n  type: \"issue\" | \"pr\"\n  url: string\n  author?: { login?: string }\n}\n\nexport type GithubState = \"open\" | \"closed\" | \"all\"\n\nexport type GithubFetcher = (cwd: string, state: GithubState) => Promise<GithubItem[]>\n\nexport interface GithubSourceOptions {\n  /** Working directory used to locate the repo. `gh` resolves the repo\n   *  from the git remote of this dir. Default: `process.cwd()`. */\n  cwd?: string\n  /** Trigger regex. Default: `/(?<=^|\\s)#/` — `#` preceded by start-of-\n   *  string or whitespace (same lookbehind trick as `filesSource`). */\n  trigger?: RegExp\n  /** Prepended to the accepted value so the trigger character stays in\n   *  the input. Default: `\"#\"`. */\n  prefix?: string\n  /** Which issues / PRs to include. Default: `\"open\"`. */\n  state?: GithubState\n  /** Per-kind cap passed to `gh`. Default: `50`. */\n  limit?: number\n  /** Override the fetch implementation. Mainly useful for tests — the\n   *  default shells out to `gh`. The fetcher is called at most once per\n   *  `githubSource` instance; results are cached thereafter. */\n  fetcher?: GithubFetcher\n}\n\n/**\n * Completion source for GitHub issues and pull requests from the repo\n * at `cwd`. Shells out to the `gh` CLI on first use, caches the result,\n * and fuzzy-filters locally on subsequent calls so typing stays snappy.\n *\n * Accepts insert `#123 ` into the input — ready for a markdown-style\n * reference in a chat message or commit subject.\n *\n * ```ts\n * autocomplete({\n *   input: \"chat-input\",\n *   sources: {\n *     gh: githubSource(),\n *   },\n * })\n * ```\n *\n * Silently returns no items when `gh` isn't installed, the user isn't\n * authenticated, or the directory isn't a GitHub repo — so it's safe\n * to wire up unconditionally.\n */\nexport function githubSource(opts: GithubSourceOptions = {}): CompletionSource<GithubItem> {\n  const cwd = opts.cwd ?? process.cwd()\n  const trigger = opts.trigger ?? /(?<=^|\\s)#/\n  const prefix = opts.prefix ?? \"#\"\n  const state: GithubState = opts.state ?? \"open\"\n  const limit = opts.limit ?? 50\n  const fetcher = opts.fetcher ?? defaultFetcher(limit)\n\n  // Lazy, single-fetch cache. The Promise is reused by concurrent\n  // callers so rapid keystrokes while the first fetch is in flight\n  // don't spawn duplicate `gh` processes.\n  let cache: Promise<GithubItem[]> | undefined\n\n  return {\n    accept: (item) => `${prefix}${item.number} `,\n    async complete(_query: string, match): Promise<ScoredItem<GithubItem>[]> {\n      cache ??= fetcher(cwd, state).catch(() => [])\n      const items = await cache\n      const out: ScoredItem<GithubItem>[] = []\n      for (const item of items) {\n        // Match on \"#<num> <title>\" so users can type either digits or\n        // words and both hit. Keeps ranking implicit — source order\n        // (freshest first from gh) wins when scores tie.\n        const target = `#${item.number} ${item.title}`\n        const score = match(target)\n        if (!score) continue\n        out.push({ ...item, score })\n      }\n      return out\n    },\n    render: defaultRender,\n    triggers: [trigger],\n  }\n}\n\nconst defaultRender: OptionRender<GithubItem> = (item, ctx) => {\n  const { style } = ctx\n  const num = `#${item.number}`\n  const stateSlot = stateStyleSlot(item.state)\n  const typeLabel = item.type === \"pr\" ? \"pr\" : \"issue\"\n  const author = item.author?.login ? `@${item.author.login}` : \"\"\n\n  // Layout: [#num] [state/type] title ............. @author\n  // All chrome is left-aligned; author is the right-column hint.\n  const lead = `${style.add(\"optionName\")(num)} ${style.add(stateSlot)(`${item.state}·${typeLabel}`)} ${item.title}`\n\n  if (author === \"\") return lead\n  const gap = 2\n  const leadW = stringWidth(lead)\n  const hintW = stringWidth(author)\n  const padded = ctx.width - leadW - hintW - gap\n  if (padded < 1) return lead\n  return lead + \" \".repeat(padded + gap) + style.add(\"optionDesc\")(author)\n}\n\nfunction stateStyleSlot(state: string): string {\n  if (state === \"open\") return \"success\"\n  if (state === \"merged\") return \"accent\"\n  // \"closed\" and anything unknown → dim.\n  return \"muted\"\n}\n\n/** Default fetcher — shells out to `gh issue list` + `gh pr list` in\n *  parallel. Either failing is swallowed so a repo with only issues\n *  (or only PRs) still works. */\nfunction defaultFetcher(limit: number): GithubFetcher {\n  const fields = \"number,title,state,author,url\"\n  return async (cwd, state) => {\n    const [issues, prs] = await Promise.all([\n      runGh(cwd, [\"issue\", \"list\", \"--state\", state, \"--json\", fields, \"--limit\", String(limit)]),\n      runGh(cwd, [\"pr\", \"list\", \"--state\", state, \"--json\", fields, \"--limit\", String(limit)]),\n    ])\n    return [\n      ...parse(issues).map((x) => Object.assign(x, { type: \"issue\" as const })),\n      ...parse(prs).map((x) => Object.assign(x, { type: \"pr\" as const })),\n    ].map((item) => Object.assign(item, { text: `#${item.number} ${item.title}` }))\n  }\n}\n\nfunction parse(out: string): Omit<GithubItem, \"type\">[] {\n  try {\n    return JSON.parse(out) as Omit<GithubItem, \"type\">[]\n  } catch {\n    return []\n  }\n}\n\nfunction runGh(cwd: string, args: string[]): Promise<string> {\n  return new Promise((resolve) => {\n    try {\n      const child = spawn(\"gh\", args, { cwd, stdio: [\"ignore\", \"pipe\", \"ignore\"] })\n      let stdout = \"\"\n      child.stdout.on(\"data\", (chunk: Buffer) => {\n        stdout += chunk.toString(\"utf8\")\n      })\n      child.on(\"close\", (code) => {\n        resolve(code === 0 ? stdout : \"\")\n      })\n      child.on(\"error\", () => {\n        resolve(\"\")\n      })\n    } catch {\n      resolve(\"\")\n    }\n  })\n}\n"],"mappings":"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"}

package/dist/widgets/completions/index.d.mts

@@ -0,0 +1,4 @@
+import { ActionCompletionItem, ActionsSourceOptions, actionsSource } from "./actions.mjs";
+import { FilesSourceOptions, filesSource } from "./files.mjs";
+import { GithubFetcher, GithubItem, GithubSourceOptions, GithubState, githubSource } from "./github.mjs";
+export { ActionCompletionItem, ActionsSourceOptions, FilesSourceOptions, GithubFetcher, GithubItem, GithubSourceOptions, GithubState, actionsSource, filesSource, githubSource };

package/dist/widgets/completions/index.mjs

@@ -0,0 +1,4 @@
+import { actionsSource } from "./actions.mjs";
+import { filesSource } from "./files.mjs";
+import { githubSource } from "./github.mjs";
+export { actionsSource, filesSource, githubSource };

package/dist/widgets/diff.d.mts

@@ -0,0 +1,57 @@
+import { J as Layout, P as RenderCtx, X as State, nt as Reactive, p as Node } from "../queries-DH3bj74K.mjs";
+import { WrapMode } from "../text.mjs";
+//#region src/widgets/diff.d.ts
+interface DiffState {
+  /** Pre-state file content. Plain string or reactive accessor —
+   *  pass a signal to live-update the diff as either side changes. */
+  original: Reactive<string>;
+  /** Post-state file content. The widget runs `diffLines` between
+   *  `original` and `modified` and renders the resulting hunks. */
+  modified: Reactive<string>;
+  /** Optional file path. Drives the default `lang` (extension or
+   *  basename — shiki recognises both `.ts` and `Dockerfile`-style
+   *  names) and `title` when those aren't set explicitly. */
+  path?: Reactive<string>;
+  /** Language for syntax highlighting (any shiki-bundled name or
+   *  alias). Defaults from `path` when set. */
+  lang?: string;
+  /** Lines of surrounding context per hunk. Default: 3. */
+  context?: number;
+  wrap?: WrapMode;
+}
+/**
+ * Show a unified diff between two file contents with syntax-highlighted
+ * rows. Added rows carry a green backdrop and `+` prefix; removed rows
+ * carry a red backdrop and `-` prefix; context rows show both line
+ * numbers with a neutral gutter.
+ *
+ * Both sides are highlighted as complete files (via shiki) before the
+ * diff is assembled, so context around an edit tokenizes the way it
+ * would in the actual file — multi-line strings, block comments, etc.
+ * don't get truncated by the hunk window.
+ */
+declare class Diff extends Node<DiffState> {
+  #private;
+  constructor(state: DiffState);
+  get input(): {
+    original: string;
+    modified: string;
+  };
+  protected _render(ctx: RenderCtx): Promise<string[]>;
+  layout(): Layout;
+}
+/**
+ * Factory for `Diff`.
+ *
+ * ```ts
+ * diff({
+ *   original: "function foo() {}\n",
+ *   modified: "function foo(x) {}\n",
+ *   path: "foo.ts",
+ * })
+ * ```
+ */
+declare function diff(state: State<DiffState>): Diff;
+//#endregion
+export { Diff, DiffState, diff };
+//# sourceMappingURL=diff.d.mts.map

package/dist/widgets/diff.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"diff.d.mts","names":[],"sources":["../../src/widgets/diff.ts"],"mappings":";;;UAeiB;;;EAGf,UAAU;;;EAGV,UAAU;;;;EAIV,OAAO;;;EAGP;;EAEA;EACA,OAAO;;;;;;;;;;;;;cAuBI,aAAa,KAAK;;EAI7B,YAAY,OAAO;MA+Bf;IAAW;IAAkB;;YAOjB,QAAQ,KAAK,YAAY;EAmBhC,UAAU;;;;;;;;;;;;;iBA4BL,KAAK,OAAO,MAAM,aAAa"}

package/dist/widgets/diff.mjs

@@ -0,0 +1,199 @@
+import { S as unwrap, h as memo, r as createAsync, w as useContext } from "../reactive-f7NpAi69.mjs";
+import { t as Node } from "../node-BZ7f6HzU.mjs";
+import { calcLayout, countLines } from "../text.mjs";
+import { t as RenderContext } from "../render-DxVLqqB9.mjs";
+import { t as codeToAnsi } from "../shiki-BrjVUkeh.mjs";
+import { splitAnsi, stringWidth, wrapAnsi } from "@zaly/shared/ansi";
+import { basename, extname } from "pathe";
+//#region src/widgets/diff.ts
+/**
+* Show a unified diff between two file contents with syntax-highlighted
+* rows. Added rows carry a green backdrop and `+` prefix; removed rows
+* carry a red backdrop and `-` prefix; context rows show both line
+* numbers with a neutral gutter.
+*
+* Both sides are highlighted as complete files (via shiki) before the
+* diff is assembled, so context around an edit tokenizes the way it
+* would in the actual file — multi-line strings, block comments, etc.
+* don't get truncated by the hunk window.
+*/
+var Diff = class extends Node {
+	#lang;
+	#highlighted;
+	constructor(state) {
+		super({
+			wrap: "word",
+			...state
+		});
+		this.#lang = memo(() => {
+			const path = unwrap(this.state.path);
+			return this.state.lang ?? (path !== void 0 ? langFromPath(path) : void 0);
+		});
+		const context = useContext(RenderContext);
+		this.#highlighted = createAsync(async () => {
+			const lang = this.#lang();
+			const input = this.input;
+			if (!lang) return input;
+			const theme = context?.style().theme.shiki;
+			const [original, modified] = await Promise.all([codeToAnsi(input.original, lang, { theme }), codeToAnsi(input.modified, lang, { theme })]);
+			return {
+				modified,
+				original
+			};
+		}, { initialValue: this.input });
+	}
+	#norm(s) {
+		return s.replaceAll("\r\n", "\n").replaceAll("\r", "");
+	}
+	get input() {
+		return {
+			modified: this.#norm(unwrap(this.state.modified)),
+			original: this.#norm(unwrap(this.state.original))
+		};
+	}
+	async _render(ctx) {
+		const highlighted = this.#highlighted();
+		const input = this.input;
+		const layout = this.layout();
+		const width = Math.min(ctx.width, layout.width);
+		const opts = {
+			context: this.state.context ?? 3,
+			ctx: {
+				...ctx,
+				width
+			},
+			modified: input.modified.split("\n"),
+			modifiedHi: highlighted.modified.split("\n"),
+			original: input.original.split("\n"),
+			originalHi: highlighted.original.split("\n")
+		};
+		this.state.wrap ??= "word";
+		return await buildDiffRows(opts);
+	}
+	layout() {
+		const input = this.input;
+		const original = calcLayout(input.original, { wrap: this.state.wrap });
+		const modified = calcLayout(input.modified, { wrap: this.state.wrap });
+		const padding = Math.max(1, countLines(unwrap(this.state.original)), countLines(unwrap(this.state.modified))).toString().length * 2 + 4 + 4;
+		return {
+			minWidth: Math.max(original.minWidth, modified.minWidth) + padding,
+			width: Math.max(original.width, modified.width) + padding
+		};
+	}
+};
+/**
+* Factory for `Diff`.
+*
+* ```ts
+* diff({
+*   original: "function foo() {}\n",
+*   modified: "function foo(x) {}\n",
+*   path: "foo.ts",
+* })
+* ```
+*/
+function diff(state) {
+	return new Diff(state);
+}
+async function buildDiffRows(opts) {
+	const context = opts.context;
+	const { diffArrays } = await import("diff");
+	const segments = diffArrays(opts.original, opts.modified);
+	const { original: origLines, modified: modLines, originalHi: origHi, modifiedHi: modHi, ctx } = opts;
+	const ann = [];
+	let oI = 0;
+	let mI = 0;
+	for (const seg of segments) if (seg.added) for (const _ of seg.value) ann.push({
+		kind: "add",
+		modIdx: mI++
+	});
+	else if (seg.removed) for (const _ of seg.value) ann.push({
+		kind: "remove",
+		origIdx: oI++
+	});
+	else for (const _ of seg.value) ann.push({
+		kind: "equal",
+		modIdx: mI++,
+		origIdx: oI++
+	});
+	const ranges = [];
+	for (let i = 0; i < ann.length; i++) {
+		if (ann[i].kind === "equal") continue;
+		const start = Math.max(0, i - context);
+		const end = Math.min(ann.length - 1, i + context);
+		const last = ranges.at(-1);
+		if (last && start <= last.end + 1) last.end = Math.max(last.end, end);
+		else ranges.push({
+			end,
+			start
+		});
+	}
+	if (ranges.length === 0) return [];
+	const rows = [];
+	for (const r of ranges) for (let i = r.start; i <= r.end; i++) {
+		const a = ann[i];
+		if (a.kind === "equal") rows.push({
+			content: modHi[a.modIdx] ?? origHi[a.origIdx] ?? "",
+			newNum: a.modIdx + 1,
+			origNum: a.origIdx + 1,
+			type: "context"
+		});
+		else if (a.kind === "remove") rows.push({
+			content: origHi[a.origIdx] ?? "",
+			origNum: a.origIdx + 1,
+			type: "remove"
+		});
+		else rows.push({
+			content: modHi[a.modIdx] ?? "",
+			newNum: a.modIdx + 1,
+			type: "add"
+		});
+	}
+	return renderRows(ctx, rows, origLines.length, modLines.length);
+}
+function renderRows(ctx, rows, origTotal, modTotal) {
+	const numWidth = Math.max(String(origTotal).length, String(modTotal).length, 1);
+	const s = ctx.style;
+	const gutterWidth = numWidth * 2 + 4;
+	const contentWidth = Math.max(0, ctx.width - gutterWidth);
+	const blankGutter = " ".repeat(gutterWidth - 2) + s.dim("↪ ");
+	const styles = {
+		add: "diffAdd",
+		context: "diffContext",
+		remove: "diffDel"
+	};
+	const out = [];
+	for (const r of rows) {
+		const origStr = r.type === "add" ? "" : String(r.origNum);
+		const newStr = r.type === "remove" ? "" : String(r.newNum);
+		const gutterStyle = s.bg(`${styles[r.type]}+10`);
+		const gutter = gutterStyle(` ${pad(origStr, numWidth)}  ${pad(newStr, numWidth)} `);
+		const prefix = r.type === "add" ? " + " : r.type === "remove" ? " - " : "   ";
+		const innerWidth = Math.max(0, contentWidth - stringWidth(prefix) - 1);
+		const wrapped = innerWidth > 0 && stringWidth(r.content) > innerWidth ? splitAnsi(wrapAnsi(r.content, innerWidth, { mode: "word" })) : [r.content];
+		const rowStyle = s.bg(styles[r.type]);
+		for (let i = 0; i < wrapped.length; i++) {
+			const wline = wrapped[i];
+			const pw = Math.max(0, innerWidth - stringWidth(wline) + 1);
+			const bodyLine = (i === 0 ? prefix : "   ") + wline + " ".repeat(pw);
+			const styledBody = rowStyle?.(bodyLine) ?? bodyLine;
+			out.push((i === 0 ? gutter : gutterStyle(blankGutter)) + styledBody);
+		}
+	}
+	return out;
+}
+function pad(s, width) {
+	return s.length >= width ? s : " ".repeat(width - s.length) + s;
+}
+/** Resolve a file path to a shiki language identifier. Falls back from
+*  extension to basename — shiki natively recognises `dockerfile`,
+*  `makefile`, `cmakelists.txt`, etc. */
+function langFromPath(path) {
+	const ext = extname(path).slice(1).toLowerCase();
+	if (ext) return ext;
+	return basename(path).toLowerCase() || void 0;
+}
+//#endregion
+export { Diff, diff };
+
+//# sourceMappingURL=diff.mjs.map

package/dist/widgets/diff.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"diff.mjs","names":["#lang","#highlighted","#norm"],"sources":["../../src/widgets/diff.ts"],"sourcesContent":["import type { RenderCtx } from \"../core/ctx.ts\"\nimport type { Accessor, Reactive } from \"../core/reactive.ts\"\nimport type { Layout, State } from \"../core/state.ts\"\nimport type { WrapMode } from \"../layout/text.ts\"\n\nimport { splitAnsi, stringWidth, wrapAnsi } from \"@zaly/shared/ansi\"\nimport { basename, extname } from \"pathe\"\n// oxlint-disable no-nested-ternary\n// oxlint-disable typescript/no-unnecessary-condition\nimport { Node } from \"../core/node.ts\"\nimport { createAsync, memo, unwrap, useContext } from \"../core/reactive.ts\"\nimport { RenderContext } from \"../core/render.ts\"\nimport { calcLayout, countLines } from \"../layout/text.ts\"\nimport { codeToAnsi } from \"../shiki/shiki.ts\"\n\nexport interface DiffState {\n  /** Pre-state file content. Plain string or reactive accessor —\n   *  pass a signal to live-update the diff as either side changes. */\n  original: Reactive<string>\n  /** Post-state file content. The widget runs `diffLines` between\n   *  `original` and `modified` and renders the resulting hunks. */\n  modified: Reactive<string>\n  /** Optional file path. Drives the default `lang` (extension or\n   *  basename — shiki recognises both `.ts` and `Dockerfile`-style\n   *  names) and `title` when those aren't set explicitly. */\n  path?: Reactive<string>\n  /** Language for syntax highlighting (any shiki-bundled name or\n   *  alias). Defaults from `path` when set. */\n  lang?: string\n  /** Lines of surrounding context per hunk. Default: 3. */\n  context?: number\n  wrap?: WrapMode\n}\n\ntype DiffOpts = {\n  original: string[]\n  originalHi: string[]\n  modified: string[]\n  modifiedHi: string[]\n  context: number\n  ctx: RenderCtx\n}\n\n/**\n * Show a unified diff between two file contents with syntax-highlighted\n * rows. Added rows carry a green backdrop and `+` prefix; removed rows\n * carry a red backdrop and `-` prefix; context rows show both line\n * numbers with a neutral gutter.\n *\n * Both sides are highlighted as complete files (via shiki) before the\n * diff is assembled, so context around an edit tokenizes the way it\n * would in the actual file — multi-line strings, block comments, etc.\n * don't get truncated by the hunk window.\n */\nexport class Diff extends Node<DiffState> {\n  #lang: Accessor<string | undefined>\n  #highlighted: Accessor<{ original: string; modified: string }>\n\n  constructor(state: DiffState) {\n    super({ wrap: \"word\", ...state })\n\n    this.#lang = memo(() => {\n      const path = unwrap(this.state.path)\n      return this.state.lang ?? (path !== undefined ? langFromPath(path) : undefined)\n    })\n\n    const context = useContext(RenderContext)\n    this.#highlighted = createAsync(\n      async () => {\n        const lang = this.#lang()\n        const input = this.input\n        if (!lang) return input\n        const theme = context?.style().theme.shiki\n        const [original, modified] = await Promise.all([\n          codeToAnsi(input.original, lang, { theme }),\n          codeToAnsi(input.modified, lang, { theme }),\n        ])\n        return { modified, original }\n      },\n      {\n        initialValue: this.input,\n      }\n    )\n  }\n\n  #norm(s: string): string {\n    return s.replaceAll(\"\\r\\n\", \"\\n\").replaceAll(\"\\r\", \"\")\n  }\n\n  get input(): { original: string; modified: string } {\n    return {\n      modified: this.#norm(unwrap(this.state.modified)),\n      original: this.#norm(unwrap(this.state.original)),\n    }\n  }\n\n  protected async _render(ctx: RenderCtx): Promise<string[]> {\n    const highlighted = this.#highlighted()\n    const input = this.input\n    const layout = this.layout()\n    const width = Math.min(ctx.width, layout.width)\n\n    const opts: DiffOpts = {\n      context: this.state.context ?? 3,\n      ctx: { ...ctx, width },\n      modified: input.modified.split(\"\\n\"),\n      modifiedHi: highlighted.modified.split(\"\\n\"),\n      original: input.original.split(\"\\n\"),\n      originalHi: highlighted.original.split(\"\\n\"),\n    }\n\n    this.state.wrap ??= \"word\"\n    return await buildDiffRows(opts)\n  }\n\n  override layout(): Layout {\n    const input = this.input\n    const original = calcLayout(input.original, { wrap: this.state.wrap })\n    const modified = calcLayout(input.modified, { wrap: this.state.wrap })\n    const numWidth = Math.max(\n      1,\n      countLines(unwrap(this.state.original)),\n      countLines(unwrap(this.state.modified))\n    ).toString().length\n    const padding = numWidth * 2 + 4 + 4\n    return {\n      minWidth: Math.max(original.minWidth, modified.minWidth) + padding,\n      width: Math.max(original.width, modified.width) + padding,\n    }\n  }\n}\n\n/**\n * Factory for `Diff`.\n *\n * ```ts\n * diff({\n *   original: \"function foo() {}\\n\",\n *   modified: \"function foo(x) {}\\n\",\n *   path: \"foo.ts\",\n * })\n * ```\n */\nexport function diff(state: State<DiffState>): Diff {\n  return new Diff(state)\n}\n\n// ---------- internals ----------\n\ntype DiffRow =\n  | { type: \"context\"; origNum: number; newNum: number; content: string }\n  | { type: \"remove\"; origNum: number; content: string }\n  | { type: \"add\"; newNum: number; content: string }\n\nasync function buildDiffRows(opts: DiffOpts): Promise<string[]> {\n  const context = opts.context\n  // Async-import keeps cold start snappy — only the diff widget pulls\n  // in the library, and it lands at first render rather than at module\n  // load.\n  const { diffArrays } = await import(\"diff\")\n  const segments = diffArrays(opts.original, opts.modified)\n  const {\n    original: origLines,\n    modified: modLines,\n    originalHi: origHi,\n    modifiedHi: modHi,\n    ctx,\n  } = opts\n\n  // Annotate each line in the diff with its kind + (orig, mod) indices.\n  // The flattened list is the row-order the diff would print without\n  // any hunking; we compute hunks (with surrounding context) on top.\n  interface Annotated {\n    kind: \"equal\" | \"remove\" | \"add\"\n    origIdx?: number\n    modIdx?: number\n  }\n  const ann: Annotated[] = []\n  let oI = 0\n  let mI = 0\n  for (const seg of segments) {\n    if (seg.added) {\n      for (const _ of seg.value) ann.push({ kind: \"add\", modIdx: mI++ })\n    } else if (seg.removed) {\n      for (const _ of seg.value) ann.push({ kind: \"remove\", origIdx: oI++ })\n    } else {\n      for (const _ of seg.value) ann.push({ kind: \"equal\", modIdx: mI++, origIdx: oI++ })\n    }\n  }\n\n  // Find hunks: ranges around each non-equal line, expanded by `context`,\n  // merged when adjacent ranges touch.\n  const ranges: { start: number; end: number }[] = []\n  for (let i = 0; i < ann.length; i++) {\n    if (ann[i].kind === \"equal\") continue\n    const start = Math.max(0, i - context)\n    const end = Math.min(ann.length - 1, i + context)\n    const last = ranges.at(-1)\n    if (last && start <= last.end + 1) last.end = Math.max(last.end, end)\n    else ranges.push({ end, start })\n  }\n  if (ranges.length === 0) return [] // nothing changed\n\n  // Emit rows for each hunk. (Between hunks we just skip the equal\n  // lines — a `…` divider is a future polish.)\n  const rows: DiffRow[] = []\n  for (const r of ranges) {\n    for (let i = r.start; i <= r.end; i++) {\n      const a = ann[i]\n      if (a.kind === \"equal\") {\n        rows.push({\n          content: modHi[a.modIdx!] ?? origHi[a.origIdx!] ?? \"\",\n          newNum: a.modIdx! + 1,\n          origNum: a.origIdx! + 1,\n          type: \"context\",\n        })\n      } else if (a.kind === \"remove\") {\n        rows.push({\n          content: origHi[a.origIdx!] ?? \"\",\n          origNum: a.origIdx! + 1,\n          type: \"remove\",\n        })\n      } else {\n        rows.push({\n          content: modHi[a.modIdx!] ?? \"\",\n          newNum: a.modIdx! + 1,\n          type: \"add\",\n        })\n      }\n    }\n  }\n\n  return renderRows(ctx, rows, origLines.length, modLines.length)\n}\n\nfunction renderRows(\n  ctx: RenderCtx,\n  rows: DiffRow[],\n  origTotal: number,\n  modTotal: number\n): string[] {\n  const numWidth = Math.max(String(origTotal).length, String(modTotal).length, 1)\n  const s = ctx.style\n\n  // Two-column gutter: original line number | new line number | space.\n  // - Context rows show both numbers.\n  // - Remove rows show only the original number; new column blank.\n  // - Add rows show only the new number; original column blank.\n  // Wrapped continuation lines reuse the row style but emit a blank\n  // gutter so the line number isn't repeated per visual row.\n  const gutterWidth = numWidth * 2 + 4 // \"<orig> <new> \"\n  const contentWidth = Math.max(0, ctx.width - gutterWidth)\n  const blankGutter = \" \".repeat(gutterWidth - 2) + s.dim(\"↪ \")\n\n  const styles = {\n    add: \"diffAdd\",\n    context: \"diffContext\",\n    remove: \"diffDel\",\n  } as const\n\n  const out: string[] = []\n  for (const r of rows) {\n    const origStr = r.type === \"add\" ? \"\" : String(r.origNum)\n    const newStr = r.type === \"remove\" ? \"\" : String(r.newNum)\n    const gutterStyle = s.bg(`${styles[r.type]}+10`)\n    const gutter = gutterStyle(` ${pad(origStr, numWidth)}  ${pad(newStr, numWidth)} `)\n\n    const prefix = r.type === \"add\" ? \" + \" : r.type === \"remove\" ? \" - \" : \"   \"\n    const innerWidth = Math.max(0, contentWidth - stringWidth(prefix) - 1)\n\n    // Hard-wrap the content. Char-wrap (vs. word-wrap) keeps code\n    // diffs honest — splitting by word boundaries would shift columns\n    // mid-line and make alignment confusing.\n    const wrapped =\n      innerWidth > 0 && stringWidth(r.content) > innerWidth\n        ? splitAnsi(wrapAnsi(r.content, innerWidth, { mode: \"word\" }))\n        : [r.content]\n\n    const rowStyle = s.bg(styles[r.type])\n    for (let i = 0; i < wrapped.length; i++) {\n      const wline = wrapped[i]\n      const pw = Math.max(0, innerWidth - stringWidth(wline) + 1)\n      const bodyLine = (i === 0 ? prefix : \"   \") + wline + \" \".repeat(pw)\n      const styledBody = rowStyle?.(bodyLine) ?? bodyLine\n      out.push((i === 0 ? gutter : gutterStyle(blankGutter)) + styledBody)\n    }\n  }\n  return out\n}\n\nfunction pad(s: string, width: number): string {\n  return s.length >= width ? s : \" \".repeat(width - s.length) + s\n}\n\n/** Resolve a file path to a shiki language identifier. Falls back from\n *  extension to basename — shiki natively recognises `dockerfile`,\n *  `makefile`, `cmakelists.txt`, etc. */\nfunction langFromPath(path: string): string | undefined {\n  const ext = extname(path).slice(1).toLowerCase()\n  if (ext) return ext\n  const base = basename(path).toLowerCase()\n  return base || undefined\n}\n"],"mappings":"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"}

package/dist/widgets/divider.d.mts

@@ -0,0 +1,11 @@
+import { H as Text } from "../queries-DH3bj74K.mjs";
+import { f as Style } from "../types-B9Eh7k2v.mjs";
+//#region src/widgets/divider.d.ts
+type DividerState = Style & {
+  char?: string;
+  length?: number;
+};
+declare function divider(state?: DividerState): Text;
+//#endregion
+export { DividerState, divider };
+//# sourceMappingURL=divider.d.mts.map

package/dist/widgets/divider.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.d.mts","names":[],"sources":["../../src/widgets/divider.ts"],"mappings":";;;KAKY,eAAe;EACzB;EACA;;iBAGc,QAAQ,QAAO,eAAsC"}

package/dist/widgets/divider.mjs

@@ -0,0 +1,9 @@
+import { text } from "./text.mjs";
+//#region src/widgets/divider.ts
+function divider(state = { style: "divider" }) {
+	return text((ctx) => (state.char ?? "─").repeat(state.length ?? ctx.width), state);
+}
+//#endregion
+export { divider };
+
+//# sourceMappingURL=divider.mjs.map

package/dist/widgets/divider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.mjs","names":[],"sources":["../../src/widgets/divider.ts"],"sourcesContent":["import type { Style } from \"../style/types.ts\"\nimport type { Text } from \"./text.ts\"\n\nimport { text } from \"./text.ts\"\n\nexport type DividerState = Style & {\n  char?: string\n  length?: number\n}\n\nexport function divider(state: DividerState = { style: \"divider\" }): Text {\n  return text((ctx) => (state.char ?? \"─\").repeat(state.length ?? ctx.width), state)\n}\n"],"mappings":";;AAUA,SAAgB,QAAQ,QAAsB,EAAE,OAAO,UAAU,GAAS;CACxE,OAAO,MAAM,SAAS,MAAM,QAAQ,IAAA,CAAK,OAAO,MAAM,UAAU,IAAI,KAAK,GAAG,KAAK;AACnF"}

package/dist/widgets/image.d.mts

@@ -0,0 +1,37 @@
+import { J as Layout, P as RenderCtx, p as Node } from "../queries-DH3bj74K.mjs";
+//#region src/widgets/image.d.ts
+interface ImageState {
+  /**
+   * Path to an image file. PNG passes through with zero decoding; other
+   * formats (JPEG/WebP/GIF/AVIF/SVG) are read via image-meta for
+   * dimensions and — for KGP terminals — converted once to a cached
+   * temp PNG via sharp. iTerm2 accepts all formats natively.
+   */
+  src: string;
+  /** Display width in terminal cells. Defaults to `ctx.width`. */
+  width?: number;
+  /**
+   * Display height in terminal cells. When omitted, computed from the
+   * source aspect ratio + `cellAspect`.
+   */
+  height?: number;
+  /** Fallback text shown on terminals without an image protocol. */
+  alt?: string;
+  /**
+   * Character cell aspect ratio (cellHeight / cellWidth). Most terminals
+   * land around 2.0. Tweak if aspect-preserved images look stretched.
+   */
+  cellAspect?: number;
+}
+declare class Image extends Node<ImageState> {
+  #private;
+  constructor(state: ImageState);
+  get fallback(): string[];
+  layout(): Layout;
+  protected _render(ctx: RenderCtx): Promise<string[]>;
+}
+declare function image(src: string, style?: Omit<ImageState, "src">): Image;
+declare function image(state: ImageState): Image;
+//#endregion
+export { Image, ImageState, image };
+//# sourceMappingURL=image.d.mts.map

package/dist/widgets/image.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.d.mts","names":[],"sources":["../../src/widgets/image.ts"],"mappings":";;UAWiB;;;;;;;EAOf;;EAEA;;;;;EAKA;;EAEA;;;;;EAKA;;cAGW,cAAc,KAAK;;EAI9B,YAAY,OAAO;MAOf;EAIK,UAAU;YAIH,QAAQ,KAAK,YAAY;;iBAuC3B,MAAM,aAAa,QAAQ,KAAK,qBAAqB;iBACrD,MAAM,OAAO,aAAa"}

package/dist/widgets/image.mjs

@@ -0,0 +1,77 @@
+import { S as unwrap, w as useContext } from "../reactive-f7NpAi69.mjs";
+import { t as Node } from "../node-BZ7f6HzU.mjs";
+import { t as RenderContext } from "../render-DxVLqqB9.mjs";
+import { s as loadKittyGraphics } from "../kitty-JbCJC0iQ.mjs";
+import { fileDetect } from "@zaly/shared/detect";
+import { imageInfo } from "@zaly/shared/image";
+//#region src/widgets/image.ts
+var Image = class extends Node {
+	#delete;
+	#enabled;
+	constructor(state) {
+		super(state);
+		this.on("unmount", () => this.#delete?.());
+		const context = useContext(RenderContext);
+		this.#enabled = context?.images;
+	}
+	get fallback() {
+		return [this.state.alt ?? `[Image: ${this.state.src}]`];
+	}
+	layout() {
+		return {
+			minWidth: 50,
+			width: 100
+		};
+	}
+	async _render(ctx) {
+		if (unwrap(this.#enabled) === false) return this.fallback;
+		const queries = this.ctx?.input.queries;
+		const kitty = queries ? await loadKittyGraphics(queries) : void 0;
+		if (!kitty?.supported) return this.fallback;
+		const detected = await fileDetect(this.state.src);
+		if (detected?.type !== "image") return this.fallback;
+		const img = await imageInfo(detected);
+		const { cols, rows } = dims(this.state, img, Math.min(ctx.width, 80));
+		const t = await kitty.transmitOnce(img);
+		if (!t) return this.fallback;
+		const p = kitty.placement(t.imageId, {
+			cols,
+			rows
+		});
+		if (!p) return this.fallback;
+		this.#delete = () => p.placementId ? kitty.deletePlacement(t.imageId, p.placementId) : void 0;
+		if (t.transmit) {
+			ctx.transmit(t.transmit);
+			if (p.inline) ctx.transmit(p.seq);
+		}
+		if (p.inline) return p.data;
+		const ret = [...p.data];
+		if (!ret.length) return this.fallback;
+		ret[0] = p.seq + ret[0];
+		return ret;
+	}
+};
+function image(first, style) {
+	if (typeof first === "string") return new Image({
+		src: first,
+		...style
+	});
+	return new Image(first);
+}
+function dims(state, meta, available) {
+	const cellAspect = state.cellAspect ?? 2;
+	const aspect = meta.height / meta.width;
+	let cols = state.width;
+	let rows = state.height;
+	if (cols === void 0 && rows === void 0) cols = Math.max(1, available);
+	if (cols !== void 0 && rows === void 0) rows = Math.max(1, Math.round(cols * aspect / cellAspect));
+	else if (rows !== void 0 && cols === void 0) cols = Math.max(1, Math.round(rows * cellAspect / aspect));
+	return {
+		cols: cols ?? available,
+		rows: rows ?? 1
+	};
+}
+//#endregion
+export { Image, image };
+
+//# sourceMappingURL=image.mjs.map

package/dist/widgets/image.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.mjs","names":["#delete","#enabled"],"sources":["../../src/widgets/image.ts"],"sourcesContent":["import type { RenderCtx } from \"../core/ctx.ts\"\nimport type { Accessor } from \"../core/reactive.ts\"\nimport type { Layout } from \"../core/state.ts\"\n\nimport { fileDetect } from \"@zaly/shared/detect\"\nimport { imageInfo } from \"@zaly/shared/image\"\nimport { Node } from \"../core/node.ts\"\nimport { unwrap, useContext } from \"../core/reactive.ts\"\nimport { RenderContext } from \"../core/render.ts\"\nimport { loadKittyGraphics } from \"../image/kitty.ts\"\n\nexport interface ImageState {\n  /**\n   * Path to an image file. PNG passes through with zero decoding; other\n   * formats (JPEG/WebP/GIF/AVIF/SVG) are read via image-meta for\n   * dimensions and — for KGP terminals — converted once to a cached\n   * temp PNG via sharp. iTerm2 accepts all formats natively.\n   */\n  src: string\n  /** Display width in terminal cells. Defaults to `ctx.width`. */\n  width?: number\n  /**\n   * Display height in terminal cells. When omitted, computed from the\n   * source aspect ratio + `cellAspect`.\n   */\n  height?: number\n  /** Fallback text shown on terminals without an image protocol. */\n  alt?: string\n  /**\n   * Character cell aspect ratio (cellHeight / cellWidth). Most terminals\n   * land around 2.0. Tweak if aspect-preserved images look stretched.\n   */\n  cellAspect?: number\n}\n\nexport class Image extends Node<ImageState> {\n  #delete?: () => void\n  #enabled?: Accessor<boolean>\n\n  constructor(state: ImageState) {\n    super(state)\n    this.on(\"unmount\", () => this.#delete?.())\n    const context = useContext(RenderContext)\n    this.#enabled = context?.images\n  }\n\n  get fallback(): string[] {\n    return [this.state.alt ?? `[Image: ${this.state.src}]`]\n  }\n\n  override layout(): Layout {\n    return { minWidth: 50, width: 100 }\n  }\n\n  protected async _render(ctx: RenderCtx): Promise<string[]> {\n    if (unwrap(this.#enabled) === false) return this.fallback\n\n    const queries = this.ctx?.input.queries\n    const kitty = queries ? await loadKittyGraphics(queries) : undefined\n    if (!kitty?.supported) return this.fallback\n\n    const detected = await fileDetect(this.state.src)\n    if (detected?.type !== \"image\") return this.fallback\n    const img = await imageInfo(detected)\n\n    const { cols, rows } = dims(this.state, img, Math.min(ctx.width, 80))\n\n    const t = await kitty.transmitOnce(img)\n    if (!t) return this.fallback\n    const p = kitty.placement(t.imageId, { cols, rows })\n    if (!p) return this.fallback\n    this.#delete = () =>\n      p.placementId ? kitty.deletePlacement(t.imageId, p.placementId) : undefined\n    // Route the transmit bytes through the side-channel queue (mount\n    // ctx → terminal). Cached rows then hold pure placement ANSI,\n    // which is safe to reuse across repaints. If we're rendering\n    // before mount (rare — tests, headless previews), fall back to\n    // inlining the transmit into the lead so the picture still\n    // shows correctly the first time.\n    if (t.transmit) {\n      ctx.transmit(t.transmit)\n      if (p.inline) ctx.transmit(p.seq)\n    }\n\n    if (p.inline) return p.data\n\n    const ret = [...p.data]\n    if (!ret.length) return this.fallback\n    ret[0] = p.seq + ret[0]\n    return ret\n  }\n}\n\nexport function image(src: string, style?: Omit<ImageState, \"src\">): Image\nexport function image(state: ImageState): Image\nexport function image(first: string | ImageState, style?: Omit<ImageState, \"src\">): Image {\n  if (typeof first === \"string\") return new Image({ src: first, ...style })\n  return new Image(first)\n}\n\nfunction dims(\n  state: ImageState,\n  meta: { width: number; height: number },\n  available: number\n): { cols: number; rows: number } {\n  const cellAspect = state.cellAspect ?? 2\n  const aspect = meta.height / meta.width\n  let cols = state.width\n  let rows = state.height\n  if (cols === undefined && rows === undefined) cols = Math.max(1, available)\n  if (cols !== undefined && rows === undefined) {\n    rows = Math.max(1, Math.round((cols * aspect) / cellAspect))\n  } else if (rows !== undefined && cols === undefined) {\n    cols = Math.max(1, Math.round((rows * cellAspect) / aspect))\n  }\n  return { cols: cols ?? available, rows: rows ?? 1 }\n}\n"],"mappings":";;;;;;;AAmCA,IAAa,QAAb,cAA2B,KAAiB;CAC1C;CACA;CAEA,YAAY,OAAmB;EAC7B,MAAM,KAAK;EACX,KAAK,GAAG,iBAAiB,KAAKA,UAAU,CAAC;EACzC,MAAM,UAAU,WAAW,aAAa;EACxC,KAAKC,WAAW,SAAS;CAC3B;CAEA,IAAI,WAAqB;EACvB,OAAO,CAAC,KAAK,MAAM,OAAO,WAAW,KAAK,MAAM,IAAI,EAAE;CACxD;CAEA,SAA0B;EACxB,OAAO;GAAE,UAAU;GAAI,OAAO;EAAI;CACpC;CAEA,MAAgB,QAAQ,KAAmC;EACzD,IAAI,OAAO,KAAKA,QAAQ,MAAM,OAAO,OAAO,KAAK;EAEjD,MAAM,UAAU,KAAK,KAAK,MAAM;EAChC,MAAM,QAAQ,UAAU,MAAM,kBAAkB,OAAO,IAAI,KAAA;EAC3D,IAAI,CAAC,OAAO,WAAW,OAAO,KAAK;EAEnC,MAAM,WAAW,MAAM,WAAW,KAAK,MAAM,GAAG;EAChD,IAAI,UAAU,SAAS,SAAS,OAAO,KAAK;EAC5C,MAAM,MAAM,MAAM,UAAU,QAAQ;EAEpC,MAAM,EAAE,MAAM,SAAS,KAAK,KAAK,OAAO,KAAK,KAAK,IAAI,IAAI,OAAO,EAAE,CAAC;EAEpE,MAAM,IAAI,MAAM,MAAM,aAAa,GAAG;EACtC,IAAI,CAAC,GAAG,OAAO,KAAK;EACpB,MAAM,IAAI,MAAM,UAAU,EAAE,SAAS;GAAE;GAAM;EAAK,CAAC;EACnD,IAAI,CAAC,GAAG,OAAO,KAAK;EACpB,KAAKD,gBACH,EAAE,cAAc,MAAM,gBAAgB,EAAE,SAAS,EAAE,WAAW,IAAI,KAAA;EAOpE,IAAI,EAAE,UAAU;GACd,IAAI,SAAS,EAAE,QAAQ;GACvB,IAAI,EAAE,QAAQ,IAAI,SAAS,EAAE,GAAG;EAClC;EAEA,IAAI,EAAE,QAAQ,OAAO,EAAE;EAEvB,MAAM,MAAM,CAAC,GAAG,EAAE,IAAI;EACtB,IAAI,CAAC,IAAI,QAAQ,OAAO,KAAK;EAC7B,IAAI,KAAK,EAAE,MAAM,IAAI;EACrB,OAAO;CACT;AACF;AAIA,SAAgB,MAAM,OAA4B,OAAwC;CACxF,IAAI,OAAO,UAAU,UAAU,OAAO,IAAI,MAAM;EAAE,KAAK;EAAO,GAAG;CAAM,CAAC;CACxE,OAAO,IAAI,MAAM,KAAK;AACxB;AAEA,SAAS,KACP,OACA,MACA,WACgC;CAChC,MAAM,aAAa,MAAM,cAAc;CACvC,MAAM,SAAS,KAAK,SAAS,KAAK;CAClC,IAAI,OAAO,MAAM;CACjB,IAAI,OAAO,MAAM;CACjB,IAAI,SAAS,KAAA,KAAa,SAAS,KAAA,GAAW,OAAO,KAAK,IAAI,GAAG,SAAS;CAC1E,IAAI,SAAS,KAAA,KAAa,SAAS,KAAA,GACjC,OAAO,KAAK,IAAI,GAAG,KAAK,MAAO,OAAO,SAAU,UAAU,CAAC;MACtD,IAAI,SAAS,KAAA,KAAa,SAAS,KAAA,GACxC,OAAO,KAAK,IAAI,GAAG,KAAK,MAAO,OAAO,aAAc,MAAM,CAAC;CAE7D,OAAO;EAAE,MAAM,QAAQ;EAAW,MAAM,QAAQ;CAAE;AACpD"}

package/dist/widgets/input.d.mts

@@ -0,0 +1,2 @@
+import { a as InputValue, i as InputState, n as InputAttachment, o as input, r as InputEvents, t as Input } from "../input-B5Vy-iaa.mjs";
+export { Input, InputAttachment, InputEvents, InputState, InputValue, input };