devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
176 lines (175 loc) • 5.89 kB
JavaScript
/**
* DevExtreme (esm/__internal/ui/list/list.edit.search.js)
* Version: 25.2.7
* Build date: Tue May 05 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
import registerComponent from "../../../core/component_registrator";
import errors from "../../../ui/widget/ui.errors";
import SearchBoxController, {
getOperationBySearchMode
} from "../../ui/collection/search_box_controller";
import ListEdit from "../../ui/list/list.edit";
const LIST_CLASS_PREFIX = "dx-list";
class ListSearch extends ListEdit {
_getCombinedFilter() {
const dataController = this._dataController;
const storeLoadOptions = {
filter: dataController.filter()
};
dataController.addSearchFilter(storeLoadOptions);
const {
filter: filter
} = storeLoadOptions;
return filter
}
_getDefaultOptions() {
return Object.assign({}, super._getDefaultOptions(), {
searchMode: "",
searchExpr: null,
searchValue: "",
searchEnabled: false,
searchEditorOptions: {}
})
}
_getSearchBoxControllerOptions() {
const {
tabIndex: tabIndex,
searchEnabled: searchEnabled,
searchValue: searchValue,
searchTimeout: searchTimeout,
searchEditorOptions: searchEditorOptions
} = this.option();
return {
tabIndex: tabIndex,
searchEnabled: searchEnabled,
searchValue: searchValue,
searchTimeout: searchTimeout,
searchEditorOptions: searchEditorOptions,
onValueChanged: value => {
this.option("searchValue", value)
}
}
}
_initDataSource() {
const {
searchValue: searchValue,
searchExpr: searchExpr,
searchMode: searchMode
} = this.option();
super._initDataSource();
const dataController = this._dataController;
if (null !== searchValue && void 0 !== searchValue && searchValue.length) {
dataController.searchValue(searchValue)
}
if (null !== searchMode && void 0 !== searchMode && searchMode.length) {
dataController.searchOperation(getOperationBySearchMode(searchMode))
}
if (searchExpr) {
dataController.searchExpr(searchExpr)
}
}
_init() {
this._searchBoxController = new SearchBoxController;
super._init()
}
_initMarkup() {
this._searchBoxController.render("dx-list", this.$element(), this._getSearchBoxControllerOptions(), this._createComponent.bind(this));
super._initMarkup()
}
_getAriaTarget() {
const {
searchEnabled: searchEnabled
} = this.option();
if (searchEnabled) {
return this._itemContainer()
}
return super._getAriaTarget()
}
focus() {
const {
focusedElement: focusedElement,
searchEnabled: searchEnabled
} = this.option();
if (!focusedElement && searchEnabled) {
var _this$_searchBoxContr;
null === (_this$_searchBoxContr = this._searchBoxController) || void 0 === _this$_searchBoxContr || _this$_searchBoxContr.focus();
return
}
super.focus()
}
_focusTarget() {
const {
searchEnabled: searchEnabled
} = this.option();
if (searchEnabled) {
return this._itemContainer()
}
return super._focusTarget()
}
_updateFocusState(e, isFocused) {
const {
searchEnabled: searchEnabled
} = this.option();
if (searchEnabled) {
this._toggleFocusClass(isFocused, this.$element())
}
super._updateFocusState(e, isFocused)
}
_optionChanged(args) {
const {
name: name,
value: value
} = args;
switch (name) {
case "searchEnabled":
case "searchEditorOptions":
this._invalidate();
break;
case "searchExpr":
case "searchMode":
case "searchValue":
if (!this._dataSource) {
errors.log("W1009");
return
}
if ("searchMode" === name) {
this._dataSource.searchOperation(getOperationBySearchMode(value))
} else {
this._dataSource[name](value)
}
this._dataSource.load();
break;
case "searchTimeout":
break;
default:
super._optionChanged(args)
}
}
_refresh() {
var _this$_searchBoxContr2;
null === (_this$_searchBoxContr2 = this._searchBoxController) || void 0 === _this$_searchBoxContr2 || _this$_searchBoxContr2.resolveValueChange();
super._refresh()
}
_cleanAria() {
const $element = this.$element();
this.setAria({
role: null,
activedescendant: null
}, $element);
$element.attr("tabIndex", null)
}
_clean() {
this._cleanAria();
super._clean()
}
_dispose() {
var _this$_searchBoxContr3;
null === (_this$_searchBoxContr3 = this._searchBoxController) || void 0 === _this$_searchBoxContr3 || _this$_searchBoxContr3.dispose();
super._dispose()
}
}
registerComponent("dxList", ListSearch);
export default ListSearch;