feat(examples): add markdown-editor example

[shineetejol9]

Description

Adds a new markdown-editor example demonstrating a live Markdown editor built with TermUI.

The example uses MultilineTextInput for editing, Markdown for preview rendering, and Columns for a side-by-side layout. The preview updates in real time as the user types.

Related Issue

Closes #526

Which package(s)?

examples/markdown-editor
@termuijs/widgets
@termuijs/ui

Type of Change

• 🐛 Bug fix (type:bug)
• ✨ Feature (type:feature)
• 📝 Docs (type:docs)
• 🧪 Tests (type:testing)
• ♻️ Refactor (type:refactor)
• 🎨 Design / UX (type:design)
• ♿ Accessibility (type:accessibility)
• ⚡ Performance (type:performance)
• 🔧 DevOps / CI (type:devops)
• 🔒 Security (type:security)

Checklist

• ⭐ You starred the repo. The needs-star check blocks your merge otherwise.
• Tests pass locally: bun vitest run
• Build passes: bun run build
• Typecheck passes: bun run typecheck
• You read CONTRIBUTING.md.
• Your PR title follows type: short description.
• Widget state mutators call markDirty() (if your change affects rendering).
• No new any types without an inline comment explaining why.
• No unrelated refactors bundled into this PR.

GSSoC 2026 Participation

• You are a GSSoC 2026 contributor.
• Your GSSoC profile: https://gssoc.girlscript.org/profile/____

Screenshots / Recordings (UI changes)

na

Notes for the Reviewer

Added a new markdown editor example under examples/markdown-editor.
Demonstrates live Markdown preview using existing Markdown, MultilineTextInput, and Columns components.
No changes were made to core packages or widget implementations.

Summary by CodeRabbit

• New Features

  • Added a markdown editor example with a live markdown preview, integrated multiline text editor, fullscreen layout, and keyboard controls (exit via "q" or Ctrl+C; other keys routed to the editor).

• Chores

  • Added project config, scripts and dependencies, plus TypeScript configuration for the markdown editor example.

[coderabbitai]

Important

Review skipped

Review was skipped due to path filters

⛔ Files ignored due to path filters (1)

• bun.lock is excluded by !**/*.lock

CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including **/dist/** will override the default block on the dist directory, by removing the pattern from both the lists.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: f047b669-c1fe-4db2-a27f-4a919615bc94

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Adds a new example app under examples/markdown-editor with bun-based package.json, TypeScript config, a split two-pane UI (MultilineTextInput editor + live Markdown preview), keyboard exit handling (q/Ctrl+C), and an app entrypoint that mounts and exits with its returned code.

Changes

Markdown Editor Example

Layer / File(s)	Summary
Project configuration and build setup examples/markdown-editor/package.json, examples/markdown-editor/tsconfig.json	Creates a private ES module package manifest with bun start/dev scripts, workspace deps on @termuijs/*, and a tsconfig targeting ES2022 with jsx set to react-jsx and jsxImportSource @termuijs/jsx.
Editor widgets and layout examples/markdown-editor/src/index.tsx (lines 1–37)	Initializes a Markdown widget with sample content and a MultilineTextInput whose onChange updates the markdown; arranges both in a Columns layout and seeds the input value from the markdown content.
App initialization and lifecycle examples/markdown-editor/src/index.tsx (lines 38–55)	Instantiates App with fullscreen/title/FPS options, installs global key handling to exit on q/Ctrl+C, forwards other keys to the editor and requests renders, mounts the app asynchronously, and exits with the mount's returned code.

Sequence Diagram

sequenceDiagram
  participant User
  participant App as App Instance
  participant Editor as MultilineTextInput
  participant Preview as Markdown Widget

  User->>App: press key
  alt exit key (q or Ctrl+C)
    App->>App: exit process
  else text input
    App->>Editor: forward key event
    Editor->>Editor: update text content
    Editor->>Preview: onChange -> new markdown text
    Preview->>Preview: render updated preview
    App->>App: request render
  end

Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested labels

gssoc:approved, quality:clean, level:beginner

Suggested reviewers

• Karanjot786

Poem

🐰 In a meadow of terminals I play,
I type in left, the right displays my sway,
Live previews shimmer as I hop and write,
Press q and I tuck my ears for night,
A tiny rabbit cheers this editor's light.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'feat(examples): add markdown-editor example' clearly and concisely describes the main change—adding a new example application.
Description check	✅ Passed	The PR description covers all required template sections including objective, related issue, affected packages, type of change, and most checklist items with appropriate completeness.
Linked Issues check	✅ Passed	The code changes create required files (index.tsx, package.json, tsconfig.json) demonstrating a split-pane markdown editor with live preview using MultilineTextInput and Markdown widgets, meeting all requirements from issue #526.
Out of Scope Changes check	✅ Passed	All changes are confined to the examples/markdown-editor directory as required; no modifications to packages or other example directories are present.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@examples/markdown-editor/package.json`:
- Around line 6-9: The package.json scripts currently reference src/index.ts but
the project entry is src/index.tsx and there's no typecheck script or typescript
devDependency; update the "start" and "dev" script values to point to
"src/index.tsx" (the "start" and "dev" keys in package.json) and add a
"typecheck" script that runs the TypeScript compiler (e.g., tsc --noEmit) so bun
run typecheck succeeds, and add "typescript" to devDependencies so the
typechecker is available during CI/local runs.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: b1887cff-5091-4127-9c0c-e9e3bb68eb4f

📥 Commits

Reviewing files that changed from the base of the PR and between ea93ef4 and acce35a.

⛔ Files ignored due to path filters (1)

• bun.lock is excluded by !**/*.lock

📒 Files selected for processing (3)

• examples/markdown-editor/package.json
• examples/markdown-editor/src/index.tsx
• examples/markdown-editor/tsconfig.json