@yarnpkg/libui - npm Package Compare versions

Comparing version 2.0.0-rc.7 to 2.0.0-rc.8

package.json

 {
   "name": "@yarnpkg/libui",
-  "version": "2.0.0-rc.7",
+  "version": "2.0.0-rc.8",
+  "license": "BSD-2-Clause",
   "sideEffects": false,
@@ -12,3 +13,3 @@ "peerDependencies": {
     "ink": "^2.3.0",
-    "react": "^16.8.4"
+    "react": "^16.13.1"
   },
@@ -25,3 +26,6 @@ "repository": {
     "prepack": "yarn build:compile-inline \"$(pwd)\""
+  },
+  "engines": {
+    "node": ">=10.19.0"
   }
 }

sources/components/ItemOptions.js

@@ -39,15 +39,21 @@ "use strict";
         key: label,
-        minWidth: sizes[index] || 0,
-        paddingLeft: 2
+        width: sizes[index] - 1 || 0,
+        marginLeft: 1,
+        textWrap: "truncate"
       }, _react.default.createElement(_ink.Color, {
         green: true
-      }, "\u25FC"), " ", label);
+      }, " \u25C9 "), " ", _react.default.createElement(_ink.Text, {
+        bold: true
+      }, label));
     } else {
       return _react.default.createElement(_ink.Box, {
         key: label,
-        minWidth: sizes[index] || 0,
-        paddingLeft: 2
+        width: sizes[index] - 1 || 0,
+        marginLeft: 1,
+        textWrap: "truncate"
       }, _react.default.createElement(_ink.Color, {
         yellow: true
-      }, "\u25FB"), " ", label);
+      }, " \u25EF "), " ", _react.default.createElement(_ink.Text, {
+        bold: true
+      }, label));
     }
@@ -54,0 +60,0 @@ }));

sources/components/ScrollableItems.js

@@ -25,3 +25,5 @@ "use strict";
   size = 1,
-  onFocusRequest
+  loop = true,
+  onFocusRequest,
+  willReachEnd
 }) => {
@@ -41,2 +43,14 @@ const getKey = child => {
   const activeIndex = keys.indexOf(activeKey);
+  (0, _react.useEffect)(() => {
+    // If the active key is missing from the
+    // new keys, set it to the initalKey
+    if (!keys.includes(activeKey)) {
+      setActiveKey(initialKey);
+    }
+  }, [children]);
+  (0, _react.useEffect)(() => {
+    if (willReachEnd && activeIndex >= keys.length - 2) {
+      willReachEnd();
+    }
+  }, [activeIndex]);
   (0, _useFocusRequest.useFocusRequest)({
@@ -50,3 +64,4 @@ active,
     plus: `down`,
-    set: setActiveKey
+    set: setActiveKey,
+    loop
   });
@@ -76,7 +91,8 @@ let min = activeIndex - radius;
     }, _react.default.createElement(_ink.Box, {
-      marginLeft: 2,
-      marginRight: 2
+      marginLeft: 1,
+      marginRight: 1
     }, activeItem ? _react.default.createElement(_ink.Color, {
-      cyan: true
-    }, "\u25B6") : ` `), _react.default.createElement(_ink.Box, null, _react.default.cloneElement(children[t], {
+      cyan: true,
+      bold: true
+    }, `>`) : ` `), _react.default.createElement(_ink.Box, null, _react.default.cloneElement(children[t], {
       active: activeItem
@@ -88,4 +104,3 @@ }))));
     flexDirection: `column`,
-    width: `100%`,
-    height: radius * size * 2 + size
+    width: `100%`
   }, rendered);
@@ -92,0 +107,0 @@ };

sources/hooks/useFocusRequest.js

@@ -16,8 +16,6 @@ "use strict";
 (function (FocusRequest) {
-  FocusRequest["BEFORE"] = "before";
-  FocusRequest["AFTER"] = "after";
+  FocusRequest[FocusRequest["BEFORE"] = `before`] = "BEFORE";
+  FocusRequest[FocusRequest["AFTER"] = `after`] = "AFTER";
 })(FocusRequest || (exports.FocusRequest = FocusRequest = {}));
 
-;
-
 const useFocusRequest = function ({
@@ -31,3 +29,3 @@ active,
   (0, _react.useEffect)(() => {
-    if (!active || typeof handler === `undefined`) return;
+    if (!active || typeof handler === `undefined`) return undefined;
 
@@ -34,0 +32,0 @@ const cb = (ch, key) => {

sources/hooks/useFocusRequest.ts

@@ -5,5 +5,5 @@ import {StdinContext}          from 'ink';
 export enum FocusRequest {
-  BEFORE = 'before',
-  AFTER = 'after',
-};
+  BEFORE = `before`,
+  AFTER = `after`,
+}
 
@@ -18,3 +18,3 @@ export type FocusRequestHandler =
     if (!active || typeof handler === `undefined`)
-      return;
+      return undefined;
 
@@ -21,0 +21,0 @@ const cb = (ch: any, key: any) => {

sources/hooks/useListInput.js

@@ -16,3 +16,4 @@ "use strict";
   plus,
-  set
+  set,
+  loop = true
 }) {
@@ -23,3 +24,3 @@ const {
   (0, _react.useEffect)(() => {
-    if (!active) return;
+    if (!active) return undefined;
 
@@ -32,3 +33,11 @@ const cb = (ch, key) => {
           {
-            set(values[(values.length + index - 1) % values.length]);
+            const nextValueIndex = index - 1;
+
+            if (loop) {
+              set(values[(values.length + nextValueIndex) % values.length]);
+              return;
+            }
+
+            if (nextValueIndex < 0) return;
+            set(values[nextValueIndex]);
           }
@@ -39,3 +48,11 @@ break;
           {
-            set(values[(index + 1) % values.length]);
+            const nextValueIndex = index + 1;
+
+            if (loop) {
+              set(values[nextValueIndex % values.length]);
+              return;
+            }
+
+            if (nextValueIndex >= values.length) return;
+            set(values[nextValueIndex]);
           }
@@ -42,0 +59,0 @@ break;

sources/hooks/useListInput.ts

 import {StdinContext}          from 'ink';
 import {useContext, useEffect} from 'react';
 
-export const useListInput = function <T>(value: T, values: Array<T>, {active, minus, plus, set}: {active: boolean, minus: string, plus: string, set: (value: T) => void}) {
+export const useListInput = function <T>(value: T, values: Array<T>, {active, minus, plus, set, loop = true}: {active: boolean, minus: string, plus: string, set: (value: T) => void, loop?: boolean}) {
   const {stdin} = useContext(StdinContext);
@@ -9,3 +9,3 @@
     if (!active)
-      return;
+      return undefined;
 
@@ -16,6 +16,26 @@ const cb = (ch: any, key: any) => {
         case minus: {
-          set(values[(values.length + index - 1) % values.length]);
+          const nextValueIndex = index - 1;
+
+          if (loop) {
+            set(values[(values.length + nextValueIndex) % values.length]);
+            return;
+          }
+
+          if (nextValueIndex < 0)
+            return;
+
+          set(values[nextValueIndex]);
         } break;
         case plus: {
-          set(values[(index + 1) % values.length]);
+          const nextValueIndex = index + 1;
+
+          if (loop) {
+            set(values[nextValueIndex % values.length]);
+            return;
+          }
+
+          if (nextValueIndex >= values.length)
+            return;
+
+          set(values[nextValueIndex]);
         } break;
@@ -22,0 +42,0 @@ }

sources/hooks/useMinistore.js

@@ -22,4 +22,2 @@ "use strict";
   return [value, setValue];
-}
-
-;
+}

sources/hooks/useMinistore.ts

@@ -25,2 +25,2 @@ import {useContext, useCallback} from 'react';
   return [value, setValue];
-};
+}

sources/misc/renderForm.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.renderForm = void 0;
+exports.renderForm = renderForm;
 
@@ -21,3 +21,3 @@ var _ink = require("ink");
 
-const renderForm = async function (UserComponent, props) {
+async function renderForm(UserComponent, props) {
   let returnedValue;
@@ -54,4 +54,2 @@
   return returnedValue;
-};
-
-exports.renderForm = renderForm;
+}

Fixed alerts

No License Found

License

(Experimental) License information could not be found.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

22860

increased by17.94%

Number of package files

18

increased by12.5%

Number of low license alerts

0

decreased by-100%

Lines of code

599

increased by22.24%

No dependency changes