@teaui/react 1.3.8 → 1.5.8
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/.dist/components/FontStyle.d.ts +12 -0
- package/.dist/components/FontStyle.js +34 -0
- package/.dist/components/FontStyle.js.map +1 -0
- package/.dist/components/TextReact.d.ts +2 -0
- package/.dist/components/TextReact.js +31 -25
- package/.dist/components/TextReact.js.map +1 -1
- package/.dist/components.d.ts +26 -3
- package/.dist/components.js +106 -140
- package/.dist/components.js.map +1 -1
- package/.dist/index.d.ts +2 -2
- package/.dist/index.js +2 -18
- package/.dist/index.js.map +1 -1
- package/.dist/isSame.js +4 -8
- package/.dist/isSame.js.map +1 -1
- package/.dist/reconciler.d.ts +2 -2
- package/.dist/reconciler.js +80 -71
- package/.dist/reconciler.js.map +1 -1
- package/README.md +191 -21
- package/package.json +7 -4
package/.dist/reconciler.js
CHANGED
|
@@ -1,114 +1,126 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
};
|
|
5
|
-
|
|
6
|
-
exports.render = render;
|
|
7
|
-
exports.run = run;
|
|
8
|
-
const react_reconciler_1 = __importDefault(require("react-reconciler"));
|
|
9
|
-
const core_1 = require("@teaui/core");
|
|
10
|
-
const TextReact_1 = require("./components/TextReact");
|
|
11
|
-
const isSame_1 = require("./isSame");
|
|
1
|
+
import ReactReconciler from 'react-reconciler';
|
|
2
|
+
import { DefaultEventPriority } from 'react-reconciler/constants.js';
|
|
3
|
+
import { Accordion, Box, Button, Checkbox, Collapsible, CollapsibleText, ConsoleLog, Digits, Drawer, Dropdown, H1, HotKey, H2, H3, H4, H5, H6, Input, Progress, Screen, Scrollable, Separator, Slider, Space, Spinner, Stack, Tabs, ToggleGroup, Tree, Window, } from '@teaui/core';
|
|
4
|
+
import { TextContainer, TextLiteral, TextProvider, TextStyle, } from './components/TextReact.js';
|
|
5
|
+
import { isSame } from './isSame.js';
|
|
12
6
|
function createInstance(type, props) {
|
|
13
7
|
switch (type) {
|
|
14
8
|
// views
|
|
15
9
|
case 'br':
|
|
16
10
|
case 'tui-br':
|
|
17
|
-
return new
|
|
11
|
+
return new TextLiteral('\n');
|
|
18
12
|
case 'checkbox':
|
|
19
13
|
case 'tui-checkbox':
|
|
20
|
-
return new
|
|
14
|
+
return new Checkbox(props);
|
|
21
15
|
case 'collapsible-text':
|
|
22
16
|
case 'tui-collapsible-text':
|
|
23
|
-
return new
|
|
17
|
+
return new CollapsibleText(props);
|
|
24
18
|
case 'console':
|
|
25
19
|
case 'tui-console':
|
|
26
|
-
return new
|
|
20
|
+
return new ConsoleLog(props);
|
|
27
21
|
case 'digits':
|
|
28
22
|
case 'tui-digits':
|
|
29
|
-
return new
|
|
23
|
+
return new Digits(props);
|
|
24
|
+
case 'dropdown':
|
|
25
|
+
case 'tui-dropdown':
|
|
26
|
+
return new Dropdown(props);
|
|
27
|
+
case 'hotkey':
|
|
28
|
+
case 'tui-hotkey':
|
|
29
|
+
return new HotKey(props);
|
|
30
30
|
case 'h1':
|
|
31
31
|
case 'tui-h1':
|
|
32
|
-
return
|
|
32
|
+
return H1(props.text ?? '');
|
|
33
33
|
case 'h2':
|
|
34
34
|
case 'tui-h2':
|
|
35
|
-
return
|
|
35
|
+
return H2(props.text ?? '');
|
|
36
36
|
case 'h3':
|
|
37
37
|
case 'tui-h3':
|
|
38
|
-
return
|
|
38
|
+
return H3(props.text ?? '');
|
|
39
39
|
case 'h4':
|
|
40
40
|
case 'tui-h4':
|
|
41
|
-
return
|
|
41
|
+
return H4(props.text ?? '');
|
|
42
42
|
case 'h5':
|
|
43
43
|
case 'tui-h5':
|
|
44
|
-
return
|
|
44
|
+
return H5(props.text ?? '');
|
|
45
45
|
case 'h6':
|
|
46
46
|
case 'tui-h6':
|
|
47
|
-
return
|
|
47
|
+
return H6(props.text ?? '');
|
|
48
48
|
case 'input':
|
|
49
49
|
case 'tui-input':
|
|
50
|
-
return new
|
|
50
|
+
return new Input(props);
|
|
51
51
|
case 'separator':
|
|
52
52
|
case 'tui-separator':
|
|
53
|
-
return new
|
|
53
|
+
return new Separator(props);
|
|
54
54
|
case 'slider':
|
|
55
55
|
case 'tui-slider':
|
|
56
|
-
return new
|
|
56
|
+
return new Slider(props);
|
|
57
57
|
case 'space':
|
|
58
58
|
case 'tui-space':
|
|
59
|
-
return new
|
|
59
|
+
return new Space(props);
|
|
60
|
+
case 'progress':
|
|
61
|
+
case 'tui-progress':
|
|
62
|
+
return new Progress(props);
|
|
63
|
+
case 'spinner':
|
|
64
|
+
case 'tui-spinner':
|
|
65
|
+
return new Spinner(props);
|
|
60
66
|
case 'toggle-group':
|
|
61
67
|
case 'tui-toggle-group':
|
|
62
|
-
return new
|
|
68
|
+
return new ToggleGroup(props);
|
|
69
|
+
case 'tree':
|
|
70
|
+
case 'tui-tree':
|
|
71
|
+
return new Tree(props);
|
|
63
72
|
// "simple" containers
|
|
64
73
|
case 'box':
|
|
65
74
|
case 'tui-box':
|
|
66
|
-
return new
|
|
75
|
+
return new Box(props);
|
|
67
76
|
case 'button':
|
|
68
77
|
case 'tui-button':
|
|
69
|
-
return new
|
|
78
|
+
return new Button(props);
|
|
70
79
|
case 'collapsible':
|
|
71
80
|
case 'tui-collapsible':
|
|
72
|
-
return new
|
|
81
|
+
return new Collapsible(props);
|
|
73
82
|
case 'stack':
|
|
74
83
|
case 'tui-stack':
|
|
75
|
-
return new
|
|
84
|
+
return new Stack(props);
|
|
76
85
|
case 'scrollable':
|
|
77
86
|
case 'tui-scrollable':
|
|
78
|
-
return new
|
|
87
|
+
return new Scrollable(props);
|
|
79
88
|
case 'style':
|
|
80
89
|
case 'tui-style':
|
|
81
|
-
return new
|
|
90
|
+
return new TextStyle(props);
|
|
82
91
|
case 'tui-text':
|
|
83
|
-
return new
|
|
92
|
+
return new TextProvider(props);
|
|
84
93
|
// "complex" containers
|
|
85
94
|
case 'accordion':
|
|
86
95
|
case 'tui-accordion':
|
|
87
|
-
return new
|
|
96
|
+
return new Accordion(props);
|
|
88
97
|
case 'accordion-section':
|
|
89
98
|
case 'tui-accordion-section':
|
|
90
|
-
return new
|
|
99
|
+
return new Accordion.Section(props);
|
|
91
100
|
case 'drawer':
|
|
92
101
|
case 'tui-drawer':
|
|
93
|
-
return new
|
|
102
|
+
return new Drawer(props);
|
|
94
103
|
case 'tabs':
|
|
95
104
|
case 'tui-tabs':
|
|
96
|
-
return new
|
|
105
|
+
return new Tabs(props);
|
|
97
106
|
case 'tabs-section':
|
|
98
107
|
case 'tui-tabs-section':
|
|
99
|
-
return new
|
|
108
|
+
return new Tabs.Section(props);
|
|
100
109
|
default:
|
|
101
110
|
throw new Error(`unknown component "${type}"`);
|
|
102
111
|
}
|
|
103
112
|
}
|
|
104
|
-
function render(screen, window, rootNode) {
|
|
113
|
+
export function render(screen, window, rootNode) {
|
|
105
114
|
function rerender() {
|
|
106
115
|
screen.render();
|
|
107
116
|
}
|
|
108
117
|
function removeFromTextContainer(container, child) {
|
|
109
|
-
// find TextContainer with child in it, and remove
|
|
118
|
+
// find TextContainer with child in it, and remove.
|
|
119
|
+
// TextContainer.add() puts TextLiterals/TextStyles into #nodes (accessed
|
|
120
|
+
// via .nodes), NOT into .children (which holds generated Text views).
|
|
121
|
+
// So we check child.parent === node rather than node.children.includes(child).
|
|
110
122
|
for (const node of container.children) {
|
|
111
|
-
if (node instanceof
|
|
123
|
+
if (node instanceof TextContainer && child.parent === node) {
|
|
112
124
|
node.removeChild(child);
|
|
113
125
|
if (node.children.length === 0) {
|
|
114
126
|
container.removeChild(node);
|
|
@@ -121,16 +133,16 @@ function render(screen, window, rootNode) {
|
|
|
121
133
|
if (child.parent === container) {
|
|
122
134
|
container.removeChild(child);
|
|
123
135
|
}
|
|
124
|
-
else if (child instanceof
|
|
136
|
+
else if (child instanceof TextLiteral || child instanceof TextStyle) {
|
|
125
137
|
removeFromTextContainer(container, child);
|
|
126
138
|
}
|
|
127
139
|
}
|
|
128
140
|
function appendChild(parentInstance, child, before) {
|
|
129
|
-
if (parentInstance instanceof
|
|
130
|
-
(child instanceof
|
|
141
|
+
if (parentInstance instanceof TextStyle &&
|
|
142
|
+
(child instanceof TextLiteral || child instanceof TextStyle)) {
|
|
131
143
|
// do not do the TextContainer song and dance
|
|
132
144
|
}
|
|
133
|
-
else if (child instanceof
|
|
145
|
+
else if (child instanceof TextLiteral || child instanceof TextStyle) {
|
|
134
146
|
// find the last child (checking 'before')
|
|
135
147
|
let lastChild = parentInstance.children.at(-1);
|
|
136
148
|
if (before) {
|
|
@@ -140,11 +152,11 @@ function render(screen, window, rootNode) {
|
|
|
140
152
|
}
|
|
141
153
|
}
|
|
142
154
|
let textContainer;
|
|
143
|
-
if (lastChild instanceof
|
|
155
|
+
if (lastChild instanceof TextContainer) {
|
|
144
156
|
textContainer = lastChild;
|
|
145
157
|
}
|
|
146
158
|
else {
|
|
147
|
-
textContainer = new
|
|
159
|
+
textContainer = new TextContainer();
|
|
148
160
|
parentInstance.add(textContainer);
|
|
149
161
|
}
|
|
150
162
|
textContainer.add(child);
|
|
@@ -158,11 +170,9 @@ function render(screen, window, rootNode) {
|
|
|
158
170
|
}
|
|
159
171
|
parentInstance.add(child, index);
|
|
160
172
|
}
|
|
161
|
-
const reconciler = (
|
|
162
|
-
supportsMutation: true,
|
|
173
|
+
const reconciler = ReactReconciler({
|
|
163
174
|
supportsPersistence: false,
|
|
164
175
|
supportsHydration: false,
|
|
165
|
-
noTimeout: undefined,
|
|
166
176
|
isPrimaryRenderer: true,
|
|
167
177
|
getRootHostContext(rootWindow) {
|
|
168
178
|
return { screen, window: rootWindow };
|
|
@@ -185,7 +195,7 @@ function render(screen, window, rootNode) {
|
|
|
185
195
|
return createInstance(type, props);
|
|
186
196
|
},
|
|
187
197
|
createTextInstance(text) {
|
|
188
|
-
return new
|
|
198
|
+
return new TextLiteral(text);
|
|
189
199
|
},
|
|
190
200
|
appendInitialChild(parentInstance, child) {
|
|
191
201
|
appendChild(parentInstance, child, undefined);
|
|
@@ -235,7 +245,7 @@ function render(screen, window, rootNode) {
|
|
|
235
245
|
if (!Object.hasOwn(oldProps, prop)) {
|
|
236
246
|
continue;
|
|
237
247
|
}
|
|
238
|
-
if (!
|
|
248
|
+
if (!isSame(oldProps[prop], newProps[prop])) {
|
|
239
249
|
// difference found - we just return a non-null here to indicate "difference"
|
|
240
250
|
return [];
|
|
241
251
|
}
|
|
@@ -245,7 +255,7 @@ function render(screen, window, rootNode) {
|
|
|
245
255
|
if (Object.hasOwn(oldProps, prop) || !Object.hasOwn(newProps, prop)) {
|
|
246
256
|
continue;
|
|
247
257
|
}
|
|
248
|
-
if (!
|
|
258
|
+
if (!isSame(oldProps[prop], newProps[prop])) {
|
|
249
259
|
// difference found - we just return a non-null here to indicate "difference"
|
|
250
260
|
return [];
|
|
251
261
|
}
|
|
@@ -259,20 +269,16 @@ function render(screen, window, rootNode) {
|
|
|
259
269
|
// }
|
|
260
270
|
node.update(updates);
|
|
261
271
|
},
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
preparePortalMount(_containerInfo) {
|
|
266
|
-
throw new Error('Function not implemented.');
|
|
267
|
-
},
|
|
268
|
-
scheduleTimeout(_fn, _delay) {
|
|
269
|
-
throw new Error('Function not implemented.');
|
|
270
|
-
},
|
|
271
|
-
cancelTimeout(_id) {
|
|
272
|
-
throw new Error('Function not implemented.');
|
|
272
|
+
supportsMutation: true,
|
|
273
|
+
getPublicInstance(instance) {
|
|
274
|
+
return instance;
|
|
273
275
|
},
|
|
276
|
+
preparePortalMount() { },
|
|
277
|
+
scheduleTimeout: setTimeout,
|
|
278
|
+
cancelTimeout: clearTimeout,
|
|
279
|
+
noTimeout: -1,
|
|
274
280
|
getCurrentEventPriority() {
|
|
275
|
-
|
|
281
|
+
return DefaultEventPriority;
|
|
276
282
|
},
|
|
277
283
|
getInstanceFromNode() {
|
|
278
284
|
throw new Error('Function not implemented.');
|
|
@@ -292,11 +298,14 @@ function render(screen, window, rootNode) {
|
|
|
292
298
|
});
|
|
293
299
|
const fiber = reconciler.createContainer(window, 0, null, false, null, '', () => { }, null);
|
|
294
300
|
reconciler.updateContainer(rootNode, fiber, null /* parentComponent */, null /* callback */);
|
|
301
|
+
return function unmount() {
|
|
302
|
+
reconciler.updateContainer(null, fiber, null, null);
|
|
303
|
+
};
|
|
295
304
|
}
|
|
296
|
-
async function run(component, options) {
|
|
297
|
-
const window = new
|
|
298
|
-
const [screen, _] = await
|
|
299
|
-
render(screen, window, component);
|
|
300
|
-
return [screen, window, component];
|
|
305
|
+
export async function run(component, options) {
|
|
306
|
+
const window = new Window();
|
|
307
|
+
const [screen, _] = await Screen.start(window, options);
|
|
308
|
+
const unmount = render(screen, window, component);
|
|
309
|
+
return [screen, window, component, unmount];
|
|
301
310
|
}
|
|
302
311
|
//# sourceMappingURL=reconciler.js.map
|
package/.dist/reconciler.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reconciler.js","sourceRoot":"","sources":["../lib/reconciler.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"reconciler.js","sourceRoot":"","sources":["../lib/reconciler.ts"],"names":[],"mappings":"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"}
|
package/README.md
CHANGED
|
@@ -1,31 +1,201 @@
|
|
|
1
|
-
#
|
|
1
|
+
# @teaui/react
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
React custom renderer for [TeaUI](https://github.com/colinta/teaui). Write fullscreen terminal UIs with React components, hooks, and JSX.
|
|
4
|
+
|
|
5
|
+
## Install
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
pnpm install @teaui/core @teaui/react react
|
|
9
|
+
# TypeScript users:
|
|
10
|
+
pnpm install -D @types/react
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Usage
|
|
5
14
|
|
|
6
15
|
```tsx
|
|
7
|
-
import {useReducer} from 'react'
|
|
16
|
+
import React, {useReducer} from 'react'
|
|
8
17
|
import {interceptConsoleLog} from '@teaui/core'
|
|
9
|
-
import {
|
|
10
|
-
|
|
11
|
-
Button,
|
|
12
|
-
Stack,
|
|
13
|
-
run,
|
|
14
|
-
} from '@teaui/react'
|
|
15
|
-
|
|
16
|
-
// Recommended:
|
|
18
|
+
import {Box, Button, Stack, run} from '@teaui/react'
|
|
19
|
+
|
|
17
20
|
interceptConsoleLog()
|
|
18
21
|
|
|
19
22
|
function App() {
|
|
20
|
-
const [bang,
|
|
21
|
-
|
|
22
|
-
return
|
|
23
|
-
<
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
23
|
+
const [bang, addBang] = useReducer((s) => s + '!', '')
|
|
24
|
+
|
|
25
|
+
return (
|
|
26
|
+
<Box border="single">
|
|
27
|
+
<Stack.down>
|
|
28
|
+
Hello TeaUI{bang}
|
|
29
|
+
<Button onClick={addBang}>Click me</Button>
|
|
30
|
+
</Stack.down>
|
|
31
|
+
</Box>
|
|
32
|
+
)
|
|
28
33
|
}
|
|
29
34
|
|
|
30
|
-
run()
|
|
35
|
+
run(<App />)
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
Compile and run:
|
|
39
|
+
|
|
40
|
+
```bash
|
|
41
|
+
pnpm tsc && node .dist/index.js
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## API
|
|
45
|
+
|
|
46
|
+
### `run(element, options?)`
|
|
47
|
+
|
|
48
|
+
Creates a `Window` and `Screen`, renders the React element tree, and enters fullscreen mode.
|
|
49
|
+
|
|
50
|
+
```ts
|
|
51
|
+
const [screen, window, component, unmount] = await run(<App />)
|
|
31
52
|
```
|
|
53
|
+
|
|
54
|
+
Returns `[Screen, Window, ReactNode, unmount]`. Call `unmount()` to tear down the React tree.
|
|
55
|
+
|
|
56
|
+
### `render(screen, window, element)`
|
|
57
|
+
|
|
58
|
+
Lower-level alternative — mount a React element into an existing `Screen` and `Window`.
|
|
59
|
+
|
|
60
|
+
```ts
|
|
61
|
+
import {Screen, Window} from '@teaui/core'
|
|
62
|
+
import {render} from '@teaui/react'
|
|
63
|
+
|
|
64
|
+
const window = new Window()
|
|
65
|
+
const [screen] = await Screen.start(window)
|
|
66
|
+
const unmount = render(screen, window, <App />)
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
Returns an `unmount()` function.
|
|
70
|
+
|
|
71
|
+
## Components
|
|
72
|
+
|
|
73
|
+
All components are typed wrappers around TeaUI core views. They accept the same props as the core constructors, with `children` mapped to React children.
|
|
74
|
+
|
|
75
|
+
### Views (leaf nodes)
|
|
76
|
+
|
|
77
|
+
| Component | Element | Description |
|
|
78
|
+
|-----------|---------|-------------|
|
|
79
|
+
| `<Br />` | `<tui-br>` | Line break in text |
|
|
80
|
+
| `<Checkbox />` | `<tui-checkbox>` | Toggle checkbox |
|
|
81
|
+
| `<CollapsibleText />` | `<tui-collapsible-text>` | Text that truncates with expand/collapse |
|
|
82
|
+
| `<ConsoleLog />` | `<tui-console>` | Displays intercepted `console.log` output |
|
|
83
|
+
| `<Digits />` | `<tui-digits>` | Large-font digit display |
|
|
84
|
+
| `<H1 />`–`<H6 />` | `<tui-h1>`–`<tui-h6>` | Header text |
|
|
85
|
+
| `<Input />` | `<tui-input>` | Text input field |
|
|
86
|
+
| `<Separator />` | `<tui-separator>` | Horizontal or vertical line |
|
|
87
|
+
| `<Slider />` | `<tui-slider>` | Value slider |
|
|
88
|
+
| `<Space />` | `<tui-space>` | Empty spacer |
|
|
89
|
+
| `<ToggleGroup />` | `<tui-toggle-group>` | Group of toggle options |
|
|
90
|
+
|
|
91
|
+
`Separator` has `.horizontal` and `.vertical` variants. `Slider` has `.horizontal` and `.vertical` variants.
|
|
92
|
+
|
|
93
|
+
### Containers
|
|
94
|
+
|
|
95
|
+
| Component | Element | Description |
|
|
96
|
+
|-----------|---------|-------------|
|
|
97
|
+
| `<Box />` | `<tui-box>` | Box with optional border and padding |
|
|
98
|
+
| `<Button />` | `<tui-button>` | Clickable button |
|
|
99
|
+
| `<Collapsible />` | `<tui-collapsible>` | Toggle between `collapsed` and `expanded` content |
|
|
100
|
+
| `<Scrollable />` | `<tui-scrollable>` | Scrollable content region |
|
|
101
|
+
| `<Stack />` | `<tui-stack>` | Linear layout |
|
|
102
|
+
| `<Text />` | `<tui-text>` | Text container (sets font, alignment, wrap) |
|
|
103
|
+
| `<Style />` | `<tui-style>` | Inline text styles (bold, italic, etc.) |
|
|
104
|
+
|
|
105
|
+
`Stack` has `.down`, `.up`, `.left`, and `.right` variants.
|
|
106
|
+
|
|
107
|
+
### Complex Containers
|
|
108
|
+
|
|
109
|
+
| Component | Element | Description |
|
|
110
|
+
|-----------|---------|-------------|
|
|
111
|
+
| `<Accordion />` | `<tui-accordion>` | Expandable section group |
|
|
112
|
+
| `<Accordion.Section />` | `<tui-accordion-section>` | Section within an accordion |
|
|
113
|
+
| `<Drawer />` | `<tui-drawer>` | Panel that slides in from an edge |
|
|
114
|
+
| `<Tabs />` | `<tui-tabs>` | Tabbed container |
|
|
115
|
+
| `<Tabs.Section />` | `<tui-tabs-section>` | Tab within tabs |
|
|
116
|
+
| `<Tree />` | `<tui-tree>` | Tree view with expandable nodes |
|
|
117
|
+
|
|
118
|
+
`Drawer` has `.top`, `.right`, `.bottom`, and `.left` variants. Each accepts `content` and `drawer` props for the two panes.
|
|
119
|
+
|
|
120
|
+
### Intrinsic Elements
|
|
121
|
+
|
|
122
|
+
You can also use the `tui-` prefixed JSX elements directly:
|
|
123
|
+
|
|
124
|
+
```tsx
|
|
125
|
+
<tui-stack direction="down">
|
|
126
|
+
<tui-box border="single" width={20}>
|
|
127
|
+
<tui-text alignment="center">Hello</tui-text>
|
|
128
|
+
</tui-box>
|
|
129
|
+
</tui-stack>
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
## Text Handling
|
|
133
|
+
|
|
134
|
+
React string literals are rendered as `TextLiteral` nodes, which are automatically grouped into `TextContainer`s for layout:
|
|
135
|
+
|
|
136
|
+
```tsx
|
|
137
|
+
<Stack.down>
|
|
138
|
+
hello {/* TextLiteral → TextContainer #1 */}
|
|
139
|
+
<Br /> {/* TextLiteral → TextContainer #1 */}
|
|
140
|
+
<Box /> {/* Box breaks the text group */}
|
|
141
|
+
goodbye {/* TextLiteral → TextContainer #2 */}
|
|
142
|
+
</Stack.down>
|
|
143
|
+
```
|
|
144
|
+
|
|
145
|
+
Use `<Text>` to control font, alignment, and word wrap. Use `<Style>` for inline formatting (bold, italic, etc.):
|
|
146
|
+
|
|
147
|
+
```tsx
|
|
148
|
+
<Text alignment="center" wrap>
|
|
149
|
+
This is <Style bold>important</Style> text.
|
|
150
|
+
</Text>
|
|
151
|
+
```
|
|
152
|
+
|
|
153
|
+
## React Features
|
|
154
|
+
|
|
155
|
+
| Feature | Status |
|
|
156
|
+
|---------|--------|
|
|
157
|
+
| Hooks (`useState`, `useReducer`, `useEffect`, etc.) | ✅ Works |
|
|
158
|
+
| Context (`useContext`, providers) | ✅ Works |
|
|
159
|
+
| Refs (`useRef`, callback refs) | ✅ Works |
|
|
160
|
+
| Suspense | ✅ Supported (timeouts delegate to `setTimeout`) |
|
|
161
|
+
| Portals | ⚠️ No-op (doesn't crash, but no portal behavior) |
|
|
162
|
+
| Error Boundaries | Not yet supported |
|
|
163
|
+
|
|
164
|
+
## Tests
|
|
165
|
+
|
|
166
|
+
```bash
|
|
167
|
+
pnpm test # run once
|
|
168
|
+
pnpm test:watch # watch mode
|
|
169
|
+
```
|
|
170
|
+
|
|
171
|
+
Tests use [vitest](https://vitest.dev/) and cover:
|
|
172
|
+
|
|
173
|
+
- **`isSame.test.ts`** — Deep equality comparisons (primitives, arrays, Sets, Maps, Dates, objects, React fiber nodes)
|
|
174
|
+
- **`reconciler.test.ts`** — Rendering, child manipulation, text node grouping, updates, refs, unmount
|
|
175
|
+
- **`components.test.ts`** — All component wrappers render the correct view types; Drawer variants pass `content`/`drawer` props
|
|
176
|
+
|
|
177
|
+
## Architecture
|
|
178
|
+
|
|
179
|
+
```
|
|
180
|
+
@teaui/react
|
|
181
|
+
├── lib/
|
|
182
|
+
│ ├── index.ts # Re-exports reconciler + components
|
|
183
|
+
│ ├── reconciler.ts # react-reconciler host config, render(), run()
|
|
184
|
+
│ ├── isSame.ts # Deep equality for prepareUpdate
|
|
185
|
+
│ ├── components.tsx # Typed React wrappers + JSX IntrinsicElements
|
|
186
|
+
│ └── components/
|
|
187
|
+
│ └── TextReact.ts # TextLiteral, TextContainer, TextProvider, TextStyle
|
|
188
|
+
├── tests/
|
|
189
|
+
│ ├── isSame.test.ts
|
|
190
|
+
│ ├── reconciler.test.tsx
|
|
191
|
+
│ └── components.test.tsx
|
|
192
|
+
└── vitest.config.ts
|
|
193
|
+
```
|
|
194
|
+
|
|
195
|
+
**`reconciler.ts`** implements the `react-reconciler` host config. It maps JSX element types to TeaUI view constructors in `createInstance`, manages the view tree via `appendChild`/`removeChild`/`insertBefore`, and applies prop updates via `commitUpdate` (which calls `view.update()`). Text string children become `TextLiteral` instances. The `prepareUpdate` function uses `isSame` to diff old and new props — if anything changed, `commitUpdate` passes the full new props to the view.
|
|
196
|
+
|
|
197
|
+
**`components/TextReact.ts`** defines the text rendering architecture. Adjacent `TextLiteral` nodes are grouped into a `TextContainer`, which handles layout. `TextProvider` (`<Text>`) sets text properties (font, alignment, wrap) for descendant text. `TextStyle` (`<Style>`) applies inline SGR styles without affecting layout properties.
|
|
198
|
+
|
|
199
|
+
## License
|
|
200
|
+
|
|
201
|
+
MIT
|
package/package.json
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
{
|
|
2
|
+
"type": "module",
|
|
2
3
|
"name": "@teaui/react",
|
|
3
4
|
"description": "React Reconciler and renderer for TeaUI",
|
|
4
5
|
"author": "Colin T.A. Gray <colinta@colinta.com>",
|
|
5
6
|
"contributors": [],
|
|
6
|
-
"version": "1.
|
|
7
|
+
"version": "1.5.8",
|
|
7
8
|
"license": "MIT",
|
|
8
9
|
"preferGlobal": false,
|
|
9
10
|
"repository": {
|
|
@@ -41,15 +42,17 @@
|
|
|
41
42
|
"react-reconciler": "^0.29.0"
|
|
42
43
|
},
|
|
43
44
|
"dependencies": {
|
|
44
|
-
"@teaui/core": "1.
|
|
45
|
+
"@teaui/core": "1.5.8"
|
|
45
46
|
},
|
|
46
47
|
"devDependencies": {
|
|
47
48
|
"@types/react": "^18.2.39",
|
|
48
49
|
"@types/react-reconciler": "^0.28.8",
|
|
49
|
-
"@teaui/shared": "1.
|
|
50
|
+
"@teaui/shared": "1.5.8"
|
|
50
51
|
},
|
|
51
52
|
"scripts": {
|
|
52
53
|
"clean": "rm -rf .dist/",
|
|
53
|
-
"build": "pnpm clean && pnpm tsc"
|
|
54
|
+
"build": "pnpm clean && pnpm tsc",
|
|
55
|
+
"test": "vitest run",
|
|
56
|
+
"test:watch": "vitest"
|
|
54
57
|
}
|
|
55
58
|
}
|