SikongJueluo/cc-utils
1
0
Fork 0
mirror of https://github.com/SikongJueluo/cc-utils.git synced 2026-05-01 19:35:31 +08:00
Code Issues Packages Projects Releases Wiki Activity

move package and add tab component for tui famework

Browse Source
This commit is contained in:
SikongJueluo
2025-10-10 19:59:22 +08:00
parent a176433c4f
commit 61baedb606
14 changed files with 553 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/tuiExample/main.ts
View File

@@ -7,6 +7,7 @@ import {
TextLabel,
InputField,
OptionSelector,
TabWidget,
} from "../lib/ccTUI";
// Create the main application
@@ -17,6 +18,7 @@ const [termWidth, _termHeight] = term.getSize();
// Create UI components
const title = new TextLabel(
"LabelTitle",
Math.floor(termWidth / 2) - 10,
2,
"CC TUI Framework Demo",
@@ -24,16 +26,27 @@ const title = new TextLabel(
colors.black,
);
const label1 = new TextLabel(5, 5, "Enter your name:");
const label1 = new TextLabel("Label1", 5, 5, "Enter your name:");
const inputField = new InputField(5, 6, 30, "", "Type here...");
const inputField = new InputField("LabelInput", 5, 6, 30, "", "Type here...");
const optionLabel = new TextLabel(5, 8, "Select an option:");
const optionLabel = new TextLabel("LableOption", 5, 8, "Select an option:");
const options = ["Option 1", "Option 2", "Option 3", "Option 4"];
const optionSelector = new OptionSelector(5, 9, options, "Choose:", 0);
const optionSelector = new OptionSelector(
"OptionSelector",
5,
9,
options,
"Choose:",
0,
);
const statusLabel = new TextLabel(5, 11, "Status: Ready");
const statusLabel = new TextLabel("LableStatus", 5, 11, "Status: Ready");
// Create tab widget with sample tabs - using longer tab names for testing
const tabNames = ["Home", "Settings", "User Profile", "Messages", "About Us", "Documentation", "Advanced Settings", "Account Management"];
const tabWidget = new TabWidget("TabWidget", 5, 3, 50, tabNames, 0);
// Add components to the application
app.addComponent(title);
@@ -42,9 +55,10 @@ app.addComponent(inputField);
app.addComponent(optionLabel);
app.addComponent(optionSelector);
app.addComponent(statusLabel);
app.addComponent(tabWidget);
// Set focus to the input field initially
app.getWindow().setFocusFor(optionSelector);
app.getWindow().setFocusFor(tabWidget);
// Connect events
optionSelector.onSelectionChanged.connect((data) => {
@@ -61,6 +75,12 @@ inputField.onTextChanged.connect((value) => {
}
});
tabWidget.onTabChanged.connect((data) => {
statusLabel.setText(
`Status: Tab changed to ${data?.name} (index: ${data?.index})`,
);
});
// Run the application
try {
print("Starting CC TUI Demo. Press Ctrl+T to quit.");