linecraft 0.2.3 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +43 -0
- package/lib/components/code-debug.d.ts +5 -1
- package/lib/components/code-debug.d.ts.map +1 -1
- package/lib/components/code-debug.js +161 -101
- package/lib/components/code-debug.js.map +1 -1
- package/lib/components/progress-bar-grid.d.ts.map +1 -1
- package/lib/components/progress-bar-grid.js +2 -1
- package/lib/components/progress-bar-grid.js.map +1 -1
- package/lib/components/progress-bar-grid.test.js +8 -7
- package/lib/components/progress-bar-grid.test.js.map +1 -1
- package/lib/components/prompt.d.ts.map +1 -1
- package/lib/components/prompt.js +2 -1
- package/lib/components/prompt.js.map +1 -1
- package/lib/components/segments.d.ts.map +1 -1
- package/lib/components/segments.js +0 -7
- package/lib/components/segments.js.map +1 -1
- package/lib/components/style.test.js +12 -11
- package/lib/components/style.test.js.map +1 -1
- package/lib/components/styled.d.ts.map +1 -1
- package/lib/components/styled.js +2 -1
- package/lib/components/styled.js.map +1 -1
- package/lib/components/styled.test.js +12 -11
- package/lib/components/styled.test.js.map +1 -1
- package/lib/layout/grid.d.ts.map +1 -1
- package/lib/layout/grid.js +75 -38
- package/lib/layout/grid.js.map +1 -1
- package/lib/layout/grid.test.js +3 -3
- package/lib/layout/grid.test.js.map +1 -1
- package/lib/native/diff.d.ts.map +1 -1
- package/lib/native/diff.js +2 -1
- package/lib/native/diff.js.map +1 -1
- package/lib/native/region-old.js +4 -4
- package/lib/native/region-old.js.map +1 -1
- package/lib/native/region-renderer.d.ts +2 -2
- package/lib/native/region-renderer.d.ts.map +1 -1
- package/lib/native/region-renderer.js +9 -9
- package/lib/native/region-renderer.js.map +1 -1
- package/lib/native/region-simple.d.ts.map +1 -1
- package/lib/native/region-simple.js +1 -1
- package/lib/native/region-simple.js.map +1 -1
- package/lib/region.d.ts +3 -3
- package/lib/region.d.ts.map +1 -1
- package/lib/region.js +15 -20
- package/lib/region.js.map +1 -1
- package/lib/types.d.ts +1 -0
- package/lib/types.d.ts.map +1 -1
- package/lib/utils/colors.d.ts.map +1 -1
- package/lib/utils/colors.js +3 -0
- package/lib/utils/colors.js.map +1 -1
- package/lib/utils/cursor-position.d.ts.map +1 -1
- package/lib/utils/cursor-position.js +0 -2
- package/lib/utils/cursor-position.js.map +1 -1
- package/lib/utils/prompt.js +3 -3
- package/lib/utils/prompt.js.map +1 -1
- package/lib/utils/terminal-theme.d.ts +5 -4
- package/lib/utils/terminal-theme.d.ts.map +1 -1
- package/lib/utils/terminal-theme.js +7 -6
- package/lib/utils/terminal-theme.js.map +1 -1
- package/lib/utils/text.d.ts +27 -0
- package/lib/utils/text.d.ts.map +1 -1
- package/lib/utils/text.js +125 -0
- package/lib/utils/text.js.map +1 -1
- package/lib/utils/wait-for-spacebar.js +2 -2
- package/lib/utils/wait-for-spacebar.js.map +1 -1
- package/package.json +7 -3
|
@@ -51,17 +51,14 @@ export function Segments(options) {
|
|
|
51
51
|
}
|
|
52
52
|
const availableWidth = ctx.availableWidth;
|
|
53
53
|
let result = '';
|
|
54
|
-
let usedWidth = 0;
|
|
55
54
|
for (let i = 0; i < segments.length; i++) {
|
|
56
55
|
const segment = segments[i];
|
|
57
|
-
const nextSegment = i < segments.length - 1 ? segments[i + 1] : null;
|
|
58
56
|
// Left divider (automatic - dash for middle segments)
|
|
59
57
|
if (i > 0) {
|
|
60
58
|
// Always use dash (─) for dividers - it works well with all border styles
|
|
61
59
|
const dividerColor = 'brightBlack';
|
|
62
60
|
const styledDivider = applyStyle('─', { color: dividerColor });
|
|
63
61
|
result += styledDivider;
|
|
64
|
-
usedWidth += 1;
|
|
65
62
|
}
|
|
66
63
|
// Left border decoration
|
|
67
64
|
const borderStyle = segment.borderStyle ?? 'cap';
|
|
@@ -70,7 +67,6 @@ export function Segments(options) {
|
|
|
70
67
|
// Auto-theme: borders use text color
|
|
71
68
|
const borderColor = segment.color ?? 'brightCyan';
|
|
72
69
|
result += applyStyle(borderChars.left, { color: borderColor });
|
|
73
|
-
usedWidth += 1;
|
|
74
70
|
}
|
|
75
71
|
// Segment content with automatic padding (no background, just text color)
|
|
76
72
|
// Trim content and add padding automatically
|
|
@@ -81,13 +77,11 @@ export function Segments(options) {
|
|
|
81
77
|
// No backgroundColor - uses default terminal background
|
|
82
78
|
});
|
|
83
79
|
result += styledContent;
|
|
84
|
-
usedWidth += paddedContent.length;
|
|
85
80
|
// Right border decoration
|
|
86
81
|
if (borderChars.right) {
|
|
87
82
|
// Auto-theme: borders use text color
|
|
88
83
|
const borderColor = segment.color ?? 'brightCyan';
|
|
89
84
|
result += applyStyle(borderChars.right, { color: borderColor });
|
|
90
|
-
usedWidth += 1;
|
|
91
85
|
}
|
|
92
86
|
// Right divider (automatic - dash for middle segments)
|
|
93
87
|
if (i < segments.length - 1) {
|
|
@@ -95,7 +89,6 @@ export function Segments(options) {
|
|
|
95
89
|
const dividerColor = 'brightBlack';
|
|
96
90
|
const styledDivider = applyStyle('─', { color: dividerColor });
|
|
97
91
|
result += styledDivider;
|
|
98
|
-
usedWidth += 1;
|
|
99
92
|
}
|
|
100
93
|
}
|
|
101
94
|
// Truncate if needed (preserving ANSI codes)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"segments.js","sourceRoot":"","sources":["../../src/components/segments.ts"],"names":[],"mappings":"AAAA,qFAAqF;AAIrF,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAgBnD;;;GAGG;AACH,SAAS,cAAc,CAAC,KAAkB;IACxC,QAAQ,KAAK,EAAE,CAAC;QACd,KAAK,KAAK;YACR,sCAAsC;YACtC,2CAA2C;YAC3C,4CAA4C;YAC5C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;QACnC,KAAK,SAAS;YACZ,iDAAiD;YACjD,wCAAwC;YACxC,gEAAgE;YAChE,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;QACnC,KAAK,OAAO;YACV,mCAAmC;YACnC,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;QACnC,KAAK,KAAK;YACR,kBAAkB;YAClB,6CAA6C;YAC7C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;QACnC,KAAK,UAAU;YACb,uBAAuB;YACvB,wBAAwB;YACxB,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;IACrC,CAAC;AACH,CAAC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,QAAQ,CAAC,OAAwB;IAC/C,OAAO,CAAC,GAAkB,EAAE,EAAE;QAC5B,MAAM,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAC;QAC7B,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC1B,OAAO,EAAE,CAAC;QACZ,CAAC;QAED,MAAM,cAAc,GAAG,GAAG,CAAC,cAAc,CAAC;QAC1C,IAAI,MAAM,GAAG,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"segments.js","sourceRoot":"","sources":["../../src/components/segments.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { describe, it, expect, beforeEach } from 'vitest';
|
|
2
2
|
import { Styled } from './styled.js';
|
|
3
3
|
import { TerminalRegion } from '../region.js';
|
|
4
|
+
import { callComponent } from '../component.js';
|
|
4
5
|
describe('Style Component', () => {
|
|
5
6
|
let region;
|
|
6
7
|
beforeEach(() => {
|
|
@@ -9,7 +10,7 @@ describe('Style Component', () => {
|
|
|
9
10
|
describe('basic styling', () => {
|
|
10
11
|
it('should apply color', () => {
|
|
11
12
|
const component = Styled({ color: 'red' }, 'Hello');
|
|
12
|
-
const result = component
|
|
13
|
+
const result = callComponent(component, {
|
|
13
14
|
availableWidth: 80,
|
|
14
15
|
region: region,
|
|
15
16
|
columnIndex: 0,
|
|
@@ -20,7 +21,7 @@ describe('Style Component', () => {
|
|
|
20
21
|
});
|
|
21
22
|
it('should apply backgroundColor', () => {
|
|
22
23
|
const component = Styled({ backgroundColor: 'blue' }, 'Hello');
|
|
23
|
-
const result = component
|
|
24
|
+
const result = callComponent(component, {
|
|
24
25
|
availableWidth: 80,
|
|
25
26
|
region: region,
|
|
26
27
|
columnIndex: 0,
|
|
@@ -31,7 +32,7 @@ describe('Style Component', () => {
|
|
|
31
32
|
});
|
|
32
33
|
it('should apply bold', () => {
|
|
33
34
|
const component = Styled({ bold: true }, 'Hello');
|
|
34
|
-
const result = component
|
|
35
|
+
const result = callComponent(component, {
|
|
35
36
|
availableWidth: 80,
|
|
36
37
|
region: region,
|
|
37
38
|
columnIndex: 0,
|
|
@@ -43,7 +44,7 @@ describe('Style Component', () => {
|
|
|
43
44
|
describe('overflow handling', () => {
|
|
44
45
|
it('should truncate with ellipsis-end', () => {
|
|
45
46
|
const component = Styled({ overflow: 'ellipsis-end' }, 'This is a very long text');
|
|
46
|
-
const result = component
|
|
47
|
+
const result = callComponent(component, {
|
|
47
48
|
availableWidth: 10,
|
|
48
49
|
region: region,
|
|
49
50
|
columnIndex: 0,
|
|
@@ -55,7 +56,7 @@ describe('Style Component', () => {
|
|
|
55
56
|
});
|
|
56
57
|
it('should truncate with ellipsis-start', () => {
|
|
57
58
|
const component = Styled({ overflow: 'ellipsis-start' }, 'This is a very long text');
|
|
58
|
-
const result = component
|
|
59
|
+
const result = callComponent(component, {
|
|
59
60
|
availableWidth: 10,
|
|
60
61
|
region: region,
|
|
61
62
|
columnIndex: 0,
|
|
@@ -67,7 +68,7 @@ describe('Style Component', () => {
|
|
|
67
68
|
});
|
|
68
69
|
it('should wrap text', () => {
|
|
69
70
|
const component = Styled({ overflow: 'wrap' }, 'This is a very long text that should wrap');
|
|
70
|
-
const result = component
|
|
71
|
+
const result = callComponent(component, {
|
|
71
72
|
availableWidth: 10,
|
|
72
73
|
region: region,
|
|
73
74
|
columnIndex: 0,
|
|
@@ -80,7 +81,7 @@ describe('Style Component', () => {
|
|
|
80
81
|
describe('when condition', () => {
|
|
81
82
|
it('should return null when condition is false', () => {
|
|
82
83
|
const component = Styled({ when: () => false }, 'Hello');
|
|
83
|
-
const result = component
|
|
84
|
+
const result = callComponent(component, {
|
|
84
85
|
availableWidth: 80,
|
|
85
86
|
region: region,
|
|
86
87
|
columnIndex: 0,
|
|
@@ -90,7 +91,7 @@ describe('Style Component', () => {
|
|
|
90
91
|
});
|
|
91
92
|
it('should return content when condition is true', () => {
|
|
92
93
|
const component = Styled({ when: (ctx) => ctx.availableWidth > 50 }, 'Hello');
|
|
93
|
-
const result = component
|
|
94
|
+
const result = callComponent(component, {
|
|
94
95
|
availableWidth: 80,
|
|
95
96
|
region: region,
|
|
96
97
|
columnIndex: 0,
|
|
@@ -100,14 +101,14 @@ describe('Style Component', () => {
|
|
|
100
101
|
});
|
|
101
102
|
it('should check availableWidth in condition', () => {
|
|
102
103
|
const component = Styled({ when: (ctx) => ctx.availableWidth > 50 }, 'Hello');
|
|
103
|
-
const result1 = component
|
|
104
|
+
const result1 = callComponent(component, {
|
|
104
105
|
availableWidth: 40,
|
|
105
106
|
region: region,
|
|
106
107
|
columnIndex: 0,
|
|
107
108
|
rowIndex: 0,
|
|
108
109
|
});
|
|
109
110
|
expect(result1).toBeNull();
|
|
110
|
-
const result2 = component
|
|
111
|
+
const result2 = callComponent(component, {
|
|
111
112
|
availableWidth: 60,
|
|
112
113
|
region: region,
|
|
113
114
|
columnIndex: 0,
|
|
@@ -119,7 +120,7 @@ describe('Style Component', () => {
|
|
|
119
120
|
describe('multi-line content', () => {
|
|
120
121
|
it('should apply styling to each line', () => {
|
|
121
122
|
const component = Styled({ color: 'red' }, ['Line 1', 'Line 2']);
|
|
122
|
-
const result = component
|
|
123
|
+
const result = callComponent(component, {
|
|
123
124
|
availableWidth: 80,
|
|
124
125
|
region: region,
|
|
125
126
|
columnIndex: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.test.js","sourceRoot":"","sources":["../../src/components/style.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"style.test.js","sourceRoot":"","sources":["../../src/components/style.test.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../src/components/styled.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../src/components/styled.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAIzC,MAAM,WAAW,YAAY;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,GAAG,gBAAgB,GAAG,iBAAiB,GAAG,MAAM,CAAC;IACnF,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IACpC,IAAI,CAAC,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,OAAO,CAAC;CACxC;AAED;;GAEG;AACH,wBAAgB,MAAM,CACpB,OAAO,EAAE,YAAY,EACrB,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,SAAS,GACrC,SAAS,CAyEX"}
|
package/lib/components/styled.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
// Style component for text styling and overflow handling
|
|
2
|
+
import { callComponent } from '../component.js';
|
|
2
3
|
import { applyStyle } from '../utils/colors.js';
|
|
3
4
|
import { truncateEnd, truncateStart, truncateMiddle, wrapText } from '../utils/text.js';
|
|
4
5
|
/**
|
|
@@ -17,7 +18,7 @@ export function Styled(options, content) {
|
|
|
17
18
|
}
|
|
18
19
|
else {
|
|
19
20
|
// It's a component - render it
|
|
20
|
-
const result = content
|
|
21
|
+
const result = callComponent(content, ctx);
|
|
21
22
|
if (result === null)
|
|
22
23
|
return null;
|
|
23
24
|
text = result;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../src/components/styled.ts"],"names":[],"mappings":"AAAA,yDAAyD;
|
|
1
|
+
{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../src/components/styled.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { describe, it, expect, beforeEach } from 'vitest';
|
|
2
2
|
import { Styled } from './styled.js';
|
|
3
3
|
import { TerminalRegion } from '../region.js';
|
|
4
|
+
import { callComponent } from '../component.js';
|
|
4
5
|
describe('Style Component', () => {
|
|
5
6
|
let region;
|
|
6
7
|
beforeEach(() => {
|
|
@@ -9,7 +10,7 @@ describe('Style Component', () => {
|
|
|
9
10
|
describe('basic styling', () => {
|
|
10
11
|
it('should apply color', () => {
|
|
11
12
|
const component = Styled({ color: 'red' }, 'Hello');
|
|
12
|
-
const result = component
|
|
13
|
+
const result = callComponent(component, {
|
|
13
14
|
availableWidth: 80,
|
|
14
15
|
region: region,
|
|
15
16
|
columnIndex: 0,
|
|
@@ -20,7 +21,7 @@ describe('Style Component', () => {
|
|
|
20
21
|
});
|
|
21
22
|
it('should apply backgroundColor', () => {
|
|
22
23
|
const component = Styled({ backgroundColor: 'blue' }, 'Hello');
|
|
23
|
-
const result = component
|
|
24
|
+
const result = callComponent(component, {
|
|
24
25
|
availableWidth: 80,
|
|
25
26
|
region: region,
|
|
26
27
|
columnIndex: 0,
|
|
@@ -31,7 +32,7 @@ describe('Style Component', () => {
|
|
|
31
32
|
});
|
|
32
33
|
it('should apply bold', () => {
|
|
33
34
|
const component = Styled({ bold: true }, 'Hello');
|
|
34
|
-
const result = component
|
|
35
|
+
const result = callComponent(component, {
|
|
35
36
|
availableWidth: 80,
|
|
36
37
|
region: region,
|
|
37
38
|
columnIndex: 0,
|
|
@@ -43,7 +44,7 @@ describe('Style Component', () => {
|
|
|
43
44
|
describe('overflow handling', () => {
|
|
44
45
|
it('should truncate with ellipsis-end', () => {
|
|
45
46
|
const component = Styled({ overflow: 'ellipsis-end' }, 'This is a very long text');
|
|
46
|
-
const result = component
|
|
47
|
+
const result = callComponent(component, {
|
|
47
48
|
availableWidth: 10,
|
|
48
49
|
region: region,
|
|
49
50
|
columnIndex: 0,
|
|
@@ -55,7 +56,7 @@ describe('Style Component', () => {
|
|
|
55
56
|
});
|
|
56
57
|
it('should truncate with ellipsis-start', () => {
|
|
57
58
|
const component = Styled({ overflow: 'ellipsis-start' }, 'This is a very long text');
|
|
58
|
-
const result = component
|
|
59
|
+
const result = callComponent(component, {
|
|
59
60
|
availableWidth: 10,
|
|
60
61
|
region: region,
|
|
61
62
|
columnIndex: 0,
|
|
@@ -67,7 +68,7 @@ describe('Style Component', () => {
|
|
|
67
68
|
});
|
|
68
69
|
it('should wrap text', () => {
|
|
69
70
|
const component = Styled({ overflow: 'wrap' }, 'This is a very long text that should wrap');
|
|
70
|
-
const result = component
|
|
71
|
+
const result = callComponent(component, {
|
|
71
72
|
availableWidth: 10,
|
|
72
73
|
region: region,
|
|
73
74
|
columnIndex: 0,
|
|
@@ -80,7 +81,7 @@ describe('Style Component', () => {
|
|
|
80
81
|
describe('when condition', () => {
|
|
81
82
|
it('should return null when condition is false', () => {
|
|
82
83
|
const component = Styled({ when: () => false }, 'Hello');
|
|
83
|
-
const result = component
|
|
84
|
+
const result = callComponent(component, {
|
|
84
85
|
availableWidth: 80,
|
|
85
86
|
region: region,
|
|
86
87
|
columnIndex: 0,
|
|
@@ -90,7 +91,7 @@ describe('Style Component', () => {
|
|
|
90
91
|
});
|
|
91
92
|
it('should return content when condition is true', () => {
|
|
92
93
|
const component = Styled({ when: (ctx) => ctx.availableWidth > 50 }, 'Hello');
|
|
93
|
-
const result = component
|
|
94
|
+
const result = callComponent(component, {
|
|
94
95
|
availableWidth: 80,
|
|
95
96
|
region: region,
|
|
96
97
|
columnIndex: 0,
|
|
@@ -100,14 +101,14 @@ describe('Style Component', () => {
|
|
|
100
101
|
});
|
|
101
102
|
it('should check availableWidth in condition', () => {
|
|
102
103
|
const component = Styled({ when: (ctx) => ctx.availableWidth > 50 }, 'Hello');
|
|
103
|
-
const result1 = component
|
|
104
|
+
const result1 = callComponent(component, {
|
|
104
105
|
availableWidth: 40,
|
|
105
106
|
region: region,
|
|
106
107
|
columnIndex: 0,
|
|
107
108
|
rowIndex: 0,
|
|
108
109
|
});
|
|
109
110
|
expect(result1).toBeNull();
|
|
110
|
-
const result2 = component
|
|
111
|
+
const result2 = callComponent(component, {
|
|
111
112
|
availableWidth: 60,
|
|
112
113
|
region: region,
|
|
113
114
|
columnIndex: 0,
|
|
@@ -119,7 +120,7 @@ describe('Style Component', () => {
|
|
|
119
120
|
describe('multi-line content', () => {
|
|
120
121
|
it('should apply styling to each line', () => {
|
|
121
122
|
const component = Styled({ color: 'red' }, ['Line 1', 'Line 2']);
|
|
122
|
-
const result = component
|
|
123
|
+
const result = callComponent(component, {
|
|
123
124
|
availableWidth: 80,
|
|
124
125
|
region: region,
|
|
125
126
|
columnIndex: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styled.test.js","sourceRoot":"","sources":["../../src/components/styled.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"styled.test.js","sourceRoot":"","sources":["../../src/components/styled.test.ts"],"names":[],"mappings":"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"}
|
package/lib/layout/grid.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../src/layout/grid.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAS,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGnD,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../src/layout/grid.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAS,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGnD,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,iBAAiB,CAAC;AA6BhE;;GAEG;AACH,MAAM,MAAM,iBAAiB,GACzB,MAAM,GACN,MAAM,GACN,GAAG,GACH,GAAG,MAAM,GAAG,GACZ;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnC,MAAM,WAAW,WAAW;IAC1B,mEAAmE;IACnE,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAE9B,0HAA0H;IAC1H,WAAW,CAAC,EAAE,iBAAiB,CAAC;IAEhC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAE/B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAEhB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,+EAA+E;IAC/E,YAAY,CAAC,EAAE,QAAQ,GAAG,QAAQ,EAAE,CAAC;IAErC,gFAAgF;IAChF,OAAO,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,eAAe,CAAC;CACxD;AAiPD;;;;GAIG;AACH,wBAAgB,IAAI,CAClB,OAAO,EAAE,WAAW,EACpB,GAAG,QAAQ,EAAE,CAAC,SAAS,GAAG,MAAM,GAAG;IAAE,MAAM,EAAE,SAAS,CAAA;CAAE,CAAC,EAAE,GAC1D,SAAS,CAqgBX"}
|
package/lib/layout/grid.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// CSS Grid-based layout system for terminal components
|
|
2
2
|
// Simplified grid that eliminates circular measurement complexity
|
|
3
3
|
import { applyStyle } from '../utils/colors.js';
|
|
4
|
-
import {
|
|
4
|
+
import { stripAnsi, countVisibleChars, splitAtVisiblePos } from '../utils/text.js';
|
|
5
5
|
import { callComponent, createChildContext } from '../component.js';
|
|
6
6
|
/**
|
|
7
7
|
* Extract character and color from spaceBetween option for a specific gap index
|
|
@@ -209,9 +209,9 @@ function getRenderedWidth(result) {
|
|
|
209
209
|
return 0;
|
|
210
210
|
}
|
|
211
211
|
if (Array.isArray(result)) {
|
|
212
|
-
return result.reduce((max, line) => Math.max(max,
|
|
212
|
+
return result.reduce((max, line) => Math.max(max, countVisibleChars(line)), 0);
|
|
213
213
|
}
|
|
214
|
-
return
|
|
214
|
+
return countVisibleChars(result);
|
|
215
215
|
}
|
|
216
216
|
function measureAutoContentWidths(tracks, children, ctxFactory) {
|
|
217
217
|
const widths = new Array(tracks.length).fill(0);
|
|
@@ -231,11 +231,10 @@ function measureAutoContentWidths(tracks, children, ctxFactory) {
|
|
|
231
231
|
*/
|
|
232
232
|
export function grid(options, ...children) {
|
|
233
233
|
// Convert children to Components
|
|
234
|
-
const convertedChildren = children.map(child => {
|
|
234
|
+
const convertedChildren = children.map((child) => {
|
|
235
235
|
if (typeof child === 'string') {
|
|
236
|
-
//
|
|
237
|
-
|
|
238
|
-
return Styled({}, child);
|
|
236
|
+
// Convert string to a simple component that returns the string
|
|
237
|
+
return (ctx) => child;
|
|
239
238
|
}
|
|
240
239
|
// If it's an object with a render method, extract the render function
|
|
241
240
|
if (typeof child === 'object' && child !== null && 'render' in child && typeof child.render === 'function') {
|
|
@@ -252,9 +251,12 @@ export function grid(options, ...children) {
|
|
|
252
251
|
return null;
|
|
253
252
|
}
|
|
254
253
|
// Determine number of explicit columns
|
|
254
|
+
// When using template, auto-repeat for extra children (don't wrap)
|
|
255
|
+
// When using columns without autoColumns, wrap to new rows
|
|
255
256
|
const explicitColumns = columns ?? template ?? [];
|
|
256
|
-
const
|
|
257
|
-
|
|
257
|
+
const shouldAutoRepeat = template !== undefined || autoColumns !== undefined;
|
|
258
|
+
const numColumns = shouldAutoRepeat ? validChildren.length : (explicitColumns.length > 0 ? explicitColumns.length : 1);
|
|
259
|
+
// Group children into rows (wrap when exceeding numColumns, unless auto-repeat)
|
|
258
260
|
const rowsData = [];
|
|
259
261
|
for (let i = 0; i < validChildren.length; i += numColumns) {
|
|
260
262
|
rowsData.push(validChildren.slice(i, i + numColumns));
|
|
@@ -304,13 +306,23 @@ export function grid(options, ...children) {
|
|
|
304
306
|
else if (Array.isArray(result)) {
|
|
305
307
|
columnContent = result[lineIdx] ?? '';
|
|
306
308
|
}
|
|
307
|
-
else {
|
|
309
|
+
else if (typeof result === 'string') {
|
|
308
310
|
columnContent = lineIdx === 0 ? result : '';
|
|
309
311
|
}
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
312
|
+
else {
|
|
313
|
+
columnContent = '';
|
|
314
|
+
}
|
|
315
|
+
const visibleWidth = countVisibleChars(columnContent);
|
|
316
|
+
let finalContent = columnContent;
|
|
317
|
+
if (visibleWidth > columnWidth) {
|
|
318
|
+
// Need to truncate at visible width
|
|
319
|
+
const split = splitAtVisiblePos(columnContent, columnWidth);
|
|
320
|
+
finalContent = split.before;
|
|
321
|
+
}
|
|
322
|
+
const finalVisibleWidth = countVisibleChars(finalContent);
|
|
323
|
+
const paddedContent = finalVisibleWidth < columnWidth
|
|
324
|
+
? finalContent + ' '.repeat(columnWidth - finalVisibleWidth)
|
|
325
|
+
: finalContent;
|
|
314
326
|
lineParts.push(paddedContent);
|
|
315
327
|
// Add column gap
|
|
316
328
|
if (colIdx < rowChildren.length - 1 && columnGap > 0) {
|
|
@@ -363,7 +375,6 @@ export function grid(options, ...children) {
|
|
|
363
375
|
// Render each child
|
|
364
376
|
const results = [];
|
|
365
377
|
let anyRenderableChild = false;
|
|
366
|
-
let currentX = startX;
|
|
367
378
|
for (let i = 0; i < validChildren.length; i++) {
|
|
368
379
|
const child = validChildren[i];
|
|
369
380
|
const width = actualWidths[i] ?? 0;
|
|
@@ -392,7 +403,6 @@ export function grid(options, ...children) {
|
|
|
392
403
|
results.push(' '.repeat(columnGap));
|
|
393
404
|
}
|
|
394
405
|
}
|
|
395
|
-
currentX += width + columnGap;
|
|
396
406
|
}
|
|
397
407
|
if (!anyRenderableChild) {
|
|
398
408
|
return null;
|
|
@@ -425,11 +435,12 @@ export function grid(options, ...children) {
|
|
|
425
435
|
const result = results[partIdx];
|
|
426
436
|
partIdx++;
|
|
427
437
|
const content = result === null ? '' : (typeof result === 'string' ? result : '');
|
|
428
|
-
const
|
|
429
|
-
totalAutoWidth +=
|
|
438
|
+
const visibleWidth = countVisibleChars(content);
|
|
439
|
+
totalAutoWidth += visibleWidth;
|
|
430
440
|
autoContents.push(content);
|
|
431
441
|
if (process.env.DEBUG_GRID) {
|
|
432
|
-
|
|
442
|
+
const debugPlain = stripAnsi(content);
|
|
443
|
+
console.log(`DEBUG: Collected auto column ${i}: "${debugPlain}", totalAutoWidth=${totalAutoWidth}, autoContents.length=${autoContents.length}`);
|
|
433
444
|
}
|
|
434
445
|
// Skip gap result if present (spaceBetween adds gap results between columns)
|
|
435
446
|
// Only skip if this is not the last column and there's a gap result
|
|
@@ -470,9 +481,9 @@ export function grid(options, ...children) {
|
|
|
470
481
|
}
|
|
471
482
|
const line = lineParts.join('');
|
|
472
483
|
// Pad to full width to ensure right column is at the end
|
|
473
|
-
const
|
|
474
|
-
const paddedLine =
|
|
475
|
-
? line + ' '.repeat(ctx.availableWidth -
|
|
484
|
+
const visibleLineWidth = countVisibleChars(line);
|
|
485
|
+
const paddedLine = visibleLineWidth < ctx.availableWidth
|
|
486
|
+
? line + ' '.repeat(ctx.availableWidth - visibleLineWidth)
|
|
476
487
|
: line;
|
|
477
488
|
return paddedLine;
|
|
478
489
|
}
|
|
@@ -502,28 +513,46 @@ export function grid(options, ...children) {
|
|
|
502
513
|
}
|
|
503
514
|
}
|
|
504
515
|
else {
|
|
505
|
-
|
|
516
|
+
let columnContent;
|
|
517
|
+
if (typeof result === 'string') {
|
|
518
|
+
columnContent = result;
|
|
519
|
+
}
|
|
520
|
+
else if (Array.isArray(result)) {
|
|
521
|
+
// Multi-line result - take first line for single-row rendering
|
|
522
|
+
columnContent = result[0] ?? '';
|
|
523
|
+
}
|
|
524
|
+
else {
|
|
525
|
+
columnContent = '';
|
|
526
|
+
}
|
|
506
527
|
if (isAuto) {
|
|
507
528
|
lineParts.push(columnContent);
|
|
508
529
|
}
|
|
509
530
|
else {
|
|
510
|
-
const
|
|
531
|
+
const visibleWidth = countVisibleChars(columnContent);
|
|
511
532
|
let paddedContent;
|
|
512
533
|
// If content is empty and this is a flex column with spaceBetween, fill it
|
|
513
|
-
if (
|
|
534
|
+
if (visibleWidth === 0 && spaceBetween && columnWidth > 0 && isFlex) {
|
|
514
535
|
const { char: spaceChar, color: spaceColor } = getSpaceBetweenChar(spaceBetween, i);
|
|
515
536
|
const fillText = spaceChar.repeat(columnWidth);
|
|
516
537
|
paddedContent = spaceColor ? applyStyle(fillText, { color: spaceColor }) : fillText;
|
|
517
538
|
}
|
|
518
|
-
else if (
|
|
539
|
+
else if (visibleWidth === 0 && spaceBetween && columnWidth > 0) {
|
|
519
540
|
const { char: spaceChar, color: spaceColor } = getSpaceBetweenChar(spaceBetween, i);
|
|
520
541
|
const fillText = spaceChar.repeat(columnWidth);
|
|
521
542
|
paddedContent = spaceColor ? applyStyle(fillText, { color: spaceColor }) : fillText;
|
|
522
543
|
}
|
|
523
544
|
else {
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
545
|
+
// Truncate if needed, then pad
|
|
546
|
+
let finalContent = columnContent;
|
|
547
|
+
if (visibleWidth > columnWidth) {
|
|
548
|
+
// Need to truncate at visible width
|
|
549
|
+
const split = splitAtVisiblePos(columnContent, columnWidth);
|
|
550
|
+
finalContent = split.before;
|
|
551
|
+
}
|
|
552
|
+
const finalVisibleWidth = countVisibleChars(finalContent);
|
|
553
|
+
paddedContent = finalVisibleWidth < columnWidth
|
|
554
|
+
? finalContent + ' '.repeat(columnWidth - finalVisibleWidth)
|
|
555
|
+
: finalContent;
|
|
527
556
|
}
|
|
528
557
|
lineParts.push(paddedContent);
|
|
529
558
|
}
|
|
@@ -543,9 +572,9 @@ export function grid(options, ...children) {
|
|
|
543
572
|
}
|
|
544
573
|
const line = lineParts.join('');
|
|
545
574
|
// CRITICAL: Pad line to full availableWidth to ensure grid fills the region
|
|
546
|
-
const
|
|
547
|
-
const paddedLine =
|
|
548
|
-
? line + ' '.repeat(ctx.availableWidth -
|
|
575
|
+
const visibleLineWidth = countVisibleChars(line);
|
|
576
|
+
const paddedLine = visibleLineWidth < ctx.availableWidth
|
|
577
|
+
? line + ' '.repeat(ctx.availableWidth - visibleLineWidth)
|
|
549
578
|
: line;
|
|
550
579
|
return paddedLine;
|
|
551
580
|
}
|
|
@@ -595,23 +624,31 @@ export function grid(options, ...children) {
|
|
|
595
624
|
lineParts.push(columnContent);
|
|
596
625
|
}
|
|
597
626
|
else {
|
|
598
|
-
const
|
|
627
|
+
const visibleWidth = countVisibleChars(columnContent);
|
|
599
628
|
let paddedContent;
|
|
600
629
|
// If content is empty and this is a flex column with spaceBetween, fill it
|
|
601
|
-
if (
|
|
630
|
+
if (visibleWidth === 0 && spaceBetween && columnWidth > 0 && isFlex) {
|
|
602
631
|
const { char: spaceChar, color: spaceColor } = getSpaceBetweenChar(spaceBetween, i);
|
|
603
632
|
const fillText = spaceChar.repeat(columnWidth);
|
|
604
633
|
paddedContent = spaceColor ? applyStyle(fillText, { color: spaceColor }) : fillText;
|
|
605
634
|
}
|
|
606
|
-
else if (
|
|
635
|
+
else if (visibleWidth === 0 && spaceBetween && columnWidth > 0) {
|
|
607
636
|
const { char: spaceChar, color: spaceColor } = getSpaceBetweenChar(spaceBetween, i);
|
|
608
637
|
const fillText = spaceChar.repeat(columnWidth);
|
|
609
638
|
paddedContent = spaceColor ? applyStyle(fillText, { color: spaceColor }) : fillText;
|
|
610
639
|
}
|
|
611
640
|
else {
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
641
|
+
// Truncate if needed, then pad
|
|
642
|
+
let finalContent = columnContent;
|
|
643
|
+
if (visibleWidth > columnWidth) {
|
|
644
|
+
// Need to truncate at visible width
|
|
645
|
+
const split = splitAtVisiblePos(columnContent, columnWidth);
|
|
646
|
+
finalContent = split.before;
|
|
647
|
+
}
|
|
648
|
+
const finalVisibleWidth = countVisibleChars(finalContent);
|
|
649
|
+
paddedContent = finalVisibleWidth < columnWidth
|
|
650
|
+
? finalContent + ' '.repeat(columnWidth - finalVisibleWidth)
|
|
651
|
+
: finalContent;
|
|
615
652
|
}
|
|
616
653
|
lineParts.push(paddedContent);
|
|
617
654
|
}
|