Added onfocus, fixed autosearch clearing itself on widget reload

This commit is contained in:
2022-05-14 12:55:02 +02:00
parent f3988753d5
commit 53f799c22f
7 changed files with 34 additions and 7 deletions

Binary file not shown.

View File

@@ -34,7 +34,11 @@
<description/>
</property>
<property key="onEnter" type="action" required="false">
<caption>On enter</caption>
<caption>On focus</caption>
<description/>
</property>
<property key="onLeave" type="action" required="false">
<caption>On submit</caption>
<description/>
</property>
</propertyGroup>

View File

@@ -262,9 +262,10 @@ class Autosearch extends react__WEBPACK_IMPORTED_MODULE_0__["Component"] {
this.onChangeHandler = this.onChange.bind(this);
this.onTouchStart = this.onTouch.bind(this);
this.onEndHandler = this.onEnd.bind(this);
this.onLeaveHandler = this.onLeave.bind(this);
this.inputRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["createRef"])();
this.state = {
textboxValue: '',
textboxValue: this.props.searchvalue.displayValue,
};
}
componentDidUpdate(prevProps) {
@@ -284,11 +285,14 @@ class Autosearch extends react__WEBPACK_IMPORTED_MODULE_0__["Component"] {
this.setState({ textboxValue: '' });
(_a = this.inputRef.current) === null || _a === void 0 ? void 0 : _a.clear;
}
else {
this.setState({ textboxValue: this.props.searchvalue.displayValue });
}
}
}
render() {
return (Object(react__WEBPACK_IMPORTED_MODULE_0__["createElement"])(react_native__WEBPACK_IMPORTED_MODULE_1__["View"], { style: this.styles.input },
Object(react__WEBPACK_IMPORTED_MODULE_0__["createElement"])(react_native__WEBPACK_IMPORTED_MODULE_1__["TextInput"], { style: this.styles.text, value: this.state.textboxValue, onChangeText: this.onChangeHandler, onTouchStart: this.onTouchStart, onEndEditing: this.onEndHandler, placeholder: 'Zoeken naar monumentenborden', placeholderTextColor: "#5997C0", editable: this.props.editable, ref: this.inputRef })));
Object(react__WEBPACK_IMPORTED_MODULE_0__["createElement"])(react_native__WEBPACK_IMPORTED_MODULE_1__["TextInput"], { style: this.styles.text, value: this.state.textboxValue, onChangeText: this.onChangeHandler, onFocus: this.onTouchStart, onSubmitEditing: this.onLeaveHandler, onEndEditing: this.onEndHandler, placeholder: 'Zoeken naar monumentenborden', placeholderTextColor: "#5997C0", editable: this.props.editable, ref: this.inputRef })));
}
onChange(text) {
this.setState({ textboxValue: text });
@@ -302,6 +306,10 @@ class Autosearch extends react__WEBPACK_IMPORTED_MODULE_0__["Component"] {
var _a;
(_a = this.props.onChange) === null || _a === void 0 ? void 0 : _a.execute();
}
onLeave() {
var _a;
(_a = this.props.onLeave) === null || _a === void 0 ? void 0 : _a.execute();
}
}

File diff suppressed because one or more lines are too long

View File

@@ -37,11 +37,12 @@ export class Autosearch extends Component<AutosearchProps<AutosearchStyle>, Stat
private readonly onChangeHandler = this.onChange.bind(this);
private readonly onTouchStart = this.onTouch.bind(this);
private readonly onEndHandler = this.onEnd.bind(this);
private readonly onLeaveHandler = this.onLeave.bind(this);
inputRef = createRef<TextInput>();
constructor(props: AutosearchProps<AutosearchStyle>){
super(props)
this.state = {
textboxValue: '',
textboxValue: this.props.searchvalue.displayValue,
}
}
@@ -60,6 +61,9 @@ export class Autosearch extends Component<AutosearchProps<AutosearchStyle>, Stat
this.setState({textboxValue: ''});
this.inputRef.current?.clear;
}
else {
this.setState({textboxValue: this.props.searchvalue.displayValue});
}
}
}
@@ -69,7 +73,8 @@ export class Autosearch extends Component<AutosearchProps<AutosearchStyle>, Stat
<TextInput style={this.styles.text}
value={this.state.textboxValue}
onChangeText={this.onChangeHandler}
onTouchStart={this.onTouchStart}
onFocus={this.onTouchStart}
onSubmitEditing={this.onLeaveHandler}
onEndEditing={this.onEndHandler}
placeholder={'Zoeken naar monumentenborden'}
placeholderTextColor="#5997C0"
@@ -93,4 +98,8 @@ export class Autosearch extends Component<AutosearchProps<AutosearchStyle>, Stat
private onEnd() {
this.props.onChange?.execute();
}
private onLeave() {
this.props.onLeave?.execute();
}
}

View File

@@ -34,7 +34,11 @@
<description/>
</property>
<property key="onEnter" type="action" required="false">
<caption>On enter</caption>
<caption>On focus</caption>
<description/>
</property>
<property key="onLeave" type="action" required="false">
<caption>On submit</caption>
<description/>
</property>
</propertyGroup>

View File

@@ -13,6 +13,7 @@ export interface AutosearchProps<Style> {
autoFocus: EditableValue<boolean>;
onChange?: ActionValue;
onEnter?: ActionValue;
onLeave?: ActionValue;
}
export interface AutosearchPreviewProps {
@@ -23,4 +24,5 @@ export interface AutosearchPreviewProps {
autoFocus: string;
onChange: {} | null;
onEnter: {} | null;
onLeave: {} | null;
}