decentraland-ui
Version:
Decentraland's UI components and styles
46 lines (45 loc) • 2.5 kB
JavaScript
;
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ArrayFilter = void 0;
var react_1 = __importDefault(require("react"));
var classnames_1 = __importDefault(require("classnames"));
var Header_1 = require("../Header/Header");
require("./ArrayFilter.css");
var getNewValues = function (value, values) {
return values.some(function (x) { return x === value; })
? values.filter(function (x) { return x !== value; })
: __spreadArray(__spreadArray([], values, true), [value], false);
};
var ArrayFilter = function (props) {
var className = props.className, name = props.name, values = props.values, options = props.options, onChange = props.onChange;
var handleKeyDown = function (option) { return function (evt) {
if (evt.key === 'Enter') {
onChange(getNewValues(option, values));
}
}; };
var handleOnClick = function (option) { return function () {
onChange(getNewValues(option, values));
}; };
return (react_1.default.createElement("div", { className: (0, classnames_1.default)('dui-array-filter', className), "data-testid": props['data-testid'] },
name ? (react_1.default.createElement(Header_1.Header, { sub: true, className: "dui-array-filter__name", "data-testid": "array-filter-header" }, name)) : null,
react_1.default.createElement("div", { className: "dui-array-filter__options" }, options.map(function (option) {
var _a;
var isActive = values.includes(option.value);
return (react_1.default.createElement("div", { tabIndex: 0, role: "checkbox", "aria-checked": isActive, key: option.text, className: (0, classnames_1.default)('dui-array-filter__option', (_a = {},
_a['dui-array-filter__selected-option'] = isActive,
_a)), onClick: handleOnClick(option.value), onKeyDown: handleKeyDown(option.value) }, option.text));
}))));
};
exports.ArrayFilter = ArrayFilter;