termcast 1.3.46 → 1.3.48

package/src/examples/list-spacing-mode.vitest.tsx

@@ -0,0 +1,158 @@
+/**
+ * E2E tests for List spacingMode prop.
+ *
+ * Tests both 'default' (single-line) and 'relaxed' (two-line) modes
+ * to verify layout differences and subtitle alignment.
+ */
+
+import { test, expect, afterEach, beforeEach, describe } from 'vitest'
+import { launchTerminal, Session } from 'tuistory/src'
+
+describe('spacingMode default', () => {
+  let session: Session
+
+  beforeEach(async () => {
+    session = await launchTerminal({
+      command: 'bun',
+      args: ['src/examples/list-spacing-default.tsx'],
+      cols: 70,
+      rows: 20,
+    })
+  })
+
+  afterEach(() => {
+    session?.close()
+  })
+
+  test('renders single-line items with title and subtitle on same row', async () => {
+    await session.text({
+      waitFor: (text) => /Default Mode/i.test(text),
+    })
+
+    const text = await session.text()
+    expect(text).toMatchInlineSnapshot(`
+      "
+
+
+         Default Mode ───────────────────────────────────────────────────
+
+         > Search...
+
+         With Icons
+        ›▯ Report Q4 financial summary                            [Draft]
+         ⟨⟩ API Docs REST endpoints guide                            v2.1
+
+         Without Icons
+         Meeting Notes Weekly standup points                  [Important]
+
+         No Subtitle
+         ★ Favorites
+
+
+         ↑↓ navigate   ^k actions
+
+      "
+    `)
+
+    // Title and subtitle on same line
+    expect(text).toContain('Report')
+    expect(text).toContain('Q4 financial')
+  }, 10000)
+})
+
+describe('spacingMode relaxed', () => {
+  let session: Session
+
+  beforeEach(async () => {
+    session = await launchTerminal({
+      command: 'bun',
+      args: ['src/examples/list-spacing-relaxed.tsx'],
+      cols: 70,
+      rows: 25,
+    })
+  })
+
+  afterEach(() => {
+    session?.close()
+  })
+
+  test('renders two-line items with subtitle below title', async () => {
+    await session.text({
+      waitFor: (text) => /Relaxed Mode/i.test(text),
+    })
+
+    const text = await session.text()
+    expect(text).toMatchInlineSnapshot(`
+      "
+
+
+         Relaxed Mode ───────────────────────────────────────────────────
+
+         > Search...
+
+         With Icons
+        ›▯ Report                                                 [Draft]
+           Q4 financial summary
+
+         ⟨⟩ API Docs                                                 v2.1
+           REST endpoints guide
+
+
+         Without Icons
+         Meeting Notes                                        [Important]
+         Weekly standup points
+
+
+         No Subtitle
+
+
+         ↑↓ navigate   ^k actions
+
+      "
+    `)
+
+    // Should have content
+    expect(text).toContain('Report')
+    expect(text).toContain('Q4 financial')
+  }, 10000)
+
+  test('navigates through relaxed items', async () => {
+    await session.text({
+      waitFor: (text) => /Relaxed Mode/i.test(text),
+    })
+
+    await session.press('down')
+    const afterDown = await session.text()
+    expect(afterDown).toMatchInlineSnapshot(`
+      "
+
+
+         Relaxed Mode ───────────────────────────────────────────────────
+
+         > Search...
+
+         With Icons
+         ▯ Report                                                 [Draft]
+           Q4 financial summary
+
+        ›⟨⟩ API Docs                                                 v2.1
+           REST endpoints guide
+
+
+         Without Icons
+         Meeting Notes                                        [Important]
+         Weekly standup points
+
+
+         No Subtitle
+
+
+         ↑↓ navigate   ^k actions
+
+      "
+    `)
+
+    // Second item should be selected
+    expect(afterDown).toContain('API Docs')
+  }, 10000)
+})

package/src/examples/list-spacing-relaxed.tsx

@@ -0,0 +1,38 @@
+/**
+ * Test file for List with spacingMode="relaxed" (two-line items)
+ */
+
+import { List, Icon, Color, renderWithProviders } from 'termcast'
+
+function ListSpacingRelaxed() {
+  return (
+    <List navigationTitle="Relaxed Mode" spacingMode="relaxed">
+      <List.Section title="With Icons">
+        <List.Item
+          icon={Icon.Document}
+          title="Report"
+          subtitle="Q4 financial summary"
+          accessories={[{ tag: { value: 'Draft', color: Color.Yellow } }]}
+        />
+        <List.Item
+          icon={Icon.Code}
+          title="API Docs"
+          subtitle="REST endpoints guide"
+          accessories={[{ text: 'v2.1' }]}
+        />
+      </List.Section>
+      <List.Section title="Without Icons">
+        <List.Item
+          title="Meeting Notes"
+          subtitle="Weekly standup points"
+          accessories={[{ tag: 'Important' }]}
+        />
+      </List.Section>
+      <List.Section title="No Subtitle">
+        <List.Item icon={Icon.Star} title="Favorites" />
+      </List.Section>
+    </List>
+  )
+}
+
+await renderWithProviders(<ListSpacingRelaxed />)

package/src/examples/list-with-detail.vitest.tsx

@@ -8,7 +8,7 @@ beforeEach(async () => {
     command: 'bun',
     args: ['src/examples/list-with-detail.tsx'],
     cols: 80,
-    rows: 30,
+    rows: 33,
   })
 })
 
@@ -51,14 +51,17 @@ test('list with detail view display and navigation', async () => {
                                             │ - Height: 0.7m
                                             │ - Weight: 6.9kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Chlorophyll
                                             │ - Overgrow
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Grass                             ▼
 
     "
   `)
@@ -90,14 +93,17 @@ test('list with detail view display and navigation', async () => {
                                             │ - Height: 1m
                                             │ - Weight: 13kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Chlorophyll
                                             │ - Overgrow
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Grass                             ▼
 
     "
   `)
@@ -127,14 +133,17 @@ test('list with detail view display and navigation', async () => {
                                             │ - Height: 0.6m
                                             │ - Weight: 8.5kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Blaze
                                             │ - Solar Power
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Fire                              ▼
 
     "
   `)
@@ -170,11 +179,14 @@ test('list with detail view display and navigation', async () => {
       │   See Console Logs                                                       │
       │                                                                          │
       │                                                                          │
+      │                                                                          │
+      │                                                                          │
+      │                                                                          │
       │   ↵ select   ↑↓ navigate                                                 │
       │                                                                          │
       ╰──────────────────────────────────────────────────────────────────────────╯
-                                            │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Fire                              ▼
 
     "
   `)
@@ -217,6 +229,9 @@ test('list with detail view display and navigation', async () => {
 
 
 
+
+
+
     "
   `)
 
@@ -250,14 +265,17 @@ test('list with detail view display and navigation', async () => {
                                             │ - Height: 0.6m
                                             │ - Weight: 8.5kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Blaze
                                             │ - Solar Power
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Fire                              ▼
 
     "
   `)
@@ -299,14 +317,17 @@ test('list detail view search functionality', async () => {
                                             │ - Height: 0.6m
                                             │ - Weight: 8.5kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Blaze
                                             │ - Solar Power
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Fire                              ▼
 
     "
   `)
@@ -332,27 +353,30 @@ test('list detail view search functionality', async () => {
        > water
 
 
-                                            │ bulbasaur                         ▲
-                  No items found            │                                   ▀
+                                            │ wartortle                         ▲
+                  No items found            │                                   █
                                             │ Illustration
                                             │
                                             │ Types
                                             │
-                                            │ Grass / Poison
+                                            │ Water
                                             │
                                             │ Characteristics
                                             │
-                                            │ - Height: 0.7m
-                                            │ - Weight: 6.9kg
+                                            │ - Height: 1m
+                                            │ - Weight: 22.5kg
+                                            │
                                             │
                                             │ Abilities
                                             │
-                                            │ - Chlorophyll
-                                            │ - Overgrow
+                                            │ - Torrent
+                                            │ - Rain Dish
+                                            │
                                             │
                                             │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Water                             ▼
 
     "
   `)
@@ -369,27 +393,30 @@ test('list detail view search functionality', async () => {
        > water
 
 
-                                            │ bulbasaur                         ▲
-                  No items found            │                                   ▀
+                                            │ wartortle                         ▲
+                  No items found            │                                   █
                                             │ Illustration
                                             │
                                             │ Types
                                             │
-                                            │ Grass / Poison
+                                            │ Water
                                             │
                                             │ Characteristics
                                             │
-                                            │ - Height: 0.7m
-                                            │ - Weight: 6.9kg
+                                            │ - Height: 1m
+                                            │ - Weight: 22.5kg
+                                            │
                                             │
                                             │ Abilities
                                             │
-                                            │ - Chlorophyll
-                                            │ - Overgrow
+                                            │ - Torrent
+                                            │ - Rain Dish
+                                            │
                                             │
                                             │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Water                             ▼
 
     "
   `)
@@ -431,14 +458,17 @@ test('list detail metadata rendering', async () => {
                                             │ - Height: 0.7m
                                             │ - Weight: 6.9kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Chlorophyll
                                             │ - Overgrow
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Grass                             ▼
 
     "
   `)
@@ -475,14 +505,17 @@ test('list detail metadata rendering', async () => {
                                             │ - Height: 0.5m
                                             │ - Weight: 9kg
                                             │
+                                            │
                                             │ Abilities
                                             │
                                             │ - Torrent
                                             │ - Rain Dish
                                             │
                                             │
+                                            │
                                             │ Types
-       ↵ toggle detail   ↑↓ navigate   ^k a │                                   ▼
+                                            │
+       ↵ toggle detail   ↑↓ navigate   ^k a │ Water                             ▼
 
     "
   `)
@@ -502,7 +535,8 @@ test('list with detail layout consistency - short vs long detail content', async
     waitFor: (text) => {
       return (
         text.includes('›Short Detail') &&
-        text.includes('Brief content')
+        text.includes('Brief content') &&
+        text.includes('↑↓ navigate')
       )
     },
   })
@@ -514,7 +548,8 @@ test('list with detail layout consistency - short vs long detail content', async
     waitFor: (text) => {
       return (
         text.includes('›Long Detail') &&
-        text.includes('extensive')
+        text.includes('extensive') &&
+        text.includes('↑↓ navigate')
       )
     },
   })

package/src/examples/list-with-sections.vitest.tsx

@@ -320,8 +320,8 @@ test('list with sections search functionality', async () => {
       - Perfect for sandwiches or toast
 
 
-      esc go back
 
+      esc go back
 
     "
   `)
@@ -440,8 +440,6 @@ test('list actions panel with ctrl+k', async () => {
     "
 
 
-       Simple List Example ────────────────────────────────────────────
-
       ╭────────────────────────────────────────────────────────────────╮
       │                                                                │
       │   Actions                                                esc   │
@@ -456,8 +454,10 @@ test('list actions panel with ctrl+k', async () => {
       │   See Console Logs                                             │
       │                                                                │
       │                                                                │
-      │   ↵ select   ↑↓ navigate                                       │
-      │                                                                │"
+      │                                                                │
+      │                                                                │
+      │                                                                │
+      │   ↵ select   ↑↓ navigate                                       │"
   `)
 
   // Navigate down to second action
@@ -468,8 +468,6 @@ test('list actions panel with ctrl+k', async () => {
     "
 
 
-       Simple List Example ────────────────────────────────────────────
-
       ╭────────────────────────────────────────────────────────────────╮
       │                                                                │
       │   Actions                                                esc   │
@@ -484,8 +482,10 @@ test('list actions panel with ctrl+k', async () => {
       │   See Console Logs                                             │
       │                                                                │
       │                                                                │
-      │   ↵ select   ↑↓ navigate                                       │
-      │                                                                │"
+      │                                                                │
+      │                                                                │
+      │                                                                │
+      │   ↵ select   ↑↓ navigate                                       │"
   `)
 
   // Trigger the second action (Add to Cart)
@@ -706,15 +706,15 @@ test('list scrollbox scrolling with sections', async () => {
 
        > Search items...
 
+       Fruits
+       Apple Red and sweet                              Fresh [Popular]
+       Banana Yellow and nutritious                                Ripe
        Orange Citrus and juicy                                    Fresh
        Grape Sweet clusters                                  [Seasonal]
        Mango Tropical delight                                  Imported
        Pineapple Sweet and tangy
       ›Strawberry Red and sweet                               [Popular]
 
-       Vegetables
-       Carrot Orange and crunchy                              [Healthy]
-       Lettuce Green and fresh
 
 
        ↑↓ navigate   ^k actions
@@ -736,8 +736,6 @@ test('list scrollbox scrolling with sections', async () => {
 
        > Search items...
 
-
-       Vegetables
        Carrot Orange and crunchy                              [Healthy]
        Lettuce Green and fresh
       ›Broccoli Green florets                                 [Healthy]
@@ -746,6 +744,8 @@ test('list scrollbox scrolling with sections', async () => {
        Cucumber Cool and crisp
        Bell Pepper Colorful and crunchy                         [Fresh]
 
+       Bread Freshly baked                                  Today [New]
+
 
        ↑↓ navigate   ^k actions
 

package/src/examples/simple-detail-markdown.vitest.tsx

@@ -30,7 +30,7 @@ test('detail renders markdown with headings, lists, links, tables, code and diag
 
                                                                                  █
                                                                                  █
-      Architecture Overview                                                      ▀
+      Architecture Overview
 
       This document describes the system architecture.
 
@@ -42,6 +42,7 @@ test('detail renders markdown with headings, lists, links, tables, code and diag
       - Server - processes requests
       - Database - stores data
 
+
       Links
 
       Check out the GitHub repository for the source code.
@@ -90,7 +91,6 @@ test('detail renders markdown with headings, lists, links, tables, code and diag
 
       Code Example
 
-      interface Config {
 
 
       esc go back                                              powered by termcast
@@ -117,9 +117,8 @@ test('detail renders markdown with headings, lists, links, tables, code and diag
   expect(text).toContain('┌─')
   expect(text).toContain('─┐')
   expect(text).toContain('Process')
-  // Code block header visible (content may need scroll)
+  // Code block header visible (content may need scroll to see full block)
   expect(text).toContain('Code Example')
-  expect(text).toContain('interface Config')
 }, 30000)
 
 test('links have distinct cyan color from bold/heading text', async () => {

package/src/examples/simple-file-picker.vitest.tsx

@@ -51,6 +51,7 @@ test('file picker shows form fields', async () => {
       └
 
 
+       ctrl ↵ submit   tab navigate   ^k actions
 
 
 
@@ -76,7 +77,6 @@ test('file picker shows form fields', async () => {
 
 
 
-       ctrl ↵ submit   tab navigate   ^k actions
 
     "
   `)