@opentui/core 0.1.1 → 0.1.3

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.
Files changed (15) hide show
  1. package/3d.js +807 -274
  2. package/README.md +4 -4
  3. package/Renderable.d.ts +52 -28
  4. package/index.d.ts +1 -0
  5. package/index.js +627 -325
  6. package/lib/TrackedNode.d.ts +0 -1
  7. package/lib/yoga.options.d.ts +31 -0
  8. package/package.json +8 -8
  9. package/renderables/ASCIIFont.d.ts +1 -1
  10. package/renderables/Box.d.ts +4 -4
  11. package/renderables/Input.d.ts +23 -20
  12. package/renderables/Select.d.ts +37 -25
  13. package/renderables/TabSelect.d.ts +1 -1
  14. package/renderables/Text.d.ts +1 -1
  15. package/LICENSE +0 -21
package/README.md CHANGED
@@ -1,8 +1,7 @@
1
- # OpenTUI
1
+ # OpenTUI Core
2
2
 
3
- OpenTUI is a TypeScript library for building terminal user interfaces (TUIs). It is currently in
4
- development and is not ready for production use. It will be the foundational TUI framework for both
5
- [opencode](https://opencode.ai) and [terminaldotshop](https://terminal.shop).
3
+ OpenTUI Core is a TypeScript library for building terminal user interfaces (TUIs). It is currently in
4
+ development and is not ready for production use.
6
5
 
7
6
  ## Install
8
7
 
@@ -21,6 +20,7 @@ This creates platform-specific libraries that are automatically loaded by the Ty
21
20
  ## Examples
22
21
 
23
22
  ```bash
23
+ bun install
24
24
  bun run src/examples/index.ts
25
25
  ```
26
26
 
package/Renderable.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { OptimizedBuffer, type RenderContext, type MouseEvent, type SelectionState } from ".";
2
2
  import { EventEmitter } from "events";
3
- import { FlexDirection, Direction, PositionType, Edge, Align, Justify } from "yoga-layout";
4
3
  import { TrackedNode } from "./lib/TrackedNode";
5
4
  import type { ParsedKey } from "./lib/parse.keypress";
6
5
  import { type KeyHandler } from "./lib/KeyHandler";
6
+ import { type AlignString, type FlexDirectionString, type JustifyString, type PositionTypeString } from "./lib/yoga.options";
7
7
  export declare enum LayoutEvents {
8
8
  LAYOUT_CHANGED = "layout-changed",
9
9
  ADDED = "added",
@@ -14,7 +14,6 @@ export declare enum RenderableEvents {
14
14
  FOCUSED = "focused",
15
15
  BLURRED = "blurred"
16
16
  }
17
- export { Justify, Align, FlexDirection, Direction, PositionType, Edge };
18
17
  export interface Position {
19
18
  top?: number | "auto" | `${number}%`;
20
19
  right?: number | "auto" | `${number}%`;
@@ -24,28 +23,29 @@ export interface Position {
24
23
  export interface LayoutOptions {
25
24
  flexGrow?: number;
26
25
  flexShrink?: number;
27
- flexDirection?: FlexDirection;
28
- alignItems?: Align;
29
- justifyContent?: Justify;
26
+ flexDirection?: FlexDirectionString;
27
+ alignItems?: AlignString;
28
+ justifyContent?: JustifyString;
30
29
  flexBasis?: number | "auto" | undefined;
31
- positionType?: "absolute" | "relative";
32
- position?: Position;
30
+ positionType?: PositionTypeString;
31
+ top?: number | "auto" | `${number}%`;
32
+ right?: number | "auto" | `${number}%`;
33
+ bottom?: number | "auto" | `${number}%`;
34
+ left?: number | "auto" | `${number}%`;
33
35
  minWidth?: number;
34
36
  minHeight?: number;
35
37
  maxWidth?: number;
36
38
  maxHeight?: number;
37
- margin?: {
38
- top?: number;
39
- right?: number;
40
- bottom?: number;
41
- left?: number;
42
- } | number | "auto" | `${number}%`;
43
- padding?: {
44
- top?: number;
45
- right?: number;
46
- bottom?: number;
47
- left?: number;
48
- } | number | `${number}%`;
39
+ margin?: number | "auto" | `${number}%`;
40
+ marginTop?: number | "auto" | `${number}%`;
41
+ marginRight?: number | "auto" | `${number}%`;
42
+ marginBottom?: number | "auto" | `${number}%`;
43
+ marginLeft?: number | "auto" | `${number}%`;
44
+ padding?: number | `${number}%`;
45
+ paddingTop?: number | `${number}%`;
46
+ paddingRight?: number | `${number}%`;
47
+ paddingBottom?: number | `${number}%`;
48
+ paddingLeft?: number | `${number}%`;
49
49
  enableLayout?: boolean;
50
50
  }
51
51
  export interface RenderableOptions extends Partial<LayoutOptions> {
@@ -55,6 +55,12 @@ export interface RenderableOptions extends Partial<LayoutOptions> {
55
55
  visible?: boolean;
56
56
  buffered?: boolean;
57
57
  }
58
+ export declare function isMarginType(value: any): value is number | "auto" | `${number}%`;
59
+ export declare function isPaddingType(value: any): value is number | `${number}%`;
60
+ export declare function isPositionType(value: any): value is number | "auto" | `${number}%`;
61
+ export declare function isDimensionType(value: any): value is number | "auto" | `${number}%`;
62
+ export declare function isFlexBasisType(value: any): value is number | "auto" | undefined;
63
+ export declare function isSizeType(value: any): value is number | `${number}%` | undefined;
58
64
  export declare abstract class Renderable extends EventEmitter {
59
65
  static renderablesByNumber: Map<number, Renderable>;
60
66
  readonly id: string;
@@ -77,7 +83,7 @@ export declare abstract class Renderable extends EventEmitter {
77
83
  protected keyHandler: KeyHandler;
78
84
  protected keypressHandler: ((key: ParsedKey) => void) | null;
79
85
  protected layoutNode: TrackedNode;
80
- protected _positionType: "absolute" | "relative";
86
+ protected _positionType: PositionTypeString;
81
87
  protected _position: Position;
82
88
  private renderableMap;
83
89
  private renderableArray;
@@ -100,8 +106,14 @@ export declare abstract class Renderable extends EventEmitter {
100
106
  needsUpdate(): void;
101
107
  get x(): number;
102
108
  set x(value: number);
103
- set top(value: number);
104
- set left(value: number);
109
+ get top(): number | "auto" | `${number}%` | undefined;
110
+ set top(value: number | "auto" | `${number}%` | undefined);
111
+ get right(): number | "auto" | `${number}%` | undefined;
112
+ set right(value: number | "auto" | `${number}%` | undefined);
113
+ get bottom(): number | "auto" | `${number}%` | undefined;
114
+ set bottom(value: number | "auto" | `${number}%` | undefined);
115
+ get left(): number | "auto" | `${number}%` | undefined;
116
+ set left(value: number | "auto" | `${number}%` | undefined);
105
117
  get y(): number;
106
118
  set y(value: number);
107
119
  get width(): number;
@@ -113,18 +125,29 @@ export declare abstract class Renderable extends EventEmitter {
113
125
  requestZIndexSort(): void;
114
126
  private ensureZIndexSorted;
115
127
  private setupYogaProperties;
128
+ private setupMarginAndPadding;
116
129
  setPosition(position: Position): void;
117
130
  private updateYogaPosition;
118
131
  set flexGrow(grow: number);
119
132
  set flexShrink(shrink: number);
120
- set flexDirection(direction: FlexDirection);
121
- set alignItems(alignItems: Align);
122
- set justifyContent(justifyContent: Justify);
133
+ set flexDirection(direction: FlexDirectionString);
134
+ set alignItems(alignItems: AlignString);
135
+ set justifyContent(justifyContent: JustifyString);
123
136
  set flexBasis(basis: number | "auto" | undefined);
124
137
  set minWidth(minWidth: number | `${number}%` | undefined);
125
138
  set maxWidth(maxWidth: number | `${number}%` | undefined);
126
139
  set minHeight(minHeight: number | `${number}%` | undefined);
127
140
  set maxHeight(maxHeight: number | `${number}%` | undefined);
141
+ set margin(margin: number | "auto" | `${number}%` | undefined);
142
+ set marginTop(margin: number | "auto" | `${number}%` | undefined);
143
+ set marginRight(margin: number | "auto" | `${number}%` | undefined);
144
+ set marginBottom(margin: number | "auto" | `${number}%` | undefined);
145
+ set marginLeft(margin: number | "auto" | `${number}%` | undefined);
146
+ set padding(padding: number | `${number}%` | undefined);
147
+ set paddingTop(padding: number | `${number}%` | undefined);
148
+ set paddingRight(padding: number | `${number}%` | undefined);
149
+ set paddingBottom(padding: number | `${number}%` | undefined);
150
+ set paddingLeft(padding: number | `${number}%` | undefined);
128
151
  getLayoutNode(): TrackedNode;
129
152
  updateFromLayout(): void;
130
153
  protected onLayoutResize(width: number, height: number): void;
@@ -132,7 +155,9 @@ export declare abstract class Renderable extends EventEmitter {
132
155
  protected createFrameBuffer(): void;
133
156
  protected onResize(width: number, height: number): void;
134
157
  protected requestLayout(): void;
135
- add(obj: Renderable): void;
158
+ private replaceParent;
159
+ add(obj: Renderable, index?: number): number;
160
+ insertBefore(obj: Renderable, anchor?: Renderable): number;
136
161
  propagateContext(ctx: RenderContext | null): void;
137
162
  getRenderable(id: string): Renderable | undefined;
138
163
  remove(id: string): void;
@@ -141,6 +166,7 @@ export declare abstract class Renderable extends EventEmitter {
141
166
  protected beforeRender(): void;
142
167
  protected renderSelf(buffer: OptimizedBuffer, deltaTime: number): void;
143
168
  destroy(): void;
169
+ destroyRecursively(): void;
144
170
  protected destroySelf(): void;
145
171
  processMouseEvent(event: MouseEvent): void;
146
172
  protected onMouseEvent(event: MouseEvent): void;
@@ -148,8 +174,6 @@ export declare abstract class Renderable extends EventEmitter {
148
174
  export declare class RootRenderable extends Renderable {
149
175
  private yogaConfig;
150
176
  constructor(width: number, height: number, ctx: RenderContext);
151
- add(obj: Renderable): void;
152
- remove(id: string): void;
153
177
  requestLayout(): void;
154
178
  calculateLayout(): void;
155
179
  resize(width: number, height: number): void;
package/index.d.ts CHANGED
@@ -11,3 +11,4 @@ export * from "./lib/styled-text";
11
11
  export * from "./lib/selection";
12
12
  export * from "./renderer";
13
13
  export * from "./renderables";
14
+ export * from "./zig";