@opentui/core 0.1.9 → 0.1.11
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/index.js +159 -92
- package/index.js.map +6 -6
- package/package.json +7 -7
- package/renderables/Box.d.ts +11 -2
- package/renderables/Input.d.ts +18 -7
- package/renderables/Select.d.ts +24 -9
package/index.js
CHANGED
|
@@ -9556,19 +9556,28 @@ class BoxRenderable extends Renderable {
|
|
|
9556
9556
|
shouldFill;
|
|
9557
9557
|
_title;
|
|
9558
9558
|
_titleAlignment;
|
|
9559
|
+
_defaultOptions = {
|
|
9560
|
+
backgroundColor: "transparent",
|
|
9561
|
+
borderStyle: "single",
|
|
9562
|
+
border: false,
|
|
9563
|
+
borderColor: "#FFFFFF",
|
|
9564
|
+
shouldFill: true,
|
|
9565
|
+
titleAlignment: "left",
|
|
9566
|
+
focusedBorderColor: "#00AAFF"
|
|
9567
|
+
};
|
|
9559
9568
|
constructor(id, options) {
|
|
9560
9569
|
super(id, options);
|
|
9561
|
-
this._backgroundColor = parseColor(options.backgroundColor ||
|
|
9562
|
-
this._border = options.border ??
|
|
9563
|
-
this._borderStyle = options.borderStyle ||
|
|
9564
|
-
this._borderColor = parseColor(options.borderColor ||
|
|
9565
|
-
this._focusedBorderColor = parseColor(options.focusedBorderColor ||
|
|
9570
|
+
this._backgroundColor = parseColor(options.backgroundColor || this._defaultOptions.backgroundColor);
|
|
9571
|
+
this._border = options.border ?? this._defaultOptions.border;
|
|
9572
|
+
this._borderStyle = options.borderStyle || this._defaultOptions.borderStyle;
|
|
9573
|
+
this._borderColor = parseColor(options.borderColor || this._defaultOptions.borderColor);
|
|
9574
|
+
this._focusedBorderColor = parseColor(options.focusedBorderColor || this._defaultOptions.focusedBorderColor);
|
|
9566
9575
|
this._customBorderCharsObj = options.customBorderChars;
|
|
9567
9576
|
this._customBorderChars = this._customBorderCharsObj ? borderCharsToArray(this._customBorderCharsObj) : undefined;
|
|
9568
9577
|
this.borderSides = getBorderSides(this._border);
|
|
9569
|
-
this.shouldFill = options.shouldFill ??
|
|
9578
|
+
this.shouldFill = options.shouldFill ?? this._defaultOptions.shouldFill;
|
|
9570
9579
|
this._title = options.title;
|
|
9571
|
-
this._titleAlignment = options.titleAlignment ||
|
|
9580
|
+
this._titleAlignment = options.titleAlignment || this._defaultOptions.titleAlignment;
|
|
9572
9581
|
this.applyYogaBorders();
|
|
9573
9582
|
}
|
|
9574
9583
|
get customBorderChars() {
|
|
@@ -9583,12 +9592,10 @@ class BoxRenderable extends Renderable {
|
|
|
9583
9592
|
return this._backgroundColor;
|
|
9584
9593
|
}
|
|
9585
9594
|
set backgroundColor(value) {
|
|
9586
|
-
|
|
9587
|
-
|
|
9588
|
-
|
|
9589
|
-
|
|
9590
|
-
this.needsUpdate();
|
|
9591
|
-
}
|
|
9595
|
+
const newColor = parseColor(value ?? this._defaultOptions.backgroundColor);
|
|
9596
|
+
if (this._backgroundColor !== newColor) {
|
|
9597
|
+
this._backgroundColor = newColor;
|
|
9598
|
+
this.needsUpdate();
|
|
9592
9599
|
}
|
|
9593
9600
|
}
|
|
9594
9601
|
get border() {
|
|
@@ -9606,8 +9613,9 @@ class BoxRenderable extends Renderable {
|
|
|
9606
9613
|
return this._borderStyle;
|
|
9607
9614
|
}
|
|
9608
9615
|
set borderStyle(value) {
|
|
9609
|
-
|
|
9610
|
-
|
|
9616
|
+
let _value = value ?? this._defaultOptions.borderStyle;
|
|
9617
|
+
if (this._borderStyle !== _value) {
|
|
9618
|
+
this._borderStyle = _value;
|
|
9611
9619
|
this._customBorderChars = undefined;
|
|
9612
9620
|
this.needsUpdate();
|
|
9613
9621
|
}
|
|
@@ -9616,7 +9624,7 @@ class BoxRenderable extends Renderable {
|
|
|
9616
9624
|
return this._borderColor;
|
|
9617
9625
|
}
|
|
9618
9626
|
set borderColor(value) {
|
|
9619
|
-
const newColor = parseColor(value);
|
|
9627
|
+
const newColor = parseColor(value ?? this._defaultOptions.borderColor);
|
|
9620
9628
|
if (this._borderColor !== newColor) {
|
|
9621
9629
|
this._borderColor = newColor;
|
|
9622
9630
|
this.needsUpdate();
|
|
@@ -9626,7 +9634,7 @@ class BoxRenderable extends Renderable {
|
|
|
9626
9634
|
return this._focusedBorderColor;
|
|
9627
9635
|
}
|
|
9628
9636
|
set focusedBorderColor(value) {
|
|
9629
|
-
const newColor = parseColor(value);
|
|
9637
|
+
const newColor = parseColor(value ?? this._defaultOptions.focusedBorderColor);
|
|
9630
9638
|
if (this._focusedBorderColor !== newColor) {
|
|
9631
9639
|
this._focusedBorderColor = newColor;
|
|
9632
9640
|
if (this._focused) {
|
|
@@ -9800,20 +9808,11 @@ class TextRenderable extends Renderable {
|
|
|
9800
9808
|
const lineInfo = this.textBuffer.lineInfo;
|
|
9801
9809
|
this._lineInfo.lineStarts = lineInfo.lineStarts;
|
|
9802
9810
|
this._lineInfo.lineWidths = lineInfo.lineWidths;
|
|
9803
|
-
const numLines = this._lineInfo.lineStarts.length;
|
|
9804
|
-
if (this._positionType === "absolute" && this._height === "auto") {
|
|
9805
|
-
this._heightValue = numLines;
|
|
9806
|
-
this.layoutNode.yogaNode.markDirty();
|
|
9807
|
-
}
|
|
9808
|
-
const maxLineWidth = Math.max(...this._lineInfo.lineWidths);
|
|
9809
|
-
if (this._positionType === "absolute" && this._width === "auto") {
|
|
9810
|
-
this._widthValue = maxLineWidth;
|
|
9811
|
-
this.layoutNode.yogaNode.markDirty();
|
|
9812
|
-
}
|
|
9813
9811
|
const changed = this.selectionHelper.reevaluateSelection(this.width, this.height);
|
|
9814
9812
|
if (changed) {
|
|
9815
9813
|
this.syncSelectionToTextBuffer();
|
|
9816
9814
|
}
|
|
9815
|
+
this.layoutNode.yogaNode.markDirty();
|
|
9817
9816
|
this.needsUpdate();
|
|
9818
9817
|
}
|
|
9819
9818
|
setupMeasureFunc() {
|
|
@@ -10037,19 +10036,30 @@ class InputRenderable extends Renderable {
|
|
|
10037
10036
|
_cursorColor;
|
|
10038
10037
|
_maxLength;
|
|
10039
10038
|
_lastCommittedValue = "";
|
|
10039
|
+
_defaultOptions = {
|
|
10040
|
+
backgroundColor: "transparent",
|
|
10041
|
+
textColor: "#FFFFFF",
|
|
10042
|
+
focusedBackgroundColor: "#1a1a1a",
|
|
10043
|
+
focusedTextColor: "#FFFFFF",
|
|
10044
|
+
placeholder: "",
|
|
10045
|
+
placeholderColor: "#666666",
|
|
10046
|
+
cursorColor: "#FFFFFF",
|
|
10047
|
+
maxLength: 1000,
|
|
10048
|
+
value: ""
|
|
10049
|
+
};
|
|
10040
10050
|
constructor(id, options) {
|
|
10041
10051
|
super(id, { ...options, buffered: true });
|
|
10042
|
-
this._backgroundColor = parseColor(options.backgroundColor ||
|
|
10043
|
-
this._textColor = parseColor(options.textColor ||
|
|
10044
|
-
this._focusedBackgroundColor = parseColor(options.focusedBackgroundColor || options.backgroundColor ||
|
|
10045
|
-
this._focusedTextColor = parseColor(options.focusedTextColor || options.textColor ||
|
|
10046
|
-
this._placeholder = options.placeholder ||
|
|
10047
|
-
this._value = options.value ||
|
|
10052
|
+
this._backgroundColor = parseColor(options.backgroundColor || this._defaultOptions.backgroundColor);
|
|
10053
|
+
this._textColor = parseColor(options.textColor || this._defaultOptions.textColor);
|
|
10054
|
+
this._focusedBackgroundColor = parseColor(options.focusedBackgroundColor || options.backgroundColor || this._defaultOptions.focusedBackgroundColor);
|
|
10055
|
+
this._focusedTextColor = parseColor(options.focusedTextColor || options.textColor || this._defaultOptions.focusedTextColor);
|
|
10056
|
+
this._placeholder = options.placeholder || this._defaultOptions.placeholder;
|
|
10057
|
+
this._value = options.value || this._defaultOptions.value;
|
|
10048
10058
|
this._lastCommittedValue = this._value;
|
|
10049
10059
|
this._cursorPosition = this._value.length;
|
|
10050
|
-
this._maxLength = options.maxLength ||
|
|
10051
|
-
this._placeholderColor = parseColor(options.placeholderColor ||
|
|
10052
|
-
this._cursorColor = parseColor(options.cursorColor ||
|
|
10060
|
+
this._maxLength = options.maxLength || this._defaultOptions.maxLength;
|
|
10061
|
+
this._placeholderColor = parseColor(options.placeholderColor || this._defaultOptions.placeholderColor);
|
|
10062
|
+
this._cursorColor = parseColor(options.cursorColor || this._defaultOptions.cursorColor);
|
|
10053
10063
|
}
|
|
10054
10064
|
updateCursorPosition() {
|
|
10055
10065
|
if (!this._focused)
|
|
@@ -10219,29 +10229,47 @@ class InputRenderable extends Renderable {
|
|
|
10219
10229
|
this.needsUpdate();
|
|
10220
10230
|
}
|
|
10221
10231
|
}
|
|
10222
|
-
set backgroundColor(
|
|
10223
|
-
|
|
10224
|
-
this.
|
|
10232
|
+
set backgroundColor(value) {
|
|
10233
|
+
const newColor = parseColor(value ?? this._defaultOptions.backgroundColor);
|
|
10234
|
+
if (this._backgroundColor !== newColor) {
|
|
10235
|
+
this._backgroundColor = newColor;
|
|
10236
|
+
this.needsUpdate();
|
|
10237
|
+
}
|
|
10225
10238
|
}
|
|
10226
|
-
set textColor(
|
|
10227
|
-
|
|
10228
|
-
this.
|
|
10239
|
+
set textColor(value) {
|
|
10240
|
+
const newColor = parseColor(value ?? this._defaultOptions.textColor);
|
|
10241
|
+
if (this._textColor !== newColor) {
|
|
10242
|
+
this._textColor = newColor;
|
|
10243
|
+
this.needsUpdate();
|
|
10244
|
+
}
|
|
10229
10245
|
}
|
|
10230
|
-
set focusedBackgroundColor(
|
|
10231
|
-
|
|
10232
|
-
this.
|
|
10246
|
+
set focusedBackgroundColor(value) {
|
|
10247
|
+
const newColor = parseColor(value ?? this._defaultOptions.focusedBackgroundColor);
|
|
10248
|
+
if (this._focusedBackgroundColor !== newColor) {
|
|
10249
|
+
this._focusedBackgroundColor = newColor;
|
|
10250
|
+
this.needsUpdate();
|
|
10251
|
+
}
|
|
10233
10252
|
}
|
|
10234
|
-
set focusedTextColor(
|
|
10235
|
-
|
|
10236
|
-
this.
|
|
10253
|
+
set focusedTextColor(value) {
|
|
10254
|
+
const newColor = parseColor(value ?? this._defaultOptions.focusedTextColor);
|
|
10255
|
+
if (this._focusedTextColor !== newColor) {
|
|
10256
|
+
this._focusedTextColor = newColor;
|
|
10257
|
+
this.needsUpdate();
|
|
10258
|
+
}
|
|
10237
10259
|
}
|
|
10238
|
-
set placeholderColor(
|
|
10239
|
-
|
|
10240
|
-
this.
|
|
10260
|
+
set placeholderColor(value) {
|
|
10261
|
+
const newColor = parseColor(value ?? this._defaultOptions.placeholderColor);
|
|
10262
|
+
if (this._placeholderColor !== newColor) {
|
|
10263
|
+
this._placeholderColor = newColor;
|
|
10264
|
+
this.needsUpdate();
|
|
10265
|
+
}
|
|
10241
10266
|
}
|
|
10242
|
-
set cursorColor(
|
|
10243
|
-
|
|
10244
|
-
this.
|
|
10267
|
+
set cursorColor(value) {
|
|
10268
|
+
const newColor = parseColor(value ?? this._defaultOptions.cursorColor);
|
|
10269
|
+
if (this._cursorColor !== newColor) {
|
|
10270
|
+
this._cursorColor = newColor;
|
|
10271
|
+
this.needsUpdate();
|
|
10272
|
+
}
|
|
10245
10273
|
}
|
|
10246
10274
|
updateFromLayout() {
|
|
10247
10275
|
super.updateFromLayout();
|
|
@@ -10287,27 +10315,42 @@ class SelectRenderable extends Renderable {
|
|
|
10287
10315
|
linesPerItem;
|
|
10288
10316
|
fontHeight;
|
|
10289
10317
|
_fastScrollStep;
|
|
10318
|
+
_defaultOptions = {
|
|
10319
|
+
backgroundColor: "transparent",
|
|
10320
|
+
textColor: "#FFFFFF",
|
|
10321
|
+
focusedBackgroundColor: "#1a1a1a",
|
|
10322
|
+
focusedTextColor: "#FFFFFF",
|
|
10323
|
+
selectedBackgroundColor: "#334455",
|
|
10324
|
+
selectedTextColor: "#FFFF00",
|
|
10325
|
+
descriptionColor: "#888888",
|
|
10326
|
+
selectedDescriptionColor: "#CCCCCC",
|
|
10327
|
+
showScrollIndicator: false,
|
|
10328
|
+
wrapSelection: false,
|
|
10329
|
+
showDescription: true,
|
|
10330
|
+
itemSpacing: 0,
|
|
10331
|
+
fastScrollStep: 5
|
|
10332
|
+
};
|
|
10290
10333
|
constructor(id, options) {
|
|
10291
10334
|
super(id, { ...options, buffered: true });
|
|
10292
|
-
this._backgroundColor = parseColor(options.backgroundColor ||
|
|
10293
|
-
this._textColor = parseColor(options.textColor ||
|
|
10294
|
-
this._focusedBackgroundColor = parseColor(options.focusedBackgroundColor ||
|
|
10295
|
-
this._focusedTextColor = parseColor(options.focusedTextColor ||
|
|
10335
|
+
this._backgroundColor = parseColor(options.backgroundColor || this._defaultOptions.backgroundColor);
|
|
10336
|
+
this._textColor = parseColor(options.textColor || this._defaultOptions.textColor);
|
|
10337
|
+
this._focusedBackgroundColor = parseColor(options.focusedBackgroundColor || this._defaultOptions.focusedBackgroundColor);
|
|
10338
|
+
this._focusedTextColor = parseColor(options.focusedTextColor || this._defaultOptions.focusedTextColor);
|
|
10296
10339
|
this._options = options.options || [];
|
|
10297
|
-
this._showScrollIndicator = options.showScrollIndicator ??
|
|
10298
|
-
this._wrapSelection = options.wrapSelection ??
|
|
10299
|
-
this._showDescription = options.showDescription ??
|
|
10340
|
+
this._showScrollIndicator = options.showScrollIndicator ?? this._defaultOptions.showScrollIndicator;
|
|
10341
|
+
this._wrapSelection = options.wrapSelection ?? this._defaultOptions.wrapSelection;
|
|
10342
|
+
this._showDescription = options.showDescription ?? this._defaultOptions.showDescription;
|
|
10300
10343
|
this._font = options.font;
|
|
10301
|
-
this._itemSpacing = options.itemSpacing ||
|
|
10344
|
+
this._itemSpacing = options.itemSpacing || this._defaultOptions.itemSpacing;
|
|
10302
10345
|
this.fontHeight = this._font ? measureText({ text: "A", font: this._font }).height : 1;
|
|
10303
10346
|
this.linesPerItem = this._showDescription ? this._font ? this.fontHeight + 1 : 2 : this._font ? this.fontHeight : 1;
|
|
10304
10347
|
this.linesPerItem += this._itemSpacing;
|
|
10305
10348
|
this.maxVisibleItems = Math.max(1, Math.floor(this.height / this.linesPerItem));
|
|
10306
|
-
this._selectedBackgroundColor = parseColor(options.selectedBackgroundColor ||
|
|
10307
|
-
this._selectedTextColor = parseColor(options.selectedTextColor ||
|
|
10308
|
-
this._descriptionColor = parseColor(options.descriptionColor ||
|
|
10309
|
-
this._selectedDescriptionColor = parseColor(options.selectedDescriptionColor ||
|
|
10310
|
-
this._fastScrollStep = options.fastScrollStep ||
|
|
10349
|
+
this._selectedBackgroundColor = parseColor(options.selectedBackgroundColor || this._defaultOptions.selectedBackgroundColor);
|
|
10350
|
+
this._selectedTextColor = parseColor(options.selectedTextColor || this._defaultOptions.selectedTextColor);
|
|
10351
|
+
this._descriptionColor = parseColor(options.descriptionColor || this._defaultOptions.descriptionColor);
|
|
10352
|
+
this._selectedDescriptionColor = parseColor(options.selectedDescriptionColor || this._defaultOptions.selectedDescriptionColor);
|
|
10353
|
+
this._fastScrollStep = options.fastScrollStep || this._defaultOptions.fastScrollStep;
|
|
10311
10354
|
this.needsUpdate();
|
|
10312
10355
|
}
|
|
10313
10356
|
renderSelf(buffer, deltaTime) {
|
|
@@ -10492,37 +10535,61 @@ class SelectRenderable extends Renderable {
|
|
|
10492
10535
|
set wrapSelection(wrap) {
|
|
10493
10536
|
this._wrapSelection = wrap;
|
|
10494
10537
|
}
|
|
10495
|
-
set backgroundColor(
|
|
10496
|
-
|
|
10497
|
-
this.
|
|
10538
|
+
set backgroundColor(value) {
|
|
10539
|
+
const newColor = parseColor(value ?? this._defaultOptions.backgroundColor);
|
|
10540
|
+
if (this._backgroundColor !== newColor) {
|
|
10541
|
+
this._backgroundColor = newColor;
|
|
10542
|
+
this.needsUpdate();
|
|
10543
|
+
}
|
|
10498
10544
|
}
|
|
10499
|
-
set textColor(
|
|
10500
|
-
|
|
10501
|
-
this.
|
|
10545
|
+
set textColor(value) {
|
|
10546
|
+
const newColor = parseColor(value ?? this._defaultOptions.textColor);
|
|
10547
|
+
if (this._textColor !== newColor) {
|
|
10548
|
+
this._textColor = newColor;
|
|
10549
|
+
this.needsUpdate();
|
|
10550
|
+
}
|
|
10502
10551
|
}
|
|
10503
|
-
set focusedBackgroundColor(
|
|
10504
|
-
|
|
10505
|
-
this.
|
|
10552
|
+
set focusedBackgroundColor(value) {
|
|
10553
|
+
const newColor = parseColor(value ?? this._defaultOptions.focusedBackgroundColor);
|
|
10554
|
+
if (this._focusedBackgroundColor !== newColor) {
|
|
10555
|
+
this._focusedBackgroundColor = newColor;
|
|
10556
|
+
this.needsUpdate();
|
|
10557
|
+
}
|
|
10506
10558
|
}
|
|
10507
|
-
set focusedTextColor(
|
|
10508
|
-
|
|
10509
|
-
this.
|
|
10559
|
+
set focusedTextColor(value) {
|
|
10560
|
+
const newColor = parseColor(value ?? this._defaultOptions.focusedTextColor);
|
|
10561
|
+
if (this._focusedTextColor !== newColor) {
|
|
10562
|
+
this._focusedTextColor = newColor;
|
|
10563
|
+
this.needsUpdate();
|
|
10564
|
+
}
|
|
10510
10565
|
}
|
|
10511
|
-
set selectedBackgroundColor(
|
|
10512
|
-
|
|
10513
|
-
this.
|
|
10566
|
+
set selectedBackgroundColor(value) {
|
|
10567
|
+
const newColor = parseColor(value ?? this._defaultOptions.selectedBackgroundColor);
|
|
10568
|
+
if (this._selectedBackgroundColor !== newColor) {
|
|
10569
|
+
this._selectedBackgroundColor = newColor;
|
|
10570
|
+
this.needsUpdate();
|
|
10571
|
+
}
|
|
10514
10572
|
}
|
|
10515
|
-
set selectedTextColor(
|
|
10516
|
-
|
|
10517
|
-
this.
|
|
10573
|
+
set selectedTextColor(value) {
|
|
10574
|
+
const newColor = parseColor(value ?? this._defaultOptions.selectedTextColor);
|
|
10575
|
+
if (this._selectedTextColor !== newColor) {
|
|
10576
|
+
this._selectedTextColor = newColor;
|
|
10577
|
+
this.needsUpdate();
|
|
10578
|
+
}
|
|
10518
10579
|
}
|
|
10519
|
-
set descriptionColor(
|
|
10520
|
-
|
|
10521
|
-
this.
|
|
10580
|
+
set descriptionColor(value) {
|
|
10581
|
+
const newColor = parseColor(value ?? this._defaultOptions.descriptionColor);
|
|
10582
|
+
if (this._descriptionColor !== newColor) {
|
|
10583
|
+
this._descriptionColor = newColor;
|
|
10584
|
+
this.needsUpdate();
|
|
10585
|
+
}
|
|
10522
10586
|
}
|
|
10523
|
-
set selectedDescriptionColor(
|
|
10524
|
-
|
|
10525
|
-
this.
|
|
10587
|
+
set selectedDescriptionColor(value) {
|
|
10588
|
+
const newColor = parseColor(value ?? this._defaultOptions.selectedDescriptionColor);
|
|
10589
|
+
if (this._selectedDescriptionColor !== newColor) {
|
|
10590
|
+
this._selectedDescriptionColor = newColor;
|
|
10591
|
+
this.needsUpdate();
|
|
10592
|
+
}
|
|
10526
10593
|
}
|
|
10527
10594
|
set font(font) {
|
|
10528
10595
|
this._font = font;
|
|
@@ -10981,5 +11048,5 @@ export {
|
|
|
10981
11048
|
ASCIIFontRenderable
|
|
10982
11049
|
};
|
|
10983
11050
|
export { __toESM, __commonJS, __export, __require };
|
|
10984
|
-
//# debugId=
|
|
11051
|
+
//# debugId=C7BAF498C3DCE8CB64756E2164756E21
|
|
10985
11052
|
//# sourceMappingURL=index.js.map
|