asciitorium/dist/demo.js

an ASCII ui framework for web + cli

import { jsx as _jsx, jsxs as _jsxs } from "@jsx/jsx-runtime";
import { AsciiArt } from './components/AsciiArt';
import { Box } from './components/Box';
import { PerfMonitor } from './components/PerfMonitor';
import { Text } from './components/Text';
import { HorizontalLine } from './components/HorizontalLine';
import { App } from './core/App';
import { State } from './core/State';
import { loadAsciiAsset } from './core/utils';
import { TextInput } from './components/TextInput';
const appWidth = 64;
const appHeight = 30;
const helloWorld = new State('Hello, World!');
// Load the title ASCII art
const titleArt = await loadAsciiAsset('./art/asciitorium.txt');
// Construct the app
const app = (_jsxs(App, { width: appWidth, height: appHeight, border: true, children: [_jsx(AsciiArt, { content: titleArt, align: "center", label: "Asciitorium" }), _jsx(HorizontalLine, { length: 48, align: "center" }), _jsx(Text, { value: "a ui framework for cli and web", align: "top", gap: 3 }), _jsxs(Box, { align: "center", layout: "horizontal", gap: 3, children: [_jsx(Text, { value: "Text Input:", align: "center" }), _jsx(TextInput, { width: 30, value: helloWorld })] }), _jsx(Text, { value: helloWorld, width: appWidth - 24, align: "center", gap: 3 }), _jsx(PerfMonitor, { align: "center", time: true, memory: true, fps: true, cpu: true })] }));
await app.start();