@progress/kendo-react-grid/dist/npm/cells/GridFilterCell.js

KendoReact Grid package

"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var kendo_react_dropdowns_1 = require("@progress/kendo-react-dropdowns");
var kendo_react_inputs_1 = require("@progress/kendo-react-inputs");
var kendo_react_dateinputs_1 = require("@progress/kendo-react-dateinputs");
var messages_1 = require("../messages");
var kendo_react_intl_1 = require("@progress/kendo-react-intl");
var filterCommon_1 = require("../filterCommon");
exports.operators = filterCommon_1.operators;
var GridFilterCell = /** @class */ (function (_super) {
    __extends(GridFilterCell, _super);
    function GridFilterCell(props) {
        var _this = _super.call(this, props) || this;
        _this.inputChange = _this.inputChange.bind(_this);
        _this.clear = _this.clear.bind(_this);
        _this.operatorChange = _this.operatorChange.bind(_this);
        _this.boolDropdownChange = _this.boolDropdownChange.bind(_this);
        return _this;
    }
    /**
     * @hidden
     */
    GridFilterCell.prototype.render = function () {
        var _this = this;
        var localizationService = kendo_react_intl_1.provideLocalizationService(this);
        var data = filterCommon_1.operatorMap(filterCommon_1.operators[this.props.filterType], localizationService);
        var value = data.find(function (item) { return item.operator === _this.props.operator; }) || null;
        var defaultRendering = (React.createElement("div", { className: "k-filtercell" },
            React.createElement("div", { className: "k-filtercell-wrapper" },
                this.filterComponent(this.props.filterType, this.props.value, localizationService),
                React.createElement("div", { className: "k-filtercell-operator" },
                    this.props.filterType !== 'boolean' && (React.createElement(kendo_react_dropdowns_1.DropDownList, { value: value, onChange: this.operatorChange, className: "k-dropdown-operator", iconClassName: "k-i-filter k-icon", data: data, textField: "text", popupSettings: {
                            width: ''
                        } })),
                    React.createElement("button", { className: 
                        /* button is always visible if there is either value or operator */
                        (!(this.props.value === null || this.props.value === '') || this.props.operator) ?
                            'k-button k-button-icon k-clear-button-visible' :
                            'k-button k-button-icon', title: localizationService.toLanguageString(messages_1.filterClearButton, messages_1.messages[messages_1.filterClearButton]), type: "button", onClick: this.clear },
                        React.createElement("span", { className: "k-icon k-i-filter-clear" }))))));
        if (this.props.render) {
            return this.props.render.call(undefined, defaultRendering, this.props);
        }
        return defaultRendering;
    };
    GridFilterCell.prototype.inputChange = function (value, e) {
        filterCommon_1.cellInputChange(value, e, this.props);
    };
    GridFilterCell.prototype.operatorChange = function (event) {
        filterCommon_1.cellOperatorChange(event, this.props.value, this.props.onChange);
    };
    GridFilterCell.prototype.boolDropdownChange = function (event) {
        filterCommon_1.cellBoolDropdownChange(event, this.props.onChange);
    };
    GridFilterCell.prototype.clear = function (e) {
        e.preventDefault();
        this.props.onChange({ value: '', operator: '', syntheticEvent: e });
    };
    GridFilterCell.prototype.filterComponent = function (filterType, value, localizationService) {
        var _this = this;
        switch (filterType) {
            case 'numeric':
                return (React.createElement(kendo_react_inputs_1.NumericTextBox, { value: value, onChange: function (e) { _this.inputChange(e.value, e.syntheticEvent); } }));
            case 'date':
                return (React.createElement(kendo_react_dateinputs_1.DatePicker, { value: value, onChange: function (e) { _this.inputChange(e.value, e.syntheticEvent); } }));
            case 'boolean':
                var data = filterCommon_1.operatorMap(filterCommon_1.operators.boolean, localizationService);
                var noFilterSet_1 = function (filter) { return filter === null || filter === undefined; };
                return (React.createElement(kendo_react_dropdowns_1.DropDownList, { onChange: this.boolDropdownChange, value: data.find(function (item) { return item.operator === (noFilterSet_1(value) ? '' : value); }), data: data, textField: "text" }));
            default: return (React.createElement("input", { className: "k-textbox", value: value || '', onChange: function (e) { _this.inputChange(e.target.value, e); } }));
        }
    };
    return GridFilterCell;
}(React.Component));
exports.GridFilterCell = GridFilterCell;
kendo_react_intl_1.registerForLocalization(GridFilterCell);
//# sourceMappingURL=GridFilterCell.js.map