This is an automated email from the ASF dual-hosted git repository.
maximebeauchemin pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
The following commit(s) were added to refs/heads/master by this push:
new 076f9cd Added custom pasteSelect to handle paste events (#3562)
076f9cd is described below
commit 076f9cd095db95074c09ff630743c1873b15aebc
Author: Jeff Niu <jeffni...@gmail.com>
AuthorDate: Tue Oct 3 15:58:18 2017 -0700
Added custom pasteSelect to handle paste events (#3562)
---
.../explore/components/controls/SelectControl.jsx | 59 +++++++++++++++++++++-
1 file changed, 57 insertions(+), 2 deletions(-)
diff --git
a/superset/assets/javascripts/explore/components/controls/SelectControl.jsx
b/superset/assets/javascripts/explore/components/controls/SelectControl.jsx
index 4c72b5d..51381d6 100644
--- a/superset/assets/javascripts/explore/components/controls/SelectControl.jsx
+++ b/superset/assets/javascripts/explore/components/controls/SelectControl.jsx
@@ -37,6 +37,55 @@ const defaultProps = {
valueKey: 'value',
};
+// Handle `onPaste` so that users may paste in
+// options as comma-delimited, slightly modified from
+// https://github.com/JedWatson/react-select/issues/1672
+function pasteSelect(props) {
+ let pasteInput;
+ return (
+ <Select
+ {...props}
+ ref={(ref) => {
+ // Creatable requires a reference to its Select child
+ if (props.ref) {
+ props.ref(ref);
+ }
+ pasteInput = ref;
+ }}
+ inputProps={{
+ onPaste: (evt) => {
+ if (!props.multi) {
+ return;
+ }
+ evt.preventDefault();
+ // pull text from the clipboard and split by comma
+ const clipboard = evt.clipboardData.getData('Text');
+ if (!clipboard) {
+ return;
+ }
+ const values = clipboard.split(/[,]+/).map(v => v.trim());
+ const options = values
+ .filter(value =>
+ // Creatable validates options
+ props.isValidNewOption ? props.isValidNewOption({ label: value
}) : !!value,
+ )
+ .map(value => ({
+ [props.labelKey]: value,
+ [props.valueKey]: value,
+ }));
+ if (options.length) {
+ pasteInput.selectValue(options);
+ }
+ },
+ }}
+ />
+ );
+}
+pasteSelect.propTypes = {
+ multi: PropTypes.bool,
+ ref: PropTypes.func,
+};
+
export default class SelectControl extends React.PureComponent {
constructor(props) {
super(props);
@@ -106,6 +155,7 @@ export default class SelectControl extends
React.PureComponent {
placeholder: t('Select %s', this.state.options.length),
options: this.state.options,
value: this.props.value,
+ labelKey: 'label',
valueKey: this.props.valueKey,
autosize: false,
clearable: this.props.clearable,
@@ -115,8 +165,13 @@ export default class SelectControl extends
React.PureComponent {
valueRenderer: this.props.valueRenderer,
};
// Tab, comma or Enter will trigger a new option created for
FreeFormSelect
- const selectWrap = this.props.freeForm ?
- (<Creatable {...selectProps} />) : (<Select {...selectProps} />);
+ const selectWrap = this.props.freeForm ? (
+ <Creatable {...selectProps}>
+ {pasteSelect}
+ </Creatable>
+ ) : (
+ pasteSelect(selectProps)
+ );
return (
<div>
{this.props.showHeader &&
--
To stop receiving notification emails like this one, please contact
['"comm...@superset.apache.org" <comm...@superset.apache.org>'].
