ink-text-input - npm Package Compare versions

Comparing version 3.2.2 to 3.3.0

build/index.js

@@ -33,3 +33,5 @@ "use strict";
 const BACKSPACE = '\x08';
-const DELETE = '\x7F';
+const DELETE = '\u007F';
+const TAB = '\t';
+const SHIFT_TAB = '\u001B[Z';
 
@@ -52,3 +54,2 @@ class TextInput extends _react.PureComponent {
         showCursor,
-        mask,
         onChange,
@@ -67,3 +68,3 @@ onSubmit
 
-      if (s === ARROW_UP || s === ARROW_DOWN || s === CTRL_C) {
+      if (s === ARROW_UP || s === ARROW_DOWN || s === CTRL_C || s === TAB || s === SHIFT_TAB) {
         return;
@@ -85,12 +86,14 @@ }
       if (s === ARROW_LEFT) {
-        if (showCursor && !mask) {
+        if (showCursor) {
           cursorOffset--;
         }
       } else if (s === ARROW_RIGHT) {
-        if (showCursor && !mask) {
+        if (showCursor) {
           cursorOffset++;
         }
       } else if (s === BACKSPACE || s === DELETE) {
-        value = value.slice(0, cursorOffset - 1) + value.slice(cursorOffset, value.length);
-        cursorOffset--;
+        if (cursorOffset > 0) {
+          value = value.slice(0, cursorOffset - 1) + value.slice(cursorOffset, value.length);
+          cursorOffset--;
+        }
       } else {
@@ -126,3 +129,3 @@ value = value.slice(0, cursorOffset) + s + value.slice(cursorOffset, value.length);
     const {
-      value,
+      value: originalValue,
       placeholder,
@@ -138,7 +141,10 @@ showCursor,
     } = this.state;
+    const value = mask ? mask.repeat(originalValue.length) : originalValue;
     const hasValue = value.length > 0;
     let renderedValue = value;
+    let renderedPlaceholder;
     const cursorActualWidth = highlightPastedText ? cursorWidth : 0; // Fake mouse cursor, because it's too inconvenient to deal with actual cursor and ansi escapes
 
-    if (showCursor && !mask && focus) {
+    if (showCursor && focus) {
+      renderedPlaceholder = placeholder.length > 0 ? _chalk.default.inverse(placeholder[0]) + placeholder.slice(1) : _chalk.default.inverse(' ');
       renderedValue = value.length > 0 ? '' : _chalk.default.inverse(' ');
@@ -162,9 +168,5 @@ let i = 0;
 
-    if (mask) {
-      renderedValue = mask.repeat(renderedValue.length);
-    }
-
-    return _react.default.createElement(_ink.Color, {
+    return /*#__PURE__*/_react.default.createElement(_ink.Color, {
       dim: !hasValue && placeholder
-    }, placeholder ? hasValue ? renderedValue : placeholder : renderedValue);
+    }, placeholder ? hasValue ? renderedValue : renderedPlaceholder : renderedValue);
   }
@@ -218,6 +220,6 @@
   render() {
-    return _react.default.createElement(_ink.StdinContext.Consumer, null, ({
+    return /*#__PURE__*/_react.default.createElement(_ink.StdinContext.Consumer, null, ({
       stdin,
       setRawMode
-    }) => _react.default.createElement(TextInput, _extends({}, this.props, {
+    }) => /*#__PURE__*/_react.default.createElement(TextInput, _extends({}, this.props, {
       stdin: stdin,
@@ -250,3 +252,3 @@ setRawMode: setRawMode
   render() {
-    return _react.default.createElement(TextInputWithStdin, _extends({}, this.props, {
+    return /*#__PURE__*/_react.default.createElement(TextInputWithStdin, _extends({}, this.props, {
       value: this.state.value,
@@ -253,0 +255,0 @@ onChange: this.setValue

index.d.ts

@@ -57,2 +57,4 @@ import * as React from 'react';
 
-export class UncontrolledTextInput extends React.Component<InkUncontrolledTextInputProps> {}
+export class UncontrolledTextInput extends React.Component<
+	InkUncontrolledTextInputProps
+> {}

package.json

 {
 	"name": "ink-text-input",
-	"version": "3.2.2",
+	"version": "3.3.0",
 	"description": "Text input component for Ink",
@@ -49,12 +49,16 @@ "license": "MIT",
 		"@types/react": "^16.8.8",
-		"ava": "*",
+		"@vdemedes/prettier-config": "^1.0.0",
+		"ava": "^1.3.1",
 		"babel-eslint": "^10.0.1",
 		"eslint-config-xo-react": "^0.17.0",
 		"eslint-plugin-react": "^7.11.1",
+		"husky": "^4.2.5",
 		"ink": "^2.0.0",
 		"ink-testing-library": "^1.0.0",
+		"prettier": "^2.0.5",
+		"pretty-quick": "^2.0.1",
 		"react": "^16.5.2",
 		"sinon": "^7.2.7",
 		"typescript": "^3.3.3333",
-		"xo": "*"
+		"xo": "^0.24.0"
 	},
@@ -79,2 +83,3 @@ "peerDependencies": {
 		],
+		"prettier": true,
 		"rules": {
@@ -84,3 +89,9 @@ "react/no-unused-prop-types": 1,
 		}
+	},
+	"prettier": "@vdemedes/prettier-config",
+	"husky": {
+		"hooks": {
+			"pre-commit": "pretty-quick --staged"
+		}
 	}
 }

readme.md

@@ -1,6 +0,5 @@
-# ink-text-input [![Build Status](https://travis-ci.org/vadimdemedes/ink-text-input.svg?branch=master)](https://travis-ci.org/vadimdemedes/ink-text-input)
+# ink-text-input ![test](https://github.com/vadimdemedes/ink-text-input/workflows/test/badge.svg)
 
 > Text input component for [Ink](https://github.com/vadimdemedes/ink).
 
-
 ## Install
@@ -12,3 +11,2 @@
 
-
 ## Usage
@@ -18,3 +16,3 @@
 import React from 'react';
-import {render, Box} from 'ink';
+import { render, Box } from 'ink';
 import TextInput from 'ink-text-input';
@@ -36,10 +34,4 @@
 			<Box>
-				<Box marginRight={1}>
-					Enter your query:
-				</Box>
-
-				<TextInput
-					value={this.state.query}
-					onChange={this.handleChange}
-				/>
+				<Box marginRight={1}>Enter your query:</Box>
+				<TextInput value={this.state.query} onChange={this.handleChange} />
 			</Box>
@@ -50,7 +42,7 @@ );
 	handleChange(query) {
-		this.setState({query});
+		this.setState({ query });
 	}
 }
 
-render(<SearchQuery/>);
+render(<SearchQuery />);
 ```
@@ -60,3 +52,2 @@
 
-
 ## Props
@@ -97,6 +88,3 @@
 ```jsx
-<TextInput
-	value="Hello"
-	mask="*"
-/>
+<TextInput value="Hello" mask="*" />
 //=> "*****"
@@ -123,4 +111,4 @@ ```
 import React from 'react';
-import {render, Box} from 'ink';
-import {UncontrolledTextInput} from 'ink-text-input';
+import { render, Box } from 'ink';
+import { UncontrolledTextInput } from 'ink-text-input';
 
@@ -131,10 +119,7 @@ const SearchQuery = () => {
 	};
-	
+
 	return (
 		<Box>
-			<Box marginRight={1}>
-				Enter your query:
-			</Box>
-
-			<UncontrolledTextInput onSubmit={handleSubmit}/>
+			<Box marginRight={1}>Enter your query:</Box>
+			<UncontrolledTextInput onSubmit={handleSubmit} />
 		</Box>
@@ -144,3 +129,3 @@ );
 
-render(<SearchQuery/>);
+render(<SearchQuery />);
 ```
@@ -147,0 +132,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14017

increased by3.77%

Lines of code

254

increased by2.01%

Worsened metrics

Dev dependency count

19

increased by26.67%

Number of lines in readme file

127

decreased by-10.56%

No dependency changes