From 705adeeb63cc6eaffd69476e71b6e15b90096e0e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Atte=20Kein=C3=A4nen?= <atte.keinanen@gmail.com>
Date: Tue, 21 Mar 2017 17:41:54 -0700
Subject: [PATCH] Use auto-sizing textarea, strip newlines
---
.../components/filters/pickers/TextPicker.jsx | 8 ++++++--
package.json | 1 +
yarn.lock | 4 ++++
3 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/frontend/src/metabase/query_builder/components/filters/pickers/TextPicker.jsx b/frontend/src/metabase/query_builder/components/filters/pickers/TextPicker.jsx
index 79aee06e4f6..bbc613480c6 100644
--- a/frontend/src/metabase/query_builder/components/filters/pickers/TextPicker.jsx
+++ b/frontend/src/metabase/query_builder/components/filters/pickers/TextPicker.jsx
@@ -1,6 +1,7 @@
/* @flow */
import React, {Component, PropTypes} from "react";
+import AutosizeTextarea from 'react-textarea-autosize';
import cx from "classnames";
import _ from "underscore";
@@ -31,7 +32,8 @@ export default class TextPicker extends Component<*, Props, *> {
setValue(fieldString: string|null) {
const fieldIsNonEmpty = fieldString !== null && fieldString !== "";
- const values = fieldIsNonEmpty ? fieldString.split(',') : [null];
+ const newLineRegex = /\r?\n|\r/g;
+ const values = fieldIsNonEmpty ? fieldString.replace(newLineRegex,'').split(',') : [null];
this.props.onValuesChange(values);
}
@@ -48,7 +50,7 @@ export default class TextPicker extends Component<*, Props, *> {
return (
<div>
<div className="FilterInput px1 pt1 relative">
- <input
+ <AutosizeTextarea
className={cx("input block full border-purple", { "border-error": hasInvalidValues })}
type="text"
value={values.join(',')}
@@ -56,6 +58,8 @@ export default class TextPicker extends Component<*, Props, *> {
onKeyPress={commitOnEnter}
placeholder={this.props.placeholder}
autoFocus={true}
+ style={{resize: "none"}}
+ maxRows={8}
/>
</div>
diff --git a/package.json b/package.json
index c549047e0d4..328dad28c03 100644
--- a/package.json
+++ b/package.json
@@ -49,6 +49,7 @@
"react-router": "^3.0.0",
"react-router-redux": "^4.0.8",
"react-sortable": "^1.2.0",
+ "react-textarea-autosize": "^4.0.5",
"react-virtualized": "^8.6.0",
"recompose": "^0.21.2",
"redux": "^3.5.2",
diff --git a/yarn.lock b/yarn.lock
index 8aef53aebea..f28ed330b99 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6557,6 +6557,10 @@ react-test-renderer@^15.4.2:
fbjs "^0.8.4"
object-assign "^4.1.0"
+react-textarea-autosize@^4.0.5:
+ version "4.0.5"
+ resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-4.0.5.tgz#55379f6a6fa575fc87d1b8de2756e57e3b6c995d"
+
react-virtualized@^8.6.0:
version "8.11.4"
resolved "https://registry.yarnpkg.com/react-virtualized/-/react-virtualized-8.11.4.tgz#0bb94f1ecbd286d07145ce63983d0a11724522c0"
--
GitLab