minitel-standalone - npm Package Compare versions

Comparing version 1.4.0 to 1.5.0

dist/abstract/focusable.d.ts

@@ -7,4 +7,4 @@ import { MinitelObjectAttributes } from '../types.js';
     focused: boolean;
+    focusCursorAt?: [number, number];
     disabled: boolean;
-    focusCursorAt?: [number, number];
     keepElmDesc: true;
@@ -14,2 +14,3 @@ }
     autofocus: boolean;
+    disabled: boolean;
 }

dist/abstract/minitelobject.js

@@ -44,7 +44,4 @@ "use strict";
         const fillChar = new richchar_js_1.RichChar(attributes.fillChar, attributes).noSize();
-        let result;
-        if (attributes.visible) {
-            result = this.render(attributes, (0, utils_js_1.inheritedProps)(Object.assign(Object.assign(Object.assign({}, inheritedAttributes), this.attributes), forcedAttributes)));
-        }
-        else {
+        let result = this.render(attributes, (0, utils_js_1.inheritedProps)(Object.assign(Object.assign(Object.assign({}, inheritedAttributes), this.attributes), forcedAttributes)));
+        if (!attributes.visible) {
             result = richchargrid_js_1.RichCharGrid.fill(attributes.width || 0, attributes.height || 0, fillChar);
@@ -51,0 +48,0 @@ }

dist/components/input.d.ts

@@ -12,3 +12,2 @@ import { Focusable, FocusableAttributes } from '../abstract/focusable.js';
     focused: boolean;
-    disabled: boolean;
     keepElmDesc: true;
@@ -24,2 +23,3 @@ cursorActuallyAt: [number, number];
     get focusCursorAt(): [number, number];
+    get disabled(): boolean;
 }
@@ -29,3 +29,5 @@ export interface InputAttributes extends FocusableAttributes {
     multiline: boolean;
-    onChange: (value: Input) => void;
+    forceDelta?: [number, number];
+    onScroll: (scrollDelta: [number, number]) => void;
+    onChange: (value: string, elm: Input) => void;
 }

dist/components/input.js

@@ -14,3 +14,2 @@ "use strict";
         this.focused = false;
-        this.disabled = false;
         this.keepElmDesc = true;
@@ -89,3 +88,3 @@ this.cursorActuallyAt = [0, 0];
                     if (this.attributes.onChange)
-                        this.attributes.onChange(this);
+                        this.attributes.onChange(this.value, this);
                 }
@@ -111,3 +110,3 @@ else if (key === '\x13\x47') {
                     if (this.attributes.onChange)
-                        this.attributes.onChange(this);
+                        this.attributes.onChange(this.value, this);
                 }
@@ -133,2 +132,3 @@ this.constrainCursor();
         }
+        const oldScrollDelta = [this.scrollDelta[0], this.scrollDelta[1]];
         if (attributes.height != null) {
@@ -141,3 +141,3 @@ if (this.scrollDelta[0] > this.cursorActuallyAt[0]) {
             }
-            this.scrollDelta[0] = Math.min(Math.max(this.scrollDelta[0], 0), lines.length);
+            this.scrollDelta[0] = Math.max(this.scrollDelta[0], 0);
             result.setHeight(this.scrollDelta[0] + attributes.height, 'end', fillChar);
@@ -147,12 +147,15 @@ result.setHeight(attributes.height, 'start', fillChar);
         if (attributes.width != null) {
-            if (this.cursorActuallyAt[1] < this.scrollDelta[1]) {
-                this.scrollDelta[1] = this.cursorActuallyAt[1];
+            if (this.cursorActuallyAt[1] - 4 < this.scrollDelta[1]) {
+                this.scrollDelta[1] = this.cursorActuallyAt[1] - 4;
             }
-            if (this.scrollDelta[1] < this.cursorActuallyAt[1] - attributes.width + 4) {
-                this.scrollDelta[1] = this.cursorActuallyAt[1] - attributes.width + 4;
+            if (this.scrollDelta[1] < this.cursorActuallyAt[1] - attributes.width + 1) {
+                this.scrollDelta[1] = this.cursorActuallyAt[1] - attributes.width + 1;
             }
-            this.scrollDelta[1] = Math.max(Math.min(this.scrollDelta[1], lines[this.cursorActuallyAt[0]].length), 0);
+            this.scrollDelta[1] = Math.max(this.scrollDelta[1], 0);
             result.setWidth(this.scrollDelta[1] + attributes.width, 'end', fillChar);
             result.setWidth(attributes.width, 'start', fillChar);
         }
+        if (oldScrollDelta[0] !== this.scrollDelta[0] || oldScrollDelta[1] !== this.scrollDelta[1]) {
+            attributes.onScroll([...this.scrollDelta]);
+        }
         return result;
@@ -163,4 +166,7 @@ }
     }
+    get disabled() {
+        return this.attributes.disabled || false;
+    }
 }
 exports.Input = Input;
-Input.defaultAttributes = Object.assign(Object.assign({}, minitelobject_js_1.MinitelObject.defaultAttributes), { fillChar: '.', width: 8, height: 1, type: 'text', autofocus: false, multiline: false, onChange: () => { } });
+Input.defaultAttributes = Object.assign(Object.assign({}, minitelobject_js_1.MinitelObject.defaultAttributes), { fillChar: '.', width: 8, height: 1, type: 'text', autofocus: false, disabled: false, multiline: false, onChange: () => { }, onScroll: () => { } });

dist/components/scrollable.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="node" />
 import { Focusable } from '../abstract/focusable.js';
@@ -12,6 +11,6 @@ import { RichCharGrid } from '../richchargrid.js';
     focused: boolean;
-    disabled: boolean;
     keepElmDesc: true;
-    scrollDelta: number[];
-    artificialBlink: NodeJS.Timeout | null;
+    private prevScrollDelta;
+    scrollDelta: [number, number];
+    private artificialBlink;
     blinkShown: boolean;
@@ -21,10 +20,15 @@ blink(): void;
     constructor(children: never[] | undefined, attributes: Partial<ScrollableAttributes>, minitel: Minitel);
+    pushPrevScrollDelta(): void;
+    popPrevScrollDelta(callback: (_arg0: [number, number]) => unknown): void;
     keyEventListener(str: string): void;
     unmount(): void;
     render(attributes: ScrollableAttributes, inheritMe: Partial<ScrollableAttributes>): RichCharGrid;
+    get disabled(): boolean;
 }
 export interface ScrollableAttributes extends ContainerAttributes {
-    overflowX: 'scroll' | 'pad' | 'auto' | 'hidden';
-    overflowY: 'scroll' | 'pad' | 'auto' | 'hidden';
-    autofocus: false;
+    overflowX: 'scroll' | 'pad' | 'auto' | 'hidden' | 'noscrollbar';
+    overflowY: 'scroll' | 'pad' | 'auto' | 'hidden' | 'noscrollbar';
+    autofocus: boolean;
+    disabled: boolean;
+    onScroll: (scrollDelta: [number, number]) => void;
     scrollbarColor: number;
@@ -31,0 +35,0 @@ scrollbarBackColor: number;

dist/components/scrollable.js

@@ -29,4 +29,4 @@ "use strict";
         this.focused = false;
-        this.disabled = false;
         this.keepElmDesc = true;
+        this.prevScrollDelta = null;
         this.scrollDelta = [0, 0];
@@ -38,21 +38,36 @@ this.artificialBlink = null;
     }
+    pushPrevScrollDelta() {
+        this.prevScrollDelta = [this.scrollDelta[0], this.scrollDelta[1]];
+    }
+    popPrevScrollDelta(callback) {
+        if (this.prevScrollDelta == null)
+            return;
+        if (this.prevScrollDelta[0] !== this.scrollDelta[0] || this.prevScrollDelta[1] !== this.scrollDelta[1]) {
+            callback([this.scrollDelta[0], this.scrollDelta[1]]);
+        }
+        this.prevScrollDelta = null;
+    }
     keyEventListener(str) {
+        if (!(['\x1b\x5b\x41', '\x1b\x5b\x42', '\x1b\x5b\x43', '\x1b\x5b\x44'].includes(str)))
+            return;
+        this.pushPrevScrollDelta();
         switch (str) {
             case '\x1b\x5b\x41': // up
-                this.scrollDelta[0] -= 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowY !== 'hidden' && !this.disabled)
+                    this.scrollDelta[0] -= 1;
                 break;
             case '\x1b\x5b\x42': // down
-                this.scrollDelta[0] += 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowY !== 'hidden' && !this.disabled)
+                    this.scrollDelta[0] += 1;
                 break;
             case '\x1b\x5b\x43': // right
-                this.scrollDelta[1] += 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowX !== 'hidden' && !this.disabled)
+                    this.scrollDelta[1] += 1;
                 break;
             case '\x1b\x5b\x44': // left
-                this.scrollDelta[1] -= 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowX !== 'hidden' && !this.disabled)
+                    this.scrollDelta[1] -= 1;
                 break;
         }
+        this.minitel.queueImmediateRenderToStream();
     }
@@ -115,3 +130,3 @@ unmount() {
         const originalHeight = finalRender.height;
-        const maxScrollSizeX = attributes.overflowY !== 'hidden' && !autoedY && attributes.width != null
+        const maxScrollSizeX = attributes.overflowY !== 'hidden' && attributes.overflowY !== 'noscrollbar' && !autoedY && attributes.width != null
             ? attributes.width - 1
@@ -121,3 +136,3 @@ : attributes.width; // Area available for scroll for bottom scroll bar
         this.scrollDelta[1] = Math.max(0, Math.min(this.scrollDelta[1], (originalWidth - maxScrollSizeX) || 0));
-        const maxScrollSizeY = attributes.overflowX !== 'hidden' && !autoedX && attributes.height != null
+        const maxScrollSizeY = attributes.overflowX !== 'hidden' && attributes.overflowX !== 'noscrollbar' && !autoedX && attributes.height != null
             ? attributes.height - 1
@@ -138,3 +153,3 @@ : attributes.height; // Area available for scroll for right scroll bar\
         const scrollBackChar = new richchar_js_1.RichChar('\x7f', Object.assign(Object.assign({}, attributes), { fg: attributes.scrollbarBackColor }));
-        if (attributes.overflowY !== 'hidden' && !autoedY && attributes.height != null) {
+        if (attributes.overflowY !== 'hidden' && attributes.overflowY !== 'noscrollbar' && !autoedY && attributes.height != null) {
             const percentageScrolled = this.scrollDelta[0] / (originalHeight - maxScrollSizeY);
@@ -153,3 +168,3 @@ const scrollbarOffset = Math.floor((maxScrollSizeY - scrollbarSizeY) * percentageScrolled);
         }
-        if (attributes.overflowX !== 'hidden' && !autoedX && attributes.width != null) {
+        if (attributes.overflowX !== 'hidden' && attributes.overflowX !== 'noscrollbar' && !autoedX && attributes.width != null) {
             const percentageScrolled = this.scrollDelta[1] / (originalWidth - maxScrollSizeX);
@@ -169,6 +184,10 @@ const scrollbarOffset = Math.floor((maxScrollSizeX - scrollbarSizeX) * percentageScrolled);
         // if (this.focused) this.blink();
+        this.popPrevScrollDelta(attributes.onScroll);
         return finalRender;
     }
+    get disabled() {
+        return this.attributes.disabled || false;
+    }
 }
 exports.Scrollable = Scrollable;
-Scrollable.defaultAttributes = Object.assign(Object.assign({}, container_js_1.Container.defaultAttributes), { overflowX: 'hidden', overflowY: 'auto', autofocus: false, scrollbarBackColor: 5, scrollbarColor: 7, blinkPeriod: 500 });
+Scrollable.defaultAttributes = Object.assign(Object.assign({}, container_js_1.Container.defaultAttributes), { overflowX: 'hidden', overflowY: 'auto', autofocus: false, disabled: false, scrollbarBackColor: 5, scrollbarColor: 7, blinkPeriod: 500, onScroll: () => { } });

package.json

 {
   "name": "minitel-standalone",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "A standalone package for minitel components",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

src/abstract/focusable.ts

@@ -6,4 +6,4 @@ import { MinitelObjectAttributes } from '../types.js';
     focused: boolean;
+    focusCursorAt?: [number, number];
     disabled: boolean;
-    focusCursorAt?: [number, number];
     keepElmDesc: true;
@@ -14,2 +14,3 @@ }
     autofocus: boolean;
+    disabled: boolean;
 }

src/abstract/minitelobject.ts

@@ -67,10 +67,8 @@ import { EventEmitter } from 'node:events';
         
-        let result;
-        if (attributes.visible) {
-            result = this.render(attributes, inheritedProps({
-                ...inheritedAttributes,
-                ...this.attributes,
-                ...forcedAttributes,
-            }));
-        } else {
+        let result = this.render(attributes, inheritedProps({
+            ...inheritedAttributes,
+            ...this.attributes,
+            ...forcedAttributes,
+        }));
+        if (!attributes.visible) {
             result = RichCharGrid.fill(attributes.width || 0, attributes.height || 0, fillChar);
@@ -77,0 +75,0 @@ }

src/components/input.ts

@@ -7,2 +7,3 @@ import { Focusable, FocusableAttributes } from '../abstract/focusable.js';
 import type { Minitel } from './minitel.js';
+import { Scrollable, ScrollableAttributes } from './scrollable.js';
 
@@ -20,4 +21,6 @@ export class Input
         autofocus: false,
+        disabled: false,
         multiline: false,
         onChange: () => {},
+        onScroll: () => {},
     };
@@ -27,3 +30,2 @@ defaultAttributes = Input.defaultAttributes;
     focused = false;
-    disabled = false;
     keepElmDesc = true as const;
@@ -122,3 +124,3 @@ cursorActuallyAt = [0, 0] as [number, number];
 
-                    if (this.attributes.onChange) this.attributes.onChange(this);
+                    if (this.attributes.onChange) this.attributes.onChange(this.value, this);
                 } else if (key === '\x13\x47') {
@@ -144,3 +146,3 @@ if (this.cursorActuallyAt[0] !== 0 || this.cursorActuallyAt[1] !== 0) {
     
-                    if (this.attributes.onChange) this.attributes.onChange(this);
+                    if (this.attributes.onChange) this.attributes.onChange(this.value, this);
                 }
@@ -167,2 +169,3 @@ this.constrainCursor();
         }
+        const oldScrollDelta = [this.scrollDelta[0], this.scrollDelta[1]];
         if (attributes.height != null) {
@@ -175,3 +178,3 @@ if (this.scrollDelta[0] > this.cursorActuallyAt[0]) {
             }
-            this.scrollDelta[0] = Math.min(Math.max(this.scrollDelta[0], 0), lines.length);
+            this.scrollDelta[0] = Math.max(this.scrollDelta[0], 0);
 
@@ -182,9 +185,9 @@ result.setHeight(this.scrollDelta[0] + attributes.height, 'end', fillChar);
         if (attributes.width != null) {
-            if (this.cursorActuallyAt[1] < this.scrollDelta[1]) {
-                this.scrollDelta[1] = this.cursorActuallyAt[1];
+            if (this.cursorActuallyAt[1] - 4 < this.scrollDelta[1]) {
+                this.scrollDelta[1] = this.cursorActuallyAt[1] - 4;
             }
-            if (this.scrollDelta[1] < this.cursorActuallyAt[1] - attributes.width + 4) {
-                this.scrollDelta[1] = this.cursorActuallyAt[1] - attributes.width + 4;
+            if (this.scrollDelta[1] < this.cursorActuallyAt[1] - attributes.width + 1) {
+                this.scrollDelta[1] = this.cursorActuallyAt[1] - attributes.width + 1;
             }
-            this.scrollDelta[1] = Math.max(Math.min(this.scrollDelta[1], lines[this.cursorActuallyAt[0]].length), 0);
+            this.scrollDelta[1] = Math.max(this.scrollDelta[1], 0);
 
@@ -194,2 +197,6 @@ result.setWidth(this.scrollDelta[1] + attributes.width, 'end', fillChar);
         }
+        if (oldScrollDelta[0] !== this.scrollDelta[0] || oldScrollDelta[1] !== this.scrollDelta[1]) {
+            attributes.onScroll([...this.scrollDelta]);
+        }
+        
         return result;
@@ -200,2 +207,5 @@ }
     }
+    get disabled() {
+        return this.attributes.disabled || false;
+    }
 }
@@ -206,3 +216,5 @@
     multiline: boolean;
-    onChange: (value: Input) => void;
+    forceDelta?: [number, number];
+    onScroll: (scrollDelta: [number, number]) => void;
+    onChange: (value: string, elm: Input) => void;
 }

src/components/scrollable.ts

@@ -13,12 +13,14 @@ import { Focusable } from '../abstract/focusable.js';
         autofocus: false,
+        disabled: false,
         scrollbarBackColor: 5,
         scrollbarColor: 7,
         blinkPeriod: 500,
+        onScroll: () => {},
     };
     defaultAttributes = Scrollable.defaultAttributes;
     focused = false;
-    disabled = false;
     keepElmDesc: true = true;
-    scrollDelta = [0, 0];
-    artificialBlink: NodeJS.Timeout | null = null;
+    private prevScrollDelta: [number, number] | null = null;
+    scrollDelta: [number, number] = [0, 0];
+    private artificialBlink: NodeJS.Timeout | null = null;
     blinkShown = true;
@@ -53,21 +55,34 @@ blink() {
     }
+    pushPrevScrollDelta() {
+        this.prevScrollDelta = [this.scrollDelta[0], this.scrollDelta[1]];
+    }
+    popPrevScrollDelta(callback: (_arg0: [number, number]) => unknown) {
+        if (this.prevScrollDelta == null) return;
+        if (this.prevScrollDelta[0] !== this.scrollDelta[0] || this.prevScrollDelta[1] !== this.scrollDelta[1]) {
+            callback([this.scrollDelta[0], this.scrollDelta[1]]);
+        }
+        this.prevScrollDelta = null;
+    }
     keyEventListener(str: string) {
+        if (!(['\x1b\x5b\x41', '\x1b\x5b\x42', '\x1b\x5b\x43', '\x1b\x5b\x44'].includes(str))) return;
+        this.pushPrevScrollDelta();
         switch (str) {
             case '\x1b\x5b\x41': // up
-                this.scrollDelta[0] -= 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowY !== 'hidden' && !this.disabled)
+                    this.scrollDelta[0] -= 1;
                 break;
             case '\x1b\x5b\x42': // down
-                this.scrollDelta[0] += 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowY !== 'hidden' && !this.disabled)
+                    this.scrollDelta[0] += 1;
                 break;
             case '\x1b\x5b\x43': // right
-                this.scrollDelta[1] += 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowX !== 'hidden' && !this.disabled)
+                    this.scrollDelta[1] += 1;
                 break;
             case '\x1b\x5b\x44': // left
-                this.scrollDelta[1] -= 1;
-                this.minitel.queueImmediateRenderToStream();
+                if (this.attributes.overflowX !== 'hidden' && !this.disabled)
+                    this.scrollDelta[1] -= 1;
                 break;
         }
+        this.minitel.queueImmediateRenderToStream();
     }
@@ -143,3 +158,3 @@ unmount() {
 
-        const maxScrollSizeX = attributes.overflowY !== 'hidden' && !autoedY && attributes.width != null
+        const maxScrollSizeX = attributes.overflowY !== 'hidden' && attributes.overflowY !== 'noscrollbar' && !autoedY && attributes.width != null
             ? attributes.width - 1
@@ -153,3 +168,3 @@ : attributes.width; // Area available for scroll for bottom scroll bar
 
-        const maxScrollSizeY = attributes.overflowX !== 'hidden' && !autoedX && attributes.height != null
+        const maxScrollSizeY = attributes.overflowX !== 'hidden' && attributes.overflowX !== 'noscrollbar' && !autoedX && attributes.height != null
             ? attributes.height - 1
@@ -178,3 +193,3 @@ : attributes.height; // Area available for scroll for right scroll bar\
 
-        if (attributes.overflowY !== 'hidden' && !autoedY && attributes.height != null) {
+        if (attributes.overflowY !== 'hidden' && attributes.overflowY !== 'noscrollbar' && !autoedY && attributes.height != null) {
             const percentageScrolled = this.scrollDelta[0] / (originalHeight - maxScrollSizeY!);
@@ -195,3 +210,3 @@ const scrollbarOffset = Math.floor((maxScrollSizeY! - scrollbarSizeY!) * percentageScrolled);
         }
-        if (attributes.overflowX !== 'hidden' && !autoedX && attributes.width != null) {
+        if (attributes.overflowX !== 'hidden' && attributes.overflowX !== 'noscrollbar' && !autoedX && attributes.width != null) {
             const percentageScrolled = this.scrollDelta[1] / (originalWidth - maxScrollSizeX!);
@@ -215,10 +230,17 @@ const scrollbarOffset = Math.floor((maxScrollSizeX! - scrollbarSizeX!) * percentageScrolled);
 
+        this.popPrevScrollDelta(attributes.onScroll);
+
         return finalRender;
     }
+    get disabled() {
+        return this.attributes.disabled || false;
+    }
 }
 
 export interface ScrollableAttributes extends ContainerAttributes {
-    overflowX: 'scroll' | 'pad' | 'auto' | 'hidden';
-    overflowY: 'scroll' | 'pad' | 'auto' | 'hidden';
-    autofocus: false;
+    overflowX: 'scroll' | 'pad' | 'auto' | 'hidden' | 'noscrollbar';
+    overflowY: 'scroll' | 'pad' | 'auto' | 'hidden' | 'noscrollbar';
+    autofocus: boolean;
+    disabled: boolean;
+    onScroll: (scrollDelta: [number, number]) => void;
     scrollbarColor: number;
@@ -225,0 +247,0 @@ scrollbarBackColor: number;

No alert changes

Improved metrics

Total package byte prevSize

183467

increased by1.88%

Lines of code

3914

increased by1.56%

No dependency changes