@bubblebrain-ai/bubble 0.0.12 → 0.0.14

package/dist/tui-opentui/file-mentions.js

@@ -0,0 +1,174 @@
+import { execFile } from "node:child_process";
+import { promises as fs } from "node:fs";
+import path from "node:path";
+import { promisify } from "node:util";
+const execFileAsync = promisify(execFile);
+const MAX_INLINE_BYTES = 200 * 1024;
+const IGNORED_DIRS = new Set([".git", "node_modules", "dist", "build", ".next", ".turbo", ".cache"]);
+const fileListCache = new Map();
+export function findAtContext(text, cursor) {
+    const before = text.slice(0, cursor);
+    const at = before.lastIndexOf("@");
+    if (at === -1)
+        return null;
+    const prev = at === 0 ? "" : before[at - 1];
+    if (prev !== "" && !/\s/.test(prev))
+        return null;
+    const query = before.slice(at + 1);
+    if (/\s/.test(query))
+        return null;
+    return { start: at, end: cursor, query };
+}
+export function filterFileSuggestions(files, query, limit = 20) {
+    const q = query.toLowerCase();
+    if (q.length === 0) {
+        return files.slice(0, limit).map((p) => ({ path: p, score: 1 }));
+    }
+    const scored = [];
+    for (const file of files) {
+        const lower = file.toLowerCase();
+        const base = path.basename(lower);
+        let score = 0;
+        if (base.startsWith(q))
+            score = 100;
+        else if (lower.startsWith(q))
+            score = 80;
+        else if (base.includes(q))
+            score = 60;
+        else if (lower.includes(q))
+            score = 40;
+        if (score > 0)
+            scored.push({ path: file, score });
+    }
+    scored.sort((a, b) => (b.score - a.score) || (a.path.length - b.path.length) || a.path.localeCompare(b.path));
+    return scored.slice(0, limit);
+}
+export async function listProjectFiles(cwd) {
+    const cached = fileListCache.get(cwd);
+    if (cached)
+        return cached;
+    const files = await discoverFiles(cwd);
+    fileListCache.set(cwd, files);
+    return files;
+}
+export function invalidateFileListCache(cwd) {
+    if (cwd)
+        fileListCache.delete(cwd);
+    else
+        fileListCache.clear();
+}
+async function discoverFiles(cwd) {
+    try {
+        const { stdout } = await execFileAsync("git", ["ls-files", "-co", "--exclude-standard"], {
+            cwd,
+            maxBuffer: 32 * 1024 * 1024,
+        });
+        const files = stdout.split("\n").map((s) => s.trim()).filter(Boolean);
+        if (files.length > 0)
+            return files;
+    }
+    catch {
+        // Not a git repo or git unavailable — fall through to filesystem walk.
+    }
+    return walkFilesystem(cwd);
+}
+async function walkFilesystem(root) {
+    const results = [];
+    async function visit(dir, rel) {
+        let entries;
+        try {
+            entries = (await fs.readdir(dir, { withFileTypes: true }));
+        }
+        catch {
+            return;
+        }
+        for (const entry of entries) {
+            if (entry.name.startsWith(".") && entry.name !== ".env" && entry.name !== ".gitignore")
+                continue;
+            if (IGNORED_DIRS.has(entry.name))
+                continue;
+            const abs = path.join(dir, entry.name);
+            const relPath = rel ? `${rel}/${entry.name}` : entry.name;
+            if (entry.isDirectory()) {
+                await visit(abs, relPath);
+            }
+            else if (entry.isFile()) {
+                results.push(relPath);
+            }
+        }
+    }
+    await visit(root, "");
+    return results;
+}
+const MENTION_REGEX = /(^|\s)@([^\s]+)/g;
+export async function expandAtMentions(text, cwd) {
+    const result = { text, expanded: [], missing: [], skipped: [] };
+    const mentions = Array.from(text.matchAll(MENTION_REGEX));
+    if (mentions.length === 0)
+        return result;
+    const blocks = [];
+    const seen = new Set();
+    for (const match of mentions) {
+        const token = match[2];
+        if (seen.has(token))
+            continue;
+        seen.add(token);
+        const abs = path.resolve(cwd, token);
+        if (!abs.startsWith(path.resolve(cwd))) {
+            result.skipped.push({ path: token, reason: "outside project" });
+            continue;
+        }
+        let stat;
+        try {
+            stat = await fs.stat(abs);
+        }
+        catch {
+            result.missing.push(token);
+            continue;
+        }
+        if (!stat.isFile()) {
+            result.skipped.push({ path: token, reason: "not a file" });
+            continue;
+        }
+        if (stat.size > MAX_INLINE_BYTES) {
+            result.skipped.push({ path: token, reason: "too large", bytes: stat.size });
+            blocks.push(`### @${token}\n(${formatBytes(stat.size)}, exceeds inline limit of ${formatBytes(MAX_INLINE_BYTES)} — use the Read tool to access)`);
+            continue;
+        }
+        let contents;
+        try {
+            contents = await fs.readFile(abs, "utf8");
+        }
+        catch (err) {
+            result.skipped.push({ path: token, reason: `read failed: ${err.message || String(err)}` });
+            continue;
+        }
+        result.expanded.push({ path: token, bytes: stat.size, truncated: false });
+        const lang = guessLanguage(token);
+        blocks.push(`### @${token}\n\`\`\`${lang}\n${contents}\n\`\`\``);
+    }
+    if (blocks.length === 0)
+        return result;
+    result.text = `${text}\n\n---\nReferenced files:\n\n${blocks.join("\n\n")}`;
+    return result;
+}
+function formatBytes(n) {
+    if (n < 1024)
+        return `${n}B`;
+    if (n < 1024 * 1024)
+        return `${(n / 1024).toFixed(1)}KB`;
+    return `${(n / 1024 / 1024).toFixed(1)}MB`;
+}
+function guessLanguage(filePath) {
+    const ext = path.extname(filePath).slice(1).toLowerCase();
+    const map = {
+        ts: "ts", tsx: "tsx", js: "js", jsx: "jsx",
+        py: "python", rb: "ruby", go: "go", rs: "rust",
+        java: "java", kt: "kotlin", swift: "swift",
+        c: "c", h: "c", cpp: "cpp", cc: "cpp", hpp: "cpp",
+        cs: "csharp", php: "php", sh: "bash", zsh: "bash", bash: "bash",
+        json: "json", yaml: "yaml", yml: "yaml", toml: "toml", xml: "xml",
+        html: "html", css: "css", scss: "scss", sql: "sql", md: "markdown",
+    };
+    return map[ext] ?? "";
+}

package/dist/tui-opentui/footer.d.ts

@@ -0,0 +1,26 @@
+/** @jsxImportSource @opentui/react */
+import React from "react";
+import type { PermissionMode } from "../types.js";
+export interface FooterUsageTotals {
+    prompt: number;
+    completion: number;
+}
+export interface FooterData {
+    cwd: string;
+    providerId: string;
+    model: string;
+    thinkingLevel: string;
+    showThinking: boolean;
+    mode?: PermissionMode;
+    usageTotals: FooterUsageTotals;
+    verboseTrace?: boolean;
+}
+/**
+ * Status row beneath the input composer. opencode-style: dim hints on the
+ * left, provider + model + tokens on the right, separated by `·` middots.
+ * No border, single row of muted text.
+ */
+export declare function FooterBar({ data }: {
+    data: FooterData;
+}): React.ReactNode;
+export declare function buildFooterData(input: FooterData): FooterData;

package/dist/tui-opentui/footer.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
+import { homedir } from "node:os";
+import { useTheme } from "./theme.js";
+import { PERMISSION_MODE_INFO } from "../permission/mode.js";
+/**
+ * Status row beneath the input composer. opencode-style: dim hints on the
+ * left, provider + model + tokens on the right, separated by `·` middots.
+ * No border, single row of muted text.
+ */
+export function FooterBar({ data }) {
+    const theme = useTheme();
+    const usageText = data.usageTotals.prompt || data.usageTotals.completion
+        ? `↑${formatTokens(data.usageTotals.prompt)} ↓${formatTokens(data.usageTotals.completion)}`
+        : "";
+    const thinkingText = data.showThinking
+        ? data.thinkingLevel && data.thinkingLevel !== "off"
+            ? `⌃R ${data.thinkingLevel}`
+            : "⌃R off"
+        : "";
+    return (_jsx("box", { style: { flexDirection: "column", flexShrink: 0, marginTop: 1 }, children: _jsxs("box", { style: { paddingLeft: 2, paddingRight: 2, flexDirection: "row" }, children: [_jsx("text", { fg: theme.textMuted, content: formatCwd(data.cwd) }), _jsx("text", { fg: theme.textDim, content: "  \u00B7  " }), _jsx("text", { fg: theme.accent, content: data.mode ? PERMISSION_MODE_INFO[data.mode]?.shortTitle ?? "default" : "default" }), data.mode && data.mode !== "default" && (_jsx("text", { fg: theme.textDim, content: " \u21E7\u21E5" })), usageText && (_jsxs(_Fragment, { children: [_jsx("text", { fg: theme.textDim, content: "  \u00B7  " }), _jsx("text", { fg: theme.textMuted, content: usageText })] })), _jsx("box", { style: { flexGrow: 1 } }), _jsx("text", { fg: theme.textDim, content: data.providerId }), _jsx("text", { fg: theme.textDim, content: "  \u00B7  " }), _jsx("text", { fg: theme.text, attributes: 1, content: data.model }), thinkingText && (_jsxs(_Fragment, { children: [_jsx("text", { fg: theme.textDim, content: "  \u00B7  " }), _jsx("text", { fg: theme.textMuted, content: thinkingText })] }))] }) }));
+}
+export function buildFooterData(input) {
+    return input;
+}
+function formatTokens(count) {
+    if (count < 1000)
+        return String(count);
+    if (count < 10000)
+        return `${(count / 1000).toFixed(1)}k`;
+    if (count < 1000000)
+        return `${Math.round(count / 1000)}k`;
+    return `${(count / 1000000).toFixed(1)}M`;
+}
+function formatCwd(cwd) {
+    const home = homedir();
+    if (cwd.startsWith(home)) {
+        return `~${cwd.slice(home.length)}`;
+    }
+    return cwd;
+}

package/dist/tui-opentui/image-paste.d.ts

@@ -0,0 +1,54 @@
+/**
+ * Image paste utilities: path detection, file reading, clipboard access, and size-capping.
+ *
+ * Terminals don't forward image bytes to stdin. Paths arrive as text when users
+ * drag files in; Cmd+V of an image produces an empty paste (we probe the
+ * clipboard). macOS screenshot shortcut (Cmd+Shift+Ctrl+4) writes to both a
+ * TemporaryItems path and the clipboard — the path often gets cleaned up before
+ * we can read it, so we fall back to the clipboard.
+ */
+export interface ImageAttachment {
+    base64: string;
+    mediaType: string;
+    /** Raw byte size of the decoded image (not base64). */
+    bytes: number;
+    /** data:<mediaType>;base64,<...> — ready to send as image_url.url. */
+    dataUrl: string;
+    filename?: string;
+    sourcePath?: string;
+}
+export declare function isImageFilePath(raw: string): boolean;
+/**
+ * Split a pasted blob into candidate path tokens.
+ *
+ * Multi-drag from Finder delivers a mix of newline- and space-separated
+ * absolute paths. Spaces inside a single path are escaped (`\ `) — we split
+ * only on a space that is followed by the start of a new absolute path.
+ */
+export declare function splitPastedPaths(pasted: string): string[];
+export declare function readImageFromPath(rawPath: string): Promise<ImageAttachment | null>;
+/** macOS screenshot shortcut writes to these paths and they may be auto-cleaned. */
+export declare function isScreenshotTempPath(s: string): boolean;
+export declare function getImageFromClipboard(): Promise<ImageAttachment | null>;
+/**
+ * If the image is close to the API size cap, try to downscale it in place.
+ * Uses the OS-native tools that are typically available:
+ *   - macOS: `sips` (always present)
+ *   - linux: ImageMagick `convert` (if installed)
+ * Returns the original attachment if resize isn't needed or can't run.
+ */
+export declare function maybeResizeImage(att: ImageAttachment): Promise<ImageAttachment>;
+export interface ValidationResult {
+    ok: boolean;
+    reason?: string;
+}
+export declare function validateImageSize(att: ImageAttachment): ValidationResult;
+/** End-to-end: given a file path, read -> resize-if-needed -> validate. */
+export declare function ingestImagePath(p: string): Promise<{
+    attachment?: ImageAttachment;
+    error?: string;
+}>;
+export declare function ingestClipboardImage(): Promise<{
+    attachment?: ImageAttachment;
+    error?: string;
+}>;

package/dist/tui-opentui/image-paste.js

@@ -0,0 +1,288 @@
+/**
+ * Image paste utilities: path detection, file reading, clipboard access, and size-capping.
+ *
+ * Terminals don't forward image bytes to stdin. Paths arrive as text when users
+ * drag files in; Cmd+V of an image produces an empty paste (we probe the
+ * clipboard). macOS screenshot shortcut (Cmd+Shift+Ctrl+4) writes to both a
+ * TemporaryItems path and the clipboard — the path often gets cleaned up before
+ * we can read it, so we fall back to the clipboard.
+ */
+import { execFile } from "node:child_process";
+import fs from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { promisify } from "node:util";
+const execFileAsync = promisify(execFile);
+const IMAGE_EXT = /\.(png|jpe?g|gif|webp|bmp)$/i;
+// Anthropic/OpenAI image uploads cap at ~5MB base64. We target a bit below so
+// the base64 inflation (4/3) doesn't push us over.
+const MAX_BASE64_BYTES = 5 * 1024 * 1024;
+const RESIZE_TRIGGER_BYTES = Math.floor(MAX_BASE64_BYTES * 0.95);
+// Target max dimension for auto-resize.
+const RESIZE_MAX_DIM = 2048;
+export function isImageFilePath(raw) {
+    const s = raw.trim();
+    if (!s)
+        return false;
+    if (!IMAGE_EXT.test(s))
+        return false;
+    // Require an absolute or home-relative path. Pasted arbitrary text shouldn't
+    // be treated as a path.
+    return path.isAbsolute(s) || s.startsWith("~") || /^[A-Za-z]:\\/.test(s);
+}
+/**
+ * Split a pasted blob into candidate path tokens.
+ *
+ * Multi-drag from Finder delivers a mix of newline- and space-separated
+ * absolute paths. Spaces inside a single path are escaped (`\ `) — we split
+ * only on a space that is followed by the start of a new absolute path.
+ */
+export function splitPastedPaths(pasted) {
+    const out = [];
+    for (const line of pasted.split(/\r?\n/)) {
+        for (const piece of line.split(/ (?=\/|[A-Za-z]:\\)/)) {
+            const t = piece.trim();
+            if (t)
+                out.push(t);
+        }
+    }
+    return out;
+}
+function mediaTypeFromExt(p) {
+    const ext = path.extname(p).toLowerCase();
+    if (ext === ".jpg" || ext === ".jpeg")
+        return "image/jpeg";
+    if (ext === ".gif")
+        return "image/gif";
+    if (ext === ".webp")
+        return "image/webp";
+    if (ext === ".bmp")
+        return "image/bmp";
+    return "image/png";
+}
+function resolveHome(p) {
+    if (p.startsWith("~/") || p === "~") {
+        return path.join(os.homedir(), p.slice(1));
+    }
+    return p;
+}
+function unescapeShell(p) {
+    return p.replace(/\\ /g, " ");
+}
+function attachmentFromBuffer(buffer, mediaType, meta = {}) {
+    const base64 = buffer.toString("base64");
+    return {
+        base64,
+        mediaType,
+        bytes: buffer.length,
+        dataUrl: `data:${mediaType};base64,${base64}`,
+        filename: meta.filename,
+        sourcePath: meta.sourcePath,
+    };
+}
+export async function readImageFromPath(rawPath) {
+    const resolved = resolveHome(unescapeShell(rawPath.trim()));
+    try {
+        const stat = await fs.stat(resolved);
+        if (!stat.isFile())
+            return null;
+        const buffer = await fs.readFile(resolved);
+        return attachmentFromBuffer(buffer, mediaTypeFromExt(resolved), {
+            filename: path.basename(resolved),
+            sourcePath: resolved,
+        });
+    }
+    catch {
+        return null;
+    }
+}
+/** macOS screenshot shortcut writes to these paths and they may be auto-cleaned. */
+export function isScreenshotTempPath(s) {
+    return /\/TemporaryItems\/.*screencaptureui.*\/Screenshot/i.test(s);
+}
+export async function getImageFromClipboard() {
+    switch (process.platform) {
+        case "darwin":
+            return getClipboardImageDarwin();
+        case "linux":
+            return getClipboardImageLinux();
+        case "win32":
+            return getClipboardImageWindows();
+        default:
+            return null;
+    }
+}
+async function getClipboardImageDarwin() {
+    // Probe first — `as «class PNGf»` throws if clipboard has no image.
+    try {
+        await execFileAsync("osascript", ["-e", "the clipboard as «class PNGf»"], {
+            timeout: 5000,
+        });
+    }
+    catch {
+        return null;
+    }
+    const tmp = path.join(os.tmpdir(), `bubble_clip_${Date.now()}_${process.pid}.png`);
+    const script = `set png_data to (the clipboard as «class PNGf»)\n` +
+        `set fp to open for access POSIX file "${tmp}" with write permission\n` +
+        `write png_data to fp\n` +
+        `close access fp`;
+    try {
+        await execFileAsync("osascript", ["-e", script], { timeout: 5000 });
+        const buf = await fs.readFile(tmp);
+        return attachmentFromBuffer(buf, "image/png");
+    }
+    catch {
+        return null;
+    }
+    finally {
+        await fs.unlink(tmp).catch(() => undefined);
+    }
+}
+async function getClipboardImageLinux() {
+    const candidates = [
+        ["xclip", ["-selection", "clipboard", "-t", "image/png", "-o"]],
+        ["wl-paste", ["--type", "image/png"]],
+    ];
+    for (const [cmd, args] of candidates) {
+        try {
+            // encoding: "buffer" makes stdout a Buffer instead of a string so PNG
+            // bytes survive without UTF-8 mangling.
+            const result = await execFileAsync(cmd, args, {
+                timeout: 5000,
+                encoding: "buffer",
+            });
+            const buf = result.stdout;
+            if (buf && buf.length > 0) {
+                return attachmentFromBuffer(buf, "image/png");
+            }
+        }
+        catch {
+            continue;
+        }
+    }
+    return null;
+}
+async function getClipboardImageWindows() {
+    const tmp = path.join(os.tmpdir(), `bubble_clip_${Date.now()}_${process.pid}.png`);
+    const tmpPs = tmp.replace(/\\/g, "\\\\");
+    const script = `Add-Type -AssemblyName System.Drawing; ` +
+        `$img = Get-Clipboard -Format Image; ` +
+        `if ($img) { $img.Save('${tmpPs}', [System.Drawing.Imaging.ImageFormat]::Png); Write-Output 'OK' } ` +
+        `else { Write-Output 'NONE' }`;
+    try {
+        const result = await execFileAsync("powershell", ["-NoProfile", "-Command", script], { timeout: 5000 });
+        if (!String(result.stdout).includes("OK"))
+            return null;
+        const buf = await fs.readFile(tmp);
+        return attachmentFromBuffer(buf, "image/png");
+    }
+    catch {
+        return null;
+    }
+    finally {
+        await fs.unlink(tmp).catch(() => undefined);
+    }
+}
+async function which(cmd) {
+    try {
+        await execFileAsync(process.platform === "win32" ? "where" : "which", [cmd], {
+            timeout: 1500,
+        });
+        return true;
+    }
+    catch {
+        return false;
+    }
+}
+/**
+ * If the image is close to the API size cap, try to downscale it in place.
+ * Uses the OS-native tools that are typically available:
+ *   - macOS: `sips` (always present)
+ *   - linux: ImageMagick `convert` (if installed)
+ * Returns the original attachment if resize isn't needed or can't run.
+ */
+export async function maybeResizeImage(att) {
+    if (att.base64.length < RESIZE_TRIGGER_BYTES)
+        return att;
+    const tmpDir = os.tmpdir();
+    const stamp = `${Date.now()}_${process.pid}`;
+    const inExt = path.extname(att.filename ?? att.sourcePath ?? `.png`).toLowerCase() || ".png";
+    const tmpIn = path.join(tmpDir, `bubble_img_in_${stamp}${inExt}`);
+    const tmpOut = path.join(tmpDir, `bubble_img_out_${stamp}.jpg`);
+    try {
+        await fs.writeFile(tmpIn, Buffer.from(att.base64, "base64"));
+        let ok = false;
+        if (process.platform === "darwin") {
+            try {
+                await execFileAsync("sips", ["-Z", String(RESIZE_MAX_DIM), "-s", "format", "jpeg", "-s", "formatOptions", "80", tmpIn, "--out", tmpOut], { timeout: 10000 });
+                ok = true;
+            }
+            catch {
+                ok = false;
+            }
+        }
+        else if (await which("convert")) {
+            try {
+                await execFileAsync("convert", [tmpIn, "-resize", `${RESIZE_MAX_DIM}x${RESIZE_MAX_DIM}>`, "-quality", "80", tmpOut], { timeout: 10000 });
+                ok = true;
+            }
+            catch {
+                ok = false;
+            }
+        }
+        if (!ok)
+            return att;
+        const resized = await fs.readFile(tmpOut);
+        if (resized.length >= att.bytes)
+            return att;
+        return attachmentFromBuffer(resized, "image/jpeg", {
+            filename: att.filename,
+            sourcePath: att.sourcePath,
+        });
+    }
+    catch {
+        return att;
+    }
+    finally {
+        await fs.unlink(tmpIn).catch(() => undefined);
+        await fs.unlink(tmpOut).catch(() => undefined);
+    }
+}
+export function validateImageSize(att) {
+    if (att.base64.length > MAX_BASE64_BYTES) {
+        const kb = Math.round(att.base64.length / 1024);
+        const max = Math.round(MAX_BASE64_BYTES / 1024);
+        const hint = process.platform === "darwin"
+            ? " (install/confirm `sips` on PATH to auto-resize)"
+            : process.platform === "linux"
+                ? " (install ImageMagick `convert` to auto-resize)"
+                : "";
+        return {
+            ok: false,
+            reason: `image base64 is ${kb}KB, exceeds ${max}KB API cap${hint}`,
+        };
+    }
+    return { ok: true };
+}
+/** End-to-end: given a file path, read -> resize-if-needed -> validate. */
+export async function ingestImagePath(p) {
+    const raw = await readImageFromPath(p);
+    if (!raw)
+        return { error: `cannot read image at ${p}` };
+    const sized = await maybeResizeImage(raw);
+    const validation = validateImageSize(sized);
+    if (!validation.ok)
+        return { error: validation.reason };
+    return { attachment: sized };
+}
+export async function ingestClipboardImage() {
+    const raw = await getImageFromClipboard();
+    if (!raw)
+        return { error: "clipboard has no image" };
+    const sized = await maybeResizeImage(raw);
+    const validation = validateImageSize(sized);
+    if (!validation.ok)
+        return { error: validation.reason };
+    return { attachment: sized };
+}

package/dist/tui-opentui/input-box.d.ts

@@ -0,0 +1,34 @@
+/** @jsxImportSource @opentui/react */
+/**
+ * Composer input for the OpenTUI TUI. Manages a multi-line editable buffer,
+ * cursor, history, file mention autocomplete, slash-command autocomplete,
+ * and text + image paste. Simpler than the Ink version because OpenTUI
+ * handles paste and selection at the native layer.
+ */
+import React from "react";
+import type { SkillRegistry } from "../skills/registry.js";
+import { type ImageAttachment } from "./image-paste.js";
+export interface SubmitPayload {
+    text: string;
+    displayText?: string;
+    images: ImageAttachment[];
+}
+interface InputBoxProps {
+    onSubmit: (payload: SubmitPayload) => void;
+    onPasteNotice?: (notice: string) => void;
+    disabled?: boolean;
+    cursorResetEpoch?: number;
+    draftText?: string;
+    draftEpoch?: number;
+    onDraftApplied?: () => void;
+    skillRegistry?: SkillRegistry;
+    terminalColumns: number;
+    cwd: string;
+}
+export declare function shouldCollapsePastedContent(text: string): boolean;
+export declare function createPastedContentMarker(content: string): string;
+export declare function isCtrlCInput(input: string, key: {
+    ctrl?: boolean;
+}): boolean;
+export declare function InputBox({ onSubmit, onPasteNotice, disabled, cursorResetEpoch, draftText, draftEpoch, onDraftApplied, skillRegistry, terminalColumns, cwd, }: InputBoxProps): React.ReactNode;
+export {};